OZG-7773 mailbox icon with batch

alfa-client/libs/design-system/src/lib/icons/mailbox-icon/mailbox-icon.component.ts

@@ -30,7 +30,8 @@ import { IconVariants, iconVariants } from '../iconVariants';
   selector: 'ods-mailbox-icon',
   standalone: true,
   imports: [NgClass],
-  template: `<svg
+  template: ` <div class="relative inline-block">
+    <svg
       viewBox="0 0 24 24"
       fill="none"
       xmlns="http://www.w3.org/2000/svg"
@@ -48,11 +49,19 @@ import { IconVariants, iconVariants } from '../iconVariants';
         stroke-linecap="round"
         stroke-linejoin="round"
       />
-  </svg>`,
+    </svg>
+    @if (showBadge) {
+      <div
+        [ngClass]="twMerge('absolute right-0.5 top-1 h-2.5 w-2.5 -translate-y-1/2 translate-x-1/2 rounded-full', badgeClass)"
+      ></div>
+    }
+  </div>`,
 })
 export class MailboxIconComponent {
   @Input() size: IconVariants['size'] = 'medium';
   @Input() class: string = undefined;
+  @Input() showBadge: boolean = false;
+  @Input() badgeClass: string = undefined;
 
   readonly iconVariants = iconVariants;
   readonly twMerge = twMerge;