feat(badge-patch): fix for badge text center (#67)

* feat(badge-patch): fix for badge text center * feat(fixed): empty line * feat(badge): fix comments
Vonage · Jun 20, 2024 · 62802f1 · 62802f1
1 parent cbf7887
commit 62802f1
Show file tree

Hide file tree

Showing 2 changed files with 22 additions and 0 deletions.
diff --git a/src/patches/index.js b/src/patches/index.js
@@ -4,3 +4,4 @@ export * from './VwcCard'
 export * from './vwcNoteContentOverflow'
 export * from './vwcSnackBarHtmlMessage'
 export * from './vwcSetAttributeValue'
+export * from './vwcBadge'
diff --git a/src/patches/vwcBadge.js b/src/patches/vwcBadge.js
@@ -0,0 +1,21 @@
+/**
+* Patches provided vivid-3 VwcBadge instance to show text in the center
+*
+* @param {HTMLElement} badgeElement - target element to apply behavior to
+* @example <VwcBadge ref={vwcBadgeShowTextCenterDecorator()} />
+*/
+export const vwcBadgeShowTextCenterDecorator = () => badgeElement =>
+    setTimeout(() => {
+        if (!badgeElement) {
+            return
+        }
+
+        if (badgeElement.shadowRoot) {
+            const span = badgeElement.shadowRoot.querySelector('span.base');
+            if (span) {
+                span.style.display = 'flex';
+                span.style.justifyContent = 'center';
+            }
+        }
+    }, 0)
+