pict-docuserve 0.0.23 → 0.0.25

package/dist/pict-docuserve.js

@@ -8469,7 +8469,7 @@ function _toPrimitive(t, r) { if ("object" != typeof t || !t) return t; var e =
         DefaultRenderable: "Docuserve-Splash-Content",
         DefaultDestinationAddress: "#Docuserve-Content-Container",
         AutoRender: false,
-        CSS: /*css*/"\n\t\t.docuserve-splash {\n\t\t\tdisplay: flex;\n\t\t\tflex-direction: column;\n\t\t\talign-items: center;\n\t\t\tjustify-content: center;\n\t\t\tmin-height: calc(100vh - 56px);\n\t\t\tpadding: 3em 2em;\n\t\t\ttext-align: center;\n\t\t\tbackground: linear-gradient(135deg, #F5F0E8 0%, #E4EFED 100%);\n\t\t}\n\t\t.docuserve-splash h1 {\n\t\t\tfont-size: 3em;\n\t\t\tfont-weight: 700;\n\t\t\tcolor: #3D3229;\n\t\t\tmargin: 0 0 0.25em 0;\n\t\t}\n\t\t.docuserve-splash-tagline {\n\t\t\tfont-size: 1.25em;\n\t\t\tcolor: #7A7568;\n\t\t\tmargin-bottom: 1.5em;\n\t\t\tfont-style: italic;\n\t\t}\n\t\t.docuserve-splash-description {\n\t\t\tfont-size: 1em;\n\t\t\tcolor: #5E5549;\n\t\t\tmax-width: 600px;\n\t\t\tline-height: 1.7;\n\t\t\tmargin-bottom: 2em;\n\t\t}\n\t\t.docuserve-splash-highlights {\n\t\t\tdisplay: grid;\n\t\t\tgrid-template-columns: repeat(auto-fit, minmax(200px, 1fr));\n\t\t\tgap: 1.25em;\n\t\t\tmax-width: 900px;\n\t\t\twidth: 100%;\n\t\t\tmargin-bottom: 2.5em;\n\t\t}\n\t\t.docuserve-splash-highlight-card {\n\t\t\tbackground: #fff;\n\t\t\tborder: 1px solid #DDD6CA;\n\t\t\tborder-radius: 8px;\n\t\t\tpadding: 1.25em;\n\t\t\ttext-align: left;\n\t\t\ttransition: box-shadow 0.2s, border-color 0.2s;\n\t\t}\n\t\t.docuserve-splash-highlight-card:hover {\n\t\t\tbox-shadow: 0 4px 16px rgba(0, 0, 0, 0.08);\n\t\t\tborder-color: #2E7D74;\n\t\t}\n\t\t.docuserve-splash-highlight-card h3 {\n\t\t\tmargin: 0 0 0.5em 0;\n\t\t\tcolor: #3D3229;\n\t\t\tfont-size: 1em;\n\t\t}\n\t\t.docuserve-splash-highlight-card p {\n\t\t\tmargin: 0;\n\t\t\tcolor: #7A7568;\n\t\t\tfont-size: 0.85em;\n\t\t\tline-height: 1.5;\n\t\t}\n\t\t.docuserve-splash-actions {\n\t\t\tdisplay: flex;\n\t\t\tgap: 1em;\n\t\t\tflex-wrap: wrap;\n\t\t\tjustify-content: center;\n\t\t}\n\t\t.docuserve-splash-actions a {\n\t\t\tdisplay: inline-block;\n\t\t\tpadding: 0.7em 1.5em;\n\t\t\tborder-radius: 6px;\n\t\t\tfont-size: 0.95em;\n\t\t\tfont-weight: 600;\n\t\t\ttext-decoration: none;\n\t\t\ttransition: background-color 0.15s, color 0.15s;\n\t\t\tcursor: pointer;\n\t\t}\n\t\t.docuserve-splash-actions .primary {\n\t\t\tbackground-color: #2E7D74;\n\t\t\tcolor: #fff;\n\t\t}\n\t\t.docuserve-splash-actions .primary:hover {\n\t\t\tbackground-color: #256861;\n\t\t}\n\t\t.docuserve-splash-actions .secondary {\n\t\t\tbackground-color: #fff;\n\t\t\tcolor: #3D3229;\n\t\t\tborder: 2px solid #2E7D74;\n\t\t}\n\t\t.docuserve-splash-actions .secondary:hover {\n\t\t\tborder-color: #256861;\n\t\t\tcolor: #2E7D74;\n\t\t}\n\t",
+        CSS: /*css*/"\n\t\t.docuserve-splash {\n\t\t\tdisplay: flex;\n\t\t\tflex-direction: column;\n\t\t\talign-items: center;\n\t\t\tjustify-content: center;\n\t\t\tmin-height: calc(100vh - 56px);\n\t\t\tpadding: 3em 2em;\n\t\t\ttext-align: center;\n\t\t\tbackground: linear-gradient(135deg, #F5F0E8 0%, #E4EFED 100%);\n\t\t}\n\t\t.docuserve-splash h1 {\n\t\t\tfont-size: 3em;\n\t\t\tfont-weight: 700;\n\t\t\tcolor: #3D3229;\n\t\t\tmargin: 0 0 0.25em 0;\n\t\t}\n\t\t.docuserve-splash h1 small {\n\t\t\tfont-size: 0.4em;\n\t\t\tfont-weight: 400;\n\t\t\tcolor: #7A7568;\n\t\t\tvertical-align: middle;\n\t\t\tmargin-left: 0.15em;\n\t\t}\n\t\t.docuserve-splash-tagline {\n\t\t\tfont-size: 1.25em;\n\t\t\tcolor: #7A7568;\n\t\t\tmargin-bottom: 1.5em;\n\t\t\tfont-style: italic;\n\t\t}\n\t\t.docuserve-splash-description {\n\t\t\tfont-size: 1em;\n\t\t\tcolor: #5E5549;\n\t\t\tmax-width: 600px;\n\t\t\tline-height: 1.7;\n\t\t\tmargin-bottom: 2em;\n\t\t}\n\t\t.docuserve-splash-highlights {\n\t\t\tdisplay: grid;\n\t\t\tgrid-template-columns: repeat(auto-fit, minmax(200px, 1fr));\n\t\t\tgap: 1.25em;\n\t\t\tmax-width: 900px;\n\t\t\twidth: 100%;\n\t\t\tmargin-bottom: 2.5em;\n\t\t}\n\t\t.docuserve-splash-highlight-card {\n\t\t\tbackground: #fff;\n\t\t\tborder: 1px solid #DDD6CA;\n\t\t\tborder-radius: 8px;\n\t\t\tpadding: 1.25em;\n\t\t\ttext-align: left;\n\t\t\ttransition: box-shadow 0.2s, border-color 0.2s;\n\t\t}\n\t\t.docuserve-splash-highlight-card:hover {\n\t\t\tbox-shadow: 0 4px 16px rgba(0, 0, 0, 0.08);\n\t\t\tborder-color: #2E7D74;\n\t\t}\n\t\t.docuserve-splash-highlight-card h3 {\n\t\t\tmargin: 0 0 0.5em 0;\n\t\t\tcolor: #3D3229;\n\t\t\tfont-size: 1em;\n\t\t}\n\t\t.docuserve-splash-highlight-card p {\n\t\t\tmargin: 0;\n\t\t\tcolor: #7A7568;\n\t\t\tfont-size: 0.85em;\n\t\t\tline-height: 1.5;\n\t\t}\n\t\t.docuserve-splash-actions {\n\t\t\tdisplay: flex;\n\t\t\tgap: 1em;\n\t\t\tflex-wrap: wrap;\n\t\t\tjustify-content: center;\n\t\t}\n\t\t.docuserve-splash-actions a {\n\t\t\tdisplay: inline-block;\n\t\t\tpadding: 0.7em 1.5em;\n\t\t\tborder-radius: 6px;\n\t\t\tfont-size: 0.95em;\n\t\t\tfont-weight: 600;\n\t\t\ttext-decoration: none;\n\t\t\ttransition: background-color 0.15s, color 0.15s;\n\t\t\tcursor: pointer;\n\t\t}\n\t\t.docuserve-splash-actions .primary {\n\t\t\tbackground-color: #2E7D74;\n\t\t\tcolor: #fff;\n\t\t}\n\t\t.docuserve-splash-actions .primary:hover {\n\t\t\tbackground-color: #256861;\n\t\t}\n\t\t.docuserve-splash-actions .secondary {\n\t\t\tbackground-color: #fff;\n\t\t\tcolor: #3D3229;\n\t\t\tborder: 2px solid #2E7D74;\n\t\t}\n\t\t.docuserve-splash-actions .secondary:hover {\n\t\t\tborder-color: #256861;\n\t\t\tcolor: #2E7D74;\n\t\t}\n\t",
         Templates: [{
           Hash: "Docuserve-Splash-Template",
           Template: /*html*/"\n<div class=\"docuserve-splash\">\n\t<h1 id=\"Docuserve-Splash-Title\"></h1>\n\t<div class=\"docuserve-splash-tagline\" id=\"Docuserve-Splash-Tagline\"></div>\n\t<div class=\"docuserve-splash-description\" id=\"Docuserve-Splash-Description\"></div>\n\t<div class=\"docuserve-splash-highlights\" id=\"Docuserve-Splash-Highlights\"></div>\n\t<div class=\"docuserve-splash-actions\" id=\"Docuserve-Splash-Actions\"></div>\n</div>\n"
@@ -8501,7 +8501,7 @@ function _toPrimitive(t, r) { if ("object" != typeof t || !t) return t; var e =
          * @param {Object} pCover - The parsed cover data { Title, Tagline, Description, Highlights, Actions }
          */
         renderFromCover(pCover) {
-          this.pict.ContentAssignment.assignContent('#Docuserve-Splash-Title', this.escapeHTML(pCover.Title));
+          this.pict.ContentAssignment.assignContent('#Docuserve-Splash-Title', this.sanitizeTitle(pCover.Title));
           this.pict.ContentAssignment.assignContent('#Docuserve-Splash-Tagline', this.escapeHTML(pCover.Tagline));
           this.pict.ContentAssignment.assignContent('#Docuserve-Splash-Description', this.escapeHTML(pCover.Description));
 
@@ -8583,6 +8583,21 @@ function _toPrimitive(t, r) { if ("object" != typeof t || !t) return t; var e =
           this.pict.ContentAssignment.assignContent('#Docuserve-Splash-Actions', '');
         }
 
+        /**
+         * Sanitize a title string, preserving only <small> tags.
+         * All other HTML is escaped.
+         *
+         * @param {string} pText - The raw title text
+         * @returns {string} The sanitized title HTML
+         */
+        sanitizeTitle(pText) {
+          if (!pText) {
+            return '';
+          }
+          // Escape everything first, then restore <small> and </small>
+          return this.escapeHTML(pText).replace(/&lt;small&gt;/gi, '<small>').replace(/&lt;\/small&gt;/gi, '</small>');
+        }
+
         /**
          * Escape HTML special characters.
          *
@@ -8608,7 +8623,7 @@ function _toPrimitive(t, r) { if ("object" != typeof t || !t) return t; var e =
         DefaultRenderable: "Docuserve-TopBar-Content",
         DefaultDestinationAddress: "#Docuserve-TopBar-Container",
         AutoRender: false,
-        CSS: /*css*/"\n\t\t.docuserve-topbar {\n\t\t\tdisplay: flex;\n\t\t\talign-items: center;\n\t\t\tjustify-content: space-between;\n\t\t\tbackground-color: #3D3229;\n\t\t\tcolor: #E8E0D4;\n\t\t\tpadding: 0 1.5em;\n\t\t\theight: 56px;\n\t\t\tbox-shadow: 0 2px 4px rgba(0, 0, 0, 0.12);\n\t\t\tposition: sticky;\n\t\t\ttop: 0;\n\t\t\tz-index: 100;\n\t\t}\n\t\t.docuserve-topbar-brand {\n\t\t\tfont-size: 1.25em;\n\t\t\tfont-weight: 600;\n\t\t\tletter-spacing: 0.02em;\n\t\t\tcolor: #E8E0D4;\n\t\t\ttext-decoration: none;\n\t\t\tcursor: pointer;\n\t\t}\n\t\t.docuserve-topbar-brand:hover {\n\t\t\tcolor: #fff;\n\t\t}\n\t\t.docuserve-topbar-nav {\n\t\t\tdisplay: flex;\n\t\t\talign-items: center;\n\t\t\tgap: 0.25em;\n\t\t}\n\t\t.docuserve-topbar-nav a {\n\t\t\tcolor: #B5AA9A;\n\t\t\ttext-decoration: none;\n\t\t\tpadding: 0.5em 0.75em;\n\t\t\tborder-radius: 4px;\n\t\t\tfont-size: 0.9em;\n\t\t\ttransition: background-color 0.15s, color 0.15s;\n\t\t\tcursor: pointer;\n\t\t}\n\t\t.docuserve-topbar-nav a:hover {\n\t\t\tbackground-color: #524438;\n\t\t\tcolor: #fff;\n\t\t}\n\t\t.docuserve-topbar-links {\n\t\t\tdisplay: flex;\n\t\t\talign-items: center;\n\t\t\tgap: 0.5em;\n\t\t}\n\t\t.docuserve-topbar-links a {\n\t\t\tcolor: #8A7F72;\n\t\t\ttext-decoration: none;\n\t\t\tfont-size: 0.85em;\n\t\t\tpadding: 0.4em 0.6em;\n\t\t\tborder-radius: 4px;\n\t\t\ttransition: background-color 0.15s, color 0.15s;\n\t\t}\n\t\t.docuserve-topbar-links a:hover {\n\t\t\tbackground-color: #524438;\n\t\t\tcolor: #E8E0D4;\n\t\t}\n\t\t.docuserve-topbar-toggle {\n\t\t\tdisplay: none;\n\t\t\tbackground: none;\n\t\t\tborder: none;\n\t\t\tcolor: #B5AA9A;\n\t\t\tfont-size: 1.3em;\n\t\t\tcursor: pointer;\n\t\t\tpadding: 0.3em 0.5em;\n\t\t\tmargin-left: 0.5em;\n\t\t\tline-height: 1;\n\t\t}\n\t\t.docuserve-topbar-toggle:hover {\n\t\t\tcolor: #fff;\n\t\t}\n\t\t.docuserve-topbar-right {\n\t\t\tdisplay: flex;\n\t\t\talign-items: center;\n\t\t}\n\t",
+        CSS: /*css*/"\n\t\t.docuserve-topbar {\n\t\t\tdisplay: flex;\n\t\t\talign-items: center;\n\t\t\tjustify-content: space-between;\n\t\t\tbackground-color: #3D3229;\n\t\t\tcolor: #E8E0D4;\n\t\t\tpadding: 0 1.5em;\n\t\t\theight: 56px;\n\t\t\tbox-shadow: 0 2px 4px rgba(0, 0, 0, 0.12);\n\t\t\tposition: sticky;\n\t\t\ttop: 0;\n\t\t\tz-index: 100;\n\t\t}\n\t\t.docuserve-topbar-brand {\n\t\t\tfont-size: 1.25em;\n\t\t\tfont-weight: 600;\n\t\t\tletter-spacing: 0.02em;\n\t\t\tcolor: #E8E0D4;\n\t\t\ttext-decoration: none;\n\t\t\tcursor: pointer;\n\t\t}\n\t\t.docuserve-topbar-brand small {\n\t\t\tfont-size: 0.65em;\n\t\t\tfont-weight: 400;\n\t\t\tcolor: #8A7F72;\n\t\t\tmargin-left: 0.2em;\n\t\t}\n\t\t.docuserve-topbar-brand:hover {\n\t\t\tcolor: #fff;\n\t\t}\n\t\t.docuserve-topbar-nav {\n\t\t\tdisplay: flex;\n\t\t\talign-items: center;\n\t\t\tgap: 0.25em;\n\t\t}\n\t\t.docuserve-topbar-nav a {\n\t\t\tcolor: #B5AA9A;\n\t\t\ttext-decoration: none;\n\t\t\tpadding: 0.5em 0.75em;\n\t\t\tborder-radius: 4px;\n\t\t\tfont-size: 0.9em;\n\t\t\ttransition: background-color 0.15s, color 0.15s;\n\t\t\tcursor: pointer;\n\t\t}\n\t\t.docuserve-topbar-nav a:hover {\n\t\t\tbackground-color: #524438;\n\t\t\tcolor: #fff;\n\t\t}\n\t\t.docuserve-topbar-links {\n\t\t\tdisplay: flex;\n\t\t\talign-items: center;\n\t\t\tgap: 0.5em;\n\t\t}\n\t\t.docuserve-topbar-links a {\n\t\t\tcolor: #8A7F72;\n\t\t\ttext-decoration: none;\n\t\t\tfont-size: 0.85em;\n\t\t\tpadding: 0.4em 0.6em;\n\t\t\tborder-radius: 4px;\n\t\t\ttransition: background-color 0.15s, color 0.15s;\n\t\t}\n\t\t.docuserve-topbar-links a:hover {\n\t\t\tbackground-color: #524438;\n\t\t\tcolor: #E8E0D4;\n\t\t}\n\t\t.docuserve-topbar-toggle {\n\t\t\tdisplay: none;\n\t\t\tbackground: none;\n\t\t\tborder: none;\n\t\t\tcolor: #B5AA9A;\n\t\t\tfont-size: 1.3em;\n\t\t\tcursor: pointer;\n\t\t\tpadding: 0.3em 0.5em;\n\t\t\tmargin-left: 0.5em;\n\t\t\tline-height: 1;\n\t\t}\n\t\t.docuserve-topbar-toggle:hover {\n\t\t\tcolor: #fff;\n\t\t}\n\t\t.docuserve-topbar-right {\n\t\t\tdisplay: flex;\n\t\t\talign-items: center;\n\t\t}\n\t",
         Templates: [{
           Hash: "Docuserve-TopBar-Template",
           Template: /*html*/"\n<div class=\"docuserve-topbar\">\n\t<a id=\"Docuserve-TopBar-Brand\" class=\"docuserve-topbar-brand\" href=\"#/Home\"></a>\n\t<div id=\"Docuserve-TopBar-Nav\" class=\"docuserve-topbar-nav\"></div>\n\t<div class=\"docuserve-topbar-right\">\n\t\t<div id=\"Docuserve-TopBar-Links\" class=\"docuserve-topbar-links\"></div>\n\t\t<button id=\"Docuserve-TopBar-Toggle\" class=\"docuserve-topbar-toggle\" onclick=\"{~P~}.views['Docuserve-Sidebar'].toggleSidebar()\">&#9776;</button>\n\t</div>\n</div>\n"
@@ -8645,7 +8660,7 @@ function _toPrimitive(t, r) { if ("object" != typeof t || !t) return t; var e =
             let tmpTopBar = tmpDocuserve.TopBar;
 
             // Brand
-            tmpBrandEl.textContent = tmpTopBar.Brand || 'Documentation';
+            tmpBrandEl.innerHTML = this.sanitizeTitle(tmpTopBar.Brand || 'Documentation');
 
             // Navigation links (centre)
             let tmpNavHTML = '<a href="#/Home">Home</a>';
@@ -8673,12 +8688,22 @@ function _toPrimitive(t, r) { if ("object" != typeof t || !t) return t; var e =
             } else if (tmpDocuserve.CatalogLoaded && tmpDocuserve.Catalog && tmpDocuserve.Catalog.Name) {
               tmpBrand = tmpDocuserve.Catalog.Name;
             }
-            tmpBrandEl.textContent = tmpBrand;
+            tmpBrandEl.innerHTML = this.sanitizeTitle(tmpBrand);
             tmpNavEl.innerHTML = '<a href="#/Home">Home</a>';
             tmpLinksEl.innerHTML = tmpDocuserve.KeywordIndexLoaded ? '<a href="#/search/">Search</a>' : '';
           }
         }
 
+        /**
+         * Sanitize a title string, preserving only <small> tags.
+         */
+        sanitizeTitle(pText) {
+          if (!pText) {
+            return '';
+          }
+          return this.escapeHTML(pText).replace(/&lt;small&gt;/gi, '<small>').replace(/&lt;\/small&gt;/gi, '</small>');
+        }
+
         /**
          * Escape HTML special characters.
          */