smoothr/dist/smoothr.umd.min.js

Smoothr: Smooth Router - A custom React router that leverages the Web Animations API and CSS animations.

!function(t,e){"object"==typeof exports&&"undefined"!=typeof module?e(exports,require("react"),require("path-to-regexp")):"function"==typeof define&&define.amd?define(["exports","react","path-to-regexp"],e):e(t.Smoothr={},t.React,t.pathToRegexp)}(this,function(t,e,n){"use strict";var o="default"in e?e.default:e;n=n&&n.hasOwnProperty("default")?n.default:n;var r=e.createContext(),i="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(t){return typeof t}:function(t){return t&&"function"==typeof Symbol&&t.constructor===Symbol&&t!==Symbol.prototype?"symbol":typeof t},a=function(t,e){if(!(t instanceof e))throw new TypeError("Cannot call a class as a function")},s=Object.assign||function(t){for(var e=1;e<arguments.length;e++){var n=arguments[e];for(var o in n)Object.prototype.hasOwnProperty.call(n,o)&&(t[o]=n[o])}return t},u=function(t,e){if("function"!=typeof e&&null!==e)throw new TypeError("Super expression must either be null or a function, not "+typeof e);t.prototype=Object.create(e&&e.prototype,{constructor:{value:t,enumerable:!1,writable:!0,configurable:!0}}),e&&(Object.setPrototypeOf?Object.setPrototypeOf(t,e):t.__proto__=e)},p=function(t,e){var n={};for(var o in t)e.indexOf(o)>=0||Object.prototype.hasOwnProperty.call(t,o)&&(n[o]=t[o]);return n},c=function(t,e){if(!t)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!e||"object"!=typeof e&&"function"!=typeof e?t:e};function l(t){var e=JSON.parse(localStorage.getItem(t));return e?[].concat(e).filter(function(t){return t}):[]}function h(t,e){var n=arguments.length>2&&void 0!==arguments[2]&&arguments[2],o=l(t);"string"!=typeof e||!n&&-1!==o.indexOf(e)||o.push(e),o.length>=100&&(o=[]),localStorage.setItem(t,JSON.stringify(o))}var f=Object.freeze({VISITED_URL_LIST:"SmoothrVisitedUrls",VISITED_ROUTE_LIST:"SmoothrVisitedRoutes"}),d=function(t){function e(o){a(this,e);var r=c(this,t.call(this,o));return r.deriveCurrentRoute=function(){var t=window.location.href.split("/"),e=(t="/"+t.slice(3,t.length).join("/")).split(r.originPath).join("")||"/";return e+"#"===r.originPath&&(e="/"),e},r.setRouteConsts=function(t,e){r.setState(function(n){var o,i,a,s={routeConsts:(o=n.routeConsts,i=t,o.filter(function(t){return!i.find(function(e){return t[a]===e[a]})}).concat(i))};return r.defaultNotFoundPath&&(r.defaultNotFoundPath=!1,s.notFoundPath=e),s})},r.setRouteGroupVar=function(t,e,n){r.routeVars[t]||(r.routeVars[t]={}),r.routeVars[t][e]=n},r.handlePopState=function(t){if(t.state){var e=t.state.pageNavigated<r.state.pageNavigated;r.handleRouteChange(t.state.url,e)}},r.handleHashChange=function(){var t=r.deriveCurrentRoute();r.handleRouteChange(t)},r.resolveRoutes=function(t){var e=t.replace(/\?(.*)|\#(.*)/,""),o=t.split(e).join(""),i=void 0,a=void 0,u=!1;r.state.routeConsts.forEach(function(p){if(RegExp(p.pathRegexp).test(r.state.currentUrl)&&(a=p.path),RegExp(p.pathRegexp).test(e))if(p.pathResolve){var c=(h=p.path,f=e,(m=n(h,d=[])).exec(f),d.reduce(function(t,e,n){var o;return s(((o={})[e.name]=m.exec(f)[n+1],o),t)},{})),l=p.pathResolve(c);"string"==typeof l&&RegExp(p.pathRegexp).test(l)&&(e=l,t=""+l+o,i=p.path,u=!0)}else i=p.path,u=!0;var h,f,d,m}),u||(t=r.state.notFoundPath,i=r.state.notFoundPath),r.state.currentUrl===r.state.notFoundPath&&(a=r.state.notFoundPath);var p=u?r.state.currentUrl:r.state.notFoundPath;return{incomingRoute:i,incomingUrl:t,outgoingRoute:a,outgoingUrl:p}},r.handleRouteChange=function(t){var e=arguments.length>1&&void 0!==arguments[1]&&arguments[1],n=arguments.length>2&&void 0!==arguments[2]&&arguments[2],o=r.resolveRoutes(t),i=o.outgoingUrl,a=o.incomingUrl,u=o.outgoingRoute,p=o.incomingRoute,c={};n&&(window.history.pushState({url:a,pageNavigated:r.state.pageNavigated+1},"",""+r.originPath+a),-1===r.state.visitedUrls.indexOf(i)&&(c.visitedUrls=[].concat(r.state.visitedUrls,[i]),h(f.VISITED_URL_LIST,i,!0)),-1===r.state.visitedRoutes.indexOf(u)&&(c.visitedRoutes=[].concat(r.state.visitedRoutes,[u]),h(f.VISITED_ROUTE_LIST,u,!0))),r.initialPageload?(r.initialPageload=!1,window.history.replaceState({url:a,pageNavigated:r.state.pageNavigated},"",""+r.originPath+a),r.setState(s({},c,{currentUrl:a}))):new Promise(function(t){r.props.beforeAnimation&&r.props.beforeAnimation({outgoingUrl:i,incomingUrl:a,outgoingRoute:u,incomingRoute:p,backNavigation:e}),t()}).then(function(){r.props.onAnimationStart&&r.props.onAnimationStart({initialPageload:!1});var t=!1;r.setState(function(n){var o=e?n.pageNavigated-1:n.pageNavigated+1;return n.newUrl?(t=!0,clearTimeout(r.animationTimeout),r.domInAnimation.cancel(),r.domOutAnimation.cancel(),s({},c,{newUrl:null,currentUrl:a,pageNavigated:o,backNavigation:!1})):s({},c,{newUrl:a,pageNavigated:o,backNavigation:e})},function(){t&&(r.domInAnimation.cancel=function(){},r.domOutAnimation.cancel=function(){},r.props.onAnimationEnd&&r.props.onAnimationEnd())})})},r.initialPageload=!0,r.defaultNotFoundPath=!0,r.originPath="",o.originPath&&"/"!==o.originPath&&(r.originPath=o.originPath),r.routeVars={},r.domInAnimation={},r.domInAnimation.cancel=function(){},r.domOutAnimation={},r.domOutAnimation.cancel=function(){},r.state={currentUrl:r.deriveCurrentRoute(),newUrl:null,pageNavigated:1,backNavigation:!1,routeConsts:[],notFoundPath:"/notfound",visitedUrls:l(f.VISITED_URL_LIST),visitedRoutes:l(f.VISITED_ROUTE_LIST)},r}return u(e,t),e.prototype.componentDidMount=function(){var t=this;setTimeout(function(){t.handleRouteChange(t.state.currentUrl)},0),window.addEventListener("popstate",this.handlePopState),window.addEventListener("hashchange",this.handleHashChange)},e.prototype.componentWillUnmount=function(){window.removeEventListener("popstate",this.handlePopState),window.removeEventListener("hashchange",this.handleHashChange)},e.prototype.componentDidUpdate=function(){var t=this,e=function(){t.setState(function(t){return t.newUrl?{newUrl:null,currentUrl:t.newUrl,backNavigation:!1}:null},function(){t.domInAnimation.cancel=function(){},t.domOutAnimation.cancel=function(){},t.props.onAnimationEnd&&t.props.onAnimationEnd()})};this.state.newUrl&&(clearTimeout(this.animationTimeout),this.domInAnimation.cancel(),this.domOutAnimation.cancel(),Object.keys(this.routeVars).forEach(function(n){var o=t.routeVars[n],r=o.animationIn,a=o.animationOut,s=o.animationOpts;if(t.state.backNavigation&&(r=o.reverseAnimationIn||r,a=o.reverseAnimationOut||a,s=o.reverseAnimationOpts||s),"number"==typeof s)s={duration:s};else if("object"===(void 0===s?"undefined":i(s)))s.fill="forwards";else{if(s)throw"Smoothr Error: animationOpts/reverseAnimationOps prop must be an object or integer";s={duration:0}}if(s.iterations&&s.iterations===1/0)throw"Smoothr Error: Cannot use `iterations: Infinity` as animation options";var u=(s.delay||0)+s.duration*(s.iterations||1)+(s.endDelay||0),p=!1;o.newPageRef&&("string"!=typeof r?(t.domInAnimation=o.newPageRef.animate(r,s),t.domInAnimation.onfinish=e,t.domInAnimation.oncancel=e,t.domInAnimation.play()):p=!0),o.currentPageRef&&("string"!=typeof a&&o.currentPageRef?(t.domOutAnimation=o.currentPageRef.animate(a,s),t.domOutAnimation.onfinish=e,t.domOutAnimation.oncancel=e,t.domOutAnimation.play()):p=!0),p&&(t.animationTimeout=setTimeout(e,u))}))},e.prototype.render=function(){return o.createElement(r.Provider,{value:{originPath:this.originPath,state:this.state,handleRouteChange:this.handleRouteChange,setRouteConsts:this.setRouteConsts,setRouteGroupVar:this.setRouteGroupVar}},this.props.children)},e}(e.Component);function m(t,e){Object.keys(t).forEach(function(n){var o;-1===["component","path","animationIn","animationOut","animationOpts","children"].indexOf(n)&&Object.assign(e,((o={})[n]=t[n],o))})}function g(t,e,n,o){var r=t.exec(n);Object.assign(o,e.reduce(function(t,e,n){var o;return s(((o={})[e.name]=r[n+1],o),t)},{}))}var v=function(t){function e(o){a(this,e);var r,i=c(this,t.call(this,o));i.groupHash=(r=window.crypto||window.msCrypto,([1e7]+-1e3+-4e3+-8e3+-1e11).replace(/[018]/g,function(t){return(t^r.getRandomValues(new Uint8Array(1))[0]&15>>t/4).toString(16)}));var s="/notfound",u=[];return i.props.children.forEach(function(t){if(t.props.notFound&&-1===t.props.path.indexOf(":"))s=t.props.path;else{if(t.props.notFound)throw"Smoothr Error: The `path` on the <Route /> with the `notFound` attribute cannot have any URL variables.";var e=t.props.path.replace(/\?(.*)|\#(.*)/,""),o={path:e,pathRegexp:n(e)};-1!==t.props.path.indexOf(":")&&t.props.pathResolve&&(o.pathResolve=t.props.pathResolve),u.push(o)}}),i.props.context.setRouteConsts(u,s),i}return u(e,t),e.prototype.render=function(){var t=this,e=this.props,r=e.context,i=e.animationIn,a=e.animationOut,u=e.animationOpts,p=e.reverseAnimationIn,c=e.reverseAnimationOut,l=e.reverseAnimationOpts,h=r.state,f=h.newUrl,d=h.currentUrl,v=function(){return null},R=function(){return null},y=function(){return null},O=null,w={},E=null,b=null,P={},A=!1,I=null;this.props.children.forEach(function(e){var o=[],s=n(e.props.path.replace(/\?(.*)|\#(.*)/,""),o),h=e.props.animationIn||i,S=e.props.animationOut||a,U=e.props.animationOpts||u,C=e.props.reverseAnimationIn||p,x=e.props.reverseAnimationOut||c,V=e.props.reverseAnimationOpts||l;f&&RegExp(s).test(f)&&(m(e.props,w),g(s,o,f,w),v=e.props.component,E=t.groupHash+"-"+f,r.setRouteGroupVar(t.groupHash,"animationIn",h),r.setRouteGroupVar(t.groupHash,"animationOut",S),r.setRouteGroupVar(t.groupHash,"animationOpts",U),r.setRouteGroupVar(t.groupHash,"reverseAnimationIn",C),r.setRouteGroupVar(t.groupHash,"reverseAnimationOut",x),r.setRouteGroupVar(t.groupHash,"reverseAnimationOpts",V),"string"!=typeof e.props.animationIn&&"string"!=typeof t.props.animationIn||(O=r.state.backNavigation?C:h),"string"!=typeof e.props.animationOut&&"string"!=typeof t.props.animationOut||(b=r.state.backNavigation?x:S)),RegExp(s).test(d)&&(m(e.props,P),g(s,o,d,P),A=!0,R=e.props.component,I=t.groupHash+"-"+d),e.props.notFound&&(y=e.props.component)}),A||(R=y);var S={height:"100%",width:"100%",position:"absolute",animationFillMode:"forwards"};return f?o.createElement("div",{style:S},o.createElement("div",{style:S,className:O,ref:function(e){return r.setRouteGroupVar(t.groupHash,"newPageRef",e)}},o.createElement(v,s({},w,{key:E}))),o.createElement("div",{style:S,className:b,ref:function(e){return r.setRouteGroupVar(t.groupHash,"currentPageRef",e)}},o.createElement(R,s({},P,{key:I})))):o.createElement(R,s({},P,{key:I}))},e}(e.Component);t.Smoothr=d,t.SmoothRoutes=function(t){return o.createElement(r.Consumer,null,function(e){return o.createElement(v,s({},t,{context:e}))})},t.Route=function(){return null},t.Link=function(t){return o.createElement(r.Consumer,null,function(e){var r=t.href,i=t.fuzzyCurrent,a=t.fuzzyVisited,u=t.onClick,c=t.children,l=p(t,["href","fuzzyCurrent","fuzzyVisited","onClick","children"]),h=e.originPath,f=e.state,d=f.newUrl,m=f.currentUrl,g=f.visitedRoutes,v=f.visitedUrls,R=f.routeConsts,y=d?r===d:r===m;i&&(y=R.some(function(t){var e=RegExp(t.pathRegexp);return d?e.test(d)&&e.test(r):e.test(m)&&e.test(r)}));var O=!1;return O=a?g.some(function(t){var e=n(t);return RegExp(e).test(r)}):-1!==v.indexOf(r),o.createElement("a",s({href:""+h+r,onClick:function(n){n.preventDefault(),t.disabled||y||(e.handleRouteChange(r,!1,!0),u&&u())},"data-smoothr-current-link":y,"data-smoothr-visited-link":O},l),c)})},Object.defineProperty(t,"__esModule",{value:!0})});
//# sourceMappingURL=smoothr.umd.min.js.map