@youngonesworks/ui 1.0.14 → 1.0.15

package/dist/index.js

@@ -251,34 +251,35 @@ function formatIcon(icon, defaultFormatAttributes) {
 }
 //#endregion
 //#region src/components/actionIcon/index.tsx
-const ActionIcon = ({ ref, title, disabled = false, styleVariant = "default", icon, type = "button", "data-testid": testId, iconSize = 20, strokeWidth = 1, onClick, className, ...props }) => {
+const ActionIcon = ({ ref, title, disabled = false, styleVariant = "default", icon, type = "button", tooltipTitle, "data-testid": testId, iconSize = 20, strokeWidth = 1, onClick, className, ...props }) => {
 	const variantClassNames = clsx({
 		"active:translate-y-[1px] content-center flex items-center justify-center rounded-[4px] border border-gray-200 hover:border-black text-black child:p-10 w-[36px] h-[36px] disabled:text-gray-500": styleVariant === ACTION_ICON_STYLE_VARIANT.DEFAULT,
 		"active:translate-y-[1px] border-none content-center flex items-center justify-center rounded-[4px] border text-black child:p-10 w-[36px] h-[36px] disabled:text-gray-500": styleVariant === ACTION_ICON_STYLE_VARIANT.TRANSPARENT,
 		"active:translate-y-[1px] content-center flex items-center justify-center rounded-[4px] child:p-10 w-[37px] h-[37px] text-black rounded-full bg-primary hover:bg-turquoise-700 disabled:turquoise-50 disabled:text-gray-800": styleVariant === ACTION_ICON_STYLE_VARIANT.ROUND,
 		"w-7 h-7 active:translate-y-[1px] content-center flex items-center justify-center rounded-[4px] border border-gray-200 hover:border-black text-black hover:bg-ultra-light-blue-gray disabled:text-gray-500": styleVariant === ACTION_ICON_STYLE_VARIANT.SMALL
 	});
-	return /* @__PURE__ */ jsx(Fragment$1, { children: /* @__PURE__ */ jsx(Tooltip, {
+	const renderButton = () => /* @__PURE__ */ jsx("button", {
+		title,
+		type,
+		disabled,
+		"data-testid": testId,
+		"data-component": "ActionIcon",
+		className: cn(variantClassNames, { "hover:bg-transparant cursor-not-allowed hover:border-gray-200": disabled }, className),
+		onClick,
+		ref,
+		"data-tooltip-id": tooltipTitle,
+		"data-tooltip-content": tooltipTitle,
+		...props,
+		children: icon ? formatIcon(icon, {
+			stroke: strokeWidth,
+			size: iconSize
+		}) : props.children
+	});
+	return tooltipTitle ? /* @__PURE__ */ jsx(Tooltip, {
 		size: "sm",
-		content: title,
-		children: /* @__PURE__ */ jsx("button", {
-			title,
-			type,
-			disabled,
-			"data-testid": testId,
-			"data-component": "ActionIcon",
-			className: cn(variantClassNames, { "hover:bg-transparant cursor-not-allowed hover:border-gray-200": disabled }, className),
-			onClick,
-			ref,
-			"data-tooltip-id": title,
-			"data-tooltip-content": title,
-			...props,
-			children: icon ? formatIcon(icon, {
-				stroke: strokeWidth,
-				size: iconSize
-			}) : props.children
-		})
-	}) });
+		content: tooltipTitle,
+		children: renderButton()
+	}) : renderButton();
 };
 ActionIcon.displayName = "ActionIcon";
 //#endregion
@@ -1219,6 +1220,7 @@ const Divider = ({ className, ...props }) => /* @__PURE__ */ jsx("div", {
 const FavouriteButton = forwardRef((props, ref) => {
 	const { onClick, favourite, iconFilled, iconOutline, favouriteTitle, iconColorSelected = "text-secondary", iconColor = "text-gray-800", iconSize, className = "", styleVariant = "transparent", children, ...rest } = props;
 	return /* @__PURE__ */ jsx(ActionIcon, {
+		tooltipTitle: favouriteTitle || "Favorite",
 		onClick,
 		"data-component": "favouriteButton",
 		title: favouriteTitle || "Favorite",
@@ -1788,12 +1790,12 @@ const Modal = ({ title, children, withCloseButton = true, opened, additionalClas
 					/* @__PURE__ */ jsx("div", {
 						className: "relative z-10 w-full",
 						children: withCloseButton && /* @__PURE__ */ jsx(ActionIcon, {
+							title: "Close modal",
 							onClick: handleClose,
-							"aria-label": "close modal",
+							"aria-label": "Close modal",
 							className: "absolute top-0 right-0",
 							"data-testid": "close-modal",
-							icon: /* @__PURE__ */ jsx(IconX, {}),
-							title: "Close modal"
+							icon: /* @__PURE__ */ jsx(IconX, {})
 						})
 					}),
 					title && /* @__PURE__ */ jsx("div", {