@mailstep/design-system 0.13.6 → 0.13.8

package/README.md

@@ -74,3 +74,4 @@ There are Elements, Blocks and Forms components. Also you can use ThemeProvider
 |----------|:-------------:|------:|
 | Theme Provider |  TBD | [More info](ui/ThemeProvider/README.md) |
 
+.

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mailstep/design-system",
-  "version": "0.13.6",
+  "version": "0.13.8",
   "license": "ISC",
   "type": "module",
   "main": "./ui/index.js",
@@ -20,7 +20,7 @@
     "deploy:win": "npm run build:win && npm publish ./build",
     "dev": "yarn storybook",
     "test": "echo \"The tests are still waiting to be written, but it seems like they're really good at procrastinating!\"",
-    "lint": "eslint ./packages/ui/**/*.{ts,tsx}",
+    "lint": "eslint './packages/ui/**/*.{ts,tsx}'",
     "prepare": "husky"
   },
   "lint-staged": {
@@ -45,6 +45,7 @@
     "@nivo/legends": "^0.73.0",
     "@nivo/pie": "^0.73.0",
     "@popperjs/core": "^2.11.8",
+    "@storybook-community/storybook-dark-mode": "7.1.4",
     "@storybook/addon-designs": "^11.1.4",
     "@storybook/addon-docs": "10.6.0",
     "@storybook/addon-links": "10.6.0",

package/ui/Blocks/Modal/Modal.js

@@ -41,7 +41,6 @@ const Modal = memo(({ children, isShown = true, onExtraAction, onCancel, title,
 			style: dialogStyle,
 			$backgroundColor: background,
 			top,
-			"data-cy": "dialogWindow",
 			onClick: closeEverywhere ? closeDialog : void 0,
 			$minWidth: minWidth,
 			$minHeight: minHeight,
@@ -72,7 +71,6 @@ const Modal = memo(({ children, isShown = true, onExtraAction, onCancel, title,
 				}),
 				withCloseIcon && /* @__PURE__ */ jsx(CloseButton, {
 					onClick: closeDialog,
-					"data-cy": "dialogCloseBtn",
 					children: /* @__PURE__ */ jsx(Cancel, {
 						width: "11px",
 						height: "11px"
@@ -88,7 +86,6 @@ const Modal = memo(({ children, isShown = true, onExtraAction, onCancel, title,
 						type: "button",
 						onClick: onExtraAction,
 						isLoading,
-						"data-cy": "extraActionBtn",
 						appearance: "secondary",
 						variant: "ghost",
 						children: extraActionLabel
@@ -99,7 +96,6 @@ const Modal = memo(({ children, isShown = true, onExtraAction, onCancel, title,
 							type: "button",
 							onClick: onCancel,
 							isLoading,
-							"data-cy": "cancelBtn",
 							appearance: "secondary",
 							variant: "default",
 							"data-testid": name ? `button-${name}-cancel` : void 0,
@@ -109,7 +105,6 @@ const Modal = memo(({ children, isShown = true, onExtraAction, onCancel, title,
 							onClick: onDialogConfirmClick,
 							isLoading,
 							disabled: isConfirmDisabled,
-							"data-cy": "submitBtn",
 							appearance: "primary",
 							variant: "default",
 							"data-testid": name ? `button-${name}-confirm` : void 0,

package/ui/Blocks/SideMenu/MenuItem.js

@@ -1,6 +1,6 @@
 import Icon from "../../Elements/Icon/Icon.js";
 import { Paragraph3, Paragraph5 } from "../../Elements/Typography/Typography.js";
-import { ItemDropdownArrow, ItemIcon, ItemLabel, ItemLinkWrap, ItemsSeparator, MenuItemContainer, OverflowWithEllipsis, SubItemsWrap } from "./styles.js";
+import { ItemCount, ItemDropdownArrow, ItemIcon, ItemLabel, ItemLinkWrap, ItemsSeparator, MenuItemContainer, OverflowWithEllipsis, SubItemsWrap } from "./styles.js";
 import SubitemTooltip from "./components/SubitemTooltip.js";
 import { useLeftMenuContext } from "./context/useLeftMenuContext.js";
 import useOutSideHover from "./hooks/useOutsideHover.js";
@@ -9,7 +9,7 @@ import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 import { matchPath } from "react-router";
 //#region packages/ui/Blocks/SideMenu/MenuItem.tsx
 const removeOptionalEnd = /\?$/;
-const MenuItem = ({ icon, title, link = "", items, id, isSubitem, isCompact, lightMode = false, separator = false, isLeftMenuOpen, onCloseLeftMenu, onClick }) => {
+const MenuItem = ({ icon, title, link = "", items, id, count, isSubitem, isCompact, lightMode = false, separator = false, isLeftMenuOpen, onCloseLeftMenu, onClick }) => {
 	const hasChildren = items && items?.length > 0;
 	const { expandedItem, expandItem } = useLeftMenuContext();
 	const isExpanded = expandedItem === id;
@@ -61,6 +61,8 @@ const MenuItem = ({ icon, title, link = "", items, id, isSubitem, isCompact, lig
 				$isCompact: isCompact,
 				className: itemLinkWrapClassName,
 				$lightMode: lightMode,
+				$isHovering: isHovering,
+				"data-testid": id ? `menu-item-${id}` : void 0,
 				as: link ? void 0 : "a",
 				...link ? {
 					exact: true,
@@ -70,20 +72,27 @@ const MenuItem = ({ icon, title, link = "", items, id, isSubitem, isCompact, lig
 				children: [/* @__PURE__ */ jsxs(ItemLabel, {
 					$isCompact: isCompact,
 					isSubitem,
-					children: [!isSubitem && icon && /* @__PURE__ */ jsx(ItemIcon, {
-						className: "mainIcon",
-						$isCompact: isCompact,
-						children: typeof icon === "string" ? /* @__PURE__ */ jsx(Icon, {
-							icon,
-							fill: "none"
-						}) : icon
-					}), /* @__PURE__ */ jsx(Title, {
-						variant: "semiBold",
-						mt: 0,
-						mb: 0,
-						textAlign: isCompact ? "center" : "left",
-						children: /* @__PURE__ */ jsx(OverflowWithEllipsis, { children: title })
-					})]
+					children: [
+						!isSubitem && icon && /* @__PURE__ */ jsx(ItemIcon, {
+							className: "mainIcon",
+							$isCompact: isCompact,
+							children: typeof icon === "string" ? /* @__PURE__ */ jsx(Icon, {
+								icon,
+								fill: "none"
+							}) : icon
+						}),
+						/* @__PURE__ */ jsx(Title, {
+							variant: "semiBold",
+							mt: 0,
+							mb: 0,
+							textAlign: isCompact ? "center" : "left",
+							children: /* @__PURE__ */ jsx(OverflowWithEllipsis, { children: title })
+						}),
+						!!count && /* @__PURE__ */ jsx(ItemCount, {
+							$isCompact: isCompact,
+							children: count
+						})
+					]
 				}), !isCompact && hasChildren && /* @__PURE__ */ jsx(ItemDropdownArrow, {
 					icon: "goDown",
 					$lightMode: lightMode

package/ui/Blocks/SideMenu/SideMenu.js

@@ -1,4 +1,5 @@
 import { useClickOutside } from "../Modal/hooks/useClickOutside.js";
+import { HamburgerMenuButton } from "./components/HamburgerMenu.js";
 import MenuFooter from "./components/Footer.js";
 import { LeftMenuProvider } from "./context/LeftMenuContext.js";
 import { BodyWrap, Container, Overlay, ScrollWrap, TopLevelWrap } from "./styles.js";
@@ -6,7 +7,7 @@ import MenuItem_default from "./MenuItem.js";
 import "react";
 import { jsx, jsxs } from "react/jsx-runtime";
 //#region packages/ui/Blocks/SideMenu/SideMenu.tsx
-const SideMenu = ({ menuItems, isCompact, setIsCompact, isLeftMenuOpen, isAlwaysVisible, onCloseLeftMenu, variant = "dark", children }) => {
+const SideMenu = ({ menuItems, isCompact, setIsCompact, isLeftMenuOpen, isAlwaysVisible, onCloseLeftMenu, showHamburgerMenu = false, variant = "dark", children }) => {
 	const lightMode = variant === "light";
 	return /* @__PURE__ */ jsx(LeftMenuProvider, { children: /* @__PURE__ */ jsxs(Container, {
 		isLeftMenuOpen,
@@ -16,21 +17,28 @@ const SideMenu = ({ menuItems, isCompact, setIsCompact, isLeftMenuOpen, isAlways
 			isLeftMenuOpen,
 			ref: useClickOutside({ onClose: onCloseLeftMenu }),
 			lightMode,
-			children: [/* @__PURE__ */ jsx(ScrollWrap, { children: /* @__PURE__ */ jsxs(BodyWrap, {
-				isCompact,
-				children: [menuItems.map((item, index) => /* @__PURE__ */ jsx(MenuItem_default, {
-					isCompact,
+			children: [
+				showHamburgerMenu && /* @__PURE__ */ jsx(HamburgerMenuButton, {
 					isLeftMenuOpen,
-					onCloseLeftMenu,
-					lightMode,
-					separator: !!item.separator,
-					...item
-				}, `${item.id ?? item.title}-${index}`)), children]
-			}) }), /* @__PURE__ */ jsx(MenuFooter, {
-				isCompact,
-				setIsCompact,
-				lightMode
-			})]
+					onClick: onCloseLeftMenu
+				}),
+				/* @__PURE__ */ jsx(ScrollWrap, { children: /* @__PURE__ */ jsxs(BodyWrap, {
+					isCompact,
+					children: [menuItems.map((item, index) => /* @__PURE__ */ jsx(MenuItem_default, {
+						isCompact,
+						isLeftMenuOpen,
+						onCloseLeftMenu,
+						lightMode,
+						separator: !!item.separator,
+						...item
+					}, `${item.id ?? item.title}-${index}`)), children]
+				}) }),
+				/* @__PURE__ */ jsx(MenuFooter, {
+					isCompact,
+					setIsCompact,
+					lightMode
+				})
+			]
 		}), /* @__PURE__ */ jsx(Overlay, {})]
 	}) });
 };

package/ui/Blocks/SideMenu/components/HamburgerMenu.d.ts

@@ -1,6 +1,8 @@
+import React from 'react';
 type Props = {
     isLeftMenuOpen?: boolean;
     onClick?: () => void;
+    mr?: string;
 };
-export declare const HamburgerMenuButton: ({ isLeftMenuOpen, onClick }: Props) => import("react/jsx-runtime").JSX.Element;
+export declare const HamburgerMenuButton: ({ isLeftMenuOpen, onClick, mr }: Props) => React.ReactElement;
 export {};

package/ui/Blocks/SideMenu/components/HamburgerMenu.js

@@ -35,11 +35,11 @@ const HamburgerMenuWrapper = styled$2(x.div)`
     display: none;
   }
 `;
-const HamburgerMenuButton = ({ isLeftMenuOpen, onClick }) => {
+const HamburgerMenuButton = ({ isLeftMenuOpen, onClick, mr = "8px" }) => {
 	const theme = useTheme();
-	const neutralColor = th$1.color("neutral20")({ theme });
+	const neutralColor = th$1.color("bgLightGray2")({ theme });
 	return /* @__PURE__ */ jsx(HamburgerMenuWrapper, {
-		mr: "8px",
+		mr,
 		onClick,
 		isLeftMenuOpen: !!isLeftMenuOpen,
 		children: isLeftMenuOpen ? /* @__PURE__ */ jsx(MobileCancel, { fill: neutralColor }) : /* @__PURE__ */ jsx(HamburgerMenu, {

package/ui/Blocks/SideMenu/components/SubitemTooltip.js

@@ -1,12 +1,12 @@
 import { H6 } from "../../../Elements/Typography/Typography.js";
 import { Portal } from "../../../Elements/Portal/index.js";
-import { ItemLinkWrap, TooltipItemLabel, TooltipWrap } from "../styles.js";
+import { ItemCount, ItemLinkWrap, TooltipItemLabel, TooltipWrap } from "../styles.js";
 import { useMemo } from "react";
-import { jsx } from "react/jsx-runtime";
+import { jsx, jsxs } from "react/jsx-runtime";
 import styled from "styled-components";
 import { Popper } from "react-popper";
 //#region packages/ui/Blocks/SideMenu/components/SubitemTooltip.tsx
-const TooltipItem = ({ title, link = "", lightMode }) => {
+const TooltipItem = ({ title, link = "", lightMode, count }) => {
 	return /* @__PURE__ */ jsx(ItemLinkWrap, {
 		...useMemo(() => {
 			return link.startsWith("https://") ? {
@@ -16,14 +16,14 @@ const TooltipItem = ({ title, link = "", lightMode }) => {
 		}, [link]),
 		exact: true,
 		$lightMode: lightMode,
-		children: /* @__PURE__ */ jsx(TooltipItemLabel, { children: /* @__PURE__ */ jsx(H6, {
+		children: /* @__PURE__ */ jsxs(TooltipItemLabel, { children: [/* @__PURE__ */ jsx(H6, {
 			variant: "medium",
 			children: title
-		}) })
+		}), !!count && /* @__PURE__ */ jsx(ItemCount, { children: count })] })
 	});
 };
 const PopoverWrapper = styled.div`
-  z-index: 5;
+  z-index: 31;
   display: ${({ isLeftMenuOpen }) => isLeftMenuOpen ? "block" : "none"};
   @media (min-width: 1024px) {
     display: block;

package/ui/Blocks/SideMenu/stories/menuItems.d.ts

@@ -4,6 +4,7 @@ export declare const menuItems: ({
     link: string;
     id: string;
     items?: undefined;
+    count?: undefined;
 } | {
     title: string;
     icon: import("react/jsx-runtime").JSX.Element;
@@ -14,4 +15,22 @@ export declare const menuItems: ({
         link: string;
         id: string;
     }[];
+    count?: undefined;
+} | {
+    title: string;
+    icon: import("react/jsx-runtime").JSX.Element;
+    link: string;
+    id: string;
+    count: number;
+    items: ({
+        title: string;
+        link: string;
+        id: string;
+        count?: undefined;
+    } | {
+        title: string;
+        link: string;
+        id: string;
+        count: number;
+    })[];
 })[];

package/ui/Blocks/SideMenu/stories/menuItems.js

@@ -53,6 +53,7 @@ const menuItems = [
 		icon: /* @__PURE__ */ jsx(Expeditions, {}),
 		link: "/expeditions",
 		id: "expeditions",
+		count: 3,
 		items: [
 			{
 				title: "Expeditions",
@@ -62,7 +63,8 @@ const menuItems = [
 			{
 				title: "Outbound receipts",
 				link: "/expeditions/outbound-receipts",
-				id: "outboundReceipts"
+				id: "outboundReceipts",
+				count: 3
 			},
 			{
 				title: "Missing goods",

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

@@ -16,6 +16,7 @@ export declare const TooltipItemLabel: import("styled-components").StyledCompone
 export declare const ItemLinkWrap: import("styled-components").StyledComponent<typeof NavLink, import("@xstyled/styled-components").Theme, {
     $isCompact?: boolean;
     $lightMode?: boolean;
+    $isHovering?: boolean;
     appearance?: "gray" | "default";
 }, never>;
 export declare const MenuItemContainer: import("styled-components").StyledComponent<"div", import("@xstyled/styled-components").Theme, {
@@ -41,3 +42,6 @@ export declare const BodyWrap: import("styled-components").StyledComponent<"div"
     isCompact: boolean;
 }, never>;
 export declare const Overlay: import("styled-components").StyledComponent<"div", import("@xstyled/styled-components").Theme, {}, never>;
+export declare const ItemCount: import("styled-components").StyledComponent<"span", import("@xstyled/styled-components").Theme, {
+    $isCompact?: boolean;
+}, never>;

package/ui/Blocks/SideMenu/styles.js

@@ -67,6 +67,8 @@ const ItemDropdownArrow = styled$1(Icon)`
 const TooltipItemLabel = styled$1.div`
   line-height: 1.5;
   letter-spacing: 0.4px;
+  display: flex;
+  align-items: center;
 `;
 const ItemLinkWrap = styled$1(NavLink)`
   display: flex;
@@ -78,14 +80,17 @@ const ItemLinkWrap = styled$1(NavLink)`
   font-weight: 600;
   letter-spacing: 0.4px;
   position: relative;
-  color: ${({ $lightMode }) => $lightMode ? th$1.color("typoPrimary") : th$1.color("lightGray5")};
+  color: ${({ $lightMode, $isHovering }) => {
+	if ($lightMode) return th$1.color("typoPrimary");
+	if ($isHovering) return "white";
+	return th$1.color("lightGray5");
+}};
   transition: moving 0.2s cubic-bezier(0.25, 0.8, 0.25, 1);
   transition-property: transform;
 
   &.toplevel {
     margin: ${({ $isCompact }) => $isCompact ? "0 0 12px 0" : "16px 0"};
     padding: ${({ $isCompact }) => $isCompact ? "10px 14px 6px 13px" : "9px 10px"};
-    gap: ${({ $isCompact }) => $isCompact ? "none" : "30px"};
     justify-content: ${({ $isCompact }) => $isCompact ? "center" : "space-between"};
     &.active {
       color: ${({ $lightMode }) => $lightMode ? th$1("colors.red1") : "white"};
@@ -130,7 +135,7 @@ const MenuItemContainer = styled$1.div`
    z-index: 1;
    stroke: ${({ $lightMode }) => $lightMode ? th$1.color("blue2") : void 0};
    .selected > ${ItemLabel}, .active > ${ItemLabel} {
-     color: ${({ $lightMode }) => $lightMode ? th$1.color("red1") : th$1.color("white")};
+     color: ${({ $lightMode }) => $lightMode ? th$1.color("red1") : th$1.color("sideMenuSelectedText")};
      stroke: ${({ $lightMode }) => $lightMode ? th$1.color("red1") : th$1.color("blue2")};
    }
 
@@ -259,9 +264,10 @@ const OverflowWithEllipsis = styled$1.span`
   max-width: 140px;
   overflow: hidden;
   text-overflow: ellipsis;
+  white-space: nowrap;
 `;
 const TopLevelWrap = styled$1.div`
-  background-color: ${({ lightMode }) => lightMode ? "white" : th$1("colors.blue3")};
+  background-color: ${({ lightMode }) => lightMode ? "white" : th$1("colors.sideMenuBackground")};
   border-right: 1px solid ${th$1("colors.lightGray6")};
   height: -webkit-fill-available;
   transition: width 0.5s ease;
@@ -306,5 +312,28 @@ const Overlay = styled$1.div`
     display: none;
   }
 `;
+const ItemCount = styled$1.span`
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  flex-shrink: 0;
+  min-width: 20px;
+  height: 18px;
+  padding: 0 5px;
+  border-radius: 9px;
+  background-color: #ffffff;
+  color: ${th$1.color("red1")};
+  font-size: 12px;
+  line-height: 18px;
+  font-weight: 600;
+  margin-left: 8px;
+
+  ${({ $isCompact }) => $isCompact && css`
+      position: absolute;
+      top: 0;
+      right: 2px;
+      margin-left: 0;
+    `}
+`;
 //#endregion
-export { BodyWrap, Container, ItemDropdownArrow, ItemIcon, ItemLabel, ItemLinkWrap, ItemsSeparator, MenuItemContainer, OverflowWithEllipsis, Overlay, ScrollWrap, SubItemsWrap, TooltipItemLabel, TooltipWrap, TopLevelWrap };
+export { BodyWrap, Container, ItemCount, ItemDropdownArrow, ItemIcon, ItemLabel, ItemLinkWrap, ItemsSeparator, MenuItemContainer, OverflowWithEllipsis, Overlay, ScrollWrap, SubItemsWrap, TooltipItemLabel, TooltipWrap, TopLevelWrap };

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

@@ -10,6 +10,7 @@ export type MenuItemType = {
     lightMode?: boolean;
     separator?: boolean;
     appearance?: 'gray' | 'default';
+    count?: number;
 };
 export type SideMenuProps = {
     menuItems: MenuItemType[];
@@ -18,6 +19,7 @@ export type SideMenuProps = {
     isLeftMenuOpen?: boolean;
     isAlwaysVisible?: boolean;
     onCloseLeftMenu?: () => void;
+    showHamburgerMenu?: boolean;
     variant?: 'dark' | 'light';
     children?: ReactNode;
 };

package/ui/Elements/DropdownMenu/components/MenuItem.js

@@ -37,7 +37,7 @@ const StyledLink = styled$1(Link)`
 `}
 `;
 const MenuItem = ({ item, ItemComponent, onClose }) => {
-	const { onClick, link, hasSeparator, name, autoClose, disabled } = item;
+	const { onClick, link, hasSeparator, autoClose, disabled } = item;
 	const isActive = link === useLocation().pathname;
 	const onClickCallback = useCallback((e) => {
 		if (disabled) {
@@ -63,7 +63,6 @@ const MenuItem = ({ item, ItemComponent, onClose }) => {
 		$disabled: !!disabled,
 		onClick: onClickCallback,
 		$hasSeparator: !!hasSeparator,
-		"data-cy": name,
 		size: "inherit",
 		children: /* @__PURE__ */ jsx(ItemComponent, { ...item })
 	});

package/ui/Elements/DropdownSelect/DropdownSelect.js

@@ -99,7 +99,6 @@ const DropdownSelect = ({ label, appearance, variant, options, showChevron, onSe
 			variant: variant || "default",
 			onClick: toggleDropdownMenu,
 			disabled,
-			"data-cy": "createProductDropdownMenuBtn",
 			children: /* @__PURE__ */ jsxs(ContentWrapper, { children: [
 				icon && /* @__PURE__ */ jsx(CustomIconWrap, { children: icon }),
 				/* @__PURE__ */ jsx("span", { children: label }),

package/ui/Elements/HighlightBox/HighlightBox.d.ts

@@ -48,7 +48,6 @@ type HighlightBoxType = {
     size?: 'default' | 'small' | 'wide' | 'fitContent';
     className?: string;
     cursor?: string;
-    prefix?: string;
 };
 declare const HighlightBox: React.FC<HighlightBoxType>;
 export default HighlightBox;

package/ui/Elements/HighlightBox/HighlightBox.js

@@ -88,12 +88,11 @@ const flagAppearanceToFontColorMap = {
 	redBold: "#ffffff",
 	redSubtle: "red80"
 };
-const HighlightBox = ({ children, appearance, size = "default", cursor, className, prefix }) => {
+const HighlightBox = ({ children, appearance, size = "default", cursor, className }) => {
 	const theme = useTheme();
 	return /* @__PURE__ */ jsx(StyledHighlightBox, {
 		$bgcolor: th$1.color(appearance ? flagAppearanceToColorMap[appearance] : "transparent")({ theme }),
 		$fontColor: th$1.color(appearance ? flagAppearanceToFontColorMap[appearance] : "typoPrimary")({ theme }),
-		"data-cy": prefix ? `${prefix}Label` : "label",
 		$cursor: cursor,
 		children: /* @__PURE__ */ jsx(OverflowWrap, {
 			className: size + " " + (className || ""),

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

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

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

@@ -0,0 +1,22 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+//#region packages/ui/Elements/Icon/icons/CompactRigidGoods.tsx
+const CompactRigidGoods = (props) => /* @__PURE__ */ jsxs("svg", {
+	width: "24",
+	height: "24",
+	viewBox: "0 0 24 24",
+	fill: "none",
+	stroke: "currentColor",
+	strokeWidth: "1.5",
+	strokeLinecap: "round",
+	strokeLinejoin: "round",
+	xmlns: "http://www.w3.org/2000/svg",
+	...props,
+	children: [
+		/* @__PURE__ */ jsx("path", { d: "M21 8 12 3 3 8v8l9 5 9-5V8Z" }),
+		/* @__PURE__ */ jsx("path", { d: "m3 8 9 5 9-5" }),
+		/* @__PURE__ */ jsx("path", { d: "M12 13v8" }),
+		/* @__PURE__ */ jsx("path", { d: "m7.5 5.5 9 5" })
+	]
+});
+//#endregion
+export { CompactRigidGoods };

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

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

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

@@ -0,0 +1,17 @@
+import { jsx } from "react/jsx-runtime";
+//#region packages/ui/Elements/Icon/icons/CompressibleGoods.tsx
+const CompressibleGoods = (props) => /* @__PURE__ */ jsx("svg", {
+	width: "24",
+	height: "24",
+	viewBox: "0 0 24 24",
+	fill: "none",
+	stroke: "currentColor",
+	strokeWidth: "1.5",
+	strokeLinecap: "round",
+	strokeLinejoin: "round",
+	xmlns: "http://www.w3.org/2000/svg",
+	...props,
+	children: /* @__PURE__ */ jsx("path", { d: "M7 19h10.5a4.5 4.5 0 0 0 .6-8.96A6 6 0 0 0 6.6 9.1 5 5 0 0 0 7 19Z" })
+});
+//#endregion
+export { CompressibleGoods };

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

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

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

@@ -0,0 +1,21 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+//#region packages/ui/Elements/Icon/icons/FlatRigidGoods.tsx
+const FlatRigidGoods = (props) => /* @__PURE__ */ jsxs("svg", {
+	width: "24",
+	height: "24",
+	viewBox: "0 0 24 24",
+	fill: "none",
+	stroke: "currentColor",
+	strokeWidth: "1.5",
+	strokeLinecap: "round",
+	strokeLinejoin: "round",
+	xmlns: "http://www.w3.org/2000/svg",
+	...props,
+	children: [
+		/* @__PURE__ */ jsx("path", { d: "M5 4.5A1.5 1.5 0 0 1 6.5 3H19v15H6.5A1.5 1.5 0 0 0 5 19.5v-15Z" }),
+		/* @__PURE__ */ jsx("path", { d: "M5 19.5A1.5 1.5 0 0 0 6.5 21H19v-3" }),
+		/* @__PURE__ */ jsx("path", { d: "M9 7h6" })
+	]
+});
+//#endregion
+export { FlatRigidGoods };

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

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

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

@@ -0,0 +1,21 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+//#region packages/ui/Elements/Icon/icons/FoldableTextile.tsx
+const FoldableTextile = (props) => /* @__PURE__ */ jsxs("svg", {
+	width: "24",
+	height: "24",
+	viewBox: "0 0 24 24",
+	fill: "none",
+	stroke: "currentColor",
+	strokeWidth: "1.5",
+	strokeLinecap: "round",
+	strokeLinejoin: "round",
+	xmlns: "http://www.w3.org/2000/svg",
+	...props,
+	children: [
+		/* @__PURE__ */ jsx("path", { d: "M12 3 3 7.5l9 4.5 9-4.5L12 3Z" }),
+		/* @__PURE__ */ jsx("path", { d: "m3 12 9 4.5 9-4.5" }),
+		/* @__PURE__ */ jsx("path", { d: "m3 16.5 9 4.5 9-4.5" })
+	]
+});
+//#endregion
+export { FoldableTextile };

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

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

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

@@ -0,0 +1,21 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+//#region packages/ui/Elements/Icon/icons/FragileLiquid.tsx
+const FragileLiquid = (props) => /* @__PURE__ */ jsxs("svg", {
+	width: "24",
+	height: "24",
+	viewBox: "0 0 24 24",
+	fill: "none",
+	stroke: "currentColor",
+	strokeWidth: "1.5",
+	strokeLinecap: "round",
+	strokeLinejoin: "round",
+	xmlns: "http://www.w3.org/2000/svg",
+	...props,
+	children: [
+		/* @__PURE__ */ jsx("path", { d: "M9.5 3h5" }),
+		/* @__PURE__ */ jsx("path", { d: "M10.5 3v6.2L5.3 18.4A1.7 1.7 0 0 0 6.8 21h10.4a1.7 1.7 0 0 0 1.5-2.6l-5.2-9.2V3" }),
+		/* @__PURE__ */ jsx("path", { d: "M7.5 15h9" })
+	]
+});
+//#endregion
+export { FragileLiquid };

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

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

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

@@ -0,0 +1,22 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+//#region packages/ui/Elements/Icon/icons/FragileSolid.tsx
+const FragileSolid = (props) => /* @__PURE__ */ jsxs("svg", {
+	width: "24",
+	height: "24",
+	viewBox: "0 0 24 24",
+	fill: "none",
+	stroke: "currentColor",
+	strokeWidth: "1.5",
+	strokeLinecap: "round",
+	strokeLinejoin: "round",
+	xmlns: "http://www.w3.org/2000/svg",
+	...props,
+	children: [
+		/* @__PURE__ */ jsx("path", { d: "M7 3h10l1 6a6 6 0 0 1-12 0l1-6Z" }),
+		/* @__PURE__ */ jsx("path", { d: "M12 15v6" }),
+		/* @__PURE__ */ jsx("path", { d: "M8.5 21h7" }),
+		/* @__PURE__ */ jsx("path", { d: "m13 3-2 3h2l-2 3" })
+	]
+});
+//#endregion
+export { FragileSolid };

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

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

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

@@ -0,0 +1,23 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+//#region packages/ui/Elements/Icon/icons/Inserts.tsx
+const Inserts = (props) => /* @__PURE__ */ jsxs("svg", {
+	width: "24",
+	height: "24",
+	viewBox: "0 0 24 24",
+	fill: "none",
+	stroke: "currentColor",
+	strokeWidth: "1.5",
+	strokeLinecap: "round",
+	strokeLinejoin: "round",
+	xmlns: "http://www.w3.org/2000/svg",
+	...props,
+	children: [
+		/* @__PURE__ */ jsx("path", { d: "M14 3H6.5A1.5 1.5 0 0 0 5 4.5v15A1.5 1.5 0 0 0 6.5 21h11a1.5 1.5 0 0 0 1.5-1.5V8l-5-5Z" }),
+		/* @__PURE__ */ jsx("path", { d: "M14 3v5h5" }),
+		/* @__PURE__ */ jsx("path", { d: "M9 13h6" }),
+		/* @__PURE__ */ jsx("path", { d: "M9 17h6" }),
+		/* @__PURE__ */ jsx("path", { d: "M9 9h2" })
+	]
+});
+//#endregion
+export { Inserts };

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

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

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

@@ -0,0 +1,17 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+//#region packages/ui/Elements/Icon/icons/LiquidGoods.tsx
+const LiquidGoods = (props) => /* @__PURE__ */ jsxs("svg", {
+	width: "24",
+	height: "24",
+	viewBox: "0 0 24 24",
+	fill: "none",
+	stroke: "currentColor",
+	strokeWidth: "1.5",
+	strokeLinecap: "round",
+	strokeLinejoin: "round",
+	xmlns: "http://www.w3.org/2000/svg",
+	...props,
+	children: [/* @__PURE__ */ jsx("path", { d: "M12 3s-6 6.6-6 11a6 6 0 0 0 12 0c0-4.4-6-11-6-11Z" }), /* @__PURE__ */ jsx("path", { d: "M9 14.5a3 3 0 0 0 3 3" })]
+});
+//#endregion
+export { LiquidGoods };

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

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

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

@@ -0,0 +1,17 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+//#region packages/ui/Elements/Icon/icons/NonFoldableTextile.tsx
+const NonFoldableTextile = (props) => /* @__PURE__ */ jsxs("svg", {
+	width: "24",
+	height: "24",
+	viewBox: "0 0 24 24",
+	fill: "none",
+	stroke: "currentColor",
+	strokeWidth: "1.5",
+	strokeLinecap: "round",
+	strokeLinejoin: "round",
+	xmlns: "http://www.w3.org/2000/svg",
+	...props,
+	children: [/* @__PURE__ */ jsx("path", { d: "M9 3 4 5.5 2 10l3.5 1.5L7 10v11h10V10l1.5 1.5L22 10l-2-4.5L15 3" }), /* @__PURE__ */ jsx("path", { d: "M9 3a3 3 0 0 0 6 0" })]
+});
+//#endregion
+export { NonFoldableTextile };

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

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

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

@@ -0,0 +1,21 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+//#region packages/ui/Elements/Icon/icons/ShapeSensitiveGoods.tsx
+const ShapeSensitiveGoods = (props) => /* @__PURE__ */ jsxs("svg", {
+	width: "24",
+	height: "24",
+	viewBox: "0 0 24 24",
+	fill: "none",
+	stroke: "currentColor",
+	strokeWidth: "1.5",
+	strokeLinecap: "round",
+	strokeLinejoin: "round",
+	xmlns: "http://www.w3.org/2000/svg",
+	...props,
+	children: [
+		/* @__PURE__ */ jsx("path", { d: "M4.5 9h15l-1.2 10.6a1.6 1.6 0 0 1-1.6 1.4H7.3a1.6 1.6 0 0 1-1.6-1.4L4.5 9Z" }),
+		/* @__PURE__ */ jsx("path", { d: "M8.5 9V7a3.5 3.5 0 0 1 7 0v2" }),
+		/* @__PURE__ */ jsx("path", { d: "M9 13h6" })
+	]
+});
+//#endregion
+export { ShapeSensitiveGoods };

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

@@ -111,3 +111,13 @@ export { TickCircle } from './TickCircle';
 export { Rabbit } from './Rabbit';
 export { Snail } from './Snail';
 export { Break } from './Break';
+export { FoldableTextile } from './FoldableTextile';
+export { NonFoldableTextile } from './NonFoldableTextile';
+export { CompressibleGoods } from './CompressibleGoods';
+export { ShapeSensitiveGoods } from './ShapeSensitiveGoods';
+export { CompactRigidGoods } from './CompactRigidGoods';
+export { FlatRigidGoods } from './FlatRigidGoods';
+export { FragileSolid } from './FragileSolid';
+export { LiquidGoods } from './LiquidGoods';
+export { FragileLiquid } from './FragileLiquid';
+export { Inserts } from './Inserts';

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

@@ -112,6 +112,16 @@ import { TickCircle } from "./TickCircle.js";
 import { Rabbit } from "./Rabbit.js";
 import { Snail } from "./Snail.js";
 import { Break } from "./Break.js";
+import { FoldableTextile } from "./FoldableTextile.js";
+import { NonFoldableTextile } from "./NonFoldableTextile.js";
+import { CompressibleGoods } from "./CompressibleGoods.js";
+import { ShapeSensitiveGoods } from "./ShapeSensitiveGoods.js";
+import { CompactRigidGoods } from "./CompactRigidGoods.js";
+import { FlatRigidGoods } from "./FlatRigidGoods.js";
+import { FragileSolid } from "./FragileSolid.js";
+import { LiquidGoods } from "./LiquidGoods.js";
+import { FragileLiquid } from "./FragileLiquid.js";
+import { Inserts } from "./Inserts.js";
 //#region packages/ui/Elements/Icon/icons/index.ts
 var icons_exports = /* @__PURE__ */ __exportAll({
 	Add: () => Add,
@@ -135,8 +145,10 @@ var icons_exports = /* @__PURE__ */ __exportAll({
 	CheckedBox: () => CheckedBox,
 	CircleHalfStroke: () => CircleHalfStroke,
 	CloudUpload: () => CloudUpload,
+	CompactRigidGoods: () => CompactRigidGoods,
 	Company: () => Company,
 	Complaint: () => Complaint,
+	CompressibleGoods: () => CompressibleGoods,
 	Consolidation: () => Consolidation,
 	Container: () => Container,
 	DangerCircle: () => DangerCircle,
@@ -159,8 +171,12 @@ var icons_exports = /* @__PURE__ */ __exportAll({
 	FlagSVK: () => FlagSVK,
 	FlagUK: () => FlagUK,
 	FlagUSA: () => FlagUSA,
+	FlatRigidGoods: () => FlatRigidGoods,
 	Foldable: () => Foldable,
+	FoldableTextile: () => FoldableTextile,
 	Fragile: () => Fragile,
+	FragileLiquid: () => FragileLiquid,
+	FragileSolid: () => FragileSolid,
 	Gift: () => Gift,
 	Group: () => Group,
 	HamburgerMenu: () => HamburgerMenu,
@@ -169,6 +185,7 @@ var icons_exports = /* @__PURE__ */ __exportAll({
 	ImagePlaceholder: () => ImagePlaceholder,
 	Income: () => Income,
 	Info: () => Info,
+	Inserts: () => Inserts,
 	Integrations: () => Integrations,
 	Inventory: () => Inventory,
 	Inventory2: () => Inventory2,
@@ -177,6 +194,7 @@ var icons_exports = /* @__PURE__ */ __exportAll({
 	Layout: () => Layout,
 	Link: () => Link,
 	Liquid: () => Liquid,
+	LiquidGoods: () => LiquidGoods,
 	Location: () => Location,
 	Logout1: () => Logout1,
 	MachinePackingForbidden: () => MachinePackingForbidden,
@@ -188,6 +206,7 @@ var icons_exports = /* @__PURE__ */ __exportAll({
 	MobilePhone: () => MobilePhone,
 	Moon: () => Moon,
 	NoImage: () => NoImage,
+	NonFoldableTextile: () => NonFoldableTextile,
 	Notification2: () => Notification2,
 	OpenBox: () => OpenBox,
 	Pallet: () => Pallet,
@@ -205,6 +224,7 @@ var icons_exports = /* @__PURE__ */ __exportAll({
 	Return: () => Return,
 	Rows: () => Rows,
 	Settings2: () => Settings2,
+	ShapeSensitiveGoods: () => ShapeSensitiveGoods,
 	Share: () => Share,
 	ShieldUser: () => ShieldUser,
 	ShoppingBag: () => ShoppingBag,
@@ -229,4 +249,4 @@ var icons_exports = /* @__PURE__ */ __exportAll({
 	Weight: () => Weight
 });
 //#endregion
-export { Add, AddPhoto, Admin, ArrowDown, ArrowDownLine, ArrowForward, ArrowUp, ArrowUpRightDownLeft, ArrowsLeftRight, ArrowsUpDown, Backspace, BanCircle, BarcodeScan, Box, Break, Calculator, Calendar, Cancel, CheckedBox, CircleHalfStroke, CloudUpload, Company, Complaint, Consolidation, Container, DangerCircle, Dashboard, Desktop, Dispatch, Eco, EmptyRack, Exclamation, Expeditions, EyeOpen, Filter, FlagCZ, FlagEL, FlagESP, FlagHU, FlagITA, FlagNL, FlagRUS, FlagSVK, FlagUK, FlagUSA, Foldable, Fragile, Gift, Group, HamburgerMenu, HelpCircle1, HorizontalLines, ImagePlaceholder, Income, Info, Integrations, Inventory, Inventory2, Key, Layers, Layout, Link, Liquid, Location, Logout1, MachinePackingForbidden, MailwrapLogo, MakePhoto, MenuItems, Message, MobileCancel, MobilePhone, Moon, NoImage, Notification2, OpenBox, Pallet, Plus1, Print, Product, Products, Profile, Puzzle1, QRCode, Rabbit, Rack, Reject, Reload, Return, Rows, Settings2, Share, ShieldUser, ShoppingBag, Snail, Sort, Sun, ThreeDots, TickCircle, ToastError, ToastSuccess, Toolbox, Transfer, TrashBin, Truck, TwoBoxes, TwoCheckedBoxes, TwoUsers, UserCowboy, UserHeader, Valuable, WarehouseShelves, Weight, icons_exports };
+export { Add, AddPhoto, Admin, ArrowDown, ArrowDownLine, ArrowForward, ArrowUp, ArrowUpRightDownLeft, ArrowsLeftRight, ArrowsUpDown, Backspace, BanCircle, BarcodeScan, Box, Break, Calculator, Calendar, Cancel, CheckedBox, CircleHalfStroke, CloudUpload, CompactRigidGoods, Company, Complaint, CompressibleGoods, Consolidation, Container, DangerCircle, Dashboard, Desktop, Dispatch, Eco, EmptyRack, Exclamation, Expeditions, EyeOpen, Filter, FlagCZ, FlagEL, FlagESP, FlagHU, FlagITA, FlagNL, FlagRUS, FlagSVK, FlagUK, FlagUSA, FlatRigidGoods, Foldable, FoldableTextile, Fragile, FragileLiquid, FragileSolid, Gift, Group, HamburgerMenu, HelpCircle1, HorizontalLines, ImagePlaceholder, Income, Info, Inserts, Integrations, Inventory, Inventory2, Key, Layers, Layout, Link, Liquid, LiquidGoods, Location, Logout1, MachinePackingForbidden, MailwrapLogo, MakePhoto, MenuItems, Message, MobileCancel, MobilePhone, Moon, NoImage, NonFoldableTextile, Notification2, OpenBox, Pallet, Plus1, Print, Product, Products, Profile, Puzzle1, QRCode, Rabbit, Rack, Reject, Reload, Return, Rows, Settings2, ShapeSensitiveGoods, Share, ShieldUser, ShoppingBag, Snail, Sort, Sun, ThreeDots, TickCircle, ToastError, ToastSuccess, Toolbox, Transfer, TrashBin, Truck, TwoBoxes, TwoCheckedBoxes, TwoUsers, UserCowboy, UserHeader, Valuable, WarehouseShelves, Weight, icons_exports };

package/ui/Elements/Icon/index.js

@@ -111,9 +111,19 @@ import { TickCircle } from "./icons/TickCircle.js";
 import { Rabbit } from "./icons/Rabbit.js";
 import { Snail } from "./icons/Snail.js";
 import { Break } from "./icons/Break.js";
+import { FoldableTextile } from "./icons/FoldableTextile.js";
+import { NonFoldableTextile } from "./icons/NonFoldableTextile.js";
+import { CompressibleGoods } from "./icons/CompressibleGoods.js";
+import { ShapeSensitiveGoods } from "./icons/ShapeSensitiveGoods.js";
+import { CompactRigidGoods } from "./icons/CompactRigidGoods.js";
+import { FlatRigidGoods } from "./icons/FlatRigidGoods.js";
+import { FragileSolid } from "./icons/FragileSolid.js";
+import { LiquidGoods } from "./icons/LiquidGoods.js";
+import { FragileLiquid } from "./icons/FragileLiquid.js";
+import { Inserts } from "./icons/Inserts.js";
 import "./icons/index.js";
 import Icon, { iconDictionary } from "./Icon.js";
 //#region packages/ui/Elements/Icon/index.ts
 var Icon_default = Icon;
 //#endregion
-export { Add, AddPhoto, Admin, ArrowDown, ArrowDownLine, ArrowForward, ArrowUp, ArrowUpRightDownLeft, ArrowsLeftRight, ArrowsUpDown, Backspace, BanCircle, BarcodeScan, Box, Break, Calculator, Calendar, Cancel, CheckedBox, CircleHalfStroke, CloudUpload, Company, Complaint, Consolidation, Container, DangerCircle, Dashboard, Desktop, Dispatch, Eco, EmptyRack, Exclamation, Expeditions, EyeOpen, Filter, FlagCZ, FlagEL, FlagESP, FlagHU, FlagITA, FlagNL, FlagRUS, FlagSVK, FlagUK, FlagUSA, Foldable, Fragile, Gift, Group, HamburgerMenu, HelpCircle1, HorizontalLines, Icon, ImagePlaceholder, Income, Info, Integrations, Inventory, Inventory2, Key, Layers, Layout, Link, Liquid, Location, Logout1, MachinePackingForbidden, MailwrapLogo, MakePhoto, MenuItems, Message, MobileCancel, MobilePhone, Moon, NoImage, Notification2, OpenBox, Pallet, Plus1, Print, Product, Products, Profile, Puzzle1, QRCode, Rabbit, Rack, Reject, Reload, Return, Rows, Settings2, Share, ShieldUser, ShoppingBag, Snail, Sort, Sun, ThreeDots, TickCircle, ToastError, ToastSuccess, Toolbox, Transfer, TrashBin, Truck, TwoBoxes, TwoCheckedBoxes, TwoUsers, UserCowboy, UserHeader, Valuable, WarehouseShelves, Weight, Icon_default as default, iconDictionary };
+export { Add, AddPhoto, Admin, ArrowDown, ArrowDownLine, ArrowForward, ArrowUp, ArrowUpRightDownLeft, ArrowsLeftRight, ArrowsUpDown, Backspace, BanCircle, BarcodeScan, Box, Break, Calculator, Calendar, Cancel, CheckedBox, CircleHalfStroke, CloudUpload, CompactRigidGoods, Company, Complaint, CompressibleGoods, Consolidation, Container, DangerCircle, Dashboard, Desktop, Dispatch, Eco, EmptyRack, Exclamation, Expeditions, EyeOpen, Filter, FlagCZ, FlagEL, FlagESP, FlagHU, FlagITA, FlagNL, FlagRUS, FlagSVK, FlagUK, FlagUSA, FlatRigidGoods, Foldable, FoldableTextile, Fragile, FragileLiquid, FragileSolid, Gift, Group, HamburgerMenu, HelpCircle1, HorizontalLines, Icon, ImagePlaceholder, Income, Info, Inserts, Integrations, Inventory, Inventory2, Key, Layers, Layout, Link, Liquid, LiquidGoods, Location, Logout1, MachinePackingForbidden, MailwrapLogo, MakePhoto, MenuItems, Message, MobileCancel, MobilePhone, Moon, NoImage, NonFoldableTextile, Notification2, OpenBox, Pallet, Plus1, Print, Product, Products, Profile, Puzzle1, QRCode, Rabbit, Rack, Reject, Reload, Return, Rows, Settings2, ShapeSensitiveGoods, Share, ShieldUser, ShoppingBag, Snail, Sort, Sun, ThreeDots, TickCircle, ToastError, ToastSuccess, Toolbox, Transfer, TrashBin, Truck, TwoBoxes, TwoCheckedBoxes, TwoUsers, UserCowboy, UserHeader, Valuable, WarehouseShelves, Weight, Icon_default as default, iconDictionary };

package/ui/Elements/Select/components/ChevronOption.js

@@ -5,7 +5,7 @@ import { jsx, jsxs } from "react/jsx-runtime";
 import { components } from "react-select";
 //#region packages/ui/Elements/Select/components/ChevronOption.tsx
 const ChevronOption = (props) => {
-	const { theme, isSelected, selectOption, children, data } = props;
+	const { theme, isSelected, selectOption, children } = props;
 	const showCheckbox = !!(theme.optionVariant == "checkbox");
 	const showToggle = !!(theme.optionVariant == "toggle");
 	return /* @__PURE__ */ jsxs(components.Option, {
@@ -22,7 +22,6 @@ const ChevronOption = (props) => {
 			variant: "grid"
 		})] }), /* @__PURE__ */ jsx("span", {
 			className: "label",
-			"data-cy": `dropdownModalOption${data.index}`,
 			children
 		})]
 	});

package/ui/Elements/Select/components/DropdownIndicator.js

@@ -9,13 +9,12 @@ const ChevronDiv = styled$1.div`
   display: flex;
 `;
 const DropdownIndicator = (props) => {
-	const { menuIsOpen, name } = props.selectProps;
+	const { menuIsOpen } = props.selectProps;
 	const iconColor = props.theme.colors.placeholderTextColor;
 	return /* @__PURE__ */ jsx(components.DropdownIndicator, {
 		...props,
 		children: /* @__PURE__ */ jsx(ChevronDiv, {
 			className: "chevron",
-			"data-cy": `${name || ""}ChevronBtn`,
 			children: menuIsOpen ? /* @__PURE__ */ jsx(ArrowUp, {
 				width: "16px",
 				stroke: iconColor

package/ui/Elements/Select/themes/index.js

@@ -1,7 +1,6 @@
 import { ChevronOption } from "../components/ChevronOption.js";
 import ConnectedMenu from "../components/ConnectedMenu.js";
 import CountMultiValue from "../components/CountMultiValue.js";
-import { CustomInput } from "../components/CustomInput.js";
 import { DropdownIndicator } from "../components/DropdownIndicator.js";
 import IconValueContainer from "../components/IconValueContainer.js";
 import SimplifiedOption from "../components/SimplifiedOption.js";
@@ -17,7 +16,6 @@ const useStylesAndComponents = (style = "form", optionVariant = "default", multi
 		if (multiLabelVariant === "count") components.MultiValue = CountMultiValue;
 		if (containerVariant === "search") components.DropdownIndicator = null;
 		if (showSelectAllButton) components.MenuList = ConnectedMenu;
-		components.Input = CustomInput;
 		const themes = getCustomTheme(systemTheme, optionVariant, style === "gridFilter");
 		const styles = CustomStyles;
 		components.Option = ChevronOption;

package/ui/Elements/Toggle/Toggle.js

@@ -108,7 +108,6 @@ const Toggle = ({ onChange, label, name, checked, defaultChecked, spaceAround =
 				defaultChecked,
 				onChange: !disabled ? onChange : void 0,
 				disabled,
-				"data-cy": name ? `${name}Switch` : void 0,
 				"data-testid": name ? `toggle-${name}` : void 0,
 				readOnly
 			}), /* @__PURE__ */ jsx(StyledToggle, {

package/ui/Forms/Checkbox/Checkbox.js

@@ -18,7 +18,6 @@ const Checkbox = ({ name, label, onChange, checked, defaultChecked, size = "18px
 				onChange,
 				value: "",
 				readOnly,
-				"data-cy": name ? `${name}Checkbox` : void 0,
 				"data-testid": name ? `checkbox-${name}` : void 0,
 				id
 			}),

package/ui/Forms/Input/Input.js

@@ -66,7 +66,6 @@ const Input = ({ appearance = "primary", type, name, label, value, icon, variant
 					className: `${appearance} ${checkIconPlacement}`,
 					type,
 					name,
-					"data-cy": name ? `${name}Inp` : void 0,
 					"data-testid": name ? `input-${name}` : void 0,
 					value,
 					$isInvalid,

package/ui/Modules/CommonGrid/components/ActionHead/ActionHead.js

@@ -93,7 +93,6 @@ const ActionHead = ({ gridActions, gridSelectors, actionOptions, onBatchAction,
 			onClick: checkAll,
 			appearance: "secondary",
 			variant: "default",
-			"data-cy": "checkAllBtn",
 			disabled: checked,
 			children: /* @__PURE__ */ jsx(Trans, {
 				id: "dataGrid.checkAll",
@@ -105,7 +104,6 @@ const ActionHead = ({ gridActions, gridSelectors, actionOptions, onBatchAction,
 			onClick: processCheckedValues,
 			appearance: "primary",
 			variant: "default",
-			"data-cy": "exportBtn",
 			disabled: !rowsData.length,
 			children: processCheckedValuesTitle || /* @__PURE__ */ jsx(Trans, {
 				id: "dataGrid.actionOptions.export",

package/ui/Modules/CommonGrid/components/ButtonMore/ButtonMore.js

@@ -32,7 +32,6 @@ const ButtonMore = ({ items, disabled, dropdownPosition }) => {
 			appearance: "secondary",
 			variant: "icon",
 			type: "button",
-			"data-cy": "gridActionBtn",
 			disabled
 		}), /* @__PURE__ */ jsx(StyledDropdownMenu, {
 			showMenu: actionsVisible,

package/ui/Modules/CommonGrid/components/ControlButtons/ControlButtons.js

@@ -67,7 +67,6 @@ const ControlButtons = ({ extraControlButtons, gridActions, gridSelectors, quick
 				onClick: onClearSettings,
 				variant: "default",
 				appearance: "secondary",
-				"data-cy": "resetFiltersBtn",
 				children: /* @__PURE__ */ jsx(Trans, {
 					id: "dataGrid.buttonClearSettings",
 					message: "Reset"
@@ -78,7 +77,6 @@ const ControlButtons = ({ extraControlButtons, gridActions, gridSelectors, quick
 			type: "button",
 			appearance: filtersCount ? "primary" : "tertiary",
 			onClick: onOpenMobileFilters,
-			"data-cy": "mobileFilterBtn",
 			children: [/* @__PURE__ */ jsx(Filter, { fill: filtersCount ? "white" : red }), /* @__PURE__ */ jsxs(H6, {
 				variant: "semiBold",
 				mt: 0,
@@ -101,7 +99,6 @@ const ControlButtons = ({ extraControlButtons, gridActions, gridSelectors, quick
 				appearance: sortCount ? "primary" : "tertiary",
 				onClick: onOpenMobileSorting,
 				disabled: isSortTerminated,
-				"data-cy": "mobileSortBtn",
 				children: [/* @__PURE__ */ jsx(Sort, { stroke: sortCount ? "white" : red }), /* @__PURE__ */ jsxs(H6, {
 					variant: "semiBold",
 					mt: 0,
@@ -158,8 +155,7 @@ const ControlButtons = ({ extraControlButtons, gridActions, gridSelectors, quick
 			title: i18n._({
 				id: "dataGrid.share.title",
 				message: "Share"
-			}),
-			"data-cy": "shareGridBtn"
+			})
 		})] }),
 		displayManageColumnButton && !isMobile && /* @__PURE__ */ jsx(StyledColumnButton, {
 			type: "button",

package/ui/Modules/CommonGrid/components/Filters/NumberRange/NumberRange.js

@@ -127,7 +127,6 @@ const NumberRange = (props) => {
 			name,
 			value: fieldValue,
 			label,
-			"data-cy": `${name}Inp`,
 			onChange: onChangeTextInput,
 			iconOnClick: togglePicker,
 			icon: "ellipsisVertical",

package/ui/Modules/CommonGrid/components/Filters/TextRange/TextRange.js

@@ -139,7 +139,6 @@ const TextRange = (props) => {
 		children: [/* @__PURE__ */ jsx(Input, {
 			name,
 			"data-test": name,
-			"data-cy": `${name}Inp`,
 			value: fieldValue,
 			label,
 			onChange: onChangeTextInput,

package/ui/Modules/CommonGrid/components/gridCells/EnumInCell.js

@@ -21,7 +21,6 @@ const EnumInCell = ({ value, enumObj, appearanceMap, size }) => {
 		children: /* @__PURE__ */ jsx(HighlightBox_default, {
 			...coloringProp,
 			size,
-			prefix: "grid",
 			children: finalLabel
 		})
 	});

package/ui/Modules/CommonGrid/components/gridCells/IconButtonInCell.js

@@ -8,7 +8,6 @@ import { Link } from "react-router-dom";
 const IconButtonInCell = ({ icon, isLoading, onClick, linkTo }) => {
 	return /* @__PURE__ */ jsx(Fragment, { children: isLoading ? /* @__PURE__ */ jsx(Spinner, { variant: "sm" }) : linkTo ? /* @__PURE__ */ jsx(Link, {
 		to: linkTo,
-		"data-cy": `${icon ?? ""}IconBtn`,
 		children: /* @__PURE__ */ jsx(Icon, {
 			icon: icon || "warning",
 			size: "16px",
@@ -16,7 +15,6 @@ const IconButtonInCell = ({ icon, isLoading, onClick, linkTo }) => {
 		})
 	}) : /* @__PURE__ */ jsx(x.span, {
 		onClick,
-		"data-cy": `${icon ?? ""}IconBtn`,
 		cursor: "pointer",
 		h: "100%",
 		display: "flex",

package/ui/index.js

@@ -116,6 +116,16 @@ import { TickCircle } from "./Elements/Icon/icons/TickCircle.js";
 import { Rabbit } from "./Elements/Icon/icons/Rabbit.js";
 import { Snail } from "./Elements/Icon/icons/Snail.js";
 import { Break } from "./Elements/Icon/icons/Break.js";
+import { FoldableTextile } from "./Elements/Icon/icons/FoldableTextile.js";
+import { NonFoldableTextile } from "./Elements/Icon/icons/NonFoldableTextile.js";
+import { CompressibleGoods } from "./Elements/Icon/icons/CompressibleGoods.js";
+import { ShapeSensitiveGoods } from "./Elements/Icon/icons/ShapeSensitiveGoods.js";
+import { CompactRigidGoods } from "./Elements/Icon/icons/CompactRigidGoods.js";
+import { FlatRigidGoods } from "./Elements/Icon/icons/FlatRigidGoods.js";
+import { FragileSolid } from "./Elements/Icon/icons/FragileSolid.js";
+import { LiquidGoods } from "./Elements/Icon/icons/LiquidGoods.js";
+import { FragileLiquid } from "./Elements/Icon/icons/FragileLiquid.js";
+import { Inserts } from "./Elements/Icon/icons/Inserts.js";
 import { iconDictionary } from "./Elements/Icon/Icon.js";
 import Icon_default from "./Elements/Icon/index.js";
 import { DatePickerRepeat, TimePickerRepeat } from "./Forms/DatePicker/Datetime/types.js";
@@ -199,4 +209,4 @@ import Toast_default from "./Elements/Toast/index.js";
 import Toggle_default from "./Elements/Toggle/index.js";
 import RadioButton_default from "./Forms/RadioButton/index.js";
 import TextArea_default from "./Forms/TextArea/index.js";
-export { Add, AddPhoto, Admin, Alert_default as Alert, ArrowDown, ArrowDownLine, ArrowForward, ArrowUp, ArrowUpRightDownLeft, ArrowsLeftRight, ArrowsUpDown, AsyncSelect_default as AsyncSelect, Avatar_default as Avatar, Backspace, Badge_default as Badge, BanCircle, BarcodeScan, BoolIconCell, BorderedBox_default as BorderedBox, Box, Break, Button_default as Button, ButtonInCell, Calculator, Calendar, Cancel, Card_default as Card, Checkbox_default as Checkbox, CheckedBox, CircleHalfStroke, CloudUpload, CommonGrid_default as CommonGrid, Company, Complaint, Consolidation, Container, CornerDialog_default as CornerDialog, CustomSelectButton, DangerCircle, Dashboard, DateCell, DatePicker_default as DatePicker, DatePickerRange_default as DatePickerRange, DatePickerRepeat, DateTimeCell, Desktop, Dispatch, Dropdown_default as Dropdown, DropdownSelect_default as DropdownSelect, Eco, EmptyRack, EnumInCell, ErrorMessage_default as ErrorMessage, Exclamation, Expeditions, EyeOpen, FieldLabel, Filter, FlagCZ, FlagEL, FlagESP, FlagHU, FlagITA, FlagNL, FlagRUS, FlagSVK, FlagUK, FlagUSA, Foldable, Fragile, Gift, Group, H1, H2, H3, H4, H5, H6, H7, HamburgerMenu, HamburgerMenuButton, HelpCircle1, HorizontalLines, HoverBubble, Icon_default as Icon, IconButtonInCell, Image_default as Image, ImageCell, ImageList_default as ImageList, ImagePlaceholder, Income, Info, Input_default as Input, Integrations, Inventory, Inventory2, Key, KeyPress_default as KeyPress, Label_default as Label, LanguageSwitch_default as LanguageSwitch, Layers, Layout, LightBox_default as LightBox, Line_default as Line, Link_default as Link, LinkInCell, Liquid, Location, LoginPage_default as LoginPage, Logo_default as Logo, Logout1, MachinePackingForbidden, MailwrapLogo, MakePhoto, MenuItems, Message, MobileCancel, MobilePhone, Modal_default as Modal, Moon, NoImage, Notification2, OpenBox, Pagination_default as Pagination, Pallet, Paragraph1, Paragraph2, Paragraph3, Paragraph4, Paragraph5, Plus1, Popover, Portal, Print, Product, Products, Profile, ProgressBar_default as ProgressBar, Puzzle1, QRCode, Rabbit, Rack, RadioButton_default as RadioButton, Reject, Reload, RemoveCell, Return, RowActionsCell, Rows, Scheduler, Select_default as Select, Settings2, Share, ShieldUser, ShoppingBag, SideMenu_default as SideMenu, SimpleLink_default as SimpleLink, SingleSelect_default as SingleSelect, Snail, Sort, SpaceAround_default as SpaceAround, SpaceAroundWrap, Spinner_default as Spinner, StepCircle, Stepper, StringJoinCell, Sun, SwitchInCell, TabContent, Tabs_default as Tabs, Tag_default as Tag, Text, TextArea_default as TextArea, ThemeProvider_default as ThemeProvider, ThreeDots, TickCircle, TimePickerRepeat, Toast_default as Toast, ToastError, ToastSuccess, Toggle_default as Toggle, ToggleCell, Toolbox, Transfer, TrashBin, Truck, TwoBoxes, TwoCheckedBoxes, TwoUsers, types_exports as Types, Typography_default as Typography, UserCowboy, UserHeader, Valuable, WarehouseShelves, Weight, actionPrefix, actionTypes, compactMenuWidth, createActions, createFullSelector, createRgba, createSelectors, expandedMenuWidth, iconDictionary, palettes, store_default as reducer, themes, useAddFilter, useClickOutside, useEvent, useFloatingButton, useLightBox, useModal, useStepper, useTabs, utils_default as utils, withReduxActions };
+export { Add, AddPhoto, Admin, Alert_default as Alert, ArrowDown, ArrowDownLine, ArrowForward, ArrowUp, ArrowUpRightDownLeft, ArrowsLeftRight, ArrowsUpDown, AsyncSelect_default as AsyncSelect, Avatar_default as Avatar, Backspace, Badge_default as Badge, BanCircle, BarcodeScan, BoolIconCell, BorderedBox_default as BorderedBox, Box, Break, Button_default as Button, ButtonInCell, Calculator, Calendar, Cancel, Card_default as Card, Checkbox_default as Checkbox, CheckedBox, CircleHalfStroke, CloudUpload, CommonGrid_default as CommonGrid, CompactRigidGoods, Company, Complaint, CompressibleGoods, Consolidation, Container, CornerDialog_default as CornerDialog, CustomSelectButton, DangerCircle, Dashboard, DateCell, DatePicker_default as DatePicker, DatePickerRange_default as DatePickerRange, DatePickerRepeat, DateTimeCell, Desktop, Dispatch, Dropdown_default as Dropdown, DropdownSelect_default as DropdownSelect, Eco, EmptyRack, EnumInCell, ErrorMessage_default as ErrorMessage, Exclamation, Expeditions, EyeOpen, FieldLabel, Filter, FlagCZ, FlagEL, FlagESP, FlagHU, FlagITA, FlagNL, FlagRUS, FlagSVK, FlagUK, FlagUSA, FlatRigidGoods, Foldable, FoldableTextile, Fragile, FragileLiquid, FragileSolid, Gift, Group, H1, H2, H3, H4, H5, H6, H7, HamburgerMenu, HamburgerMenuButton, HelpCircle1, HorizontalLines, HoverBubble, Icon_default as Icon, IconButtonInCell, Image_default as Image, ImageCell, ImageList_default as ImageList, ImagePlaceholder, Income, Info, Input_default as Input, Inserts, Integrations, Inventory, Inventory2, Key, KeyPress_default as KeyPress, Label_default as Label, LanguageSwitch_default as LanguageSwitch, Layers, Layout, LightBox_default as LightBox, Line_default as Line, Link_default as Link, LinkInCell, Liquid, LiquidGoods, Location, LoginPage_default as LoginPage, Logo_default as Logo, Logout1, MachinePackingForbidden, MailwrapLogo, MakePhoto, MenuItems, Message, MobileCancel, MobilePhone, Modal_default as Modal, Moon, NoImage, NonFoldableTextile, Notification2, OpenBox, Pagination_default as Pagination, Pallet, Paragraph1, Paragraph2, Paragraph3, Paragraph4, Paragraph5, Plus1, Popover, Portal, Print, Product, Products, Profile, ProgressBar_default as ProgressBar, Puzzle1, QRCode, Rabbit, Rack, RadioButton_default as RadioButton, Reject, Reload, RemoveCell, Return, RowActionsCell, Rows, Scheduler, Select_default as Select, Settings2, ShapeSensitiveGoods, Share, ShieldUser, ShoppingBag, SideMenu_default as SideMenu, SimpleLink_default as SimpleLink, SingleSelect_default as SingleSelect, Snail, Sort, SpaceAround_default as SpaceAround, SpaceAroundWrap, Spinner_default as Spinner, StepCircle, Stepper, StringJoinCell, Sun, SwitchInCell, TabContent, Tabs_default as Tabs, Tag_default as Tag, Text, TextArea_default as TextArea, ThemeProvider_default as ThemeProvider, ThreeDots, TickCircle, TimePickerRepeat, Toast_default as Toast, ToastError, ToastSuccess, Toggle_default as Toggle, ToggleCell, Toolbox, Transfer, TrashBin, Truck, TwoBoxes, TwoCheckedBoxes, TwoUsers, types_exports as Types, Typography_default as Typography, UserCowboy, UserHeader, Valuable, WarehouseShelves, Weight, actionPrefix, actionTypes, compactMenuWidth, createActions, createFullSelector, createRgba, createSelectors, expandedMenuWidth, iconDictionary, palettes, store_default as reducer, themes, useAddFilter, useClickOutside, useEvent, useFloatingButton, useLightBox, useModal, useStepper, useTabs, utils_default as utils, withReduxActions };

package/ui/Elements/Select/components/CustomInput.d.ts

@@ -1,2 +0,0 @@
-export declare const CustomInput: (props: any) => any;
-export default CustomInput;

package/ui/Elements/Select/components/CustomInput.js

@@ -1,13 +0,0 @@
-import { jsx } from "react/jsx-runtime";
-import { components } from "react-select";
-//#region packages/ui/Elements/Select/components/CustomInput.tsx
-const CustomInput = (props) => {
-	const { name } = props.selectProps;
-	const value = !!name ? `${name}Inp` : props.id;
-	return /* @__PURE__ */ jsx(components.Input, {
-		...props,
-		"data-cy": value
-	});
-};
-//#endregion
-export { CustomInput, CustomInput as default };