domma-js 0.19.7 → 0.20.2

package/public/dist/bundles/domma-minimal.css

@@ -1,8 +1,8 @@
 /*!
- * Domma Minimal CSS Bundle v0.19.7
+ * Domma Minimal CSS Bundle v0.20.2
  * Dynamic Object Manipulation & Modeling API
  * (c) 2026 Darryl Waterhouse & DCBW-IT
- * Built: 2026-03-17T08:58:22.792Z
+ * Built: 2026-03-17T14:10:01.348Z
  */
 
 /* ============================================
@@ -11,11 +11,11 @@
    ============================================ */
 
 /*!
- * Domma Core CSS v0.19.7
+ * Domma Core CSS v0.20.2
  * Dynamic Object Manipulation & Modeling API
  * (c) 2026 Darryl Waterhouse & DCBW-IT
- * Built: 2026-03-17T08:58:22.398Z
- * Commit: 58dfa50
+ * Built: 2026-03-17T14:10:00.837Z
+ * Commit: 22809b0
  */
 
 /**
@@ -155,6 +155,13 @@
     --dm-selected-bg: var(--dm-blue-100);
     --dm-disabled-opacity: 0.5;
 
+    /* Translucency */
+    --dm-translucent-light: 0.85;
+    --dm-translucent: 0.7;
+    --dm-translucent-heavy: 0.5;
+    --dm-translucent-glass-blur: 8px;
+    --dm-translucent-glass-opacity: 0.75;
+
     /* ================================================
        BRAND COLORS
        ================================================ */
@@ -2176,20 +2183,67 @@ code, pre {
     user-select: text;
 }
 
