react-circular-reveal/build/index.min.js

Quickly and easily add Material Design's "Circular Reveal" animation in your web app.

!function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t(require("react")):"function"==typeof define&&define.amd?define(["react"],t):"object"==typeof exports?exports["react-circular-reveal"]=t(require("react")):e["react-circular-reveal"]=t(e.React)}(window,function(r){return o={},a.m=n=[function(e,t){e.exports=r},function(e,t,r){e.exports=r(6)},function(e,t,r){var n=r(3);"string"==typeof n&&(n=[[e.i,n,""]]);var a={insert:"head",singleton:!1};r(5)(n,a);n.locals&&(e.exports=n.locals)},function(e,t,r){(e.exports=r(4)(!1)).push([e.i,"\r\n.circular-reveal__overlay {\r\n  position: relative;\r\n  pointer-events: all;\r\n  overflow: hidden;\r\n}\r\n\r\n.circular-reveal__revealCurtain {\r\n  position: absolute;\r\n  width: 0;\r\n  height: 0;\r\n  border-radius: 50%;\r\n  overflow: hidden;\r\n}\r\n\r\n.circular-reveal__revealContent {\r\n  position: absolute;\r\n  left: 0;\r\n  right: 0;\r\n  top: 0;\r\n  bottom: 0;\r\n  min-width: 500px;\r\n}\r\n",""])},function(e,t,r){"use strict";e.exports=function(r){var c=[];return c.toString=function(){return this.map(function(e){var t=function(e,t){var r=e[1]||"",n=e[3];if(!n)return r;if(t&&"function"==typeof btoa){var a=function(e){var t=btoa(unescape(encodeURIComponent(JSON.stringify(e)))),r="sourceMappingURL=data:application/json;charset=utf-8;base64,".concat(t);return"/*# ".concat(r," */")}(n),o=n.sources.map(function(e){return"/*# sourceURL=".concat(n.sourceRoot).concat(e," */")});return[r].concat(o).concat([a]).join("\n")}return[r].join("\n")}(e,r);return e[2]?"@media ".concat(e[2],"{").concat(t,"}"):t}).join("")},c.i=function(e,t){"string"==typeof e&&(e=[[null,e,""]]);for(var r={},n=0;n<this.length;n++){var a=this[n][0];null!=a&&(r[a]=!0)}for(var o=0;o<e.length;o++){var i=e[o];null!=i[0]&&r[i[0]]||(t&&!i[2]?i[2]=t:t&&(i[2]="(".concat(i[2],") and (").concat(t,")")),c.push(i))}},c}},function(e,t,a){"use strict";var r,n,s={},o=function(){return void 0===r&&(r=Boolean(window&&document&&document.all&&!window.atob)),r},i=(n={},function(e){if(void 0===n[e]){var t=document.querySelector(e);if(window.HTMLIFrameElement&&t instanceof window.HTMLIFrameElement)try{t=t.contentDocument.head}catch(e){t=null}n[e]=t}return n[e]});function f(e,t){for(var r=[],n={},a=0;a<e.length;a++){var o=e[a],i=t.base?o[0]+t.base:o[0],c={css:o[1],media:o[2],sourceMap:o[3]};n[i]?n[i].parts.push(c):r.push(n[i]={id:i,parts:[c]})}return r}function d(e,t){for(var r=0;r<e.length;r++){var n=e[r],a=s[n.id],o=0;if(a){for(a.refs++;o<a.parts.length;o++)a.parts[o](n.parts[o]);for(;o<n.parts.length;o++)a.parts.push(m(n.parts[o],t))}else{for(var i=[];o<n.parts.length;o++)i.push(m(n.parts[o],t));s[n.id]={id:n.id,refs:1,parts:i}}}}function c(t){var r=document.createElement("style");if(void 0===t.attributes.nonce){var e=a.nc;e&&(t.attributes.nonce=e)}if(Object.keys(t.attributes).forEach(function(e){r.setAttribute(e,t.attributes[e])}),"function"==typeof t.insert)t.insert(r);else{var n=i(t.insert||"head");if(!n)throw new Error("Couldn't find a style target. This probably means that the value for the 'insert' parameter is invalid.");n.appendChild(r)}return r}var u,l=(u=[],function(e,t){return u[e]=t,u.filter(Boolean).join("\n")});function p(e,t,r,n){var a=r?"":n.css;if(e.styleSheet)e.styleSheet.cssText=l(t,a);else{var o=document.createTextNode(a),i=e.childNodes;i[t]&&e.removeChild(i[t]),i.length?e.insertBefore(o,i[t]):e.appendChild(o)}}var v=null,h=0;function m(t,e){var r,n,a;if(e.singleton){var o=h++;r=v=v||c(e),n=p.bind(null,r,o,!1),a=p.bind(null,r,o,!0)}else r=c(e),n=function(e,t,r){var n=r.css,a=r.media,o=r.sourceMap;if(a&&e.setAttribute("media",a),o&&btoa&&(n+="\n/*# sourceMappingURL=data:application/json;base64,".concat(btoa(unescape(encodeURIComponent(JSON.stringify(o))))," */")),e.styleSheet)e.styleSheet.cssText=n;else{for(;e.firstChild;)e.removeChild(e.firstChild);e.appendChild(document.createTextNode(n))}}.bind(null,r,e),a=function(){!function(e){if(null===e.parentNode)return;e.parentNode.removeChild(e)}(r)};return n(t),function(e){if(e){if(e.css===t.css&&e.media===t.media&&e.sourceMap===t.sourceMap)return;n(t=e)}else a()}}e.exports=function(e,u){(u=u||{}).attributes="object"==typeof u.attributes?u.attributes:{},u.singleton||"boolean"==typeof u.singleton||(u.singleton=o());var l=f(e,u);return d(l,u),function(e){for(var t=[],r=0;r<l.length;r++){var n=l[r],a=s[n.id];a&&(a.refs--,t.push(a))}e&&d(f(e,u),u);for(var o=0;o<t.length;o++){var i=t[o];if(0===i.refs){for(var c=0;c<i.parts.length;c++)i.parts[c]();delete s[i.id]}}}}},function(e,t,r){"use strict";r.r(t);function n(e){var c,t=e.reveal,r=e.children,u=e.contentMinWidth,n=e.revealContent,a=e.revealCurtainContent,o=e.speed,l=e.onChange,s=Object(g.useRef)({x:0,y:0}),f=Object(g.useRef)(!1),d=Object(g.useRef)(t),i=Object(g.useRef)(t),p=Object(g.useRef)(null),v=Object(g.useRef)(null),h=Object(g.useRef)(null),m=Object(g.useCallback)(function(e){v.current&&!d.current&&(s.current.x=e.clientX-v.current.getBoundingClientRect().left,s.current.y=e.clientY-v.current.getBoundingClientRect().top)},[d]),b=Object(g.useRef)(-1),y=Object(g.useRef)(1);if("function"==typeof o)c=o;else switch(o){case"very slow":c=function(e,t){return t?e+Math.max(e/15,1):e-Math.max(e/15,1)};break;case"slow":c=function(e,t){return t?e+Math.max(e/6,2):e-Math.max(e/6,2)};break;case"normal":c=function(e,t){return t?e+Math.max(e/3,5):e-Math.max(e/3,5)};break;case"fast":c=function(e,t){return t?e+Math.max(e/3,20):e-Math.max(e/3,20)};break;default:throw new Error("react-circular-reveal: Invalid speed value.")}var x=function(){if(p.current&&v.current&&h.current){var e=y.current,t=s.current,r=p.current.style,n=h.current.style,a=v.current.getBoundingClientRect(),o=a.width,i=2.5*Math.max(a.height,a.width);r.width=e+"px",r.height=e+"px",r.left=t.x-e/2+"px",r.top=t.y-e/2+"px",n.minWidth=Math.min(o,u)+"px",n.width=o+"px",n.top=e/2-t.y+"px",n.left=e/2-t.x+"px",f.current&&e<i||!f.current&&0<e?(y.current=c(e,f.current),b.current=requestAnimationFrame(x)):(d.current=!1,f.current||(r.width="0px",r.height="0px"),l&&l(new w(f.current?"CURTAIN_OPENED":"CURTAIN_CLOSED",p.current,h.current)))}};return t===i.current||d.current||(d.current=!0,i.current=!i.current,l&&l(new w(f.current?"CURTAIN_CLOSING":"CURTAIN_OPENING",p.current,h.current)),-1!==b.current&&(cancelAnimationFrame(b.current),b.current=-1),f.current=!f.current,x()),C.a.createElement("div",{ref:v,className:"circular-reveal__overlay",onMouseMove:m},r,C.a.createElement("div",{ref:p,className:"circular-reveal__revealCurtain"},C.a.createElement("div",{ref:h,className:"circular-reveal__revealContent"},n),a))}var g=r(0),C=r.n(g),w=(r(2),function(e,t,r){this.type=e,this.curtainElemRef=t,this.revealContentElemRef=r});n.defaultProps={contentMinWidth:500,reveal:!1,speed:"normal"},r.d(t,"CurtainEvent",function(){return w}),r.d(t,"CircularRevealPanel",function(){return n})}],a.c=o,a.d=function(e,t,r){a.o(e,t)||Object.defineProperty(e,t,{enumerable:!0,get:r})},a.r=function(e){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},a.t=function(t,e){if(1&e&&(t=a(t)),8&e)return t;if(4&e&&"object"==typeof t&&t&&t.__esModule)return t;var r=Object.create(null);if(a.r(r),Object.defineProperty(r,"default",{enumerable:!0,value:t}),2&e&&"string"!=typeof t)for(var n in t)a.d(r,n,function(e){return t[e]}.bind(null,n));return r},a.n=function(e){var t=e&&e.__esModule?function(){return e.default}:function(){return e};return a.d(t,"a",t),t},a.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},a.p="",a(a.s=1);function a(e){if(o[e])return o[e].exports;var t=o[e]={i:e,l:!1,exports:{}};return n[e].call(t.exports,t,t.exports,a),t.l=!0,t.exports}var n,o});