UNPKG

react-threesixty

Version:

A Simple React 360 Library using threesixty.js

github.com/ashivliving/react-threesixty

ashivliving/react-threesixty

2 lines (1 loc) • 49.5 kB
1
2
!function(t,e){"object"==typeof exports&&"undefined"!=typeof module?e(exports,require("react")):"function"==typeof define&&define.amd?define(["exports","react"],e):e((t="undefined"!=typeof globalThis?globalThis:t||self).ReactThreeSixty={},t.React)}(this,(function(t,e){"use strict";function n(t){return t&&"object"==typeof t&&"default"in t?t:{default:t}}var i=n(e);function o(t,e){var n=Object.keys(t);if(Object.getOwnPropertySymbols){var i=Object.getOwnPropertySymbols(t);e&&(i=i.filter((function(e){return Object.getOwnPropertyDescriptor(t,e).enumerable}))),n.push.apply(n,i)}return n}function a(t){for(var e=1;e<arguments.length;e++){var n=null!=arguments[e]?arguments[e]:{};e%2?o(Object(n),!0).forEach((function(e){r(t,e,n[e])})):Object.getOwnPropertyDescriptors?Object.defineProperties(t,Object.getOwnPropertyDescriptors(n)):o(Object(n)).forEach((function(e){Object.defineProperty(t,e,Object.getOwnPropertyDescriptor(n,e))}))}return t}function r(t,e,n){return e in t?Object.defineProperty(t,e,{value:n,enumerable:!0,configurable:!0,writable:!0}):t[e]=n,t}function s(t,e){return function(t){if(Array.isArray(t))return t}(t)||function(t,e){var n=null==t?null:"undefined"!=typeof Symbol&&t[Symbol.iterator]||t["@@iterator"];if(null==n)return;var i,o,a=[],r=!0,s=!1;try{for(n=n.call(t);!(r=(i=n.next()).done)&&(a.push(i.value),!e||a.length!==e);r=!0);}catch(t){s=!0,o=t}finally{try{r||null==n.return||n.return()}finally{if(s)throw o}}return a}(t,e)||c(t,e)||function(){throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}()}function l(t){return function(t){if(Array.isArray(t))return u(t)}(t)||function(t){if("undefined"!=typeof Symbol&&null!=t[Symbol.iterator]||null!=t["@@iterator"])return Array.from(t)}(t)||c(t)||function(){throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}()}function c(t,e){if(t){if("string"==typeof t)return u(t,e);var n=Object.prototype.toString.call(t).slice(8,-1);return"Object"===n&&t.constructor&&(n=t.constructor.name),"Map"===n||"Set"===n?Array.from(t):"Arguments"===n||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)?u(t,e):void 0}}function u(t,e){(null==e||e>t.length)&&(e=t.length);for(var n=0,i=new Array(e);n<e;n++)i[n]=t[n];return i}var p,d=function(t,e){return t(e={exports:{}},e.exports),e.exports}((function(t,e){window,t.exports=function(t){var e={};function n(i){if(e[i])return e[i].exports;var o=e[i]={i:i,l:!1,exports:{}};return t[i].call(o.exports,o,o.exports,n),o.l=!0,o.exports}return n.m=t,n.c=e,n.d=function(t,e,i){n.o(t,e)||Object.defineProperty(t,e,{enumerable:!0,get:i})},n.r=function(t){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(t,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(t,"__esModule",{value:!0})},n.t=function(t,e){if(1&e&&(t=n(t)),8&e)return t;if(4&e&&"object"==typeof t&&t&&t.__esModule)return t;var i=Object.create(null);if(n.r(i),Object.defineProperty(i,"default",{enumerable:!0,value:t}),2&e&&"string"!=typeof t)for(var o in t)n.d(i,o,function(e){return t[e]}.bind(null,o));return i},n.n=function(t){var e=t&&t.__esModule?function(){return t.default}:function(){return t};return n.d(e,"a",e),e},n.o=function(t,e){return Object.prototype.hasOwnProperty.call(t,e)},n.p="",n(n.s=2)}([function(t,e){var n;n=function(){return this}();try{n=n||new Function("return this")()}catch(t){"object"==typeof window&&(n=window)}t.exports=n},function(t,e,n){(function(t){function n(t,e){return function(t,e){return e.get?e.get.call(t):e.value}(t,o(t,e,"get"))}function i(t,e,n){return function(t,e,n){if(e.set)e.set.call(t,n);else{if(!e.writable)throw new TypeError("attempted to set read only private field");e.value=n}}(t,o(t,e,"set"),n),n}function o(t,e,n){if(!e.has(t))throw new TypeError("attempted to "+n+" private field on non-instance");return e.get(t)}var a=new WeakMap,r=new WeakMap,s=new WeakMap,l=function(){function e(t,o){var l=this;!function(t,e){if(!(t instanceof e))throw new TypeError("Cannot call a class as a function")}(this,e),a.set(this,{writable:!0,value:null}),r.set(this,{writable:!0,value:null}),s.set(this,{writable:!0,value:null}),i(this,r,o),i(this,s,{container:{mousedown:function(t){return i(l,a,t.pageX)},touchstart:function(t){return i(l,a,t.touches[0].clientX)},touchend:function(){return i(l,a,null)}},prev:{mousedown:function(e){e.preventDefault(),t.play(!0)},mouseup:function(e){e.preventDefault(),t.stop()},touchstart:function(e){e.preventDefault(),t.prev()}},next:{mousedown:function(e){e.preventDefault(),t.play()},mouseup:function(e){e.preventDefault(),t.stop()},touchstart:function(e){e.preventDefault(),t.next()}},global:{click:function(){t.click()},mouseup:function(){return i(l,a,null)},mousemove:function(e){n(l,a)&&Math.abs(n(l,a)-e.pageX)>n(l,r).dragTolerance&&(t.stop(),n(l,a)>e.pageX?t.prev():t.next(),i(l,a,e.pageX))},touchmove:function(e){n(l,a)&&Math.abs(n(l,a)-e.touches[0].clientX)>n(l,r).swipeTolerance&&(t.stop(),n(l,a)>e.touches[0].clientX?t.prev():t.next(),i(l,a,e.touches[0].clientX))},keydown:function(e){[37,39].includes(e.keyCode)&&t.play(37===e.keyCode)},keyup:function(e){[37,39].includes(e.keyCode)&&t.stop()}}}),this._initEvents()}var o;return(o=[{key:"destroy",value:function(){n(this,r).swipeTarget.removeEventListener("mousedown",n(this,s).container.mousedown),n(this,r).swipeTarget.removeEventListener("touchstart",n(this,s).container.touchstart),n(this,r).swipeTarget.removeEventListener("touchend",n(this,s).container.touchend),t.removeEventListener("mouseup",n(this,s).global.mouseup),t.removeEventListener("mousemove",n(this,s).global.mousemove),t.removeEventListener("touchmove",n(this,s).global.touchmove),t.removeEventListener("keydown",n(this,s).global.keydown),t.removeEventListener("keyup",n(this,s).global.keyup),n(this,r).prev&&(n(this,r).prev.removeEventListener("mousedown",n(this,s).prev.mousedown),n(this,r).prev.removeEventListener("mouseup",n(this,s).prev.mouseup),n(this,r).prev.removeEventListener("touchstart",n(this,s).prev.touchstart)),n(this,r).next&&(n(this,r).next.removeEventListener("mousedown",n(this,s).next.mousedown),n(this,r).next.removeEventListener("mouseup",n(this,s).next.mouseup),n(this,r).next.removeEventListener("touchstart",n(this,s).next.touchstart))}},{key:"_initEvents",value:function(){t.addEventListener("click",n(this,s).global.click),n(this,r).draggable&&(n(this,r).swipeTarget.addEventListener("mousedown",n(this,s).container.mousedown),t.addEventListener("mouseup",n(this,s).global.mouseup),t.addEventListener("mousemove",n(this,s).global.mousemove)),n(this,r).swipeable&&(n(this,r).swipeTarget.addEventListener("touchstart",n(this,s).container.touchstart),n(this,r).swipeTarget.addEventListener("touchend",n(this,s).container.touchend),t.addEventListener("touchmove",n(this,s).global.touchmove)),n(this,r).keys&&(t.addEventListener("keydown",n(this,s).global.keydown),t.addEventListener("keyup",n(this,s).global.keyup)),n(this,r).prev&&(n(this,r).prev.addEventListener("mousedown",n(this,s).prev.mousedown),n(this,r).prev.addEventListener("mouseup",n(this,s).prev.mouseup),n(this,r).prev.addEventListener("touchstart",n(this,s).prev.touchstart)),n(this,r).next&&(n(this,r).next.addEventListener("mousedown",n(this,s).next.mousedown),n(this,r).next.addEventListener("mouseup",n(this,s).next.mouseup),n(this,r).next.addEventListener("touchstart",n(this,s).next.touchstart))}}])&&function(t,e){for(var n=0;n<e.length;n++){var i=e[n];i.enumerable=i.enumerable||!1,i.configurable=!0,"value"in i&&(i.writable=!0),Object.defineProperty(t,i.key,i)}}(e.prototype,o),e}();e.a=l}).call(this,n(0))},function(t,e,n){n.r(e),function(t){var i=n(1);function o(t,e){var n=Object.keys(t);if(Object.getOwnPropertySymbols){var i=Object.getOwnPropertySymbols(t);e&&(i=i.filter((function(e){return Object.getOwnPropertyDescriptor(t,e).enumerable}))),n.push.apply(n,i)}return n}function a(t){for(var e=1;e<arguments.length;e++){var n=null!=arguments[e]?arguments[e]:{};e%2?o(Object(n),!0).forEach((function(e){r(t,e,n[e])})):Object.getOwnPropertyDescriptors?Object.defineProperties(t,Object.getOwnPropertyDescriptors(n)):o(Object(n)).forEach((function(e){Object.defineProperty(t,e,Object.getOwnPropertyDescriptor(n,e))}))}return t}function r(t,e,n){return e in t?Object.defineProperty(t,e,{value:n,enumerable:!0,configurable:!0,writable:!0}):t[e]=n,t}function s(t,e){return function(t,e){return e.get?e.get.call(t):e.value}(t,c(t,e,"get"))}function l(t,e,n){return function(t,e,n){if(e.set)e.set.call(t,n);else{if(!e.writable)throw new TypeError("attempted to set read only private field");e.value=n}}(t,c(t,e,"set"),n),n}function c(t,e,n){if(!e.has(t))throw new TypeError("attempted to "+n+" private field on non-instance");return e.get(t)}var u=new WeakMap,p=new WeakMap,d=new WeakMap,h=new WeakMap,f=new WeakMap,m=new WeakMap,v=function(){function e(t,n){!function(t,e){if(!(t instanceof e))throw new TypeError("Cannot call a class as a function")}(this,e),u.set(this,{writable:!0,value:null}),p.set(this,{writable:!0,value:0}),d.set(this,{writable:!0,value:null}),h.set(this,{writable:!0,value:!1}),f.set(this,{writable:!0,value:!1}),m.set(this,{writable:!0,value:null}),this.container=t,l(this,u,Object.assign({width:300,height:300,aspectRatio:0,count:0,perRow:0,speed:100,dragTolerance:10,swipeTolerance:10,draggable:!0,swipeable:!0,keys:!0,inverted:!1,containerName:"reactThreesixtyContainer"},n)),l(this,p,n.startIndex?n.startIndex:0),s(this,u).swipeTarget=s(this,u).swipeTarget||this.container,s(this,u).count=s(this,u).image.length,Object.freeze(s(this,u)),l(this,m,new i.a(this,s(this,u))),this._windowResizeListener=this._windowResizeListener.bind(this),this._initContainer()}var n,o;return n=e,(o=[{key:"isResponsive",get:function(){return s(this,u).aspectRatio>0}},{key:"containerWidth",get:function(){return this.isResponsive?this.container.clientWidth:s(this,u).width}},{key:"containerHeight",get:function(){return this.isResponsive?this.container.clientWidth*s(this,u).aspectRatio:s(this,u).height}},{key:"index",get:function(){return s(this,p)}},{key:"looping",get:function(){return s(this,h)}},{key:"prevIndex",get:function(){var t=s(this,u).inverted?s(this,p)+1:s(this,p)-1;return(s(this,u).count+t)%s(this,u).count}},{key:"next",value:function(){s(this,f)&&this.goto(s(this,u).inverted?s(this,p)-1:s(this,p)+1)}},{key:"prev",value:function(){s(this,f)&&this.goto(s(this,u).inverted?s(this,p)+1:s(this,p)-1)}},{key:"goto",value:function(t){var e=s(this,p),n=document.querySelector("#".concat(s(this,u).containerName," > .reactThreesixtyImage_").concat(e));n&&(n.style.visibility="hidden"),l(this,p,(s(this,u).count+t)%s(this,u).count),this._update()}},{key:"play",value:function(t){this.looping||(this._loop(t),l(this,h,!0))}},{key:"stop",value:function(){this.looping&&(t.clearTimeout(s(this,d)),l(this,h,!1))}},{key:"click",value:function(){var t=new CustomEvent("".concat(s(this,u).containerName,"_image_clicked"),{detail:{image_index:s(this,p)}});document.dispatchEvent(t)}},{key:"toggle",value:function(t){this.looping?this.stop():this.play(t)}},{key:"destroy",value:function(){this.stop(),s(this,m).destroy(),this.container.style.width="",this.container.style.height="",this.isResponsive&&window.removeEventListener("resize",this._windowResizeListener)}},{key:"_loop",value:function(e){var n=this;e?this.prev():this.next(),l(this,d,t.setTimeout((function(){n._loop(e)}),s(this,u).speed))}},{key:"_update",value:function(){var t=document.querySelector("#".concat(s(this,u).containerName," > .reactThreesixtyImage_").concat(s(this,p)));if(t){var e=new CustomEvent("".concat(s(this,u).containerName,"_image_changed"),{detail:{image_index:s(this,p)}});document.dispatchEvent(e),t.style.visibility="visible"}}},{key:"_stopScroll",value:function(){l(this,f,!1)}},{key:"_allowScroll",value:function(t){function e(){return t.apply(this,arguments)}return e.toString=function(){return t.toString()},e}((function(){l(this,f,!0)}))},{key:"_updateImage",value:function(t){l(this,u,a(a({},s(this,u)),{},{image:t})),this._initializeImage()}},{key:"_initializeImage",value:function(){var t=this;this.container.setAttribute("id","".concat(s(this,u).containerName)),this.container.setAttribute("class","".concat(s(this,u).containerName)),this.container.style.height="100%",this.container.style.width="100%";var e=this.container.querySelector(".extra_threesixty");this.container.innerHTML="",e&&(this.container.appendChild(e),"function"==typeof s(this,u).handleRenderExraElment&&s(this,u).handleRenderExraElment()),s(this,u).image.map((function(e,n){var i=document.createElement("img");i.setAttribute("style","visibility:".concat(n===s(t,p)?"visible":"hidden",";position:").concat(n?"absolute":"relative",";transform:").concat(s(t,u).isMobile?"initial":"translateX(-50%)",";max-width:100%;max-height:100%;left:").concat(s(t,u).isMobile?"0px":"50%",";width:").concat(s(t,u).isMobile?"100%":"auto",";height:").concat(s(t,u).isMobile?"auto":"100%",";top:0px;pointer-events: none;")),i.setAttribute("src","".concat(e)),i.setAttribute("class","reactThreesixtyImage_".concat(n)),t.container.appendChild(i)}))}},{key:"_windowResizeListener",value:function(){this.container.style.height=this.containerHeight+"px",this._update()}},{key:"_initContainer",value:function(){this.isResponsive||(this.container.style.width=this.containerWidth+"px"),this.container.style.height=this.containerHeight+"px",this.isResponsive&&window.addEventListener("resize",this._windowResizeListener),this._initializeImage()}}])&&function(t,e){for(var n=0;n<e.length;n++){var i=e[n];i.enumerable=i.enumerable||!1,i.configurable=!0,"value"in i&&(i.writable=!0),Object.defineProperty(t,i.key,i)}}(n.prototype,o),e}();e.default=v}.call(this,n(0))}]).default})),h=(p=d)&&p.__esModule&&Object.prototype.hasOwnProperty.call(p,"default")?p.default:p;d.ThreeSixty;var f=function(t,e){var n=arguments.length>2&&void 0!==arguments[2]?arguments[2]:{x:.5,y:.5},i=e>180?e-360:e,o=function(t){switch(t){case"front":return 0;case"left":return 90;case"right":return-90;case"back":return 180;default:return 0}},r=function(t){return 45},s=function(t,e){switch(t){case"front":return{x:n.x,y:n.y-e};case"left":return{x:n.x-e,y:n.y};case"right":return{x:n.x+e,y:n.y};case"back":return{x:n.x,y:e+n.y};case"upper":default:return{x:n.x,y:n.y-e}}},l=function(t,e,n,i,o){var a=Math.PI/180*o,r=Math.cos(a),s=Math.sin(a),l=r*(i-e)-s*(n-t)+e;return{x:Number((r*(n-t)+s*(i-e)+t).toFixed(5)),y:Number(l.toFixed(5))}},c=function(t,e,i){var o=l(n.x,n.y,t,e,i);return{x:o.x,y:o.y}};return t.map((function(t){var n,l,u;n=o(t.position)-r(t.position),l=o(t.position)+r(t.position),u=e>180&&"back"===t.position?e>n&&e<l:i>n&&i<l;var p=s(t.position,t.radius),d=c(p.x,p.y,-(i+t.dentAngle));return a(a({},t),{},{left:d.x,display:u||"upper"===t.position})}))},m=function(t,e){return a({position:"absolute",zIndex:1,top:"".concat(100*t.top,"%"),left:"".concat(100*t.left,"%"),display:t.display?"block":"none",transform:"translate(-50%, -50%)"},Object.assign({},e?{}:{content:"",width:"20px",height:"20px",borderRadius:"50%",backgroundColor:"blue"}))},v=function(t){var e=t.hotspots,n=t.clickHandler,o=t.renderUI;return e.map((function(t,e){return i.default.createElement("div",{key:e,style:m(t,!!o),onClick:function(){return n&&n(t)}},o?o(t):i.default.createElement(i.default.Fragment,null))}))},y=function(t,e){return(y=Object.setPrototypeOf||{__proto__:[]}instanceof Array&&function(t,e){t.__proto__=e}||function(t,e){for(var n in e)e.hasOwnProperty(n)&&(t[n]=e[n])})(t,e)};function g(t,e){function n(){this.constructor=t}y(t,e),t.prototype=null===e?Object.create(e):(n.prototype=e.prototype,new n)}var b=function(){return(b=Object.assign||function(t){for(var e,n=1,i=arguments.length;n<i;n++)for(var o in e=arguments[n])Object.prototype.hasOwnProperty.call(e,o)&&(t[o]=e[o]);return t}).apply(this,arguments)};var w={wrapperComponent:null,contentComponent:null,previousScale:1,scale:1,positionX:0,positionY:0,options:{disabled:!1,transformEnabled:!0,minPositionX:null,maxPositionX:null,minPositionY:null,maxPositionY:null,minScale:1,maxScale:8,limitToBounds:!0,limitToWrapper:!1,centerContent:!0,wrapperClass:"",contentClass:""},wheel:{disabled:!1,step:5,wheelEnabled:!0,touchPadEnabled:!0,limitsOnWheel:!1},pan:{disabled:!1,panAnimationType:"linear",lockAxisX:!1,lockAxisY:!1,velocity:!0,velocityEqualToMove:!0,velocitySensitivity:2,velocityActiveScale:1,velocityMinSpeed:1,velocityBaseTime:1600,velocityAnimationType:"easeOutQuart",padding:!0,paddingSize:30,panReturnAnimationTime:400,panReturnAnimationType:"easeOut",disableOnTarget:[]},pinch:{disabled:!1},zoomIn:{disabled:!1,step:20,animation:!0,animationType:"easeOut",animationTime:200},zoomOut:{disabled:!1,step:20,animation:!0,animationType:"easeOut",animationTime:200},doubleClick:{disabled:!1,step:20,mode:"zoomIn",animation:!0,animationType:"easeOut",animationTime:200},reset:{disabled:!1,animation:!0,animationType:"easeOut",animationTime:200},scalePadding:{disabled:!1,size:.2,animationTime:200,animationType:"easeOut"}},P=function(t,e){return Number(t.toFixed(e))},S=function(t,e){return"number"==typeof t?t:e},x=function(t,e,n,i){return P(i?t<e?e:t>n?n:t:t,2)},T=function(t,e){return Math.sqrt(Math.pow(t.pageX-e.pageX,2)+Math.pow(t.pageY-e.pageY,2))},C=function(t){var e=b({},t);return Object.keys(e).forEach((function(t){return void 0===e[t]&&delete e[t]})),e},E=function(t,e){t&&"function"==typeof t&&t(e)},k=function(t,e,n){var i=n.scale,o=n.options,a=o.maxScale,r=o.minScale;return!!t&&(i<a||i>r||(Math.sign(t.deltaY)!==Math.sign(e.deltaY)||(t.deltaY>0&&t.deltaY<e.deltaY||(t.deltaY<0&&t.deltaY>e.deltaY||Math.sign(t.deltaY)!==Math.sign(e.deltaY)))))},O=function(t,e){return Object.keys(t).reduce((function(n,i){return"object"==typeof e[i]&&null!==e[i]?n[i]=b(b({},t[i]),e[i]):n[i]=void 0===e[i]?t[i]:e[i],n}),{})};var Y={easeOut:function(t){return-Math.cos(t*Math.PI)/2+.5},linear:function(t){return t},easeInQuad:function(t){return t*t},easeOutQuad:function(t){return t*(2-t)},easeInOutQuad:function(t){return t<.5?2*t*t:(4-2*t)*t-1},easeInCubic:function(t){return t*t*t},easeOutCubic:function(t){return--t*t*t+1},easeInOutCubic:function(t){return t<.5?4*t*t*t:(t-1)*(2*t-2)*(2*t-2)+1},easeInQuart:function(t){return t*t*t*t},easeOutQuart:function(t){return 1- --t*t*t*t},easeInOutQuart:function(t){return t<.5?8*t*t*t*t:1-8*--t*t*t*t},easeInQuint:function(t){return t*t*t*t*t},easeOutQuint:function(t){return 1+--t*t*t*t*t},easeInOutQuint:function(t){return t<.5?16*t*t*t*t*t:1+16*--t*t*t*t*t}};function X(){this.mounted&&(this.animation&&cancelAnimationFrame(this.animation),this.animate=!1,this.animation=!1,this.velocity=!1)}function W(t,e,n){var i=this;if(this.mounted){var o=(new Date).getTime();X.call(this),this.animation=function(){if(i.animation&&i.mounted){var a=(new Date).getTime()-o,r=(0,Y[t])(a/e);a>=e?(n(1),i.animation=null):(n(r),requestAnimationFrame(i.animation))}},requestAnimationFrame(this.animation)}}function _(t){var e=this,n=t.targetState,i=t.speed,o=t.type,a=this.stateProvider,r=a.scale,s=a.positionX,l=a.positionY,c=n.scale-r,u=n.positionX-s,p=n.positionY-l;0===i?(this.stateProvider.previousScale=this.stateProvider.scale,this.stateProvider.scale=n.scale,this.stateProvider.positionX=n.positionX,this.stateProvider.positionY=n.positionY,this.applyTransformation()):W.call(this,o,i,(function(t){e.stateProvider.previousScale=e.stateProvider.scale,e.stateProvider.scale=r+c*t,e.stateProvider.positionX=s+u*t,e.stateProvider.positionY=l+p*t,e.applyTransformation()}))}function z(t,e,n,i,o){var a=e-(o?i:0);return!isNaN(n)&&t>=n?n:!isNaN(e)&&t<=a?a:t}function I(t,e,n,i,o,a){var r=n.minPositionX,s=n.minPositionY,l=n.maxPositionX,c=n.maxPositionY,u=a?o*a.offsetWidth/100:0,p=a?o*a.offsetHeight/100:0;return{x:x(t,r-u,l+u,i),y:x(e,s-p,c+p,i)}}function M(t,e,n){var i=e.getBoundingClientRect(),o=(t.clientX-i.left)/n,a=(t.clientY-i.top)/n;return(isNaN(o)||isNaN(a))&&console.error("No mouse or touch offset found"),{mouseX:o,mouseY:a}}function D(t,e,n,i,o){var a=this.stateProvider,r=a.scale,s=a.positionX,l=a.positionY,c=a.options.transformEnabled,u=n-r;return"number"!=typeof t||"number"!=typeof e?console.error("Mouse X and Y position were not provided!"):c?I(s-t*u,l-e*u,i,o,0,null):{newPositionX:s,newPositionY:l}}function j(t){var e=t.touches;return e&&1===e.length?{clientX:e[0].clientX,clientY:e[0].clientY}:e?null:{clientX:t.clientX,clientY:t.clientY}}function L(t){var e=this.stateProvider,n=e.scale,i=e.positionX,o=e.positionY,a=e.options,r=a.limitToBounds,s=a.minScale,l=e.pan,c=l.lockAxisX,u=l.lockAxisY,p=l.padding,d=l.paddingSize,h=e.wrapperComponent;if(this.startCoords){var f=this.startCoords,m=f.x,v=f.y,y=j(t);if(!y)return console.error("Cannot find mouse client positions");var g=y.clientX,b=y.clientY,w=c?i:g-m,P=u?o:b-v,S=p&&n>=s?d:0;if(w!==i||P!==o){var x=I(w,P,this.bounds,r,S,h);R.call(this,x.x,x.y)}}}function N(){var t=this.stateProvider,e=t.scale,n=t.options.minScale,i=t.pan,o=i.disabled,a=i.padding,r=i.panReturnAnimationTime,s=i.panReturnAnimationType;if(!(o||e<n||!a)){var l=A.call(this);_.call(this,{targetState:l,speed:r,type:s})}}function A(){var t=this.stateProvider,e=t.positionX,n=t.positionY,i=t.scale,o=t.options,a=o.disabled,r=o.limitToBounds,s=o.limitToWrapper,l=this.state.wrapperComponent;if(!a){var c=this.bounds,u=c.maxPositionX,p=c.minPositionX,d=c.maxPositionY,h=c.minPositionY,f=e>u||e<p,m=n>d||n<h,v=e>u?l.offsetWidth:this.stateProvider.minPositionX||0,y=n>d?l.offsetHeight:this.stateProvider.minPositionY||0,g=D.call(this,v,y,i,this.bounds,r||s),b=g.x,w=g.y;return{scale:i,positionX:f?b:e,positionY:m?w:n}}}function R(t,e){this.stateProvider.pan.padding&&(this.stateProvider.positionX=t,this.stateProvider.positionY=e,this.applyTransformation())}function B(t,e,n,i,o){var a=this.stateProvider,r=a.scale,s=a.options,l=s.maxScale,c=s.minScale,u=a.scalePadding,p=u.size,d=u.disabled,h=a.wrapperComponent,f=null;if(o){f=r+(e-e*(1e-4*window.innerWidth))*t*(r/(t<0?30:20))}else{var m=2-window.innerWidth/h.offsetWidth;f=r+e*t*((r-r*Math.max(.2,Math.min(.99,m)))/20)}if(i)return f;var v=!n&&!d;return z(P(f,3),c,l,p,v)}function H(t,e){var n=this.stateProvider,i=function(t,e,n){var i=t.offsetWidth,o=t.offsetHeight,a=e.offsetWidth*n,r=e.offsetHeight*n;return{wrapperWidth:i,wrapperHeight:o,newContentWidth:a,newDiffWidth:i-a,newContentHeight:r,newDiffHeight:o-r}}(n.wrapperComponent,n.contentComponent,t),o=i.wrapperWidth,a=i.wrapperHeight,r=function(t,e,n,i,o,a,r){var s=t>e?n*(r?1:.5):0,l=i>o?a*(r?1:.5):0;return{minPositionX:t-e-s,maxPositionX:s,minPositionY:i-o-l,maxPositionY:l}}(o,i.newContentWidth,i.newDiffWidth,a,i.newContentHeight,i.newDiffHeight,e);return this.bounds=r,r}function Z(t){var e=this.stateProvider,n=e.scale,i=e.contentComponent,o=e.options.limitToBounds,a=e.scalePadding,r=a.size,s=a.disabled,l=e.wheel,c=l.step,u=l.limitsOnWheel;t.preventDefault(),t.stopPropagation();var p=function(t,e){var n=t?t.deltaY<0?1:-1:0;return S(e,n)}(t,null),d=B.call(this,p,c,!t.ctrlKey);if(n!==d){var h=H.call(this,d,!u),f=M(t,i,n),m=f.mouseX,v=f.mouseY,y=o&&(s||0===r||u),g=D.call(this,m,v,d,h,y),b=g.x,w=g.y;this.bounds=h,this.stateProvider.previousScale=n,this.stateProvider.scale=d,this.stateProvider.positionX=b,this.stateProvider.positionY=w,this.applyTransformation()}}function U(t,e,n,i,o){var a=this.stateProvider,r=a.contentComponent,s=a.options,l=s.disabled,c=s.minScale,u=s.maxScale,p=s.limitToBounds,d=s.limitToWrapper;if(!l&&!t){var h=z(P(e,2),c,u,null,null),f=H.call(this,h,d),m=n,v=i;if(o){var y=M(o,r,e);m=y.mouseX,v=y.mouseY}var g=D.call(this,m,v,h,f,p);return{scale:h,positionX:g.x,positionY:g.y}}}function q(){var t=this.stateProvider,e=t.scale,n=t.wrapperComponent,i=t.options,o=i.minScale,a=i.limitToBounds,r=t.scalePadding,s=r.disabled,l=r.animationTime,c=r.animationType,u=s||e>=o;if((e>=1||a)&&N.call(this),!u){var p=n.offsetWidth/2,d=n.offsetHeight/2,h=U.call(this,!1,o,p,d,null);_.call(this,{targetState:h,speed:l,type:c})}}function V(t){t.preventDefault(),t.stopPropagation();var e=this.stateProvider,n=e.contentComponent,i=e.scale,o=e.doubleClick,a=o.disabled,r=o.mode,s=o.step,l=o.animationTime,c=o.animationType;if("reset"===r)return Q.call(this,t,l);var u="zoomOut"===r?-1:1,p=B.call(this,u,s,void 0,void 0,!0),d=M(t,n,i),h=d.mouseX,f=d.mouseY,m=U.call(this,a,p,h,f);if(m.scale!==i){var v=K(B.call(this,u,s,!0,void 0,!0),p,l);_.call(this,{targetState:m,speed:v,type:c})}}function F(t,e){var n=this.stateProvider,i=n.scale,o=n.positionX,a=n.positionY,r=n.wrapperComponent,s=n.zoomIn,l=n.zoomOut,c=(r.offsetWidth/2-o)/i,u=(r.offsetHeight/2-a)/i,p=B.call(this,t,e,void 0,void 0,!0),d=p>i,h=d?s.animationTime:l.animationTime,f=d?s.animationType:l.animationType,m=d?s.disabled:l.disabled,v=U.call(this,m,p,c,u);if(v.scale!==i){var y=K(B.call(this,t,e,!0,void 0,!0),p,h);_.call(this,{targetState:v,speed:y,type:f})}}function Q(t){var e=this.props.defaultValues,n=e.defaultScale,i=e.defaultPositionX,o=e.defaultPositionY,a=this.stateProvider,r=a.scale,s=a.positionX,l=a.positionY,c=a.reset,u=a.options,p=u.disabled,d=u.limitToBounds,h=u.centerContent,f=u.limitToWrapper;if(!(p||c.disabled||r===n&&s===i&&l===o)){var m="number"==typeof t?t:c.animationTime,v=S(n,w.scale),y=S(i,w.positionX),g=S(o,w.positionY);if(d&&!f||h){var b=H.call(this,v,f);y=b.minPositionX,g=b.minPositionY}var P={scale:v,positionX:y,positionY:g};_.call(this,{targetState:P,speed:m,type:c.animationType})}}function K(t,e,n){return n*(e/t)}function J(t,e){var n=Math.pow(10,e);return Math.round(t*n)/n}function $(t){return t===1/0||t===-1/0}function G(t,e){var n=this.stateProvider,i=n.options,o=i.minScale,a=i.maxScale,r=n.scalePadding,s=r.size,l=r.disabled;if("number"!=typeof e||"number"!=typeof t)return console.error("Pinch touches distance was not provided");if(!(t<0)){var c=t/e*this.pinchStartScale;return z(P(c,2),o,a,s,!l)}}function tt(t){var e=this.stateProvider,n=e.scale,i=e.options,o=i.limitToBounds,a=i.limitToWrapper,r=e.scalePadding,s=r.disabled,l=r.size,c=e.wheel.limitsOnWheel,u=e.pinch,p=this.state.contentComponent;if(!u.disabled&&!this.stateProvider.options.disabled&&(t.cancelable&&(t.preventDefault(),t.stopPropagation()),null!==this.pinchStartDistance)){var d=function(t,e,n){var i=n.getBoundingClientRect(),o=t.touches,a=J(o[0].clientX-i.left,5),r=J(o[0].clientY-i.top,5);return{mouseX:(a+J(o[1].clientX-i.left,5))/2/e,mouseY:(r+J(o[1].clientY-i.top,5))/2/e}}(t,n,p),h=d.mouseX,f=d.mouseY;if(!$(h)&&!$(f)){var m=function(t){return T(t.touches[0],t.touches[1])}(t),v=G.call(this,m,this.pinchStartDistance);if(!$(v)&&v!==n){var y=H.call(this,v,a),g=o&&(s||0===l||c),b=D.call(this,h,f,v,y,g),w=b.x,P=b.y;this.lastDistance=m,this.stateProvider.positionX=w,this.stateProvider.positionY=P,this.stateProvider.scale=v,this.stateProvider.previousScale=n,this.applyTransformation()}}}}function et(t,e){return this.stateProvider.pan.velocityEqualToMove?e-e/Math.max(1,t):e}function nt(){this.setState({startAnimation:!1})}function it(){this.setState({startAnimation:!0})}function ot(){var t=this,e=this.stateProvider,n=e.positionX,i=e.positionY,o=e.options.limitToBounds,a=e.pan,r=a.velocityBaseTime,s=a.lockAxisX,l=a.lockAxisY,c=a.velocityAnimationType,u=a.panReturnAnimationTime,p=a.panReturnAnimationType,d=a.padding,h=a.paddingSize,f=e.wrapperComponent;if(this.mounted){if(!this.velocity||!this.bounds)return X.call(this);var m=this.bounds,v=m.maxPositionX,y=m.minPositionX,g=m.maxPositionY,b=m.minPositionY,w=this.velocity,P=w.velocityX,S=w.velocityY,x=w.velocity,T=et.call(this,x,r);if(T){var C=P,E=S,k=T>u?T:u,O=d?h:0,_=f?O*f.offsetWidth/100:0,z=f?O*f.offsetHeight/100:0,M=v+_,D=y-_,j=g+z,L=b-z,A=I(n,i,this.bounds,o,O,f),R=(new Date).getTime();W.call(this,c,k,(function(e){var a=(new Date).getTime()-R,r=(0,Y[p])(a/u);(a>u||r>1||r===1/0||r===-1/0)&&(r=1);var c=rt(s,C,e,r,y,v,o,n,A.x,D,M),d=rt(l,E,e,r,b,g,o,i,A.y,L,j);n===c&&i===d||(t.stateProvider.positionX=c,t.stateProvider.positionY=d,t.applyTransformation())}))}else N.call(this)}}function at(t){var e=this,n=this.stateProvider,i=n.scale,o=n.options.disabled,a=n.pan,r=a.velocity,s=a.velocitySensitivity,l=a.velocityActiveScale,c=a.velocityMinSpeed,u=n.wrapperComponent;if(!(!r||l>=i||o)){nt.call(this);var p=Date.now();if(this.lastMousePosition){var d=j(t);if(!d)return console.error("No mouse or touch position detected");var h=d.clientX,f=d.clientY,m=h-this.lastMousePosition.clientX,v=f-this.lastMousePosition.clientY,y=p-this.velocityTime,g=2-u.offsetWidth/window.innerWidth,b=2-u.offsetHeight/window.innerHeight,w=m/y*s*i*(20*Math.max(c,Math.min(2,g))),P=v/y*s*i*(20*Math.max(c,Math.min(2,b))),S=m*m+v*v,x=Math.sqrt(S)/y*s;if(this.velocity&&x<this.velocity.velocity&&this.throttle)return;this.velocity={velocityX:w,velocityY:P,velocity:x},this.throttle&&clearTimeout(this.throttle),this.throttle=setTimeout((function(){e.mounted&&(e.throttle=!1)}),30)}var T=j(t);this.lastMousePosition=T,this.velocityTime=p}}function rt(t,e,n,i,o,a,r,s,l,c,u){if(r){var p;if(l>o&&s>a)return(p=l-(l-a)*i)>u?u:p<a?a:p;if(l<o&&s<o)return(p=l-(l-o)*i)<c?c:p>o?o:p}return t?l:x(s+e*n,o,a,r)}var st=["previousScale","scale","positionX","positionY","defaultPositionX","defaultPositionY","defaultScale","onWheelStart","onWheel","onWheelStop","onPanningStart","onPanning","onPanningStop","onPinchingStart","onPinching","onPinchingStop","onZoomChange","options","wheel","scalePadding","pan","pinch","zoomIn","zoomOut","doubleClick","reset"],lt=function(t){return Object.keys(t).reduce((function(e,n){return st.includes(n)&&(e[n]=t[n]),e}),{})},ct=i.default.createContext({}),ut=null,pt=null,dt=function(t){function e(){var e=null!==t&&t.apply(this,arguments)||this;return e.mounted=!0,e.state={wrapperComponent:void 0,contentComponent:void 0},e.stateProvider=b(b(b(b({},w),O(w,e.props.dynamicValues)),e.props.defaultValues),{previousScale:e.props.dynamicValues.scale||e.props.defaultValues.scale||w.scale}),e.windowToWrapperScaleX=0,e.windowToWrapperScaleY=0,e.startCoords=null,e.isDown=!1,e.pinchStartDistance=null,e.lastDistance=null,e.pinchStartScale=null,e.distance=null,e.bounds=null,e.velocityTime=null,e.lastMousePosition=null,e.velocity=null,e.offsetX=null,e.offsetY=null,e.throttle=!1,e.previousWheelEvent=null,e.lastScale=null,e.animate=null,e.animation=null,e.maxBounds=null,e.handleWheel=function(t){var n=e.stateProvider,i=n.scale,o=n.wheel,a=o.disabled,r=o.wheelEnabled,s=o.touchPadEnabled,l=e.props,c=l.onWheelStart,u=l.onWheel,p=l.onWheelStop,d=e.state,h=d.wrapperComponent,f=d.contentComponent;e.isDown||a||e.stateProvider.options.disabled||!h||!f||(r||t.ctrlKey)&&(!s&&t.ctrlKey||(ut||(e.lastScale=i,X.call(e),E(c,e.getCallbackProps())),Z.call(e,t),E(u,e.getCallbackProps()),e.applyTransformation(null,null,null),e.previousWheelEvent=t,k(e.previousWheelEvent,t,e.stateProvider)&&(clearTimeout(ut),ut=setTimeout((function(){e.mounted&&(E(p,e.getCallbackProps()),ut=null)}),180)),e.animate=!1,e.lastScale=e.stateProvider.scale,clearTimeout(pt),pt=setTimeout((function(){e.mounted&&q.call(e,t)}),100)))},e.checkPanningTarget=function(t){var n=e.stateProvider.pan.disableOnTarget;return n.map((function(t){return t.toUpperCase()})).includes(t.target.tagName)||n.find((function(e){return t.target.classList.value.includes(e)}))},e.checkIsPanningActive=function(t){var n=e.stateProvider.pan.disabled,i=e.state,o=i.wrapperComponent,a=i.contentComponent;return!e.isDown||n||e.stateProvider.options.disabled||t.touches&&(1!==t.touches.length||Math.abs(e.startCoords.x-t.touches[0].clientX)<1||Math.abs(e.startCoords.y-t.touches[0].clientY)<1)||!o||!a},e.handleSetUpPanning=function(t,n){var i=e.stateProvider,o=i.positionX,a=i.positionY;e.isDown=!0,e.startCoords={x:t-o,y:n-a},E(e.props.onPanningStart,e.getCallbackProps())},e.handleStartPanning=function(t){var n=e.stateProvider,i=n.wrapperComponent,o=n.scale,a=n.options,r=a.minScale,s=a.maxScale,l=a.limitToWrapper,c=n.pan.disabled,u=t.target,p=t.touches;c||e.stateProvider.options.disabled||i&&!i.contains(u)||e.checkPanningTarget(t)||o<r||o>s||(X.call(e),e.bounds=H.call(e,o,l),p&&1===p.length&&e.handleSetUpPanning(p[0].clientX,p[0].clientY),p||e.handleSetUpPanning(t.clientX,t.clientY))},e.handlePanning=function(t){e.isDown&&t.preventDefault(),e.checkIsPanningActive(t)||(t.stopPropagation(),at.call(e,t),L.call(e,t),E(e.props.onPanning,e.getCallbackProps()))},e.handleStopPanning=function(){if(e.isDown){e.isDown=!1,e.animate=!1,e.animation=!1,it.call(e),E(e.props.onPanningStop,e.getCallbackProps());var t=e.stateProvider,n=t.pan.velocity,i=t.scale;e.velocity&&n&&i>1?ot.call(e):N.call(e)}},e.handlePinchStart=function(t){var n=e.stateProvider.scale;t.preventDefault(),t.stopPropagation(),X.call(e);var i=T(t.touches[0],t.touches[1]);e.pinchStartDistance=i,e.lastDistance=i,e.pinchStartScale=n,e.isDown=!1,E(e.props.onPinchingStart,e.getCallbackProps())},e.handlePinch=function(t){e.isDown=!1,tt.call(e,t),E(e.props.onPinching,e.getCallbackProps())},e.handlePinchStop=function(){"number"==typeof e.pinchStartScale&&(e.isDown=!1,e.velocity=null,e.lastDistance=null,e.pinchStartScale=null,e.pinchStartDistance=null,q.call(e),E(e.props.onPinchingStop,e.getCallbackProps()))},e.handleTouchStart=function(t){var n=e.stateProvider,i=n.wrapperComponent,o=n.contentComponent,a=n.scale,r=n.options,s=r.disabled,l=r.minScale,c=t.touches;if(!s&&i&&o&&!(a<l))return X.call(e),c&&1===c.length?e.handleStartPanning(t):c&&2===c.length?e.handlePinchStart(t):void 0},e.handleTouch=function(t){var n=e.stateProvider,i=n.pan,o=n.pinch;if(!n.options.disabled)return i.disabled||1!==t.touches.length?o.disabled||2!==t.touches.length?void 0:e.handlePinch(t):e.handlePanning(t)},e.handleTouchStop=function(){e.handleStopPanning(),e.handlePinchStop()},e.zoomIn=function(t){var n=e.stateProvider,i=n.zoomIn,o=i.disabled,a=i.step,r=n.options,s=e.state,l=s.wrapperComponent,c=s.contentComponent;if(!t)throw Error("Zoom in function requires event prop");!o&&!r.disabled&&l&&c&&F.call(e,1,a)},e.zoomOut=function(t){var n=e.stateProvider,i=n.zoomOut,o=i.disabled,a=i.step,r=n.options,s=e.state,l=s.wrapperComponent,c=s.contentComponent;if(!t)throw Error("Zoom out function requires event prop");!o&&!r.disabled&&l&&c&&F.call(e,-1,a)},e.handleDbClick=function(t){var n=e.stateProvider,i=n.options,o=n.doubleClick,a=o.disabled,r=o.step,s=e.state,l=s.wrapperComponent,c=s.contentComponent;if(!t)throw Error("Double click function requires event prop");!a&&!i.disabled&&l&&c&&V.call(e,t,1,r)},e.setScale=function(t,n,i){void 0===n&&(n=200),void 0===i&&(i="easeOut");var o=e.stateProvider,a=o.positionX,r=o.positionY,s=o.scale,l=o.options.disabled,c=e.state,u=c.wrapperComponent,p=c.contentComponent;if(!l&&u&&p){var d={positionX:a,positionY:r,scale:isNaN(t)?s:t};_.call(e,{targetState:d,speed:n,type:i})}},e.setPositionX=function(t,n,i){void 0===n&&(n=200),void 0===i&&(i="easeOut");var o=e.stateProvider,a=o.positionX,r=o.positionY,s=o.scale,l=o.options,c=l.disabled,u=l.transformEnabled,p=e.state,d=p.wrapperComponent,h=p.contentComponent;if(!c&&u&&d&&h){var f={positionX:isNaN(t)?a:t,positionY:r,scale:s};_.call(e,{targetState:f,speed:n,type:i})}},e.setPositionY=function(t,n,i){void 0===n&&(n=200),void 0===i&&(i="easeOut");var o=e.stateProvider,a=o.positionX,r=o.scale,s=o.positionY,l=o.options,c=l.disabled,u=l.transformEnabled,p=e.state,d=p.wrapperComponent,h=p.contentComponent;if(!c&&u&&d&&h){var f={positionX:a,positionY:isNaN(t)?s:t,scale:r};_.call(e,{targetState:f,speed:n,type:i})}},e.setTransform=function(t,n,i,o,a){void 0===o&&(o=200),void 0===a&&(a="easeOut");var r=e.stateProvider,s=r.positionX,l=r.positionY,c=r.scale,u=r.options,p=u.disabled,d=u.transformEnabled,h=e.state,f=h.wrapperComponent,m=h.contentComponent;if(!p&&d&&f&&m){var v={positionX:isNaN(t)?s:t,positionY:isNaN(n)?l:n,scale:isNaN(i)?c:i};_.call(e,{targetState:v,speed:o,type:a})}},e.resetTransform=function(){var t=e.stateProvider.options,n=t.disabled,i=t.transformEnabled;!n&&i&&Q.call(e)},e.setDefaultState=function(){e.animation=null,e.stateProvider=b(b(b({},e.stateProvider),{scale:w.scale,positionX:w.positionX,positionY:w.positionY}),e.props.defaultValues),e.forceUpdate()},e.setWrapperComponent=function(t){e.setState({wrapperComponent:t})},e.setContentComponent=function(t){e.setState({contentComponent:t},(function(){var n=e.stateProvider,i=n.wrapperComponent,o=n.options,a=o.centerContent,r=o.limitToBounds,s=o.limitToWrapper,l=n.scale,c=e.props.defaultValues,u=c.positionX,p=c.positionY;if(r&&!s||a&&!u&&!p){var d="translate(25%, 25%) scale("+l+")";t.style.transform=d,t.style.WebkitTransform=d,e.forceUpdate();var h=(new Date).getTime(),f=setInterval((function(){if(i.offsetWidth){var t=H.call(e,l,!1);e.stateProvider.positionX=t.minPositionX,e.stateProvider.positionY=t.minPositionY,e.applyTransformation(null,null,null),clearInterval(f),f=null}else(new Date).getTime()-h>2e3&&(clearInterval(f),f=null)}),20)}else e.applyTransformation(null,null,null)}))},e.applyTransformation=function(t,n,i){if(e.mounted){var o=e.state.contentComponent,a=e.props.onZoomChange,r=e.stateProvider,s=r.previousScale,l=r.scale,c=r.positionX,u=r.positionY;if(!o)return console.error("There is no content component");var p="translate("+(n||c)+"px, "+(i||u)+"px) scale("+(t||l)+")";o.style.transform=p,o.style.WebkitTransform=p,e.forceUpdate(),a&&s!==l&&E(a,e.getCallbackProps())}},e.getCallbackProps=function(){return lt(e.stateProvider)},e}return g(e,t),e.prototype.componentDidMount=function(){window.addEventListener("mousedown",this.handleStartPanning,!1),window.addEventListener("mousemove",this.handlePanning,!1),window.addEventListener("mouseup",this.handleStopPanning,!1)},e.prototype.componentWillUnmount=function(){window.removeEventListener("mousedown",this.handleStartPanning,!1),window.removeEventListener("mousemove",this.handlePanning,!1),window.removeEventListener("mouseup",this.handleStopPanning,!1),X.call(this)},e.prototype.componentDidUpdate=function(t,e){var n,i=this.state,o=i.wrapperComponent,a=i.contentComponent,r=this.props.dynamicValues;if(!e.contentComponent&&a&&(this.stateProvider.contentComponent=a),!e.wrapperComponent&&o&&void 0!==o){this.stateProvider.wrapperComponent=o,this.windowToWrapperScaleX=(n=o)?window.innerWidth/n.offsetWidth:0,this.windowToWrapperScaleY=function(t){return t?window.innerHeight/t.offsetHeight:0}(o);o.addEventListener("wheel",this.handleWheel,!1),o.addEventListener("dblclick",this.handleDbClick,!1),o.addEventListener("touchstart",this.handleTouchStart,!1),o.addEventListener("touchmove",this.handleTouch,!1),o.addEventListener("touchend",this.handleTouchStop,!1)}(o&&a||t.dynamicValues!==r)&&(this.maxBounds=H.call(this,this.stateProvider.scale,this.stateProvider.options.limitToWrapper)),t.dynamicValues&&t.dynamicValues!==r&&(this.animation=null,this.stateProvider=b(b({},this.stateProvider),O(this.stateProvider,r)),this.applyTransformation(null,null,null))},e.prototype.render=function(){var t=this.state,e=t.wrapperComponent,n=t.contentComponent,o={loaded:Boolean(e&&n),state:this.getCallbackProps(),dispatch:{setScale:this.setScale,setPositionX:this.setPositionX,setPositionY:this.setPositionY,zoomIn:this.zoomIn,zoomOut:this.zoomOut,setTransform:this.setTransform,resetTransform:this.resetTransform,setDefaultState:this.setDefaultState},nodes:{setWrapperComponent:this.setWrapperComponent,setContentComponent:this.setContentComponent}},a=this.props.children,r="function"==typeof a?a(b(b({},o.state),o.dispatch)):a;return i.default.createElement(ct.Provider,{value:o},r)},e}(e.Component),ht=function(t){var e=t.children,n=t.defaultPositionX,o=t.defaultPositionY,a=t.defaultScale,r=t.onWheelStart,s=t.onWheel,l=t.onWheelStop,c=t.onPanningStart,u=t.onPanning,p=t.onPanningStop,d=t.onPinchingStart,h=t.onPinching,f=t.onPinchingStop,m=t.onZoomChange,v=function(t,e){var n={};for(var i in t)Object.prototype.hasOwnProperty.call(t,i)&&e.indexOf(i)<0&&(n[i]=t[i]);if(null!=t&&"function"==typeof Object.getOwnPropertySymbols){var o=0;for(i=Object.getOwnPropertySymbols(t);o<i.length;o++)e.indexOf(i[o])<0&&Object.prototype.propertyIsEnumerable.call(t,i[o])&&(n[i[o]]=t[i[o]])}return n}(t,["children","defaultPositionX","defaultPositionY","defaultScale","onWheelStart","onWheel","onWheelStop","onPanningStart","onPanning","onPanningStop","onPinchingStart","onPinching","onPinchingStop","onZoomChange"]),y=b({},v);return y.options&&y.options.limitToWrapper&&(y.options.limitToBounds=!0),i.default.createElement(dt,{defaultValues:C({positionX:n,positionY:o,scale:a}),dynamicValues:C(lt(y)),onWheelStart:r,onWheel:s,onWheelStop:l,onPanningStart:c,onPanning:u,onPanningStop:p,onPinchingStart:d,onPinching:h,onPinchingStop:f,onZoomChange:m},e)};var ft="TransformComponent-module_container__3NwNd",mt="TransformComponent-module_content__TZU5O";!function(t,e){void 0===e&&(e={});var n=e.insertAt;if(t&&"undefined"!=typeof document){var i=document.head||document.getElementsByTagName("head")[0],o=document.createElement("style");o.type="text/css","top"===n&&i.firstChild?i.insertBefore(o,i.firstChild):i.appendChild(o),o.styleSheet?o.styleSheet.cssText=t:o.appendChild(document.createTextNode(t))}}(".TransformComponent-module_container__3NwNd {\n position: relative;\n width: fit-content;\n height: fit-content;\n overflow: hidden;\n -webkit-touch-callout: none; /* iOS Safari */\n -webkit-user-select: none; /* Safari */\n -khtml-user-select: none; /* Konqueror HTML */\n -moz-user-select: none; /* Firefox */\n -ms-user-select: none; /* Internet Explorer/Edge */\n user-select: none;\n margin: 0;\n padding: 0;\n}\n.TransformComponent-module_content__TZU5O {\n display: flex;\n flex-wrap: wrap;\n width: fit-content;\n height: fit-content;\n margin: 0;\n padding: 0;\n transform-origin: 0% 0%;\n}\n.TransformComponent-module_content__TZU5O img {\n pointer-events: none;\n}\n");var vt=function(t){function e(){var e=null!==t&&t.apply(this,arguments)||this;return e.wrapperRef=i.default.createRef(),e.contentRef=i.default.createRef(),e}return g(e,t),e.prototype.componentDidMount=function(){var t=this.context.nodes;t.setWrapperComponent(this.wrapperRef.current),t.setContentComponent(this.contentRef.current)},e.prototype.render=function(){var t=this.props.children,e=this.context.state,n=e.positionX,o=e.positionY,a=e.scale,r=e.options,s=r.wrapperClass,l=r.contentClass,c={WebkitTransform:"translate("+n+"px, "+o+"px) scale("+a+")",transform:"translate("+n+"px, "+o+"px) scale("+a+")"};return i.default.createElement("div",{ref:this.wrapperRef,className:"react-transform-component "+ft+" "+s},i.default.createElement("div",{ref:this.contentRef,className:"react-transform-element "+mt+" "+l,style:c},t))},e}(i.default.Component);vt.contextType=ct;var yt=function(t){var e,n=t.handleZoomChange,o=t.isDesktop,s=t.isZoomIn,l=t.children,c=t.handleZoomAction,u=t.showZoomOption,p=t.styles,d=t.zoomButtonStyle;return o?i.default.createElement(ht,{pan:{disabled:!s},zoomIn:{step:10},zoomOut:{step:10},pinch:{disabled:!0},wheel:{step:50,disabled:!0},doubleClick:{disabled:!0},defaultScale:1,defaultPositionX:0,defaultPositionY:0},(function(t){var e=t.zoomIn,n=t.zoomOut,o=t.resetTransform,r=t.scale;return i.default.createElement(i.default.Fragment,null,i.default.createElement(vt,null,l),u&&i.default.createElement("div",{style:p.zoomOption},i.default.createElement("button",{style:a(a({},p.zoomButton),d),onClick:function(t){e(t),c("zoom-in",r)}},"+"),i.default.createElement("button",{style:a(a({},p.zoomButton),d),onClick:function(t){n(t),setTimeout((function(){r<1.5&&n(t)})),c("zoom-out",r)}},"−"),i.default.createElement("button",{style:a(a({},p.zoomButton),d),onClick:function(t){o(t),setTimeout((function(){o(t)})),c("zoom-close",r)}},"×")))})):i.default.createElement(ht,(r(e={doubleClick:{disabled:!1},pan:{disabled:!s},zoomIn:{step:50},wheel:{step:50}},"doubleClick",{mode:"reset"}),r(e,"defaultScale",1),r(e,"defaultPositionX",0),r(e,"defaultPositionY",0),r(e,"onZoomChange",(function(t){return n(t)})),e),i.default.createElement(vt,null,l))},gt={threeSixtyWrap:function(t){return{display:t?"block":"none",width:"100%",height:"100%",position:"relative"}},transformComponent:function(t,e,n,i){return a({width:"fit-content",height:n&&!i?"fit-content":"100%",visibility:t?"visible":"hidden",position:"relative",transform:"translateX(-50%)",maxWidth:"100%",maxHeight:"100%",left:"50%",overflow:"hidden",cursor:"url(".concat(e?"https://spinny-images.s3.ap-south-1.amazonaws.com/static-asset/icons/drag_cursor.svg":"https://spinny-images.s3.ap-south-1.amazonaws.com/static-asset/icons/cursor.svg","), auto")},Object.assign({},n&&!i?{margin:"auto"}:{}))},viewer:function(t,e){return{width:"100%",height:"100%",display:"flex",cursor:"url(".concat(e?"https://spinny-images.s3.ap-south-1.amazonaws.com/static-asset/icons/drag_cursor.svg":"https://spinny-images.s3.ap-south-1.amazonaws.com/static-asset/icons/cursor.svg","), auto"),visibility:t?"visible":"hidden"}},zoomOption:{position:"absolute",bottom:"1em",right:"1em",width:"2em",zIndex:"2"},zoomButton:{padding:"0px",width:"1.5em",height:"1.5em",fontSize:"20px",fontWeight:"500",cursor:"pointer"},loadingImgWrap:function(t,e,n,i){return{display:"block",position:"relative",width:"100%",height:"100%",left:"0px",top:"0px",backgroundPosition:"center",backgroundSize:"contain",backgroundRepeat:"no-repeat",backgroundImage:"url(".concat(e[n][i],")"),cursor:"not-allowed"}},loading:{position:"absolute",width:"100px",height:"100px",top:"calc(50% - 50px)",left:"calc(50% - 50px)"}},bt=function(t){var n=t.isMobile,o=void 0!==n&&n,r=t.imageKey,c=void 0===r?"image_url":r,u=t.zoomImageKey,p=void 0===u?"zoom_image_url":u,d=t.type,m=void 0===d?"exterior":d,y=t.autoPlay,g=t.startIndex,b=void 0===g?0:g,w=t.updateIndex,P=t.handleImageChange,S=t.handleZoomInOut,x=t.showZoomOption,T=void 0!==x&&x,C=t.containerName,E=void 0===C?"reactThreesixtyContainer":C,k=t.hotspotClickHandler,O=t.renderHotspotUI,Y=t.renderExtraElement,X=t.noOuterMargin,W=t.imageArr,_=t.threeSixtyWrapStyle,z=t.zoomButtonStyle,I=e.useRef(null),M=e.useRef(null),D=s(e.useState(!1),2),j=D[0],L=D[1],N=s(e.useState([]),2),A=N[0],R=N[1],B=s(e.useState(!1),2),H=B[0],Z=B[1],U=s(e.useState(!1),2),q=U[0],V=U[1],F=s(e.useState(t.hotspots),2),Q=F[0],K=F[1],J=function(t,e){var n=0,i=t.length;t.forEach((function(t){!function(t,e){var n=new Image;n.onload=e,n.src=t}(t,(function(){++n===i&&e()}))}))},$=function(){var e,n=arguments.length>0&&void 0!==arguments[0]?arguments[0]:null,i=W[n?n.detail.image_index:b].angle;(null===(e=t.hotspots)||void 0===e?void 0:e.length)&&K((function(t){return f(t,i)})),n&&n.detail&&P&&P({index:n.detail.image_index,item:W[n.detail.image_index]})},G=function(){L(!0)},tt=function(){L(!1)},et=function(t){var e=W[t][p]?W[t][p]:W[t][c];W[t][p]&&J([e],(function(){var n=W.map((function(n,i){return i===t?e:n[c]}));M.current._updateImage(n)}))},nt=function(t){t.scale<=1?q&&(V(!1),S&&S(!1),M.current._allowScroll()):q||(V(!0),S&&S(!0),M.current._stopScroll(),et(M.current.index))},it=function(t,e){"zoom-in"===t?q||(et(M.current.index),S&&S(!0),V(!0),M.current._stopScroll()):"zoom-out"===t?e<1.5&&q&&(S&&S(!1),V(!1),M.current._allowScroll()):q&&(S&&S(!1),V(!1),M.current._allowScroll())};e.useEffect((function(){M.current&&w>=0&&w<W.length&&M.current.goto(w)}),[w]),e.useEffect((function(){return document.addEventListener("".concat(E,"_image_changed"),$),I.current&&(I.current.addEventListener("mousedown",G),I.current.addEventListener("mouseup",tt)),function(){document.removeEventListener("".concat(E,"_image_changed"),$),I.current&&(I.current.removeEventListener("mousedown",G),I.current.removeEventListener("mouseup",tt))}}),[m]),e.useEffect((function(){var e;if(M.current){var n=W.map((function(t){return t[c]}));M.current._updateImage(n)}(null===(e=t.hotspots)||void 0===e?void 0:e.length)&&$()}),[JSON.stringify(W)]),e.useEffect((function(){if(I&&I.current)return-1===A.indexOf(m)&&Z(!1),M.current=new h(I.current,a({image:W.map((function(t){return t[c]}))},t)),J(W.map((function(t){return t[c]})),(function(){y&&M.current.play(),R([].concat(l(A),[m])),Z(!0),M.current._allowScroll()})),function(){I&&M.current.destroy()}}),[m]);return i.default.createElement(i.default.Fragment,null,o?i.default.createElement("div",{style:a(a({},gt.threeSixtyWrap(H)),_)},i.default.createElement(yt,{handleZoomChange:nt,isZoomIn:q,showZoomOption:T,styles:gt,zoomButtonStyle:z},i.default.createElement("div",{style:gt.transformComponent(H,j,o,X)},i.default.createElement("div",{ref:I,style:gt.viewer(H,j)},Y&&i.default.createElement("div",{className:"extra_threesixty"},Y())),(null==Q?void 0:Q.length)>0&&i.default.createElement(v,{hotspots:Q,renderUI:O,clickHandler:k})))):i.default.createElement("div",{style:a(a({},gt.threeSixtyWrap(H)),_)},i.default.createElement(yt,{isDesktop:!0,handleZoomAction:it,isZoomIn:q,showZoomOption:T,styles:gt,zoomButtonStyle:z},i.default.createElement("div",{style:gt.transformComponent(H,j)},i.default.createElement("div",{ref:I,style:gt.viewer(H,j)},Y&&i.default.createElement("div",{className:"extra_threesixty"},Y())),(null==Q?void 0:Q.length)>0&&i.default.createElement(v,{hotspots:Q,clickHandler:k,renderUI:O})))),!H&&i.default.createElement("div",{style:gt.loadingImgWrap(o,W,b,c)},i.default.createElement("div",{style:gt.loading},i.default.createElement("img",{src:"https://spinny-images.s3.ap-south-1.amazonaws.com/static-asset/icons/loader.gif",style:{width:"100%",height:"100%"}}))))},wt=e.memo(bt);t.ThreeSixtyViewer=wt,t.ZoomPan=yt,Object.defineProperty(t,"__esModule",{value:!0})}));