@devseed-ui/modal - npm Package Compare versions

Comparing version 2.0.0 to 3.0.0-rc.0

CHANGELOG.md

 # @devseed-ui/modal
 
+## 3.0.0-rc.0
+
+### Major Changes
+
+- Update styles to reflect theme changes
+
+### Patch Changes
+
+- Updated dependencies [undefined]
+  - @devseed-ui/theme-provider@3.0.0-rc.0
+
 ## 2.0.0
@@ -4,0 +15,0 @@

dist/index.node.js

@@ -1,1 +0,1 @@
-!function(e,t){if("object"==typeof exports&&"object"==typeof module)module.exports=t(require("react"),require("prop-types"),require("react-dom"),require("@devseed-ui/button"),require("styled-components"),require("polished"),require("@devseed-ui/theme-provider"));else if("function"==typeof define&&define.amd)define(["react","prop-types","react-dom","@devseed-ui/button","styled-components","polished","@devseed-ui/theme-provider"],t);else{var n="object"==typeof exports?t(require("react"),require("prop-types"),require("react-dom"),require("@devseed-ui/button"),require("styled-components"),require("polished"),require("@devseed-ui/theme-provider")):t(e.react,e["prop-types"],e["react-dom"],e["@devseed-ui/button"],e["styled-components"],e.polished,e["@devseed-ui/theme-provider"]);for(var r in n)("object"==typeof exports?exports:e)[r]=n[r]}}(global,(function(e,t,n,r,o,i,a){return function(e){var t={};function n(r){if(t[r])return t[r].exports;var o=t[r]={i:r,l:!1,exports:{}};return e[r].call(o.exports,o,o.exports,n),o.l=!0,o.exports}return n.m=e,n.c=t,n.d=function(e,t,r){n.o(e,t)||Object.defineProperty(e,t,{enumerable:!0,get:r})},n.r=function(e){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},n.t=function(e,t){if(1&t&&(e=n(e)),8&t)return e;if(4&t&&"object"==typeof e&&e&&e.__esModule)return e;var r=Object.create(null);if(n.r(r),Object.defineProperty(r,"default",{enumerable:!0,value:e}),2&t&&"string"!=typeof e)for(var o in e)n.d(r,o,function(t){return e[t]}.bind(null,o));return r},n.n=function(e){var t=e&&e.__esModule?function(){return e.default}:function(){return e};return n.d(t,"a",t),t},n.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},n.p="",n(n.s=3)}([function(t,n){t.exports=e},function(e,n){e.exports=t},function(e,t){e.exports=n},function(e,t,n){"use strict";function r(e){return(r="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e})(e)}Object.defineProperty(t,"__esModule",{value:!0}),t.Modal=f,Object.defineProperty(t,"ModalHeader",{enumerable:!0,get:function(){return u.ModalHeader}}),Object.defineProperty(t,"ModalHeadline",{enumerable:!0,get:function(){return u.ModalHeadline}}),Object.defineProperty(t,"ModalToolbar",{enumerable:!0,get:function(){return u.ModalToolbar}}),Object.defineProperty(t,"ModalBody",{enumerable:!0,get:function(){return u.ModalBody}}),Object.defineProperty(t,"ModalFooter",{enumerable:!0,get:function(){return u.ModalFooter}});var o=function(e){if(e&&e.__esModule)return e;if(null===e||"object"!==r(e)&&"function"!=typeof e)return{default:e};var t=c();if(t&&t.has(e))return t.get(e);var n={},o=Object.defineProperty&&Object.getOwnPropertyDescriptor;for(var i in e)if(Object.prototype.hasOwnProperty.call(e,i)){var a=o?Object.getOwnPropertyDescriptor(e,i):null;a&&(a.get||a.set)?Object.defineProperty(n,i,a):n[i]=e[i]}n.default=e,t&&t.set(e,n);return n}(n(0)),i=n(2),a=n(1),l=n(10),s=n(5),u=n(6);function c(){if("function"!=typeof WeakMap)return null;var e=new WeakMap;return c=function(){return e},e}function d(e,t){return function(e){if(Array.isArray(e))return e}(e)||function(e,t){if(!(Symbol.iterator in Object(e)||"[object Arguments]"===Object.prototype.toString.call(e)))return;var n=[],r=!0,o=!1,i=void 0;try{for(var a,l=e[Symbol.iterator]();!(r=(a=l.next()).done)&&(n.push(a.value),!t||n.length!==t);r=!0);}catch(e){o=!0,i=e}finally{try{r||null==l.return||l.return()}finally{if(o)throw i}}return n}(e,t)||function(){throw new TypeError("Invalid attempt to destructure non-iterable instance")}()}var p=function(e){var t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{},n=arguments.length>2&&void 0!==arguments[2]?arguments[2]:null;return"function"==typeof e?e(t):n};function f(e){var t=e.id,n=e.title,r=e.content,a=e.footerContent,c=e.closeButton,m=e.size,h=e.revealed,y=e.className,v=e.onCloseClick,E=e.onOverlayClick,b=e.renderContents,g=e.renderHeader,x=e.renderHeadline,C=e.renderToolbar,O=e.renderBody,M=e.renderFooter,S=(0,o.useRef)(f.generateUUID()),k=d((0,o.useState)(!1),2),T=k[0],j=k[1],P=d((0,o.useState)(null),2),w=P[0],N=P[1];if((0,o.useEffect)((function(){var e=function(e){h&&27===e.keyCode&&(e.preventDefault(),v(e))};return document.addEventListener("keyup",e),function(){document.removeEventListener("keyup",e)}}),[h]),(0,o.useEffect)((function(){var e=document.createElement("div");return e.className="modal-portal-".concat(S.current),document.body.appendChild(e),N(e),j(!0),function(){document.body.removeChild(e)}}),[]),!T)return null;var _=["modal",y],V=function(e){e.preventDefault(),v(e)},D={close:V};return(0,i.createPortal)(o.default.createElement(l.CSSTransition,{in:h,appear:!0,unmountOnExit:!0,classNames:"modal",timeout:{enter:400,exit:400}},o.default.createElement(u.ModalWrapper,{className:_.join(" "),key:"modal-".concat(t),onClick:function(e){e.target===e.currentTarget&&"function"==typeof E&&E(e)},id:t,size:m},o.default.createElement(u.BodyUnscrollable,{revealed:h}),o.default.createElement(u.ModalContents,{className:"modal__contents",size:m},p(b,D,o.default.createElement(o.default.Fragment,null,p(g,D,o.default.createElement(u.ModalHeader,null,p(x,D,o.default.createElement(u.ModalHeadline,null,o.default.createElement("h1",null,n))),p(C,D,c&&o.default.createElement(u.ModalToolbar,null,o.default.createElement(s.Button,{useIcon:"xmark--small",size:"small",hideText:!0,onClick:V},"Close"))))),p(O,D,o.default.createElement(u.ModalBody,null,r)),p(M,D,a?o.default.createElement(u.ModalFooter,null,a):null)))))),w)}f.generateUUID=function(){return Math.random().toString(36).substr(2,5)},f.defaultProps={closeButton:!0,revealed:!1,size:"medium",onOverlayClick:function(){0},onCloseClick:function(){0}},f.propTypes={id:a.PropTypes.string.isRequired,revealed:a.PropTypes.bool,className:a.PropTypes.string,size:a.PropTypes.string,onOverlayClick:a.PropTypes.func,onCloseClick:a.PropTypes.func,closeButton:a.PropTypes.bool,title:a.PropTypes.string,renderContents:a.PropTypes.func,renderHeader:a.PropTypes.func,renderHeadline:a.PropTypes.func,renderToolbar:a.PropTypes.func,renderBody:a.PropTypes.func,content:a.PropTypes.node,renderFooter:a.PropTypes.func,footerContent:a.PropTypes.node}},,function(e,t){e.exports=r},function(e,t,n){"use strict";function r(e){return(r="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e})(e)}Object.defineProperty(t,"__esModule",{value:!0}),t.ModalFooter=t.ModalBody=t.ModalToolbar=t.ModalHeadline=t.ModalHeader=t.BodyUnscrollable=t.ModalWrapper=t.ModalContents=void 0;var o=function(e){if(e&&e.__esModule)return e;if(null===e||"object"!==r(e)&&"function"!=typeof e)return{default:e};var t=l();if(t&&t.has(e))return t.get(e);var n={},o=Object.defineProperty&&Object.getOwnPropertyDescriptor;for(var i in e)if(Object.prototype.hasOwnProperty.call(e,i)){var a=o?Object.getOwnPropertyDescriptor(e,i):null;a&&(a.get||a.set)?Object.defineProperty(n,i,a):n[i]=e[i]}n.default=e,t&&t.set(e,n);return n}(n(7)),i=n(8),a=n(9);function l(){if("function"!=typeof WeakMap)return null;var e=new WeakMap;return l=function(){return e},e}function s(){var e=function(e,t){t||(t=e.slice(0));return Object.freeze(Object.defineProperties(e,{raw:{value:Object.freeze(t)}}))}(["\n  ","\n"]);return s=function(){return e},e}var u=(0,a.stylizeFunction)(i.rgba),c={small:"32rem",medium:"48rem",large:"64rem",xlarge:"80rem",full:"100%",fullscreen:"100%"},d=o.default.div.withConfig({displayName:"styled__ModalContents",componentId:"sc-1f8l41k-0"})(["display:grid;grid-template-columns:100%;grid-template-rows:",";background:",";border-radius:",";width:100%;margin:",";box-shadow:0 0 32px 2px ",",0 16px 48px -16px ",";"," > *:last-child{margin-bottom:0;}"],(function(e){return"fullscreen"===e.size?"3rem auto":"auto"}),(0,a.themeVal)("color.surface"),(0,a.themeVal)("shape.rounded"),(function(e){return"fullscreen"===e.size?0:"auto"}),u((0,a.themeVal)("type.base.color"),.04),u((0,a.themeVal)("type.base.color"),.12),(function(e){var t=e.size;return"max-width: ".concat(c[t],";")}));t.ModalContents=d;var p=o.default.section.withConfig({displayName:"styled__ModalWrapper",componentId:"sc-1f8l41k-1"})(["display:flex;position:fixed;top:0;bottom:0;left:0;right:0;z-index:9990;overflow-y:auto;opacity:1;visibility:visible;background:",";transform:translate3d(0,0,0);padding:",";&.modal-appear,&.modal-enter{opacity:0;visibility:hidden;}&.modal-enter-appear,&.modal-enter-active{transition:opacity 0.32s ease 0.1s,visibility 0.32s linear 0.1s;opacity:1;visibility:visible;}&.modal-exit{opacity:1;visibility:visible;}&.modal-exit-active{transition:opacity 0.32s ease 0.1s,visibility 0.32s linear 0.1s;opacity:0;visibility:hidden;}"],(0,a.themeVal)("color.smoke"),(function(e){return"fullscreen"===e.size?0:(0,a.glsp)(2)}));t.ModalWrapper=p;var f=(0,o.createGlobalStyle)(s(),(function(e){return e.revealed&&"\n    body {\n      overflow-y: hidden;\n    }\n  "}));t.BodyUnscrollable=f;var m=o.default.header.withConfig({displayName:"styled__ModalHeader",componentId:"sc-1f8l41k-2"})(["display:flex;flex-flow:row nowrap;align-items:center;background:#fff;padding:",";border-radius:"," "," 0 0;& > *:last-child{margin-bottom:0;}"],(0,a.glsp)(2),(0,a.themeVal)("shape.rounded"),(0,a.themeVal)("shape.rounded"));t.ModalHeader=m;var h=o.default.div.withConfig({displayName:"styled__ModalHeadline",componentId:"sc-1f8l41k-3"})(["display:flex;flex-flow:column nowrap;h1{font-size:1.25rem;line-height:2rem;margin:0;}"]);t.ModalHeadline=h;var y=o.default.div.withConfig({displayName:"styled__ModalToolbar",componentId:"sc-1f8l41k-4"})(["display:flex;flex-flow:row nowrap;margin-left:auto;align-items:center;align-self:flex-start;padding:"," 0 "," ",";"],(0,a.glsp)(1/8),(0,a.glsp)(1/8),(0,a.glsp)());t.ModalToolbar=y;var v=o.default.div.withConfig({displayName:"styled__ModalBody",componentId:"sc-1f8l41k-5"})(["padding:0 ",";&:first-child{padding-top:",";}&:last-child{padding-bottom:",";}& > *:last-child{margin-bottom:0;}"],(0,a.glsp)(2),(0,a.glsp)(2),(0,a.glsp)(2));t.ModalBody=v;var E=o.default.footer.withConfig({displayName:"styled__ModalFooter",componentId:"sc-1f8l41k-6"})(["display:flex;flex-flow:row nowrap;align-items:center;background:#fff;padding:",";border-radius:0 0 "," ",";> a,> button{margin-right:",";min-width:7rem;}& > *:last-child{margin-bottom:0;}"],(0,a.glsp)(2),(0,a.themeVal)("shape.rounded"),(0,a.themeVal)("shape.rounded"),(0,a.themeVal)("layout.space"));t.ModalFooter=E},function(e,t){e.exports=o},function(e,t){e.exports=i},function(e,t){e.exports=a},function(e,t,n){"use strict";function r(){return(r=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var r in n)Object.prototype.hasOwnProperty.call(n,r)&&(e[r]=n[r])}return e}).apply(this,arguments)}function o(e,t){if(null==e)return{};var n,r,o={},i=Object.keys(e);for(r=0;r<i.length;r++)n=i[r],t.indexOf(n)>=0||(o[n]=e[n]);return o}function i(e,t){e.prototype=Object.create(t.prototype),e.prototype.constructor=e,e.__proto__=t}n.r(t);n(1);function a(e,t){return e.replace(new RegExp("(^|\\s)"+t+"(?:\\s|$)","g"),"$1").replace(/\s+/g," ").replace(/^\s*|\s*$/g,"")}var l=n(0),s=n.n(l),u=n(2),c=n.n(u),d={disabled:!1},p=s.a.createContext(null),f="entering",m="entered",h=function(e){function t(t,n){var r;r=e.call(this,t,n)||this;var o,i=n&&!n.isMounting?t.enter:t.appear;return r.appearStatus=null,t.in?i?(o="exited",r.appearStatus=f):o=m:o=t.unmountOnExit||t.mountOnEnter?"unmounted":"exited",r.state={status:o},r.nextCallback=null,r}i(t,e),t.getDerivedStateFromProps=function(e,t){return e.in&&"unmounted"===t.status?{status:"exited"}:null};var n=t.prototype;return n.componentDidMount=function(){this.updateStatus(!0,this.appearStatus)},n.componentDidUpdate=function(e){var t=null;if(e!==this.props){var n=this.state.status;this.props.in?n!==f&&n!==m&&(t=f):n!==f&&n!==m||(t="exiting")}this.updateStatus(!1,t)},n.componentWillUnmount=function(){this.cancelNextCallback()},n.getTimeouts=function(){var e,t,n,r=this.props.timeout;return e=t=n=r,null!=r&&"number"!=typeof r&&(e=r.exit,t=r.enter,n=void 0!==r.appear?r.appear:t),{exit:e,enter:t,appear:n}},n.updateStatus=function(e,t){if(void 0===e&&(e=!1),null!==t){this.cancelNextCallback();var n=c.a.findDOMNode(this);t===f?this.performEnter(n,e):this.performExit(n)}else this.props.unmountOnExit&&"exited"===this.state.status&&this.setState({status:"unmounted"})},n.performEnter=function(e,t){var n=this,r=this.props.enter,o=this.context?this.context.isMounting:t,i=this.getTimeouts(),a=o?i.appear:i.enter;!t&&!r||d.disabled?this.safeSetState({status:m},(function(){n.props.onEntered(e)})):(this.props.onEnter(e,o),this.safeSetState({status:f},(function(){n.props.onEntering(e,o),n.onTransitionEnd(e,a,(function(){n.safeSetState({status:m},(function(){n.props.onEntered(e,o)}))}))})))},n.performExit=function(e){var t=this,n=this.props.exit,r=this.getTimeouts();n&&!d.disabled?(this.props.onExit(e),this.safeSetState({status:"exiting"},(function(){t.props.onExiting(e),t.onTransitionEnd(e,r.exit,(function(){t.safeSetState({status:"exited"},(function(){t.props.onExited(e)}))}))}))):this.safeSetState({status:"exited"},(function(){t.props.onExited(e)}))},n.cancelNextCallback=function(){null!==this.nextCallback&&(this.nextCallback.cancel(),this.nextCallback=null)},n.safeSetState=function(e,t){t=this.setNextCallback(t),this.setState(e,t)},n.setNextCallback=function(e){var t=this,n=!0;return this.nextCallback=function(r){n&&(n=!1,t.nextCallback=null,e(r))},this.nextCallback.cancel=function(){n=!1},this.nextCallback},n.onTransitionEnd=function(e,t,n){this.setNextCallback(n);var r=null==t&&!this.props.addEndListener;e&&!r?(this.props.addEndListener&&this.props.addEndListener(e,this.nextCallback),null!=t&&setTimeout(this.nextCallback,t)):setTimeout(this.nextCallback,0)},n.render=function(){var e=this.state.status;if("unmounted"===e)return null;var t=this.props,n=t.children,r=o(t,["children"]);if(delete r.in,delete r.mountOnEnter,delete r.unmountOnExit,delete r.appear,delete r.enter,delete r.exit,delete r.timeout,delete r.addEndListener,delete r.onEnter,delete r.onEntering,delete r.onEntered,delete r.onExit,delete r.onExiting,delete r.onExited,"function"==typeof n)return s.a.createElement(p.Provider,{value:null},n(e,r));var i=s.a.Children.only(n);return(s.a.createElement(p.Provider,{value:null},s.a.cloneElement(i,r)))},t}(s.a.Component);function y(){}h.contextType=p,h.propTypes={},h.defaultProps={in:!1,mountOnEnter:!1,unmountOnExit:!1,appear:!1,enter:!0,exit:!0,onEnter:y,onEntering:y,onEntered:y,onExit:y,onExiting:y,onExited:y},h.UNMOUNTED=0,h.EXITED=1,h.ENTERING=2,h.ENTERED=3,h.EXITING=4;var v=h,E=function(e,t){return e&&t&&t.split(" ").forEach((function(t){return r=t,void((n=e).classList?n.classList.remove(r):"string"==typeof n.className?n.className=a(n.className,r):n.setAttribute("class",a(n.className&&n.className.baseVal||"",r)));var n,r}))},b=function(e){function t(){for(var t,n=arguments.length,r=new Array(n),o=0;o<n;o++)r[o]=arguments[o];return(t=e.call.apply(e,[this].concat(r))||this).appliedClasses={appear:{},enter:{},exit:{}},t.onEnter=function(e,n){t.removeClasses(e,"exit"),t.addClass(e,n?"appear":"enter","base"),t.props.onEnter&&t.props.onEnter(e,n)},t.onEntering=function(e,n){var r=n?"appear":"enter";t.addClass(e,r,"active"),t.props.onEntering&&t.props.onEntering(e,n)},t.onEntered=function(e,n){var r=n?"appear":"enter";t.removeClasses(e,r),t.addClass(e,r,"done"),t.props.onEntered&&t.props.onEntered(e,n)},t.onExit=function(e){t.removeClasses(e,"appear"),t.removeClasses(e,"enter"),t.addClass(e,"exit","base"),t.props.onExit&&t.props.onExit(e)},t.onExiting=function(e){t.addClass(e,"exit","active"),t.props.onExiting&&t.props.onExiting(e)},t.onExited=function(e){t.removeClasses(e,"exit"),t.addClass(e,"exit","done"),t.props.onExited&&t.props.onExited(e)},t.getClassNames=function(e){var n=t.props.classNames,r="string"==typeof n,o=r?""+(r&&n?n+"-":"")+e:n[e];return{baseClassName:o,activeClassName:r?o+"-active":n[e+"Active"],doneClassName:r?o+"-done":n[e+"Done"]}},t}i(t,e);var n=t.prototype;return n.addClass=function(e,t,n){var r=this.getClassNames(t)[n+"ClassName"];"appear"===t&&"done"===n&&(r+=" "+this.getClassNames("enter").doneClassName),"active"===n&&e&&e.scrollTop,this.appliedClasses[t][n]=r,function(e,t){e&&t&&t.split(" ").forEach((function(t){return r=t,void((n=e).classList?n.classList.add(r):function(e,t){return e.classList?!!t&&e.classList.contains(t):-1!==(" "+(e.className.baseVal||e.className)+" ").indexOf(" "+t+" ")}(n,r)||("string"==typeof n.className?n.className=n.className+" "+r:n.setAttribute("class",(n.className&&n.className.baseVal||"")+" "+r)));var n,r}))}(e,r)},n.removeClasses=function(e,t){var n=this.appliedClasses[t],r=n.base,o=n.active,i=n.done;this.appliedClasses[t]={},r&&E(e,r),o&&E(e,o),i&&E(e,i)},n.render=function(){var e=this.props,t=(e.classNames,o(e,["classNames"]));return s.a.createElement(v,r({},t,{onEnter:this.onEnter,onEntered:this.onEntered,onEntering:this.onEntering,onExit:this.onExit,onExiting:this.onExiting,onExited:this.onExited}))},t}(s.a.Component);b.defaultProps={classNames:""},b.propTypes={};var g=b;function x(e){if(void 0===e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return e}function C(e,t){var n=Object.create(null);return e&&l.Children.map(e,(function(e){return e})).forEach((function(e){n[e.key]=function(e){return t&&Object(l.isValidElement)(e)?t(e):e}(e)})),n}function O(e,t,n){return null!=n[t]?n[t]:e.props[t]}function M(e,t,n){var r=C(e.children),o=function(e,t){function n(n){return n in t?t[n]:e[n]}e=e||{},t=t||{};var r,o=Object.create(null),i=[];for(var a in e)a in t?i.length&&(o[a]=i,i=[]):i.push(a);var l={};for(var s in t){if(o[s])for(r=0;r<o[s].length;r++){var u=o[s][r];l[o[s][r]]=n(u)}l[s]=n(s)}for(r=0;r<i.length;r++)l[i[r]]=n(i[r]);return l}(t,r);return Object.keys(o).forEach((function(i){var a=o[i];if(Object(l.isValidElement)(a)){var s=i in t,u=i in r,c=t[i],d=Object(l.isValidElement)(c)&&!c.props.in;!u||s&&!d?u||!s||d?u&&s&&Object(l.isValidElement)(c)&&(o[i]=Object(l.cloneElement)(a,{onExited:n.bind(null,a),in:c.props.in,exit:O(a,"exit",e),enter:O(a,"enter",e)})):o[i]=Object(l.cloneElement)(a,{in:!1}):o[i]=Object(l.cloneElement)(a,{onExited:n.bind(null,a),in:!0,exit:O(a,"exit",e),enter:O(a,"enter",e)})}})),o}var S=Object.values||function(e){return Object.keys(e).map((function(t){return e[t]}))},k=function(e){function t(t,n){var r,o=(r=e.call(this,t,n)||this).handleExited.bind(x(x(r)));return r.state={contextValue:{isMounting:!0},handleExited:o,firstRender:!0},r}i(t,e);var n=t.prototype;return n.componentDidMount=function(){this.mounted=!0,this.setState({contextValue:{isMounting:!1}})},n.componentWillUnmount=function(){this.mounted=!1},t.getDerivedStateFromProps=function(e,t){var n,r,o=t.children,i=t.handleExited;return{children:t.firstRender?(n=e,r=i,C(n.children,(function(e){return Object(l.cloneElement)(e,{onExited:r.bind(null,e),in:!0,appear:O(e,"appear",n),enter:O(e,"enter",n),exit:O(e,"exit",n)})}))):M(e,o,i),firstRender:!1}},n.handleExited=function(e,t){var n=C(this.props.children);e.key in n||(e.props.onExited&&e.props.onExited(t),this.mounted&&this.setState((function(t){var n=r({},t.children);return delete n[e.key],{children:n}})))},n.render=function(){var e=this.props,t=e.component,n=e.childFactory,r=o(e,["component","childFactory"]),i=this.state.contextValue,a=S(this.state.children).map(n);return delete r.appear,delete r.enter,delete r.exit,null===t?s.a.createElement(p.Provider,{value:i},a):s.a.createElement(p.Provider,{value:i},s.a.createElement(t,r,a))},t}(s.a.Component);k.propTypes={},k.defaultProps={component:"div",childFactory:function(e){return e}};var T=k,j=function(e){function t(){for(var t,n=arguments.length,r=new Array(n),o=0;o<n;o++)r[o]=arguments[o];return(t=e.call.apply(e,[this].concat(r))||this).handleEnter=function(){for(var e=arguments.length,n=new Array(e),r=0;r<e;r++)n[r]=arguments[r];return t.handleLifecycle("onEnter",0,n)},t.handleEntering=function(){for(var e=arguments.length,n=new Array(e),r=0;r<e;r++)n[r]=arguments[r];return t.handleLifecycle("onEntering",0,n)},t.handleEntered=function(){for(var e=arguments.length,n=new Array(e),r=0;r<e;r++)n[r]=arguments[r];return t.handleLifecycle("onEntered",0,n)},t.handleExit=function(){for(var e=arguments.length,n=new Array(e),r=0;r<e;r++)n[r]=arguments[r];return t.handleLifecycle("onExit",1,n)},t.handleExiting=function(){for(var e=arguments.length,n=new Array(e),r=0;r<e;r++)n[r]=arguments[r];return t.handleLifecycle("onExiting",1,n)},t.handleExited=function(){for(var e=arguments.length,n=new Array(e),r=0;r<e;r++)n[r]=arguments[r];return t.handleLifecycle("onExited",1,n)},t}i(t,e);var n=t.prototype;return n.handleLifecycle=function(e,t,n){var r,o=this.props.children,i=s.a.Children.toArray(o)[t];i.props[e]&&(r=i.props)[e].apply(r,n),this.props[e]&&this.props[e](c.a.findDOMNode(this))},n.render=function(){var e=this.props,t=e.children,n=e.in,r=o(e,["children","in"]),i=s.a.Children.toArray(t),a=i[0],l=i[1];return delete r.onEnter,delete r.onEntering,delete r.onEntered,delete r.onExit,delete r.onExiting,delete r.onExited,s.a.createElement(T,r,n?s.a.cloneElement(a,{key:"first",onEnter:this.handleEnter,onEntering:this.handleEntering,onEntered:this.handleEntered}):s.a.cloneElement(l,{key:"second",onEnter:this.handleExit,onEntering:this.handleExiting,onEntered:this.handleExited}))},t}(s.a.Component);j.propTypes={};var P,w,N=j;var _="out-in",V="in-out",D=function(e,t,n){return function(){var r;e.props[t]&&(r=e.props)[t].apply(r,arguments),n()}},L=((P={})[_]=function(e){var t=e.current,n=e.changeState;return s.a.cloneElement(t,{in:!1,onExited:D(t,"onExited",(function(){n(f,null)}))})},P[V]=function(e){var t=e.current,n=e.changeState,r=e.children;return[t,s.a.cloneElement(r,{in:!0,onEntered:D(r,"onEntered",(function(){n(f)}))})]},P),A=((w={})[_]=function(e){var t=e.children,n=e.changeState;return s.a.cloneElement(t,{in:!0,onEntered:D(t,"onEntered",(function(){n(m,s.a.cloneElement(t,{in:!0}))}))})},w[V]=function(e){var t=e.current,n=e.children,r=e.changeState;return[s.a.cloneElement(t,{in:!1,onExited:D(t,"onExited",(function(){r(m,s.a.cloneElement(n,{in:!0}))}))}),s.a.cloneElement(n,{in:!0})]},w),F=function(e){function t(){for(var t,n=arguments.length,r=new Array(n),o=0;o<n;o++)r[o]=arguments[o];return(t=e.call.apply(e,[this].concat(r))||this).state={status:m,current:null},t.appeared=!1,t.changeState=function(e,n){void 0===n&&(n=t.state.current),t.setState({status:e,current:n})},t}i(t,e);var n=t.prototype;return n.componentDidMount=function(){this.appeared=!0},t.getDerivedStateFromProps=function(e,t){return null==e.children?{current:null}:t.status===f&&e.mode===V?{status:f}:!t.current||(n=t.current,r=e.children,n===r||s.a.isValidElement(n)&&s.a.isValidElement(r)&&null!=n.key&&n.key===r.key)?{current:s.a.cloneElement(e.children,{in:!0})}:{status:"exiting"};var n,r},n.render=function(){var e,t=this.props,n=t.children,r=t.mode,o=this.state,i=o.status,a=o.current,l={children:n,current:a,changeState:this.changeState,status:i};switch(i){case f:e=A[r](l);break;case"exiting":e=L[r](l);break;case m:e=a}return s.a.createElement(p.Provider,{value:{isMounting:!this.appeared}},e)},t}(s.a.Component);F.propTypes={},F.defaultProps={mode:_};var H=F;n.d(t,"CSSTransition",(function(){return g})),n.d(t,"ReplaceTransition",(function(){return N})),n.d(t,"SwitchTransition",(function(){return H})),n.d(t,"TransitionGroup",(function(){return T})),n.d(t,"Transition",(function(){return v})),n.d(t,"config",(function(){return d}))}])}));
+!function(e,t){if("object"==typeof exports&&"object"==typeof module)module.exports=t(require("react"),require("prop-types"),require("react-dom"),require("@devseed-ui/button"),require("styled-components"),require("@devseed-ui/theme-provider"));else if("function"==typeof define&&define.amd)define(["react","prop-types","react-dom","@devseed-ui/button","styled-components","@devseed-ui/theme-provider"],t);else{var n="object"==typeof exports?t(require("react"),require("prop-types"),require("react-dom"),require("@devseed-ui/button"),require("styled-components"),require("@devseed-ui/theme-provider")):t(e.react,e["prop-types"],e["react-dom"],e["@devseed-ui/button"],e["styled-components"],e["@devseed-ui/theme-provider"]);for(var r in n)("object"==typeof exports?exports:e)[r]=n[r]}}(global,(function(e,t,n,r,o,i){return function(e){var t={};function n(r){if(t[r])return t[r].exports;var o=t[r]={i:r,l:!1,exports:{}};return e[r].call(o.exports,o,o.exports,n),o.l=!0,o.exports}return n.m=e,n.c=t,n.d=function(e,t,r){n.o(e,t)||Object.defineProperty(e,t,{enumerable:!0,get:r})},n.r=function(e){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},n.t=function(e,t){if(1&t&&(e=n(e)),8&t)return e;if(4&t&&"object"==typeof e&&e&&e.__esModule)return e;var r=Object.create(null);if(n.r(r),Object.defineProperty(r,"default",{enumerable:!0,value:e}),2&t&&"string"!=typeof e)for(var o in e)n.d(r,o,function(t){return e[t]}.bind(null,o));return r},n.n=function(e){var t=e&&e.__esModule?function(){return e.default}:function(){return e};return n.d(t,"a",t),t},n.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},n.p="",n(n.s=3)}([function(t,n){t.exports=e},function(e,n){e.exports=t},function(e,t){e.exports=n},function(e,t,n){"use strict";function r(e){return(r="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e})(e)}Object.defineProperty(t,"__esModule",{value:!0}),t.Modal=f,Object.defineProperty(t,"ModalHeader",{enumerable:!0,get:function(){return u.ModalHeader}}),Object.defineProperty(t,"ModalHeadline",{enumerable:!0,get:function(){return u.ModalHeadline}}),Object.defineProperty(t,"ModalToolbar",{enumerable:!0,get:function(){return u.ModalToolbar}}),Object.defineProperty(t,"ModalBody",{enumerable:!0,get:function(){return u.ModalBody}}),Object.defineProperty(t,"ModalFooter",{enumerable:!0,get:function(){return u.ModalFooter}});var o=function(e){if(e&&e.__esModule)return e;if(null===e||"object"!==r(e)&&"function"!=typeof e)return{default:e};var t=c();if(t&&t.has(e))return t.get(e);var n={},o=Object.defineProperty&&Object.getOwnPropertyDescriptor;for(var i in e)if(Object.prototype.hasOwnProperty.call(e,i)){var a=o?Object.getOwnPropertyDescriptor(e,i):null;a&&(a.get||a.set)?Object.defineProperty(n,i,a):n[i]=e[i]}n.default=e,t&&t.set(e,n);return n}(n(0)),i=n(2),a=n(1),l=n(9),s=n(5),u=n(6);function c(){if("function"!=typeof WeakMap)return null;var e=new WeakMap;return c=function(){return e},e}function d(e,t){return function(e){if(Array.isArray(e))return e}(e)||function(e,t){if(!(Symbol.iterator in Object(e)||"[object Arguments]"===Object.prototype.toString.call(e)))return;var n=[],r=!0,o=!1,i=void 0;try{for(var a,l=e[Symbol.iterator]();!(r=(a=l.next()).done)&&(n.push(a.value),!t||n.length!==t);r=!0);}catch(e){o=!0,i=e}finally{try{r||null==l.return||l.return()}finally{if(o)throw i}}return n}(e,t)||function(){throw new TypeError("Invalid attempt to destructure non-iterable instance")}()}var p=function(e){var t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{},n=arguments.length>2&&void 0!==arguments[2]?arguments[2]:null;return"function"==typeof e?e(t):n};function f(e){var t=e.id,n=e.title,r=e.content,a=e.footerContent,c=e.closeButton,m=e.size,h=e.revealed,y=e.className,v=e.onCloseClick,E=e.onOverlayClick,b=e.renderContents,g=e.renderHeader,x=e.renderHeadline,C=e.renderToolbar,O=e.renderBody,M=e.renderFooter,S=(0,o.useRef)(f.generateUUID()),k=d((0,o.useState)(!1),2),T=k[0],j=k[1],P=d((0,o.useState)(null),2),w=P[0],N=P[1];if((0,o.useEffect)((function(){var e=function(e){h&&27===e.keyCode&&(e.preventDefault(),v(e))};return document.addEventListener("keyup",e),function(){document.removeEventListener("keyup",e)}}),[h]),(0,o.useEffect)((function(){var e=document.createElement("div");return e.className="modal-portal-".concat(S.current),document.body.appendChild(e),N(e),j(!0),function(){document.body.removeChild(e)}}),[]),!T)return null;var _=["modal",y],D=function(e){e.preventDefault(),v(e)},V={close:D};return(0,i.createPortal)(o.default.createElement(l.CSSTransition,{in:h,appear:!0,unmountOnExit:!0,classNames:"modal",timeout:{enter:400,exit:400}},o.default.createElement(u.ModalWrapper,{className:_.join(" "),key:"modal-".concat(t),onClick:function(e){e.target===e.currentTarget&&"function"==typeof E&&E(e)},id:t,size:m},o.default.createElement(u.BodyUnscrollable,{revealed:h}),o.default.createElement(u.ModalContents,{className:"modal__contents",size:m},p(b,V,o.default.createElement(o.default.Fragment,null,p(g,V,o.default.createElement(u.ModalHeader,null,p(x,V,o.default.createElement(u.ModalHeadline,null,o.default.createElement("h1",null,n))),p(C,V,c&&o.default.createElement(u.ModalToolbar,null,o.default.createElement(s.Button,{useIcon:"xmark--small",size:"small",hideText:!0,onClick:D},"Close"))))),p(O,V,o.default.createElement(u.ModalBody,null,r)),p(M,V,a?o.default.createElement(u.ModalFooter,null,a):null)))))),w)}f.generateUUID=function(){return Math.random().toString(36).substr(2,5)},f.defaultProps={closeButton:!0,revealed:!1,size:"medium",onOverlayClick:function(){0},onCloseClick:function(){0}},f.propTypes={id:a.PropTypes.string.isRequired,revealed:a.PropTypes.bool,className:a.PropTypes.string,size:a.PropTypes.string,onOverlayClick:a.PropTypes.func,onCloseClick:a.PropTypes.func,closeButton:a.PropTypes.bool,title:a.PropTypes.string,renderContents:a.PropTypes.func,renderHeader:a.PropTypes.func,renderHeadline:a.PropTypes.func,renderToolbar:a.PropTypes.func,renderBody:a.PropTypes.func,content:a.PropTypes.node,renderFooter:a.PropTypes.func,footerContent:a.PropTypes.node}},,function(e,t){e.exports=r},function(e,t,n){"use strict";function r(e){return(r="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e})(e)}Object.defineProperty(t,"__esModule",{value:!0}),t.ModalFooter=t.ModalBody=t.ModalToolbar=t.ModalHeadline=t.ModalHeader=t.BodyUnscrollable=t.ModalWrapper=t.ModalContents=void 0;var o=function(e){if(e&&e.__esModule)return e;if(null===e||"object"!==r(e)&&"function"!=typeof e)return{default:e};var t=a();if(t&&t.has(e))return t.get(e);var n={},o=Object.defineProperty&&Object.getOwnPropertyDescriptor;for(var i in e)if(Object.prototype.hasOwnProperty.call(e,i)){var l=o?Object.getOwnPropertyDescriptor(e,i):null;l&&(l.get||l.set)?Object.defineProperty(n,i,l):n[i]=e[i]}n.default=e,t&&t.set(e,n);return n}(n(7)),i=n(8);function a(){if("function"!=typeof WeakMap)return null;var e=new WeakMap;return a=function(){return e},e}function l(){var e=function(e,t){t||(t=e.slice(0));return Object.freeze(Object.defineProperties(e,{raw:{value:Object.freeze(t)}}))}(["\n  ","\n"]);return l=function(){return e},e}var s={small:"32rem",medium:"48rem",large:"64rem",xlarge:"80rem",full:"100%",fullscreen:"100%"},u=o.default.div.withConfig({displayName:"styled__ModalContents",componentId:"sc-1f8l41k-0"})(["display:grid;grid-template-columns:100%;grid-template-rows:",";background:",";border-radius:",";width:100%;margin:",";box-shadow:0 0 32px 2px ",",0 16px 48px -16px ",";"," > *:last-child{margin-bottom:0;}"],(function(e){return"fullscreen"===e.size?"3rem auto":"auto"}),(0,i.themeVal)("color.surface"),(0,i.themeVal)("shape.rounded"),(function(e){return"fullscreen"===e.size?0:"auto"}),(0,i.rgba)((0,i.themeVal)("type.base.color"),.04),(0,i.rgba)((0,i.themeVal)("type.base.color"),.12),(function(e){var t=e.size;return"max-width: ".concat(s[t],";")}));t.ModalContents=u;var c=o.default.section.withConfig({displayName:"styled__ModalWrapper",componentId:"sc-1f8l41k-1"})(["display:flex;position:fixed;top:0;bottom:0;left:0;right:0;z-index:9990;overflow-y:auto;opacity:1;visibility:visible;background:",";transform:translate3d(0,0,0);padding:",";&.modal-appear,&.modal-enter{opacity:0;visibility:hidden;}&.modal-enter-appear,&.modal-enter-active{transition:opacity 0.32s ease 0.1s,visibility 0.32s linear 0.1s;opacity:1;visibility:visible;}&.modal-exit{opacity:1;visibility:visible;}&.modal-exit-active{transition:opacity 0.32s ease 0.1s,visibility 0.32s linear 0.1s;opacity:0;visibility:hidden;}"],(0,i.themeVal)("color.baseAlphaD"),(function(e){return"fullscreen"===e.size?0:(0,i.glsp)(2)}));t.ModalWrapper=c;var d=(0,o.createGlobalStyle)(l(),(function(e){return e.revealed&&"\n    body {\n      overflow-y: hidden;\n    }\n  "}));t.BodyUnscrollable=d;var p=o.default.header.withConfig({displayName:"styled__ModalHeader",componentId:"sc-1f8l41k-2"})(["display:flex;flex-flow:row nowrap;align-items:center;background:#fff;padding:",";border-radius:"," "," 0 0;& > *:last-child{margin-bottom:0;}"],(0,i.glsp)(2),(0,i.themeVal)("shape.rounded"),(0,i.themeVal)("shape.rounded"));t.ModalHeader=p;var f=o.default.div.withConfig({displayName:"styled__ModalHeadline",componentId:"sc-1f8l41k-3"})(["display:flex;flex-flow:column nowrap;h1{font-size:1.25rem;line-height:2rem;margin:0;}"]);t.ModalHeadline=f;var m=o.default.div.withConfig({displayName:"styled__ModalToolbar",componentId:"sc-1f8l41k-4"})(["display:flex;flex-flow:row nowrap;margin-left:auto;align-items:center;align-self:flex-start;padding:"," 0 "," ",";"],(0,i.glsp)(1/8),(0,i.glsp)(1/8),(0,i.glsp)());t.ModalToolbar=m;var h=o.default.div.withConfig({displayName:"styled__ModalBody",componentId:"sc-1f8l41k-5"})(["padding:0 ",";&:first-child{padding-top:",";}&:last-child{padding-bottom:",";}& > *:last-child{margin-bottom:0;}"],(0,i.glsp)(2),(0,i.glsp)(2),(0,i.glsp)(2));t.ModalBody=h;var y=o.default.footer.withConfig({displayName:"styled__ModalFooter",componentId:"sc-1f8l41k-6"})(["display:flex;flex-flow:row nowrap;align-items:center;background:#fff;padding:",";border-radius:0 0 "," ",";> a,> button{margin-right:",";min-width:7rem;}& > *:last-child{margin-bottom:0;}"],(0,i.glsp)(2),(0,i.themeVal)("shape.rounded"),(0,i.themeVal)("shape.rounded"),(0,i.glsp)());t.ModalFooter=y},function(e,t){e.exports=o},function(e,t){e.exports=i},function(e,t,n){"use strict";function r(){return(r=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var r in n)Object.prototype.hasOwnProperty.call(n,r)&&(e[r]=n[r])}return e}).apply(this,arguments)}function o(e,t){if(null==e)return{};var n,r,o={},i=Object.keys(e);for(r=0;r<i.length;r++)n=i[r],t.indexOf(n)>=0||(o[n]=e[n]);return o}function i(e,t){e.prototype=Object.create(t.prototype),e.prototype.constructor=e,e.__proto__=t}n.r(t);n(1);function a(e,t){return e.replace(new RegExp("(^|\\s)"+t+"(?:\\s|$)","g"),"$1").replace(/\s+/g," ").replace(/^\s*|\s*$/g,"")}var l=n(0),s=n.n(l),u=n(2),c=n.n(u),d={disabled:!1},p=s.a.createContext(null),f="entering",m="entered",h=function(e){function t(t,n){var r;r=e.call(this,t,n)||this;var o,i=n&&!n.isMounting?t.enter:t.appear;return r.appearStatus=null,t.in?i?(o="exited",r.appearStatus=f):o=m:o=t.unmountOnExit||t.mountOnEnter?"unmounted":"exited",r.state={status:o},r.nextCallback=null,r}i(t,e),t.getDerivedStateFromProps=function(e,t){return e.in&&"unmounted"===t.status?{status:"exited"}:null};var n=t.prototype;return n.componentDidMount=function(){this.updateStatus(!0,this.appearStatus)},n.componentDidUpdate=function(e){var t=null;if(e!==this.props){var n=this.state.status;this.props.in?n!==f&&n!==m&&(t=f):n!==f&&n!==m||(t="exiting")}this.updateStatus(!1,t)},n.componentWillUnmount=function(){this.cancelNextCallback()},n.getTimeouts=function(){var e,t,n,r=this.props.timeout;return e=t=n=r,null!=r&&"number"!=typeof r&&(e=r.exit,t=r.enter,n=void 0!==r.appear?r.appear:t),{exit:e,enter:t,appear:n}},n.updateStatus=function(e,t){if(void 0===e&&(e=!1),null!==t){this.cancelNextCallback();var n=c.a.findDOMNode(this);t===f?this.performEnter(n,e):this.performExit(n)}else this.props.unmountOnExit&&"exited"===this.state.status&&this.setState({status:"unmounted"})},n.performEnter=function(e,t){var n=this,r=this.props.enter,o=this.context?this.context.isMounting:t,i=this.getTimeouts(),a=o?i.appear:i.enter;!t&&!r||d.disabled?this.safeSetState({status:m},(function(){n.props.onEntered(e)})):(this.props.onEnter(e,o),this.safeSetState({status:f},(function(){n.props.onEntering(e,o),n.onTransitionEnd(e,a,(function(){n.safeSetState({status:m},(function(){n.props.onEntered(e,o)}))}))})))},n.performExit=function(e){var t=this,n=this.props.exit,r=this.getTimeouts();n&&!d.disabled?(this.props.onExit(e),this.safeSetState({status:"exiting"},(function(){t.props.onExiting(e),t.onTransitionEnd(e,r.exit,(function(){t.safeSetState({status:"exited"},(function(){t.props.onExited(e)}))}))}))):this.safeSetState({status:"exited"},(function(){t.props.onExited(e)}))},n.cancelNextCallback=function(){null!==this.nextCallback&&(this.nextCallback.cancel(),this.nextCallback=null)},n.safeSetState=function(e,t){t=this.setNextCallback(t),this.setState(e,t)},n.setNextCallback=function(e){var t=this,n=!0;return this.nextCallback=function(r){n&&(n=!1,t.nextCallback=null,e(r))},this.nextCallback.cancel=function(){n=!1},this.nextCallback},n.onTransitionEnd=function(e,t,n){this.setNextCallback(n);var r=null==t&&!this.props.addEndListener;e&&!r?(this.props.addEndListener&&this.props.addEndListener(e,this.nextCallback),null!=t&&setTimeout(this.nextCallback,t)):setTimeout(this.nextCallback,0)},n.render=function(){var e=this.state.status;if("unmounted"===e)return null;var t=this.props,n=t.children,r=o(t,["children"]);if(delete r.in,delete r.mountOnEnter,delete r.unmountOnExit,delete r.appear,delete r.enter,delete r.exit,delete r.timeout,delete r.addEndListener,delete r.onEnter,delete r.onEntering,delete r.onEntered,delete r.onExit,delete r.onExiting,delete r.onExited,"function"==typeof n)return s.a.createElement(p.Provider,{value:null},n(e,r));var i=s.a.Children.only(n);return(s.a.createElement(p.Provider,{value:null},s.a.cloneElement(i,r)))},t}(s.a.Component);function y(){}h.contextType=p,h.propTypes={},h.defaultProps={in:!1,mountOnEnter:!1,unmountOnExit:!1,appear:!1,enter:!0,exit:!0,onEnter:y,onEntering:y,onEntered:y,onExit:y,onExiting:y,onExited:y},h.UNMOUNTED=0,h.EXITED=1,h.ENTERING=2,h.ENTERED=3,h.EXITING=4;var v=h,E=function(e,t){return e&&t&&t.split(" ").forEach((function(t){return r=t,void((n=e).classList?n.classList.remove(r):"string"==typeof n.className?n.className=a(n.className,r):n.setAttribute("class",a(n.className&&n.className.baseVal||"",r)));var n,r}))},b=function(e){function t(){for(var t,n=arguments.length,r=new Array(n),o=0;o<n;o++)r[o]=arguments[o];return(t=e.call.apply(e,[this].concat(r))||this).appliedClasses={appear:{},enter:{},exit:{}},t.onEnter=function(e,n){t.removeClasses(e,"exit"),t.addClass(e,n?"appear":"enter","base"),t.props.onEnter&&t.props.onEnter(e,n)},t.onEntering=function(e,n){var r=n?"appear":"enter";t.addClass(e,r,"active"),t.props.onEntering&&t.props.onEntering(e,n)},t.onEntered=function(e,n){var r=n?"appear":"enter";t.removeClasses(e,r),t.addClass(e,r,"done"),t.props.onEntered&&t.props.onEntered(e,n)},t.onExit=function(e){t.removeClasses(e,"appear"),t.removeClasses(e,"enter"),t.addClass(e,"exit","base"),t.props.onExit&&t.props.onExit(e)},t.onExiting=function(e){t.addClass(e,"exit","active"),t.props.onExiting&&t.props.onExiting(e)},t.onExited=function(e){t.removeClasses(e,"exit"),t.addClass(e,"exit","done"),t.props.onExited&&t.props.onExited(e)},t.getClassNames=function(e){var n=t.props.classNames,r="string"==typeof n,o=r?""+(r&&n?n+"-":"")+e:n[e];return{baseClassName:o,activeClassName:r?o+"-active":n[e+"Active"],doneClassName:r?o+"-done":n[e+"Done"]}},t}i(t,e);var n=t.prototype;return n.addClass=function(e,t,n){var r=this.getClassNames(t)[n+"ClassName"];"appear"===t&&"done"===n&&(r+=" "+this.getClassNames("enter").doneClassName),"active"===n&&e&&e.scrollTop,this.appliedClasses[t][n]=r,function(e,t){e&&t&&t.split(" ").forEach((function(t){return r=t,void((n=e).classList?n.classList.add(r):function(e,t){return e.classList?!!t&&e.classList.contains(t):-1!==(" "+(e.className.baseVal||e.className)+" ").indexOf(" "+t+" ")}(n,r)||("string"==typeof n.className?n.className=n.className+" "+r:n.setAttribute("class",(n.className&&n.className.baseVal||"")+" "+r)));var n,r}))}(e,r)},n.removeClasses=function(e,t){var n=this.appliedClasses[t],r=n.base,o=n.active,i=n.done;this.appliedClasses[t]={},r&&E(e,r),o&&E(e,o),i&&E(e,i)},n.render=function(){var e=this.props,t=(e.classNames,o(e,["classNames"]));return s.a.createElement(v,r({},t,{onEnter:this.onEnter,onEntered:this.onEntered,onEntering:this.onEntering,onExit:this.onExit,onExiting:this.onExiting,onExited:this.onExited}))},t}(s.a.Component);b.defaultProps={classNames:""},b.propTypes={};var g=b;function x(e){if(void 0===e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return e}function C(e,t){var n=Object.create(null);return e&&l.Children.map(e,(function(e){return e})).forEach((function(e){n[e.key]=function(e){return t&&Object(l.isValidElement)(e)?t(e):e}(e)})),n}function O(e,t,n){return null!=n[t]?n[t]:e.props[t]}function M(e,t,n){var r=C(e.children),o=function(e,t){function n(n){return n in t?t[n]:e[n]}e=e||{},t=t||{};var r,o=Object.create(null),i=[];for(var a in e)a in t?i.length&&(o[a]=i,i=[]):i.push(a);var l={};for(var s in t){if(o[s])for(r=0;r<o[s].length;r++){var u=o[s][r];l[o[s][r]]=n(u)}l[s]=n(s)}for(r=0;r<i.length;r++)l[i[r]]=n(i[r]);return l}(t,r);return Object.keys(o).forEach((function(i){var a=o[i];if(Object(l.isValidElement)(a)){var s=i in t,u=i in r,c=t[i],d=Object(l.isValidElement)(c)&&!c.props.in;!u||s&&!d?u||!s||d?u&&s&&Object(l.isValidElement)(c)&&(o[i]=Object(l.cloneElement)(a,{onExited:n.bind(null,a),in:c.props.in,exit:O(a,"exit",e),enter:O(a,"enter",e)})):o[i]=Object(l.cloneElement)(a,{in:!1}):o[i]=Object(l.cloneElement)(a,{onExited:n.bind(null,a),in:!0,exit:O(a,"exit",e),enter:O(a,"enter",e)})}})),o}var S=Object.values||function(e){return Object.keys(e).map((function(t){return e[t]}))},k=function(e){function t(t,n){var r,o=(r=e.call(this,t,n)||this).handleExited.bind(x(x(r)));return r.state={contextValue:{isMounting:!0},handleExited:o,firstRender:!0},r}i(t,e);var n=t.prototype;return n.componentDidMount=function(){this.mounted=!0,this.setState({contextValue:{isMounting:!1}})},n.componentWillUnmount=function(){this.mounted=!1},t.getDerivedStateFromProps=function(e,t){var n,r,o=t.children,i=t.handleExited;return{children:t.firstRender?(n=e,r=i,C(n.children,(function(e){return Object(l.cloneElement)(e,{onExited:r.bind(null,e),in:!0,appear:O(e,"appear",n),enter:O(e,"enter",n),exit:O(e,"exit",n)})}))):M(e,o,i),firstRender:!1}},n.handleExited=function(e,t){var n=C(this.props.children);e.key in n||(e.props.onExited&&e.props.onExited(t),this.mounted&&this.setState((function(t){var n=r({},t.children);return delete n[e.key],{children:n}})))},n.render=function(){var e=this.props,t=e.component,n=e.childFactory,r=o(e,["component","childFactory"]),i=this.state.contextValue,a=S(this.state.children).map(n);return delete r.appear,delete r.enter,delete r.exit,null===t?s.a.createElement(p.Provider,{value:i},a):s.a.createElement(p.Provider,{value:i},s.a.createElement(t,r,a))},t}(s.a.Component);k.propTypes={},k.defaultProps={component:"div",childFactory:function(e){return e}};var T=k,j=function(e){function t(){for(var t,n=arguments.length,r=new Array(n),o=0;o<n;o++)r[o]=arguments[o];return(t=e.call.apply(e,[this].concat(r))||this).handleEnter=function(){for(var e=arguments.length,n=new Array(e),r=0;r<e;r++)n[r]=arguments[r];return t.handleLifecycle("onEnter",0,n)},t.handleEntering=function(){for(var e=arguments.length,n=new Array(e),r=0;r<e;r++)n[r]=arguments[r];return t.handleLifecycle("onEntering",0,n)},t.handleEntered=function(){for(var e=arguments.length,n=new Array(e),r=0;r<e;r++)n[r]=arguments[r];return t.handleLifecycle("onEntered",0,n)},t.handleExit=function(){for(var e=arguments.length,n=new Array(e),r=0;r<e;r++)n[r]=arguments[r];return t.handleLifecycle("onExit",1,n)},t.handleExiting=function(){for(var e=arguments.length,n=new Array(e),r=0;r<e;r++)n[r]=arguments[r];return t.handleLifecycle("onExiting",1,n)},t.handleExited=function(){for(var e=arguments.length,n=new Array(e),r=0;r<e;r++)n[r]=arguments[r];return t.handleLifecycle("onExited",1,n)},t}i(t,e);var n=t.prototype;return n.handleLifecycle=function(e,t,n){var r,o=this.props.children,i=s.a.Children.toArray(o)[t];i.props[e]&&(r=i.props)[e].apply(r,n),this.props[e]&&this.props[e](c.a.findDOMNode(this))},n.render=function(){var e=this.props,t=e.children,n=e.in,r=o(e,["children","in"]),i=s.a.Children.toArray(t),a=i[0],l=i[1];return delete r.onEnter,delete r.onEntering,delete r.onEntered,delete r.onExit,delete r.onExiting,delete r.onExited,s.a.createElement(T,r,n?s.a.cloneElement(a,{key:"first",onEnter:this.handleEnter,onEntering:this.handleEntering,onEntered:this.handleEntered}):s.a.cloneElement(l,{key:"second",onEnter:this.handleExit,onEntering:this.handleExiting,onEntered:this.handleExited}))},t}(s.a.Component);j.propTypes={};var P,w,N=j;var _="out-in",D="in-out",V=function(e,t,n){return function(){var r;e.props[t]&&(r=e.props)[t].apply(r,arguments),n()}},L=((P={})[_]=function(e){var t=e.current,n=e.changeState;return s.a.cloneElement(t,{in:!1,onExited:V(t,"onExited",(function(){n(f,null)}))})},P[D]=function(e){var t=e.current,n=e.changeState,r=e.children;return[t,s.a.cloneElement(r,{in:!0,onEntered:V(r,"onEntered",(function(){n(f)}))})]},P),A=((w={})[_]=function(e){var t=e.children,n=e.changeState;return s.a.cloneElement(t,{in:!0,onEntered:V(t,"onEntered",(function(){n(m,s.a.cloneElement(t,{in:!0}))}))})},w[D]=function(e){var t=e.current,n=e.children,r=e.changeState;return[s.a.cloneElement(t,{in:!1,onExited:V(t,"onExited",(function(){r(m,s.a.cloneElement(n,{in:!0}))}))}),s.a.cloneElement(n,{in:!0})]},w),H=function(e){function t(){for(var t,n=arguments.length,r=new Array(n),o=0;o<n;o++)r[o]=arguments[o];return(t=e.call.apply(e,[this].concat(r))||this).state={status:m,current:null},t.appeared=!1,t.changeState=function(e,n){void 0===n&&(n=t.state.current),t.setState({status:e,current:n})},t}i(t,e);var n=t.prototype;return n.componentDidMount=function(){this.appeared=!0},t.getDerivedStateFromProps=function(e,t){return null==e.children?{current:null}:t.status===f&&e.mode===D?{status:f}:!t.current||(n=t.current,r=e.children,n===r||s.a.isValidElement(n)&&s.a.isValidElement(r)&&null!=n.key&&n.key===r.key)?{current:s.a.cloneElement(e.children,{in:!0})}:{status:"exiting"};var n,r},n.render=function(){var e,t=this.props,n=t.children,r=t.mode,o=this.state,i=o.status,a=o.current,l={children:n,current:a,changeState:this.changeState,status:i};switch(i){case f:e=A[r](l);break;case"exiting":e=L[r](l);break;case m:e=a}return s.a.createElement(p.Provider,{value:{isMounting:!this.appeared}},e)},t}(s.a.Component);H.propTypes={},H.defaultProps={mode:_};var B=H;n.d(t,"CSSTransition",(function(){return g})),n.d(t,"ReplaceTransition",(function(){return N})),n.d(t,"SwitchTransition",(function(){return B})),n.d(t,"TransitionGroup",(function(){return T})),n.d(t,"Transition",(function(){return v})),n.d(t,"config",(function(){return d}))}])}));

