json-canvas-viewer 4.1.1 → 4.2.0

package/dist/modules/MistouchPreventer/index.d.ts

@@ -2,27 +2,27 @@ import { BaseArgs, BaseModule } from "../../kernel/BaseModule.js";
 import { BaseOptions } from "../../kernel/index.js";
 
 //#region src/modules/MistouchPreventer/index.d.ts
-interface Options extends BaseOptions {
+type Options = {
   preventMistouchAtStart?: boolean;
   mistouchPreventerBannerText?: string;
-}
-interface Augmentation {
+} & BaseOptions;
+type Augmentation = {
   startMistouchPrevention: MistouchPreventer['startPrevention'];
   endMistouchPrevention: MistouchPreventer['endPrevention'];
-}
+};
 declare class MistouchPreventer extends BaseModule<Options, Augmentation> {
   private _preventionContainer;
   private preventMt;
-  private DM;
-  private preventMistouch;
+  private readonly DM;
+  private readonly preventMistouch;
   private get preventionContainer();
   constructor(...args: BaseArgs);
-  private onPointerDown;
-  private onPointerMove;
-  private onPointerUp;
+  private readonly onPointerDown;
+  private readonly onPointerMove;
+  private readonly onPointerUp;
   startPrevention: () => void;
   endPrevention: () => void;
-  private dispose;
+  private readonly dispose;
 }
 //#endregion
 export { MistouchPreventer };

package/dist/modules/MistouchPreventer/index.js

@@ -1,2 +1,2 @@
-import{BaseModule as e}from"../../kernel/BaseModule.js";import t,{destroyError as n}from"../../kernel/utilities.js";import r from"../../kernel/DataManager.js";import i from"./styles.js";var a=class extends e{_preventionContainer=null;preventMt=!1;DM;preventMistouch={record:!1,lastX:0,lastY:0,initialX:0,initialY:0};get preventionContainer(){if(this._preventionContainer===null)throw n;return this._preventionContainer}constructor(...e){super(...e);let n=document.createElement(`div`);n.className=`JCV-prevention-banner JCV-border-shadow-bg`,n.textContent=this.options.mistouchPreventerBannerText??`Click on to unlock.`,this.DM=this.container.get(r),this._preventionContainer=document.createElement(`div`),this._preventionContainer.className=`JCV-prevention-container JCV-hidden JCV-full JCV-flex-center`,t.applyStyles(this._preventionContainer,i),this._preventionContainer.appendChild(n),this.DM.data.container.appendChild(this._preventionContainer),this.options.preventMistouchAtStart&&this.startPrevention(),window.addEventListener(`pointerdown`,this.onPointerDown),window.addEventListener(`pointermove`,this.onPointerMove),window.addEventListener(`pointerup`,this.onPointerUp),this.augment({startMistouchPrevention:this.startPrevention,endMistouchPrevention:this.endPrevention}),this.onDispose(this.dispose)}onPointerDown=e=>{let t=this.DM.data.container.getBoundingClientRect();e.clientX<t.left||e.clientX>t.right||e.clientY<t.top||e.clientY>t.bottom?this.preventMt||this.startPrevention():this.preventMt&&(this.preventMistouch.initialX=e.clientX,this.preventMistouch.initialY=e.clientY,this.preventMistouch.lastX=e.clientX,this.preventMistouch.lastY=e.clientY,this.preventMistouch.record=!0)};onPointerMove=e=>{this.preventMistouch.record&&(this.preventMistouch.lastX=e.clientX,this.preventMistouch.lastY=e.clientY)};onPointerUp=()=>{this.preventMistouch.record&&(this.preventMistouch.record=!1,Math.abs(this.preventMistouch.lastX-this.preventMistouch.initialX)+Math.abs(this.preventMistouch.lastY-this.preventMistouch.initialY)<5&&this.endPrevention())};startPrevention=()=>{this.preventionContainer.classList.remove(`JCV-hidden`),this.DM.data.container.classList.add(`JCV-numb`),this.preventMt=!0};endPrevention=()=>{this.preventMt=!1,this.preventionContainer.classList.add(`JCV-hidden`),setTimeout(()=>this.DM.data.container.classList.remove(`JCV-numb`),50)};dispose=()=>{window.removeEventListener(`pointerdown`,this.onPointerDown),window.removeEventListener(`pointermove`,this.onPointerMove),window.removeEventListener(`pointerup`,this.onPointerUp),this.preventionContainer.remove(),this._preventionContainer=null}};export{a as default};
+import{BaseModule as e}from"../../kernel/BaseModule.js";import{applyStyles as t,destroyError as n}from"../../kernel/utilities.js";import r from"../../kernel/DataManager.js";import i from"./styles.js";var a=class extends e{_preventionContainer;preventMt=!1;DM;preventMistouch={initialX:0,initialY:0,lastX:0,lastY:0,record:!1};get preventionContainer(){if(!this._preventionContainer)throw n;return this._preventionContainer}constructor(...e){super(...e);let n=document.createElement(`div`);n.className=`JCV-prevention-banner JCV-border-shadow-bg`,n.textContent=this.options.mistouchPreventerBannerText??`Click on to unlock.`,this.DM=this.container.get(r),this._preventionContainer=document.createElement(`div`),this._preventionContainer.className=`JCV-prevention-container JCV-hidden JCV-full JCV-flex-center`,t(this._preventionContainer,i),this._preventionContainer.appendChild(n),this.DM.data.container.appendChild(this._preventionContainer),this.options.preventMistouchAtStart&&this.startPrevention(),window.addEventListener(`pointerdown`,this.onPointerDown),window.addEventListener(`pointermove`,this.onPointerMove),window.addEventListener(`pointerup`,this.onPointerUp),this.augment({endMistouchPrevention:this.endPrevention,startMistouchPrevention:this.startPrevention}),this.onDispose(this.dispose)}onPointerDown=e=>{let t=this.DM.data.container.getBoundingClientRect();e.clientX<t.left||e.clientX>t.right||e.clientY<t.top||e.clientY>t.bottom?this.preventMt||this.startPrevention():this.preventMt&&(this.preventMistouch.initialX=e.clientX,this.preventMistouch.initialY=e.clientY,this.preventMistouch.lastX=e.clientX,this.preventMistouch.lastY=e.clientY,this.preventMistouch.record=!0)};onPointerMove=e=>{this.preventMistouch.record&&(this.preventMistouch.lastX=e.clientX,this.preventMistouch.lastY=e.clientY)};onPointerUp=()=>{this.preventMistouch.record&&(this.preventMistouch.record=!1,Math.abs(this.preventMistouch.lastX-this.preventMistouch.initialX)+Math.abs(this.preventMistouch.lastY-this.preventMistouch.initialY)<5&&this.endPrevention())};startPrevention=()=>{this.preventionContainer.classList.remove(`JCV-hidden`),this.DM.data.container.classList.add(`JCV-numb`),this.preventMt=!0};endPrevention=()=>{this.preventMt=!1,this.preventionContainer.classList.add(`JCV-hidden`),setTimeout(()=>this.DM.data.container.classList.remove(`JCV-numb`),50)};dispose=()=>{window.removeEventListener(`pointerdown`,this.onPointerDown),window.removeEventListener(`pointermove`,this.onPointerMove),window.removeEventListener(`pointerup`,this.onPointerUp),this.preventionContainer.remove(),this._preventionContainer=void 0}};export{a as default};
 //# sourceMappingURL=index.js.map

