@pixi/text-html - npm Package Compare versions

Comparing version 3.0.1 to 3.0.2

dist/html-text.cjs.js

 "use strict";/*!
- * @pixi/text-html - v3.0.1
- * Compiled Wed, 05 Oct 2022 20:30:43 UTC
+ * @pixi/text-html - v3.0.2
+ * Compiled Thu, 06 Oct 2022 16:17:49 UTC
  *
  * @pixi/text-html is licensed under the MIT License.
  * http://www.opensource.org/licenses/mit-license
- */Object.defineProperty(exports,"__esModule",{value:!0});var b=require("@pixi/sprite"),a=require("@pixi/core"),p=require("@pixi/text");class S extends b.Sprite{constructor(e="",t={},h){h=h||document.createElement("canvas"),h.width=3,h.height=3;const o=a.Texture.from(h,{scaleMode:a.settings.SCALE_MODE});o.orig=new a.Rectangle,o.trim=new a.Rectangle,super(o),this._text=null,this._style=null,this._autoResolution=!0,this._loading=!1,this.localStyleID=-1,this.dirty=!1;const n="http://www.w3.org/2000/svg",i=document.createElementNS(n,"svg"),r=document.createElementNS(n,"foreignObject"),l=document.createElementNS("http://www.w3.org/1999/xhtml","div");r.setAttribute("height","100%"),r.setAttribute("width","100%"),i.appendChild(r),this._domElement=l,this._svgRoot=i,this._foreignObject=r,this._image=new Image,this.canvas=h,this.context=h.getContext("2d"),this._resolution=a.settings.RESOLUTION,this.text=e,this.style=t}updateText(e=!0){const{style:t,resolution:h}=this,o=this.canvas,n=this.context;if(this.localStyleID!==t.styleID&&(this.dirty=!0,this.localStyleID=t.styleID),!this.dirty&&e)return;let i=`
+ */Object.defineProperty(exports,"__esModule",{value:!0});var b=require("@pixi/sprite"),n=require("@pixi/core"),p=require("@pixi/text");class S extends b.Sprite{constructor(e="",t={},h){h=h||document.createElement("canvas"),h.width=3,h.height=3;const o=n.Texture.from(h,{scaleMode:n.settings.SCALE_MODE});o.orig=new n.Rectangle,o.trim=new n.Rectangle,super(o),this._text=null,this._style=null,this._autoResolution=!0,this._loading=!1,this.localStyleID=-1,this.dirty=!1;const a="http://www.w3.org/2000/svg",i=document.createElementNS(a,"svg"),r=document.createElementNS(a,"foreignObject"),l=document.createElementNS("http://www.w3.org/1999/xhtml","div");r.setAttribute("height","100%"),r.setAttribute("width","100%"),i.appendChild(r),this._domElement=l,this._svgRoot=i,this._foreignObject=r,this._image=new Image,this.canvas=h,this.context=h.getContext("2d"),this._resolution=n.settings.RESOLUTION,this.text=e,this.style=t}updateText(e=!0){const{style:t,resolution:h}=this,o=this.canvas,a=this.context;if(this.localStyleID!==t.styleID&&(this.dirty=!0,this.localStyleID=t.styleID),!this.dirty&&e)return;let i=`
             display:inline-block;
@@ -18,3 +18,3 @@ color:${t.fill};
             padding:${t.padding}px;
-        `;if(t.lineHeight&&(i+=`line-height:${t.lineHeight}px;`),t.wordWrap&&(i+=`word-wrap:${t.breakWords?"break-all":"break-word"};`,i+=`width:${t.wordWrapWidth}px;`),t.strokeThickness){let{stroke:s}=t;typeof s=="number"&&(s=a.utils.hex2string(s)),i+=`-webkit-text-stroke-width: ${t.strokeThickness}px;`,i+=`-webkit-text-stroke-color: ${s};`,i+=`text-stroke-width: ${t.strokeThickness}px;`,i+=`text-stroke-color: ${s};`,i+="paint-order: stroke;"}if(t.dropShadow){const{dropShadowAngle:s,dropShadowDistance:u,dropShadowBlur:x,dropShadowColor:_,dropShadowAlpha:g}=t,w=Math.round(Math.cos(s)*u),m=Math.round(Math.sin(s)*u);let d=_;if(typeof d=="number"&&(d=a.utils.hex2string(d)),d.charAt(0)==="#"&&g<1){const[y,f,v]=a.utils.hex2rgb(parseInt(d.replace("#",""),16));d=`rgba(${y*255|0}, ${f*255|0}, ${v*255|0}, ${g})`}i+=`text-shadow: ${w}px ${m}px ${x}px ${d};`}const r=this._domElement;Object.assign(r,{innerHTML:this._text,style:i}),document.body.appendChild(r);const{width:l,height:c}=r.getBoundingClientRect();if(document.body.removeChild(r),this._foreignObject.appendChild(r),this._svgRoot.setAttribute("width",l.toString()),this._svgRoot.setAttribute("height",c.toString()),o.width=Math.ceil((Math.max(1,l)+t.padding*2)*h),o.height=Math.ceil((Math.max(1,c)+t.padding*2)*h),!this._loading){const s=this._image,u=new XMLSerializer().serializeToString(this._svgRoot);this._loading=!0,s.src=`data:image/svg+xml;charset=utf8,${encodeURIComponent(u)}`,s.onload=()=>{n.scale(h,h),n.clearRect(0,0,o.width,o.height),n.drawImage(s,0,0,l,c,0,0,l,c),s.src="",s.onload=null,this._loading=!1,this.updateTexture()}}}updateTexture(){const{style:e,texture:t,resolution:h}=this,o=this.canvas,n=this.context;if(e.trim){const{width:l,height:c,data:s}=a.utils.trimCanvas(o);s&&(o.width=l,o.height=c,n.putImageData(s,0,0))}const i=e.trim?0:e.padding,r=t.baseTexture;t.trim.width=t._frame.width=Math.ceil(o.width/h),t.trim.height=t._frame.height=Math.ceil(o.height/h),t.trim.x=-i,t.trim.y=-i,t.orig.width=t._frame.width-i*2,t.orig.height=t._frame.height-i*2,this._onTextureUpdate(),r.setRealSize(o.width,o.height,h),this.dirty=!1}_render(e){this._autoResolution&&this._resolution!==e.resolution&&(this._resolution=e.resolution,this.dirty=!0),this.updateText(!0),super._render(e)}_renderCanvas(e){this._autoResolution&&this._resolution!==e.resolution&&(this._resolution=e.resolution,this.dirty=!0),this.updateText(!0),super._renderCanvas(e)}getLocalBounds(e){return this.updateText(!0),super.getLocalBounds(e)}_calculateBounds(){this.updateText(!0),this.calculateVertices(),this._bounds.addQuad(this.vertexData)}_onStyleChange(){this.dirty=!0}destroy(e){super.destroy(e);const t=null;this.context=null,this.canvas&&(this.canvas.width=this.canvas.height=0),this.canvas=t,this._style=t,this._svgRoot=t,this._domElement=t,this._foreignObject=t,this._image.onload=null,this._image.src="",this._image=t}get width(){return this.updateText(!0),Math.abs(this.scale.x)*this.canvas.width/this.resolution}set width(e){this.updateText(!0);const t=a.utils.sign(this.scale.x)||1;this.scale.x=t*e/this.canvas.width/this.resolution,this._width=e}get height(){return this.updateText(!0),Math.abs(this.scale.y)*this.canvas.height/this.resolution}set height(e){this.updateText(!0);const t=a.utils.sign(this.scale.y)||1;this.scale.y=t*e/this.canvas.height/this.resolution,this._height=e}get style(){return this._style}set style(e){e=e||{},e instanceof p.TextStyle?this._style=e:this._style=new p.TextStyle(e),this.localStyleID=-1,this.dirty=!0}get text(){return this._text}set text(e){e=String(e===""||e===null||e===void 0?" ":e),e=this.sanitiseText(e),this._text!==e&&(this._text=e,this.dirty=!0)}get resolution(){return this._resolution}set resolution(e){this._autoResolution=!1,this._resolution!==e&&(this._resolution=e,this.dirty=!0)}sanitiseText(e){return e.replace(/<br>/gi,"<br/>").replace(/<hr>/gi,"<hr/>").replace(/&nbsp;/gi,"&#160;")}}exports.HTMLText=S;
+        `;if(t.lineHeight&&(i+=`line-height:${t.lineHeight}px;`),t.wordWrap&&(i+=`word-wrap:${t.breakWords?"break-all":"break-word"};`,i+=`width:${t.wordWrapWidth}px;`),t.strokeThickness){let{stroke:s}=t;typeof s=="number"&&(s=n.utils.hex2string(s)),i+=`-webkit-text-stroke-width: ${t.strokeThickness}px;`,i+=`-webkit-text-stroke-color: ${s};`,i+=`text-stroke-width: ${t.strokeThickness}px;`,i+=`text-stroke-color: ${s};`,i+="paint-order: stroke;"}if(t.dropShadow){const{dropShadowAngle:s,dropShadowDistance:c,dropShadowBlur:x,dropShadowColor:_,dropShadowAlpha:g}=t,w=Math.round(Math.cos(s)*c),m=Math.round(Math.sin(s)*c);let d=_;if(typeof d=="number"&&(d=n.utils.hex2string(d)),d.charAt(0)==="#"&&g<1){const[y,f,v]=n.utils.hex2rgb(parseInt(d.replace("#",""),16));d=`rgba(${y*255|0}, ${f*255|0}, ${v*255|0}, ${g})`}i+=`text-shadow: ${w}px ${m}px ${x}px ${d};`}const r=this._domElement;Object.assign(r,{innerHTML:this._text,style:i}),document.body.appendChild(r);const{width:l,height:u}=r.getBoundingClientRect();if(document.body.removeChild(r),this._foreignObject.appendChild(r),this._svgRoot.setAttribute("width",l.toString()),this._svgRoot.setAttribute("height",u.toString()),o.width=Math.ceil((Math.max(1,l)+t.padding*2)*h),o.height=Math.ceil((Math.max(1,u)+t.padding*2)*h),!this._loading){const s=this._image,c=new XMLSerializer().serializeToString(this._svgRoot);this._loading=!0,s.src=`data:image/svg+xml;charset=utf8,${encodeURIComponent(c)}`,s.onload=()=>{a.scale(h,h),a.clearRect(0,0,o.width,o.height),a.drawImage(s,0,0,l,u,0,0,l,u),s.src="",s.onload=null,this._loading=!1,this.updateTexture()}}}updateTexture(){const{style:e,texture:t,resolution:h}=this,o=this.canvas,a=this.context;if(e.trim){const{width:l,height:u,data:s}=n.utils.trimCanvas(o);s&&(o.width=l,o.height=u,a.putImageData(s,0,0))}const i=e.trim?0:e.padding,r=t.baseTexture;t.trim.width=t._frame.width=o.width/h,t.trim.height=t._frame.height=o.height/h,t.trim.x=-i,t.trim.y=-i,t.orig.width=t._frame.width-i*2,t.orig.height=t._frame.height-i*2,this._onTextureUpdate(),r.setRealSize(o.width,o.height,h),this.dirty=!1}_render(e){this._autoResolution&&this._resolution!==e.resolution&&(this._resolution=e.resolution,this.dirty=!0),this.updateText(!0),super._render(e)}_renderCanvas(e){this._autoResolution&&this._resolution!==e.resolution&&(this._resolution=e.resolution,this.dirty=!0),this.updateText(!0),super._renderCanvas(e)}getLocalBounds(e){return this.updateText(!0),super.getLocalBounds(e)}_calculateBounds(){this.updateText(!0),this.calculateVertices(),this._bounds.addQuad(this.vertexData)}_onStyleChange(){this.dirty=!0}destroy(e){super.destroy(e);const t=null;this.context=null,this.canvas&&(this.canvas.width=this.canvas.height=0),this.canvas=t,this._style=t,this._svgRoot=t,this._domElement=t,this._foreignObject=t,this._image.onload=null,this._image.src="",this._image=t}get width(){return this.updateText(!0),Math.abs(this.scale.x)*this.canvas.width/this.resolution}set width(e){this.updateText(!0);const t=n.utils.sign(this.scale.x)||1;this.scale.x=t*e/this.canvas.width/this.resolution,this._width=e}get height(){return this.updateText(!0),Math.abs(this.scale.y)*this.canvas.height/this.resolution}set height(e){this.updateText(!0);const t=n.utils.sign(this.scale.y)||1;this.scale.y=t*e/this.canvas.height/this.resolution,this._height=e}get style(){return this._style}set style(e){e=e||{},e instanceof p.TextStyle?this._style=e:this._style=new p.TextStyle(e),this.localStyleID=-1,this.dirty=!0}get text(){return this._text}set text(e){e=String(e===""||e===null||e===void 0?" ":e),e=this.sanitiseText(e),this._text!==e&&(this._text=e,this.dirty=!0)}get resolution(){return this._resolution}set resolution(e){this._autoResolution=!1,this._resolution!==e&&(this._resolution=e,this.dirty=!0)}sanitiseText(e){return e.replace(/<br>/gi,"<br/>").replace(/<hr>/gi,"<hr/>").replace(/&nbsp;/gi,"&#160;")}}exports.HTMLText=S;
 //# sourceMappingURL=html-text.cjs.js.map

