ui.shipaid.com 0.3.103 → 0.3.105

package/dist/widget.es.js

@@ -2406,6 +2406,9 @@ const _ShipAidWidget = class _ShipAidWidget extends s$1 {
     this.customerId = void 0;
     this.supportSubscriptions = false;
     this.dataSelector = "";
+    this.buttonId = "";
+    this.buttonTitle = "";
+    this.buttonClasses = "";
     this.shadowRootSelector = "";
     this.useShipAidCheckout = false;
     this._apiEndpoint = "/apps/shipaid";
@@ -2434,7 +2437,7 @@ const _ShipAidWidget = class _ShipAidWidget extends s$1 {
     };
     this.getElementsBySelector = (selector) => {
       if (!selector) return [];
-      return document.querySelectorAll(`${selector}:not(#shipaid-checkout-button)`);
+      return document.querySelectorAll(`${selector}:not(#${this.buttonId || "shipaid-checkout-button"})`);
     };
     this.addStylesIfNeeded = () => {
       var _a2, _b2, _c2, _d, _e;
@@ -3004,7 +3007,7 @@ const _ShipAidWidget = class _ShipAidWidget extends s$1 {
               margin: var(--widget-margin, 0);
               padding: var(--widget-padding, 0);
             }
-            .shipaid-container a#shipaid-checkout-button {
+            .shipaid-container a#${this.buttonId || "shipaid-checkout-button"} {
               width: 100%;
               margin: 0px;
               text-decoration: unset;
@@ -3113,7 +3116,7 @@ const _ShipAidWidget = class _ShipAidWidget extends s$1 {
     return null;
   }
   checkoutButtonTemplate() {
-    var _a, _b, _c, _d, _e, _f, _g;
+    var _a, _b, _c, _d, _e, _f, _g, _h, _i;
     if (!document.getElementById("shipaid-styles")) {
       const style = document.createElement("style");
       style.id = "shipaid-styles";
@@ -3136,7 +3139,7 @@ const _ShipAidWidget = class _ShipAidWidget extends s$1 {
     if (this.shadowRootSelector) {
       const shadowHost = document.querySelector(this.shadowRootSelector);
       if (shadowHost && shadowHost.shadowRoot) {
-        originalCheckoutButton = shadowHost.shadowRoot.querySelector(`${this.dataSelector}:not(#shipaid-checkout-button)`);
+        originalCheckoutButton = shadowHost.shadowRoot.querySelector(`${this.dataSelector}:not(#${this.buttonId || "shipaid-checkout-button"})`);
       } else {
         console.warn(`ShadowRoot not found in the element '${this.shadowRootSelector}'.`);
         return;
@@ -3169,7 +3172,7 @@ const _ShipAidWidget = class _ShipAidWidget extends s$1 {
           width: 100%;
         }
 
-        .shipaid-container a#shipaid-checkout-button {
+        .shipaid-container a#${this.buttonId || "shipaid-checkout-button"} {
           width: 100%;
           margin: 0px;
           text-decoration: unset;
@@ -3276,24 +3279,27 @@ const _ShipAidWidget = class _ShipAidWidget extends s$1 {
           </div>
         </div>
         ${this._sellingPlanId ? x`
-            <button id="shipaid-checkout-button" class="${originalClasses}" @click=${async () => {
+            <button id="${this.buttonId || "shipaid-checkout-button"}" variant="${(_d = this._protectionVariant) == null ? void 0 : _d.id}" class="${this.buttonClasses || originalClasses}" @click=${async () => {
       var _a2, _b2;
       sessionStorage.setItem("shipaid_variant", JSON.stringify((_a2 = this._protectionVariant) == null ? void 0 : _a2.id));
       await this.addCartProtectionVariant();
       window.location.href = `/checkout?attributes[_shipaid-internal]=1&updates[${(_b2 = this._protectionVariant) == null ? void 0 : _b2.id}]=1`;
     }}>
-            <slot name="checkout-button-text">CHECKOUT+</slot> ${cartTotal ? this._currencyFormat(cartTotal) : loading2}
+            ${this.buttonTitle || x`<slot name="checkout-button-text">CHECKOUT+</slot> ${cartTotal ? this._currencyFormat(cartTotal) : loading2}`}
             </button>
             ` : x`
-          <a href="/checkout${((_d = this._protectionVariant) == null ? void 0 : _d.id) ? `?attributes[_shipaid-internal]=1&updates[${(_e = this._protectionVariant) == null ? void 0 : _e.id}]=1` : ""}" id="shipaid-checkout-button" class="${originalClasses}" @click=${() => {
+          <a variant="${(_e = this._protectionVariant) == null ? void 0 : _e.id}" href="/checkout${((_f = this._protectionVariant) == null ? void 0 : _f.id) ? `?attributes[_shipaid-internal]=1&updates[${(_g = this._protectionVariant) == null ? void 0 : _g.id}]=1` : ""}" id="${this.buttonId || "shipaid-checkout-button"}" class="${this.buttonClasses || originalClasses}" @click=${() => {
       var _a2;
       sessionStorage.setItem("shipaid_variant", JSON.stringify((_a2 = this._protectionVariant) == null ? void 0 : _a2.id));
     }}>
+          ${this.buttonTitle || x`
             <span class="shipaid-checkout-text">${translate("checkout-plus.checkout")}+</span>
             <span class="shipaid-checkout-amount">${cartTotal ? this._currencyFormat(cartTotal) : loading2}</span>
+        `}
+            
          </a>
       `}
-        <a href="/checkout${((_f = this._protectionVariant) == null ? void 0 : _f.id) ? `?attributes[_shipaid-internal]=1&updates[${(_g = this._protectionVariant) == null ? void 0 : _g.id}]=0` : ""}" class="continue-link">
+        <a href="/checkout${((_h = this._protectionVariant) == null ? void 0 : _h.id) ? `?attributes[_shipaid-internal]=1&updates[${(_i = this._protectionVariant) == null ? void 0 : _i.id}]=0` : ""}" class="continue-link">
           <slot name="link-continue">${translate("checkout-plus.continue")}</slot>
         </a>
       </div>
@@ -4051,6 +4057,15 @@ __decorateClass([
 __decorateClass([
   n$7({ type: String, attribute: "data-selector" })
 ], ShipAidWidget.prototype, "dataSelector");
+__decorateClass([
+  n$7({ type: String, attribute: "button-id" })
+], ShipAidWidget.prototype, "buttonId");
+__decorateClass([
+  n$7({ type: String, attribute: "button-title" })
+], ShipAidWidget.prototype, "buttonTitle");
+__decorateClass([
+  n$7({ type: String, attribute: "button-classes" })
+], ShipAidWidget.prototype, "buttonClasses");
 __decorateClass([
   n$7({ type: String, attribute: "shadow-root-selector" })
 ], ShipAidWidget.prototype, "shadowRootSelector");