@devseed-ui/modal
Advanced tools
Comparing version 3.0.0-rc.0 to 3.0.0
# @devseed-ui/modal | ||
## 3.0.0 | ||
### Major Changes | ||
- 6972997: Major UI Library release | ||
**BREAKING CHANGES** | ||
## 🎉 Features | ||
- Improved theme with clearer variables | ||
- Added a date-picker component | ||
## 🚀 Improvements | ||
- Revision of documentation, including new "Getting Started" guide | ||
- General cleanup | ||
- Improvements to forms (#169) | ||
- Send custom prop to the first child (#175) | ||
- Improve packages meta information (#140) | ||
## 🐛 Fixes | ||
- DEV: Linting for react-hooks | ||
- DEV: Module updates | ||
### Patch Changes | ||
- Updated dependencies [6972997] | ||
- Updated dependencies [e5fcf44] | ||
- @devseed-ui/theme-provider@3.0.0 | ||
## 3.0.0-rc.0 | ||
@@ -4,0 +36,0 @@ |
@@ -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("@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}))}])})); | ||
!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=h,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(){return(d=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 p(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")}()}function f(e,t){if(null==e)return{};var n,r,o=function(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}(e,t);if(Object.getOwnPropertySymbols){var i=Object.getOwnPropertySymbols(e);for(r=0;r<i.length;r++)n=i[r],t.indexOf(n)>=0||Object.prototype.propertyIsEnumerable.call(e,n)&&(o[n]=e[n])}return o}var m=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 h(e){var t=e.id,n=e.title,r=e.content,a=e.footerContent,c=e.closeButton,y=e.size,v=e.revealed,b=e.className,E=e.onCloseClick,g=e.onOverlayClick,x=e.renderContents,C=e.renderHeader,O=e.renderHeadline,S=e.renderToolbar,M=e.renderBody,k=e.renderFooter,j=f(e,["id","title","content","footerContent","closeButton","size","revealed","className","onCloseClick","onOverlayClick","renderContents","renderHeader","renderHeadline","renderToolbar","renderBody","renderFooter"]),P=(0,o.useRef)(h.generateUUID()),T=p((0,o.useState)(!1),2),w=T[0],N=T[1],_=p((0,o.useState)(null),2),D=_[0],V=_[1];if((0,o.useEffect)((function(){var e=function(e){v&&27===e.keyCode&&(e.preventDefault(),E(e))};return document.addEventListener("keyup",e),function(){document.removeEventListener("keyup",e)}}),[v,E]),(0,o.useEffect)((function(){var e=document.createElement("div");return e.className="modal-portal-".concat(P.current),document.body.appendChild(e),V(e),N(!0),function(){document.body.removeChild(e)}}),[]),!w)return null;var L=["modal",b],A=function(e){e.preventDefault(),E(e)},H={close:A};return(0,i.createPortal)(o.default.createElement(l.CSSTransition,{in:v,appear:!0,unmountOnExit:!0,classNames:"modal",timeout:{enter:400,exit:400}},o.default.createElement(u.ModalWrapper,d({className:L.join(" "),key:"modal-".concat(t),onClick:function(e){e.target===e.currentTarget&&"function"==typeof g&&g(e)},id:t,size:y},j),o.default.createElement(u.BodyUnscrollable,{revealed:v}),o.default.createElement(u.ModalContents,{className:"modal__contents",size:y},m(x,H,o.default.createElement(o.default.Fragment,null,m(C,H,o.default.createElement(u.ModalHeader,null,m(O,H,o.default.createElement(u.ModalHeadline,null,o.default.createElement("h1",null,n))),m(S,H,c&&o.default.createElement(u.ModalToolbar,null,o.default.createElement(s.Button,{useIcon:"xmark--small",size:"small",hideText:!0,onClick:A},"Close"))))),m(M,H,o.default.createElement(u.ModalBody,null,r)),m(k,H,a?o.default.createElement(u.ModalFooter,null,a):null)))))),D)}h.generateUUID=function(){return Math.random().toString(36).substr(2,5)},h.defaultProps={closeButton:!0,revealed:!1,size:"medium",onOverlayClick:function(){0},onCloseClick:function(){0}},h.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,b=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}))},E=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&&b(e,r),o&&b(e,o),i&&b(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);E.defaultProps={classNames:""},E.propTypes={};var g=E;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 S(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 M=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)})}))):S(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=M(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 j=k,P=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(j,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);P.propTypes={};var T,w,N=P;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=((T={})[_]=function(e){var t=e.current,n=e.changeState;return s.a.cloneElement(t,{in:!1,onExited:V(t,"onExited",(function(){n(f,null)}))})},T[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)}))})]},T),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 j})),n.d(t,"Transition",(function(){return v})),n.d(t,"config",(function(){return d}))}])})); |
@@ -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("@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}))}])})); | ||
!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=h,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(){return(d=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 p(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")}()}function f(e,t){if(null==e)return{};var n,r,o=function(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}(e,t);if(Object.getOwnPropertySymbols){var i=Object.getOwnPropertySymbols(e);for(r=0;r<i.length;r++)n=i[r],t.indexOf(n)>=0||Object.prototype.propertyIsEnumerable.call(e,n)&&(o[n]=e[n])}return o}var m=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 h(e){var t=e.id,n=e.title,r=e.content,a=e.footerContent,c=e.closeButton,y=e.size,v=e.revealed,b=e.className,E=e.onCloseClick,g=e.onOverlayClick,x=e.renderContents,C=e.renderHeader,O=e.renderHeadline,S=e.renderToolbar,M=e.renderBody,k=e.renderFooter,j=f(e,["id","title","content","footerContent","closeButton","size","revealed","className","onCloseClick","onOverlayClick","renderContents","renderHeader","renderHeadline","renderToolbar","renderBody","renderFooter"]),w=(0,o.useRef)(h.generateUUID()),P=p((0,o.useState)(!1),2),T=P[0],N=P[1],_=p((0,o.useState)(null),2),D=_[0],V=_[1];if((0,o.useEffect)((function(){var e=function(e){v&&27===e.keyCode&&(e.preventDefault(),E(e))};return document.addEventListener("keyup",e),function(){document.removeEventListener("keyup",e)}}),[v,E]),(0,o.useEffect)((function(){var e=document.createElement("div");return e.className="modal-portal-".concat(w.current),document.body.appendChild(e),V(e),N(!0),function(){document.body.removeChild(e)}}),[]),!T)return null;var L=["modal",b],A=function(e){e.preventDefault(),E(e)},H={close:A};return(0,i.createPortal)(o.default.createElement(l.CSSTransition,{in:v,appear:!0,unmountOnExit:!0,classNames:"modal",timeout:{enter:400,exit:400}},o.default.createElement(u.ModalWrapper,d({className:L.join(" "),key:"modal-".concat(t),onClick:function(e){e.target===e.currentTarget&&"function"==typeof g&&g(e)},id:t,size:y},j),o.default.createElement(u.BodyUnscrollable,{revealed:v}),o.default.createElement(u.ModalContents,{className:"modal__contents",size:y},m(x,H,o.default.createElement(o.default.Fragment,null,m(C,H,o.default.createElement(u.ModalHeader,null,m(O,H,o.default.createElement(u.ModalHeadline,null,o.default.createElement("h1",null,n))),m(S,H,c&&o.default.createElement(u.ModalToolbar,null,o.default.createElement(s.Button,{useIcon:"xmark--small",size:"small",hideText:!0,onClick:A},"Close"))))),m(M,H,o.default.createElement(u.ModalBody,null,r)),m(k,H,a?o.default.createElement(u.ModalFooter,null,a):null)))))),D)}h.generateUUID=function(){return Math.random().toString(36).substr(2,5)},h.defaultProps={closeButton:!0,revealed:!1,size:"medium",onOverlayClick:function(){0},onCloseClick:function(){0}},h.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,b=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}))},E=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&&b(e,r),o&&b(e,o),i&&b(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);E.defaultProps={classNames:""},E.propTypes={};var g=E;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 S(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 M=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)})}))):S(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=M(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 j=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(j,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 P,T,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=((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=((T={})[_]=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}))}))})},T[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})]},T),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 j})),n.d(t,"Transition",(function(){return v})),n.d(t,"config",(function(){return d}))}])})); |
{ | ||
"name": "@devseed-ui/modal", | ||
"version": "3.0.0-rc.0", | ||
"version": "3.0.0", | ||
"description": "devseed UI Kit Modal", | ||
"browser": "./dist/index.web.js", | ||
"main": "./dist/index.node.js", | ||
"types": "./dist/index.d.ts", | ||
"scripts": { | ||
@@ -21,5 +20,5 @@ "build": "yarn webpack --config ../../webpack.config.js", | ||
"front-end", | ||
"responsive", | ||
"styled-components", | ||
"web" | ||
"react", | ||
"modal" | ||
], | ||
@@ -30,5 +29,5 @@ "publishConfig": { | ||
"dependencies": { | ||
"@devseed-ui/theme-provider": "^3.0.0-rc.0", | ||
"@devseed-ui/theme-provider": "^3.0.0", | ||
"react-transition-group": "^4.3.0" | ||
} | ||
} |
@@ -5,2 +5,7 @@ # @devseed-ui/modal | ||
```hint|neutral | ||
This component requires [collecticons](/collecticons) to be included. | ||
You'll see strange characters (example �) in place of icons if collecticons is missing. | ||
``` | ||
## Example | ||
@@ -22,3 +27,3 @@ | ||
<React.Fragment> | ||
<h1><img src="https://developmentseed.org/assets/graphics/layout/ds-logo-pos.svg" alt="Development Seed logotype" width="188" height="32" /></h1> | ||
<h1><img src="/logo.svg" alt="Development Seed meta" /></h1> | ||
<p>In the beginning the Universe was created.</p> | ||
@@ -33,16 +38,2 @@ <p>This has made a lot of people very angry and been widely regarded as a bad move.</p> | ||
### Code Sample | ||
```html | ||
<div> | ||
<iframe | ||
src="https://codesandbox.io/embed/modal-sample-ktqel?fontsize=14&hidenavigation=1&theme=dark" | ||
style="width:100%; height:500px; border:0; border-radius: 4px; overflow:hidden;" | ||
title="modal-sample" | ||
allow="accelerometer; ambient-light-sensor; camera; encrypted-media; geolocation; gyroscope; hid; microphone; midi; payment; usb; vr; xr-spatial-tracking" | ||
sandbox="allow-autoplay allow-forms allow-modals allow-popups allow-presentation allow-same-origin allow-scripts" | ||
></iframe> | ||
</div> | ||
``` | ||
## Properties | ||
@@ -56,6 +47,6 @@ | ||
Default value: "n/a" | ||
- Prop name: "size" | ||
Type: "oneOf ['small', 'medium', 'large', 'xlarge', 'full']" | ||
Description: "Sets the size of the modal" | ||
Default value: "medium" | ||
- Prop name: "className" | ||
Type: "string" | ||
Description: "Classes for the modal wrapper" | ||
Default value: "n/a" | ||
- Prop name: "revealed" | ||
@@ -65,14 +56,14 @@ Type: "bool" | ||
Default value: "false" | ||
- Prop name: "className" | ||
- Prop name: "size" | ||
Type: "string" | ||
Description: "Classes for the modal wrapper" | ||
Default value: "none" | ||
Description: "Size of the modal. One of small | medium | large | xlarge | full" | ||
Default value: "medium" | ||
- Prop name: "onOverlayClick" | ||
Type: "function" | ||
Description: "Callback function for overlay click" | ||
Default value: "none" | ||
Default value: "n/a" | ||
- Prop name: "onCloseClick" | ||
Type: "function" | ||
Description: "Callback function for close button click" | ||
Default value: "none" | ||
Default value: "n/a" | ||
- Prop name: "closeButton" | ||
@@ -85,3 +76,35 @@ Type: "bool" | ||
Description: "Title for the modal. Required unless the header is being overridden" | ||
Default value: "none" | ||
Default value: "n/a" | ||
- Prop name: "content" | ||
Type: "node" | ||
Description: "Modal body content, rendered inside `ModalBody`. Required unless the body is being overridden" | ||
Default value: "n/a" | ||
- Prop name: "footerContent" | ||
Type: "node" | ||
Description: "Modal footer content, rendered inside `ModalFooter`" | ||
Default value: "n/a" | ||
- Prop name: "renderContents" | ||
Type: "function" | ||
Description: "Overrides the contents of the modal. Anything returned by this function is rendered inside `ModalContents`. See below for function signature" | ||
Default value: "n/a" | ||
- Prop name: "renderHeader" | ||
Type: "function" | ||
Description: "Overrides the modal header element. Anything returned by this function is rendered instead of `ModalHeader`" | ||
Default value: "n/a" | ||
- Prop name: "renderHeadline" | ||
Type: "function" | ||
Description: "Overrides the modal headline element. Anything returned by this function is rendered instead of `ModalHeadline`" | ||
Default value: "n/a" | ||
- Prop name: "renderToolbar" | ||
Type: "function" | ||
Description: "Overrides the modal toolbar element. Anything returned by this function is rendered instead of `ModalToolbar`" | ||
Default value: "n/a" | ||
- Prop name: "renderBody" | ||
Type: "function" | ||
Description: "Overrides the modal body element. Anything returned by this function is rendered instead of `ModalBody`" | ||
Default value: "n/a" | ||
- Prop name: "renderFooter" | ||
Type: "function" | ||
Description: "Overrides the modal footer element. Anything returned by this function is rendered instead of `ModalFooter`" | ||
Default value: "n/a" | ||
``` | ||
@@ -88,0 +111,0 @@ |
@@ -102,2 +102,3 @@ import React, { useEffect, useRef, useState } from 'react'; | ||
renderFooter, | ||
...rest | ||
} = props; | ||
@@ -123,3 +124,3 @@ | ||
}; | ||
}, [revealed]); | ||
}, [revealed, onCloseClick]); | ||
@@ -183,2 +184,3 @@ // Will be called on initial mount. | ||
size={size} | ||
{...rest} | ||
> | ||
@@ -254,6 +256,3 @@ <BodyUnscrollable revealed={revealed} /> | ||
// Use a static method to generate a uuid so it can be mocked during tests. | ||
Modal.generateUUID = () => | ||
Math.random() | ||
.toString(36) | ||
.substr(2, 5); | ||
Modal.generateUUID = () => Math.random().toString(36).substr(2, 5); | ||
@@ -260,0 +259,0 @@ Modal.defaultProps = { |
@@ -40,2 +40,3 @@ import React from 'react'; | ||
content={<p>Simple modal with a title and some content</p>} | ||
data-prop="custom-prop" | ||
/>, | ||
@@ -42,0 +43,0 @@ ); |
Sorry, the diff of this file is not supported yet
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
No v1
QualityPackage is not semver >=1. This means it is not stable and does not support ^ ranges.
Found 1 instance in 1 package
97383
3
150