vanilla-breeze 0.1.0 → 0.1.2

package/dist/cdn/vanilla-breeze-dev.js

@@ -1,2 +1,2 @@
-var f={"layout-card":{validChildren:["header","section","footer"],validSlots:["header","content","footer"],rules:{maxHeader:1,maxFooter:1,order:["header","section","footer"]}}};function w(){return document.documentElement.hasAttribute("data-debug")||localStorage.getItem("vanillaBreeze.debug")==="true"}function g(e,t,a){let o=[],r=Array.from(e.children),l={header:0,section:0,footer:0},i=[];for(let d of r){let n=d.tagName.toLowerCase(),u=d.getAttribute("slot");if(a.validChildren.includes(n)){l[n]++,i.push(n);continue}if(u&&a.validSlots.includes(u)){let h=u==="content"?"section":u;i.push(h);continue}}a.rules.maxHeader&&l.header>a.rules.maxHeader&&o.push({type:"duplicate",message:`Multiple <header> elements found (max: ${a.rules.maxHeader})`,element:e}),a.rules.maxFooter&&l.footer>a.rules.maxFooter&&o.push({type:"duplicate",message:`Multiple <footer> elements found (max: ${a.rules.maxFooter})`,element:e});let c=a.rules.order,s=-1;for(let d of i){let n=c.indexOf(d);if(n!==-1&&n<s){o.push({type:"order",message:`Invalid child order: <${d}> should appear before elements that follow it in the semantic order (header > section > footer)`,element:e});break}n!==-1&&(s=n)}return o}function b(e){for(let t of e)console.warn(`[Vanilla Breeze] Content model warning in <${t.element.tagName.toLowerCase()}>:`,t.message,t.element),t.element.setAttribute("data-debug-invalid",""),t.element.setAttribute("data-debug-message",t.message)}function y(e){e.removeAttribute("data-debug-invalid"),e.removeAttribute("data-debug-message")}function m(){for(let[e,t]of Object.entries(f)){let a=document.querySelectorAll(e);for(let o of a){y(o);let r=g(o,e,t);r.length>0&&b(r)}}}function A(){if(!w())return;console.info("[Vanilla Breeze] Debug mode enabled - content model validation active"),document.readyState==="loading"?document.addEventListener("DOMContentLoaded",m):m(),new MutationObserver(t=>{let a=!1;for(let o of t)if(o.type==="childList"){let r=o.target;if(r.tagName&&f[r.tagName.toLowerCase()]){a=!0;break}for(let l of o.addedNodes)if(l.nodeType===Node.ELEMENT_NODE){let i=l;if(f[i.tagName.toLowerCase()]||i.querySelector(Object.keys(f).join(","))){a=!0;break}}}a&&m()}).observe(document.body,{childList:!0,subtree:!0})}A();var p={labelElements(){this.wrapStandaloneImages(),document.querySelectorAll("[data-wf-label]").forEach(e=>{this.applyLabel(e,e.dataset.wfLabel??"")}),document.querySelectorAll("img[alt]").forEach(e=>{let t=e;!t.dataset.wfLabel&&t.alt&&this.applyLabel(t,t.alt),this.applyImageDimensions(t)})},label(e,t){let a=typeof e=="string"?document.querySelector(e):e;a&&(a.dataset.wfLabel=t,this.applyLabel(a,t))},applyLabel(e,t){if(!t)return;let a=t.replace(/"/g,'\\"');if(e.style.setProperty("--wf-label-text",`"${a}"`),e.tagName==="IMG"){let o=e.closest("figure");o&&o.setAttribute("data-wf-img-label",t)}},applyImageDimensions(e){let t=()=>{if(e.naturalWidth&&e.naturalHeight){let a=`${e.naturalWidth}\xD7${e.naturalHeight}`,o=e.closest("figure");if(o){o.setAttribute("data-wf-img-dims",a);let r=o.getAttribute("data-wf-img-label");r&&o.setAttribute("data-wf-img-label",`${r} \u2014 ${a}`)}}};e.complete?t():e.addEventListener("load",t,{once:!0})},setFidelity(e){let t=document.documentElement;e?t.dataset.wireframe=e:delete t.dataset.wireframe},toggle(e="mid"){let t=document.documentElement;return t.hasAttribute("data-wireframe")?(delete t.dataset.wireframe,!1):(t.dataset.wireframe=e,!0)},isActive(){return document.documentElement.hasAttribute("data-wireframe")},getFidelity(){return document.documentElement.dataset.wireframe||null},toggleAnnotations(){let e=document.documentElement;return e.hasAttribute("data-wf-annotate")?(e.removeAttribute("data-wf-annotate"),!1):(e.setAttribute("data-wf-annotate",""),!0)},wrapStandaloneImages(){document.querySelectorAll("img:not(figure img):not([data-wf-wrapped])").forEach(e=>{let t=document.createElement("span");t.setAttribute("data-wf-img-wrap",""),t.style.cssText="position:relative;display:inline-block",e.setAttribute("data-wf-wrapped",""),e.parentNode.insertBefore(t,e),t.appendChild(e)})},addCallout(e,t){let a=typeof e=="string"?document.querySelector(e):e;a&&(a.dataset.wfCallout=t)},removeCallout(e){let t=typeof e=="string"?document.querySelector(e):e;if(!t)return;delete t.dataset.wfCallout;let a=t.querySelector("[data-wf-callout-marker]");a&&a.remove()},renderCallouts(){document.querySelectorAll("[data-wf-callout-marker]").forEach(t=>t.remove()),document.querySelectorAll("foot-note[data-wf-generated]").forEach(t=>t.remove()),document.querySelectorAll("[data-wf-callout-panel]").forEach(t=>t.remove());let e=0;document.querySelectorAll("[data-wf-callout]").forEach(t=>{e++;let a=t.dataset.wfCallout,o=document.createElement("mark");o.setAttribute("data-wf-callout-marker",""),o.textContent=String(e),o.title=a,t.appendChild(o);let r=document.createElement("foot-note");r.setAttribute("data-wf-generated",""),r.textContent=a,t.appendChild(r)})},renderCalloutPanel(e){if(document.querySelectorAll("[data-wf-callout-panel]").forEach(r=>r.remove()),document.querySelectorAll("[data-wf-callout]").length===0)return;let a=document.createElement("foot-notes");a.setAttribute("data-wf-callout-panel",""),a.setAttribute("data-back-label","Back to callout"),(e||document.querySelector("main")||document.body).appendChild(a)},toggleCallouts(){let e=document.querySelectorAll("[data-wf-callout-marker]"),t=document.querySelector("[data-wf-callout-panel]");if(e.length===0&&!t)return this.renderCallouts(),this.renderCalloutPanel(),!0;let a=e.length>0&&e[0].hidden;return e.forEach(o=>{o.hidden=!a}),t&&(t.hidden=!a),!a}};function E(){document.addEventListener("keydown",e=>{(e.ctrlKey||e.metaKey)&&e.shiftKey&&e.key==="W"&&(e.preventDefault(),p.toggle())})}typeof window<"u"&&(window.VanillaBreeze=window.VanillaBreeze||{},window.VanillaBreeze.wireframe=p,E());function v(e={}){let{service:t="picsum",width:a=400,height:o=300,seed:r,text:l,bg:i,color:c}=e;if(t==="placehold"){let s=new URLSearchParams;l&&s.set("text",l),c&&s.set("color",c);let d=s.toString(),n=i?`https://placehold.co/${a}x${o}/${i}`:`https://placehold.co/${a}x${o}`;return d?`${n}?${d}`:n}return r!=null?`https://picsum.photos/seed/${encodeURIComponent(r)}/${a}/${o}`:`https://picsum.photos/${a}/${o}`}var S={imageUrl:v};typeof window<"u"&&(window.VanillaBreeze=window.VanillaBreeze||{},window.VanillaBreeze.mock=S);
+var f={"layout-card":{validChildren:["header","section","footer"],validSlots:["header","content","footer"],rules:{maxHeader:1,maxFooter:1,order:["header","section","footer"]}}};function S(){return document.documentElement.hasAttribute("data-debug")||localStorage.getItem("vanillaBreeze.debug")==="true"}function E(e,t,a){let o=[],r=Array.from(e.children),n={header:0,section:0,footer:0},s=[];for(let i of r){let l=i.tagName.toLowerCase(),u=i.getAttribute("slot");if(a.validChildren.includes(l)){n[l]++,s.push(l);continue}if(u&&a.validSlots.includes(u)){let A=u==="content"?"section":u;s.push(A);continue}}a.rules.maxHeader&&n.header>a.rules.maxHeader&&o.push({type:"duplicate",message:`Multiple <header> elements found (max: ${a.rules.maxHeader})`,element:e}),a.rules.maxFooter&&n.footer>a.rules.maxFooter&&o.push({type:"duplicate",message:`Multiple <footer> elements found (max: ${a.rules.maxFooter})`,element:e});let c=a.rules.order,d=-1;for(let i of s){let l=c.indexOf(i);if(l!==-1&&l<d){o.push({type:"order",message:`Invalid child order: <${i}> should appear before elements that follow it in the semantic order (header > section > footer)`,element:e});break}l!==-1&&(d=l)}return o}function v(e){for(let t of e)console.warn(`[Vanilla Breeze] Content model warning in <${t.element.tagName.toLowerCase()}>:`,t.message,t.element),t.element.setAttribute("data-debug-invalid",""),t.element.setAttribute("data-debug-message",t.message)}function x(e){e.removeAttribute("data-debug-invalid"),e.removeAttribute("data-debug-message")}function p(){for(let[e,t]of Object.entries(f)){let a=document.querySelectorAll(e);for(let o of a){x(o);let r=E(o,e,t);r.length>0&&v(r)}}}function C(){if(!S())return;console.info("[Vanilla Breeze] Debug mode enabled - content model validation active"),document.readyState==="loading"?document.addEventListener("DOMContentLoaded",p):p(),new MutationObserver(t=>{let a=!1;for(let o of t)if(o.type==="childList"){let r=o.target;if(r.tagName&&f[r.tagName.toLowerCase()]){a=!0;break}for(let n of o.addedNodes)if(n.nodeType===Node.ELEMENT_NODE){let s=n;if(f[s.tagName.toLowerCase()]||s.querySelector(Object.keys(f).join(","))){a=!0;break}}}a&&p()}).observe(document.body,{childList:!0,subtree:!0})}C();var h={labelElements(){this.wrapStandaloneImages(),document.querySelectorAll("[data-wf-label]").forEach(e=>{this.applyLabel(e,e.dataset.wfLabel??"")}),document.querySelectorAll("img[alt]").forEach(e=>{let t=e;!t.dataset.wfLabel&&t.alt&&this.applyLabel(t,t.alt),this.applyImageDimensions(t)})},label(e,t){let a=typeof e=="string"?document.querySelector(e):e;a&&(a.dataset.wfLabel=t,this.applyLabel(a,t))},applyLabel(e,t){if(!t)return;let a=t.replace(/"/g,'\\"');if(e.style.setProperty("--wf-label-text",`"${a}"`),e.tagName==="IMG"){let o=e.closest("figure");o&&o.setAttribute("data-wf-img-label",t)}},applyImageDimensions(e){let t=()=>{if(e.naturalWidth&&e.naturalHeight){let a=`${e.naturalWidth}\xD7${e.naturalHeight}`,o=e.closest("figure");if(o){o.setAttribute("data-wf-img-dims",a);let r=o.getAttribute("data-wf-img-label");r&&o.setAttribute("data-wf-img-label",`${r} \u2014 ${a}`)}}};e.complete?t():e.addEventListener("load",t,{once:!0})},setFidelity(e){let t=document.documentElement;e?t.dataset.wireframe=e:delete t.dataset.wireframe},toggle(e="mid"){let t=document.documentElement;return t.hasAttribute("data-wireframe")?(delete t.dataset.wireframe,!1):(t.dataset.wireframe=e,!0)},isActive(){return document.documentElement.hasAttribute("data-wireframe")},getFidelity(){return document.documentElement.dataset.wireframe||null},toggleAnnotations(){let e=document.documentElement;return e.hasAttribute("data-wf-annotate")?(e.removeAttribute("data-wf-annotate"),!1):(e.setAttribute("data-wf-annotate",""),!0)},wrapStandaloneImages(){document.querySelectorAll("img:not(figure img):not([data-wf-wrapped])").forEach(e=>{let t=document.createElement("span");t.setAttribute("data-wf-img-wrap",""),t.style.cssText="position:relative;display:inline-block",e.setAttribute("data-wf-wrapped",""),e.parentNode.insertBefore(t,e),t.appendChild(e)})},addCallout(e,t){let a=typeof e=="string"?document.querySelector(e):e;a&&(a.dataset.wfCallout=t)},removeCallout(e){let t=typeof e=="string"?document.querySelector(e):e;if(!t)return;delete t.dataset.wfCallout;let a=t.querySelector("[data-wf-callout-marker]");a&&a.remove()},renderCallouts(){document.querySelectorAll("[data-wf-callout-marker]").forEach(t=>t.remove()),document.querySelectorAll("foot-note[data-wf-generated]").forEach(t=>t.remove()),document.querySelectorAll("[data-wf-callout-panel]").forEach(t=>t.remove());let e=0;document.querySelectorAll("[data-wf-callout]").forEach(t=>{e++;let a=t.dataset.wfCallout,o=document.createElement("mark");o.setAttribute("data-wf-callout-marker",""),o.textContent=String(e),o.title=a,t.appendChild(o);let r=document.createElement("foot-note");r.setAttribute("data-wf-generated",""),r.textContent=a,t.appendChild(r)})},renderCalloutPanel(e){if(document.querySelectorAll("[data-wf-callout-panel]").forEach(r=>r.remove()),document.querySelectorAll("[data-wf-callout]").length===0)return;let a=document.createElement("foot-notes");a.setAttribute("data-wf-callout-panel",""),a.setAttribute("data-back-label","Back to callout"),(e||document.querySelector("main")||document.body).appendChild(a)},toggleCallouts(){let e=document.querySelectorAll("[data-wf-callout-marker]"),t=document.querySelector("[data-wf-callout-panel]");if(e.length===0&&!t)return this.renderCallouts(),this.renderCalloutPanel(),!0;let a=e.length>0&&e[0].hidden;return e.forEach(o=>{o.hidden=!a}),t&&(t.hidden=!a),!a}};function $(){document.addEventListener("keydown",e=>{(e.ctrlKey||e.metaKey)&&e.shiftKey&&e.key==="W"&&(e.preventDefault(),h.toggle())})}typeof window<"u"&&(window.VanillaBreeze=window.VanillaBreeze||{},window.VanillaBreeze.wireframe=h,$());var g="https://cdn.jsdelivr.net/gh/faker-js/assets-person-portrait",m=[32,64,128,256,512];function k(e){let t=0;for(let a=0;a<e.length;a++)t=e.charCodeAt(a)+((t<<5)-t);return t}function w(e){let t=m[0],a=Math.abs(e-t);for(let o=1;o<m.length;o++){let r=Math.abs(e-m[o]);r<a&&(t=m[o],a=r)}return t}function b(e,t=128){let a=k(String(e)),o=(a%100+100)%100,r=(a>>>16&1)===0?"female":"male",n=w(t);return`${g}/${r}/${n}/${o}.jpg`}function y(e,t=128){let a=(e%200+200)%200,o=a<100?"female":"male",r=a<100?a:a-100,n=w(t);return`${g}/${o}/${n}/${r}.jpg`}function q(e={}){let{service:t="picsum",width:a=400,height:o=300,seed:r,text:n,bg:s,color:c}=e;if(t==="placehold"){let d=new URLSearchParams;n&&d.set("text",n),c&&d.set("color",c);let i=d.toString(),l=s?`https://placehold.co/${a}x${o}/${s}`:`https://placehold.co/${a}x${o}`;return i?`${l}?${i}`:l}return r!=null?`https://picsum.photos/seed/${encodeURIComponent(r)}/${a}/${o}`:`https://picsum.photos/${a}/${o}`}var L={imageUrl:q,portraitUrl:b,portraitByIndex:y};typeof window<"u"&&(window.VanillaBreeze=window.VanillaBreeze||{},window.VanillaBreeze.mock=L);
 //# sourceMappingURL=vanilla-breeze-dev.js.map