spec-up-t 1.1.31 → 1.1.33

package/assets/compiled/body.js

@@ -134,7 +134,7 @@ function tokenInput(){let t=document.createElement("button");t.classList.add("bu
 function pdfDownload(){fetch("index.pdf",{method:"HEAD"}).then(e=>{if(e.ok){let e=document.createElement("a");e.classList.add("button-pdf-download"),e.classList.add("btn"),e.target="_blank",e.rel="noopener noreferrer",e.href="index.pdf",e.title="Download this page as a PDF",e.innerHTML="PDF",document.querySelector("#container-search-h7vc6omi2hr2880").appendChild(e)}else console.log("PDF file does not exist. No PDF download button will be added.")}).catch(e=>{console.error("Error checking PDF file:",e)})}document.addEventListener("DOMContentLoaded",(function(){pdfDownload()}));
 function helpButtons(){const t=document.createElement("a");t.textContent="?",t.classList.add("help-button","btn"),t.title="Click to see the explanation of the buttons at the documentation website, in a new tab.",t.target="_blank",t.rel="noopener noreferrer",t.href="https://trustoverip.github.io/spec-up-t-website/docs/user-interface-overview/specification#explanation-of-the-buttons-in-the-specification",function(t){document.querySelectorAll("#content dl dt").forEach(e=>{e.appendChild(t.cloneNode(!0))})}(t)}document.addEventListener("DOMContentLoaded",helpButtons);
 function collapseDefinitions(){const t=document.querySelectorAll("#content dl.terms-and-definitions-list > dd"),e=document.querySelectorAll("#content dl.terms-and-definitions-list > dt"),n=document.querySelectorAll(".collapse-all-defs-button");e.forEach(t=>{const e=document.createElement("button");e.classList.add("collapse-all-defs-button","btn"),e.innerHTML="▲",e.setAttribute("id","toggleButton"),t.appendChild(e)}),document.addEventListener("click",e=>{e.target.classList.contains("collapse-all-defs-button")&&(!function(){const e=t[0].classList.contains("hidden");t.forEach(t=>{t.classList.toggle("hidden",!e),t.classList.toggle("visible",e)}),n.forEach(t=>{t.innerHTML=e?"▲":"▼",t.title=e?"Collapse all definitions":"Expand all definitions"})}(),e.target.scrollIntoView({behavior:"smooth",block:"start",inline:"nearest"}),setTimeout(()=>{window.scrollBy({top:-100,behavior:"smooth"})},500))})}document.addEventListener("DOMContentLoaded",(function(){collapseDefinitions()}));
-function createToggleButton(t){const e=document.createElement("button");e.classList.add("meta-info-toggle-button","btn"),e.textContent="🔍",e.title="Meta info",e.addEventListener("click",(function(){t.classList.toggle("collapsed"),t.classList.contains("collapsed"),this.textContent="🔍"}));let n=t.previousElementSibling;for(;n&&"DT"!==n.tagName;)n=n.previousElementSibling;n?n.appendChild(e):t.insertBefore(e,t.firstChild)}document.addEventListener("DOMContentLoaded",(function(){document.querySelectorAll(".contains-table").forEach((function(t){const e=document.createElement("div");for(e.classList.add("meta-info-content-wrapper");t.firstChild&&t.firstChild!==t.querySelector(".meta-info-toggle-button");)e.appendChild(t.firstChild);t.querySelector(".meta-info-toggle-button")||createToggleButton(t),t.appendChild(e),t.classList.add("collapsed")}))}));
+function createToggleButton(t){const e=document.createElement("button");e.classList.add("meta-info-toggle-button","btn"),e.textContent="ℹ️",e.title="Meta info",e.addEventListener("click",(function(){t.classList.toggle("collapsed"),t.classList.contains("collapsed"),this.textContent="ℹ️"}));let n=t.previousElementSibling;for(;n&&"DT"!==n.tagName;)n=n.previousElementSibling;n?n.appendChild(e):t.insertBefore(e,t.firstChild)}document.addEventListener("DOMContentLoaded",(function(){document.querySelectorAll("dl > dd:has(table)").forEach((function(t){const e=document.createElement("div");for(e.classList.add("meta-info-content-wrapper");t.firstChild&&t.firstChild!==t.querySelector(".meta-info-toggle-button");)e.appendChild(t.firstChild);t.querySelector(".meta-info-toggle-button")||createToggleButton(t),t.appendChild(e),t.classList.add("collapsed")}))}));
 /**
  * @file This file adds an href attribute to the snapshot link on the page via client side JS DOM manipulation.
  * @author Kor Dwarshuis

package/assets/compiled/head.css

@@ -8,7 +8,7 @@ code[class*=language-],pre[class*=language-]{color:#ccc;background:0 0;font-fami
 #back-to-top-a1zncgtqfpzsig8{position:fixed;bottom:20px;text-decoration:none;left:calc(100% - 1.8em);width:1.5em;height:1.5em;margin:0;padding:0;background-color:#1e6eae;color:#222;border-radius:50px;text-align:center;font-size:30px;color:#fff;box-shadow:0 0 1.3px rgba(0,0,0,.07),0 0 3.6px rgba(0,0,0,.1),0 0 8.7px rgba(0,0,0,.13),0 0 29px rgba(0,0,0,.2);cursor:pointer;border:none;display:none;align-items:center;justify-content:center}
 @-webkit-keyframes notyf-fadeinup{0%{opacity:0;transform:translateY(25%)}to{opacity:1;transform:translateY(0)}}@keyframes notyf-fadeinup{0%{opacity:0;transform:translateY(25%)}to{opacity:1;transform:translateY(0)}}@-webkit-keyframes notyf-fadeinleft{0%{opacity:0;transform:translateX(25%)}to{opacity:1;transform:translateX(0)}}@keyframes notyf-fadeinleft{0%{opacity:0;transform:translateX(25%)}to{opacity:1;transform:translateX(0)}}@-webkit-keyframes notyf-fadeoutright{0%{opacity:1;transform:translateX(0)}to{opacity:0;transform:translateX(25%)}}@keyframes notyf-fadeoutright{0%{opacity:1;transform:translateX(0)}to{opacity:0;transform:translateX(25%)}}@-webkit-keyframes notyf-fadeoutdown{0%{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(25%)}}@keyframes notyf-fadeoutdown{0%{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(25%)}}@-webkit-keyframes ripple{0%{transform:scale(0) translateY(-45%) translateX(13%)}to{transform:scale(1) translateY(-45%) translateX(13%)}}@keyframes ripple{0%{transform:scale(0) translateY(-45%) translateX(13%)}to{transform:scale(1) translateY(-45%) translateX(13%)}}.notyf{position:fixed;top:0;left:0;height:100%;width:100%;color:#fff;z-index:9999;display:flex;flex-direction:column;align-items:flex-end;justify-content:flex-end;pointer-events:none;box-sizing:border-box;padding:20px}.notyf__icon--error,.notyf__icon--success{height:21px;width:21px;background:#fff;border-radius:50%;display:block;margin:0 auto;position:relative}.notyf__icon--error:after,.notyf__icon--error:before{content:"";background:currentColor;display:block;position:absolute;width:3px;border-radius:3px;left:9px;height:12px;top:5px}.notyf__icon--error:after{transform:rotate(-45deg)}.notyf__icon--error:before{transform:rotate(45deg)}.notyf__icon--success:after,.notyf__icon--success:before{content:"";background:currentColor;display:block;position:absolute;width:3px;border-radius:3px}.notyf__icon--success:after{height:6px;transform:rotate(-45deg);top:9px;left:6px}.notyf__icon--success:before{height:11px;transform:rotate(45deg);top:5px;left:10px}.notyf__toast{display:block;overflow:hidden;pointer-events:auto;-webkit-animation:notyf-fadeinup .3s ease-in forwards;animation:notyf-fadeinup .3s ease-in forwards;box-shadow:0 3px 7px 0 rgba(0,0,0,.25);position:relative;padding:0 15px;border-radius:2px;max-width:300px;transform:translateY(25%);box-sizing:border-box;flex-shrink:0}.notyf__toast--disappear{transform:translateY(0);-webkit-animation:notyf-fadeoutdown .3s forwards;animation:notyf-fadeoutdown .3s forwards;-webkit-animation-delay:.25s;animation-delay:.25s}.notyf__toast--disappear .notyf__icon,.notyf__toast--disappear .notyf__message{-webkit-animation:notyf-fadeoutdown .3s forwards;animation:notyf-fadeoutdown .3s forwards;opacity:1;transform:translateY(0)}.notyf__toast--disappear .notyf__dismiss{-webkit-animation:notyf-fadeoutright .3s forwards;animation:notyf-fadeoutright .3s forwards;opacity:1;transform:translateX(0)}.notyf__toast--disappear .notyf__message{-webkit-animation-delay:.05s;animation-delay:.05s}.notyf__toast--upper{margin-bottom:20px}.notyf__toast--lower{margin-top:20px}.notyf__toast--dismissible .notyf__wrapper{padding-right:30px}.notyf__ripple{height:400px;width:400px;position:absolute;transform-origin:bottom right;right:0;top:0;border-radius:50%;transform:scale(0) translateY(-51%) translateX(13%);z-index:5;-webkit-animation:ripple .4s ease-out forwards;animation:ripple .4s ease-out forwards}.notyf__wrapper{display:flex;align-items:center;padding-top:17px;padding-bottom:17px;padding-right:15px;border-radius:3px;position:relative;z-index:10}.notyf__icon{width:22px;text-align:center;font-size:1.3em;opacity:0;-webkit-animation:notyf-fadeinup .3s forwards;animation:notyf-fadeinup .3s forwards;-webkit-animation-delay:.3s;animation-delay:.3s;margin-right:13px}.notyf__dismiss{position:absolute;top:0;right:0;height:100%;width:26px;margin-right:-15px;-webkit-animation:notyf-fadeinleft .3s forwards;animation:notyf-fadeinleft .3s forwards;-webkit-animation-delay:.35s;animation-delay:.35s;opacity:0}.notyf__dismiss-btn{background-color:rgba(0,0,0,.25);border:none;cursor:pointer;transition:opacity .2s ease,background-color .2s ease;outline:0;opacity:.35;height:100%;width:100%}.notyf__dismiss-btn:after,.notyf__dismiss-btn:before{content:"";background:#fff;height:12px;width:2px;border-radius:3px;position:absolute;left:calc(50% - 1px);top:calc(50% - 5px)}.notyf__dismiss-btn:after{transform:rotate(-45deg)}.notyf__dismiss-btn:before{transform:rotate(45deg)}.notyf__dismiss-btn:hover{opacity:.7;background-color:rgba(0,0,0,.15)}.notyf__dismiss-btn:active{opacity:.8}.notyf__message{vertical-align:middle;position:relative;opacity:0;-webkit-animation:notyf-fadeinup .3s forwards;animation:notyf-fadeinup .3s forwards;-webkit-animation-delay:.25s;animation-delay:.25s;line-height:1.5em}@media only screen and (max-width:480px){.notyf{padding:0}.notyf__ripple{height:600px;width:600px;-webkit-animation-duration:.5s;animation-duration:.5s}.notyf__toast{max-width:none;border-radius:0;box-shadow:0 -2px 7px 0 rgba(0,0,0,.13);width:100%}.notyf__dismiss{width:56px}}
 #content dl dd.hidden{display:none}#content dl dd.visible{display:block}.collapse-all-defs-button{float:right}
-.contains-table>.meta-info-content-wrapper{max-height:100px;transition:max-height .3s ease-out}.contains-table.collapsed>.meta-info-content-wrapper{padding-top:0;padding-bottom:0;overflow:hidden;transition:max-height .3s ease-out;max-height:0}
+dl>dd:has(table)>.meta-info-content-wrapper{max-height:100px;transition:max-height .3s ease-out}dl>dd:has(table).collapsed>.meta-info-content-wrapper{padding-top:0;padding-bottom:0;overflow:hidden;transition:max-height .3s ease-out;max-height:0}
 .modal-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background-color:rgba(0,0,0,.5);display:flex;justify-content:center;align-items:center;z-index:1000}.modal{background-color:#fff;padding:2rem 20px 20px;border-radius:8px;max-width:80%;max-height:80%;overflow-y:auto;position:relative;box-shadow:0 2px 10px rgba(0,0,0,.1)}.modal-close{position:absolute;top:0;right:5px;background-color:transparent;border:none;font-size:2rem;line-height:1;cursor:pointer}
 .alphabet-index-container{margin-bottom:1em}.alphabet-index-container,.number-of-terms{font-size:.8em;text-align:center;width:100%}.alphabet-index-container a{background-color:#f5f5f5;border:1px solid #e0e0e0;border-radius:50%;color:#333;display:inline-block;font-size:.9rem;height:20px;line-height:20px;margin:2px;text-align:center;text-decoration:none;width:20px}
 .button-pdf-download{padding-left:.1em;padding-right:.1em;border:none;background:red;color:#fff;box-shadow:2.8px 2.8px 2.2px rgba(0,0,0,.02),6.7px 6.7px 5.3px rgba(0,0,0,.028),12.5px 12.5px 10px rgba(0,0,0,.035),22.3px 22.3px 17.9px rgba(0,0,0,.042),41.8px 41.8px 33.4px rgba(0,0,0,.05),100px 100px 80px rgba(0,0,0,.07)}
@@ -24,4 +24,4 @@ h2,h3,h4,h5,h6{margin-top:1.5em!important}.toc-anchor{font-size:.875em;color:inh
 article a[href^="https://"]:not(.btn)::after,article a[href^=http]:not(.btn)::after{content:'';width:12px;height:12px;margin-left:4px;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='currentColor' viewBox='0 0 16 16'%3E%3Cpath fill-rule='evenodd' d='M8.636 3.5a.5.5 0 0 0-.5-.5H1.5A1.5 1.5 0 0 0 0 4.5v10A1.5 1.5 0 0 0 1.5 16h10a1.5 1.5 0 0 0 1.5-1.5V7.864a.5.5 0 0 0-1 0V14.5a.5.5 0 0 1-.5.5h-10a.5.5 0 0 1-.5-.5v-10a.5.5 0 0 1 .5-.5h6.636a.5.5 0 0 0 .5-.5z'/%3E%3Cpath fill-rule='evenodd' d='M16 .5a.5.5 0 0 0-.5-.5h-5a.5.5 0 0 0 0 1h3.793L6.146 9.146a.5.5 0 1 0 .708.708L15 1.707V5.5a.5.5 0 0 0 1 0v-5z'/%3E%3C/svg%3E");background-position:center;background-repeat:no-repeat;background-size:contain;display:inline-block}
 #repo_issues>header{background:#eee;border-bottom:1px solid #ddd}#repo_issues>header span:first-of-type{font-weight:700;padding-top:.1em}#repo_issues>header .repo-issue-toggle{margin-left:auto;color:inherit;font-weight:700;text-decoration:none}#repo_issue_list{list-style:none;margin:0;padding:0 1.25em 1.25em;font-size:.85em;overflow:auto;-ms-overflow-style:none;scrollbar-width:none}#repo_issue_list::-webkit-scrollbar{display:none}#repo_issue_list:empty:before{content:"No issues found";display:block;text-align:center;font-size:1.1em;color:#aaa;margin:1em 0 0}.repo-issue detail-box{display:flex;flex-direction:column;padding:1em 0;border-bottom:1px solid #ddd}.repo-issue detail-box>section{order:1}.repo-issue detail-box>section:empty+.repo-issue-title [detail-box-toggle]{display:none}.repo-issue-title{display:flex;align-items:center}.repo-issue-link{flex:1;margin:0 0 0 .5em}.repo-issue-number{height:1em;margin:0 .4em 0 0;padding:.3em .25em 0;border-radius:3px;font-weight:700;background:#eee;border:1px solid #ddd;text-align:center;line-height:1em}.repo-issue-number:before{content:"#";font-weight:400;margin:0 .1em 0 0}.repo-issue [detail-box-toggle]{margin:0 0 0 1em;opacity:.35;transition:opacity .4s}.repo-issue [detail-box-toggle]:hover,.repo-issue detail-box[open] [detail-box-toggle]{opacity:1}
 .adjust-font-size #decreaseBtn{background:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100" xmlns:xlink="http://www.w3.org/1999/xlink"><text x="50%" y="50%" font-family="Times New Roman" font-size="50" fill="black" dominant-baseline="middle" text-anchor="middle">A</text></svg>') no-repeat center}.adjust-font-size #increaseBtn{background:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100" xmlns:xlink="http://www.w3.org/1999/xlink"><text x="50%" y="50%" font-family="Times New Roman" font-size="80" fill="black" dominant-baseline="middle" text-anchor="middle">A</text></svg>') no-repeat center}
-:target{scroll-margin-top:calc(50vh)}body:not([hashscroll]) :target{animation:highlight-target 3.5s .25s ease}body:not([hashscroll]) dt:has(:target){animation:highlight-target-parent-dt 3.5s .25s ease}svg[icon]{width:1.25em;height:1.25em;vertical-align:text-top}@keyframes highlight-target{50%{background-color:#ff0}}@keyframes highlight-target-parent-dt{50%{background-color:#ff0;border:1px solid #00c8ff}}#svg{display:none}main *{word-break:break-all;overflow-wrap:break-word}dd td img{max-width:30px}.notice{margin:1em 0;padding:.5em .9em .55em .65em;border-left:.5em solid}.notice p{margin:.4em 0 0}.note{background:#e9fbe9;border-color:#52e052}.note .notice-link{display:block;color:#178217}.issue{background:#e9f0fb;border-color:#527fe0}.issue .notice-link:before{display:block;color:#1e4cae}.warning{background:#fbe9e9;border-color:#e05252}.warning .notice-link{display:block;color:#ae1e1e}.example{color:#cebe00;background:#1a1e23;border-left:.5em solid}.example .notice-link{display:block;color:inherit;font-size:1.1em;font-family:Heebo,san-serif}.example pre[class*=language-]{padding:0;border-radius:0}.todo{background:#fbe4ff;border-color:#9700e2}.todo .notice-link{display:block;color:#6d00a2}
+:target{scroll-margin-top:calc(50vh)}body:not([hashscroll]) :target{animation:highlight-target 3.5s .25s ease}body:not([hashscroll]) dt:has(:target){animation:highlight-target-parent-dt 3.5s .25s ease}svg[icon]{width:1.25em;height:1.25em;vertical-align:text-top}@keyframes highlight-target{50%{background-color:#ff0}}@keyframes highlight-target-parent-dt{50%{background-color:#ff0;border:1px solid #00c8ff}}#svg{display:none}main *{overflow-wrap:anywhere;word-break:normal}dd td img{max-width:30px}.notice{margin:1em 0;padding:.5em .9em .55em .65em;border-left:.5em solid}.notice p{margin:.4em 0 0}.note{background:#e9fbe9;border-color:#52e052}.note .notice-link{display:block;color:#178217}.issue{background:#e9f0fb;border-color:#527fe0}.issue .notice-link:before{display:block;color:#1e4cae}.warning{background:#fbe9e9;border-color:#e05252}.warning .notice-link{display:block;color:#ae1e1e}.example{color:#cebe00;background:#1a1e23;border-left:.5em solid}.example .notice-link{display:block;color:inherit;font-size:1.1em;font-family:Heebo,san-serif}.example pre[class*=language-]{padding:0;border-radius:0}.todo{background:#fbe4ff;border-color:#9700e2}.todo .notice-link{display:block;color:#6d00a2}

package/assets/css/collapse-meta-info.css

@@ -4,13 +4,13 @@
   Description: Make the meta-info tables collapsible
 */
 
-.contains-table>.meta-info-content-wrapper {
+dl>dd:has(table)>.meta-info-content-wrapper {
   max-height: 100px;
   transition: max-height 0.3s ease-out;
   /* This should be higher than the tallest content */
 }
 
-.contains-table.collapsed>.meta-info-content-wrapper {
+dl>dd:has(table).collapsed>.meta-info-content-wrapper {
   padding-top: 0;
   padding-bottom: 0;
 

package/assets/css/index.css

@@ -35,13 +35,11 @@ svg[icon] {
   display: none;
 }
 
-
 main * {
-  word-break: break-all;
-  /* Breaks at any character */
-  /* OR */
-  overflow-wrap: break-word;
-  /* Breaks only at allowed break points, more browser support */
+  overflow-wrap: anywhere;
+  /* Breaks long URLs at any point without distorting column width */
+  word-break: normal;
+  /* Breaks words at logical places according to the language */
 }
 
 dd td img {

package/assets/js/collapse-meta-info.js

@@ -9,16 +9,16 @@
 function createToggleButton(element) {
     const toggleButton = document.createElement('button');
     toggleButton.classList.add('meta-info-toggle-button', 'btn');
-    toggleButton.textContent = '🔍';
+    toggleButton.textContent = 'ℹ️';
     toggleButton.title = 'Meta info';
 
     // Add event listener to the button
     toggleButton.addEventListener('click', function () {
         element.classList.toggle('collapsed');
         if (element.classList.contains('collapsed')) {
-            this.textContent = '🔍';
+            this.textContent = 'ℹ️';
         } else {
-            this.textContent = '🔍';
+            this.textContent = 'ℹ️';
         }
     });
 
@@ -37,7 +37,7 @@ function createToggleButton(element) {
 
 // Find all elements with class 'collapsible' and make them collapsible
 document.addEventListener('DOMContentLoaded', function () {
-    const collapsibles = document.querySelectorAll('.contains-table');
+    const collapsibles = document.querySelectorAll('dl > dd:has(table)');
 
     collapsibles.forEach(function (element) {
         // Wrap content (excluding button) in a div for easy toggling

package/index.js

@@ -267,7 +267,7 @@ module.exports = async function (options = {}) {
           const termsIndex = (spec.markdown_paths || ['spec.md']).indexOf('terms-and-definitions-intro.md');
           if (termsIndex !== -1) {
                 // Append the HTML string to the content of terms-and-definitions-intro.md. This string is used to create a div that is used to insert an alphabet index, and a div that is used as the starting point of the terminology index. The newlines are essential for the correct rendering of the markdown.
-            docs[termsIndex] += '\n\n<div id="terminology-section-utility-container"></div>\n\n<div id="terminology-section-start-h7vc6omi2hr2880"></div>\n\n';
+            docs[termsIndex] += '\n\n<div id="terminology-section-start-h7vc6omi2hr2880"></div>\n\n';
           }
 
           let doc = docs.join("\n");

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "spec-up-t",
-  "version": "1.1.31",
+  "version": "1.1.33",
   "description": "Technical specification drafting tool that generates rich specification documents from markdown. Forked from https://github.com/decentralized-identity/spec-up by Daniel Buchner (https://github.com/csuwildcat)",
   "main": "./index",
   "repository": {

package/src/fix-markdown-files.js

@@ -53,9 +53,15 @@ function fixMarkdownFiles(directory) {
                             }
                         }
 
-                        // Prepend `~ ` to lines that do not start with `[[def:` and are not blank, and do not already start with `~ `
+                        // Prepend `~ ` to lines that do not start with `[[def:`, `[[tref:`, are not blank, do not already start with `~ `, and are not HTML comments
                         for (let i = 0; i < newLines.length; i++) {
-                            if (!newLines[i].startsWith('[[def:') && !newLines[i].startsWith('[[tref:') && newLines[i].trim() !== '' && !newLines[i].startsWith('~ ')) {
+                            if (
+                                !newLines[i].startsWith('[[def:') &&
+                                !newLines[i].startsWith('[[tref:') &&
+                                newLines[i].trim() !== '' &&
+                                !newLines[i].startsWith('~ ') &&
+                                !newLines[i].trim().startsWith('<!--')
+                            ) {
                                 newLines[i] = `~ ${newLines[i]}`;
                                 modified = true;
                             }

package/src/prepare-tref.js

@@ -1,11 +1,22 @@
 /**
  * @file prepare-tref.js
- * @description This script contains functions to process and prepare term references (trefs) from markdown files.
- * It includes functionality to read local xtref content from a JSON file and process markdown files in a directory recursively. This script inserts the content of the local xtref (in JSON) into the markdown files. It also inserts a note that this content is temporary and can be removed.
+ * @description This module provides functionality to process markdown files in a directory recursively, 
+ * searching for specific `[[tref:]]` references, and replacing them with detailed information 
+ * fetched from a local JSON file (`xtrefs-data.json`). The information includes metadata such as 
+ * owner, repository, commit hash, and content. If no matching reference is found, a placeholder 
+ * message is written to the file.
+ * 
+ * The module includes:
+ * - A helper function `getLocalXTrefContent` to retrieve reference data from the JSON file.
+ * - A main function `prepareTref` to process directories and markdown files, replacing tref references.
+ * 
+ * This is useful for dynamically enriching markdown documentation with external reference details.
+ * 
+ * @requires fs - Node.js file system module for reading and writing files.
+ * @requires path - Node.js path module for handling file paths.
+ * @requires dedent - A utility for removing indentation from multi-line strings.
  * 
  * @module prepareTref
- * @requires fs
- * @requires path
  */
 
 const fs = require('fs');
@@ -54,8 +65,7 @@ function prepareTref(directory) {
 
                         // Split the content into lines
                         let lines = data.split('\n');
-                        let localXTrefContent = '';
-                        // Handle specific functionality for `[[tref:` lines
+
                         for (let i = 0; i < lines.length; i++) {
                             if (lines[i].startsWith('[[tref:')) {
 
@@ -74,34 +84,19 @@ function prepareTref(directory) {
                                 const match = lines[i].match(tref);
                                 if (match) {
                                     const result = match[1].split(',').map(term => term.trim());
-                                    localXTrefContent = getLocalXTrefContent(result[0], result[1]);
-                                    /* 
-
-                                        Remove the `[[def: ...]]:` lines from the content.
-
-                                        \[\[def: matches the literal [[def:
-                                        
-                                        .*? lazily matches any character(including commas) until the next part of the regex.
-                                        
-                                        \]\]: matches the literal ]]:.
-                                        
-                                        The g flag ensures that all occurrences in the string are replaced.
-                                    */
-                                    // const defPart = /\[\[def: .*?\]\]:/g;
-                                    const defPart = /\[\[def: ([^,]+),.*?\]\]/g;
+                                    const localXTrefContent = getLocalXTrefContent(result[0], result[1]);
 
+                                    const defPart = /\[\[def: ([^,]+),.*?\]\]/g;
                                     localXTrefContent.content = localXTrefContent.content.replace(defPart, '');
 
                                     const readyForWrite = dedent`
 ${match[0]}
-<!-- This is a copy of the saved remote text. Remove it if you like. It is automatically (re)generated -->
-<dd>
 | Property | Value |
 | -------- | ----- |
 | Owner | ![avatar](${localXTrefContent.avatarUrl}) ${localXTrefContent.owner} |
 | Repo | [${localXTrefContent.repo}](${localXTrefContent.repoUrl}) |
 | Commit hash | ${localXTrefContent.commitHash} |
-</dd>
+
 ${localXTrefContent.content}
 `;
 
@@ -110,8 +105,7 @@ ${localXTrefContent.content}
                             }
                         }
                     } catch (err) {
-                        fs.writeFileSync(itemPath, match[0] + '\n\n' + '<!-- This is a copy of the saved remote text. Remove it if you like. It is automatically (re)generated -->\n\nNothing found, so nothing to show.', 'utf8');
-                        // console.error(`❌ Error reading or writing file ${item.name}: ${err}`);
+                        fs.writeFileSync(itemPath, match[0] + '\n\n' + '\n\nNothing found, so nothing to show.', 'utf8');
                     }
                 }
             });
@@ -120,10 +114,9 @@ ${localXTrefContent.content}
         }
     }
 
-    // Start processing from the given directory
     processDirectory(directory);
 }
 
 module.exports = {
     prepareTref
-};
+};

package/templates/template.html

@@ -209,6 +209,7 @@
 
             <main class="col-md-8 ms-sm-auto col-lg-9 px-md-4 pt-5">
                 <article id="content" class="">
+                    <div id="terminology-section-utility-container"></div>
                     ${render}
                 </article>