@youngonesworks/ui 0.1.123 → 0.1.125

package/dist/components/badge/index.d.ts

@@ -1,6 +1,6 @@
 interface IBadgeProps {
-    styleVariant?: 'green-light' | 'red' | 'accent-blue' | 'warning' | 'gray' | 'black' | 'dark-gray' | 'purple' | 'pink' | 'pink-light' | 'gray' | 'white';
-    color?: 'dark' | 'gray' | 'red' | 'pink' | 'grape' | 'violet' | 'indigo' | 'blue' | 'cyan' | 'green' | 'lime' | 'yellow' | 'orange' | 'teal';
+    styleVariant?: 'green-light' | 'red' | 'accent-blue' | 'warning' | 'gray' | 'black' | 'dark-gray' | 'purple' | 'secondary' | 'secondary-light' | 'gray' | 'white';
+    color?: 'dark' | 'gray' | 'red' | 'secondary' | 'grape' | 'violet' | 'indigo' | 'blue' | 'cyan' | 'green' | 'lime' | 'yellow' | 'orange' | 'teal';
     favorite?: boolean;
     children?: React.ReactNode;
     className?: string;

package/dist/components/themeIcon/ThemeIcon.stories.d.ts

@@ -5,4 +5,4 @@ export default meta;
 type Story = StoryObj<typeof ThemeIcon>;
 export declare const Default: Story;
 export declare const Warning: Story;
-export declare const PinkHeart: Story;
+export declare const SecondaryHeart: Story;

package/dist/components/themeIcon/index.d.ts

@@ -1,6 +1,6 @@
 import { type HTMLAttributes } from 'react';
 export interface IThemeIcon extends Omit<HTMLAttributes<HTMLDivElement>, 'className'> {
-    styleVariant?: 'black' | 'gray' | 'pink' | 'pink-with-background' | 'turquoise' | 'accent-blue' | 'check' | 'warning' | 'error';
+    styleVariant?: 'black' | 'gray' | 'secondary' | 'secondary-with-background' | 'turquoise' | 'accent-blue' | 'check' | 'warning' | 'error';
     icon: React.ReactNode;
     className?: string;
     adjustedSize?: string | number;

package/dist/index.cjs

@@ -233,7 +233,7 @@ let ACTION_ICON_STYLE_VARIANT = /* @__PURE__ */ function(ACTION_ICON_STYLE_VARIA
 	return ACTION_ICON_STYLE_VARIANT$1;
 }({});
 let THEME_ICON_STYLE_VARIANT = /* @__PURE__ */ function(THEME_ICON_STYLE_VARIANT$1) {
-	THEME_ICON_STYLE_VARIANT$1["PINK_WITH_BACKGROUND"] = "pink-with-background";
+	THEME_ICON_STYLE_VARIANT$1["SECONDARY_WITH_BACKGROUND"] = "secondary-with-background";
 	return THEME_ICON_STYLE_VARIANT$1;
 }({});
 let COLOR = /* @__PURE__ */ function(COLOR$1) {
@@ -244,8 +244,8 @@ let COLOR = /* @__PURE__ */ function(COLOR$1) {
 	COLOR$1["LIGHT_BLUE_DISABLED"] = "light-blue-disabled";
 	COLOR$1["GREEN"] = "green";
 	COLOR$1["GREEN_LIGHT"] = "green-light";
-	COLOR$1["PINK"] = "pink";
-	COLOR$1["PINK_LIGHT"] = "pink-light";
+	COLOR$1["SECONDARY"] = "secondary";
+	COLOR$1["SECONDARY_LIGHT"] = "secondary-light";
 	COLOR$1["ORANGE"] = "orange";
 	COLOR$1["ORANGE_LIGHT"] = "orange-light";
 	COLOR$1["ACCENT_BLUE"] = "accent-blue";
@@ -379,7 +379,7 @@ const Alert = ({ show, title, description, type = "warning", button, plain = fal
 						"data-testid": "alert-icon",
 						"aria-hidden": "true"
 					})), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
-						className: "text-base font-medium",
+						className: "text-base font-semibold",
 						children: title
 					})]
 				}),
