@marp-team/marp-core
Version:
The core of Marp tools
2 lines (1 loc) • 9.39 kB
JavaScript
;Object.defineProperty(exports,"__esModule",{value:!0});const e={h1:{proto:()=>HTMLHeadingElement,attrs:{role:"heading","aria-level":"1"},style:"display: block; font-size: 2em; margin-block-start: 0.67em; margin-block-end: 0.67em; margin-inline-start: 0px; margin-inline-end: 0px; font-weight: bold;"},h2:{proto:()=>HTMLHeadingElement,attrs:{role:"heading","aria-level":"2"},style:"display: block; font-size: 1.5em; margin-block-start: 0.83em; margin-block-end: 0.83em; margin-inline-start: 0px; margin-inline-end: 0px; font-weight: bold;"},h3:{proto:()=>HTMLHeadingElement,attrs:{role:"heading","aria-level":"3"},style:"display: block; font-size: 1.17em; margin-block-start: 1em; margin-block-end: 1em; margin-inline-start: 0px; margin-inline-end: 0px; font-weight: bold;"},h4:{proto:()=>HTMLHeadingElement,attrs:{role:"heading","aria-level":"4"},style:"display: block; margin-block-start: 1.33em; margin-block-end: 1.33em; margin-inline-start: 0px; margin-inline-end: 0px; font-weight: bold;"},h5:{proto:()=>HTMLHeadingElement,attrs:{role:"heading","aria-level":"5"},style:"display: block; font-size: 0.83em; margin-block-start: 1.67em; margin-block-end: 1.67em; margin-inline-start: 0px; margin-inline-end: 0px; font-weight: bold;"},h6:{proto:()=>HTMLHeadingElement,attrs:{role:"heading","aria-level":"6"},style:"display: block; font-size: 0.67em; margin-block-start: 2.33em; margin-block-end: 2.33em; margin-inline-start: 0px; margin-inline-end: 0px; font-weight: bold;"},span:{proto:()=>HTMLSpanElement},pre:{proto:()=>HTMLElement,style:"display: block; font-family: monospace; white-space: pre; margin: 1em 0; --marp-auto-scaling-white-space: pre;"}},t="data-marp-auto-scaling-wrapper",i="data-marp-auto-scaling-svg",n="data-marp-auto-scaling-container";class s extends HTMLElement{container;containerSize;containerObserver;svg;svgComputedStyle;svgPreserveAspectRatio="xMinYMid meet";wrapper;wrapperSize;wrapperObserver;constructor(){super();const e=e=>([t])=>{const{width:i,height:n}=t.contentRect;this[e]={width:i,height:n},this.updateSVGRect()};this.attachShadow({mode:"open"}),this.containerObserver=new ResizeObserver(e("containerSize")),this.wrapperObserver=new ResizeObserver((...t)=>{e("wrapperSize")(...t),this.flushSvgDisplay()})}static get observedAttributes(){return["data-downscale-only"]}connectedCallback(){this.shadowRoot.innerHTML=`\n<style>\n svg[${i}] { display: block; width: 100%; height: auto; vertical-align: top; }\n span[${n}] { display: table; white-space: var(--marp-auto-scaling-white-space, nowrap); width: max-content; }\n</style>\n<div ${t}>\n <svg part="svg" ${i}>\n <foreignObject><span ${n}><slot></slot></span></foreignObject>\n </svg>\n</div>\n `.split(/\n\s*/).join(""),this.wrapper=this.shadowRoot.querySelector(`div[${t}]`)??void 0;const e=this.svg;this.svg=this.wrapper?.querySelector(`svg[${i}]`)??void 0,this.svg!==e&&(this.svgComputedStyle=this.svg?window.getComputedStyle(this.svg):void 0),this.container=this.svg?.querySelector(`span[${n}]`)??void 0,this.observe()}disconnectedCallback(){this.svg=void 0,this.svgComputedStyle=void 0,this.wrapper=void 0,this.container=void 0,this.observe()}attributeChangedCallback(){this.observe()}flushSvgDisplay(){const{svg:e}=this;e&&(e.style.display="inline",requestAnimationFrame(()=>{e.style.display=""}))}observe(){this.containerObserver.disconnect(),this.wrapperObserver.disconnect(),this.wrapper&&this.wrapperObserver.observe(this.wrapper),this.container&&this.containerObserver.observe(this.container),this.svgComputedStyle&&this.observeSVGStyle(this.svgComputedStyle)}observeSVGStyle(e){const t=()=>{const i=(()=>{const t=e.getPropertyValue("--preserve-aspect-ratio");if(t)return t.trim();return`x${(({textAlign:e,direction:t})=>{if(e.endsWith("left"))return"Min";if(e.endsWith("right"))return"Max";if("start"===e||"end"===e){let i="rtl"===t;return"end"===e&&(i=!i),i?"Max":"Min"}return"Mid"})(e)}YMid meet`})();i!==this.svgPreserveAspectRatio&&(this.svgPreserveAspectRatio=i,this.updateSVGRect()),e===this.svgComputedStyle&&requestAnimationFrame(t)};t()}updateSVGRect(){let e=Math.ceil(this.containerSize?.width??0);const t=Math.ceil(this.containerSize?.height??0);void 0!==this.dataset.downscaleOnly&&(e=Math.max(e,this.wrapperSize?.width??0));const i=this.svg?.querySelector(":scope > foreignObject");if(i?.setAttribute("width",`${e}`),i?.setAttribute("height",`${t}`),this.svg&&(this.svg.setAttribute("viewBox",`0 0 ${e} ${t}`),this.svg.setAttribute("preserveAspectRatio",this.svgPreserveAspectRatio),this.svg.style.height=e<=0||t<=0?"0":""),this.container){const e=this.svgPreserveAspectRatio.toLowerCase();this.container.style.marginLeft=e.startsWith("xmid")||e.startsWith("xmax")?"auto":"0",this.container.style.marginRight=e.startsWith("xmi")?"auto":"0"}}}const r=(e,{attrs:t={},style:i})=>class extends e{constructor(...e){super(...e);for(const[e,i]of Object.entries(t))this.hasAttribute(e)||this.setAttribute(e,i);this._shadow()}static get observedAttributes(){return["data-auto-scaling"]}connectedCallback(){this._update()}attributeChangedCallback(){this._update()}_shadow(){if(!this.shadowRoot)try{this.attachShadow({mode:"open"})}catch(e){if(!(e instanceof Error&&"NotSupportedError"===e.name))throw e}return this.shadowRoot}_update(){const e=this._shadow();if(e){const t=i?`<style>:host { ${i} }</style>`:"";let n="<slot></slot>";const{autoScaling:s}=this.dataset;if(void 0!==s){n=`<marp-auto-scaling exportparts="svg:auto-scaling" ${"downscale-only"===s?"data-downscale-only":""}>${n}</marp-auto-scaling>`}e.innerHTML=t+n}}};let o;const a=Symbol(),l=()=>o??(o=!!document.createElement("div",{is:"marp-auto-scaling"}).outerHTML.startsWith("<div is"),o);let c;const d="marpitSVGPolyfill:setZoomFactor,",h=Symbol(),g=Symbol();const p=()=>{const e="Apple Computer, Inc."===navigator.vendor,t=e?[v]:[],i={then:t=>(e?(async()=>{if(void 0===c){const e=document.createElement("canvas");e.width=10,e.height=10;const t=e.getContext("2d"),i=new Image(10,10),n=new Promise(e=>{i.addEventListener("load",()=>e())});i.crossOrigin="anonymous",i.src="data:image/svg+xml;charset=utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2210%22%20height%3D%2210%22%20viewBox%3D%220%200%201%201%22%3E%3CforeignObject%20width%3D%221%22%20height%3D%221%22%20requiredExtensions%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxhtml%22%3E%3Cdiv%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxhtml%22%20style%3D%22width%3A%201px%3B%20height%3A%201px%3B%20background%3A%20red%3B%20position%3A%20relative%22%3E%3C%2Fdiv%3E%3C%2FforeignObject%3E%3C%2Fsvg%3E",await n,t.drawImage(i,0,0),c=t.getImageData(5,5,1,1).data[3]<128}return c})().then(e=>{null==t||t(e?[v]:[])}):null==t||t([]),i)};return Object.assign(t,i)};let m,u;function v(e){const t="object"==typeof e&&e.target||document,i="object"==typeof e?e.zoom:e;window[g]||(Object.defineProperty(window,g,{configurable:!0,value:!0}),document.body.style.zoom=1.0001,document.body.offsetHeight,document.body.style.zoom=1,window.addEventListener("message",({data:e,origin:t})=>{if(t===window.origin)try{if(e&&"string"==typeof e&&e.startsWith(d)){const[,t]=e.split(","),i=Number.parseFloat(t);Number.isNaN(i)||(u=i)}}catch(e){console.error(e)}}));let n=!1;Array.from(t.querySelectorAll("svg[data-marpit-svg]"),e=>{var t,s,r,o;e.style.transform||(e.style.transform="translateZ(0)");const a=i||u||e.currentScale||1;m!==a&&(m=a,n=a);const l=e.getBoundingClientRect(),{length:c}=e.children;for(let i=0;i<c;i+=1){const n=e.children[i];if(n.getScreenCTM){const e=n.getScreenCTM();if(e){const i=null!==(s=null===(t=n.x)||void 0===t?void 0:t.baseVal.value)&&void 0!==s?s:0,c=null!==(o=null===(r=n.y)||void 0===r?void 0:r.baseVal.value)&&void 0!==o?o:0,d=n.children.length;for(let t=0;t<d;t+=1){const s=n.children[t];if("SECTION"===s.tagName){const{style:t}=s;t.transformOrigin||(t.transformOrigin=`${-i}px ${-c}px`),t.transform=`scale(${a}) matrix(${e.a}, ${e.b}, ${e.c}, ${e.d}, ${e.e-l.left}, ${e.f-l.top}) translateZ(0.0001px)`;break}}}}}}),!1!==n&&Array.from(t.querySelectorAll("iframe"),({contentWindow:e})=>{null==e||e.postMessage(`${d}${n}`,"null"===window.origin?"*":window.origin)})}function w({once:e=!1,target:t=document}={}){const i=function(e=document){if(e[h])return e[h];let t=!0;const i=()=>{t=!1,delete e[h]};Object.defineProperty(e,h,{configurable:!0,value:i});let n=[],s=!1;(async()=>{try{n=await p()}finally{s=!0}})();const r=()=>{for(const t of n)t({target:e});s&&0===n.length||t&&window.requestAnimationFrame(r)};return r(),i}(t);return e?(i(),()=>{}):i}m=1,u=void 0;const b=w,y=Symbol(),f=(t=document)=>{if("undefined"==typeof window)throw new Error("Marp Core's browser script is valid only in browser context.");if(((t=document)=>{const i=window[a];i||customElements.define("marp-auto-scaling",s);for(const n of Object.keys(e)){const s=`marp-${n}`,o=e[n].proto();l()&&o!==HTMLElement?i||customElements.define(s,r(o,{style:e[n].style}),{extends:n}):(i||customElements.define(s,r(HTMLElement,e[n])),t.querySelectorAll(`${n}[is="${s}"]`).forEach(e=>{e.outerHTML=e.outerHTML.replace(new RegExp(`^<${n}`,"i"),`<${s}`).replace(new RegExp(`</${n}>$`,"i"),`</${s}>`)}))}window[a]=!0})(t),t[y])return t[y];const i=w({target:t}),n=()=>{i(),delete t[y]},o=Object.assign(n,{cleanup:n,update:()=>f(t)});return Object.defineProperty(t,y,{configurable:!0,value:o}),o};exports.browser=f,exports.default=f,exports.observer=b;