From 0c50e78607b3f24e3bd2fa6a5eed83b447d28bea Mon Sep 17 00:00:00 2001
From: Axel Cureno Basurto <axel@adobe.com>
Date: Mon, 24 Jun 2024 11:54:24 -0700
Subject: [PATCH] Mwpw-147034: Custom border color + badge/border color
 decoupling [Merch card]

---
 web-components/src/merch-card.js | 7 +++++--
 1 file changed, 5 insertions(+), 2 deletions(-)

diff --git a/web-components/src/merch-card.js b/web-components/src/merch-card.js
index 330773de..8bc47a1f 100644
--- a/web-components/src/merch-card.js
+++ b/web-components/src/merch-card.js
@@ -33,6 +33,7 @@ export class MerchCard extends LitElement {
         variant: { type: String, reflect: true },
         size: { type: String, attribute: 'size', reflect: true },
         badgeColor: { type: String, attribute: 'badge-color' },
+        borderColor: { type: String, attribute: 'border-color' },
         badgeBackgroundColor: {
             type: String,
             attribute: 'badge-background-color',
@@ -110,10 +111,12 @@ export class MerchCard extends LitElement {
 
     updated(changedProperties) {
         if (
-            changedProperties.has('badgeBackgroundColor') &&
+            (changedProperties.has('badgeBackgroundColor') || changedProperties.has('borderColor')) &&
             this.variant !== 'twp'
         ) {
-            this.style.border = `1px solid ${this.badgeBackgroundColor}`;
+            this.style.border = `1px solid ${
+                this.borderColor ? this.borderColor : this.badgeBackgroundColor
+            }`;
         }
         this.updateComplete.then(async () => {
             const prices = Array.from(