@@ -786,8 +786,8 @@ const Badge = ({ styleVariant = COLOR.ACCENT_BLUE, className, favorite, children
 			"bg-gray-50 text-black": styleVariant === COLOR.DARK_GRAY,
 			"bg-black text-white": styleVariant === COLOR.BLACK,
 			"bg-gray-50 text-gray-800": styleVariant === COLOR.GRAY,
-			"bg-pink-light text-pink": styleVariant === COLOR.PINK_LIGHT,
-			"bg-pink text-white": styleVariant === COLOR.PINK,
+			"bg-secondary-light text-secondary": styleVariant === COLOR.SECONDARY_LIGHT,
+			"bg-secondary text-white": styleVariant === COLOR.SECONDARY,
 			"bg-white text-black": styleVariant === COLOR.WHITE
 		}, className),
 		...props,
@@ -1287,7 +1287,7 @@ const Divider = ({ className,...props }) => /* @__PURE__ */ (0, react_jsx_runtim
 //#endregion
 //#region src/components/favouriteButton/index.tsx
 const FavouriteButton = (0, react.forwardRef)((props, ref) => {
-	const { onClick, favourite, iconFilled, iconOutline, favouriteTitle, iconColorSelected = "text-pink", iconColor = "text-gray-800", iconSize, className = "", styleVariant = "transparent", children,...rest } = props;
+	const { onClick, favourite, iconFilled, iconOutline, favouriteTitle, iconColorSelected = "text-secondary", iconColor = "text-gray-800", iconSize, className = "", styleVariant = "transparent", children,...rest } = props;
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(ActionIcon, {
 		onClick,
 		"data-component": "favouriteButton",
@@ -1889,7 +1889,7 @@ const Modal = ({ title, children, withCloseButton = true, opened, additionalClas
 					gradient && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("hr", {
 						"data-testid": "modal-gradient",
 						className: "absolute bottom-0 left-0 mt-8 mb-0 h-2! w-full border-none",
-						style: { backgroundImage: "linear-gradient(90deg, var(--color-light-blue) 0%, var(--color-primary) 50.52%, var(--color-pink) 100%)" }
+						style: { backgroundImage: "linear-gradient(90deg, var(--color-light-blue) 0%, var(--color-primary) 50.52%, var(--color-secondary) 100%)" }
 					})
 				]
 			})
@@ -2852,7 +2852,7 @@ const TabsBadge = ({ children }) => {
 	const isCircular = typeof children === "number" && children <= 9 || typeof children === "string" && children.length === 1 || false;
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
 		"data-testid": "tabs-badge",
-		className: (0, clsx.default)("bg-pink h-5 rounded-full text-xs leading-5 font-medium text-white", {
+		className: (0, clsx.default)("bg-secondary h-5 rounded-full text-xs leading-5 font-medium text-white", {
 			"w-5 text-center": isCircular,
 			"px-2": !isCircular
 		}),
@@ -2955,8 +2955,8 @@ function ThemeIcon({ styleVariant = "black", className, icon, adjustedSize, titl
 	const classNames = cn("bg-transparent h-9 w-9 rounded-[5px] grid place-content-center", {
 		"text-black": styleVariant === COLOR.BLACK,
 		"text-gray-500": styleVariant === COLOR.GRAY,
-		"text-pink": styleVariant === COLOR.PINK,
-		"bg-gray-50 text-pink": styleVariant === THEME_ICON_STYLE_VARIANT.PINK_WITH_BACKGROUND,
+		"text-secondary": styleVariant === COLOR.SECONDARY,
+		"bg-gray-50 text-secondary": styleVariant === THEME_ICON_STYLE_VARIANT.SECONDARY_WITH_BACKGROUND,
 		"text-primary": styleVariant === COLOR.TURQUOISE,
 		"text-accent-blue": styleVariant === COLOR.ACCENT_BLUE,
 		"text-check": styleVariant === COLOR.CHECK,
@@ -3046,7 +3046,7 @@ const TruncatedText = ({ text, limit = 20 }) => {
 		}), text.length > limit && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Tooltip, {
 			content: text,
 			children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
-				className: "text-pink",
+				className: "text-secondary",
 				"data-testid": "truncated-text-icon",
 				children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(__tabler_icons_react.IconMessageDots, { stroke: 1 })
 			})
@@ -3630,7 +3630,7 @@ const CSS_VARIABLE_KEYS = [
 	"--color-ultra-light-blue",
 	"--color-green",
 	"--color-green-light",
-	"--color-pink",
+	"--color-secondary",
 	"--color-purple",
 	"--color-orange",
 	"--color-warning",