@ax-design/reveal-highlight - npm Package Compare versions

Comparing version 0.1.9-beta.0 to 0.1.9-beta.1

build/main.js

@@ -5,3 +5,3 @@ (function(a,b){"object"==typeof exports&&"undefined"!=typeof module?b(exports):"function"==typeof define&&define.amd?define(["exports"],b):(a=a||self,b(a.AxRevealHighlight={}))})(this,function(a){'use strict';function b(a,b){return b?new c(a):new d(a)}// interface RevealStyle {
 return parseFloat(this.get(a))}}class d{constructor(a){this.el=a,this.style=a.computedStyleMap()}size(){return this.style.size}get(a){return this.style.get(a).toString()}getNumber(a){const b=this.style.get(a).value;return"number"==typeof b?b:parseFloat(b);// Maybe NaN
-}}class e{constructor(){this._currentHashId=0,this._storage=[],this.newBoundary=()=>{const a=this._currentHashId++,c={_currentHashId:0,id:a,clientX:-1e3,clientY:-1e3,paintedClientX:-1e3,paintedClientY:-1e3,mouseInBoundary:!1,canvasList:[],dirty:!1,raf:null,destroy:()=>{this._storage.find((a,b)=>{return this._storage.splice(b,1),a===c})},addReveal:a=>{const d={canvas:a,ctx:a.getContext("2d"),cachedRevealBitmap:[],width:0,height:0,cachedStyle:{top:-1,left:-1,width:-1,height:-1,trueFillRadius:[0,0],cacheCanvasSize:-1,color:"",opacity:1,borderStyle:"",borderWidth:1,fillMode:"",fillRadius:0,diffuse:!0,revealAnimateSpeed:0,revealReleasedAccelerateRate:0},currentFrameId:-1,cachedFrameId:-2,getCanvasPaintingStyle:()=>{var c=Math.round;if(d.currentFrameId===d.cachedFrameId)return d.cachedStyle;const e=!!document.documentElement.dataset.revealCompat,f=b(a,e);if(0===f.size())return d.cachedStyle;const g=a.getBoundingClientRect(),h=f.get("--reveal-color").match(/\((\d+,\s*\d+,\s*\d+)[\s\S]*?\)/),i={top:c(g.top),left:c(g.left),width:c(g.width),height:c(g.height),color:h&&1<h.length?h[1]:"0, 0, 0",opacity:f.getNumber("--reveal-opacity"),borderStyle:f.get("--reveal-border-style"),borderWidth:f.getNumber("--reveal-border-width"),fillMode:f.get("--reveal-fill-mode"),fillRadius:f.getNumber("--reveal-fill-radius"),diffuse:"true"===f.get("--reveal-diffuse"),revealAnimateSpeed:f.getNumber("--reveal-animate-speed"),revealReleasedAccelerateRate:f.getNumber("--reveal-released-accelerate-rate")},{width:j,height:k,fillMode:l,fillRadius:m}=i;let n=[0,0];switch(l){case"none":break;case"relative":n=[j,k].sort().map(a=>a*m);break;case"absolute":n=[m,m];break;default:throw new SyntaxError("The value of `--reveal-border-style` must be `relative`, `absolute` or `none`!");}const o=2*n[1];return d.cachedStyle=Object.assign({},i,{trueFillRadius:n,cacheCanvasSize:o}),d.cachedFrameId=d.currentFrameId,d.cachedStyle},cacheRevealBitmaps:()=>{if(!d.ctx)return;const{width:a,height:b,trueFillRadius:c,cacheCanvasSize:e}=d.getCanvasPaintingStyle(),{color:f,opacity:g}=d.cachedStyle;d.width=a,d.height=b,d.canvas.width=a,d.canvas.height=b,d.cachedRevealBitmap=[];let h,j,k,l;for(let a of[0,1]){if(k=document.createElement("canvas"),k.width=e,k.height=e,l=k.getContext("2d"),!l)return;h=0===a?g:.5*g,j=l.createRadialGradient(e/2,e/2,0,e/2,e/2,c[a]),j.addColorStop(0,"rgba("+f+", "+h+")"),j.addColorStop(1,"rgba("+f+", 0.0)"),l.fillStyle=j,l.fillRect(0,0,e,e),d.cachedRevealBitmap.push({type:a,bitmap:l.getImageData(0,0,e,e)})}},mouseInCanvas:()=>{const{top:a,left:b,width:e,height:f}=d.getCanvasPaintingStyle(),g=c.clientX-b,h=c.clientY-a;return!(0>g||g>e)&&!(0>h||h>f)},getAnimateGrd:(a,b)=>{if(!d.ctx)return null;const{color:c,opacity:e}=d.cachedStyle,f=e*(.2-a),g=e*(.1-.07*a),h=.1+.8*a,i=0>f?0:f,j=0>g?0:g,k=1<h?1:h;return b.addColorStop(0,`rgba(${c},${i})`),b.addColorStop(.55*k,`rgba(${c},${j})`),b.addColorStop(k,`rgba(${c}, 0)`),b},mouseUpClientX:null,mouseUpClientY:null,mouseDownAnimateStartFrame:null,mouseDownAnimateCurrentFrame:null,mouseDownAnimateReleasedFrame:null,mouseDownAnimateLogicFrame:null,mousePressed:!1,mouseReleased:!1};d.cacheRevealBitmaps(),c.canvasList.push(d)},removeReveal:a=>{c.canvasList.find((b,d)=>!!(b&&a===b.canvas)&&(c.canvasList.splice(d,1),!0))},onPointerEnterBoundary:()=>{c.mouseInBoundary=!0,c.raf||(c.raf=window.requestAnimationFrame(a=>c.paintAll(a)))},onPointerLeaveBoundary:()=>{c.mouseInBoundary=!1,c.paintAll(0,!0)},paintAll:(a,b)=>{(b||c.mouseInBoundary||0!==c.animationQueue.size)&&(c.animationQueue.forEach(b=>{if(!a)return;if(b.currentFrameId===a)return;b.currentFrameId=a,null===b.mouseDownAnimateStartFrame&&(b.mouseDownAnimateStartFrame=a);const d=a-b.mouseDownAnimateStartFrame;b.mouseDownAnimateCurrentFrame=d;const e=b.cachedStyle.revealAnimateSpeed,f=b.cachedStyle.revealReleasedAccelerateRate;b.mouseDownAnimateLogicFrame=b.mouseReleased&&b.mouseDownAnimateReleasedFrame?d/e+(d-b.mouseDownAnimateReleasedFrame)/e*f:d/e,1<b.mouseDownAnimateLogicFrame&&c.cleanUpAnimation(b)}),c.canvasList.forEach(d=>{d.currentFrameId=a,f(d,c,b)}),c.dirty=!0,c.paintedClientX=c.clientX,c.paintedClientY=c.clientY,c.mouseInBoundary||0!==c.animationQueue.size?window.requestAnimationFrame(a=>{c.paintAll(a)}):c.raf=null)},resetAll:()=>{c.canvasList.forEach(a=>{f(a,c)})},initializeAnimation:()=>{const a=c.canvasList.find(a=>a.mouseInCanvas());a&&(c.animationQueue.add(a),a.mouseDownAnimateStartFrame=null,a.mousePressed=!0,a.mouseReleased=!1)},switchAnimation:()=>{c.animationQueue.forEach(a=>{a.mouseReleased||(a.mouseReleased=!0,a.mouseDownAnimateReleasedFrame=a.mouseDownAnimateCurrentFrame,a.mouseUpClientX=c.clientX,a.mouseUpClientY=c.clientY)})},cleanUpAnimation:a=>{a.mouseUpClientX=null,a.mouseUpClientY=null,a.mouseDownAnimateStartFrame=null,a.mouseDownAnimateCurrentFrame=null,a.mouseDownAnimateReleasedFrame=null,a.mouseDownAnimateLogicFrame=null,a.mousePressed=!1,a.mouseReleased=!1,c.animationQueue.delete(a),f(a,c,!0)},animationQueue:new Set,getRevealAnimationConfig:()=>c.canvasList.find(a=>a.mouseInCanvas())||null,revealAnimationConfig:null,mouseUpClientX:null,mouseUpClientY:null,mouseDownAnimateStartFrame:null,mouseDownAnimateCurrentFrame:null,mouseDownAnimateReleasedFrame:null,mouseDownAnimateLogicFrame:null,mousePressed:!1,mouseReleased:!1};return this._storage.push(c),c}}}const f=(a,b,c)=>{const d=b.animationQueue.has(a);if(b.clientX===b.paintedClientX&&b.clientY===b.paintedClientY&&!d&&!c)return;if(!a.ctx)return;if(a.ctx.clearRect(0,0,a.width,a.height),b.dirty=!1,!b.mouseInBoundary&&!d)return;if(2>a.cachedRevealBitmap.length)return;const{top:e,left:f,width:g,height:h,cacheCanvasSize:i,trueFillRadius:j}=a.getCanvasPaintingStyle();(g!==a.width||h!==a.height)&&a.cacheRevealBitmaps();const k=a.cachedStyle.borderStyle,l=a.cachedStyle.borderWidth,m=a.cachedStyle.fillMode,n=b.clientX-f,o=b.clientY-e,p=0<n&&n<g&&0<o&&o<h;if(!p&&!a.cachedStyle.diffuse&&!d)return;let q=0,r=0,s=0,t=0;switch(k){case"full":q=l,r=l,s=g-2*l,t=h-2*l;break;case"half":q=0,r=l,s=g,t=h-2*l;break;case"none":q=0,r=0,s=g,t=h;break;default:throw new SyntaxError("The value of `--reveal-border-style` must be `full`, `half` or `none`!");}const u=n-i/2,v=o-i/2;if(isNaN(n)||isNaN(o))return;if(b.mouseInBoundary&&("none"!==k&&(a.ctx.putImageData(a.cachedRevealBitmap[0].bitmap,u,v,-u,-v,g,h),a.ctx.clearRect(q,r,s,t)),"none"!=m&&p&&a.ctx.putImageData(a.cachedRevealBitmap[1].bitmap,u,v,q-u,r-v,s,t)),!a.mousePressed||!a.mouseDownAnimateLogicFrame)return;let w;w=a.mouseReleased&&a.mouseUpClientX&&a.mouseUpClientY?a.ctx.createRadialGradient(a.mouseUpClientX-f,a.mouseUpClientY-e,0,a.mouseUpClientX-f,a.mouseUpClientY-e,j[1]):a.ctx.createRadialGradient(n,o,0,n,o,j[1]),a.getAnimateGrd(a.mouseDownAnimateLogicFrame,w),a.ctx.fillStyle=w,a.ctx.fillRect(q,r,1.5*s,1.5*t)};class g extends HTMLElement{constructor(){super(...arguments),this.stateManager=new e}}g.ElementName="ax-reveal-provider";class h extends HTMLElement{constructor(){super(...arguments),this.updatePointerPosition=a=>{this.waitForStorage(b=>{b.clientX=a.clientX,b.clientY=a.clientY})},this.handlePointerEnter=()=>this.waitForStorage(a=>a.onPointerEnterBoundary()),this.handlePointerLeave=()=>this.waitForStorage(a=>a.onPointerLeaveBoundary()),this.handlePointerMove=a=>this.updatePointerPosition(a),this.handlePointerDown=a=>this.waitForStorage(b=>{this.updatePointerPosition(a),b.initializeAnimation()}),this.handlePointerUp=()=>this.waitForStorage(a=>a.switchAnimation())}get storage(){return this._storage}set storage(a){const b=this._storage;b&&this.dispatchEvent(new CustomEvent(h.removeStorageEvent,{detail:b})),a&&(this._storage=a,this.dispatchEvent(new CustomEvent(h.attachStorageEvent,{detail:this._storage})),b&&this.dispatchEvent(new CustomEvent(h.replaceStorageEvent,{detail:{old:b,new:a}})))}waitForStorage(a){this.storage===void 0?this.addEventListener(h.attachStorageEvent,()=>a(this.storage),{once:!0}):a(this.storage)}appendStorage(a=!1){if(!a&&this.storage)return;const b=this.closest(g.ElementName),c=b?b.stateManager:h.storage;this.storage=c.newBoundary()}connectedCallback(){this.appendStorage(!0),this.addEventListener("pointerenter",this.handlePointerEnter),this.addEventListener("pointerleave",this.handlePointerLeave),this.addEventListener("pointermove",this.handlePointerMove),this.addEventListener("pointerdown",this.handlePointerDown),this.addEventListener("pointerup",this.handlePointerUp)}disconnectedCallback(){this.storage=void 0}}h.storage=new e,h.ElementName="ax-reveal-bound",h.removeStorageEvent="removeStorage",h.attachStorageEvent="attachStorage",h.replaceStorageEvent="replaceStorage";class i extends HTMLElement{constructor(){super(),this.root=this.attachShadow({mode:"open"}),this.root.innerHTML=`
+}}class e{constructor(){this._currentHashId=0,this._storage=[],this.newBoundary=()=>{const a=this._currentHashId++,c={_currentHashId:0,id:a,clientX:-1e3,clientY:-1e3,paintedClientX:-1e3,paintedClientY:-1e3,mouseInBoundary:!1,canvasList:[],dirty:!1,raf:null,destroy:()=>{this._storage.find((a,b)=>{return this._storage.splice(b,1),a===c})},addReveal:a=>{const d={canvas:a,ctx:a.getContext("2d"),cachedRevealBitmap:[],width:0,height:0,cachedStyle:{top:-1,left:-1,width:-1,height:-1,trueFillRadius:[0,0],cacheCanvasSize:-1,color:"",opacity:1,borderStyle:"",borderWidth:1,fillMode:"",fillRadius:0,diffuse:!0,revealAnimateSpeed:0,revealReleasedAccelerateRate:0},currentFrameId:-1,cachedFrameId:-2,getCanvasPaintingStyle:()=>{var c=Math.round;if(d.currentFrameId===d.cachedFrameId)return d.cachedStyle;const e=!!document.documentElement.dataset.revealCompat,f=b(a,e);if(0===f.size())return d.cachedStyle;const g=a.getBoundingClientRect(),h=f.get("--reveal-color").match(/\((\d+,\s*\d+,\s*\d+)[\s\S]*?\)/),i={top:c(g.top),left:c(g.left),width:c(g.width),height:c(g.height),color:h&&1<h.length?h[1]:"0, 0, 0",opacity:f.getNumber("--reveal-opacity"),borderStyle:f.get("--reveal-border-style"),borderWidth:f.getNumber("--reveal-border-width"),fillMode:f.get("--reveal-fill-mode"),fillRadius:f.getNumber("--reveal-fill-radius"),diffuse:"true"===f.get("--reveal-diffuse"),revealAnimateSpeed:f.getNumber("--reveal-animate-speed"),revealReleasedAccelerateRate:f.getNumber("--reveal-released-accelerate-rate")},{width:j,height:k,fillMode:l,fillRadius:m}=i;let n=[0,0];switch(l){case"none":break;case"relative":n=[j,k].sort((c,a)=>c-a).map(a=>a*m);break;case"absolute":n=[m,m];break;default:throw new SyntaxError("The value of `--reveal-border-style` must be `relative`, `absolute` or `none`!");}const o=2*n[1];return d.cachedStyle=Object.assign({},i,{trueFillRadius:n,cacheCanvasSize:o}),d.cachedFrameId=d.currentFrameId,d.cachedStyle},cacheRevealBitmaps:()=>{if(!d.ctx)return;const{width:a,height:b,trueFillRadius:c,cacheCanvasSize:e}=d.getCanvasPaintingStyle(),{color:f,opacity:g}=d.cachedStyle;d.width=a,d.height=b,d.canvas.width=a,d.canvas.height=b,d.cachedRevealBitmap=[];let h,j,k,l;for(let a of[0,1]){if(k=document.createElement("canvas"),k.width=e,k.height=e,l=k.getContext("2d"),!l)return;h=0===a?g:.5*g,j=l.createRadialGradient(e/2,e/2,0,e/2,e/2,c[a]),j.addColorStop(0,"rgba("+f+", "+h+")"),j.addColorStop(1,"rgba("+f+", 0.0)"),l.fillStyle=j,l.fillRect(0,0,e,e),d.cachedRevealBitmap.push({type:a,bitmap:l.getImageData(0,0,e,e)})}},mouseInCanvas:()=>{const{top:a,left:b,width:e,height:f}=d.getCanvasPaintingStyle(),g=c.clientX-b,h=c.clientY-a;return!(0>g||g>e)&&!(0>h||h>f)},getAnimateGrd:(a,b)=>{if(!d.ctx)return null;const{color:c,opacity:e}=d.cachedStyle,f=e*(.2-a),g=e*(.1-.07*a),h=.1+.8*a,i=0>f?0:f,j=0>g?0:g,k=1<h?1:h;return b.addColorStop(0,`rgba(${c},${i})`),b.addColorStop(.55*k,`rgba(${c},${j})`),b.addColorStop(k,`rgba(${c}, 0)`),b},mouseUpClientX:null,mouseUpClientY:null,mouseDownAnimateStartFrame:null,mouseDownAnimateCurrentFrame:null,mouseDownAnimateReleasedFrame:null,mouseDownAnimateLogicFrame:null,mousePressed:!1,mouseReleased:!1};d.cacheRevealBitmaps(),c.canvasList.push(d)},removeReveal:a=>{c.canvasList.find((b,d)=>!!(b&&a===b.canvas)&&(c.canvasList.splice(d,1),!0))},onPointerEnterBoundary:()=>{c.mouseInBoundary=!0,c.raf||(c.raf=window.requestAnimationFrame(a=>c.paintAll(a)))},onPointerLeaveBoundary:()=>{c.mouseInBoundary=!1,c.paintAll(0,!0)},paintAll:(a,b)=>{(b||c.mouseInBoundary||0!==c.animationQueue.size)&&(c.animationQueue.forEach(b=>{if(!a)return;if(b.currentFrameId===a)return;b.currentFrameId=a,null===b.mouseDownAnimateStartFrame&&(b.mouseDownAnimateStartFrame=a);const d=a-b.mouseDownAnimateStartFrame;b.mouseDownAnimateCurrentFrame=d;const e=b.cachedStyle.revealAnimateSpeed,f=b.cachedStyle.revealReleasedAccelerateRate;b.mouseDownAnimateLogicFrame=b.mouseReleased&&b.mouseDownAnimateReleasedFrame?d/e+(d-b.mouseDownAnimateReleasedFrame)/e*f:d/e,1<b.mouseDownAnimateLogicFrame&&c.cleanUpAnimation(b)}),c.canvasList.forEach(d=>{d.currentFrameId=a,f(d,c,b)}),c.dirty=!0,c.paintedClientX=c.clientX,c.paintedClientY=c.clientY,c.mouseInBoundary||0!==c.animationQueue.size?window.requestAnimationFrame(a=>{c.paintAll(a)}):c.raf=null)},resetAll:()=>{c.canvasList.forEach(a=>{f(a,c)})},initializeAnimation:()=>{const a=c.canvasList.find(a=>a.mouseInCanvas());a&&(c.animationQueue.add(a),a.mouseDownAnimateStartFrame=null,a.mousePressed=!0,a.mouseReleased=!1)},switchAnimation:()=>{c.animationQueue.forEach(a=>{a.mouseReleased||(a.mouseReleased=!0,a.mouseDownAnimateReleasedFrame=a.mouseDownAnimateCurrentFrame,a.mouseUpClientX=c.clientX,a.mouseUpClientY=c.clientY)})},cleanUpAnimation:a=>{a.mouseUpClientX=null,a.mouseUpClientY=null,a.mouseDownAnimateStartFrame=null,a.mouseDownAnimateCurrentFrame=null,a.mouseDownAnimateReleasedFrame=null,a.mouseDownAnimateLogicFrame=null,a.mousePressed=!1,a.mouseReleased=!1,c.animationQueue.delete(a),f(a,c,!0)},animationQueue:new Set,getRevealAnimationConfig:()=>c.canvasList.find(a=>a.mouseInCanvas())||null,revealAnimationConfig:null,mouseUpClientX:null,mouseUpClientY:null,mouseDownAnimateStartFrame:null,mouseDownAnimateCurrentFrame:null,mouseDownAnimateReleasedFrame:null,mouseDownAnimateLogicFrame:null,mousePressed:!1,mouseReleased:!1};return this._storage.push(c),c}}}const f=(a,b,c)=>{const d=b.animationQueue.has(a);if(b.clientX===b.paintedClientX&&b.clientY===b.paintedClientY&&!d&&!c)return;if(!a.ctx)return;if(a.ctx.clearRect(0,0,a.width,a.height),b.dirty=!1,!b.mouseInBoundary&&!d)return;if(2>a.cachedRevealBitmap.length)return;const{top:e,left:f,width:g,height:h,cacheCanvasSize:i,trueFillRadius:j}=a.getCanvasPaintingStyle();(g!==a.width||h!==a.height)&&a.cacheRevealBitmaps();const k=a.cachedStyle.borderStyle,l=a.cachedStyle.borderWidth,m=a.cachedStyle.fillMode,n=b.clientX-f,o=b.clientY-e,p=0<n&&n<g&&0<o&&o<h;if(!p&&!a.cachedStyle.diffuse&&!d)return;let q=0,r=0,s=0,t=0;switch(k){case"full":q=l,r=l,s=g-2*l,t=h-2*l;break;case"half":q=0,r=l,s=g,t=h-2*l;break;case"none":q=0,r=0,s=g,t=h;break;default:throw new SyntaxError("The value of `--reveal-border-style` must be `full`, `half` or `none`!");}const u=n-i/2,v=o-i/2;if(isNaN(n)||isNaN(o))return;if(b.mouseInBoundary&&("none"!==k&&(a.ctx.putImageData(a.cachedRevealBitmap[0].bitmap,u,v,-u,-v,g,h),a.ctx.clearRect(q,r,s,t)),"none"!=m&&p&&a.ctx.putImageData(a.cachedRevealBitmap[1].bitmap,u,v,q-u,r-v,s,t)),!a.mousePressed||!a.mouseDownAnimateLogicFrame)return;let w;w=a.mouseReleased&&a.mouseUpClientX&&a.mouseUpClientY?a.ctx.createRadialGradient(a.mouseUpClientX-f,a.mouseUpClientY-e,0,a.mouseUpClientX-f,a.mouseUpClientY-e,j[1]):a.ctx.createRadialGradient(n,o,0,n,o,j[1]),a.getAnimateGrd(a.mouseDownAnimateLogicFrame,w),a.ctx.fillStyle=w,a.ctx.fillRect(q,r,1.5*s,1.5*t)};class g extends HTMLElement{constructor(){super(...arguments),this.stateManager=new e}}g.ElementName="ax-reveal-provider";class h extends HTMLElement{constructor(){super(...arguments),this.updatePointerPosition=a=>{this.waitForStorage(b=>{b.clientX=a.clientX,b.clientY=a.clientY})},this.handlePointerEnter=()=>this.waitForStorage(a=>a.onPointerEnterBoundary()),this.handlePointerLeave=()=>this.waitForStorage(a=>a.onPointerLeaveBoundary()),this.handlePointerMove=a=>this.updatePointerPosition(a),this.handlePointerDown=a=>this.waitForStorage(b=>{this.updatePointerPosition(a),b.initializeAnimation()}),this.handlePointerUp=()=>this.waitForStorage(a=>a.switchAnimation())}get storage(){return this._storage}set storage(a){const b=this._storage;b&&this.dispatchEvent(new CustomEvent(h.removeStorageEvent,{detail:b})),a&&(this._storage=a,this.dispatchEvent(new CustomEvent(h.attachStorageEvent,{detail:this._storage})),b&&this.dispatchEvent(new CustomEvent(h.replaceStorageEvent,{detail:{old:b,new:a}})))}waitForStorage(a){this.storage===void 0?this.addEventListener(h.attachStorageEvent,()=>a(this.storage),{once:!0}):a(this.storage)}appendStorage(a=!1){if(!a&&this.storage)return;const b=this.closest(g.ElementName),c=b?b.stateManager:h.storage;this.storage=c.newBoundary()}connectedCallback(){this.appendStorage(!0),this.addEventListener("pointerenter",this.handlePointerEnter),this.addEventListener("pointerleave",this.handlePointerLeave),this.addEventListener("pointermove",this.handlePointerMove),this.addEventListener("pointerdown",this.handlePointerDown),this.addEventListener("pointerup",this.handlePointerUp)}disconnectedCallback(){this.storage=void 0}}h.storage=new e,h.ElementName="ax-reveal-bound",h.removeStorageEvent="removeStorage",h.attachStorageEvent="attachStorage",h.replaceStorageEvent="replaceStorage";class i extends HTMLElement{constructor(){super(),this.root=this.attachShadow({mode:"open"}),this.root.innerHTML=`
 <div>
@@ -8,0 +8,0 @@ <slot></slot>

es/RevealStateManager.js

@@ -94,3 +94,3 @@ // interface RevealStyle {
                                 case 'relative':
-                                    trueFillRadius = [width, height].sort().map(x => x * fillRadius);
+                                    trueFillRadius = [width, height].sort((a, b) => a - b).map(x => x * fillRadius);
                                     break;
@@ -97,0 +97,0 @@ case 'absolute':

package.json

 {
     "name": "@ax-design/reveal-highlight",
-    "version": "0.1.9-beta.0",
+    "version": "0.1.9-beta.1",
     "description": "Web component that implement Reveal Highlight of Axiom Design System.",
@@ -5,0 +5,0 @@ "main": "build/main.js",

src/RevealStateManager.ts

@@ -181,3 +181,3 @@ // interface RevealStyle {
                             case 'relative':
-                                trueFillRadius = [width, height].sort().map(x => x * fillRadius);
+                                trueFillRadius = [width, height].sort((a, b) => a - b).map(x => x * fillRadius);
                                 break;
@@ -213,3 +213,3 @@ case 'absolute':
 
-                        const { color, opacity }= canvasConfig.cachedStyle;
+                        const { color, opacity } = canvasConfig.cachedStyle;
 
@@ -216,0 +216,0 @@ canvasConfig.width = width;

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

1400467

increased by0.07%

No dependency changes