dist/html-text.js

 /*!
- * @pixi/text-html - v3.0.1
- * Compiled Wed, 05 Oct 2022 20:30:43 UTC
+ * @pixi/text-html - v3.0.2
+ * Compiled Thu, 06 Oct 2022 16:17:49 UTC
  *
@@ -18,3 +18,3 @@ * @pixi/text-html is licensed under the MIT License.
             padding:${t.padding}px;
-        `;if(t.lineHeight&&(i+=`line-height:${t.lineHeight}px;`),t.wordWrap&&(i+=`word-wrap:${t.breakWords?"break-all":"break-word"};`,i+=`width:${t.wordWrapWidth}px;`),t.strokeThickness){let{stroke:s}=t;typeof s=="number"&&(s=a.utils.hex2string(s)),i+=`-webkit-text-stroke-width: ${t.strokeThickness}px;`,i+=`-webkit-text-stroke-color: ${s};`,i+=`text-stroke-width: ${t.strokeThickness}px;`,i+=`text-stroke-color: ${s};`,i+="paint-order: stroke;"}if(t.dropShadow){const{dropShadowAngle:s,dropShadowDistance:g,dropShadowBlur:m,dropShadowColor:y,dropShadowAlpha:x}=t,f=Math.round(Math.cos(s)*g),v=Math.round(Math.sin(s)*g);let d=y;if(typeof d=="number"&&(d=a.utils.hex2string(d)),d.charAt(0)==="#"&&x<1){const[b,S,T]=a.utils.hex2rgb(parseInt(d.replace("#",""),16));d=`rgba(${b*255|0}, ${S*255|0}, ${T*255|0}, ${x})`}i+=`text-shadow: ${f}px ${v}px ${m}px ${d};`}const n=this._domElement;Object.assign(n,{innerHTML:this._text,style:i}),document.body.appendChild(n);const{width:l,height:u}=n.getBoundingClientRect();if(document.body.removeChild(n),this._foreignObject.appendChild(n),this._svgRoot.setAttribute("width",l.toString()),this._svgRoot.setAttribute("height",u.toString()),o.width=Math.ceil((Math.max(1,l)+t.padding*2)*h),o.height=Math.ceil((Math.max(1,u)+t.padding*2)*h),!this._loading){const s=this._image,g=new XMLSerializer().serializeToString(this._svgRoot);this._loading=!0,s.src=`data:image/svg+xml;charset=utf8,${encodeURIComponent(g)}`,s.onload=()=>{r.scale(h,h),r.clearRect(0,0,o.width,o.height),r.drawImage(s,0,0,l,u,0,0,l,u),s.src="",s.onload=null,this._loading=!1,this.updateTexture()}}}updateTexture(){const{style:e,texture:t,resolution:h}=this,o=this.canvas,r=this.context;if(e.trim){const{width:l,height:u,data:s}=a.utils.trimCanvas(o);s&&(o.width=l,o.height=u,r.putImageData(s,0,0))}const i=e.trim?0:e.padding,n=t.baseTexture;t.trim.width=t._frame.width=Math.ceil(o.width/h),t.trim.height=t._frame.height=Math.ceil(o.height/h),t.trim.x=-i,t.trim.y=-i,t.orig.width=t._frame.width-i*2,t.orig.height=t._frame.height-i*2,this._onTextureUpdate(),n.setRealSize(o.width,o.height,h),this.dirty=!1}_render(e){this._autoResolution&&this._resolution!==e.resolution&&(this._resolution=e.resolution,this.dirty=!0),this.updateText(!0),super._render(e)}_renderCanvas(e){this._autoResolution&&this._resolution!==e.resolution&&(this._resolution=e.resolution,this.dirty=!0),this.updateText(!0),super._renderCanvas(e)}getLocalBounds(e){return this.updateText(!0),super.getLocalBounds(e)}_calculateBounds(){this.updateText(!0),this.calculateVertices(),this._bounds.addQuad(this.vertexData)}_onStyleChange(){this.dirty=!0}destroy(e){super.destroy(e);const t=null;this.context=null,this.canvas&&(this.canvas.width=this.canvas.height=0),this.canvas=t,this._style=t,this._svgRoot=t,this._domElement=t,this._foreignObject=t,this._image.onload=null,this._image.src="",this._image=t}get width(){return this.updateText(!0),Math.abs(this.scale.x)*this.canvas.width/this.resolution}set width(e){this.updateText(!0);const t=a.utils.sign(this.scale.x)||1;this.scale.x=t*e/this.canvas.width/this.resolution,this._width=e}get height(){return this.updateText(!0),Math.abs(this.scale.y)*this.canvas.height/this.resolution}set height(e){this.updateText(!0);const t=a.utils.sign(this.scale.y)||1;this.scale.y=t*e/this.canvas.height/this.resolution,this._height=e}get style(){return this._style}set style(e){e=e||{},e instanceof p.TextStyle?this._style=e:this._style=new p.TextStyle(e),this.localStyleID=-1,this.dirty=!0}get text(){return this._text}set text(e){e=String(e===""||e===null||e===void 0?" ":e),e=this.sanitiseText(e),this._text!==e&&(this._text=e,this.dirty=!0)}get resolution(){return this._resolution}set resolution(e){this._autoResolution=!1,this._resolution!==e&&(this._resolution=e,this.dirty=!0)}sanitiseText(e){return e.replace(/<br>/gi,"<br/>").replace(/<hr>/gi,"<hr/>").replace(/&nbsp;/gi,"&#160;")}}return c.HTMLText=w,c}({},PIXI,PIXI,PIXI);Object.assign(PIXI,_pixi_htmltext);
+        `;if(t.lineHeight&&(i+=`line-height:${t.lineHeight}px;`),t.wordWrap&&(i+=`word-wrap:${t.breakWords?"break-all":"break-word"};`,i+=`width:${t.wordWrapWidth}px;`),t.strokeThickness){let{stroke:s}=t;typeof s=="number"&&(s=a.utils.hex2string(s)),i+=`-webkit-text-stroke-width: ${t.strokeThickness}px;`,i+=`-webkit-text-stroke-color: ${s};`,i+=`text-stroke-width: ${t.strokeThickness}px;`,i+=`text-stroke-color: ${s};`,i+="paint-order: stroke;"}if(t.dropShadow){const{dropShadowAngle:s,dropShadowDistance:g,dropShadowBlur:m,dropShadowColor:y,dropShadowAlpha:x}=t,f=Math.round(Math.cos(s)*g),v=Math.round(Math.sin(s)*g);let d=y;if(typeof d=="number"&&(d=a.utils.hex2string(d)),d.charAt(0)==="#"&&x<1){const[b,S,T]=a.utils.hex2rgb(parseInt(d.replace("#",""),16));d=`rgba(${b*255|0}, ${S*255|0}, ${T*255|0}, ${x})`}i+=`text-shadow: ${f}px ${v}px ${m}px ${d};`}const n=this._domElement;Object.assign(n,{innerHTML:this._text,style:i}),document.body.appendChild(n);const{width:l,height:u}=n.getBoundingClientRect();if(document.body.removeChild(n),this._foreignObject.appendChild(n),this._svgRoot.setAttribute("width",l.toString()),this._svgRoot.setAttribute("height",u.toString()),o.width=Math.ceil((Math.max(1,l)+t.padding*2)*h),o.height=Math.ceil((Math.max(1,u)+t.padding*2)*h),!this._loading){const s=this._image,g=new XMLSerializer().serializeToString(this._svgRoot);this._loading=!0,s.src=`data:image/svg+xml;charset=utf8,${encodeURIComponent(g)}`,s.onload=()=>{r.scale(h,h),r.clearRect(0,0,o.width,o.height),r.drawImage(s,0,0,l,u,0,0,l,u),s.src="",s.onload=null,this._loading=!1,this.updateTexture()}}}updateTexture(){const{style:e,texture:t,resolution:h}=this,o=this.canvas,r=this.context;if(e.trim){const{width:l,height:u,data:s}=a.utils.trimCanvas(o);s&&(o.width=l,o.height=u,r.putImageData(s,0,0))}const i=e.trim?0:e.padding,n=t.baseTexture;t.trim.width=t._frame.width=o.width/h,t.trim.height=t._frame.height=o.height/h,t.trim.x=-i,t.trim.y=-i,t.orig.width=t._frame.width-i*2,t.orig.height=t._frame.height-i*2,this._onTextureUpdate(),n.setRealSize(o.width,o.height,h),this.dirty=!1}_render(e){this._autoResolution&&this._resolution!==e.resolution&&(this._resolution=e.resolution,this.dirty=!0),this.updateText(!0),super._render(e)}_renderCanvas(e){this._autoResolution&&this._resolution!==e.resolution&&(this._resolution=e.resolution,this.dirty=!0),this.updateText(!0),super._renderCanvas(e)}getLocalBounds(e){return this.updateText(!0),super.getLocalBounds(e)}_calculateBounds(){this.updateText(!0),this.calculateVertices(),this._bounds.addQuad(this.vertexData)}_onStyleChange(){this.dirty=!0}destroy(e){super.destroy(e);const t=null;this.context=null,this.canvas&&(this.canvas.width=this.canvas.height=0),this.canvas=t,this._style=t,this._svgRoot=t,this._domElement=t,this._foreignObject=t,this._image.onload=null,this._image.src="",this._image=t}get width(){return this.updateText(!0),Math.abs(this.scale.x)*this.canvas.width/this.resolution}set width(e){this.updateText(!0);const t=a.utils.sign(this.scale.x)||1;this.scale.x=t*e/this.canvas.width/this.resolution,this._width=e}get height(){return this.updateText(!0),Math.abs(this.scale.y)*this.canvas.height/this.resolution}set height(e){this.updateText(!0);const t=a.utils.sign(this.scale.y)||1;this.scale.y=t*e/this.canvas.height/this.resolution,this._height=e}get style(){return this._style}set style(e){e=e||{},e instanceof p.TextStyle?this._style=e:this._style=new p.TextStyle(e),this.localStyleID=-1,this.dirty=!0}get text(){return this._text}set text(e){e=String(e===""||e===null||e===void 0?" ":e),e=this.sanitiseText(e),this._text!==e&&(this._text=e,this.dirty=!0)}get resolution(){return this._resolution}set resolution(e){this._autoResolution=!1,this._resolution!==e&&(this._resolution=e,this.dirty=!0)}sanitiseText(e){return e.replace(/<br>/gi,"<br/>").replace(/<hr>/gi,"<hr/>").replace(/&nbsp;/gi,"&#160;")}}return c.HTMLText=w,c}({},PIXI,PIXI,PIXI);Object.assign(PIXI,_pixi_htmltext);
 //# sourceMappingURL=html-text.js.map

package.json

 {
   "name": "@pixi/text-html",
-  "version": "3.0.1",
+  "version": "3.0.2",
   "description": "Multi-Style Text Rendering Plugin for PixiJS",
@@ -5,0 +5,0 @@ "main": "dist/html-text.cjs.js",

No alert changes

Worsened metrics

Total package byte prevSize

84457

decreased by-0.26%

No dependency changes