package/dist/modules/MistouchPreventer/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["style"],"sources":["../../../src/modules/MistouchPreventer/index.ts"],"sourcesContent":["import type { BaseOptions } from '$';\nimport { type BaseArgs, BaseModule } from '$/BaseModule';\nimport DataManager from '$/DataManager';\nimport utilities, { destroyError } from '$/utilities';\nimport style from './styles.scss?inline';\n\ninterface Options extends BaseOptions {\n\tpreventMistouchAtStart?: boolean;\n\tmistouchPreventerBannerText?: string;\n}\n\ninterface Augmentation {\n\tstartMistouchPrevention: MistouchPreventer['startPrevention'];\n\tendMistouchPrevention: MistouchPreventer['endPrevention'];\n}\n\nexport default class MistouchPreventer extends BaseModule<Options, Augmentation> {\n\tprivate _preventionContainer: HTMLDivElement | null = null;\n\tprivate preventMt: boolean = false;\n\tprivate DM: DataManager;\n\tprivate preventMistouch: {\n\t\trecord: boolean;\n\t\tlastX: number;\n\t\tlastY: number;\n\t\tinitialX: number;\n\t\tinitialY: number;\n\t} = {\n\t\trecord: false,\n\t\tlastX: 0,\n\t\tlastY: 0,\n\t\tinitialX: 0,\n\t\tinitialY: 0,\n\t};\n\n\tprivate get preventionContainer() {\n\t\tif (this._preventionContainer === null) throw destroyError;\n\t\treturn this._preventionContainer;\n\t}\n\n\tconstructor(...args: BaseArgs) {\n\t\tsuper(...args);\n\n\t\tconst preventionBanner = document.createElement('div');\n\t\tpreventionBanner.className = 'JCV-prevention-banner JCV-border-shadow-bg';\n\t\tpreventionBanner.textContent =\n\t\t\tthis.options.mistouchPreventerBannerText ?? 'Click on to unlock.';\n\t\tthis.DM = this.container.get(DataManager);\n\t\tthis._preventionContainer = document.createElement('div');\n\t\tthis._preventionContainer.className =\n\t\t\t'JCV-prevention-container JCV-hidden JCV-full JCV-flex-center';\n\n\t\tutilities.applyStyles(this._preventionContainer, style);\n\t\tthis._preventionContainer.appendChild(preventionBanner);\n\t\tthis.DM.data.container.appendChild(this._preventionContainer);\n\n\t\tif (this.options.preventMistouchAtStart) this.startPrevention();\n\n\t\twindow.addEventListener('pointerdown', this.onPointerDown);\n\t\twindow.addEventListener('pointermove', this.onPointerMove);\n\t\twindow.addEventListener('pointerup', this.onPointerUp);\n\n\t\tthis.augment({\n\t\t\tstartMistouchPrevention: this.startPrevention,\n\t\t\tendMistouchPrevention: this.endPrevention,\n\t\t});\n\t\tthis.onDispose(this.dispose);\n\t}\n\n\tprivate onPointerDown = (e: PointerEvent) => {\n\t\tconst bounds = this.DM.data.container.getBoundingClientRect();\n\t\tif (\n\t\t\te.clientX < bounds.left ||\n\t\t\te.clientX > bounds.right ||\n\t\t\te.clientY < bounds.top ||\n\t\t\te.clientY > bounds.bottom\n\t\t) {\n\t\t\tif (!this.preventMt) this.startPrevention();\n\t\t} else if (this.preventMt) {\n\t\t\tthis.preventMistouch.initialX = e.clientX;\n\t\t\tthis.preventMistouch.initialY = e.clientY;\n\t\t\tthis.preventMistouch.lastX = e.clientX;\n\t\t\tthis.preventMistouch.lastY = e.clientY;\n\t\t\tthis.preventMistouch.record = true;\n\t\t}\n\t};\n\n\tprivate onPointerMove = (e: PointerEvent) => {\n\t\tif (this.preventMistouch.record) {\n\t\t\tthis.preventMistouch.lastX = e.clientX;\n\t\t\tthis.preventMistouch.lastY = e.clientY;\n\t\t}\n\t};\n\n\tprivate onPointerUp = () => {\n\t\tif (this.preventMistouch.record) {\n\t\t\tthis.preventMistouch.record = false;\n\t\t\tif (\n\t\t\t\tMath.abs(this.preventMistouch.lastX - this.preventMistouch.initialX) +\n\t\t\t\t\tMath.abs(this.preventMistouch.lastY - this.preventMistouch.initialY) <\n\t\t\t\t5\n\t\t\t)\n\t\t\t\tthis.endPrevention();\n\t\t}\n\t};\n\n\tstartPrevention = () => {\n\t\tthis.preventionContainer.classList.remove('JCV-hidden');\n\t\tthis.DM.data.container.classList.add('JCV-numb');\n\t\tthis.preventMt = true;\n\t};\n\n\tendPrevention = () => {\n\t\tthis.preventMt = false;\n\t\tthis.preventionContainer.classList.add('JCV-hidden');\n\t\tsetTimeout(() => this.DM.data.container.classList.remove('JCV-numb'), 50); // minimum delay to prevent triggering undesired button touch\n\t};\n\n\tprivate dispose = () => {\n\t\twindow.removeEventListener('pointerdown', this.onPointerDown);\n\t\twindow.removeEventListener('pointermove', this.onPointerMove);\n\t\twindow.removeEventListener('pointerup', this.onPointerUp);\n\t\tthis.preventionContainer.remove();\n\t\tthis._preventionContainer = null;\n\t};\n}\n"],"mappings":"0LAgBA,IAAqB,EAArB,cAA+C,CAAkC,CAChF,qBAAsD,KACtD,UAA6B,GAC7B,GACA,gBAMI,CACH,OAAQ,GACR,MAAO,EACP,MAAO,EACP,SAAU,EACV,SAAU,EACV,CAED,IAAY,qBAAsB,CACjC,GAAI,KAAK,uBAAyB,KAAM,MAAM,EAC9C,OAAO,KAAK,qBAGb,YAAY,GAAG,EAAgB,CAC9B,MAAM,GAAG,EAAK,CAEd,IAAM,EAAmB,SAAS,cAAc,MAAM,CACtD,EAAiB,UAAY,6CAC7B,EAAiB,YAChB,KAAK,QAAQ,6BAA+B,sBAC7C,KAAK,GAAK,KAAK,UAAU,IAAI,EAAY,CACzC,KAAK,qBAAuB,SAAS,cAAc,MAAM,CACzD,KAAK,qBAAqB,UACzB,+DAED,EAAU,YAAY,KAAK,qBAAsBA,EAAM,CACvD,KAAK,qBAAqB,YAAY,EAAiB,CACvD,KAAK,GAAG,KAAK,UAAU,YAAY,KAAK,qBAAqB,CAEzD,KAAK,QAAQ,wBAAwB,KAAK,iBAAiB,CAE/D,OAAO,iBAAiB,cAAe,KAAK,cAAc,CAC1D,OAAO,iBAAiB,cAAe,KAAK,cAAc,CAC1D,OAAO,iBAAiB,YAAa,KAAK,YAAY,CAEtD,KAAK,QAAQ,CACZ,wBAAyB,KAAK,gBAC9B,sBAAuB,KAAK,cAC5B,CAAC,CACF,KAAK,UAAU,KAAK,QAAQ,CAG7B,cAAyB,GAAoB,CAC5C,IAAM,EAAS,KAAK,GAAG,KAAK,UAAU,uBAAuB,CAE5D,EAAE,QAAU,EAAO,MACnB,EAAE,QAAU,EAAO,OACnB,EAAE,QAAU,EAAO,KACnB,EAAE,QAAU,EAAO,OAEd,KAAK,WAAW,KAAK,iBAAiB,CACjC,KAAK,YACf,KAAK,gBAAgB,SAAW,EAAE,QAClC,KAAK,gBAAgB,SAAW,EAAE,QAClC,KAAK,gBAAgB,MAAQ,EAAE,QAC/B,KAAK,gBAAgB,MAAQ,EAAE,QAC/B,KAAK,gBAAgB,OAAS,KAIhC,cAAyB,GAAoB,CACxC,KAAK,gBAAgB,SACxB,KAAK,gBAAgB,MAAQ,EAAE,QAC/B,KAAK,gBAAgB,MAAQ,EAAE,UAIjC,gBAA4B,CACvB,KAAK,gBAAgB,SACxB,KAAK,gBAAgB,OAAS,GAE7B,KAAK,IAAI,KAAK,gBAAgB,MAAQ,KAAK,gBAAgB,SAAS,CACnE,KAAK,IAAI,KAAK,gBAAgB,MAAQ,KAAK,gBAAgB,SAAS,CACrE,GAEA,KAAK,eAAe,GAIvB,oBAAwB,CACvB,KAAK,oBAAoB,UAAU,OAAO,aAAa,CACvD,KAAK,GAAG,KAAK,UAAU,UAAU,IAAI,WAAW,CAChD,KAAK,UAAY,IAGlB,kBAAsB,CACrB,KAAK,UAAY,GACjB,KAAK,oBAAoB,UAAU,IAAI,aAAa,CACpD,eAAiB,KAAK,GAAG,KAAK,UAAU,UAAU,OAAO,WAAW,CAAE,GAAG,EAG1E,YAAwB,CACvB,OAAO,oBAAoB,cAAe,KAAK,cAAc,CAC7D,OAAO,oBAAoB,cAAe,KAAK,cAAc,CAC7D,OAAO,oBAAoB,YAAa,KAAK,YAAY,CACzD,KAAK,oBAAoB,QAAQ,CACjC,KAAK,qBAAuB"}
+{"version":3,"file":"index.js","names":["style"],"sources":["../../../src/modules/MistouchPreventer/index.ts"],"sourcesContent":["import type { BaseOptions } from '$';\nimport type { BaseArgs } from '$/BaseModule';\nimport { BaseModule } from '$/BaseModule';\nimport DataManager from '$/DataManager';\nimport { applyStyles, destroyError } from '$/utilities';\nimport style from './styles.scss?inline';\n\ntype Options = {\n\tpreventMistouchAtStart?: boolean;\n\tmistouchPreventerBannerText?: string;\n} & BaseOptions;\n\ntype Augmentation = {\n\tstartMistouchPrevention: MistouchPreventer['startPrevention'];\n\tendMistouchPrevention: MistouchPreventer['endPrevention'];\n};\n\nexport default class MistouchPreventer extends BaseModule<Options, Augmentation> {\n\tprivate _preventionContainer: HTMLDivElement | undefined;\n\tprivate preventMt = false;\n\tprivate readonly DM: DataManager;\n\tprivate readonly preventMistouch: {\n\t\trecord: boolean;\n\t\tlastX: number;\n\t\tlastY: number;\n\t\tinitialX: number;\n\t\tinitialY: number;\n\t} = {\n\t\tinitialX: 0,\n\t\tinitialY: 0,\n\t\tlastX: 0,\n\t\tlastY: 0,\n\t\trecord: false,\n\t};\n\n\tprivate get preventionContainer() {\n\t\tif (!this._preventionContainer) throw destroyError;\n\t\treturn this._preventionContainer;\n\t}\n\n\tconstructor(...args: BaseArgs) {\n\t\tsuper(...args);\n\n\t\tconst preventionBanner = document.createElement('div');\n\t\tpreventionBanner.className = 'JCV-prevention-banner JCV-border-shadow-bg';\n\t\tpreventionBanner.textContent =\n\t\t\tthis.options.mistouchPreventerBannerText ?? 'Click on to unlock.';\n\t\tthis.DM = this.container.get(DataManager);\n\t\tthis._preventionContainer = document.createElement('div');\n\t\tthis._preventionContainer.className =\n\t\t\t'JCV-prevention-container JCV-hidden JCV-full JCV-flex-center';\n\n\t\tapplyStyles(this._preventionContainer, style);\n\t\tthis._preventionContainer.appendChild(preventionBanner);\n\t\tthis.DM.data.container.appendChild(this._preventionContainer);\n\n\t\tif (this.options.preventMistouchAtStart) this.startPrevention();\n\n\t\twindow.addEventListener('pointerdown', this.onPointerDown);\n\t\twindow.addEventListener('pointermove', this.onPointerMove);\n\t\twindow.addEventListener('pointerup', this.onPointerUp);\n\n\t\tthis.augment({\n\t\t\tendMistouchPrevention: this.endPrevention,\n\t\t\tstartMistouchPrevention: this.startPrevention,\n\t\t});\n\t\tthis.onDispose(this.dispose);\n\t}\n\n\tprivate readonly onPointerDown = (e: PointerEvent) => {\n\t\tconst bounds = this.DM.data.container.getBoundingClientRect();\n\t\tif (\n\t\t\te.clientX < bounds.left ||\n\t\t\te.clientX > bounds.right ||\n\t\t\te.clientY < bounds.top ||\n\t\t\te.clientY > bounds.bottom\n\t\t) {\n\t\t\tif (!this.preventMt) this.startPrevention();\n\t\t} else if (this.preventMt) {\n\t\t\tthis.preventMistouch.initialX = e.clientX;\n\t\t\tthis.preventMistouch.initialY = e.clientY;\n\t\t\tthis.preventMistouch.lastX = e.clientX;\n\t\t\tthis.preventMistouch.lastY = e.clientY;\n\t\t\tthis.preventMistouch.record = true;\n\t\t}\n\t};\n\n\tprivate readonly onPointerMove = (e: PointerEvent) => {\n\t\tif (this.preventMistouch.record) {\n\t\t\tthis.preventMistouch.lastX = e.clientX;\n\t\t\tthis.preventMistouch.lastY = e.clientY;\n\t\t}\n\t};\n\n\tprivate readonly onPointerUp = () => {\n\t\tif (this.preventMistouch.record) {\n\t\t\tthis.preventMistouch.record = false;\n\t\t\tif (\n\t\t\t\tMath.abs(this.preventMistouch.lastX - this.preventMistouch.initialX) +\n\t\t\t\t\tMath.abs(this.preventMistouch.lastY - this.preventMistouch.initialY) <\n\t\t\t\t5\n\t\t\t)\n\t\t\t\tthis.endPrevention();\n\t\t}\n\t};\n\n\tstartPrevention = () => {\n\t\tthis.preventionContainer.classList.remove('JCV-hidden');\n\t\tthis.DM.data.container.classList.add('JCV-numb');\n\t\tthis.preventMt = true;\n\t};\n\n\tendPrevention = () => {\n\t\tthis.preventMt = false;\n\t\tthis.preventionContainer.classList.add('JCV-hidden');\n\t\tsetTimeout(() => this.DM.data.container.classList.remove('JCV-numb'), 50); // Minimum delay to prevent triggering undesired button touch\n\t};\n\n\tprivate readonly dispose = () => {\n\t\twindow.removeEventListener('pointerdown', this.onPointerDown);\n\t\twindow.removeEventListener('pointermove', this.onPointerMove);\n\t\twindow.removeEventListener('pointerup', this.onPointerUp);\n\t\tthis.preventionContainer.remove();\n\t\tthis._preventionContainer = undefined;\n\t};\n}\n"],"mappings":"wMAiBA,IAAqB,EAArB,cAA+C,CAAkC,CAChF,qBACA,UAAoB,GACpB,GACA,gBAMI,CACH,SAAU,EACV,SAAU,EACV,MAAO,EACP,MAAO,EACP,OAAQ,GACR,CAED,IAAY,qBAAsB,CACjC,GAAI,CAAC,KAAK,qBAAsB,MAAM,EACtC,OAAO,KAAK,qBAGb,YAAY,GAAG,EAAgB,CAC9B,MAAM,GAAG,EAAK,CAEd,IAAM,EAAmB,SAAS,cAAc,MAAM,CACtD,EAAiB,UAAY,6CAC7B,EAAiB,YAChB,KAAK,QAAQ,6BAA+B,sBAC7C,KAAK,GAAK,KAAK,UAAU,IAAI,EAAY,CACzC,KAAK,qBAAuB,SAAS,cAAc,MAAM,CACzD,KAAK,qBAAqB,UACzB,+DAED,EAAY,KAAK,qBAAsBA,EAAM,CAC7C,KAAK,qBAAqB,YAAY,EAAiB,CACvD,KAAK,GAAG,KAAK,UAAU,YAAY,KAAK,qBAAqB,CAEzD,KAAK,QAAQ,wBAAwB,KAAK,iBAAiB,CAE/D,OAAO,iBAAiB,cAAe,KAAK,cAAc,CAC1D,OAAO,iBAAiB,cAAe,KAAK,cAAc,CAC1D,OAAO,iBAAiB,YAAa,KAAK,YAAY,CAEtD,KAAK,QAAQ,CACZ,sBAAuB,KAAK,cAC5B,wBAAyB,KAAK,gBAC9B,CAAC,CACF,KAAK,UAAU,KAAK,QAAQ,CAG7B,cAAkC,GAAoB,CACrD,IAAM,EAAS,KAAK,GAAG,KAAK,UAAU,uBAAuB,CAE5D,EAAE,QAAU,EAAO,MACnB,EAAE,QAAU,EAAO,OACnB,EAAE,QAAU,EAAO,KACnB,EAAE,QAAU,EAAO,OAEd,KAAK,WAAW,KAAK,iBAAiB,CACjC,KAAK,YACf,KAAK,gBAAgB,SAAW,EAAE,QAClC,KAAK,gBAAgB,SAAW,EAAE,QAClC,KAAK,gBAAgB,MAAQ,EAAE,QAC/B,KAAK,gBAAgB,MAAQ,EAAE,QAC/B,KAAK,gBAAgB,OAAS,KAIhC,cAAkC,GAAoB,CACjD,KAAK,gBAAgB,SACxB,KAAK,gBAAgB,MAAQ,EAAE,QAC/B,KAAK,gBAAgB,MAAQ,EAAE,UAIjC,gBAAqC,CAChC,KAAK,gBAAgB,SACxB,KAAK,gBAAgB,OAAS,GAE7B,KAAK,IAAI,KAAK,gBAAgB,MAAQ,KAAK,gBAAgB,SAAS,CACnE,KAAK,IAAI,KAAK,gBAAgB,MAAQ,KAAK,gBAAgB,SAAS,CACrE,GAEA,KAAK,eAAe,GAIvB,oBAAwB,CACvB,KAAK,oBAAoB,UAAU,OAAO,aAAa,CACvD,KAAK,GAAG,KAAK,UAAU,UAAU,IAAI,WAAW,CAChD,KAAK,UAAY,IAGlB,kBAAsB,CACrB,KAAK,UAAY,GACjB,KAAK,oBAAoB,UAAU,IAAI,aAAa,CACpD,eAAiB,KAAK,GAAG,KAAK,UAAU,UAAU,OAAO,WAAW,CAAE,GAAG,EAG1E,YAAiC,CAChC,OAAO,oBAAoB,cAAe,KAAK,cAAc,CAC7D,OAAO,oBAAoB,cAAe,KAAK,cAAc,CAC7D,OAAO,oBAAoB,YAAa,KAAK,YAAY,CACzD,KAAK,oBAAoB,QAAQ,CACjC,KAAK,qBAAuB,IAAA"}

