@unvired/turboforms-embed-sdk 2.0.48 → 2.0.50

package/dist/turboforms.html

@@ -2631,7 +2631,7 @@
 .tf-formio-sdk .comments-header {
   background-color: white;
   display: flex;
-  padding: 1px;
+  padding: 5px;
   align-items: baseline;
   justify-content: space-between;
   position: fixed;
@@ -2668,6 +2668,191 @@
 
 .tf-formio-sdk .relative-position {
   position: relative;
+}
+
+/* ==========================================================================
+   12. Recogito Comments UI Overrides (Modernized)
+   ========================================================================== */
+
+/* The main modal container */
+.r6o-editor {
+  width: 450px !important;
+  border-radius: 12px !important;
+  box-shadow: 0 10px 40px rgba(0, 0, 0, 0.15) !important;
+  border: 1px solid #eaeaea !important;
+  font-family: inherit !important;
+}
+
+/* Modal Inner */
+.r6o-editor-inner {
+  border-radius: 12px !important;
+  overflow: hidden !important;
+}
+
+/* Comment text area */
+.r6o-widget.comment {
+  padding: 8px !important;
+  border-bottom: 1px solid #f0f0f0 !important;
+}
+
+.r6o-widget.comment textarea {
+  min-height: 90px !important;
+  padding: 12px !important;
+  border: 1px solid #e0e0e0 !important;
+  border-radius: 8px !important;
+  font-size: 14px !important;
+  background-color: #f9f9f9 !important;
+  transition: border-color 0.2s ease, background-color 0.2s ease !important;
+}
+
+.r6o-widget.comment textarea:focus {
+  border-color: var(--tf-primary-color, #0d6efd) !important;
+  background-color: #fff !important;
+  outline: none !important;
+  box-shadow: 0 0 0 3px rgba(13, 110, 253, 0.1) !important;
+}
+
+/* Tags area */
+.r6o-widget.r6o-tag {
+  padding: 12px 16px !important;
+  background-color: #fff !important;
+  border-bottom: 1px solid #f0f0f0 !important;
+}
+
+.r6o-widget.r6o-tag input {
+  font-size: 14px !important;
+  padding: 8px !important;
+  border: 1px dashed #e0e0e0 !important;
+  border-radius: 6px !important;
+}
+
+.r6o-widget.r6o-tag input:focus {
+  border-color: var(--tf-primary-color, #0d6efd) !important;
+  border-style: solid !important;
+}
+
+/* Tag chips */
+.r6o-widget.r6o-tag ul.r6o-taglist li {
+  border-radius: 16px !important;
+  background-color: var(--tf-primary-color-transparent, #e9ecef) !important;
+  border: none !important;
+  color: var(--tf-primary-color, #495057) !important;
+  font-size: 12px !important;
+  padding: 4px 6px !important;
+  font-weight: 500 !important;
+}
+
+.r6o-widget.r6o-tag ul.r6o-taglist li .r6o-delete-wrapper {
+  background-color: transparent !important;
+  color: inherit !important;
+}
+
+.r6o-widget.r6o-tag ul.r6o-taglist li .r6o-delete-wrapper .r6o-delete:hover {
+  background-color: rgba(0, 0, 0, 0.05) !important;
+  border-radius: 50% !important;
+}
+
+/* Footer & Buttons */
+.r6o-footer {
+
+  background-color: #fafafa !important;
+  display: flex !important;
+  justify-content: flex-end !important;
+  gap: 12px !important;
+}
+
+.r6o-btn {
+  padding: 2px 20px !important;
+  border-radius: 6px !important;
+  font-weight: 500 !important;
+  font-size: 14px !important;
+  text-transform: none !important;
+  transition: all 0.2s ease !important;
+  min-width: 80px !important;
+  text-align: center !important;
+}
+
+.r6o-btn:not(.outline) {
+  background-color: var(--tf-primary-color, #0d6efd) !important;
+  border-color: var(--tf-primary-color, #0d6efd) !important;
+}
+
+.r6o-btn:not(.outline):hover {
+  filter: brightness(0.9) !important;
+}
+
+.r6o-btn.outline {
+  color: #495057 !important;
+  border-color: #ced4da !important;
+  background-color: #fff !important;
+}
+
+.r6o-btn.outline:hover {
+  background-color: #f8f9fa !important;
+  border-color: #adb5bd !important;
+}
+
+@media (max-width: 600px) {
+  .r6o-editor {
+    width: 320px !important;
+  }
+}
+
+.r6o-widget.comment textarea:not(.formio-component-htmlelement *) {
+  resize: vertical !important;
+  min-height: 60px !important;
+}
+
+/* Comment Dropdown Arrow */
+.r6o-widget.comment .r6o-arrow-down {
+  height: 26px !important;
+  width: 26px !important;
+  top: 12px !important;
+  right: 12px !important;
+  border: 1px solid #e0e0e0 !important;
+  border-radius: 6px !important;
+  display: flex !important;
+  align-items: center !important;
+  justify-content: center !important;
+  transition: all 0.2s ease !important;
+  color: #6c757d !important;
+  background-color: #fff !important;
+}
+
+.r6o-widget.comment .r6o-arrow-down:hover {
+  background-color: #f8f9fa !important;
+  color: #495057 !important;
+}
+
+.r6o-widget.comment .r6o-arrow-down.r6o-menu-open {
+  border-color: var(--tf-primary-color, #0d6efd) !important;
+  color: var(--tf-primary-color, #0d6efd) !important;
+  background-color: var(--tf-primary-color-transparent, #e9ecef) !important;
+}
+
+/* Comment Dropdown Menu */
+.r6o-widget.comment .r6o-comment-dropdown-menu {
+  top: 42px !important;
+  right: 12px !important;
+  border-radius: 8px !important;
+  border: 1px solid #eaeaea !important;
+  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1) !important;
+  padding: 4px 0 !important;
+  min-width: 140px !important;
+  overflow: hidden !important;
+  background-color: #fff !important;
+}
+
+.r6o-widget.comment .r6o-comment-dropdown-menu li {
+  padding: 8px 16px !important;
+  font-size: 14px !important;
+  color: #495057 !important;
+  transition: background-color 0.2s ease, color 0.2s ease !important;
+}
+
+.r6o-widget.comment .r6o-comment-dropdown-menu li:hover {
+  background-color: var(--tf-primary-color-transparent, #f1f3f5) !important;
+  color: var(--tf-primary-color, #212529) !important;
 }</style>
     <link href="custom-theme/custom-theme.css" rel="stylesheet">
 
@@ -22424,14 +22609,26 @@ function showFormView() {
   const commentsHeader = document.getElementById("comments-header");
   const cmtFooter = document.getElementById("cmt-footer");
   const formCmt = document.getElementById("formio-cmt");
+  const commentsBtnTop = document.getElementById("comments-back-btn-top");
+  const formBackBtn = document.getElementById("form-back-btn");
+  const stickyHeader = document.getElementById("sticky-header");
 
   if (commentsHeader) commentsHeader.style.display = "none";
   if (cmtFooter) cmtFooter.style.display = "none";
   if (formCmt) formCmt.style.display = "none";
+  if (commentsBtnTop) commentsBtnTop.style.setProperty("display", "none", "important");
 
   if (formHeader) formHeader.style.display = "";
+  if (stickyHeader) stickyHeader.style.display = "";
   if (formEl) formEl.style.display = "";
   if (stickyFooter) stickyFooter.style.display = "flex";
+  if (formBackBtn) {
+    if (window.__unviredFormsOptions && window.__unviredFormsOptions.showBackButton) {
+      formBackBtn.style.setProperty("display", "flex", "important");
+    } else {
+      formBackBtn.style.setProperty("display", "none", "important");
+    }
+  }
 }
 
 function showCommentsView() {
@@ -22442,14 +22639,20 @@ function showCommentsView() {
   const commentsHeader = document.getElementById("comments-header");
   const cmtFooter = document.getElementById("cmt-footer");
   const formCmt = document.getElementById("formio-cmt");
+  const commentsBtnTop = document.getElementById("comments-back-btn-top");
+  const formBackBtn = document.getElementById("form-back-btn");
+  const stickyHeader = document.getElementById("sticky-header");
 
   if (formHeader) formHeader.style.display = "none";
   if (formEl) formEl.style.display = "none";
   if (stickyFooter) stickyFooter.style.display = "none";
+  if (stickyHeader) stickyHeader.style.display = "none";
+  if (formBackBtn) formBackBtn.style.setProperty("display", "none", "important");
 
   if (commentsHeader) commentsHeader.style.display = "";
   if (formCmt) formCmt.style.display = "";
   if (cmtFooter) cmtFooter.style.display = "flex";
+  if (commentsBtnTop) commentsBtnTop.style.setProperty("display", "inline-block", "important");
 }
 
 // expose to other modules
@@ -41649,10 +41852,12 @@ async function loadTRform(
     let initialDataSet = false;
     formObj.on("change", () => {
       if (!initialDataSet) {
-        try {
-          initialFormData = JSON.parse(JSON.stringify(formObj.getValue().data));
-        } catch (e) {
-          initialFormData = formObj.getValue().data;
+        if (!initialFormData) {
+          try {
+            initialFormData = JSON.parse(JSON.stringify(formObj.getValue().data));
+          } catch (e) {
+            initialFormData = formObj.getValue().data;
+          }
         }
         initialDataSet = true;
       }
@@ -42501,6 +42706,9 @@ window.FormOnPrevious = function () {
 window.formOnCompleteFunction = FormOnComplete;
 
 window.resetFormCache = resetFormCache;
+window.resetInitialFormData = function() {
+  initialFormData = null;
+};
 
 // Notify that loadTRform is ready (for event-based coordination)
 document.dispatchEvent(new CustomEvent('LoadRNformReady'));
@@ -42676,7 +42884,7 @@ async function loadCommentsform(
   template,
   userData,
   commentsData,
-  vobArr,
+  commentsVobArr,
   users = []
 ) {
   // ✅ Clean up existing instances before creating new ones
@@ -42737,7 +42945,7 @@ async function loadCommentsform(
         userSuggestions: users,
         editable: "MINE_ONLY",
       },
-      { widget: "TAG", vocabulary: vobArr },
+      { widget: "TAG", vocabulary: commentsVobArr },
     ],
     mode: "html",
   });
@@ -42902,7 +43110,7 @@ window.CommentOnBack = CommentOnBack;
 
     
     <div id="sticky-footer">
-        <div class="build-version">SDK v2.0.48</div>
+        <div class="build-version">SDK v2.0.50</div>
         <div class="relative-position">
             <button id="unvired-more-btn" class="ui button primary dataGrid-addRow" onclick="toggleTooltip()">
                 <i class="icon options"></i>
@@ -43068,7 +43276,7 @@ window.CommentOnBack = CommentOnBack;
             platform, language, translations,
             environmentVariable, themeData,
             userData, controlData, showBackButton, showMoreButton,
-            privateExternal, permission, attachmentfileKeys, commentsData, vobArr,
+            privateExternal, permission, attachmentfileKeys, commentsData, commentsVobArr,
             userList
         } = event.data;
 
@@ -43176,7 +43384,7 @@ window.CommentOnBack = CommentOnBack;
                 window.FORM_PREVIOUS_DATA = formPreviousData;
                 window.FORM_MODE = mode;
                 window.FORM_COMMENTS_DATA = commentsData || [];
-                window.FORM_VOB_ARR = vobArr || [];
+                window.FORM_VOB_ARR = commentsVobArr || [];
                 window.FORM_USERS_LIST = userList || [];
 
                 window.FORM_PLATFORM = platform;