dist/index.web.js

@@ -1,1 +0,1 @@
-!function(e,t){if("object"==typeof exports&&"object"==typeof module)module.exports=t(require("react"),require("prop-types"),require("react-dom"),require("@devseed-ui/button"),require("styled-components"),require("polished"),require("@devseed-ui/theme-provider"));else if("function"==typeof define&&define.amd)define(["react","prop-types","react-dom","@devseed-ui/button","styled-components","polished","@devseed-ui/theme-provider"],t);else{var n="object"==typeof exports?t(require("react"),require("prop-types"),require("react-dom"),require("@devseed-ui/button"),require("styled-components"),require("polished"),require("@devseed-ui/theme-provider")):t(e.react,e["prop-types"],e["react-dom"],e["@devseed-ui/button"],e["styled-components"],e.polished,e["@devseed-ui/theme-provider"]);for(var r in n)("object"==typeof exports?exports:e)[r]=n[r]}}(window,(function(e,t,n,r,o,i,a){return function(e){var t={};function n(r){if(t[r])return t[r].exports;var o=t[r]={i:r,l:!1,exports:{}};return e[r].call(o.exports,o,o.exports,n),o.l=!0,o.exports}return n.m=e,n.c=t,n.d=function(e,t,r){n.o(e,t)||Object.defineProperty(e,t,{enumerable:!0,get:r})},n.r=function(e){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},n.t=function(e,t){if(1&t&&(e=n(e)),8&t)return e;if(4&t&&"object"==typeof e&&e&&e.__esModule)return e;var r=Object.create(null);if(n.r(r),Object.defineProperty(r,"default",{enumerable:!0,value:e}),2&t&&"string"!=typeof e)for(var o in e)n.d(r,o,function(t){return e[t]}.bind(null,o));return r},n.n=function(e){var t=e&&e.__esModule?function(){return e.default}:function(){return e};return n.d(t,"a",t),t},n.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},n.p="",n(n.s=3)}([function(t,n){t.exports=e},function(e,n){e.exports=t},function(e,t){e.exports=n},function(e,t,n){"use strict";function r(e){return(r="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e})(e)}Object.defineProperty(t,"__esModule",{value:!0}),t.Modal=f,Object.defineProperty(t,"ModalHeader",{enumerable:!0,get:function(){return u.ModalHeader}}),Object.defineProperty(t,"ModalHeadline",{enumerable:!0,get:function(){return u.ModalHeadline}}),Object.defineProperty(t,"ModalToolbar",{enumerable:!0,get:function(){return u.ModalToolbar}}),Object.defineProperty(t,"ModalBody",{enumerable:!0,get:function(){return u.ModalBody}}),Object.defineProperty(t,"ModalFooter",{enumerable:!0,get:function(){return u.ModalFooter}});var o=function(e){if(e&&e.__esModule)return e;if(null===e||"object"!==r(e)&&"function"!=typeof e)return{default:e};var t=c();if(t&&t.has(e))return t.get(e);var n={},o=Object.defineProperty&&Object.getOwnPropertyDescriptor;for(var i in e)if(Object.prototype.hasOwnProperty.call(e,i)){var a=o?Object.getOwnPropertyDescriptor(e,i):null;a&&(a.get||a.set)?Object.defineProperty(n,i,a):n[i]=e[i]}n.default=e,t&&t.set(e,n);return n}(n(0)),i=n(2),a=n(1),l=n(10),s=n(5),u=n(6);function c(){if("function"!=typeof WeakMap)return null;var e=new WeakMap;return c=function(){return e},e}function d(e,t){return function(e){if(Array.isArray(e))return e}(e)||function(e,t){if(!(Symbol.iterator in Object(e)||"[object Arguments]"===Object.prototype.toString.call(e)))return;var n=[],r=!0,o=!1,i=void 0;try{for(var a,l=e[Symbol.iterator]();!(r=(a=l.next()).done)&&(n.push(a.value),!t||n.length!==t);r=!0);}catch(e){o=!0,i=e}finally{try{r||null==l.return||l.return()}finally{if(o)throw i}}return n}(e,t)||function(){throw new TypeError("Invalid attempt to destructure non-iterable instance")}()}var p=function(e){var t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{},n=arguments.length>2&&void 0!==arguments[2]?arguments[2]:null;return"function"==typeof e?e(t):n};function f(e){var t=e.id,n=e.title,r=e.content,a=e.footerContent,c=e.closeButton,m=e.size,h=e.revealed,y=e.className,v=e.onCloseClick,E=e.onOverlayClick,b=e.renderContents,g=e.renderHeader,x=e.renderHeadline,C=e.renderToolbar,O=e.renderBody,M=e.renderFooter,S=(0,o.useRef)(f.generateUUID()),k=d((0,o.useState)(!1),2),T=k[0],w=k[1],j=d((0,o.useState)(null),2),P=j[0],N=j[1];if((0,o.useEffect)((function(){var e=function(e){h&&27===e.keyCode&&(e.preventDefault(),v(e))};return document.addEventListener("keyup",e),function(){document.removeEventListener("keyup",e)}}),[h]),(0,o.useEffect)((function(){var e=document.createElement("div");return e.className="modal-portal-".concat(S.current),document.body.appendChild(e),N(e),w(!0),function(){document.body.removeChild(e)}}),[]),!T)return null;var _=["modal",y],V=function(e){e.preventDefault(),v(e)},D={close:V};return(0,i.createPortal)(o.default.createElement(l.CSSTransition,{in:h,appear:!0,unmountOnExit:!0,classNames:"modal",timeout:{enter:400,exit:400}},o.default.createElement(u.ModalWrapper,{className:_.join(" "),key:"modal-".concat(t),onClick:function(e){e.target===e.currentTarget&&"function"==typeof E&&E(e)},id:t,size:m},o.default.createElement(u.BodyUnscrollable,{revealed:h}),o.default.createElement(u.ModalContents,{className:"modal__contents",size:m},p(b,D,o.default.createElement(o.default.Fragment,null,p(g,D,o.default.createElement(u.ModalHeader,null,p(x,D,o.default.createElement(u.ModalHeadline,null,o.default.createElement("h1",null,n))),p(C,D,c&&o.default.createElement(u.ModalToolbar,null,o.default.createElement(s.Button,{useIcon:"xmark--small",size:"small",hideText:!0,onClick:V},"Close"))))),p(O,D,o.default.createElement(u.ModalBody,null,r)),p(M,D,a?o.default.createElement(u.ModalFooter,null,a):null)))))),P)}f.generateUUID=function(){return Math.random().toString(36).substr(2,5)},f.defaultProps={closeButton:!0,revealed:!1,size:"medium",onOverlayClick:function(){0},onCloseClick:function(){0}},f.propTypes={id:a.PropTypes.string.isRequired,revealed:a.PropTypes.bool,className:a.PropTypes.string,size:a.PropTypes.string,onOverlayClick:a.PropTypes.func,onCloseClick:a.PropTypes.func,closeButton:a.PropTypes.bool,title:a.PropTypes.string,renderContents:a.PropTypes.func,renderHeader:a.PropTypes.func,renderHeadline:a.PropTypes.func,renderToolbar:a.PropTypes.func,renderBody:a.PropTypes.func,content:a.PropTypes.node,renderFooter:a.PropTypes.func,footerContent:a.PropTypes.node}},,function(e,t){e.exports=r},function(e,t,n){"use strict";function r(e){return(r="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e})(e)}Object.defineProperty(t,"__esModule",{value:!0}),t.ModalFooter=t.ModalBody=t.ModalToolbar=t.ModalHeadline=t.ModalHeader=t.BodyUnscrollable=t.ModalWrapper=t.ModalContents=void 0;var o=function(e){if(e&&e.__esModule)return e;if(null===e||"object"!==r(e)&&"function"!=typeof e)return{default:e};var t=l();if(t&&t.has(e))return t.get(e);var n={},o=Object.defineProperty&&Object.getOwnPropertyDescriptor;for(var i in e)if(Object.prototype.hasOwnProperty.call(e,i)){var a=o?Object.getOwnPropertyDescriptor(e,i):null;a&&(a.get||a.set)?Object.defineProperty(n,i,a):n[i]=e[i]}n.default=e,t&&t.set(e,n);return n}(n(7)),i=n(8),a=n(9);function l(){if("function"!=typeof WeakMap)return null;var e=new WeakMap;return l=function(){return e},e}function s(){var e=function(e,t){t||(t=e.slice(0));return Object.freeze(Object.defineProperties(e,{raw:{value:Object.freeze(t)}}))}(["\n  ","\n"]);return s=function(){return e},e}var u=(0,a.stylizeFunction)(i.rgba),c={small:"32rem",medium:"48rem",large:"64rem",xlarge:"80rem",full:"100%",fullscreen:"100%"},d=o.default.div.withConfig({displayName:"styled__ModalContents",componentId:"sc-1f8l41k-0"})(["display:grid;grid-template-columns:100%;grid-template-rows:",";background:",";border-radius:",";width:100%;margin:",";box-shadow:0 0 32px 2px ",",0 16px 48px -16px ",";"," > *:last-child{margin-bottom:0;}"],(function(e){return"fullscreen"===e.size?"3rem auto":"auto"}),(0,a.themeVal)("color.surface"),(0,a.themeVal)("shape.rounded"),(function(e){return"fullscreen"===e.size?0:"auto"}),u((0,a.themeVal)("type.base.color"),.04),u((0,a.themeVal)("type.base.color"),.12),(function(e){var t=e.size;return"max-width: ".concat(c[t],";")}));t.ModalContents=d;var p=o.default.section.withConfig({displayName:"styled__ModalWrapper",componentId:"sc-1f8l41k-1"})(["display:flex;position:fixed;top:0;bottom:0;left:0;right:0;z-index:9990;overflow-y:auto;opacity:1;visibility:visible;background:",";transform:translate3d(0,0,0);padding:",";&.modal-appear,&.modal-enter{opacity:0;visibility:hidden;}&.modal-enter-appear,&.modal-enter-active{transition:opacity 0.32s ease 0.1s,visibility 0.32s linear 0.1s;opacity:1;visibility:visible;}&.modal-exit{opacity:1;visibility:visible;}&.modal-exit-active{transition:opacity 0.32s ease 0.1s,visibility 0.32s linear 0.1s;opacity:0;visibility:hidden;}"],(0,a.themeVal)("color.smoke"),(function(e){return"fullscreen"===e.size?0:(0,a.glsp)(2)}));t.ModalWrapper=p;var f=(0,o.createGlobalStyle)(s(),(function(e){return e.revealed&&"\n    body {\n      overflow-y: hidden;\n    }\n  "}));t.BodyUnscrollable=f;var m=o.default.header.withConfig({displayName:"styled__ModalHeader",componentId:"sc-1f8l41k-2"})(["display:flex;flex-flow:row nowrap;align-items:center;background:#fff;padding:",";border-radius:"," "," 0 0;& > *:last-child{margin-bottom:0;}"],(0,a.glsp)(2),(0,a.themeVal)("shape.rounded"),(0,a.themeVal)("shape.rounded"));t.ModalHeader=m;var h=o.default.div.withConfig({displayName:"styled__ModalHeadline",componentId:"sc-1f8l41k-3"})(["display:flex;flex-flow:column nowrap;h1{font-size:1.25rem;line-height:2rem;margin:0;}"]);t.ModalHeadline=h;var y=o.default.div.withConfig({displayName:"styled__ModalToolbar",componentId:"sc-1f8l41k-4"})(["display:flex;flex-flow:row nowrap;margin-left:auto;align-items:center;align-self:flex-start;padding:"," 0 "," ",";"],(0,a.glsp)(1/8),(0,a.glsp)(1/8),(0,a.glsp)());t.ModalToolbar=y;var v=o.default.div.withConfig({displayName:"styled__ModalBody",componentId:"sc-1f8l41k-5"})(["padding:0 ",";&:first-child{padding-top:",";}&:last-child{padding-bottom:",";}& > *:last-child{margin-bottom:0;}"],(0,a.glsp)(2),(0,a.glsp)(2),(0,a.glsp)(2));t.ModalBody=v;var E=o.default.footer.withConfig({displayName:"styled__ModalFooter",componentId:"sc-1f8l41k-6"})(["display:flex;flex-flow:row nowrap;align-items:center;background:#fff;padding:",";border-radius:0 0 "," ",";> a,> button{margin-right:",";min-width:7rem;}& > *:last-child{margin-bottom:0;}"],(0,a.glsp)(2),(0,a.themeVal)("shape.rounded"),(0,a.themeVal)("shape.rounded"),(0,a.themeVal)("layout.space"));t.ModalFooter=E},function(e,t){e.exports=o},function(e,t){e.exports=i},function(e,t){e.exports=a},function(e,t,n){"use strict";function r(){return(r=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var r in n)Object.prototype.hasOwnProperty.call(n,r)&&(e[r]=n[r])}return e}).apply(this,arguments)}function o(e,t){if(null==e)return{};var n,r,o={},i=Object.keys(e);for(r=0;r<i.length;r++)n=i[r],t.indexOf(n)>=0||(o[n]=e[n]);return o}function i(e,t){e.prototype=Object.create(t.prototype),e.prototype.constructor=e,e.__proto__=t}n.r(t);n(1);function a(e,t){return e.replace(new RegExp("(^|\\s)"+t+"(?:\\s|$)","g"),"$1").replace(/\s+/g," ").replace(/^\s*|\s*$/g,"")}var l=n(0),s=n.n(l),u=n(2),c=n.n(u),d={disabled:!1},p=s.a.createContext(null),f="entering",m="entered",h=function(e){function t(t,n){var r;r=e.call(this,t,n)||this;var o,i=n&&!n.isMounting?t.enter:t.appear;return r.appearStatus=null,t.in?i?(o="exited",r.appearStatus=f):o=m:o=t.unmountOnExit||t.mountOnEnter?"unmounted":"exited",r.state={status:o},r.nextCallback=null,r}i(t,e),t.getDerivedStateFromProps=function(e,t){return e.in&&"unmounted"===t.status?{status:"exited"}:null};var n=t.prototype;return n.componentDidMount=function(){this.updateStatus(!0,this.appearStatus)},n.componentDidUpdate=function(e){var t=null;if(e!==this.props){var n=this.state.status;this.props.in?n!==f&&n!==m&&(t=f):n!==f&&n!==m||(t="exiting")}this.updateStatus(!1,t)},n.componentWillUnmount=function(){this.cancelNextCallback()},n.getTimeouts=function(){var e,t,n,r=this.props.timeout;return e=t=n=r,null!=r&&"number"!=typeof r&&(e=r.exit,t=r.enter,n=void 0!==r.appear?r.appear:t),{exit:e,enter:t,appear:n}},n.updateStatus=function(e,t){if(void 0===e&&(e=!1),null!==t){this.cancelNextCallback();var n=c.a.findDOMNode(this);t===f?this.performEnter(n,e):this.performExit(n)}else this.props.unmountOnExit&&"exited"===this.state.status&&this.setState({status:"unmounted"})},n.performEnter=function(e,t){var n=this,r=this.props.enter,o=this.context?this.context.isMounting:t,i=this.getTimeouts(),a=o?i.appear:i.enter;!t&&!r||d.disabled?this.safeSetState({status:m},(function(){n.props.onEntered(e)})):(this.props.onEnter(e,o),this.safeSetState({status:f},(function(){n.props.onEntering(e,o),n.onTransitionEnd(e,a,(function(){n.safeSetState({status:m},(function(){n.props.onEntered(e,o)}))}))})))},n.performExit=function(e){var t=this,n=this.props.exit,r=this.getTimeouts();n&&!d.disabled?(this.props.onExit(e),this.safeSetState({status:"exiting"},(function(){t.props.onExiting(e),t.onTransitionEnd(e,r.exit,(function(){t.safeSetState({status:"exited"},(function(){t.props.onExited(e)}))}))}))):this.safeSetState({status:"exited"},(function(){t.props.onExited(e)}))},n.cancelNextCallback=function(){null!==this.nextCallback&&(this.nextCallback.cancel(),this.nextCallback=null)},n.safeSetState=function(e,t){t=this.setNextCallback(t),this.setState(e,t)},n.setNextCallback=function(e){var t=this,n=!0;return this.nextCallback=function(r){n&&(n=!1,t.nextCallback=null,e(r))},this.nextCallback.cancel=function(){n=!1},this.nextCallback},n.onTransitionEnd=function(e,t,n){this.setNextCallback(n);var r=null==t&&!this.props.addEndListener;e&&!r?(this.props.addEndListener&&this.props.addEndListener(e,this.nextCallback),null!=t&&setTimeout(this.nextCallback,t)):setTimeout(this.nextCallback,0)},n.render=function(){var e=this.state.status;if("unmounted"===e)return null;var t=this.props,n=t.children,r=o(t,["children"]);if(delete r.in,delete r.mountOnEnter,delete r.unmountOnExit,delete r.appear,delete r.enter,delete r.exit,delete r.timeout,delete r.addEndListener,delete r.onEnter,delete r.onEntering,delete r.onEntered,delete r.onExit,delete r.onExiting,delete r.onExited,"function"==typeof n)return s.a.createElement(p.Provider,{value:null},n(e,r));var i=s.a.Children.only(n);return(s.a.createElement(p.Provider,{value:null},s.a.cloneElement(i,r)))},t}(s.a.Component);function y(){}h.contextType=p,h.propTypes={},h.defaultProps={in:!1,mountOnEnter:!1,unmountOnExit:!1,appear:!1,enter:!0,exit:!0,onEnter:y,onEntering:y,onEntered:y,onExit:y,onExiting:y,onExited:y},h.UNMOUNTED=0,h.EXITED=1,h.ENTERING=2,h.ENTERED=3,h.EXITING=4;var v=h,E=function(e,t){return e&&t&&t.split(" ").forEach((function(t){return r=t,void((n=e).classList?n.classList.remove(r):"string"==typeof n.className?n.className=a(n.className,r):n.setAttribute("class",a(n.className&&n.className.baseVal||"",r)));var n,r}))},b=function(e){function t(){for(var t,n=arguments.length,r=new Array(n),o=0;o<n;o++)r[o]=arguments[o];return(t=e.call.apply(e,[this].concat(r))||this).appliedClasses={appear:{},enter:{},exit:{}},t.onEnter=function(e,n){t.removeClasses(e,"exit"),t.addClass(e,n?"appear":"enter","base"),t.props.onEnter&&t.props.onEnter(e,n)},t.onEntering=function(e,n){var r=n?"appear":"enter";t.addClass(e,r,"active"),t.props.onEntering&&t.props.onEntering(e,n)},t.onEntered=function(e,n){var r=n?"appear":"enter";t.removeClasses(e,r),t.addClass(e,r,"done"),t.props.onEntered&&t.props.onEntered(e,n)},t.onExit=function(e){t.removeClasses(e,"appear"),t.removeClasses(e,"enter"),t.addClass(e,"exit","base"),t.props.onExit&&t.props.onExit(e)},t.onExiting=function(e){t.addClass(e,"exit","active"),t.props.onExiting&&t.props.onExiting(e)},t.onExited=function(e){t.removeClasses(e,"exit"),t.addClass(e,"exit","done"),t.props.onExited&&t.props.onExited(e)},t.getClassNames=function(e){var n=t.props.classNames,r="string"==typeof n,o=r?""+(r&&n?n+"-":"")+e:n[e];return{baseClassName:o,activeClassName:r?o+"-active":n[e+"Active"],doneClassName:r?o+"-done":n[e+"Done"]}},t}i(t,e);var n=t.prototype;return n.addClass=function(e,t,n){var r=this.getClassNames(t)[n+"ClassName"];"appear"===t&&"done"===n&&(r+=" "+this.getClassNames("enter").doneClassName),"active"===n&&e&&e.scrollTop,this.appliedClasses[t][n]=r,function(e,t){e&&t&&t.split(" ").forEach((function(t){return r=t,void((n=e).classList?n.classList.add(r):function(e,t){return e.classList?!!t&&e.classList.contains(t):-1!==(" "+(e.className.baseVal||e.className)+" ").indexOf(" "+t+" ")}(n,r)||("string"==typeof n.className?n.className=n.className+" "+r:n.setAttribute("class",(n.className&&n.className.baseVal||"")+" "+r)));var n,r}))}(e,r)},n.removeClasses=function(e,t){var n=this.appliedClasses[t],r=n.base,o=n.active,i=n.done;this.appliedClasses[t]={},r&&E(e,r),o&&E(e,o),i&&E(e,i)},n.render=function(){var e=this.props,t=(e.classNames,o(e,["classNames"]));return s.a.createElement(v,r({},t,{onEnter:this.onEnter,onEntered:this.onEntered,onEntering:this.onEntering,onExit:this.onExit,onExiting:this.onExiting,onExited:this.onExited}))},t}(s.a.Component);b.defaultProps={classNames:""},b.propTypes={};var g=b;function x(e){if(void 0===e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return e}function C(e,t){var n=Object.create(null);return e&&l.Children.map(e,(function(e){return e})).forEach((function(e){n[e.key]=function(e){return t&&Object(l.isValidElement)(e)?t(e):e}(e)})),n}function O(e,t,n){return null!=n[t]?n[t]:e.props[t]}function M(e,t,n){var r=C(e.children),o=function(e,t){function n(n){return n in t?t[n]:e[n]}e=e||{},t=t||{};var r,o=Object.create(null),i=[];for(var a in e)a in t?i.length&&(o[a]=i,i=[]):i.push(a);var l={};for(var s in t){if(o[s])for(r=0;r<o[s].length;r++){var u=o[s][r];l[o[s][r]]=n(u)}l[s]=n(s)}for(r=0;r<i.length;r++)l[i[r]]=n(i[r]);return l}(t,r);return Object.keys(o).forEach((function(i){var a=o[i];if(Object(l.isValidElement)(a)){var s=i in t,u=i in r,c=t[i],d=Object(l.isValidElement)(c)&&!c.props.in;!u||s&&!d?u||!s||d?u&&s&&Object(l.isValidElement)(c)&&(o[i]=Object(l.cloneElement)(a,{onExited:n.bind(null,a),in:c.props.in,exit:O(a,"exit",e),enter:O(a,"enter",e)})):o[i]=Object(l.cloneElement)(a,{in:!1}):o[i]=Object(l.cloneElement)(a,{onExited:n.bind(null,a),in:!0,exit:O(a,"exit",e),enter:O(a,"enter",e)})}})),o}var S=Object.values||function(e){return Object.keys(e).map((function(t){return e[t]}))},k=function(e){function t(t,n){var r,o=(r=e.call(this,t,n)||this).handleExited.bind(x(x(r)));return r.state={contextValue:{isMounting:!0},handleExited:o,firstRender:!0},r}i(t,e);var n=t.prototype;return n.componentDidMount=function(){this.mounted=!0,this.setState({contextValue:{isMounting:!1}})},n.componentWillUnmount=function(){this.mounted=!1},t.getDerivedStateFromProps=function(e,t){var n,r,o=t.children,i=t.handleExited;return{children:t.firstRender?(n=e,r=i,C(n.children,(function(e){return Object(l.cloneElement)(e,{onExited:r.bind(null,e),in:!0,appear:O(e,"appear",n),enter:O(e,"enter",n),exit:O(e,"exit",n)})}))):M(e,o,i),firstRender:!1}},n.handleExited=function(e,t){var n=C(this.props.children);e.key in n||(e.props.onExited&&e.props.onExited(t),this.mounted&&this.setState((function(t){var n=r({},t.children);return delete n[e.key],{children:n}})))},n.render=function(){var e=this.props,t=e.component,n=e.childFactory,r=o(e,["component","childFactory"]),i=this.state.contextValue,a=S(this.state.children).map(n);return delete r.appear,delete r.enter,delete r.exit,null===t?s.a.createElement(p.Provider,{value:i},a):s.a.createElement(p.Provider,{value:i},s.a.createElement(t,r,a))},t}(s.a.Component);k.propTypes={},k.defaultProps={component:"div",childFactory:function(e){return e}};var T=k,w=function(e){function t(){for(var t,n=arguments.length,r=new Array(n),o=0;o<n;o++)r[o]=arguments[o];return(t=e.call.apply(e,[this].concat(r))||this).handleEnter=function(){for(var e=arguments.length,n=new Array(e),r=0;r<e;r++)n[r]=arguments[r];return t.handleLifecycle("onEnter",0,n)},t.handleEntering=function(){for(var e=arguments.length,n=new Array(e),r=0;r<e;r++)n[r]=arguments[r];return t.handleLifecycle("onEntering",0,n)},t.handleEntered=function(){for(var e=arguments.length,n=new Array(e),r=0;r<e;r++)n[r]=arguments[r];return t.handleLifecycle("onEntered",0,n)},t.handleExit=function(){for(var e=arguments.length,n=new Array(e),r=0;r<e;r++)n[r]=arguments[r];return t.handleLifecycle("onExit",1,n)},t.handleExiting=function(){for(var e=arguments.length,n=new Array(e),r=0;r<e;r++)n[r]=arguments[r];return t.handleLifecycle("onExiting",1,n)},t.handleExited=function(){for(var e=arguments.length,n=new Array(e),r=0;r<e;r++)n[r]=arguments[r];return t.handleLifecycle("onExited",1,n)},t}i(t,e);var n=t.prototype;return n.handleLifecycle=function(e,t,n){var r,o=this.props.children,i=s.a.Children.toArray(o)[t];i.props[e]&&(r=i.props)[e].apply(r,n),this.props[e]&&this.props[e](c.a.findDOMNode(this))},n.render=function(){var e=this.props,t=e.children,n=e.in,r=o(e,["children","in"]),i=s.a.Children.toArray(t),a=i[0],l=i[1];return delete r.onEnter,delete r.onEntering,delete r.onEntered,delete r.onExit,delete r.onExiting,delete r.onExited,s.a.createElement(T,r,n?s.a.cloneElement(a,{key:"first",onEnter:this.handleEnter,onEntering:this.handleEntering,onEntered:this.handleEntered}):s.a.cloneElement(l,{key:"second",onEnter:this.handleExit,onEntering:this.handleExiting,onEntered:this.handleExited}))},t}(s.a.Component);w.propTypes={};var j,P,N=w;var _="out-in",V="in-out",D=function(e,t,n){return function(){var r;e.props[t]&&(r=e.props)[t].apply(r,arguments),n()}},L=((j={})[_]=function(e){var t=e.current,n=e.changeState;return s.a.cloneElement(t,{in:!1,onExited:D(t,"onExited",(function(){n(f,null)}))})},j[V]=function(e){var t=e.current,n=e.changeState,r=e.children;return[t,s.a.cloneElement(r,{in:!0,onEntered:D(r,"onEntered",(function(){n(f)}))})]},j),A=((P={})[_]=function(e){var t=e.children,n=e.changeState;return s.a.cloneElement(t,{in:!0,onEntered:D(t,"onEntered",(function(){n(m,s.a.cloneElement(t,{in:!0}))}))})},P[V]=function(e){var t=e.current,n=e.children,r=e.changeState;return[s.a.cloneElement(t,{in:!1,onExited:D(t,"onExited",(function(){r(m,s.a.cloneElement(n,{in:!0}))}))}),s.a.cloneElement(n,{in:!0})]},P),F=function(e){function t(){for(var t,n=arguments.length,r=new Array(n),o=0;o<n;o++)r[o]=arguments[o];return(t=e.call.apply(e,[this].concat(r))||this).state={status:m,current:null},t.appeared=!1,t.changeState=function(e,n){void 0===n&&(n=t.state.current),t.setState({status:e,current:n})},t}i(t,e);var n=t.prototype;return n.componentDidMount=function(){this.appeared=!0},t.getDerivedStateFromProps=function(e,t){return null==e.children?{current:null}:t.status===f&&e.mode===V?{status:f}:!t.current||(n=t.current,r=e.children,n===r||s.a.isValidElement(n)&&s.a.isValidElement(r)&&null!=n.key&&n.key===r.key)?{current:s.a.cloneElement(e.children,{in:!0})}:{status:"exiting"};var n,r},n.render=function(){var e,t=this.props,n=t.children,r=t.mode,o=this.state,i=o.status,a=o.current,l={children:n,current:a,changeState:this.changeState,status:i};switch(i){case f:e=A[r](l);break;case"exiting":e=L[r](l);break;case m:e=a}return s.a.createElement(p.Provider,{value:{isMounting:!this.appeared}},e)},t}(s.a.Component);F.propTypes={},F.defaultProps={mode:_};var H=F;n.d(t,"CSSTransition",(function(){return g})),n.d(t,"ReplaceTransition",(function(){return N})),n.d(t,"SwitchTransition",(function(){return H})),n.d(t,"TransitionGroup",(function(){return T})),n.d(t,"Transition",(function(){return v})),n.d(t,"config",(function(){return d}))}])}));
+!function(e,t){if("object"==typeof exports&&"object"==typeof module)module.exports=t(require("react"),require("prop-types"),require("react-dom"),require("@devseed-ui/button"),require("styled-components"),require("@devseed-ui/theme-provider"));else if("function"==typeof define&&define.amd)define(["react","prop-types","react-dom","@devseed-ui/button","styled-components","@devseed-ui/theme-provider"],t);else{var n="object"==typeof exports?t(require("react"),require("prop-types"),require("react-dom"),require("@devseed-ui/button"),require("styled-components"),require("@devseed-ui/theme-provider")):t(e.react,e["prop-types"],e["react-dom"],e["@devseed-ui/button"],e["styled-components"],e["@devseed-ui/theme-provider"]);for(var r in n)("object"==typeof exports?exports:e)[r]=n[r]}}(window,(function(e,t,n,r,o,i){return function(e){var t={};function n(r){if(t[r])return t[r].exports;var o=t[r]={i:r,l:!1,exports:{}};return e[r].call(o.exports,o,o.exports,n),o.l=!0,o.exports}return n.m=e,n.c=t,n.d=function(e,t,r){n.o(e,t)||Object.defineProperty(e,t,{enumerable:!0,get:r})},n.r=function(e){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},n.t=function(e,t){if(1&t&&(e=n(e)),8&t)return e;if(4&t&&"object"==typeof e&&e&&e.__esModule)return e;var r=Object.create(null);if(n.r(r),Object.defineProperty(r,"default",{enumerable:!0,value:e}),2&t&&"string"!=typeof e)for(var o in e)n.d(r,o,function(t){return e[t]}.bind(null,o));return r},n.n=function(e){var t=e&&e.__esModule?function(){return e.default}:function(){return e};return n.d(t,"a",t),t},n.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},n.p="",n(n.s=3)}([function(t,n){t.exports=e},function(e,n){e.exports=t},function(e,t){e.exports=n},function(e,t,n){"use strict";function r(e){return(r="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e})(e)}Object.defineProperty(t,"__esModule",{value:!0}),t.Modal=f,Object.defineProperty(t,"ModalHeader",{enumerable:!0,get:function(){return u.ModalHeader}}),Object.defineProperty(t,"ModalHeadline",{enumerable:!0,get:function(){return u.ModalHeadline}}),Object.defineProperty(t,"ModalToolbar",{enumerable:!0,get:function(){return u.ModalToolbar}}),Object.defineProperty(t,"ModalBody",{enumerable:!0,get:function(){return u.ModalBody}}),Object.defineProperty(t,"ModalFooter",{enumerable:!0,get:function(){return u.ModalFooter}});var o=function(e){if(e&&e.__esModule)return e;if(null===e||"object"!==r(e)&&"function"!=typeof e)return{default:e};var t=c();if(t&&t.has(e))return t.get(e);var n={},o=Object.defineProperty&&Object.getOwnPropertyDescriptor;for(var i in e)if(Object.prototype.hasOwnProperty.call(e,i)){var a=o?Object.getOwnPropertyDescriptor(e,i):null;a&&(a.get||a.set)?Object.defineProperty(n,i,a):n[i]=e[i]}n.default=e,t&&t.set(e,n);return n}(n(0)),i=n(2),a=n(1),l=n(9),s=n(5),u=n(6);function c(){if("function"!=typeof WeakMap)return null;var e=new WeakMap;return c=function(){return e},e}function d(e,t){return function(e){if(Array.isArray(e))return e}(e)||function(e,t){if(!(Symbol.iterator in Object(e)||"[object Arguments]"===Object.prototype.toString.call(e)))return;var n=[],r=!0,o=!1,i=void 0;try{for(var a,l=e[Symbol.iterator]();!(r=(a=l.next()).done)&&(n.push(a.value),!t||n.length!==t);r=!0);}catch(e){o=!0,i=e}finally{try{r||null==l.return||l.return()}finally{if(o)throw i}}return n}(e,t)||function(){throw new TypeError("Invalid attempt to destructure non-iterable instance")}()}var p=function(e){var t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{},n=arguments.length>2&&void 0!==arguments[2]?arguments[2]:null;return"function"==typeof e?e(t):n};function f(e){var t=e.id,n=e.title,r=e.content,a=e.footerContent,c=e.closeButton,m=e.size,h=e.revealed,y=e.className,v=e.onCloseClick,E=e.onOverlayClick,b=e.renderContents,g=e.renderHeader,x=e.renderHeadline,C=e.renderToolbar,O=e.renderBody,M=e.renderFooter,S=(0,o.useRef)(f.generateUUID()),k=d((0,o.useState)(!1),2),T=k[0],w=k[1],j=d((0,o.useState)(null),2),P=j[0],N=j[1];if((0,o.useEffect)((function(){var e=function(e){h&&27===e.keyCode&&(e.preventDefault(),v(e))};return document.addEventListener("keyup",e),function(){document.removeEventListener("keyup",e)}}),[h]),(0,o.useEffect)((function(){var e=document.createElement("div");return e.className="modal-portal-".concat(S.current),document.body.appendChild(e),N(e),w(!0),function(){document.body.removeChild(e)}}),[]),!T)return null;var _=["modal",y],D=function(e){e.preventDefault(),v(e)},V={close:D};return(0,i.createPortal)(o.default.createElement(l.CSSTransition,{in:h,appear:!0,unmountOnExit:!0,classNames:"modal",timeout:{enter:400,exit:400}},o.default.createElement(u.ModalWrapper,{className:_.join(" "),key:"modal-".concat(t),onClick:function(e){e.target===e.currentTarget&&"function"==typeof E&&E(e)},id:t,size:m},o.default.createElement(u.BodyUnscrollable,{revealed:h}),o.default.createElement(u.ModalContents,{className:"modal__contents",size:m},p(b,V,o.default.createElement(o.default.Fragment,null,p(g,V,o.default.createElement(u.ModalHeader,null,p(x,V,o.default.createElement(u.ModalHeadline,null,o.default.createElement("h1",null,n))),p(C,V,c&&o.default.createElement(u.ModalToolbar,null,o.default.createElement(s.Button,{useIcon:"xmark--small",size:"small",hideText:!0,onClick:D},"Close"))))),p(O,V,o.default.createElement(u.ModalBody,null,r)),p(M,V,a?o.default.createElement(u.ModalFooter,null,a):null)))))),P)}f.generateUUID=function(){return Math.random().toString(36).substr(2,5)},f.defaultProps={closeButton:!0,revealed:!1,size:"medium",onOverlayClick:function(){0},onCloseClick:function(){0}},f.propTypes={id:a.PropTypes.string.isRequired,revealed:a.PropTypes.bool,className:a.PropTypes.string,size:a.PropTypes.string,onOverlayClick:a.PropTypes.func,onCloseClick:a.PropTypes.func,closeButton:a.PropTypes.bool,title:a.PropTypes.string,renderContents:a.PropTypes.func,renderHeader:a.PropTypes.func,renderHeadline:a.PropTypes.func,renderToolbar:a.PropTypes.func,renderBody:a.PropTypes.func,content:a.PropTypes.node,renderFooter:a.PropTypes.func,footerContent:a.PropTypes.node}},,function(e,t){e.exports=r},function(e,t,n){"use strict";function r(e){return(r="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e})(e)}Object.defineProperty(t,"__esModule",{value:!0}),t.ModalFooter=t.ModalBody=t.ModalToolbar=t.ModalHeadline=t.ModalHeader=t.BodyUnscrollable=t.ModalWrapper=t.ModalContents=void 0;var o=function(e){if(e&&e.__esModule)return e;if(null===e||"object"!==r(e)&&"function"!=typeof e)return{default:e};var t=a();if(t&&t.has(e))return t.get(e);var n={},o=Object.defineProperty&&Object.getOwnPropertyDescriptor;for(var i in e)if(Object.prototype.hasOwnProperty.call(e,i)){var l=o?Object.getOwnPropertyDescriptor(e,i):null;l&&(l.get||l.set)?Object.defineProperty(n,i,l):n[i]=e[i]}n.default=e,t&&t.set(e,n);return n}(n(7)),i=n(8);function a(){if("function"!=typeof WeakMap)return null;var e=new WeakMap;return a=function(){return e},e}function l(){var e=function(e,t){t||(t=e.slice(0));return Object.freeze(Object.defineProperties(e,{raw:{value:Object.freeze(t)}}))}(["\n  ","\n"]);return l=function(){return e},e}var s={small:"32rem",medium:"48rem",large:"64rem",xlarge:"80rem",full:"100%",fullscreen:"100%"},u=o.default.div.withConfig({displayName:"styled__ModalContents",componentId:"sc-1f8l41k-0"})(["display:grid;grid-template-columns:100%;grid-template-rows:",";background:",";border-radius:",";width:100%;margin:",";box-shadow:0 0 32px 2px ",",0 16px 48px -16px ",";"," > *:last-child{margin-bottom:0;}"],(function(e){return"fullscreen"===e.size?"3rem auto":"auto"}),(0,i.themeVal)("color.surface"),(0,i.themeVal)("shape.rounded"),(function(e){return"fullscreen"===e.size?0:"auto"}),(0,i.rgba)((0,i.themeVal)("type.base.color"),.04),(0,i.rgba)((0,i.themeVal)("type.base.color"),.12),(function(e){var t=e.size;return"max-width: ".concat(s[t],";")}));t.ModalContents=u;var c=o.default.section.withConfig({displayName:"styled__ModalWrapper",componentId:"sc-1f8l41k-1"})(["display:flex;position:fixed;top:0;bottom:0;left:0;right:0;z-index:9990;overflow-y:auto;opacity:1;visibility:visible;background:",";transform:translate3d(0,0,0);padding:",";&.modal-appear,&.modal-enter{opacity:0;visibility:hidden;}&.modal-enter-appear,&.modal-enter-active{transition:opacity 0.32s ease 0.1s,visibility 0.32s linear 0.1s;opacity:1;visibility:visible;}&.modal-exit{opacity:1;visibility:visible;}&.modal-exit-active{transition:opacity 0.32s ease 0.1s,visibility 0.32s linear 0.1s;opacity:0;visibility:hidden;}"],(0,i.themeVal)("color.baseAlphaD"),(function(e){return"fullscreen"===e.size?0:(0,i.glsp)(2)}));t.ModalWrapper=c;var d=(0,o.createGlobalStyle)(l(),(function(e){return e.revealed&&"\n    body {\n      overflow-y: hidden;\n    }\n  "}));t.BodyUnscrollable=d;var p=o.default.header.withConfig({displayName:"styled__ModalHeader",componentId:"sc-1f8l41k-2"})(["display:flex;flex-flow:row nowrap;align-items:center;background:#fff;padding:",";border-radius:"," "," 0 0;& > *:last-child{margin-bottom:0;}"],(0,i.glsp)(2),(0,i.themeVal)("shape.rounded"),(0,i.themeVal)("shape.rounded"));t.ModalHeader=p;var f=o.default.div.withConfig({displayName:"styled__ModalHeadline",componentId:"sc-1f8l41k-3"})(["display:flex;flex-flow:column nowrap;h1{font-size:1.25rem;line-height:2rem;margin:0;}"]);t.ModalHeadline=f;var m=o.default.div.withConfig({displayName:"styled__ModalToolbar",componentId:"sc-1f8l41k-4"})(["display:flex;flex-flow:row nowrap;margin-left:auto;align-items:center;align-self:flex-start;padding:"," 0 "," ",";"],(0,i.glsp)(1/8),(0,i.glsp)(1/8),(0,i.glsp)());t.ModalToolbar=m;var h=o.default.div.withConfig({displayName:"styled__ModalBody",componentId:"sc-1f8l41k-5"})(["padding:0 ",";&:first-child{padding-top:",";}&:last-child{padding-bottom:",";}& > *:last-child{margin-bottom:0;}"],(0,i.glsp)(2),(0,i.glsp)(2),(0,i.glsp)(2));t.ModalBody=h;var y=o.default.footer.withConfig({displayName:"styled__ModalFooter",componentId:"sc-1f8l41k-6"})(["display:flex;flex-flow:row nowrap;align-items:center;background:#fff;padding:",";border-radius:0 0 "," ",";> a,> button{margin-right:",";min-width:7rem;}& > *:last-child{margin-bottom:0;}"],(0,i.glsp)(2),(0,i.themeVal)("shape.rounded"),(0,i.themeVal)("shape.rounded"),(0,i.glsp)());t.ModalFooter=y},function(e,t){e.exports=o},function(e,t){e.exports=i},function(e,t,n){"use strict";function r(){return(r=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var r in n)Object.prototype.hasOwnProperty.call(n,r)&&(e[r]=n[r])}return e}).apply(this,arguments)}function o(e,t){if(null==e)return{};var n,r,o={},i=Object.keys(e);for(r=0;r<i.length;r++)n=i[r],t.indexOf(n)>=0||(o[n]=e[n]);return o}function i(e,t){e.prototype=Object.create(t.prototype),e.prototype.constructor=e,e.__proto__=t}n.r(t);n(1);function a(e,t){return e.replace(new RegExp("(^|\\s)"+t+"(?:\\s|$)","g"),"$1").replace(/\s+/g," ").replace(/^\s*|\s*$/g,"")}var l=n(0),s=n.n(l),u=n(2),c=n.n(u),d={disabled:!1},p=s.a.createContext(null),f="entering",m="entered",h=function(e){function t(t,n){var r;r=e.call(this,t,n)||this;var o,i=n&&!n.isMounting?t.enter:t.appear;return r.appearStatus=null,t.in?i?(o="exited",r.appearStatus=f):o=m:o=t.unmountOnExit||t.mountOnEnter?"unmounted":"exited",r.state={status:o},r.nextCallback=null,r}i(t,e),t.getDerivedStateFromProps=function(e,t){return e.in&&"unmounted"===t.status?{status:"exited"}:null};var n=t.prototype;return n.componentDidMount=function(){this.updateStatus(!0,this.appearStatus)},n.componentDidUpdate=function(e){var t=null;if(e!==this.props){var n=this.state.status;this.props.in?n!==f&&n!==m&&(t=f):n!==f&&n!==m||(t="exiting")}this.updateStatus(!1,t)},n.componentWillUnmount=function(){this.cancelNextCallback()},n.getTimeouts=function(){var e,t,n,r=this.props.timeout;return e=t=n=r,null!=r&&"number"!=typeof r&&(e=r.exit,t=r.enter,n=void 0!==r.appear?r.appear:t),{exit:e,enter:t,appear:n}},n.updateStatus=function(e,t){if(void 0===e&&(e=!1),null!==t){this.cancelNextCallback();var n=c.a.findDOMNode(this);t===f?this.performEnter(n,e):this.performExit(n)}else this.props.unmountOnExit&&"exited"===this.state.status&&this.setState({status:"unmounted"})},n.performEnter=function(e,t){var n=this,r=this.props.enter,o=this.context?this.context.isMounting:t,i=this.getTimeouts(),a=o?i.appear:i.enter;!t&&!r||d.disabled?this.safeSetState({status:m},(function(){n.props.onEntered(e)})):(this.props.onEnter(e,o),this.safeSetState({status:f},(function(){n.props.onEntering(e,o),n.onTransitionEnd(e,a,(function(){n.safeSetState({status:m},(function(){n.props.onEntered(e,o)}))}))})))},n.performExit=function(e){var t=this,n=this.props.exit,r=this.getTimeouts();n&&!d.disabled?(this.props.onExit(e),this.safeSetState({status:"exiting"},(function(){t.props.onExiting(e),t.onTransitionEnd(e,r.exit,(function(){t.safeSetState({status:"exited"},(function(){t.props.onExited(e)}))}))}))):this.safeSetState({status:"exited"},(function(){t.props.onExited(e)}))},n.cancelNextCallback=function(){null!==this.nextCallback&&(this.nextCallback.cancel(),this.nextCallback=null)},n.safeSetState=function(e,t){t=this.setNextCallback(t),this.setState(e,t)},n.setNextCallback=function(e){var t=this,n=!0;return this.nextCallback=function(r){n&&(n=!1,t.nextCallback=null,e(r))},this.nextCallback.cancel=function(){n=!1},this.nextCallback},n.onTransitionEnd=function(e,t,n){this.setNextCallback(n);var r=null==t&&!this.props.addEndListener;e&&!r?(this.props.addEndListener&&this.props.addEndListener(e,this.nextCallback),null!=t&&setTimeout(this.nextCallback,t)):setTimeout(this.nextCallback,0)},n.render=function(){var e=this.state.status;if("unmounted"===e)return null;var t=this.props,n=t.children,r=o(t,["children"]);if(delete r.in,delete r.mountOnEnter,delete r.unmountOnExit,delete r.appear,delete r.enter,delete r.exit,delete r.timeout,delete r.addEndListener,delete r.onEnter,delete r.onEntering,delete r.onEntered,delete r.onExit,delete r.onExiting,delete r.onExited,"function"==typeof n)return s.a.createElement(p.Provider,{value:null},n(e,r));var i=s.a.Children.only(n);return(s.a.createElement(p.Provider,{value:null},s.a.cloneElement(i,r)))},t}(s.a.Component);function y(){}h.contextType=p,h.propTypes={},h.defaultProps={in:!1,mountOnEnter:!1,unmountOnExit:!1,appear:!1,enter:!0,exit:!0,onEnter:y,onEntering:y,onEntered:y,onExit:y,onExiting:y,onExited:y},h.UNMOUNTED=0,h.EXITED=1,h.ENTERING=2,h.ENTERED=3,h.EXITING=4;var v=h,E=function(e,t){return e&&t&&t.split(" ").forEach((function(t){return r=t,void((n=e).classList?n.classList.remove(r):"string"==typeof n.className?n.className=a(n.className,r):n.setAttribute("class",a(n.className&&n.className.baseVal||"",r)));var n,r}))},b=function(e){function t(){for(var t,n=arguments.length,r=new Array(n),o=0;o<n;o++)r[o]=arguments[o];return(t=e.call.apply(e,[this].concat(r))||this).appliedClasses={appear:{},enter:{},exit:{}},t.onEnter=function(e,n){t.removeClasses(e,"exit"),t.addClass(e,n?"appear":"enter","base"),t.props.onEnter&&t.props.onEnter(e,n)},t.onEntering=function(e,n){var r=n?"appear":"enter";t.addClass(e,r,"active"),t.props.onEntering&&t.props.onEntering(e,n)},t.onEntered=function(e,n){var r=n?"appear":"enter";t.removeClasses(e,r),t.addClass(e,r,"done"),t.props.onEntered&&t.props.onEntered(e,n)},t.onExit=function(e){t.removeClasses(e,"appear"),t.removeClasses(e,"enter"),t.addClass(e,"exit","base"),t.props.onExit&&t.props.onExit(e)},t.onExiting=function(e){t.addClass(e,"exit","active"),t.props.onExiting&&t.props.onExiting(e)},t.onExited=function(e){t.removeClasses(e,"exit"),t.addClass(e,"exit","done"),t.props.onExited&&t.props.onExited(e)},t.getClassNames=function(e){var n=t.props.classNames,r="string"==typeof n,o=r?""+(r&&n?n+"-":"")+e:n[e];return{baseClassName:o,activeClassName:r?o+"-active":n[e+"Active"],doneClassName:r?o+"-done":n[e+"Done"]}},t}i(t,e);var n=t.prototype;return n.addClass=function(e,t,n){var r=this.getClassNames(t)[n+"ClassName"];"appear"===t&&"done"===n&&(r+=" "+this.getClassNames("enter").doneClassName),"active"===n&&e&&e.scrollTop,this.appliedClasses[t][n]=r,function(e,t){e&&t&&t.split(" ").forEach((function(t){return r=t,void((n=e).classList?n.classList.add(r):function(e,t){return e.classList?!!t&&e.classList.contains(t):-1!==(" "+(e.className.baseVal||e.className)+" ").indexOf(" "+t+" ")}(n,r)||("string"==typeof n.className?n.className=n.className+" "+r:n.setAttribute("class",(n.className&&n.className.baseVal||"")+" "+r)));var n,r}))}(e,r)},n.removeClasses=function(e,t){var n=this.appliedClasses[t],r=n.base,o=n.active,i=n.done;this.appliedClasses[t]={},r&&E(e,r),o&&E(e,o),i&&E(e,i)},n.render=function(){var e=this.props,t=(e.classNames,o(e,["classNames"]));return s.a.createElement(v,r({},t,{onEnter:this.onEnter,onEntered:this.onEntered,onEntering:this.onEntering,onExit:this.onExit,onExiting:this.onExiting,onExited:this.onExited}))},t}(s.a.Component);b.defaultProps={classNames:""},b.propTypes={};var g=b;function x(e){if(void 0===e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return e}function C(e,t){var n=Object.create(null);return e&&l.Children.map(e,(function(e){return e})).forEach((function(e){n[e.key]=function(e){return t&&Object(l.isValidElement)(e)?t(e):e}(e)})),n}function O(e,t,n){return null!=n[t]?n[t]:e.props[t]}function M(e,t,n){var r=C(e.children),o=function(e,t){function n(n){return n in t?t[n]:e[n]}e=e||{},t=t||{};var r,o=Object.create(null),i=[];for(var a in e)a in t?i.length&&(o[a]=i,i=[]):i.push(a);var l={};for(var s in t){if(o[s])for(r=0;r<o[s].length;r++){var u=o[s][r];l[o[s][r]]=n(u)}l[s]=n(s)}for(r=0;r<i.length;r++)l[i[r]]=n(i[r]);return l}(t,r);return Object.keys(o).forEach((function(i){var a=o[i];if(Object(l.isValidElement)(a)){var s=i in t,u=i in r,c=t[i],d=Object(l.isValidElement)(c)&&!c.props.in;!u||s&&!d?u||!s||d?u&&s&&Object(l.isValidElement)(c)&&(o[i]=Object(l.cloneElement)(a,{onExited:n.bind(null,a),in:c.props.in,exit:O(a,"exit",e),enter:O(a,"enter",e)})):o[i]=Object(l.cloneElement)(a,{in:!1}):o[i]=Object(l.cloneElement)(a,{onExited:n.bind(null,a),in:!0,exit:O(a,"exit",e),enter:O(a,"enter",e)})}})),o}var S=Object.values||function(e){return Object.keys(e).map((function(t){return e[t]}))},k=function(e){function t(t,n){var r,o=(r=e.call(this,t,n)||this).handleExited.bind(x(x(r)));return r.state={contextValue:{isMounting:!0},handleExited:o,firstRender:!0},r}i(t,e);var n=t.prototype;return n.componentDidMount=function(){this.mounted=!0,this.setState({contextValue:{isMounting:!1}})},n.componentWillUnmount=function(){this.mounted=!1},t.getDerivedStateFromProps=function(e,t){var n,r,o=t.children,i=t.handleExited;return{children:t.firstRender?(n=e,r=i,C(n.children,(function(e){return Object(l.cloneElement)(e,{onExited:r.bind(null,e),in:!0,appear:O(e,"appear",n),enter:O(e,"enter",n),exit:O(e,"exit",n)})}))):M(e,o,i),firstRender:!1}},n.handleExited=function(e,t){var n=C(this.props.children);e.key in n||(e.props.onExited&&e.props.onExited(t),this.mounted&&this.setState((function(t){var n=r({},t.children);return delete n[e.key],{children:n}})))},n.render=function(){var e=this.props,t=e.component,n=e.childFactory,r=o(e,["component","childFactory"]),i=this.state.contextValue,a=S(this.state.children).map(n);return delete r.appear,delete r.enter,delete r.exit,null===t?s.a.createElement(p.Provider,{value:i},a):s.a.createElement(p.Provider,{value:i},s.a.createElement(t,r,a))},t}(s.a.Component);k.propTypes={},k.defaultProps={component:"div",childFactory:function(e){return e}};var T=k,w=function(e){function t(){for(var t,n=arguments.length,r=new Array(n),o=0;o<n;o++)r[o]=arguments[o];return(t=e.call.apply(e,[this].concat(r))||this).handleEnter=function(){for(var e=arguments.length,n=new Array(e),r=0;r<e;r++)n[r]=arguments[r];return t.handleLifecycle("onEnter",0,n)},t.handleEntering=function(){for(var e=arguments.length,n=new Array(e),r=0;r<e;r++)n[r]=arguments[r];return t.handleLifecycle("onEntering",0,n)},t.handleEntered=function(){for(var e=arguments.length,n=new Array(e),r=0;r<e;r++)n[r]=arguments[r];return t.handleLifecycle("onEntered",0,n)},t.handleExit=function(){for(var e=arguments.length,n=new Array(e),r=0;r<e;r++)n[r]=arguments[r];return t.handleLifecycle("onExit",1,n)},t.handleExiting=function(){for(var e=arguments.length,n=new Array(e),r=0;r<e;r++)n[r]=arguments[r];return t.handleLifecycle("onExiting",1,n)},t.handleExited=function(){for(var e=arguments.length,n=new Array(e),r=0;r<e;r++)n[r]=arguments[r];return t.handleLifecycle("onExited",1,n)},t}i(t,e);var n=t.prototype;return n.handleLifecycle=function(e,t,n){var r,o=this.props.children,i=s.a.Children.toArray(o)[t];i.props[e]&&(r=i.props)[e].apply(r,n),this.props[e]&&this.props[e](c.a.findDOMNode(this))},n.render=function(){var e=this.props,t=e.children,n=e.in,r=o(e,["children","in"]),i=s.a.Children.toArray(t),a=i[0],l=i[1];return delete r.onEnter,delete r.onEntering,delete r.onEntered,delete r.onExit,delete r.onExiting,delete r.onExited,s.a.createElement(T,r,n?s.a.cloneElement(a,{key:"first",onEnter:this.handleEnter,onEntering:this.handleEntering,onEntered:this.handleEntered}):s.a.cloneElement(l,{key:"second",onEnter:this.handleExit,onEntering:this.handleExiting,onEntered:this.handleExited}))},t}(s.a.Component);w.propTypes={};var j,P,N=w;var _="out-in",D="in-out",V=function(e,t,n){return function(){var r;e.props[t]&&(r=e.props)[t].apply(r,arguments),n()}},L=((j={})[_]=function(e){var t=e.current,n=e.changeState;return s.a.cloneElement(t,{in:!1,onExited:V(t,"onExited",(function(){n(f,null)}))})},j[D]=function(e){var t=e.current,n=e.changeState,r=e.children;return[t,s.a.cloneElement(r,{in:!0,onEntered:V(r,"onEntered",(function(){n(f)}))})]},j),A=((P={})[_]=function(e){var t=e.children,n=e.changeState;return s.a.cloneElement(t,{in:!0,onEntered:V(t,"onEntered",(function(){n(m,s.a.cloneElement(t,{in:!0}))}))})},P[D]=function(e){var t=e.current,n=e.children,r=e.changeState;return[s.a.cloneElement(t,{in:!1,onExited:V(t,"onExited",(function(){r(m,s.a.cloneElement(n,{in:!0}))}))}),s.a.cloneElement(n,{in:!0})]},P),H=function(e){function t(){for(var t,n=arguments.length,r=new Array(n),o=0;o<n;o++)r[o]=arguments[o];return(t=e.call.apply(e,[this].concat(r))||this).state={status:m,current:null},t.appeared=!1,t.changeState=function(e,n){void 0===n&&(n=t.state.current),t.setState({status:e,current:n})},t}i(t,e);var n=t.prototype;return n.componentDidMount=function(){this.appeared=!0},t.getDerivedStateFromProps=function(e,t){return null==e.children?{current:null}:t.status===f&&e.mode===D?{status:f}:!t.current||(n=t.current,r=e.children,n===r||s.a.isValidElement(n)&&s.a.isValidElement(r)&&null!=n.key&&n.key===r.key)?{current:s.a.cloneElement(e.children,{in:!0})}:{status:"exiting"};var n,r},n.render=function(){var e,t=this.props,n=t.children,r=t.mode,o=this.state,i=o.status,a=o.current,l={children:n,current:a,changeState:this.changeState,status:i};switch(i){case f:e=A[r](l);break;case"exiting":e=L[r](l);break;case m:e=a}return s.a.createElement(p.Provider,{value:{isMounting:!this.appeared}},e)},t}(s.a.Component);H.propTypes={},H.defaultProps={mode:_};var B=H;n.d(t,"CSSTransition",(function(){return g})),n.d(t,"ReplaceTransition",(function(){return N})),n.d(t,"SwitchTransition",(function(){return B})),n.d(t,"TransitionGroup",(function(){return T})),n.d(t,"Transition",(function(){return v})),n.d(t,"config",(function(){return d}))}])}));