package/dist/shared/index.d.ts

@@ -1,26 +1,26 @@
 //#region ../shared/index.d.ts
 type Parser = (markdown: string) => string | Promise<string>;
-interface JSONCanvasGroupNode extends JSONCanvasGenericNode {
+type JSONCanvasGroupNode = {
   type: 'group';
   label?: string;
   background?: string;
   backgroundStyle?: 'cover' | 'ratio' | 'repeat';
-}
-interface JSONCanvasFileNode extends JSONCanvasGenericNode {
+} & JSONCanvasGenericNode;
+type JSONCanvasFileNode = {
   type: 'file';
   file: string;
   subpath?: string;
-}
-interface JSONCanvasTextNode extends JSONCanvasGenericNode {
+} & JSONCanvasGenericNode;
+type JSONCanvasTextNode = {
   type: 'text';
   text: string;
-}
-interface JSONCanvasLinkNode extends JSONCanvasGenericNode {
+} & JSONCanvasGenericNode;
+type JSONCanvasLinkNode = {
   type: 'link';
   url: string;
-}
+} & JSONCanvasGenericNode;
 type JSONCanvasNode = JSONCanvasGroupNode | JSONCanvasFileNode | JSONCanvasTextNode | JSONCanvasLinkNode;
-interface JSONCanvasEdge {
+type JSONCanvasEdge = {
   id: string;
   fromNode: string;
   toNode: string;
@@ -30,12 +30,12 @@ interface JSONCanvasEdge {
   label?: string;
   styleAttributes?: Record<string, string>;
   color?: string;
-}
-interface JSONCanvas {
+};
+type JSONCanvas = {
   nodes?: Array<JSONCanvasNode>;
   edges?: Array<JSONCanvasEdge>;
-}
-interface JSONCanvasGenericNode {
+};
+type JSONCanvasGenericNode = {
   id: string;
   type: 'group' | 'file' | 'text' | 'link';
   x: number;
@@ -44,7 +44,7 @@ interface JSONCanvasGenericNode {
   height: number;
   styleAttributes?: Record<string, string>;
   color?: string;
-}
+};
 //#endregion
 export { JSONCanvas, JSONCanvasEdge, JSONCanvasFileNode, JSONCanvasGroupNode, JSONCanvasLinkNode, JSONCanvasNode, JSONCanvasTextNode, Parser };
 //# sourceMappingURL=index.d.ts.map

package/dist/utilities/{fetchCanvas.d.ts → fetch-canvas.d.ts}

@@ -1,7 +1,7 @@
 import { JSONCanvas } from "../shared/index.js";
 
-//#region src/utilities/fetchCanvas.d.ts
+//#region src/utilities/fetch-canvas.d.ts
 declare function fetchCanvas(path: `${string}.canvas` | `${string}.json`): Promise<JSONCanvas>;
 //#endregion
 export { fetchCanvas };
-//# sourceMappingURL=fetchCanvas.d.ts.map
+//# sourceMappingURL=fetch-canvas.d.ts.map

package/dist/utilities/{fetchCanvas.js → fetch-canvas.js}

@@ -1,2 +1,2 @@
 async function e(e){return await fetch(e).then(e=>e.json())}export{e as default};
-//# sourceMappingURL=fetchCanvas.js.map
+//# sourceMappingURL=fetch-canvas.js.map

package/dist/utilities/fetch-canvas.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"fetch-canvas.js","names":[],"sources":["../../src/utilities/fetch-canvas.ts"],"sourcesContent":["import type { JSONCanvas } from '@repo/shared';\n\nexport default async function fetchCanvas(path: `${string}.canvas` | `${string}.json`) {\n\treturn (await fetch(path).then((res) => res.json())) as JSONCanvas;\n}\n"],"mappings":"AAEA,eAA8B,EAAY,EAA6C,CACtF,OAAQ,MAAM,MAAM,EAAK,CAAC,KAAM,GAAQ,EAAI,MAAM,CAAC"}

package/dist/utilities/{renderToString.d.ts → render-to-string.d.ts}

@@ -1,6 +1,6 @@
 import { JSONCanvas, Parser } from "../shared/index.js";
 
-//#region src/utilities/renderToString.d.ts
+//#region src/utilities/render-to-string.d.ts
 declare function renderToString(options: {
   canvas: JSONCanvas;
   attachments?: Record<string, string>;
@@ -9,4 +9,4 @@ declare function renderToString(options: {
 }): Promise<string>;
 //#endregion
 export { renderToString };
-//# sourceMappingURL=renderToString.d.ts.map
+//# sourceMappingURL=render-to-string.d.ts.map

package/dist/utilities/render-to-string.js

@@ -0,0 +1,2 @@
+async function e(e){let n=async n=>await t(n,e.parser??(e=>e)),r=e.canvas.nodes??[],i=e.attachmentDir??`./`;r.forEach(t=>{if(t.type===`file`&&!t.file.startsWith(`http`)){let n=t.file.split(`/`).pop()??``;t.file=e.attachments?.[n]??i+n}});let a=[];return await Promise.all(r.map(async e=>a.push(await n(e)))),a.join(``)}async function t(e,t){switch(e.type){case`text`:return await t(e.text);case`file`:return await n(e,t);case`link`:return`<a href="${e.url}" target="_blank" rel="nofollow">${e.url}</a>`;default:return``}}async function n(e,t){return/\.md$/i.exec(e.file)?await r(e.file,t):/\.(png|jpg|jpeg|gif|svg|webp)$/i.exec(e.file)?`<img src="${e.file}" alt="${e.file.split(`/`).pop()}">`:/\.(mp3|wav)$/i.exec(e.file)?`<audio src="${e.file}" controls></audio>`:``}async function r(e,t){let n;try{let r=await(await fetch(e)).text(),i=/^---\n([\s\S]*?)\n---\n([\s\S]*)$/.exec(r);n=await t(i?i[2]:r)}catch{n=`Failed to load content.`}return n}export{e as default};
+//# sourceMappingURL=render-to-string.js.map

package/dist/utilities/render-to-string.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"render-to-string.js","names":[],"sources":["../../src/utilities/render-to-string.ts"],"sourcesContent":["import type { JSONCanvas, JSONCanvasFileNode, JSONCanvasNode, Parser } from '@repo/shared';\n\nexport default async function renderToString(options: {\n\tcanvas: JSONCanvas;\n\tattachments?: Record<string, string>;\n\tattachmentDir?: string;\n\tparser?: Parser;\n}) {\n\tconst render = async (node: JSONCanvasNode) =>\n\t\tawait renderer(node, options.parser ?? ((markdown: string) => markdown));\n\tconst nodes = options.canvas.nodes ?? [];\n\tconst basePath = options.attachmentDir ?? './';\n\tnodes.forEach((node) => {\n\t\tif (node.type === 'file' && !node.file.startsWith('http')) {\n\t\t\tconst file = node.file.split('/');\n\t\t\tconst name = file.pop() ?? '';\n\t\t\tnode.file = options.attachments?.[name] ?? basePath + name;\n\t\t}\n\t});\n\tconst renderedContent: Array<string> = [];\n\tawait Promise.all(nodes.map(async (node) => renderedContent.push(await render(node))));\n\treturn renderedContent.join('');\n}\n\nasync function renderer(node: JSONCanvasNode, parse: Parser) {\n\tswitch (node.type) {\n\t\tcase 'text': {\n\t\t\treturn await parse(node.text);\n\t\t}\n\t\tcase 'file': {\n\t\t\treturn await fileProcessor(node, parse);\n\t\t}\n\t\tcase 'link': {\n\t\t\treturn `<a href=\"${node.url}\" target=\"_blank\" rel=\"nofollow\">${node.url}</a>`;\n\t\t}\n\t\tdefault: {\n\t\t\treturn '';\n\t\t}\n\t}\n}\n\nasync function fileProcessor(node: JSONCanvasFileNode, parse: Parser) {\n\tif (/\\.md$/i.exec(node.file)) return await loadMarkdown(node.file, parse);\n\telse if (/\\.(png|jpg|jpeg|gif|svg|webp)$/i.exec(node.file))\n\t\treturn `<img src=\"${node.file}\" alt=\"${node.file.split('/').pop()}\">`;\n\telse if (/\\.(mp3|wav)$/i.exec(node.file)) return `<audio src=\"${node.file}\" controls></audio>`;\n\treturn '';\n}\n\nasync function loadMarkdown(path: string, parse: Parser) {\n\tlet parsedContent: string;\n\ttry {\n\t\tconst response = await fetch(path);\n\t\tconst result = await response.text();\n\t\tconst frontmatterMatch = /^---\\n([\\s\\S]*?)\\n---\\n([\\s\\S]*)$/.exec(result);\n\t\tparsedContent = await parse(frontmatterMatch ? frontmatterMatch[2] : result);\n\t} catch {\n\t\tparsedContent = 'Failed to load content.';\n\t}\n\treturn parsedContent;\n}\n"],"mappings":"AAEA,eAA8B,EAAe,EAK1C,CACF,IAAM,EAAS,KAAO,IACrB,MAAM,EAAS,EAAM,EAAQ,SAAY,GAAqB,GAAU,CACnE,EAAQ,EAAQ,OAAO,OAAS,EAAE,CAClC,EAAW,EAAQ,eAAiB,KAC1C,EAAM,QAAS,GAAS,CACvB,GAAI,EAAK,OAAS,QAAU,CAAC,EAAK,KAAK,WAAW,OAAO,CAAE,CAE1D,IAAM,EADO,EAAK,KAAK,MAAM,IACZ,CAAC,KAAK,EAAI,GAC3B,EAAK,KAAO,EAAQ,cAAc,IAAS,EAAW,IAEtD,CACF,IAAM,EAAiC,EAAE,CAEzC,OADA,MAAM,QAAQ,IAAI,EAAM,IAAI,KAAO,IAAS,EAAgB,KAAK,MAAM,EAAO,EAAK,CAAC,CAAC,CAAC,CAC/E,EAAgB,KAAK,GAAG,CAGhC,eAAe,EAAS,EAAsB,EAAe,CAC5D,OAAQ,EAAK,KAAb,CACC,IAAK,OACJ,OAAO,MAAM,EAAM,EAAK,KAAK,CAE9B,IAAK,OACJ,OAAO,MAAM,EAAc,EAAM,EAAM,CAExC,IAAK,OACJ,MAAO,YAAY,EAAK,IAAI,mCAAmC,EAAK,IAAI,MAEzE,QACC,MAAO,IAKV,eAAe,EAAc,EAA0B,EAAe,CAKrE,MAJI,SAAS,KAAK,EAAK,KAAK,CAAS,MAAM,EAAa,EAAK,KAAM,EAAM,CAChE,kCAAkC,KAAK,EAAK,KAAK,CAClD,aAAa,EAAK,KAAK,SAAS,EAAK,KAAK,MAAM,IAAI,CAAC,KAAK,CAAC,IAC1D,gBAAgB,KAAK,EAAK,KAAK,CAAS,eAAe,EAAK,KAAK,qBACnE,GAGR,eAAe,EAAa,EAAc,EAAe,CACxD,IAAI,EACJ,GAAI,CAEH,IAAM,EAAS,MAAM,MADE,MAAM,EAAK,EACJ,MAAM,CAC9B,EAAmB,oCAAoC,KAAK,EAAO,CACzE,EAAgB,MAAM,EAAM,EAAmB,EAAiB,GAAK,EAAO,MACrE,CACP,EAAgB,0BAEjB,OAAO"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "json-canvas-viewer",
-  "version": "4.1.1",
+  "version": "4.2.0",
   "description": "An extensible web-based viewer for JSON Canvas, easy to embed into websites.",
   "keywords": [
     "frontend",

package/dist/utilities/fetchCanvas.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"fetchCanvas.js","names":[],"sources":["../../src/utilities/fetchCanvas.ts"],"sourcesContent":["import type { JSONCanvas } from '@repo/shared';\n\nexport default async function fetchCanvas(path: `${string}.canvas` | `${string}.json`) {\n\treturn (await fetch(path).then((res) => res.json())) as JSONCanvas;\n}\n"],"mappings":"AAEA,eAA8B,EAAY,EAA6C,CACtF,OAAQ,MAAM,MAAM,EAAK,CAAC,KAAM,GAAQ,EAAI,MAAM,CAAC"}

package/dist/utilities/renderToString.js

@@ -1,2 +0,0 @@
-async function e(e){let n=async n=>await t(n,e.parser??(e=>e)),r=e.canvas.nodes??[],i=e.attachmentDir??`./`;r.forEach(t=>{if(t.type===`file`&&!t.file.startsWith(`http`)){let n=t.file.split(`/`).pop()??``;e.attachments?.[n]?t.file=e.attachments[n]:t.file=i+n}});let a=[];return await Promise.all(r.map(async e=>a.push(await n(e)))),a.join(``)}async function t(e,t){switch(e.type){case`text`:return await t(e.text);case`file`:return await n(e,t);case`link`:return`<a href="${e.url}" target="_blank" rel="nofollow">${e.url}</a>`;default:return``}}async function n(e,t){return e.file.match(/\.md$/i)?await r(e.file,t):e.file.match(/\.(png|jpg|jpeg|gif|svg|webp)$/i)?`<img src="${e.file}" alt="${e.file.split(`/`).pop()}">`:e.file.match(/\.(mp3|wav)$/i)?`<audio src="${e.file}" controls></audio>`:``}async function r(e,t){let n;try{let r=await(await fetch(e)).text(),i=r.match(/^---\n([\s\S]*?)\n---\n([\s\S]*)$/);n=i?await t(i[2]):await t(r)}catch{n=`Failed to load content.`}return n}export{e as default};
-//# sourceMappingURL=renderToString.js.map

package/dist/utilities/renderToString.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"renderToString.js","names":[],"sources":["../../src/utilities/renderToString.ts"],"sourcesContent":["import type { JSONCanvas, JSONCanvasFileNode, JSONCanvasNode, Parser } from '@repo/shared';\n\nexport default async function renderToString(options: {\n\tcanvas: JSONCanvas;\n\tattachments?: Record<string, string>;\n\tattachmentDir?: string;\n\tparser?: Parser;\n}) {\n\tconst render = async (node: JSONCanvasNode) =>\n\t\tawait renderer(node, options.parser ?? ((markdown: string) => markdown));\n\tconst nodes = options.canvas.nodes ?? [];\n\tconst basePath = options.attachmentDir ?? './';\n\tnodes.forEach((node) => {\n\t\tif (node.type === 'file' && !node.file.startsWith('http')) {\n\t\t\tconst file = node.file.split('/');\n\t\t\tconst name = file.pop() ?? '';\n\t\t\tif (options.attachments?.[name]) node.file = options.attachments[name];\n\t\t\telse node.file = basePath + name;\n\t\t}\n\t});\n\tconst renderedContent: Array<string> = [];\n\tawait Promise.all(nodes.map(async (node) => renderedContent.push(await render(node))));\n\treturn renderedContent.join('');\n}\n\nasync function renderer(node: JSONCanvasNode, parse: Parser) {\n\tswitch (node.type) {\n\t\tcase 'text':\n\t\t\treturn await parse(node.text);\n\t\tcase 'file':\n\t\t\treturn await fileProcessor(node, parse);\n\t\tcase 'link':\n\t\t\treturn `<a href=\"${node.url}\" target=\"_blank\" rel=\"nofollow\">${node.url}</a>`;\n\t\tdefault:\n\t\t\treturn '';\n\t}\n}\n\nasync function fileProcessor(node: JSONCanvasFileNode, parse: Parser) {\n\tif (node.file.match(/\\.md$/i)) return await loadMarkdown(node.file, parse);\n\telse if (node.file.match(/\\.(png|jpg|jpeg|gif|svg|webp)$/i))\n\t\treturn `<img src=\"${node.file}\" alt=\"${node.file.split('/').pop()}\">`;\n\telse if (node.file.match(/\\.(mp3|wav)$/i)) return `<audio src=\"${node.file}\" controls></audio>`;\n\treturn '';\n}\n\nasync function loadMarkdown(path: string, parse: Parser) {\n\tlet parsedContent: string;\n\ttry {\n\t\tconst response = await fetch(path);\n\t\tconst result = await response.text();\n\t\tconst frontmatterMatch = result.match(/^---\\n([\\s\\S]*?)\\n---\\n([\\s\\S]*)$/);\n\t\tif (frontmatterMatch) parsedContent = await parse(frontmatterMatch[2]);\n\t\telse parsedContent = await parse(result);\n\t} catch {\n\t\tparsedContent = 'Failed to load content.';\n\t}\n\treturn parsedContent;\n}\n"],"mappings":"AAEA,eAA8B,EAAe,EAK1C,CACF,IAAM,EAAS,KAAO,IACrB,MAAM,EAAS,EAAM,EAAQ,SAAY,GAAqB,GAAU,CACnE,EAAQ,EAAQ,OAAO,OAAS,EAAE,CAClC,EAAW,EAAQ,eAAiB,KAC1C,EAAM,QAAS,GAAS,CACvB,GAAI,EAAK,OAAS,QAAU,CAAC,EAAK,KAAK,WAAW,OAAO,CAAE,CAE1D,IAAM,EADO,EAAK,KAAK,MAAM,IACZ,CAAC,KAAK,EAAI,GACvB,EAAQ,cAAc,GAAO,EAAK,KAAO,EAAQ,YAAY,GAC5D,EAAK,KAAO,EAAW,IAE5B,CACF,IAAM,EAAiC,EAAE,CAEzC,OADA,MAAM,QAAQ,IAAI,EAAM,IAAI,KAAO,IAAS,EAAgB,KAAK,MAAM,EAAO,EAAK,CAAC,CAAC,CAAC,CAC/E,EAAgB,KAAK,GAAG,CAGhC,eAAe,EAAS,EAAsB,EAAe,CAC5D,OAAQ,EAAK,KAAb,CACC,IAAK,OACJ,OAAO,MAAM,EAAM,EAAK,KAAK,CAC9B,IAAK,OACJ,OAAO,MAAM,EAAc,EAAM,EAAM,CACxC,IAAK,OACJ,MAAO,YAAY,EAAK,IAAI,mCAAmC,EAAK,IAAI,MACzE,QACC,MAAO,IAIV,eAAe,EAAc,EAA0B,EAAe,CAKrE,OAJI,EAAK,KAAK,MAAM,SAAS,CAAS,MAAM,EAAa,EAAK,KAAM,EAAM,CACjE,EAAK,KAAK,MAAM,kCAAkC,CACnD,aAAa,EAAK,KAAK,SAAS,EAAK,KAAK,MAAM,IAAI,CAAC,KAAK,CAAC,IAC1D,EAAK,KAAK,MAAM,gBAAgB,CAAS,eAAe,EAAK,KAAK,qBACpE,GAGR,eAAe,EAAa,EAAc,EAAe,CACxD,IAAI,EACJ,GAAI,CAEH,IAAM,EAAS,MAAM,MADE,MAAM,EAAK,EACJ,MAAM,CAC9B,EAAmB,EAAO,MAAM,oCAAoC,CAC1E,AACK,EADD,EAAkC,MAAM,EAAM,EAAiB,GAAG,CACjD,MAAM,EAAM,EAAO,MACjC,CACP,EAAgB,0BAEjB,OAAO"}