@ornikar/kitt-universal 25.52.0 → 25.53.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -8465,6 +8465,8 @@ function IconButton({
8465
8465
  testID,
8466
8466
  ariaLabel,
8467
8467
  accessibilityRole = 'button',
8468
+ withBadge,
8469
+ bagdeCount,
8468
8470
  isHoveredInternal,
8469
8471
  isPressedInternal,
8470
8472
  isFocusedInternal,
@@ -8506,26 +8508,55 @@ function IconButton({
8506
8508
  }) => {
8507
8509
  const isCurrentHovered = isHovered || isHoveredInternal;
8508
8510
  const isCurrentPressed = isPressed || isPressedInternal;
8509
- return /*#__PURE__*/jsxs(AnimatedScale, {
8510
- isDisabled: disabled,
8511
- isHovered: isCurrentHovered,
8512
- isPressed: isCurrentPressed,
8513
- scaleStyles: scaleStyles,
8514
- children: [/*#__PURE__*/jsx(AnimatedBackground, {
8515
- color: color,
8511
+ return /*#__PURE__*/jsxs(Fragment, {
8512
+ children: [/*#__PURE__*/jsxs(AnimatedScale, {
8516
8513
  isDisabled: disabled,
8517
8514
  isHovered: isCurrentHovered,
8518
8515
  isPressed: isCurrentPressed,
8519
- isFocused: isFocused || isFocusedInternal,
8520
- opacityStyles: opacityStyles
8521
- }), /*#__PURE__*/jsx(View, {
8522
- alignItems: "center",
8523
- justifyContent: "center",
8524
- children: /*#__PURE__*/jsx(TypographyIcon, {
8525
- color: getIconButtonTextColorByColor(color, disabled),
8526
- icon: icon
8516
+ scaleStyles: scaleStyles,
8517
+ children: [/*#__PURE__*/jsx(AnimatedBackground, {
8518
+ color: color,
8519
+ isDisabled: disabled,
8520
+ isHovered: isCurrentHovered,
8521
+ isPressed: isCurrentPressed,
8522
+ isFocused: isFocused || isFocusedInternal,
8523
+ opacityStyles: opacityStyles
8524
+ }), /*#__PURE__*/jsx(View, {
8525
+ alignItems: "center",
8526
+ justifyContent: "center",
8527
+ children: /*#__PURE__*/jsx(TypographyIcon, {
8528
+ color: getIconButtonTextColorByColor(color, disabled),
8529
+ icon: icon
8530
+ })
8531
+ })]
8532
+ }), withBadge ? /*#__PURE__*/jsx(View, {
8533
+ height: "10px",
8534
+ width: "10px",
8535
+ backgroundColor: lateOceanColorPalette['coral.10'],
8536
+ borderRadius: "kitt.iconButton.borderRadius",
8537
+ position: "absolute",
8538
+ top: "1px",
8539
+ right: "1px"
8540
+ }) : null, !withBadge && bagdeCount && bagdeCount > 0 ? /*#__PURE__*/jsx(View, {
8541
+ height: "20px",
8542
+ width: "20px",
8543
+ backgroundColor: lateOceanColorPalette['coral.10'],
8544
+ borderRadius: "kitt.iconButton.borderRadius",
8545
+ position: "absolute",
8546
+ top: "-6px",
8547
+ right: "-6px",
8548
+ children: /*#__PURE__*/jsx(View, {
8549
+ alignItems: "center",
8550
+ justifyContent: "center",
8551
+ marginTop: "2px",
8552
+ children: /*#__PURE__*/jsx(Typography.Text, {
8553
+ base: "body-xs",
8554
+ variant: "bold",
8555
+ color: "white",
8556
+ children: bagdeCount > 5 ? '+5' : bagdeCount
8557
+ })
8527
8558
  })
8528
- })]
8559
+ }) : null]
8529
8560
  });
8530
8561
  }
8531
8562
  });