highcourt-affidavit-elements 0.2.11 → 0.2.12

package/dist/affidavit-library/browser/loader.js

@@ -13,9 +13,16 @@
  *         data-mode="live"
  *         data-template-id="1"
  *         data-app-id="APP123"
+ *         data-payload='{"key":"value"}'
  *         data-target="#affidavit-root"></script>
  * <div id="affidavit-root"></div>
  *
+ * Event listeners can be set up directly on the element:
+ * const element = document.querySelector('highcourt-affidavit');
+ * element.addEventListener('callBack', (event) => { ... });
+ * element.addEventListener('onPaymentSuccess', (event) => { ... });
+ * element.addEventListener('overlayClose', (event) => { ... });
+ *
  * Usage example (pay-affidavit):
  * <script src="https://cdn.your-domain.com/highcourt-affidavit-elements/v0.2.3/loader.js"
  *         data-component="pay-affidavit"
@@ -79,6 +86,7 @@
     var clientRef = getAttr('clientRef', 'data-client-ref') || '';
     var affidavitTemplateId = getAttr('affidavitTemplateId', 'data-affidavit-template-id') || '';
     var paymentRedirectUrl = getAttr('paymentRedirectUrl', 'data-payment-redirect-url') || '';
+    var payload = getAttr('payload', 'data-payload') || '';
 
     var src = currentScript && currentScript.src ? currentScript.src : '';
     var baseUrl = src ? src.substring(0, src.lastIndexOf('/') + 1) : './';
@@ -142,6 +150,15 @@
         el.setAttribute('mode', mode);
       }
 
+      // Set overlay attribute based on loader's overlay setting
+      // If loader overlay is enabled, disable component's internal overlay to avoid conflicts
+      // If loader overlay is disabled, let component handle its own overlay
+      if (overlayEnabled) {
+        el.setAttribute('overlay', 'false');
+      } else {
+        el.setAttribute('overlay', 'true');
+      }
+
       // Component-specific attributes
       if (componentType === 'highcourt-affidavit') {
         if (templateId) {
@@ -150,6 +167,15 @@
         if (appId) {
           el.setAttribute('app-id', appId);
         }
+        if (payload) {
+          // Try to parse as JSON if it looks like JSON, otherwise use as string
+          try {
+            var parsedPayload = JSON.parse(payload);
+            el.setAttribute('payload', JSON.stringify(parsedPayload));
+          } catch (e) {
+            el.setAttribute('payload', payload);
+          }
+        }
       } else if (componentType === 'pay-affidavit') {
         if (appNo) {
           el.setAttribute('app-no', appNo);
@@ -198,6 +224,11 @@
           if (mode && 'mode' in el) {
             el.mode = mode;
           }
+          // Set overlay property
+          if ('overlay' in el) {
+            el.overlay = overlayEnabled ? false : true;
+          }
+
           if (componentType === 'highcourt-affidavit') {
             if (templateId && 'templateId' in el) {
               el.templateId = templateId;
@@ -205,6 +236,14 @@
             if (appId && 'appId' in el) {
               el.appId = appId;
             }
+            if (payload && 'payload' in el) {
+              try {
+                var parsedPayload = JSON.parse(payload);
+                el.payload = parsedPayload;
+              } catch (e) {
+                el.payload = payload;
+              }
+            }
           } else if (componentType === 'pay-affidavit') {
             if (appNo) {
               if ('appNo' in el) {
@@ -256,6 +295,10 @@
       return el;
     }
 
+    // Note: Angular Elements automatically converts @Output() events to custom DOM events
+    // Users can listen directly: element.addEventListener('callBack', handler)
+    // No need to set up listeners here - Angular handles it automatically
+
     function ensureElement(host) {
       if (!host) return null;
       var el = host.querySelector(tag);
@@ -373,6 +416,17 @@
             applyAttributes(el);
           }
         }, 500);
+        // For components that use internal overlay system, trigger their overlay creation
+        // This ensures the component's overlay is properly initialized when shown via loader
+        setTimeout(function() {
+          if (el && typeof el.openAffidavitOverlay === 'function') {
+            try {
+              el.openAffidavitOverlay();
+            } catch (e) {
+              // Component might not have this method, ignore
+            }
+          }
+        }, 300);
       }
     }