@mailstep/design-system 0.6.75-beta.0 → 0.6.75

package/package.json

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

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

@@ -9,7 +9,7 @@ export declare const ItemLabel: import("styled-components").StyledComponent<"div
     $isCompact?: boolean | undefined;
     isSubitem?: boolean | undefined;
 }, never>;
-export declare const ItemDropdownArrow: import("styled-components").StyledComponent<({ icon, fill, style, size, className, secondaryColor, fixedWidth, spinning }: import("../..").IconProps) => JSX.Element, import("@xstyled/system").Theme, {
+export declare const ItemDropdownArrow: import("styled-components").StyledComponent<({ icon, fill, style, size, className, secondaryColor, fixedWidth, spinning, }: import("../..").IconProps) => JSX.Element, import("@xstyled/system").Theme, {
     $lightMode?: boolean | undefined;
 }, never>;
 export declare const TooltipItemLabel: import("styled-components").StyledComponent<"div", import("@xstyled/system").Theme, {}, never>;

package/ui/Elements/Button/styles.d.ts

@@ -3,7 +3,7 @@ export declare const StyledWrapper: import("styled-components").StyledComponent<
 export declare const LoadingIconWrapper: import("styled-components").StyledComponent<"div", import("@xstyled/system").Theme, {
     $addMarginRight: boolean;
 }, never>;
-export declare const StyledIcon: import("styled-components").StyledComponent<({ icon, fill, style, size, className, secondaryColor, fixedWidth, spinning }: import("../Icon").IconProps) => JSX.Element, import("@xstyled/system").Theme, {
+export declare const StyledIcon: import("styled-components").StyledComponent<({ icon, fill, style, size, className, secondaryColor, fixedWidth, spinning, }: import("../Icon").IconProps) => JSX.Element, import("@xstyled/system").Theme, {
     $addMarginRight?: boolean | undefined;
     $addMarginLeft?: boolean | undefined;
 }, never>;

package/ui/Elements/DatePicker/DatePicker.js

@@ -21,20 +21,20 @@ var __rest = (this && this.__rest) || function (s, e) {
     return t;
 };
 import { jsx as _jsx } from "react/jsx-runtime";
+import React, { useCallback, useContext } from 'react';
 import moment from 'moment';
+import Input from '../../Forms/Input';
+import { LanguageContext } from '../../ThemeProvider/ThemeProvider';
+import SpaceAroundWrap from '../SpaceAround';
+import DatetimePicker from './Datetime/DateTime';
+import { x } from '@xstyled/styled-components';
 // @TODO each language has 62kb gziped, please replace moment with different lib
 import 'moment/dist/locale/cs';
+import 'moment/dist/locale/el';
+import 'moment/dist/locale/it';
 import 'moment/dist/locale/ru';
 import 'moment/dist/locale/sk';
-import 'moment/dist/locale/it';
-import 'moment/dist/locale/el';
-import React, { useCallback, useContext } from 'react';
-import DatetimePicker from './Datetime/DateTime';
-import { x } from '@xstyled/styled-components';
 import { DatePickerBase } from './styles';
-import SpaceAroundWrap from '../SpaceAround';
-import Input from '../../Forms/Input';
-import { LanguageContext } from '../../ThemeProvider/ThemeProvider';
 var defaultDateFormat = 'DD.MM.YYYY';
 var DatePicker = function (_a) {
     var name = _a.name, value = _a.value, initialViewDate = _a.initialViewDate, error = _a.error, label = _a.label, disabled = _a.disabled, isValidDate = _a.isValidDate, onChange = _a.onChange, _b = _a.dateFormat, dateFormat = _b === void 0 ? defaultDateFormat : _b, _c = _a.timeFormat, timeFormat = _c === void 0 ? false : _c, open = _a.open, _d = _a.secondValue, secondValue = _d === void 0 ? null : _d, input = _a.input, _e = _a.icon, icon = _e === void 0 ? true : _e, _f = _a.showInputLabel, showInputLabel = _f === void 0 ? false : _f, _g = _a.showCalendarLabel, showCalendarLabel = _g === void 0 ? true : _g, _h = _a.spaceAround, spaceAround = _h === void 0 ? false : _h, className = _a.className, onClear = _a.onClear, onInputChange = _a.onInputChange, passProps = __rest(_a, ["name", "value", "initialViewDate", "error", "label", "disabled", "isValidDate", "onChange", "dateFormat", "timeFormat", "open", "secondValue", "input", "icon", "showInputLabel", "showCalendarLabel", "spaceAround", "className", "onClear", "onInputChange"]);
@@ -43,7 +43,7 @@ var DatePicker = function (_a) {
     var stringValue = isValid ? moment(value, format).format(format) : value;
     var locale = useContext(LanguageContext);
     var handleRenderInput = useCallback(function (_, openCalendar) {
-        return (_jsx(Input, { type: "text", icon: icon ? 'calendar' : undefined, name: name, error: error, disabled: disabled, isInvalid: !!error, onChange: onInputChange, label: showInputLabel ? label : undefined, value: stringValue, onFocus: openCalendar, iconOnClick: openCalendar, onClear: onClear }));
+        return (_jsx(Input, { type: "text", icon: icon ? 'calendar' : undefined, name: name, error: error, disabled: disabled, isInvalid: !!error, onChange: onInputChange, label: showInputLabel ? label : undefined, value: stringValue, onFocus: openCalendar, iconOnClick: openCalendar, onClear: onClear, autoComplete: "off" }));
     }, [name, stringValue, error, label, showInputLabel, isValid, disabled]);
     var handleRenderView = useCallback(function (_, renderCalendar) {
         if (label && !showInputLabel) {

package/ui/Elements/DatePicker/Datetime/components/Timepicker.js

@@ -52,6 +52,6 @@ export var Timepicker = function (_a) {
     useEffect(function () {
         !!value && setTime('minutes', minutes);
     }, [minutes]);
-    return (_jsx("td", { colSpan: 7, children: _jsx(x.div, { display: "flex", flexDirection: "column", alignItems: "flex-start", pt: "1rem", w: "fit-content", children: _jsxs(x.div, { display: "flex", alignItems: "center", children: [_jsxs(x.div, { display: "flex", flexDirection: "column", children: [_jsx(Btn, { disabled: disabled, onClick: increaseHour, children: "\u2039" }), _jsx(Btn, { disabled: disabled, onClick: decreaseHour, children: "\u203A" })] }), _jsxs(TimeWrapper, { children: [_jsx(Hours, { value: hours < 10 ? "0".concat(hours) : hours, disabled: disabled, onChange: onHoursChange }), _jsx(x.div, { mx: "7px", color: "lightGray4", children: "|" }), _jsx(Minutes, { value: minutes < 10 ? "0".concat(minutes) : minutes, disabled: disabled, onChange: onMinutesChange })] }), _jsxs(x.div, { display: "flex", flexDirection: "column", children: [_jsx(Btn, { disabled: disabled, onClick: increaseMinutes, children: "\u2039" }), _jsx(Btn, { disabled: disabled, onClick: decreaseMinutes, children: "\u203A" })] })] }) }) }));
+    return (_jsx("td", { colSpan: 7, children: _jsx(x.div, { display: "flex", flexDirection: "column", alignItems: "flex-start", pt: "1rem", w: "fit-content", children: _jsxs(x.div, { display: "flex", alignItems: "center", children: [_jsxs(x.div, { display: "flex", flexDirection: "column", children: [_jsx(Btn, { disabled: disabled, onClick: increaseHour, type: "button", children: "\u2039" }), _jsx(Btn, { disabled: disabled, onClick: decreaseHour, type: "button", children: "\u203A" })] }), _jsxs(TimeWrapper, { children: [_jsx(Hours, { value: hours < 10 ? "0".concat(hours) : hours, disabled: disabled, onChange: onHoursChange }), _jsx(x.div, { mx: "7px", color: "lightGray4", children: "|" }), _jsx(Minutes, { value: minutes < 10 ? "0".concat(minutes) : minutes, disabled: disabled, onChange: onMinutesChange })] }), _jsxs(x.div, { display: "flex", flexDirection: "column", children: [_jsx(Btn, { disabled: disabled, onClick: increaseMinutes, type: "button", children: "\u2039" }), _jsx(Btn, { disabled: disabled, onClick: decreaseMinutes, type: "button", children: "\u203A" })] })] }) }) }));
 };
 var templateObject_1, templateObject_2, templateObject_3, templateObject_4;

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

@@ -4,5 +4,5 @@ import { IconProps } from './types';
 export declare const iconDictionary: {
     [name: string]: IconDefinition | [IconDefinition, FlipProp];
 };
-declare const Icon: ({ icon, fill, style, size, className, secondaryColor, fixedWidth, spinning }: IconProps) => JSX.Element;
+declare const Icon: ({ icon, fill, style, size, className, secondaryColor, fixedWidth, spinning, }: IconProps) => JSX.Element;
 export default Icon;

package/ui/Elements/Icon/Icon.js

@@ -4,114 +4,109 @@ var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cook
 };
 import { jsx as _jsx } from "react/jsx-runtime";
 import React from 'react';
+import styled, { useTheme } from '@xstyled/styled-components';
+import { th } from '@xstyled/styled-components';
+import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
 import { library } from '@fortawesome/fontawesome-svg-core';
-import { faFacebookF } from '@fortawesome/free-brands-svg-icons/faFacebookF';
-import { faInstagram } from '@fortawesome/free-brands-svg-icons/faInstagram';
-import { faLinkedinIn } from '@fortawesome/free-brands-svg-icons/faLinkedinIn';
-import { faTwitter } from '@fortawesome/free-brands-svg-icons/faTwitter';
-import { faYoutube } from '@fortawesome/free-brands-svg-icons/faYoutube';
-import { faTriangleExclamation as fadTriangleExclamation } from '@fortawesome/pro-duotone-svg-icons/faTriangleExclamation';
 import { faCoffee as falCoffee } from '@fortawesome/pro-light-svg-icons/faCoffee';
-import { faHandHoldingBox } from '@fortawesome/pro-light-svg-icons/faHandHoldingBox';
 import { faPaperclip } from '@fortawesome/pro-light-svg-icons/faPaperclip';
 import { faStopwatch } from '@fortawesome/pro-light-svg-icons/faStopwatch';
+import { faHandHoldingBox } from '@fortawesome/pro-light-svg-icons/faHandHoldingBox';
 import { faArrowRightToBracket } from '@fortawesome/pro-regular-svg-icons/faArrowRightToBracket';
 import { faBell } from '@fortawesome/pro-regular-svg-icons/faBell';
-import { faBox as faBoxRegular } from '@fortawesome/pro-regular-svg-icons/faBox';
-import { faCalendar } from '@fortawesome/pro-regular-svg-icons/faCalendar';
-import { faCalendarPlus } from '@fortawesome/pro-regular-svg-icons/faCalendarPlus';
-import { faChevronDown } from '@fortawesome/pro-regular-svg-icons/faChevronDown';
-import { faChevronRight as farChevronRight } from '@fortawesome/pro-regular-svg-icons/faChevronRight';
-import { faChevronUp } from '@fortawesome/pro-regular-svg-icons/faChevronUp';
-import { faCircleArrowDown } from '@fortawesome/pro-regular-svg-icons/faCircleArrowDown';
-import { faCircleArrowRight } from '@fortawesome/pro-regular-svg-icons/faCircleArrowRight';
-import { faCircleQuestion } from '@fortawesome/pro-regular-svg-icons/faCircleQuestion';
-import { faClock } from '@fortawesome/pro-regular-svg-icons/faClock';
 import { faCoffee as farCoffee } from '@fortawesome/pro-regular-svg-icons/faCoffee';
 import { faCommentDots } from '@fortawesome/pro-regular-svg-icons/faCommentDots';
-import { faComments } from '@fortawesome/pro-regular-svg-icons/faComments';
 import { faCopy } from '@fortawesome/pro-regular-svg-icons/faCopy';
+import { faClock } from '@fortawesome/pro-regular-svg-icons/faClock';
+import { faChevronUp } from '@fortawesome/pro-regular-svg-icons/faChevronUp';
+import { faChevronDown } from '@fortawesome/pro-regular-svg-icons/faChevronDown';
+import { faChevronRight as farChevronRight } from '@fortawesome/pro-regular-svg-icons/faChevronRight';
 import { faEllipsisVertical } from '@fortawesome/pro-regular-svg-icons/faEllipsisVertical';
 import { faEnvelope as faEnvelopeLight } from '@fortawesome/pro-regular-svg-icons/faEnvelope';
 import { faEyeSlash } from '@fortawesome/pro-regular-svg-icons/faEyeSlash';
-import { faFaceMeh } from '@fortawesome/pro-regular-svg-icons/faFaceMeh';
 import { faFile } from '@fortawesome/pro-regular-svg-icons/faFile';
 import { faFileAlt } from '@fortawesome/pro-regular-svg-icons/faFileAlt';
-import { faFileLines } from '@fortawesome/pro-regular-svg-icons/faFileLines';
-import { faFileSearch } from '@fortawesome/pro-regular-svg-icons/faFileSearch';
-import { faFilter } from '@fortawesome/pro-regular-svg-icons/faFilter';
 import { faGear } from '@fortawesome/pro-regular-svg-icons/faGear';
-import { faHand } from '@fortawesome/pro-regular-svg-icons/faHand';
-import { faLink } from '@fortawesome/pro-regular-svg-icons/faLink';
-import { faLock } from '@fortawesome/pro-regular-svg-icons/faLock';
-import { faPenToSquare } from '@fortawesome/pro-regular-svg-icons/faPenToSquare';
 import { faShareSquare } from '@fortawesome/pro-regular-svg-icons/faShareSquare';
+import { faTriangleExclamation as farTriangleExclamation } from '@fortawesome/pro-regular-svg-icons/faTriangleExclamation';
+import { faCircleArrowDown } from '@fortawesome/pro-regular-svg-icons/faCircleArrowDown';
+import { faCircleArrowRight } from '@fortawesome/pro-regular-svg-icons/faCircleArrowRight';
+import { faPenToSquare } from '@fortawesome/pro-regular-svg-icons/faPenToSquare';
+import { faLock } from '@fortawesome/pro-regular-svg-icons/faLock';
+import { faCalendar } from '@fortawesome/pro-regular-svg-icons/faCalendar';
+import { faCalendarPlus } from '@fortawesome/pro-regular-svg-icons/faCalendarPlus';
 import { faSquareMinus } from '@fortawesome/pro-regular-svg-icons/faSquareMinus';
+import { faComments } from '@fortawesome/pro-regular-svg-icons/faComments';
+import { faFaceMeh } from '@fortawesome/pro-regular-svg-icons/faFaceMeh';
+import { faHand } from '@fortawesome/pro-regular-svg-icons/faHand';
+import { faLink } from '@fortawesome/pro-regular-svg-icons/faLink';
+import { faFileSearch } from '@fortawesome/pro-regular-svg-icons/faFileSearch';
+import { faFileLines } from '@fortawesome/pro-regular-svg-icons/faFileLines';
 import { faTrashCan } from '@fortawesome/pro-regular-svg-icons/faTrashCan';
-import { faTriangleExclamation as farTriangleExclamation } from '@fortawesome/pro-regular-svg-icons/faTriangleExclamation';
-import { faAngleLeft } from '@fortawesome/pro-solid-svg-icons/faAngleLeft';
-import { faAngleRight } from '@fortawesome/pro-solid-svg-icons/faAngleRight';
+import { faCircleQuestion } from '@fortawesome/pro-regular-svg-icons/faCircleQuestion';
+import { faFilter } from '@fortawesome/pro-regular-svg-icons/faFilter';
 import { faAnglesRight } from '@fortawesome/pro-solid-svg-icons/faAnglesRight';
-import { faArrowDownToBracket } from '@fortawesome/pro-solid-svg-icons/faArrowDownToBracket';
+import { faAngleRight } from '@fortawesome/pro-solid-svg-icons/faAngleRight';
+import { faAngleLeft } from '@fortawesome/pro-solid-svg-icons/faAngleLeft';
 import { faArrowLeft } from '@fortawesome/pro-solid-svg-icons/faArrowLeft';
-import { faArrowsRotate } from '@fortawesome/pro-solid-svg-icons/faArrowsRotate';
-import { faBadgeCheck } from '@fortawesome/pro-solid-svg-icons/faBadgeCheck';
 import { faBan } from '@fortawesome/pro-solid-svg-icons/faBan';
-import { faBox } from '@fortawesome/pro-solid-svg-icons/faBox';
-import { faBoxArchive } from '@fortawesome/pro-solid-svg-icons/faBoxArchive';
-import { faBoxCircleCheck } from '@fortawesome/pro-solid-svg-icons/faBoxCircleCheck';
 import { faBoxOpen } from '@fortawesome/pro-solid-svg-icons/faBoxOpen';
-import { faBoxesStacked } from '@fortawesome/pro-solid-svg-icons/faBoxesStacked';
-import { faUpDownLeftRight } from '@fortawesome/pro-solid-svg-icons/faUpDownLeftRight';
-import { faCamera } from '@fortawesome/pro-solid-svg-icons/faCamera';
 import { faCartArrowDown } from '@fortawesome/pro-solid-svg-icons/faCartArrowDown';
-import { faChartLine } from '@fortawesome/pro-solid-svg-icons/faChartLine';
-import { faCheck } from '@fortawesome/pro-solid-svg-icons/faCheck';
-import { faChevronDown as fasChevronDown } from '@fortawesome/pro-solid-svg-icons/faChevronDown';
-import { faChevronLeft } from '@fortawesome/pro-solid-svg-icons/faChevronLeft';
-import { faChevronRight as fasChevronRight } from '@fortawesome/pro-solid-svg-icons/faChevronRight';
-import { faChevronUp as fasChevronUp } from '@fortawesome/pro-solid-svg-icons/faChevronUp';
-import { faCircleCheck } from '@fortawesome/pro-solid-svg-icons/faCircleCheck';
-import { faCircleInfo } from '@fortawesome/pro-solid-svg-icons/faCircleInfo';
-import { faCircleXmark } from '@fortawesome/pro-solid-svg-icons/faCircleXmark';
 import { faCoffee as fasCoffee } from '@fortawesome/pro-solid-svg-icons/faCoffee';
-import { faComputerMouseScrollwheel } from '@fortawesome/pro-solid-svg-icons/faComputerMouseScrollwheel';
-import { faCrop } from '@fortawesome/pro-solid-svg-icons/faCrop';
-import { faCube } from '@fortawesome/pro-solid-svg-icons/faCube';
-import { faEquals } from '@fortawesome/pro-solid-svg-icons/faEquals';
-import { faExchange } from '@fortawesome/pro-solid-svg-icons/faExchange';
 import { faFlag } from '@fortawesome/pro-solid-svg-icons/faFlag';
-import { faGlobe } from '@fortawesome/pro-solid-svg-icons/faGlobe';
+import { faExchange } from '@fortawesome/pro-solid-svg-icons/faExchange';
+import { faEquals } from '@fortawesome/pro-solid-svg-icons/faEquals';
 import { faGreaterThanEqual } from '@fortawesome/pro-solid-svg-icons/faGreaterThanEqual';
 import { faHome } from '@fortawesome/pro-solid-svg-icons/faHome';
 import { faHouseUser } from '@fortawesome/pro-solid-svg-icons/faHouseUser';
 import { faLaptopCode } from '@fortawesome/pro-solid-svg-icons/faLaptopCode';
-import { faLessThanEqual } from '@fortawesome/pro-solid-svg-icons/faLessThanEqual';
-import { faLocationCrosshairs } from '@fortawesome/pro-solid-svg-icons/faLocationCrosshairs';
 import { faLuggageCart } from '@fortawesome/pro-solid-svg-icons/faLuggageCart';
-import { faMinus } from '@fortawesome/pro-solid-svg-icons/faMinus';
+import { faLessThanEqual } from '@fortawesome/pro-solid-svg-icons/faLessThanEqual';
 import { faNotEqual } from '@fortawesome/pro-solid-svg-icons/faNotEqual';
-import { faNoteSticky } from '@fortawesome/pro-solid-svg-icons/faNoteSticky';
 import { faPen } from '@fortawesome/pro-solid-svg-icons/faPen';
 import { faPeopleCarry as fasPeopleCarry } from '@fortawesome/pro-solid-svg-icons/faPeopleCarry';
-import { faPlus } from '@fortawesome/pro-solid-svg-icons/faPlus';
 import { faSearch } from '@fortawesome/pro-solid-svg-icons/faSearch';
-import { faShelves } from '@fortawesome/pro-solid-svg-icons/faShelves';
 import { faShippingFast } from '@fortawesome/pro-solid-svg-icons/faShippingFast';
-import { faSquareCheck } from '@fortawesome/pro-solid-svg-icons/faSquareCheck';
 import { faStore } from '@fortawesome/pro-solid-svg-icons/faStore';
 import { faTags } from '@fortawesome/pro-solid-svg-icons/faTags';
-import { faTriangleExclamation } from '@fortawesome/pro-solid-svg-icons/faTriangleExclamation';
 import { faTruck } from '@fortawesome/pro-solid-svg-icons/faTruck';
-import { faTruckRampBox } from '@fortawesome/pro-solid-svg-icons/faTruckRampBox';
 import { faUser } from '@fortawesome/pro-solid-svg-icons/faUser';
 import { faUsersGear } from '@fortawesome/pro-solid-svg-icons/faUsersGear';
 import { faWatch } from '@fortawesome/pro-solid-svg-icons/faWatch';
-import { faWebhook } from '@fortawesome/pro-solid-svg-icons/faWebhook';
+import { faChartLine } from '@fortawesome/pro-solid-svg-icons/faChartLine';
+import { faCheck } from '@fortawesome/pro-solid-svg-icons/faCheck';
+import { faSquareCheck } from '@fortawesome/pro-solid-svg-icons/faSquareCheck';
 import { faXmark as fasXmark } from '@fortawesome/pro-solid-svg-icons/faXmark';
-import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
-import styled, { useTheme } from '@xstyled/styled-components';
-import { th } from '@xstyled/styled-components';
+import { faChevronLeft } from '@fortawesome/pro-solid-svg-icons/faChevronLeft';
+import { faNoteSticky } from '@fortawesome/pro-solid-svg-icons/faNoteSticky';
+import { faArrowDownToBracket } from '@fortawesome/pro-solid-svg-icons/faArrowDownToBracket';
+import { faPlus } from '@fortawesome/pro-solid-svg-icons/faPlus';
+import { faMinus } from '@fortawesome/pro-solid-svg-icons/faMinus';
+import { faChevronRight as fasChevronRight } from '@fortawesome/pro-solid-svg-icons/faChevronRight';
+import { faChevronDown as fasChevronDown } from '@fortawesome/pro-solid-svg-icons/faChevronDown';
+import { faChevronUp as fasChevronUp } from '@fortawesome/pro-solid-svg-icons/faChevronUp';
+import { faCircleInfo } from '@fortawesome/pro-solid-svg-icons/faCircleInfo';
+import { faCube } from '@fortawesome/pro-solid-svg-icons/faCube';
+import { faBoxArchive } from '@fortawesome/pro-solid-svg-icons/faBoxArchive';
+import { faLocationCrosshairs } from '@fortawesome/pro-solid-svg-icons/faLocationCrosshairs';
+import { faTruckRampBox } from '@fortawesome/pro-solid-svg-icons/faTruckRampBox';
+import { faGlobe } from '@fortawesome/pro-solid-svg-icons/faGlobe';
+import { faCircleCheck } from '@fortawesome/pro-solid-svg-icons/faCircleCheck';
+import { faCircleXmark } from '@fortawesome/pro-solid-svg-icons/faCircleXmark';
+import { faTriangleExclamation } from '@fortawesome/pro-solid-svg-icons/faTriangleExclamation';
+import { faBadgeCheck } from '@fortawesome/pro-solid-svg-icons/faBadgeCheck';
+import { faWebhook } from '@fortawesome/pro-solid-svg-icons/faWebhook';
+import { faTriangleExclamation as fadTriangleExclamation } from '@fortawesome/pro-duotone-svg-icons/faTriangleExclamation';
+import { faFacebookF } from '@fortawesome/free-brands-svg-icons/faFacebookF';
+import { faTwitter } from '@fortawesome/free-brands-svg-icons/faTwitter';
+import { faYoutube } from '@fortawesome/free-brands-svg-icons/faYoutube';
+import { faLinkedinIn } from '@fortawesome/free-brands-svg-icons/faLinkedinIn';
+import { faInstagram } from '@fortawesome/free-brands-svg-icons/faInstagram';
+import { faBox } from '@fortawesome/pro-solid-svg-icons/faBox';
+import { faBox as faBoxRegular } from '@fortawesome/pro-regular-svg-icons/faBox';
+import { faBoxCircleCheck } from '@fortawesome/pro-solid-svg-icons/faBoxCircleCheck';
+import { faShelves } from '@fortawesome/pro-solid-svg-icons/faShelves';
+import { faBoxesStacked } from '@fortawesome/pro-solid-svg-icons/faBoxesStacked';
 export var iconDictionary = {
     greaterThan: faAngleRight,
     startsWith: faAnglesRight,
@@ -121,8 +116,6 @@ export var iconDictionary = {
     edit: faPenToSquare,
     avatar: faUser,
     arrowLeft: faArrowLeft,
-    arrowsRotate: faArrowsRotate,
-    upDownLeftRight: faUpDownLeftRight,
     attachment: faPaperclip,
     dashboard: faChartLine,
     chevronUp: faChevronUp,
@@ -130,7 +123,6 @@ export var iconDictionary = {
     chevronRight: farChevronRight,
     clock: faClock,
     complaint: faFileAlt,
-    computerMouseScrollwheel: faComputerMouseScrollwheel,
     mailLight: faEnvelopeLight,
     eshop: faStore,
     expedition: faShippingFast,
@@ -171,8 +163,6 @@ export var iconDictionary = {
     import: faCircleArrowDown,
     export: faCircleArrowRight,
     check: faCheck,
-    camera: faCamera,
-    crop: faCrop,
     squareCheck: faSquareCheck,
     squareMinus: faSquareMinus,
     goLeft: faChevronLeft,
@@ -226,7 +216,7 @@ library.add(farCoffee, fasCoffee, falCoffee, faHandHoldingBox, faLuggageCart, fa
 var iconPrefixMap = {
     normal: 'far',
     light: 'fal',
-    solid: 'fas'
+    solid: 'fas',
 };
 var FaIconSizing = styled.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  ", "\n  --fa-secondary-color: ", ";\n  --fa-secondary-opacity: 1;\n  display: ", ";\n"], ["\n  ", "\n  --fa-secondary-color: ", ";\n  --fa-secondary-opacity: 1;\n  display: ", ";\n"])), function (_a) {
     var size = _a.size;

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

@@ -2,7 +2,7 @@
 import type { StoryObj } from '@storybook/react';
 declare const meta: {
     title: string;
-    component: ({ icon, fill, style, size, className, secondaryColor, fixedWidth, spinning }: import("../types").IconProps) => JSX.Element;
+    component: ({ icon, fill, style, size, className, secondaryColor, fixedWidth, spinning, }: import("../types").IconProps) => JSX.Element;
     tags: string[];
     argTypes: {};
 };

package/ui/Elements/Pagination/styled.d.ts

@@ -3,10 +3,10 @@ export declare const Wrapper: import("styled-components").StyledComponent<(props
 export declare const Btn: import("styled-components").StyledComponent<"button", import("@xstyled/system").Theme, {
     disabled: boolean;
 }, never>;
-export declare const ArrowIcon: import("styled-components").StyledComponent<({ icon, fill, style, size, className, secondaryColor, fixedWidth, spinning }: import("../Icon").IconProps) => JSX.Element, import("@xstyled/system").Theme, {
+export declare const ArrowIcon: import("styled-components").StyledComponent<({ icon, fill, style, size, className, secondaryColor, fixedWidth, spinning, }: import("../Icon").IconProps) => JSX.Element, import("@xstyled/system").Theme, {
     isActive: boolean;
 }, never>;
-export declare const GoIcon: import("styled-components").StyledComponent<({ icon, fill, style, size, className, secondaryColor, fixedWidth, spinning }: import("../Icon").IconProps) => JSX.Element, import("@xstyled/system").Theme, {
+export declare const GoIcon: import("styled-components").StyledComponent<({ icon, fill, style, size, className, secondaryColor, fixedWidth, spinning, }: import("../Icon").IconProps) => JSX.Element, import("@xstyled/system").Theme, {
     isActive: boolean;
 }, never>;
 export declare const DotsWrapper: import("styled-components").StyledComponent<"div", import("@xstyled/system").Theme, {}, never>;

package/ui/Elements/SingleSelect/SingleSelect.d.ts

@@ -1,7 +1,7 @@
 import { SelectProps, Option } from '../Select/types';
 type FieldValueType = string | number | (string | number)[] | null;
 export type Props = Omit<SelectProps, 'onChange' | 'loadOptions'> & {
-    onChange: (event: {
+    onChange?: (event: {
         target: {
             [key: string]: FieldValueType;
         };

package/ui/Elements/SingleSelect/SingleSelect.js

@@ -56,11 +56,11 @@ var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
 };
 import { jsx as _jsx } from "react/jsx-runtime";
 import { useCallback, useEffect, useMemo, useState } from 'react';
+import { nanoid } from 'nanoid';
 import { createFilter } from 'react-select';
 import Select from '../Select';
-import omit from 'lodash/fp/omit';
-import { nanoid } from 'nanoid';
 import { i18n } from '@lingui/core';
+import omit from 'lodash/fp/omit';
 var CREATE = "_create_".concat(nanoid(), "_");
 var defaultFilterOption = createFilter();
 var creatableFilterOption = function (option, rawInput) {
@@ -88,7 +88,7 @@ var SingleSelect = function (props) {
         return loadOptions && inputValue.length < asyncLoadMinChars
             ? i18n._({
                 id: 'components.dropdown.writeMoreChars',
-                message: 'Write at least ${asyncLoadMinChars} characters.',
+                message: 'Write at least ${asyncLoadMinChars} characters.'
             })
             : i18n._({ id: 'components.dropdown.noOptions', message: 'No options' });
     }, [loadOptions, asyncLoadMinChars]);
@@ -100,8 +100,8 @@ var SingleSelect = function (props) {
                 {
                     value: CREATE,
                     label: "".concat(inputValue, " (").concat(i18n._({ id: 'components.dropdown.newOption', message: 'new value' }), ")"),
-                    inputValue: inputValue,
-                },
+                    inputValue: inputValue
+                }
             ], false));
         }
         else if (!loadOptions || inputValue.length < asyncLoadMinChars) {
@@ -159,8 +159,8 @@ var SingleSelect = function (props) {
                             target: {
                                 name: name !== null && name !== void 0 ? name : '',
                                 type: 'change',
-                                value: value,
-                            },
+                                value: value
+                            }
                         });
                     }
                     if (onValueChange) {
@@ -176,8 +176,8 @@ var SingleSelect = function (props) {
                 target: {
                     name: name,
                     type: 'blur',
-                    value: getOptionValue(option),
-                },
+                    value: getOptionValue(option)
+                }
             });
         }
     }, [name, onBlur]);

package/ui/Forms/Checkbox/styles.d.ts

@@ -2,7 +2,7 @@
 export declare const FakeInput: import("styled-components").StyledComponent<"div", import("@xstyled/system").Theme, {
     size: string | number;
 }, never>;
-export declare const CheckIcon: import("styled-components").StyledComponent<({ icon, fill, style, size, className, secondaryColor, fixedWidth, spinning }: import("../../Elements/Icon").IconProps) => JSX.Element, import("@xstyled/system").Theme, {
+export declare const CheckIcon: import("styled-components").StyledComponent<({ icon, fill, style, size, className, secondaryColor, fixedWidth, spinning, }: import("../../Elements/Icon").IconProps) => JSX.Element, import("@xstyled/system").Theme, {
     size: string | number;
 }, never>;
 export declare const CheckboxWrap: import("styled-components").StyledComponent<"div", import("@xstyled/system").Theme, {