@unvired/turboforms-embed-sdk 1.0.10 → 1.0.12

package/dist/unvired-form-sdk.html

@@ -736,6 +736,14 @@ body {
   /* subtle shadow for elevation */
 }
 
+
+#submitBtn,
+#saveBtn {
+  width: 110px;
+  display: flex;
+  justify-content: space-evenly;
+}
+
 .form-cmt-btn {
   width: 40px;
   height: 40px;
@@ -771,8 +779,9 @@ body {
   width: 100%;
   background-color: #ffffff;
   padding: 6px;
-  justify-content: space-between;
+  justify-content: flex-end;
   align-items: center;
+  gap: 8px;
   border-top: 1px solid #ddd;
   z-index: 1000;
   box-shadow: 0 -2px 6px rgba(0, 0, 0, 0.05);
@@ -784,18 +793,20 @@ body {
   display: none;
   position: absolute;
   bottom: 100%;
-  left: 0;
-  margin-bottom: 10px;
+  left: -170px;
+  margin-bottom: 16px;
   background-color: #fff;
   border: 1px solid #ddd;
   box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
   padding: 6px;
   border-radius: 6px;
-  z-index: 9999;
+  z-index: 1000;
   flex-direction: column;
   gap: 0px;
 }
 
+#unvired-more-btn {}
+
 /* Print and PDF Modes */
 @media print {
 
@@ -1007,7 +1018,6 @@ body {
 
 @keyframes sdk-pulse {
 
-  0%,
   100% {
     opacity: 1;
   }
@@ -1015,6 +1025,48 @@ body {
   50% {
     opacity: 0.5;
   }
+}
+
+/* Responsive Footer for Mobile */
+@media (max-width: 600px) {
+  #sticky-footer {
+    justify-content: flex-end;
+    padding: 4px;
+    gap: 4px;
+  }
+
+  #submitBtn {
+
+    width: 105px;
+    min-width: 108px;
+    flex-grow: 0;
+  }
+
+
+  #saveBtn {
+    width: 80px;
+    min-width: 90px;
+    flex-grow: 0;
+  }
+
+  #unvired-more-btn {
+    margin-left: 10px;
+    margin-right: 10px;
+  }
+
+  /* Fix tooltip on mobile to prevent cutoff */
+  #moreTooltip {
+    position: fixed;
+    bottom: 70px;
+    left: 20px;
+    right: 20px;
+    width: auto;
+    margin-bottom: 0;
+    max-width: 300px;
+    margin-left: auto;
+    margin-right: auto;
+
+  }
 }</style>
     <style>.r6o-drawing{cursor:none}.r6o-relations-layer.readonly .handle rect{pointer-events:none}.r6o-relations-layer{position:absolute;top:0;left:0;width:100%;height:100%;pointer-events:none}.r6o-relations-layer circle{stroke:#515151;stroke-width:.4;fill:#3f3f3f}.r6o-relations-layer path{stroke:#595959;stroke-linecap:round;stroke-linejoin:round;fill:transparent}.r6o-relations-layer path.connection{stroke-width:1.6;stroke-dasharray:2,3}.r6o-relations-layer path.r6o-arrow{stroke-width:1.8;fill:#7f7f7f}.r6o-relations-layer .handle rect{stroke-width:1;stroke:#595959;fill:#fff;pointer-events:auto;cursor:pointer}.r6o-relations-layer .handle text{font-size:10px}.r6o-relations-layer .hover{stroke:rgba(63,63,63,.9);stroke-width:1.4;fill:transparent}
 .r6o-btn{background-color:#4483c4;border:1px solid #4483c4;box-sizing:border-box;color:#fff;cursor:pointer;display:inline-block;font-size:14px;margin:0;outline:none;text-decoration:none;white-space:nowrap;padding:6px 18px;min-width:70px;vertical-align:middle;-webkit-border-radius:2px;-khtml-border-radius:2px;-moz-border-radius:2px;border-radius:2px}.r6o-btn *{vertical-align:middle;cursor:pointer}.r6o-btn .r6o-icon{margin-right:4px}.r6o-btn:disabled{border-color:#a3c2e2 !important;background-color:#a3c2e2 !important}.r6o-btn:hover{background-color:#4f92d7;border-color:#4f92d7}.r6o-btn.outline{border:1px solid #4483c4;color:#4483c4;background-color:transparent;text-shadow:none}.r6o-autocomplete{display:inline;position:relative}.r6o-autocomplete div[role=combobox]{display:inline}.r6o-autocomplete input{outline:none;border:none;width:80px;height:100%;line-height:14px;white-space:pre;box-sizing:border-box;background-color:transparent;font-size:14px;color:#3f3f3f}.r6o-autocomplete ul{position:absolute;margin:0;padding:0;list-style-type:none;background-color:#fff;border-radius:3px;border:1px solid #d6d7d9;box-sizing:border-box;box-shadow:0 0 20px rgba(0,0,0,.25)}.r6o-autocomplete ul:empty{display:none}.r6o-autocomplete li{box-sizing:border-box;padding:2px 12px;width:100%;cursor:pointer}.r6o-editable-text{max-height:120px;overflow:auto;outline:none;min-height:2em;font-size:14px;font-family:"Lato",sans-serif}.r6o-editable-text:empty:not(:focus):before{content:attr(data-placeholder);color:#c2c2c2}.r6o-widget.comment{font-size:14px;min-height:3em;background-color:#fff;position:relative}.r6o-widget.comment .r6o-editable-text,.r6o-widget.comment .r6o-readonly-comment{padding:10px;width:100%;box-sizing:border-box;outline:none;border:none;background-color:transparent;resize:none}.r6o-widget.comment .r6o-readonly-comment{white-space:pre}.r6o-widget.comment .r6o-editable-text::-webkit-input-placeholder{color:#c2c2c2}.r6o-widget.comment .r6o-editable-text::-moz-placeholder{color:#c2c2c2}.r6o-widget.comment .r6o-editable-text:-moz-placeholder{color:#c2c2c2}.r6o-widget.comment .r6o-editable-text:-ms-input-placeholder{color:#c2c2c2}.r6o-widget.comment .r6o-lastmodified{border:1px solid #e5e5e5;display:inline-block;border-radius:2px;margin:0 10px 8px 10px;padding:4px 5px;line-height:100%;font-size:12px}.r6o-widget.comment .r6o-lastmodified .r6o-lastmodified-at{color:#757575;padding-left:3px}.r6o-widget.comment .r6o-arrow-down{position:absolute;height:20px;width:20px;top:9px;right:9px;line-height:22px;background-color:#fff;text-align:center;-webkit-font-smoothing:antialiased;border:1px solid #e5e5e5;cursor:pointer;-webkit-border-radius:1px;-khtml-border-radius:1px;-moz-border-radius:1px;border-radius:1px}.r6o-widget.comment .r6o-arrow-down.r6o-menu-open{border-color:#4483c4}.r6o-widget.comment .r6o-comment-dropdown-menu{position:absolute;top:32px;right:8px;background-color:#fff;border:1px solid #e5e5e5;list-style-type:none;margin:0;padding:5px 0;z-index:9999;-webkit-box-shadow:0 2px 4px rgba(0,0,0,.2);-moz-box-shadow:0 2px 4px rgba(0,0,0,.2);box-shadow:0 2px 4px rgba(0,0,0,.2)}.r6o-widget.comment .r6o-comment-dropdown-menu li{padding:0 15px;cursor:pointer}.r6o-widget.comment .r6o-comment-dropdown-menu li:hover{background-color:#ecf0f1}.r6o-widget.comment .r6o-purposedropdown{position:relative;z-index:2}.r6o-widget.comment.editable{background-color:#ecf0f1}.r6o-widget.r6o-tag:empty{display:none}@media all and (-ms-high-contrast: none),(-ms-high-contrast: active){.r6o-widget.tag .r6o-taglist li{height:27px}.r6o-widget.tag .r6o-taglist li .r6o-delete-wrapper .r6o-delete{position:relative;top:-4px}}.r6o-widget.r6o-tag{background-color:#ecf0f1;border-bottom:1px solid #e5e5e5;padding:1px 3px;display:flex}.r6o-widget.r6o-tag ul{margin:0;padding:0;list-style-type:none;z-index:1}.r6o-widget.r6o-tag ul.r6o-taglist{flex:0;white-space:nowrap}.r6o-widget.r6o-tag ul.r6o-taglist li{margin:0;display:inline-block;margin:1px 1px 1px 0;padding:0;vertical-align:middle;overflow:hidden;font-size:12px;background-color:#fff;border:1px solid #d6d7d9;cursor:pointer;position:relative;line-height:180%;-webkit-touch-callout:none;-webkit-user-select:none;-khtml-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;-webkit-border-radius:2px;-khtml-border-radius:2px;-moz-border-radius:2px;border-radius:2px;-webkit-box-shadow:0 0 4px rgba(0,0,0,.1);-moz-box-shadow:0 0 4px rgba(0,0,0,.1);box-shadow:0 0 4px rgba(0,0,0,.1)}.r6o-widget.r6o-tag ul.r6o-taglist li .r6o-label{padding:2px 8px;display:inline-block}.r6o-widget.r6o-tag ul.r6o-taglist li .r6o-delete-wrapper{display:inline-block;padding:2px 0;color:#fff;width:0;height:100%;background-color:#4483c4;-webkit-border-top-right-radius:2px;-webkit-border-bottom-right-radius:2px;-khtml-border-radius-topright:2px;-khtml-border-radius-bottomright:2px;-moz-border-radius-topright:2px;-moz-border-radius-bottomright:2px;border-top-right-radius:2px;border-bottom-right-radius:2px}.r6o-widget.r6o-tag ul.r6o-taglist li .r6o-delete-wrapper .r6o-delete{padding:2px 6px}.r6o-widget.r6o-tag ul.r6o-taglist li .r6o-delete-wrapper svg{vertical-align:text-top}.r6o-widget.r6o-tag ul.r6o-taglist li .r6o-delete-enter-active{width:24px;transition:width 200ms}.r6o-widget.r6o-tag ul.r6o-taglist li .r6o-delete-enter-done{width:24px}.r6o-widget.r6o-tag ul.r6o-taglist li .r6o-delete-exit{width:24px}.r6o-widget.r6o-tag ul.r6o-taglist li .r6o-delete-exit-active{width:0;transition:width 200ms}.r6o-widget.r6o-tag .r6o-autocomplete{flex:1;position:relative}.r6o-widget.r6o-tag .r6o-autocomplete li{font-size:14px}.r6o-widget.r6o-tag input{width:100%;padding:0 3px;min-width:80px;outline:none;border:none;line-height:170%;background-color:transparent;color:#3f3f3f}.r6o-widget.r6o-tag input::-webkit-input-placeholder{color:#c2c2c2}.r6o-widget.r6o-tag input::-moz-placeholder{color:#c2c2c2}.r6o-widget.r6o-tag input:-moz-placeholder{color:#c2c2c2}.r6o-widget.r6o-tag input:-ms-input-placeholder{color:#c2c2c2}.r6o-editor{position:absolute;z-index:99999;width:400px;color:#3f3f3f;opacity:0;font-family:"Lato",sans-serif;font-size:17px;line-height:27px;-webkit-transition:opacity .2s ease-in;-moz-transition:opacity .2s ease-in;transition:opacity .2s ease-in}.r6o-editor .r6o-arrow{position:absolute;overflow:hidden;top:-12px;left:12px;width:28px;height:12px;display:none}.r6o-editor .r6o-arrow:after{content:"";position:absolute;top:5px;left:5px;width:18px;height:18px;background-color:#fff;-webkit-backface-visibility:hidden;-webkit-transform:rotate(45deg);-moz-transform:rotate(45deg);-ms-transform:rotate(45deg);-o-transform:rotate(45deg);transform:rotate(45deg)}.r6o-editor .r6o-editor-inner{background-color:#fff;-webkit-border-radius:2px;-khtml-border-radius:2px;-moz-border-radius:2px;border-radius:2px;-webkit-box-shadow:2px 2px 42px rgba(0,0,0,.4);-moz-box-shadow:2px 2px 42px rgba(0,0,0,.4);box-shadow:2px 2px 42px rgba(0,0,0,.4)}.r6o-editor .r6o-editor-inner .r6o-widget:first-child{-webkit-border-top-left-radius:2px;-webkit-border-top-right-radius:2px;-khtml-border-radius-topleft:2px;-khtml-border-radius-topright:2px;-moz-border-radius-topleft:2px;-moz-border-radius-topright:2px;border-top-left-radius:2px;border-top-right-radius:2px}.r6o-editor .r6o-editor-inner .r6o-widget{border-bottom:1px solid #e5e5e5}.r6o-editor .r6o-footer{position:relative;text-align:right;padding:8px 0}.r6o-editor .r6o-footer .r6o-btn{margin-right:8px}.r6o-editor .r6o-footer .r6o-btn.delete-annotation{position:absolute;top:7px;left:7px;background-color:transparent;border:none;color:#4483c4;width:32px;height:32px;min-width:0;border-radius:100%;padding:0;display:flex;justify-content:center;align-items:center;-webkit-transition:all .1s ease-in;-moz-transition:all .1s ease-in;-o-transition:all .1s ease-in;transition:all .1s ease-in}.r6o-editor .r6o-footer .r6o-btn.delete-annotation:hover{color:#fff;background-color:#ef352c}@media(max-width: 640px){.r6o-editor{width:260px}}.r6o-editor.r6o-arrow-top .r6o-arrow{display:block}.r6o-editor.r6o-arrow-right{margin-left:8px}.r6o-editor.r6o-arrow-right .r6o-arrow{left:auto;right:12px}.r6o-editor.r6o-arrow-bottom .r6o-arrow{display:block;top:auto;bottom:-12px}.r6o-editor.r6o-arrow-bottom .r6o-arrow::after{top:-11px;box-shadow:none}.r6o-editor.pushed .r6o-arrow,.r6o-editor.dragged .r6o-arrow{display:none}.r6o-editor .r6o-draggable{cursor:move}.r6o-purposedropdown{width:150px;display:inline-block}.r6o-noselect{-webkit-touch-callout:none;-webkit-user-select:none;-khtml-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.r6o-editor{margin-left:-12px}.r6o-annotation{background-color:rgba(255,165,0,.2);border-bottom:2px solid orange;cursor:pointer}.r6o-selection{background-color:rgba(207,207,255,.63);cursor:pointer}.r6o-hide-selection::selection,.r6o-hide-selection ::selection{background:transparent}.r6o-hide-selection::-moz-selection .r6o-hide-selection ::-moz-selection{background:transparent}.r6o-relation-editor{position:absolute;font-family:"Lato",sans-serif;font-size:17px;line-height:27px;-webkit-box-shadow:0 1px 14px rgba(0,0,0,.4);-moz-box-shadow:0 1px 14px rgba(0,0,0,.4);box-shadow:0 1px 14px rgba(0,0,0,.4);-webkit-border-radius:3px;-khtml-border-radius:3px;-moz-border-radius:3px;border-radius:3px;transform:translate(-50%, -50%);background-color:#fff}.r6o-relation-editor svg{vertical-align:middle;shape-rendering:geometricPrecision}.r6o-relation-editor *{box-sizing:border-box}.r6o-relation-editor .input-wrapper{height:34px;padding:0 6px;margin-right:68px;font-size:14px;background-color:#ecf0f1;cursor:text;-webkit-border-top-left-radius:3px;-webkit-border-bottom-left-radius:3px;-khtml-border-radius-topleft:3px;-khtml-border-radius-bottomleft:3px;-moz-border-radius-topleft:3px;-moz-border-radius-bottomleft:3px;border-top-left-radius:3px;border-bottom-left-radius:3px}.r6o-relation-editor .input-wrapper .r6o-autocomplete ul{position:relative;left:-6px}.r6o-relation-editor .buttons{position:absolute;display:inline-flex;top:0;right:0}.r6o-relation-editor .buttons span{height:34px;display:inline-block;width:34px;text-align:center;font-size:14px;cursor:pointer;padding:1px 0}.r6o-relation-editor .buttons .delete{background-color:#fff;color:#9ca4b1;border-left:1px solid #e5e5e5}.r6o-relation-editor .buttons .delete:hover{background-color:#f6f6f6}.r6o-relation-editor .buttons .ok{background-color:#4483c4;color:#fff;-webkit-border-top-right-radius:3px;-webkit-border-bottom-right-radius:3px;-khtml-border-radius-topright:3px;-khtml-border-radius-bottomright:3px;-moz-border-radius-topright:3px;-moz-border-radius-bottomright:3px;border-top-right-radius:3px;border-bottom-right-radius:3px}.r6o-relation-editor .buttons .ok:hover{background-color:#4f92d7}
@@ -40723,6 +40775,14 @@ body {
   /* subtle shadow for elevation */
 }
 
+
+#submitBtn,
+#saveBtn {
+  width: 110px;
+  display: flex;
+  justify-content: space-evenly;
+}
+
 .form-cmt-btn {
   width: 40px;
   height: 40px;
@@ -40758,8 +40818,9 @@ body {
   width: 100%;
   background-color: #ffffff;
   padding: 6px;
-  justify-content: space-between;
+  justify-content: flex-end;
   align-items: center;
+  gap: 8px;
   border-top: 1px solid #ddd;
   z-index: 1000;
   box-shadow: 0 -2px 6px rgba(0, 0, 0, 0.05);
@@ -40771,18 +40832,20 @@ body {
   display: none;
   position: absolute;
   bottom: 100%;
-  left: 0;
-  margin-bottom: 10px;
+  left: -170px;
+  margin-bottom: 16px;
   background-color: #fff;
   border: 1px solid #ddd;
   box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
   padding: 6px;
   border-radius: 6px;
-  z-index: 9999;
+  z-index: 1000;
   flex-direction: column;
   gap: 0px;
 }
 
+#unvired-more-btn {}
+
 /* Print and PDF Modes */
 @media print {
 
@@ -40994,7 +41057,6 @@ body {
 
 @keyframes sdk-pulse {
 
-  0%,
   100% {
     opacity: 1;
   }
@@ -41002,6 +41064,48 @@ body {
   50% {
     opacity: 0.5;
   }
+}
+
+/* Responsive Footer for Mobile */
+@media (max-width: 600px) {
+  #sticky-footer {
+    justify-content: flex-end;
+    padding: 4px;
+    gap: 4px;
+  }
+
+  #submitBtn {
+
+    width: 105px;
+    min-width: 108px;
+    flex-grow: 0;
+  }
+
+
+  #saveBtn {
+    width: 80px;
+    min-width: 90px;
+    flex-grow: 0;
+  }
+
+  #unvired-more-btn {
+    margin-left: 10px;
+    margin-right: 10px;
+  }
+
+  /* Fix tooltip on mobile to prevent cutoff */
+  #moreTooltip {
+    position: fixed;
+    bottom: 70px;
+    left: 20px;
+    right: 20px;
+    width: auto;
+    margin-bottom: 0;
+    max-width: 300px;
+    margin-left: auto;
+    margin-right: auto;
+
+  }
 }</style>
 
     <script>
@@ -41547,6 +41651,14 @@ async function startCameraScanner() {
 
     showBarcodeError(errorMessage);
     setTimeout(() => closeScannerModal(), 3000);
+
+    if (window.sendEventCallback) {
+      window.sendEventCallback({
+        type: "ERROR",
+        errorMessage: "ErrorCode : 012, Camera access error",
+        data: { technicalError: err, reason: errorMessage }
+      });
+    }
   }
 }
 