-.opacity-0 {
-    opacity: 0;
+/* ============================================
+   OPACITY SCALE
+   Full graduated opacity scale (0–100)
+   ============================================ */
+
+.opacity-0   { opacity: 0; }
+.opacity-10  { opacity: 0.1; }
+.opacity-20  { opacity: 0.2; }
+.opacity-25  { opacity: 0.25; }
+.opacity-30  { opacity: 0.3; }
+.opacity-40  { opacity: 0.4; }
+.opacity-50  { opacity: 0.5; }
+.opacity-60  { opacity: 0.6; }
+.opacity-70  { opacity: 0.7; }
+.opacity-75  { opacity: 0.75; }
+.opacity-80  { opacity: 0.8; }
+.opacity-90  { opacity: 0.9; }
+.opacity-100 { opacity: 1; }
+
+/* ============================================
+   TRANSLUCENT UTILITIES
+   Semantic transparency classes for UI elements
+   ============================================ */
+
+.translucent-light {
+    opacity: var(--dm-translucent-light);
+    transition: opacity var(--dm-transition-normal);
 }
 
-.opacity-50 {
-    opacity: 0.5;
+.translucent {
+    opacity: var(--dm-translucent);
+    transition: opacity var(--dm-transition-normal);
 }
 
-.opacity-75 {
-    opacity: 0.75;
+.translucent-heavy {
+    opacity: var(--dm-translucent-heavy);
+    transition: opacity var(--dm-transition-normal);
 }
 
-.opacity-100 {
-    opacity: 1;
+/* Frosted glass — semi-transparent background + blur */
+.translucent-glass {
+    background-color: rgba(255, 255, 255, var(--dm-translucent-glass-opacity));
+    backdrop-filter: blur(var(--dm-translucent-glass-blur));
+    -webkit-backdrop-filter: blur(var(--dm-translucent-glass-blur));
+    transition: opacity var(--dm-transition-normal);
+}
+
+/* Hover variants — apply translucency on hover */
+.translucent-hover:hover {
+    opacity: var(--dm-translucent);
+    transition: opacity var(--dm-transition-normal);
+}
+
+.translucent-light-hover:hover {
+    opacity: var(--dm-translucent-light);
+    transition: opacity var(--dm-transition-normal);
+}
+
+.translucent-heavy-hover:hover {
+    opacity: var(--dm-translucent-heavy);
+    transition: opacity var(--dm-transition-normal);
 }
 
 .transition {
@@ -4772,11 +4826,11 @@ body.dm-cloaked.dm-ready {
    ============================================ */
 
 /*!
- * Domma Grid CSS v0.19.7
+ * Domma Grid CSS v0.20.2
  * Dynamic Object Manipulation & Modeling API
  * (c) 2026 Darryl Waterhouse & DCBW-IT
- * Built: 2026-03-17T08:58:22.407Z
- * Commit: 58dfa50
+ * Built: 2026-03-17T14:10:00.852Z
+ * Commit: 22809b0
  */
 
 /**

package/public/dist/domma-syntax.min.js

@@ -1,8 +1,8 @@
 /*!
- * Domma Syntax Highlighter v0.19.7
+ * Domma Syntax Highlighter v0.20.2
  * Lightweight code syntax highlighting for JavaScript, HTML, and CSS
  * (c) 2026 Darryl Waterhouse & DCBW-IT
- * Built: 2026-03-17T08:58:02.735Z
- * Commit: 58dfa50
+ * Built: 2026-03-17T14:09:44.122Z
+ * Commit: 22809b0
  */
 !function(t,e){"object"==typeof exports&&"undefined"!=typeof module?e(exports):"function"==typeof define&&define.amd?define(["exports"],e):e((t="undefined"!=typeof globalThis?globalThis:t||self).DommaSyntax={})}(this,function(t){"use strict";const e={javascript:[{type:"comment",pattern:/\/\*[\s\S]*?\*\//g},{type:"comment",pattern:/\/\/.*/g},{type:"template-string",pattern:/`(?:\\.|[^`\\])*`/g},{type:"string",pattern:/"(?:\\.|[^"\\])*"|'(?:\\.|[^'\\])*'/g},{type:"keyword",pattern:/\b(const|let|var|function|return|if|else|for|while|do|break|continue|switch|case|default|try|catch|finally|throw|async|await|class|extends|static|new|this|super|import|export|from|as|default|yield|typeof|instanceof|in|of|delete|void)\b/g},{type:"boolean",pattern:/\b(true|false|null|undefined|NaN|Infinity)\b/g},{type:"number",pattern:/\b\d+\.?\d*([eE][+-]?\d+)?\b/g},{type:"function",pattern:/\b([a-zA-Z_$][\w$]*)\s*(?=\()/g},{type:"class-name",pattern:/\b[A-Z][\w$]*\b/g},{type:"operator",pattern:/[+\-*/%=<>!&|^~?:]+|===|!==|==|!=|<=|>=|&&|\|\||<<|>>|>>>/g},{type:"punctuation",pattern:/[{}[\]();,.]/g}],html:[{type:"comment",pattern:/<!--[\s\S]*?-->/g},{type:"doctype",pattern:/<!DOCTYPE[^>]*>/gi},{type:"tag-open",pattern:/<\/?[a-zA-Z][\w-]*/g},{type:"tag-close",pattern:/\/?>/g},{type:"attr-name",pattern:/\s+[a-zA-Z:@][\w:.-]*(?=\s*=)/g},{type:"attr-value",pattern:/=\s*"[^"]*"|=\s*'[^']*'/g},{type:"entity",pattern:/&[#\w]+;/g}],css:[{type:"comment",pattern:/\/\*[\s\S]*?\*\//g},{type:"at-rule",pattern:/@[\w-]+/g},{type:"selector",pattern:/[.#]?[a-zA-Z][\w-]*(?=\s*[{,])/g},{type:"property",pattern:/\b[\w-]+(?=\s*:)/g},{type:"string",pattern:/"(?:\\.|[^"\\])*"|'(?:\\.|[^'\\])*'/g},{type:"function",pattern:/\b[\w-]+(?=\()/g},{type:"important",pattern:/!important\b/g},{type:"number",pattern:/\b\d+\.?\d*(px|em|rem|%|vh|vw|pt|cm|mm|in|pc|ex|ch|vmin|vmax|fr)?\b/g},{type:"color",pattern:/#[\da-fA-F]{3,8}\b/g},{type:"punctuation",pattern:/[{}:;,()]/g}]};function n(t){const e={"&":"&amp;","<":"&lt;",">":"&gt;",'"':"&quot;","'":"&#39;"};return t.replace(/[&<>"']/g,t=>e[t])}class a{constructor(){this.config={autoDetect:!0,preserveOriginal:!0,selector:".code-block",showLanguageBadge:!1,languagePrefix:"language-"}}highlight(t,a=null){const r="string"==typeof t?document.querySelector(t):t;if(!r||r.hasAttribute("data-syntax-highlighted"))return!1;if(!a&&this.config.autoDetect){const t=Array.from(r.classList).find(t=>t.startsWith(this.config.languagePrefix));t&&(a=t.substring(this.config.languagePrefix.length))}if(!a||!e[a])return!1;const o=r.textContent||"";this.config.preserveOriginal&&r.setAttribute("data-original-code",o);const i=function(t,a){const r=e[a];if(!r)return n(t);const o=[];for(const{type:e,pattern:n}of r){if("html"===a&&"entity"===e)continue;let r;for(n.lastIndex=0;null!==(r=n.exec(t));)o.push({start:r.index,end:r.index+r[0].length,text:r[0],type:e})}o.sort((t,e)=>t.start-e.start);const i=[];let s=0;for(const t of o)t.start>=s&&(i.push(t),s=t.end);let c="",p=0;for(const e of i)e.start>p&&(c+=n(t.substring(p,e.start))),c+=`<span class="syntax-${e.type}">${n(e.text)}</span>`,p=e.end;return p<t.length&&(c+=n(t.substring(p))),c}(o,a);return r.innerHTML=i,r.setAttribute("data-syntax-highlighted","true"),r.setAttribute("data-language",a),this.config.showLanguageBadge&&this.addLanguageBadge(r,a),!0}scan(t={}){const e=t.selector||this.config.selector,n=document.querySelectorAll(e);let a=0;return n.forEach(e=>{this.highlight(e,t.language||null)&&(this.addCopyButton(e),a++)}),a}register(t,n){t&&Array.isArray(n)?e[t]=n:console.error("SyntaxHighlighter: Invalid language registration")}configure(t){return t?(Object.assign(this.config,t),this.config):{...this.config}}addLanguageBadge(t,e){if(t.querySelector(".syntax-language-badge"))return;const n=document.createElement("div");n.className="syntax-language-badge",n.textContent=e.toUpperCase(),t.style.position="relative",t.insertBefore(n,t.firstChild)}getLanguages(){return Object.keys(e)}isLanguageSupported(t){return t in e}addCopyButton(t){if(t.parentElement&&t.parentElement.classList.contains("code-block-wrapper"))return;const e=document.createElement("div");e.className="code-block-wrapper";const n=document.createElement("button");n.className="code-block-copy",n.setAttribute("aria-label","Copy code to clipboard"),n.innerHTML='<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><rect x="9" y="9" width="13" height="13" rx="2" ry="2"></rect><path d="M5 15H4a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2h9a2 2 0 0 1 2 2v1"></path></svg>',n.addEventListener("click",async()=>{const e=t.getAttribute("data-original-code")||t.textContent;try{if(navigator.clipboard&&navigator.clipboard.writeText)await navigator.clipboard.writeText(e);else{const t=document.createElement("textarea");t.value=e,t.style.position="fixed",t.style.opacity="0",document.body.appendChild(t),t.select(),document.execCommand("copy"),document.body.removeChild(t)}n.classList.add("copied"),n.innerHTML='<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="20 6 9 17 4 12"></polyline></svg>',setTimeout(()=>{n.classList.remove("copied"),n.innerHTML='<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><rect x="9" y="9" width="13" height="13" rx="2" ry="2"></rect><path d="M5 15H4a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2h9a2 2 0 0 1 2 2v1"></path></svg>'},2e3)}catch(t){console.error("Failed to copy code:",t)}}),t.parentNode.insertBefore(e,t),e.appendChild(t),e.appendChild(n)}}const r=new a;"undefined"!=typeof document&&("loading"===document.readyState?document.addEventListener("DOMContentLoaded",()=>{r.scan()}):setTimeout(()=>r.scan(),0)),"undefined"!=typeof window&&(window.Domma&&(window.Domma.syntax=r),window.DommaSyntax=r),t.LANGUAGES=e,t.SyntaxHighlighter=a,t.default=r,t.syntax=r,Object.defineProperty(t,"__esModule",{value:!0})});

package/public/dist/domma.css

@@ -1,9 +1,9 @@
 /*!
- * Domma Core CSS v0.19.7
+ * Domma Core CSS v0.20.2
  * Dynamic Object Manipulation & Modeling API
  * (c) 2026 Darryl Waterhouse & DCBW-IT
- * Built: 2026-03-17T08:58:22.398Z
- * Commit: 58dfa50
+ * Built: 2026-03-17T14:10:00.837Z
+ * Commit: 22809b0
  */
 
 /**
@@ -143,6 +143,13 @@
     --dm-selected-bg: var(--dm-blue-100);
     --dm-disabled-opacity: 0.5;
 
+    /* Translucency */
+    --dm-translucent-light: 0.85;
+    --dm-translucent: 0.7;
+    --dm-translucent-heavy: 0.5;
+    --dm-translucent-glass-blur: 8px;
+    --dm-translucent-glass-opacity: 0.75;
+
     /* ================================================
        BRAND COLORS
        ================================================ */
@@ -2164,20 +2171,67 @@ code, pre {
     user-select: text;
 }
 
-.opacity-0 {
-    opacity: 0;
+/* ============================================
+   OPACITY SCALE
+   Full graduated opacity scale (0–100)
+   ============================================ */
+
+.opacity-0   { opacity: 0; }
+.opacity-10  { opacity: 0.1; }
+.opacity-20  { opacity: 0.2; }
+.opacity-25  { opacity: 0.25; }
+.opacity-30  { opacity: 0.3; }
+.opacity-40  { opacity: 0.4; }
+.opacity-50  { opacity: 0.5; }
+.opacity-60  { opacity: 0.6; }
+.opacity-70  { opacity: 0.7; }
+.opacity-75  { opacity: 0.75; }
+.opacity-80  { opacity: 0.8; }
+.opacity-90  { opacity: 0.9; }
+.opacity-100 { opacity: 1; }
+
+/* ============================================
+   TRANSLUCENT UTILITIES
+   Semantic transparency classes for UI elements
+   ============================================ */
+
+.translucent-light {
+    opacity: var(--dm-translucent-light);
+    transition: opacity var(--dm-transition-normal);
 }
 
-.opacity-50 {
-    opacity: 0.5;
+.translucent {
+    opacity: var(--dm-translucent);
+    transition: opacity var(--dm-transition-normal);
 }
 
-.opacity-75 {
-    opacity: 0.75;
+.translucent-heavy {
+    opacity: var(--dm-translucent-heavy);
+    transition: opacity var(--dm-transition-normal);
 }
 
-.opacity-100 {
-    opacity: 1;
+/* Frosted glass — semi-transparent background + blur */
+.translucent-glass {
+    background-color: rgba(255, 255, 255, var(--dm-translucent-glass-opacity));
+    backdrop-filter: blur(var(--dm-translucent-glass-blur));
+    -webkit-backdrop-filter: blur(var(--dm-translucent-glass-blur));
+    transition: opacity var(--dm-transition-normal);
+}
+
+/* Hover variants — apply translucency on hover */
+.translucent-hover:hover {
+    opacity: var(--dm-translucent);
+    transition: opacity var(--dm-transition-normal);
+}
+
+.translucent-light-hover:hover {
+    opacity: var(--dm-translucent-light);
+    transition: opacity var(--dm-transition-normal);
+}
+
+.translucent-heavy-hover:hover {
+    opacity: var(--dm-translucent-heavy);
+    transition: opacity var(--dm-transition-normal);
 }
 
 .transition {