package.json

 {
   "name": "@devseed-ui/modal",
-  "version": "2.0.0",
+  "version": "3.0.0-rc.0",
   "description": "devseed UI Kit Modal",
@@ -9,3 +9,4 @@ "browser": "./dist/index.web.js",
   "scripts": {
-    "build": "../../node_modules/.bin/webpack --config ../../webpack.config.js"
+    "build": "yarn webpack --config ../../webpack.config.js",
+    "watch": "yarn webpack --watch --config ../../webpack.config.js"
   },
@@ -29,5 +30,5 @@ "license": "MIT",
   "dependencies": {
-    "@devseed-ui/theme-provider": "^2.4.0",
+    "@devseed-ui/theme-provider": "^3.0.0-rc.0",
     "react-transition-group": "^4.3.0"
   }
 }

README.md

@@ -11,2 +11,3 @@ # @devseed-ui/modal
 <DevseedUiThemeProvider>
+  <CollecticonsGlobalStyle />
   <Button variation="primary-raised-dark" onClick={() => setState({revealed: true})}>Open modal</Button>
@@ -13,0 +14,0 @@ <Modal

src/styled.js

 import styled, { createGlobalStyle } from 'styled-components';
-import { rgba } from 'polished';
 
-import { themeVal, stylizeFunction, glsp } from '@devseed-ui/theme-provider';
+import { themeVal, rgba, glsp } from '@devseed-ui/theme-provider';
 
