Fix EMI Tenure Bug in HTML Implementation

Nebula/sample.html

@@ -12,11 +12,11 @@
 
     <!-- <div id="settle-widget-container"></div> -->
 
-    <p
+    <!-- <p
       onclick="showSettleWidget({
     'total-order-value': '98450',
     'show-button': 'false',
-    'onboard-button': 'false',
+    'onboard-button': 'true',
     'currency': '₹',
     'theme': 'rgb(220, 20, 60)',
     'emi-tenure': '[3, 6, 9]',
@@ -28,23 +28,24 @@
     })"
     >
       View EMI Options
-    </p>
+    </p> -->
 
-    <!-- <settle-widget
-      total-order-value= "2000",
+    <settle-widget
+      total-order-value= "5000",
       selector= "#settle-widget-container",
       button-text= "in flexible installments",
       logo-position= "left",
       currency= "₹",
       theme= "rgb(220, 20, 60)",
-      emi-tenure= "[3, 6, 9]",
+      emi-tenure= "[3, 6]",
       show-product-name= "true",
       show-product-image= "true",
       show-suggested= "true",
       suggested-month= "9",
+      show-modal-preview= "false"
       product-name= "The Transit Luggage - Cabin, Green Lurex Embroidered Tier Dress",
       product-image= "https://cdn.fynd.com/v2/falling-surf-7c8bb8/fyndnp/wrkr/x5/products/pictures/item/free/resize-w:800/e0r0ygn1e-black-shirt.png",
-    /> -->
+    />
 
     <!-- <settle-widget
       emi-tenure= "[3, 6, 9]"

Nebula/widget.js

@@ -53,12 +53,15 @@ class SettlePopupWidget extends HTMLElement {
     };
 
     this.attachShadow({ mode: "open" });
-    this.renderAndBindListners();
+    if (props.selector) {
+      this.renderAndBindListners();
+    }
   }
 
   connectedCallback() {
     if (!this.initialRenderDone) {
       this.initialRenderDone = true;
+      this.renderAndBindListners();
     }
   }
 
@@ -256,6 +259,8 @@ class SettlePopupWidget extends HTMLElement {
 
     try {
       emiTenure = JSON.parse(emiTenure);
+
+      // Filter out invalid values and convert to array if necessary
       if (Array.isArray(emiTenure)) {
         emiTenure = emiTenure
           .map(Number)