@@ -41927,7 +42039,7 @@ function injectBarcodeModalStyles() {
 </script>
     <script>
 // Listen for "getLocation" custom event
-  document.addEventListener("getLocation", function (event) {
+document.addEventListener("getLocation", function (event) {
   const { compObj, controlId } = event.detail;
   window.compId = controlId;
   getLocationFromBrowser(controlId); // Pass controlId to getLocationFromBrowser
@@ -41937,7 +42049,7 @@ function injectBarcodeModalStyles() {
 function getLocationFromBrowser(componentID) {
   // Check if running in Cordova environment
   const isCordova = !!(window.cordova || window.PhoneGap || window.phonegap);
-  
+
   if (!navigator.geolocation) {
     showLocationError("Geolocation is not supported by this device.");
     return;
@@ -41958,7 +42070,7 @@ function getLocationFromBrowser(componentID) {
           showLocationError("Location permission was denied. Please enable it in browser settings and refresh the page.");
           return;
         }
-        
+
         if (permissionStatus.state === "granted" || permissionStatus.state === "prompt") {
           requestLocation(componentID);
         }
@@ -41976,7 +42088,7 @@ function getLocationFromBrowser(componentID) {
 
 function requestLocation(componentID) {
   const isCordova = !!(window.cordova || window.PhoneGap || window.phonegap);
-  
+
   const options = {
     enableHighAccuracy: true,
     timeout: isCordova ? 30000 : 10000, // Longer timeout for Cordova
@@ -41993,7 +42105,7 @@ function requestLocation(componentID) {
         },
       });
       document.dispatchEvent(customEvent);
-      
+
       // Send success event
       if (window.sendEventCallback) {
         window.sendEventCallback({
@@ -42011,36 +42123,36 @@ function requestLocation(componentID) {
 }
 
 function handleLocationError(error) {
-  let errorMessage = "Unable to retrieve location";
-  let errorCode = "008";
-  
+  let errorMessage = "Location unknown error";
+  let errorCode = "011";
+
   switch (error.code) {
     case error.PERMISSION_DENIED:
-      errorMessage = "Location permission denied. Please allow location access and try again.";
+      errorMessage = "Location permission denied";
       errorCode = "008";
       break;
     case error.POSITION_UNAVAILABLE:
-      errorMessage = "Location information is unavailable. Please check your GPS settings.";
+      errorMessage = "Location unavailable";
       errorCode = "009";
       break;
     case error.TIMEOUT:
-      errorMessage = "Location request timed out. Please try again.";
+      errorMessage = "Location request timeout";
       errorCode = "010";
       break;
     default:
-      errorMessage = "An unknown error occurred while retrieving location.";
+      errorMessage = "Location unknown error";
       errorCode = "011";
       break;
   }
-  
+
   showLocationError(errorMessage);
   console.error("Geolocation error:", error);
-  
+
   // Send error event
   if (window.sendEventCallback) {
     window.sendEventCallback({
       type: "ERROR",
-  errorMessage: `ErrorCode : ${errorCode}, Location error. Contact your admin or tech team.`,
+      errorMessage: `ErrorCode : ${errorCode}, ${errorMessage}`,
       data: { technicalError: error, reason: errorMessage }
     });
   }
@@ -42065,9 +42177,9 @@ function showLocationError(message) {
     text-align: center;
   `;
   errorDiv.textContent = message;
-  
+
   document.body.appendChild(errorDiv);
-  
+
   // Remove after 5 seconds
   setTimeout(() => {
     if (errorDiv.parentNode) {
@@ -42107,15 +42219,18 @@ let capturedImageData = "";
 function openCameraModal() {
   injectCameraModalStyles();
 
+  // Ensure clean slate: Remove any existing modal if present
   const existingModal = document.getElementById("cameraModal");
+  if (existingModal) {
+    existingModal.remove();
+  }
 
   capturedImageData = "";
 
-  if (!existingModal) {
-    const modalHTML = `
+  const modalHTML = `
   <div id="cameraModal">
     <div id="cameraContainer">
-      <video id="cameraVideo" autoplay playsinline style="opacity: 0;"></video>
+      <video id="cameraVideo" playsinline webkit-playsinline muted style="opacity: 0; pointer-events: none;"></video>
       <div id="cameraLoader">
         <div class="loader-spinner"></div>
         <p class="loader-text">Starting camera...</p>
@@ -42126,6 +42241,11 @@ function openCameraModal() {
             <path d="M18 6L6 18M6 6L18 18" stroke="white" stroke-width="2" stroke-linecap="round"/>
           </svg>
         </button>
+        <div class="camera-select-container">
+          <select id="cameraSelect" class="camera-select">
+            <option value="" disabled selected>Select Camera</option>
+          </select>
+        </div>
         <div id="captureButton" style="opacity: 0; pointer-events: none;">
           <div class="capture-ring">
             <div class="capture-inner"></div>
@@ -42135,35 +42255,18 @@ function openCameraModal() {
     </div>
   </div>
 `;
-    document.body.insertAdjacentHTML("beforeend", modalHTML);
-    document.getElementById("closeCameraBtn").addEventListener("click", closeCameraModal);
-    document.getElementById("captureButton").addEventListener("click", captureImage);
-  } else {
-    existingModal.style.display = "block";
-
-    // Reset UI state when reopening
-    const video = document.getElementById("cameraVideo");
-    const loader = document.getElementById("cameraLoader");
-    const captureBtn = document.getElementById("captureButton");
-
-    if (video) {
-      video.style.opacity = "0";
-      video.srcObject = null;
-    }
-    if (loader) {
-      loader.style.display = "flex";
-      loader.style.opacity = "1";
-    }
-    if (captureBtn) {
-      captureBtn.style.opacity = "0";
-      captureBtn.style.pointerEvents = "none";
-    }
-  }
+  document.body.insertAdjacentHTML("beforeend", modalHTML);
+  document.getElementById("closeCameraBtn").addEventListener("click", closeCameraModal);
+  document.getElementById("captureButton").addEventListener("click", captureImage);
+  document.getElementById("cameraSelect").addEventListener("change", (e) => {
+    startCameraStream(e.target.value);
+  });
 
+  // Small delay to ensure DOM is ready
   setTimeout(startCameraStream, 100);
 }
 
-async function startCameraStream() {
+async function startCameraStream(deviceId = null) {
   if (videoStream) {
     try {
       videoStream.getTracks().forEach(track => track.stop());
@@ -42174,42 +42277,84 @@ async function startCameraStream() {
   }
 
   try {
+    const isIOS = /iPad|iPhone|iPod/.test(navigator.userAgent) || (window.platform && window.platform.iosPlatform);
+
+    // Check if API is supported
+    if (!navigator.mediaDevices || !navigator.mediaDevices.getUserMedia) {
+      const errorMsg = "Camera API is not supported. Please ensure you are using HTTPS or localhost.";
+      alert(errorMsg);
+      showCameraError(errorMsg);
+      return;
+    }
+
     const video = document.getElementById("cameraVideo");
     if (!video) {
       alert("Camera video element not found.");
       return;
     }
 
-    // Get available cameras
-    const devices = await navigator.mediaDevices.enumerateDevices();
-    const videoDevices = devices.filter(device => device.kind === 'videoinput');
+    // Simplified approach: Ask for camera directly. 
+    // This allows the browser to handle permissions correctly on all platforms (Windows/Android/iOS)
+    // and defaults to the system default camera (webcam) on laptops.
+    // Simplified approach: Ask for camera directly.
+    // We race against a timeout because WebViews often hang indefinitely if permissions aren't handled.
+    // OPTIMIZATION: Request 16:9 aspect ratio (1280x720) instead of 4:3 (640x480).
+    // This reduces the "zoom" effect on modern mobile screens which are typically 16:9 or taller.
+    const constraints = {
+      video: {
+        width: { ideal: 1280 },
+        height: { ideal: 720 }
+      }
+    };
 
-    if (!videoDevices.length) {
-      alert("No camera devices found.");
-      return;
+    if (deviceId) {
+      constraints.video.deviceId = { exact: deviceId };
+    } else {
+      constraints.video.facingMode = "environment";
     }
 
-    // Prefer back camera
-    const backCamera = videoDevices.find(device =>
-      device.label.toLowerCase().includes('back') ||
-      device.label.toLowerCase().includes('rear')
-    ) || videoDevices[0];
+    const streamPromise = navigator.mediaDevices.getUserMedia(constraints);
 
-    videoStream = await navigator.mediaDevices.getUserMedia({
-      video: {
-        deviceId: backCamera.deviceId,
-        facingMode: "environment",
-        width: { ideal: 640 },
-        height: { ideal: 480 }
+    const timeoutPromise = new Promise((_, reject) =>
+      setTimeout(() => reject(new Error("PermissionTimeout")), 6000)
+    );
+
+    try {
+      videoStream = await Promise.race([streamPromise, timeoutPromise]);
+    } catch (err) {
+      if (err.message === "PermissionTimeout") {
+        throw new Error("Permission request timed out. Please check app permissions.");
       }
-    });
+      throw err;
+    }
+
+    // iOS Specific: Ensure inline playback setup BEFORE stream assignment
+    if (isIOS) {
+      video.setAttribute("playsinline", "");
+      video.setAttribute("webkit-playsinline", "");
+      video.playsInline = true; // Set property as well
+    }
+
+    // Mute video to prevent audio feedback and allow autoplay in restrictive policies
+    video.muted = true;
 
+    // Assign stream
     video.srcObject = videoStream;
 
+    // Ensure video doesn't stay paused if it somehow exits fullscreen or gets interrupted
+    video.onpause = () => {
+      if (cameraStarted && video.srcObject) {
+        // Only try to resume if we expect it to be playing
+        video.play().catch(e => console.log("Resume error", e));
+      }
+    };
+
     // Wait for video to start playing, then hide loader
     video.onloadedmetadata = () => {
-      video.play().then(() => {
-        // Hide loader and show camera UI
+      // Once permission is granted and stream starts, listing devices will return labels
+      populateCameraDevices();
+
+      const showUI = () => {
         const loader = document.getElementById("cameraLoader");
         const captureBtn = document.getElementById("captureButton");
 
@@ -42217,23 +42362,34 @@ async function startCameraStream() {
           loader.style.display = "none";
           loader.style.opacity = "0";
         }
+
         video.style.opacity = "1";
+
         if (captureBtn) {
           captureBtn.style.opacity = "1";
           captureBtn.style.pointerEvents = "all";
         }
+      };
 
+      video.play().then(() => {
+        showUI();
         cameraStarted = true;
       }).catch(err => {
         console.error("Video play error:", err);
-        alert("Failed to start video: " + err.message);
-        closeCameraModal();
+        if (!video.paused) {
+          console.log("Video is playing despite error. Continuing.");
+          showUI();
+          cameraStarted = true;
+        } else {
+          alert("Failed to start video preview: " + err.message);
+          closeCameraModal();
+        }
       });
     };
 
   } catch (err) {
     console.error("Camera start error:", err);
-    let errorMessage = "Failed to start camera";
+    let errorMessage = err.message || "Failed to start camera";
 
     if (err.name === 'NotAllowedError' || err.name === 'PermissionDeniedError') {
       errorMessage = "Camera permission denied. Please allow camera access and try again.";
@@ -42249,18 +42405,50 @@ async function startCameraStream() {
       errorMessage = "Camera access was interrupted.";
     }
 
-    showCameraError(errorMessage);
+    alert(errorMessage);
+    closeCameraModal();
+  }
+}
+
+async function populateCameraDevices() {
+  const select = document.getElementById("cameraSelect");
+  if (!select) return;
 
-    // Send error event
-    if (window.sendEventCallback) {
-      window.sendEventCallback({
-        type: "ERROR",
-        errorMessage: "ErrorCode : 012, Camera access error. Contact your admin or tech team.",
-        data: { technicalError: err, reason: errorMessage }
+  try {
+    const devices = await navigator.mediaDevices.enumerateDevices();
+    const videoDevices = devices.filter(device => device.kind === 'videoinput');
+
+    // Only show if we have more than 1 camera, or at least we want to show the current one
+    if (videoDevices.length > 0) {
+      select.innerHTML = '<option value="" disabled>Select Camera</option>';
+
+      let currentDeviceId = "";
+      if (videoStream) {
+        const track = videoStream.getVideoTracks()[0];
+        if (track) {
+          const settings = track.getSettings();
+          currentDeviceId = settings.deviceId;
+        }
+      }
+
+      videoDevices.forEach((device, index) => {
+        const option = document.createElement("option");
+        option.value = device.deviceId;
+        option.text = device.label || `Camera ${index + 1}`;
+        if (device.deviceId === currentDeviceId) {
+          option.selected = true;
+        }
+        select.appendChild(option);
       });
-    }
 
-    setTimeout(() => closeCameraModal(), 3000);
+      // If there are multiple devices, ensure the dropdown container is visible
+      const container = document.querySelector('.camera-select-container');
+      if (container) {
+        container.style.display = videoDevices.length > 1 ? 'block' : 'none';
+      }
+    }
+  } catch (e) {
+    console.warn("Error enumerating devices:", e);
   }
 }
 
@@ -42330,19 +42518,19 @@ function closeCameraModal() {
   const modal = document.getElementById("cameraModal");
 
   if (videoStream) {
-    videoStream.getTracks().forEach(track => track.stop());
+    try {
+      videoStream.getTracks().forEach(track => track.stop());
+    } catch (e) {
+      console.warn("Error stopping tracks", e);
+    }
     videoStream = null;
     cameraStarted = false;
   }
 
-  // Reset video element
-  const video = document.getElementById("cameraVideo");
-  if (video) {
-    video.srcObject = null;
-    video.style.opacity = "0";
+  // Completely remove from DOM to reset video element state for iOS
+  if (modal) {
+    modal.remove();
   }
-
-  if (modal) modal.style.display = "none";
 }
 
 function injectCameraModalStyles() {
@@ -42373,6 +42561,7 @@ function injectCameraModalStyles() {
       object-fit: cover;
       background: #000;
       transition: opacity 0.3s ease;
+      pointer-events: none;
     }
 
     #cameraLoader {
@@ -42453,6 +42642,39 @@ function injectCameraModalStyles() {
       background: rgba(0, 0, 0, 0.7);
     }
 
+    .camera-select-container {
+        position: absolute;
+        top: 20px;
+        right: 20px;
+        z-index: 10001;
+        pointer-events: all;
+        display: none; /* Hidden by default until devices found */
+    }
+
+    .camera-select {
+        background: rgba(0, 0, 0, 0.5);
+        color: white;
+        border: 1px solid rgba(255, 255, 255, 0.3);
+        padding: 8px 12px;
+        border-radius: 20px;
+        font-size: 14px;
+        backdrop-filter: blur(10px);
+        outline: none;
+        cursor: pointer;
+        appearance: none;
+        -webkit-appearance: none;
+        padding-right: 30px;
+        background-image: url("data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%22292.4%22%20height%3D%22292.4%22%3E%3Cpath%20fill%3D%22%23FFFFFF%22%20d%3D%22M287%2069.4a17.6%2017.6%200%200%200-13-5.4H18.4c-5%200-9.3%201.8-12.9%205.4A17.6%2017.6%200%200%200%200%2082.2c0%205%201.8%209.3%205.4%2012.9l128%20127.9c3.6%203.6%207.8%205.4%2012.8%205.4s9.2-1.8%2012.8-5.4L287%2095c3.5-3.5%205.4-7.8%205.4-12.8%200-5-1.9-9.2-5.5-12.8z%22%2F%3E%3C%2Fsvg%3E");
+        background-repeat: no-repeat;
+        background-position: right 10px center;
+        background-size: 10px;
+    }
+
+    .camera-select option {
+        background: #333;
+        color: white;
+    }
+
     #captureButton {
       position: absolute;
       bottom: 40px;
@@ -42519,6 +42741,11 @@ function injectCameraModalStyles() {
         bottom: env(safe-area-inset-bottom, 40px);
         bottom: max(40px, env(safe-area-inset-bottom));
       }
+
+      .camera-select-container {
+        top: env(safe-area-inset-top, 20px);
+        top: max(20px, env(safe-area-inset-top));
+      }
     }
 
     /* Landscape mode adjustments */
@@ -42801,6 +43028,13 @@ async function loadDocument() {
     err.textContent = "Error loading documents";
     content.appendChild(err);
     console.error(e);
+    if (typeof sendEventCallback === 'function') {
+      sendEventCallback({
+        type: "ERROR",
+        errorMessage: "ErrorCode : 013, Attachments missing from storage",
+        data: { reason: "Failed to load documents from IndexedDB", technicalError: e }
+      });
+    }
   }
 
   // Assemble
@@ -43497,7 +43731,7 @@ see README and LICENSE for details
     <script>
 let flag = false;
 class SmartStorage {
-  constructor() {}
+  constructor() { }
 
   static get title() {
     return "SmartStorage";
@@ -43523,15 +43757,38 @@ class SmartStorage {
 
     return new Promise((resolve, reject) => {
       const request = indexedDB.open("Forms-Attachments", 3);
+
       request.onsuccess = function (event) {
         const db = event.target.result;
+        if (!db.objectStoreNames.contains("Files")) {
+          console.warn("[SmartStorage] Files store missing. Recreating database.");
+          db.close();
+          const deleteReq = indexedDB.deleteDatabase("Forms-Attachments");
+          deleteReq.onsuccess = () => {
+            const retryReq = indexedDB.open("Forms-Attachments", 3);
+            retryReq.onupgradeneeded = (e) => {
+              const newDb = e.target.result;
+              newDb.createObjectStore("Files");
+            };
+            retryReq.onsuccess = (e) => resolve(e.target.result);
+            retryReq.onerror = (e) => reject(e);
+          };
+          deleteReq.onerror = (e) => reject(e);
+          return;
+        }
         resolve(db);
       };
 
       request.onupgradeneeded = function (e) {
         const db = e.target.result;
-        db.createObjectStore("Files");
-        resolve(db);
+        if (!db.objectStoreNames.contains("Files")) {
+          db.createObjectStore("Files");
+        }
+        resolve(db); // Note: resolve here calls with incomplete db during upgrade transaction, but it's typically fine for callers waiting on db handle. 
+        // Ideally we resolve in onsuccess, but existing code had it this way too? 
+        // Actually, in the original code, it resolved in BOTH. Resolving in upgrade gives the transaction-bound db.
+        // But Standard practice is waiting for success.
+        // The original code had `resolve(db)` in `onupgradeneeded`.
       };
 
       request.onerror = function (e) {
@@ -43558,6 +43815,7 @@ class SmartStorage {
           size: file.size,
           type: file.type,
           url,
+          mode: "A",
         };
         if (
           window.platform.isBrowser ||
@@ -43579,6 +43837,7 @@ class SmartStorage {
               type: file.type,
               url: url,
               id,
+              mode: "A",
             });
           };
         } else {
@@ -43589,6 +43848,7 @@ class SmartStorage {
             type: file.type,
             url: url,
             id,
+            mode: "A",
           });
         }
       };
@@ -43675,6 +43935,7 @@ class SmartStorage {
               size: blobObject.size,
               type: file.type,
               url: file.url,
+              mode: file.mode || "G",
             };
             const trans = db.transaction(["Files"], "readwrite");
             const addReq = trans.objectStore("Files").put(data, id);
@@ -44332,7 +44593,21 @@ class SmartFileComponent extends FieldComponent {
   }
 
   getValue() {
-    return this.dataValue;
+    const value = Array.isArray(this.dataValue) ? this.dataValue : (this.dataValue ? [this.dataValue] : []);
+    return value.concat(this.deletedFiles || []);
+  }
+
+  setValue(value, flags) {
+    if (Array.isArray(value)) {
+      this.deletedFiles = value.filter(f => f.mode === 'D');
+      value = value.filter(f => f.mode !== 'D');
+    } else if (value && value.mode === 'D') {
+      this.deletedFiles = [value];
+      value = [];
+    } else {
+      this.deletedFiles = [];
+    }
+    return super.setValue(value, flags);
   }
 
   get defaultValue() {
@@ -44655,6 +44930,13 @@ class SmartFileComponent extends FieldComponent {
         new SmartStorage().markFileAsDeleted(fileInfo.id);
         this.deleteFile(fileInfo);
         event.preventDefault();
+
+        fileInfo.mode = "D";
+        if (!this.deletedFiles) {
+          this.deletedFiles = [];
+        }
+        this.deletedFiles.push(fileInfo);
+
         this.splice(index);
         this.redraw();
       });
@@ -44909,10 +45191,8 @@ class SmartFileComponent extends FieldComponent {
         let id = this.component.id;
         isfileBrowse = false;
 
-        // let isbrowser = (!document.URL.startsWith('http:') || document.URL.startsWith('http://localhost:8000'))
-        // if (window.platform.isAndroid && !isbrowser) {
-
-        if (window.platform.isAndroid) {
+        // Dispatch custom camera event for both Android and iOS
+        if (window.platform.isAndroid || window.platform.iosPlatform) {
           window.isListenerSet = false;
           let eventCustom = new CustomEvent("openCamera", {
             detail: {
@@ -45296,6 +45576,24 @@ class SmartFileComponent extends FieldComponent {
     if (this.component.storage && files && files.length) {
       // if (this.component.storage && files) {
       Array.prototype.forEach.call(files, async (file) => {
+        // Modify iOS filenames with timestamp BEFORE duplicate check
+        let originalFileName = file.name;
+        if (window.platform.iosPlatform) {
+          const fileNameOriginal = file.name;
+          const lastDotIndex = fileNameOriginal.lastIndexOf(".");
+          let newName = "";
+          if (lastDotIndex !== -1) {
+            newName = `${fileNameOriginal.substring(
+              0,
+              lastDotIndex
+            )}-${Date.now()}${fileNameOriginal.substring(lastDotIndex)}`;
+          } else {
+            newName = `${fileNameOriginal}-${Date.now()}`;
+          }
+          file = new File([file], newName, {
+            type: file.type,
+          });
+        }
         const fileName = uniqueName(
           file.name,
           this.component.fileNameTemplate,
@@ -45338,8 +45636,9 @@ class SmartFileComponent extends FieldComponent {
         // Check if file with the same name is being uploaded
         var fileWithSameNameUploaded = false;
         if (window.platform.iosPlatform) {
+          // For iOS, compare using the escaped filename (after timestamp modification)
           fileWithSameNameUploaded = this.dataValue.some(
-            (fileStatus) => fileStatus.url === imagUrl
+            (fileStatus) => fileStatus.originalName === escapedFileName
           );
         } else {
           fileWithSameNameUploaded = isfileBrowse
@@ -45549,19 +45848,27 @@ class SmartFileComponent extends FieldComponent {
               fileInfo.originalName = escapedFileName;
               fileInfo.hash = fileUpload.hash;
               fileInfo.compnentId = this.component.id;
+              fileInfo.mode = fileUpload.mode || "A";
               if (!this.hasValue()) {
                 this.dataValue = [];
               }
               if (replace) {
-                let ind;
+                let ind = -1;
                 for (let i = 0; i < this.dataValue.length; i++) {
                   if (this.dataValue[i].originalName == fileInfo.originalName) {
                     console.log("original name matches");
                     ind = i;
+                    break;
                   }
                 }
                 if (ind !== -1) {
                   let originalFileId = this.dataValue[ind].id;
+                  let originalFileMode = this.dataValue[ind].mode;
+
+                  if (originalFileMode === "G" || originalFileMode === "M") {
+                    fileInfo.mode = "M";
+                  }
+
                   console.log("originalFileId = " + originalFileId);
                   this.dataValue[ind] = fileInfo;
                   let eventCustom = new CustomEvent(
@@ -53102,7 +53409,7 @@ class SmartSelectComponent extends SmartSelectField {
     return {
       ...super.conditionOperatorsSettings,
       valueComponent(classComp) {
-        const valueComp = { ... classComp, type: 'select' };
+        const valueComp = { ...classComp, type: 'select' };
 
         if (isSelectResourceWithObjectValue(classComp)) {
           valueComp.reference = false;
@@ -53254,7 +53561,7 @@ class SmartSelectComponent extends SmartSelectField {
       return this.component.valueProperty;
     }
     // Force values datasource to use values without actually setting it on the component settings.
-   if(this.component.dataSrc === 'values') {
+    if (this.component.dataSrc === 'values') {
       return 'value';
     }
     return '';
@@ -53292,10 +53599,10 @@ class SmartSelectComponent extends SmartSelectField {
 
   get shouldInitialLoad() {
     if (this.component.widget === 'html5' &&
-        this.isEntireObjectDisplay() &&
-        this.component.searchField &&
-        this.dataValue) {
-          return false;
+      this.isEntireObjectDisplay() &&
+      this.component.searchField &&
+      this.dataValue) {
+      return false;
     }
 
     return super.shouldLoad;
@@ -53330,7 +53637,7 @@ class SmartSelectComponent extends SmartSelectField {
     if (this.component.multiple && _.isArray(this.dataValue) ? this.dataValue.find((val) => value === val) : (this.dataValue === value)) {
       const selectData = this.selectData;
       if (selectData) {
-        const templateValue = this.component.reference && value && (value._id  ? value._id.toString() : value);
+        const templateValue = this.component.reference && value && (value._id ? value._id.toString() : value);
         if (!this.templateData || !this.templateData[templateValue]) {
           this.getOptionTemplate(data, value);
         }
@@ -53357,7 +53664,7 @@ class SmartSelectComponent extends SmartSelectField {
       });
     }
 
-   if (data.data) {
+    if (data.data) {
       // checking additional fields in the template for the selected Entire Object option
       const hasNestedFields = /item\.data\.\w*/g.test(this.component.template);
       data.data = this.isEntireObjectDisplay() && _.isObject(data.data) && !hasNestedFields ?
@@ -53376,8 +53683,8 @@ class SmartSelectComponent extends SmartSelectField {
         hasTranslator = this.i18next.translator;
       }
       if (!label || (hasTranslator && !this.t(label, {
-          _userInput: true
-        }))) return;
+        _userInput: true
+      }))) return;
       return hasTranslator ? template.replace(label, this.t(label, {
         _userInput: true
       })) : label;
@@ -53404,7 +53711,7 @@ class SmartSelectComponent extends SmartSelectField {
     //   ...idPath
     // };
 
-     const option = Object.assign({
+    const option = Object.assign({
       value: this.getOptionValue(value),
       label,
     }, idPath);
@@ -53560,7 +53867,7 @@ class SmartSelectComponent extends SmartSelectField {
       if (this.root && this.root.options.editForm && this.root.options.editForm._id && this.root.options.editForm._id === item._id) return;
       const itemValueAndLabel = this.selectValueAndLabel(item);
       this.addOption(itemValueAndLabel.value, itemValueAndLabel.label, {}, _.get(item, this.component.idPath, String(index)));
-   
+
     });
     if (this.choices) {
       if ((this.component.dataSrc === 'masterdata') && this.component.masterdata) {
@@ -53602,10 +53909,10 @@ class SmartSelectComponent extends SmartSelectField {
       // If a value is provided, then select it.
       if (!this.isEmpty()) {
         if (localStorage.getItem('renderMode') === 'html') {
-        var tmplt = this.component.template;
-        var str1 = tmplt.substring(tmplt.lastIndexOf('.') + 1, tmplt.length);
-        var label = str1.substring(0, str1.indexOf('}'), str1.length);
-        label = label.trim();
+          var tmplt = this.component.template;
+          var str1 = tmplt.substring(tmplt.lastIndexOf('.') + 1, tmplt.length);
+          var label = str1.substring(0, str1.indexOf('}'), str1.length);
+          label = label.trim();
 
           if (items.length > 0) {
             if (this.component.multiple) {
@@ -53618,13 +53925,13 @@ class SmartSelectComponent extends SmartSelectField {
               });
             } else {
             }
+          }
+        } else {
+          this.setValue(this.dataValue, {
+            noUpdateEvent: true
+          });
         }
-      }else{
-        this.setValue(this.dataValue, {
-          noUpdateEvent: true
-        });
-      }
-      }else if (this.shouldAddDefaultValue && !this.options.readOnly) {
+      } else if (this.shouldAddDefaultValue && !this.options.readOnly) {
         // If a default value is provided then select it.
         const defaultValue = this.defaultValue;
         if (!this.isEmpty(defaultValue)) {
@@ -53931,32 +54238,32 @@ class SmartSelectComponent extends SmartSelectField {
           } else {
             if (!this.component.dropdownOpened && this.data[this.key] && String(this.data[this.key]).length > 0) {
               let result = [];
-              if(this.component.multiple && this.component.masterdata){
-                this.data[this.key].forEach(item => 
+              if (this.component.multiple && this.component.masterdata) {
+                this.data[this.key].forEach(item =>
                   this.component.masterdata.filter((value) => {
                     const propValue = value[this.component.valueProperty];
-                  // Convert to string only if necessary
-                  const valPropData = typeof propValue !== 'string' ? String(propValue) : propValue;
-                    if(valPropData.includes(item)){
+                    // Convert to string only if necessary
+                    const valPropData = typeof propValue !== 'string' ? String(propValue) : propValue;
+                    if (valPropData.includes(item)) {
                       result.push(value)
                     }
                   })
                 );
                 // result = this.component.masterdata;
-              }else{
-                if(this.component.masterdata){
-                 result = this.component.masterdata.filter(value => {
-                  const propValue = value[this.component.valueProperty];
-                  // Convert to string only if necessary
-                  const valPropData = typeof propValue !== 'string' ? String(propValue) : propValue;
-                  return valPropData?.includes(this.data[this.key]);
-                });
-              }
+              } else {
+                if (this.component.masterdata) {
+                  result = this.component.masterdata.filter(value => {
+                    const propValue = value[this.component.valueProperty];
+                    // Convert to string only if necessary
+                    const valPropData = typeof propValue !== 'string' ? String(propValue) : propValue;
+                    return valPropData?.includes(this.data[this.key]);
+                  });
+                }
               }
               const unique = result.filter((obj, index) => {
                 return index === result.findIndex(o => obj[this.component.valueProperty] === o[this.component.valueProperty]);
-            });
-               this.setItems(unique);
+              });
+              this.setItems(unique);
             }
           }
         }
@@ -54117,9 +54424,9 @@ class SmartSelectComponent extends SmartSelectField {
   get active() {
     if ((this.component.dataSrc === 'masterdata') && this.component.masterdata) {
       return !this.component.lazyLoad || this.activated;
-    }else{
-    // return !this.component.lazyLoad || this.activated || this.options.readOnly;
-    return !this.component.lazyLoad || this.activated;
+    } else {
+      // return !this.component.lazyLoad || this.activated || this.options.readOnly;
+      return !this.component.lazyLoad || this.activated;
     }
   }
 
@@ -54193,8 +54500,8 @@ class SmartSelectComponent extends SmartSelectField {
       searchChoices: !this.component.searchField,
       searchFields: _.get(this, 'component.searchFields', ['label']),
       shadowRoot: this.root ? this.root.shadowRoot : null,
-    fuseOptions: this.component.useExactSearch ? Object.assign(fuseObj, commonFuseOptions) : Object.assign({},
-        _.get(this, 'component.fuseOptions', {}), 
+      fuseOptions: this.component.useExactSearch ? Object.assign(fuseObj, commonFuseOptions) : Object.assign({},
+        _.get(this, 'component.fuseOptions', {}),
         Object.assign(fuseObj1, commonFuseOptions)
       ),
       valueComparer: _.isEqual,
@@ -54362,17 +54669,17 @@ class SmartSelectComponent extends SmartSelectField {
         }
         this.isFromSearch = false;
       });
-         // avoid spamming the resource/url endpoint when we have server side filtering enabled.
-         const debounceTimeout = this.component.searchField && (this.isSelectResource || this.isSelectURL) ?
-         (this.component.searchDebounce === 0 ? 0 : this.component.searchDebounce || this.defaultSchema.searchDebounce) * 1000
-         : 0;
-         const updateComponent = (evt) => {
-           this.triggerUpdate(evt.detail.value);
-         };
-         this.addEventListener(input, 'search', _.debounce((e) => {
-          updateComponent(e);
-          this.positionDropdown();
-        },  debounceTimeout));
+      // avoid spamming the resource/url endpoint when we have server side filtering enabled.
+      const debounceTimeout = this.component.searchField && (this.isSelectResource || this.isSelectURL) ?
+        (this.component.searchDebounce === 0 ? 0 : this.component.searchDebounce || this.defaultSchema.searchDebounce) * 1000
+        : 0;
+      const updateComponent = (evt) => {
+        this.triggerUpdate(evt.detail.value);
+      };
+      this.addEventListener(input, 'search', _.debounce((e) => {
+        updateComponent(e);
+        this.positionDropdown();
+      }, debounceTimeout));
 
       this.addEventListener(input, 'stopSearch', () => this.triggerUpdate());
       this.addEventListener(input, 'hideDropdown', () => {
@@ -54387,9 +54694,9 @@ class SmartSelectComponent extends SmartSelectField {
           if (this.data[this.key] && String(this.data[this.key]).length > 0) {
             selData = this.component.masterdata.filter((value) => {
               const propValue = value[this.component.valueProperty];
-                  // Convert to string only if necessary
-                  const valPropData = typeof propValue !== 'string' ? String(propValue) : propValue;
-                  return valPropData?.includes(this.data[this.key]);
+              // Convert to string only if necessary
+              const valPropData = typeof propValue !== 'string' ? String(propValue) : propValue;
+              return valPropData?.includes(this.data[this.key]);
 
             })
           }
@@ -54482,10 +54789,10 @@ class SmartSelectComponent extends SmartSelectField {
   setDropdownPosition() {
     let dropdown;
     let container;
-    if(this.choices && this.choices.dropdown && this.choices.dropdown.element){
-    dropdown = this.choices.dropdown.element;
+    if (this.choices && this.choices.dropdown && this.choices.dropdown.element) {
+      dropdown = this.choices.dropdown.element;
     }
-    if(this.choices && this.choices.containerOuter && this.choices.containerOuter.element){
+    if (this.choices && this.choices.containerOuter && this.choices.containerOuter.element) {
       container = this.choices.containerOuter.element;
     }
 
@@ -54570,9 +54877,9 @@ class SmartSelectComponent extends SmartSelectField {
       if (this.data[this.key] && String(this.data[this.key]).length > 0) {
         selData = this.component.masterdata.filter((value) => {
           const propValue = value[this.component.valueProperty];
-                  // Convert to string only if necessary
-                  const valPropData = typeof propValue !== 'string' ? String(propValue) : propValue;
-                  return valPropData?.includes(this.data[this.key]);
+          // Convert to string only if necessary
+          const valPropData = typeof propValue !== 'string' ? String(propValue) : propValue;
+          return valPropData?.includes(this.data[this.key]);
         })
       }
 
@@ -54923,29 +55230,29 @@ class SmartSelectComponent extends SmartSelectField {
 
   setValue(value, flags = {}) {
     // console.log("value line 1875" + this.component.label, value)
-    if(value && String(value).length > 0){
+    if (value && String(value).length > 0) {
       $(".barcode-select-error").remove();
     }
-      if (localStorage.getItem('renderMode') === 'html' && this.component.dataSrc === 'values') {
-        this.component.data.values.filter((data) => {
-          if ((value && data.value === value) || (value && data.value === String(value))) {
-            value = data.label;
-          };
-        })
+    if (localStorage.getItem('renderMode') === 'html' && this.component.dataSrc === 'values') {
+      this.component.data.values.filter((data) => {
+        if ((value && data.value === value) || (value && data.value === String(value))) {
+          value = data.label;
+        };
+      })
+    }
+    if (localStorage.getItem('renderMode') === 'html' && this.component.dataSrc === 'masterdata' && !this.component.multiple) {
+      var tmplt = this.component.template;
+      var str1 = tmplt.substring(tmplt.lastIndexOf('.') + 1, tmplt.length);
+      var label = str1.substring(0, str1.indexOf('}'), str1.length);
+      label = label.trim();
+
+      this.component.masterdata.filter((data) => {
+        if ((value && data[this.component.valueProperty] === value) || (value && data[this.component.valueProperty] === String(value))) {
+          value = data[label];
+        }
+      })
     }
-      if (localStorage.getItem('renderMode') === 'html' && this.component.dataSrc === 'masterdata' && !this.component.multiple) {
-        var tmplt = this.component.template;
-        var str1 = tmplt.substring(tmplt.lastIndexOf('.') + 1, tmplt.length);
-        var label = str1.substring(0, str1.indexOf('}'), str1.length);
-        label = label.trim();
 
-        this.component.masterdata.filter((data) => {
-          if ((value && data[this.component.valueProperty] === value) || (value && data[this.component.valueProperty] === String(value))) {
-            value = data[label];
-          }
-        })
-      }
-    
     const previousValue = this.dataValue;
     // console.log("value line 1900 " + this.component.label, value)
     const changed = this.updateValue(value, flags);
@@ -54957,10 +55264,10 @@ class SmartSelectComponent extends SmartSelectField {
     if (this.component.multiple && Array.isArray(value)) {
       value = value.map(value => {
         if (typeof value === 'boolean' || typeof value === 'number') {
-    console.log("value line 1910 " + this.component.label, value)
+          console.log("value line 1910 " + this.component.label, value)
           return value.toString();
         }
-    console.log("value line 1914 " + this.component.label, value)
+        console.log("value line 1914 " + this.component.label, value)
         return value;
       });
     } else {
@@ -54992,10 +55299,10 @@ class SmartSelectComponent extends SmartSelectField {
     // Add the value options.
     this.itemsLoaded.then(() => {
       this.addValueOptions();
-    //  console.log("value line 1945 " + this.component.label, value)
+      //  console.log("value line 1945 " + this.component.label, value)
       this.setChoicesValue(value, hasPreviousValue, flags);
     });
-  
+
     return changed;
   }
 
@@ -55042,7 +55349,7 @@ class SmartSelectComponent extends SmartSelectField {
       if (hasValue) {
         const values = Array.isArray(value) ? value : [value];
         if (!_.isEqual(this.dataValue, this.defaultValue) && this.selectOptions.length < 2
-        || (this.selectData && flags.fromSubmission)) {
+          || (this.selectData && flags.fromSubmission)) {
           const { value, label } = this.selectValueAndLabel(this.dataValue);
           this.addOption(value, label);
         }
@@ -55115,14 +55422,14 @@ class SmartSelectComponent extends SmartSelectField {
    */
   getOptionValue(value) {
     return _.isObject(value) && this.isEntireObjectDisplay()
-    ? this.normalizeSingleValue(value)
-    : _.isObject(value) && (this.valueProperty || this.component.key !== 'resource')
-      ? value
-      : _.isObject(value) && !this.valueProperty
-        ? this.interpolate(this.component.template, { item: value }).replace(/<\/?[^>]+(>|$)/g, '')
-        : _.isNull(value)
-          ? this.emptyValue
-          : String(this.normalizeSingleValue(value));
+      ? this.normalizeSingleValue(value)
+      : _.isObject(value) && (this.valueProperty || this.component.key !== 'resource')
+        ? value
+        : _.isObject(value) && !this.valueProperty
+          ? this.interpolate(this.component.template, { item: value }).replace(/<\/?[^>]+(>|$)/g, '')
+          : _.isNull(value)
+            ? this.emptyValue
+            : String(this.normalizeSingleValue(value));
   }
 
   /**
@@ -55238,19 +55545,19 @@ class SmartSelectComponent extends SmartSelectField {
         items: convertToString(this.getNormalizedValues(), 'value'),
         valueProperty: 'value',
       } : {
-        items: convertToString(this.getCustomItems(), this.valueProperty),
-        valueProperty: this.valueProperty,
-      };
+          items: convertToString(this.getCustomItems(), this.valueProperty),
+          valueProperty: this.valueProperty,
+        };
       const getFromValues = () => {
         const initialValue = _.find(items, [valueProperty, value]);
         const values = this.defaultSchema.data.values || [];
         return _.isEqual(initialValue, values[0]) ? '-' : initialValue;
       };
       value = (this.component.multiple && Array.isArray(value))
-      ? _.filter(items, (item) => value.includes(item.value))
-      : valueProperty
-        ? getFromValues() ?? { value, label: value }
-        : value;
+        ? _.filter(items, (item) => value.includes(item.value))
+        : valueProperty
+          ? getFromValues() ?? { value, label: value }
+          : value;
     }
 
     if (_.isString(value)) {
@@ -55266,7 +55573,7 @@ class SmartSelectComponent extends SmartSelectField {
     if (Array.isArray(value)) {
       const items = [];
       value.forEach(item => items.push(getTemplateValue(item)));
-      if (this.component.dataSrc === 'resource' &&  items.length > 0 ) {
+      if (this.component.dataSrc === 'resource' && items.length > 0) {
         return items.join(', ');
       }
       else if (items.length > 0) {
@@ -58620,8 +58927,7 @@ async function validateAttachments(template, submissionData) {
               if (
                 !fileRecord ||
                 !fileRecord.id ||
-                !fileRecord.data ||
-                !fileRecord.url
+                (!fileRecord.data && !fileRecord.url)
               ) {
                 missingFiles.push({
                   fileId,
@@ -59013,19 +59319,31 @@ function FormOnBackNavigation() {
 
 // ============================================  FORM-IO   ===========================================================
 
+// Button state management based on privateExternal and permission
 // Button state management based on privateExternal and permission
 function initialButtonSetup(privateExternal, permission) {
     const saveBtn = document.getElementById("saveBtn");
     const submitBtn = document.getElementById("submitBtn");
+    const completeOption = document.getElementById("completeOption");
+    const saveOption = document.getElementById("saveOption");
+    const completeDivider = document.getElementById("completeDivider");
+    const saveDivider = document.getElementById("saveDivider");
+
     if (!saveBtn || !submitBtn) return;
 
     const isPrivate = privateExternal === true || privateExternal === "true";
     const isPublic = privateExternal === false || privateExternal === "false";
     const permissionMode = String(permission || "").toLowerCase();
 
-    console.log("=== initialButtonSetup ===");
-    console.log("privateExternal:", privateExternal);
-    console.log("permission:", permissionMode);
+    // Helper to toggle dropdown items
+    const toggleDropdown = (option, divider, show) => {
+        if (option) option.style.display = show ? "block" : "none";
+        if (divider) divider.style.display = show ? "block" : "none";
+    };
+
+    // Default: Hide dropdown specific items
+    toggleDropdown(completeOption, completeDivider, false);
+    toggleDropdown(saveOption, saveDivider, false);
 
     // READ ONLY
     if (permissionMode === "read") {
@@ -59042,23 +59360,35 @@ function initialButtonSetup(privateExternal, permission) {
         console.log("Mode: PUBLIC WRITE → Show submit (disabled)");
         saveBtn.style.display = "none";
         submitBtn.style.display = "";
+        submitBtn.innerHTML = '<i class="icon save"></i> Submit';
         submitBtn.disabled = true;
     }
 
     // PRIVATE FORM - writemultiple
     else if (isPrivate && permissionMode === "writemultiple") {
-        console.log("Mode: PRIVATE WRITEMULTIPLE → Show submit (disabled)");
-        saveBtn.style.display = "none";
-        submitBtn.style.display = "";
-        submitBtn.disabled = true;
+        console.log(
+            "Mode: PRIVATE WRITEMULTIPLE → Show save (disabled), Complete in Dropdown"
+        );
+        saveBtn.style.display = "";
+        submitBtn.style.display = "none";
+        saveBtn.disabled = true;
+
+        // Show Complete in Dropdown
+        toggleDropdown(completeOption, completeDivider, true);
     }
 
     // PRIVATE FORM - writesingle
     else if (isPrivate && permissionMode === "writesingle") {
-        console.log("Mode: PRIVATE WRITESINGLE → Show save (disabled)");
-        saveBtn.style.display = "";
-        submitBtn.style.display = "none";
-        saveBtn.disabled = true;
+        console.log(
+            "Mode: PRIVATE WRITESINGLE → Show submit (disabled), Save in Dropdown"
+        );
+        saveBtn.style.display = "none";
+        submitBtn.style.display = "";
+        submitBtn.innerHTML = '<i class="icon save"></i> Complete';
+        submitBtn.disabled = true;
+
+        // Show Save in Dropdown
+        toggleDropdown(saveOption, saveDivider, true);
     }
 
     // DEFAULT / UNKNOWN
@@ -59066,6 +59396,7 @@ function initialButtonSetup(privateExternal, permission) {
         console.log("Mode: DEFAULT / UNKNOWN → Show submit (disabled)");
         saveBtn.style.display = "none";
         submitBtn.style.display = "";
+        submitBtn.innerHTML = '<i class="icon save"></i> Submit';
         submitBtn.disabled = true;
     }
 }
@@ -59089,16 +59420,12 @@ function onChangeButtonSetup(
             v !== undefined &&
             v !== null &&
             v !== "" &&
-            !(Array.isArray(v) && v.length === 0)
+            v !== false &&
+            !(Array.isArray(v) && v.length === 0) &&
+            !(typeof v === "object" && !Array.isArray(v) && Object.keys(v).length === 0)
     );
     const isComplete = completionPercentage >= 100;
 
-    console.log("=== onChangeButtonSetup ===");
-    console.log("privateExternal:", privateExternal);
-    console.log("permission:", permissionMode);
-    console.log("hasAnyValue:", hasAnyValue);
-    console.log("completionPercentage:", completionPercentage);
-
     // READ ONLY
     if (permissionMode === "read") {
         console.log("Mode: READ → Hide all buttons");
@@ -59110,26 +59437,24 @@ function onChangeButtonSetup(
     // PRIVATE FORM - writesingle
     if (isPrivate && permissionMode === "writesingle") {
         console.log("Mode: PRIVATE WRITESINGLE");
+        // Main: Complete (Submit)
         saveBtn.style.display = "none";
         submitBtn.style.display = "";
-        submitBtn.disabled = !hasAnyValue;
+
+        // Logic: Disable Complete until 100%
+        submitBtn.disabled = !isComplete;
         return;
     }
 
     // PRIVATE FORM - writemultiple
     if (isPrivate && permissionMode === "writemultiple") {
         console.log("Mode: PRIVATE WRITEMULTIPLE");
-        if (isComplete) {
-            console.log("→ Complete: Show submit");
-            saveBtn.style.display = "none";
-            submitBtn.style.display = "";
-            submitBtn.disabled = false;
-        } else {
-            console.log("→ Incomplete: Show save");
-            saveBtn.style.display = "";
-            submitBtn.style.display = "none";
-            saveBtn.disabled = !hasAnyValue;
-        }
+        // Main: Save
+        saveBtn.style.display = "";
+        submitBtn.style.display = "none";
+
+        // Logic: Enable Save if hasAnyValue
+        saveBtn.disabled = !hasAnyValue;
         return;
     }
 
@@ -59218,12 +59543,21 @@ async function renderRNform(
     console.log("-------->>>Processed ID ", processSubData);
     // window.FORM_PREVIOUS_DATA = processId;
 
-    document.getElementById("formio-cmt").innerHTML = "";
-
-    Formio.use(window.semantic.default || window.semantic);
+    // document.getElementById("formio-cmt").innerHTML = "";
 
     console.log("privae external --->> ", privateExternal);
 
+    if (typeof Formio === "undefined") {
+        sendEventCallback({
+            type: "ERROR",
+            errorMessage: "ErrorCode : 016, Formio library not loaded",
+            data: { reason: "Formio library not loaded" },
+        });
+        return;
+    }
+
+    Formio.use(window.semantic.default || window.semantic);
+
     try {
         // Determine form configuration based on mode
         let formConfig = {
@@ -59408,8 +59742,8 @@ async function renderRNform(
         sendEventCallback({
             type: "ERROR",
             errorMessage:
-                "ErrorCode : 005, Form render error. Contact your admin or tech team.",
-            data: { technicalError: error },
+                "ErrorCode : 005, Formio not rendered the forms",
+            data: { reason: "Failed to render form", technicalError: error },
         });
     }
 } // End of renderForm function
@@ -59550,6 +59884,9 @@ function setupOnChange(privateExternal, permission) {
         const completion =
             mandatory === 0 ? 100 : Math.round((filledMandatory / mandatory) * 100);
 
+        calculationPercentage = completion;
+        completeFlag = completion >= 100;
+
         console.log("📊 Completion %:", completion);
         onChangeButtonSetup(completion, formObj.data, privateExternal, permission);
 
@@ -59685,6 +60022,18 @@ function FormOnSubmit() {
                 [{ label: "OK", callback: {} }],
                 "Fill The Required Fields"
             );
+
+            sendEventCallback({
+                type: FORM_EVENTS.SUBMIT_ERROR,
+                errorMessage: "ErrorCode : 006, Formio not submit the form",
+                data: {
+                    reason: "Form submission failed",
+                    formData: processedData,
+                    completeFlag,
+                    completionPercentage: calculationPercentage,
+                    technicalError: error,
+                },
+            });
         });
 }
 
@@ -59708,6 +60057,22 @@ function loadComments() {
 function FormOnSave() {
     if (!formObj) return;
 
+    const formData = formObj.getValue().data;
+    const hasAnyValue = Object.values(formData || {}).some(
+        (v) =>
+            v !== undefined &&
+            v !== null &&
+            v !== "" &&
+            v !== false &&
+            !(Array.isArray(v) && v.length === 0) &&
+            !(typeof v === "object" && !Array.isArray(v) && Object.keys(v).length === 0)
+    );
+
+    if (!hasAnyValue) {
+        showDynamicModal("Attention", [{ label: "OK" }], "Please fill at least one field before saving.");
+        return;
+    }
+
     showDynamicModal("Do you want to save the data?", [
         {
             label: "Yes",
@@ -59918,17 +60283,28 @@ function goToformRender() {
 
   // Reload main form from cached globals
   if (typeof window.renderRNform === 'function') {
-    window.renderRNform(
-      window.FORM_TEMPLATE,
-      window.FORM_PREVIOUS_DATA,
-      window.FORM_THEME_DATA,
-      window.FORM_MODE,
-      window.FORM_LANGUAGE,
-      window.FORM_TRASLATIONS,
-      window.FORM_CONTROL_DATA,
-      window.FORM_PRIVATE_EXTERNAL,
-      window.FORM_PERMISSION,
-    );
+    try {
+      window.renderRNform(
+        window.FORM_TEMPLATE,
+        window.FORM_PREVIOUS_DATA,
+        window.FORM_THEME_DATA,
+        window.FORM_MODE,
+        window.FORM_LANGUAGE,
+        window.FORM_TRASLATIONS,
+        window.FORM_CONTROL_DATA,
+        window.FORM_PRIVATE_EXTERNAL,
+        window.FORM_PERMISSION,
+      );
+    } catch (e) {
+      console.error("Error reloading form:", e);
+      if (typeof sendEventCallback === 'function') {
+        sendEventCallback({
+          type: "ERROR",
+          errorMessage: "ErrorCode : 005, Formio not rendered the forms",
+          data: { reason: "Failed to reload form", technicalError: e }
+        });
+      }
+    }
   } else {
     console.error('renderRNform is not defined');
   }
@@ -60013,7 +60389,7 @@ window.CommentOnBack = CommentOnBack;
     
     <div id="sticky-footer">
         <div class="relative-position">
-            <button id="moreBtn" class="ui button primary dataGrid-addRow" onclick="toggleTooltip()">
+            <button id="unvired-more-btn" class="ui button primary dataGrid-addRow" onclick="toggleTooltip()">
                 <i class="icon options"></i>
                 More
             </button>
@@ -60162,7 +60538,7 @@ window.CommentOnBack = CommentOnBack;
         };
 
         document.addEventListener('click', function (event) {
-            const moreBtn = document.getElementById('moreBtn');
+            const moreBtn = document.getElementById('unvired-more-btn');
             const tooltip = document.getElementById('moreTooltip');
             if (!moreBtn.contains(event.target) && !tooltip.contains(event.target)) {
                 tooltip.style.display = 'none';