@ornikar/kitt-universal 25.52.0 → 25.53.0

package/CHANGELOG.md

@@ -3,6 +3,15 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [25.53.0](https://github.com/ornikar/kitt/compare/@ornikar/kitt-universal@25.52.0...@ornikar/kitt-universal@25.53.0) (2025-05-19)
+
+
+### Features
+
+* add badge prop for IconButton - OSE-17330 ([#2592](https://github.com/ornikar/kitt/issues/2592)) ([df370d6](https://github.com/ornikar/kitt/commit/df370d68e657b60ace721b7039beed99ef00b40e))
+
+
+
 ## [25.52.0](https://github.com/ornikar/kitt/compare/@ornikar/kitt-universal@25.51.0...@ornikar/kitt-universal@25.52.0) (2025-05-15)
 
 

package/dist/definitions/IconButton/IconButton.d.ts

@@ -9,6 +9,8 @@ export interface IconButtonProps {
     testID?: string;
     ariaLabel?: PressableProps['aria-label'];
     accessibilityRole?: PressableProps['accessibilityRole'];
+    withBadge?: boolean;
+    bagdeCount?: number;
     /** @internal for story purpose */
     isHoveredInternal?: boolean;
     /** @internal for story purpose */
@@ -17,6 +19,6 @@ export interface IconButtonProps {
     isFocusedInternal?: boolean;
     onPress?: () => void;
 }
-export declare function IconButton({ icon, color, disabled, testID, ariaLabel, accessibilityRole, isHoveredInternal, isPressedInternal, isFocusedInternal, onPress, }: IconButtonProps): ReactNode;
+export declare function IconButton({ icon, color, disabled, testID, ariaLabel, accessibilityRole, withBadge, bagdeCount, isHoveredInternal, isPressedInternal, isFocusedInternal, onPress, }: IconButtonProps): ReactNode;
 export declare function CloseIconButton(props: Except<IconButtonProps, 'icon'>): ReactNode;
 //# sourceMappingURL=IconButton.d.ts.map

package/dist/definitions/IconButton/IconButton.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"IconButton.d.ts","sourceRoot":"","sources":["../../../src/IconButton/IconButton.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,YAAY,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AACrD,OAAO,KAAK,EAAE,MAAM,EAAE,MAAM,WAAW,CAAC;AACxC,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,2BAA2B,CAAC;AAShE,MAAM,MAAM,eAAe,GAAG,OAAO,GAAG,OAAO,GAAG,SAAS,GAAG,eAAe,GAAG,WAAW,CAAC;AAE5F,MAAM,WAAW,eAAe;IAC9B,IAAI,EAAE,WAAW,CAAC,YAAY,CAAC,CAAC;IAChC,KAAK,CAAC,EAAE,eAAe,CAAC;IACxB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,SAAS,CAAC,EAAE,cAAc,CAAC,YAAY,CAAC,CAAC;IACzC,iBAAiB,CAAC,EAAE,cAAc,CAAC,mBAAmB,CAAC,CAAC;IACxD,kCAAkC;IAClC,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAC5B,kCAAkC;IAClC,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAC5B,kCAAkC;IAClC,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAC5B,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;CACtB;AAED,wBAAgB,UAAU,CAAC,EACzB,IAAI,EACJ,KAAe,EACf,QAAQ,EACR,MAAM,EACN,SAAS,EACT,iBAA4B,EAC5B,iBAAiB,EACjB,iBAAiB,EACjB,iBAAiB,EACjB,OAAO,GACR,EAAE,eAAe,GAAG,SAAS,CAwD7B;AAED,wBAAgB,eAAe,CAAC,KAAK,EAAE,MAAM,CAAC,eAAe,EAAE,MAAM,CAAC,GAAG,SAAS,CAEjF"}
+{"version":3,"file":"IconButton.d.ts","sourceRoot":"","sources":["../../../src/IconButton/IconButton.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,YAAY,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AACrD,OAAO,KAAK,EAAE,MAAM,EAAE,MAAM,WAAW,CAAC;AACxC,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,2BAA2B,CAAC;AAWhE,MAAM,MAAM,eAAe,GAAG,OAAO,GAAG,OAAO,GAAG,SAAS,GAAG,eAAe,GAAG,WAAW,CAAC;AAE5F,MAAM,WAAW,eAAe;IAC9B,IAAI,EAAE,WAAW,CAAC,YAAY,CAAC,CAAC;IAChC,KAAK,CAAC,EAAE,eAAe,CAAC;IACxB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,SAAS,CAAC,EAAE,cAAc,CAAC,YAAY,CAAC,CAAC;IACzC,iBAAiB,CAAC,EAAE,cAAc,CAAC,mBAAmB,CAAC,CAAC;IACxD,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,kCAAkC;IAClC,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAC5B,kCAAkC;IAClC,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAC5B,kCAAkC;IAClC,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAC5B,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;CACtB;AAED,wBAAgB,UAAU,CAAC,EACzB,IAAI,EACJ,KAAe,EACf,QAAQ,EACR,MAAM,EACN,SAAS,EACT,iBAA4B,EAC5B,SAAS,EACT,UAAU,EACV,iBAAiB,EACjB,iBAAiB,EACjB,iBAAiB,EACjB,OAAO,GACR,EAAE,eAAe,GAAG,SAAS,CAsF7B;AAED,wBAAgB,eAAe,CAAC,KAAK,EAAE,MAAM,CAAC,eAAe,EAAE,MAAM,CAAC,GAAG,SAAS,CAEjF"}

package/dist/index-metro.es.android.js

@@ -8494,6 +8494,8 @@ function IconButton({
   testID,
   ariaLabel,
   accessibilityRole = 'button',
+  withBadge,
+  bagdeCount,
   isHoveredInternal,
   isPressedInternal,
   isFocusedInternal,
@@ -8535,26 +8537,55 @@ function IconButton({
     }) => {
       const isCurrentHovered = isHovered || isHoveredInternal;
       const isCurrentPressed = isPressed || isPressedInternal;
-      return /*#__PURE__*/jsxs(AnimatedScale, {
-        isDisabled: disabled,
-        isHovered: isCurrentHovered,
-        isPressed: isCurrentPressed,
-        scaleStyles: scaleStyles,
-        children: [/*#__PURE__*/jsx(AnimatedBackground, {
-          color: color,
+      return /*#__PURE__*/jsxs(Fragment, {
+        children: [/*#__PURE__*/jsxs(AnimatedScale, {
           isDisabled: disabled,
           isHovered: isCurrentHovered,
           isPressed: isCurrentPressed,
-          isFocused: isFocused || isFocusedInternal,
-          opacityStyles: opacityStyles
-        }), /*#__PURE__*/jsx(View, {
-          alignItems: "center",
-          justifyContent: "center",
-          children: /*#__PURE__*/jsx(TypographyIcon, {
-            color: getIconButtonTextColorByColor(color, disabled),
-            icon: icon
+          scaleStyles: scaleStyles,
+          children: [/*#__PURE__*/jsx(AnimatedBackground, {
+            color: color,
+            isDisabled: disabled,
+            isHovered: isCurrentHovered,
+            isPressed: isCurrentPressed,
+            isFocused: isFocused || isFocusedInternal,
+            opacityStyles: opacityStyles
+          }), /*#__PURE__*/jsx(View, {
+            alignItems: "center",
+            justifyContent: "center",
+            children: /*#__PURE__*/jsx(TypographyIcon, {
+              color: getIconButtonTextColorByColor(color, disabled),
+              icon: icon
+            })
+          })]
+        }), withBadge ? /*#__PURE__*/jsx(View, {
+          height: "10px",
+          width: "10px",
+          backgroundColor: lateOceanColorPalette['coral.10'],
+          borderRadius: "kitt.iconButton.borderRadius",
+          position: "absolute",
+          top: "1px",
+          right: "1px"
+        }) : null, !withBadge && bagdeCount && bagdeCount > 0 ? /*#__PURE__*/jsx(View, {
+          height: "20px",
+          width: "20px",
+          backgroundColor: lateOceanColorPalette['coral.10'],
+          borderRadius: "kitt.iconButton.borderRadius",
+          position: "absolute",
+          top: "-6px",
+          right: "-6px",
+          children: /*#__PURE__*/jsx(View, {
+            alignItems: "center",
+            justifyContent: "center",
+            marginTop: "2px",
+            children: /*#__PURE__*/jsx(Typography.Text, {
+              base: "body-xs",
+              variant: "bold",
+              color: "white",
+              children: bagdeCount > 5 ? '+5' : bagdeCount
+            })
           })
-        })]
+        }) : null]
       });
     }
   });