@microlee666/dom-to-pptx 1.1.5 → 1.1.6

package/dist/dom-to-pptx.mjs

@@ -2751,16 +2751,36 @@ function prepareRenderItem(
       const className = (node.className || '').toLowerCase();
 
       // Real badges/pills typically have visible styling (background, border, or large border-radius)
-      const hasVisibleBackground = bgColorObj.hex && bgColorObj.opacity > 0.1;
+      const hasVisibleBackground = (bgColorObj.hex && bgColorObj.opacity > 0.1) || hasGradient;
       const hasVisibleBorder = borderWidth > 0;
       const hasLargeBorderRadius = borderRadius >= height / 2;
-      const hasBadgeClass = className.includes('badge') || className.includes('pill');
+      const hasBadgeClass = className.includes('badge') || className.includes('pill') || className.includes('tag');
+
+      // Check if it's a small tag/label with rounded corners and short text
+      const paddingLeft = parseFloat(style.paddingLeft) || 0;
+      const paddingRight = parseFloat(style.paddingRight) || 0;
+      const paddingTop = parseFloat(style.paddingTop) || 0;
+      const paddingBottom = parseFloat(style.paddingBottom) || 0;
+      const hasSmallPadding = Math.max(paddingLeft, paddingRight, paddingTop, paddingBottom) <= 12;
+      const hasEvenPadding = Math.abs(paddingTop - paddingBottom) <= 4 && Math.abs(paddingLeft - paddingRight) <= 8;
+      const hasRoundedCorners = borderRadius >= 3;
+      const isInlineBlock = style.display === 'inline-block' || style.display === 'inline-flex';
+
+      // Small tag detection: inline-block with background, rounded corners, small even padding, and short text
+      const isSmallTag =
+        isInlineBlock &&
+        hasVisibleBackground &&
+        hasRoundedCorners &&
+        hasSmallPadding &&
+        hasEvenPadding &&
+        textContent.length <= 10;
 
       // Only consider it a badge if it has visual styling AND short text
       const isLikelyBadge =
-        (hasLargeBorderRadius || hasBadgeClass) &&
-        textContent.length <= 10 &&
-        (hasVisibleBackground || hasVisibleBorder || hasLargeBorderRadius);
+        ((hasLargeBorderRadius || hasBadgeClass) &&
+          textContent.length <= 10 &&
+          (hasVisibleBackground || hasVisibleBorder || hasLargeBorderRadius)) ||
+        isSmallTag;
 
       if (isLikelyBadge) {
         align = 'center';