-const _rgba = stylizeFunction(rgba);
-
 const sizeMapping = {
@@ -26,4 +23,4 @@ small: '32rem',
   margin: ${({ size }) => (size === 'fullscreen' ? 0 : `auto`)};
-  box-shadow: 0 0 32px 2px ${_rgba(themeVal('type.base.color'), 0.04)},
-    0 16px 48px -16px ${_rgba(themeVal('type.base.color'), 0.12)};
+  box-shadow: 0 0 32px 2px ${rgba(themeVal('type.base.color'), 0.04)},
+    0 16px 48px -16px ${rgba(themeVal('type.base.color'), 0.12)};
 
@@ -49,3 +46,3 @@ /* Size attribute */
   visibility: visible;
-  background: ${themeVal('color.smoke')};
+  background: ${themeVal('color.baseAlphaD')};
   transform: translate3d(0, 0, 0);
@@ -148,3 +145,3 @@ padding: ${({ size }) => (size === 'fullscreen' ? 0 : glsp(2))};
   > button {
-    margin-right: ${themeVal('layout.space')};
+    margin-right: ${glsp()};
     min-width: 7rem;
@@ -151,0 +148,0 @@ }

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

No v1

Quality

Package is not semver >=1. This means it is not stable and does not support ^ ranges.

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

New author

Supply chain risk

A new npm collaborator published a version of the package for the first time. New collaborators are usually benign additions to a project, but do indicate a change to the security surface area of a package.

Found 1 instance in 1 package

Improved metrics

Number of lines in readme file

127

increased by0.79%

Number of medium supply chain risk alerts

0

decreased by-100%

Worsened metrics

Total package byte prevSize

93991

decreased by-67.77%

Number of package files

10

decreased by-16.67%

Lines of code

852

decreased by-0.23%

Number of low quality alerts

4

increased by33.33%

Dependency changes

• + Added@devseed-ui/theme-provider@3.0.0(transitive)

• - Removed@devseed-ui/theme-provider@2.4.0(transitive)

• Updated@devseed-ui/theme-provider@^3.0.0-rc.0