diff --git a/README.md b/README.md
index 0386904..32f1fa6 100644
--- a/README.md
+++ b/README.md
@@ -26,5 +26,5 @@ In order to start development:
```sh
npm i
-npm run dev
+npm run watch
```
\ No newline at end of file
diff --git a/demo/index.html b/demo/index.html
index 3f18ab5..39b545d 100644
--- a/demo/index.html
+++ b/demo/index.html
@@ -8,8 +8,8 @@
ractive-modal demo page
-
- ractive-modal comes with integrated focus management - How it works
Changelog
+
version 0.3.2
+
+ Fixed build when used in module environment via import.
+
+
version 0.3.1
Added opening event.
diff --git a/dist/ractive-modal.js b/dist/ractive-modal.js
index 30fef0d..21d5409 100644
--- a/dist/ractive-modal.js
+++ b/dist/ractive-modal.js
@@ -7,7 +7,7 @@
exports["RactiveModal"] = factory(require("ractive"));
else
root["RactiveModal"] = factory(root["Ractive"]);
-})(window, function(__WEBPACK_EXTERNAL_MODULE_ractive__) {
+})(window, function(__WEBPACK_EXTERNAL_MODULE__0__) {
return /******/ (function(modules) { // webpackBootstrap
/******/ // The module cache
/******/ var installedModules = {};
@@ -91,33 +91,202 @@ return /******/ (function(modules) { // webpackBootstrap
/******/
/******/
/******/ // Load entry module and return exports
-/******/ return __webpack_require__(__webpack_require__.s = "./ractive-modal.ractive.html");
+/******/ return __webpack_require__(__webpack_require__.s = 1);
/******/ })
/************************************************************************/
-/******/ ({
+/******/ ([
+/* 0 */
+/***/ (function(module, exports) {
+
+module.exports = __WEBPACK_EXTERNAL_MODULE__0__;
-/***/ "./ractive-modal.ractive.html":
-/*!************************************!*\
- !*** ./ractive-modal.ractive.html ***!
- \************************************/
-/*! exports provided: default */
+/***/ }),
+/* 1 */
/***/ (function(module, __webpack_exports__, __webpack_require__) {
"use strict";
-eval("__webpack_require__.r(__webpack_exports__);\n/* harmony import */ var ractive__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ractive */ \"ractive\");\n/* harmony import */ var ractive__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(ractive__WEBPACK_IMPORTED_MODULE_0__);\n\n\n\nractive__WEBPACK_IMPORTED_MODULE_0___default.a.sharedSet({'rm.animating': undefined, 'rm.delay': 0});\n/* harmony default export */ __webpack_exports__[\"default\"] = (ractive__WEBPACK_IMPORTED_MODULE_0___default.a.extend({\n template: {v:4,t:[{t:4,f:[{t:7,e:\"div\",m:[{n:\"class\",f:[\"rm-backdrop \",{t:2,r:\"bg_class\"},\" \",{t:2,r:\"base_anim_class\"},\" \",{t:2,r:\"bg_anim_class\"},\" backdrop-\",{t:2,r:\"modal_id\"}],t:13},{n:\"style\",f:[\"z-index: \",{t:2,x:{r:[\"zindex\"],s:\"_0-1\"}},\";\"],t:13}]}],n:50,r:\"showbackdrop\"},{t:4,f:[{t:7,e:\"div\",m:[{n:\"class\",f:[\"rm-wrapper \",{t:2,r:\"base_anim_class\"},\" \",{t:2,r:\"anim_class\"},\" \",{t:2,r:\"modal_id\"}],t:13},{n:\"role\",f:\"dialog\",t:13,g:1},{n:\"aria-label\",f:[{t:2,r:\"title\"}],t:13},{n:\"tabindex\",f:\"0\",t:13,g:1},{n:\"style\",f:[\"opacity: \",{t:2,r:\"opacity\"},\"; display: \",{t:2,r:\"display\"},\"; z-index: \",{t:2,r:\"zindex\"},\"; cursor: \",{t:2,x:{r:[\"enableclose\"],s:\"_0?\\\"pointer\\\":\\\"default\\\"\"}}],t:13},{n:[\"click\"],t:70,f:\"clickoutside\"},{n:[\"keydown\"],t:70,f:\"keydown\"}],f:[{t:7,e:\"div\",m:[{n:\"class\",f:[\"rm \",{t:2,r:\"class\"}],t:13},{n:\"style\",f:[{t:2,r:\"style\"}],t:13}],f:[{t:4,f:[{t:7,e:\"div\",m:[{t:13,n:\"class\",f:\"rm-titlebar\",g:1}],f:[{t:7,e:\"h3\",m:[{t:13,n:\"class\",f:\"rm-title\",g:1}],f:[{t:2,r:\"title\"}]},\" \",{t:4,f:[{t:7,e:\"button\",m:[{t:13,n:\"class\",f:\"rm-btn-close\",g:1},{n:\"type\",f:\"button\",t:13,g:1},{n:[\"click\"],t:70,f:\"close\"}],f:[\"×\"]}],n:50,r:\"enableclose\"}]}],n:50,x:{r:[\"title\",\"enableclose\"],s:\"_0||_1\"}},\" \",{t:7,e:\"div\",m:[{t:13,n:\"class\",f:\"rm-content\",g:1}],f:[{t:16}]}]}]}],n:50,r:\"showmodal\"}],e:{\"_0-1\":function (_0){return(_0-1);},\"_0?\\\"pointer\\\":\\\"default\\\"\":function (_0){return(_0?\"pointer\":\"default\");},\"_0||_1\":function (_0,_1){return(_0||_1);}}},\n css: \" .rm-backdrop {position: fixed; top: 0; right: 0; bottom: 0; left: 0; background-color: rgba(0, 0, 0, 0.5);} .rm-wrapper {position: fixed; text-align: center; top: 0; right: 0; bottom: 0; left: 0; overflow-x: hidden; overflow-y: auto; display: none; outline: 0;} .rm {position: relative; display: inline-block; width:100%; text-align: left; color: #333333; background-color: #fff; top:30px; cursor: default; min-width: 110px; max-width: 500px; box-shadow: 0 5px 15px rgba(0, 0, 0, 0.5);} .rm-titlebar {padding:15px; color: #333; overflow: auto; border-bottom: 1px solid #e5e5e5;} .rm-title {margin-top:2px; margin-bottom: 0px; display: inline-block; font-size:1.25rem;} .rm-btn-close {padding: 0px 4px 0px 4px; cursor: pointer; background: 0 0; border: 0; font-weight:700; float: right; font-size: 1.5rem; line-height: 1; margin-right: -5px; color:#ccc;} .rm-btn-close:hover, .rm-btn-close:focus:hover{color:#6f6f6f; border-color: transparent; background-color: transparent;} .rm-btn-close:focus {color:#939393; border-color: transparent; background-color: transparent;} .rm-content {padding:15px 15px 15px 15px;} .rm-content .full-hr {width: auto; border: 0; border-top: 1px solid #e0e0e0; margin-top:15px; margin-bottom:15px; margin-left:-14px; margin-right:-14px;} .rm-fadeIn {-webkit-animation-name: rm-fadeIn; animation-name: rm-fadeIn;} @-webkit-keyframes rm-fadeIn {0% {opacity: 0} 100% {opacity: 1}} @keyframes rm-fadeIn {0% {opacity: 0} 100% {opacity: 1}} .rm-fadeOut {-webkit-animation-name: rm-fadeOut; animation-name: rm-fadeOut;} @-webkit-keyframes rm-fadeOut {0% {opacity: 1} 100% {opacity: 0}} @keyframes rm-fadeOut {0% {opacity: 1} 100% {opacity: 0}} .rm-fadeIn, .rm-fadeOut {-webkit-animation-duration: .25s; animation-duration: .25s; -webkit-animation-fill-mode: both; animation-fill-mode: both;}\",\n data: function() {\n return {\n showmodal: false,\n showbackdrop: false,\n basedon: false,\n live: false,\n appendto: '',\n class: '',\n bg_class: '',\n base_anim_class: '',\n anim_class: '',\n bg_anim_class: '',\n bg_in_class: 'rm-fadeIn',\n bg_out_class: 'rm-fadeOut',\n in_class: 'rm-fadeIn',\n out_class: 'rm-fadeOut',\n style: '',\n title: '',\n modal_id: this._guid + '_rm',\n enableclose: true,\n base_zindex: 1051,\n opacity: 0,\n display: 'none',\n zindex: 0\n }\n },\n delegate: false,\n elToFocus: null,\n on: {\n close: function(ctx){\n ctx.original.preventDefault();\n if(this.get('enableclose')){\n this.set('basedon', false);\n }\n },\n clickoutside: function(ctx){\n if(ctx.original.target === ctx.node){\n this.fire('close', ctx);\n }\n },\n keydown: function(ctx){\n var e = ctx.original;\n if(e.which === 27){\n this.fire('close', ctx);\n }\n if(e.which === 9){\n // Get only visible elements\n var all = this.findAll('input, select, textarea, button, a').filter(function(el){\n return !!( el.offsetWidth || el.offsetHeight || el.getClientRects().length );\n });\n if(e.shiftKey){\n if(e.target === all[0] || e.target === this.find('.rm-wrapper')){\n e.preventDefault();\n all[all.length-1].focus();\n }\n }else{\n if(e.target === all[all.length-1]){\n e.preventDefault();\n all[0].focus();\n }\n }\n }\n }\n },\n onconfig: function(){\n if(this.get('live')){\n this.set('showmodal', true);\n }\n },\n onrender: function(){\n var modal_id = this.get('modal_id');\n this.observe_basedon = this.observe('basedon', function(newValue, oldValue, keypath){\n var live = this.get('live');\n if(newValue === true){\n if(document.querySelector('.'+modal_id) && document.querySelector('.'+modal_id).style.display === 'block'){\n return;\n }\n this.elToFocus = document.activeElement;\n this.fire('beforeOpen');\n var lastZindex = this.getTopZindex();\n var zindex = (lastZindex === 0) ? this.get('base_zindex') : lastZindex+2;\n if(!live){\n this.set('showmodal', true);\n }\n this.insert(this.get('appendto') ? document.querySelector(this.get('appendto')) : this.root.el);\n this.set({'display': 'block', 'zindex': zindex});\n this.fire('opening');\n this.animateModal('in').then(function(){\n this.find('[autofocus]') ? this.find('[autofocus]').focus() : this.find('.rm-wrapper').focus();\n this.fire('afterOpen');\n }.bind(this));\n }else{\n if(!document.querySelector('.'+modal_id) || document.querySelector('.'+modal_id).style.display !== 'block'){\n return;\n }\n this.fire('beforeClose');\n this.animateModal('out').then(function(){\n this.set({'display': 'none', 'zindex': 0});\n if(!live){\n this.set('showmodal', false);\n }\n this.fire('afterClose');\n var lastZindex = this.getTopZindex();\n if(lastZindex > 0){\n var all = document.querySelectorAll('.rm-wrapper');\n for (var i = 0; i < all.length; i++) {\n if(all[i].style.zIndex == lastZindex){\n var r = ractive__WEBPACK_IMPORTED_MODULE_0___default.a.getContext(all[i]).ractive;\n if(r.find('.rm-wrapper').contains(this.elToFocus)){\n this.elToFocus.focus();\n }else{\n r.find('[autofocus]') ? r.find('[autofocus]').focus() : r.find('.rm-wrapper').focus();\n }\n break;\n }\n };\n }else{\n if(document.body.contains(this.elToFocus)){\n this.elToFocus.focus();\n }\n }\n }.bind(this));\n }\n }, {\n defer: true\n });\n },\n onunrender: function(){\n this.observe_basedon.cancel();\n },\n animateModal: function(dir){\n return new Promise(function(resolve, reject){\n var handler = function(e) {\n this.find('.rm-wrapper').removeEventListener('animationend', handler);\n this.set({\n 'anim_class': '',\n 'bg_anim_class': '',\n '@shared.rm.animating': undefined,\n '@shared.rm.delay': 0\n });\n if(dir == 'out'){\n this.set({showbackdrop: false, opacity: 0});\n }\n resolve();\n }.bind(this);\n this.find('.rm-wrapper').addEventListener('animationend', handler);\n if(typeof this.get('@shared.rm.animating') === 'object'){\n this.set('@shared.rm.delay', this.get('@shared.rm.delay') + this.getAnimationDuration(this.get('@shared.rm.animating').find('.rm-wrapper')) + 100);\n }\n this.set('@shared.rm.animating', this);\n setTimeout(function(){\n if(dir == 'in'){\n this.set({showbackdrop: true, opacity: 1});\n }\n this.set({'anim_class': this.get(dir+'_class'), 'bg_anim_class': this.get('bg_'+dir+'_class')});\n }.bind(this), this.get('@shared.rm.delay'));\n }.bind(this));\n },\n getTopZindex: function(){\n var toret = 0;\n var all = document.querySelectorAll('.rm-wrapper');\n for (var i = 0; i < all.length; i++) {\n toret = parseInt(all[i].style.zIndex) > toret ? parseInt(all[i].style.zIndex) : toret;\n };\n return toret;\n },\n getAnimationDuration: function(el){\n var duration = window.getComputedStyle(el, null)['animation-duration'];\n return (duration.indexOf('ms') !== -1) ? parseFloat(duration.replace('ms', '')) : parseFloat(duration.replace('s', '')) * 1000;\n }\n}));\n\n//# sourceURL=webpack://RactiveModal/./ractive-modal.ractive.html?");
+__webpack_require__.r(__webpack_exports__);
+/* harmony import */ var ractive__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(0);
+/* harmony import */ var ractive__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(ractive__WEBPACK_IMPORTED_MODULE_0__);
-/***/ }),
-/***/ "ractive":
-/*!**********************************************************************************************!*\
- !*** external {"commonjs":"ractive","commonjs2":"ractive","amd":"ractive","root":"Ractive"} ***!
- \**********************************************************************************************/
-/*! no static exports found */
-/***/ (function(module, exports) {
-eval("module.exports = __WEBPACK_EXTERNAL_MODULE_ractive__;\n\n//# sourceURL=webpack://RactiveModal/external_%7B%22commonjs%22:%22ractive%22,%22commonjs2%22:%22ractive%22,%22amd%22:%22ractive%22,%22root%22:%22Ractive%22%7D?");
+ractive__WEBPACK_IMPORTED_MODULE_0___default.a.sharedSet({'rm.animating': undefined, 'rm.delay': 0});
+/* harmony default export */ __webpack_exports__["default"] = (ractive__WEBPACK_IMPORTED_MODULE_0___default.a.extend({
+ template: {v:4,t:[{t:4,f:[{t:7,e:"div",m:[{n:"class",f:["rm-backdrop ",{t:2,r:"bg_class"}," ",{t:2,r:"base_anim_class"}," ",{t:2,r:"bg_anim_class"}," backdrop-",{t:2,r:"modal_id"}],t:13},{n:"style",f:["z-index: ",{t:2,x:{r:["zindex"],s:"_0-1"}},";"],t:13}]}],n:50,r:"showbackdrop"},{t:4,f:[{t:7,e:"div",m:[{n:"class",f:["rm-wrapper ",{t:2,r:"base_anim_class"}," ",{t:2,r:"anim_class"}," ",{t:2,r:"modal_id"}],t:13},{n:"role",f:"dialog",t:13,g:1},{n:"aria-label",f:[{t:2,r:"title"}],t:13},{n:"tabindex",f:"0",t:13,g:1},{n:"style",f:["opacity: ",{t:2,r:"opacity"},"; display: ",{t:2,r:"display"},"; z-index: ",{t:2,r:"zindex"},"; cursor: ",{t:2,x:{r:["enableclose"],s:"_0?\"pointer\":\"default\""}}],t:13},{n:["click"],t:70,f:"clickoutside"},{n:["keydown"],t:70,f:"keydown"}],f:[{t:7,e:"div",m:[{n:"class",f:["rm ",{t:2,r:"class"}],t:13},{n:"style",f:[{t:2,r:"style"}],t:13}],f:[{t:4,f:[{t:7,e:"div",m:[{t:13,n:"class",f:"rm-titlebar",g:1}],f:[{t:7,e:"h3",m:[{t:13,n:"class",f:"rm-title",g:1}],f:[{t:2,r:"title"}]}," ",{t:4,f:[{t:7,e:"button",m:[{t:13,n:"class",f:"rm-btn-close",g:1},{n:"type",f:"button",t:13,g:1},{n:["click"],t:70,f:"close"}],f:["×"]}],n:50,r:"enableclose"}]}],n:50,x:{r:["title","enableclose"],s:"_0||_1"}}," ",{t:7,e:"div",m:[{t:13,n:"class",f:"rm-content",g:1}],f:[{t:16}]}]}]}],n:50,r:"showmodal"}],e:{"_0-1":function (_0){return(_0-1);},"_0?\"pointer\":\"default\"":function (_0){return(_0?"pointer":"default");},"_0||_1":function (_0,_1){return(_0||_1);}}},
+ css: " .rm-backdrop {position: fixed; top: 0; right: 0; bottom: 0; left: 0; background-color: rgba(0, 0, 0, 0.5);} .rm-wrapper {position: fixed; text-align: center; top: 0; right: 0; bottom: 0; left: 0; overflow-x: hidden; overflow-y: auto; display: none; outline: 0;} .rm {position: relative; display: inline-block; width:100%; text-align: left; color: #333333; background-color: #fff; top:30px; cursor: default; min-width: 110px; max-width: 500px; box-shadow: 0 5px 15px rgba(0, 0, 0, 0.5);} .rm-titlebar {padding:15px; color: #333; overflow: auto; border-bottom: 1px solid #e5e5e5;} .rm-title {margin-top:2px; margin-bottom: 0px; display: inline-block; font-size:1.25rem;} .rm-btn-close {padding: 0px 4px 0px 4px; cursor: pointer; background: 0 0; border: 0; font-weight:700; float: right; font-size: 1.5rem; line-height: 1; margin-right: -5px; color:#ccc;} .rm-btn-close:hover, .rm-btn-close:focus:hover{color:#6f6f6f; border-color: transparent; background-color: transparent;} .rm-btn-close:focus {color:#939393; border-color: transparent; background-color: transparent;} .rm-content {padding:15px 15px 15px 15px;} .rm-content .full-hr {width: auto; border: 0; border-top: 1px solid #e0e0e0; margin-top:15px; margin-bottom:15px; margin-left:-14px; margin-right:-14px;} .rm-fadeIn {-webkit-animation-name: rm-fadeIn; animation-name: rm-fadeIn;} @-webkit-keyframes rm-fadeIn {0% {opacity: 0} 100% {opacity: 1}} @keyframes rm-fadeIn {0% {opacity: 0} 100% {opacity: 1}} .rm-fadeOut {-webkit-animation-name: rm-fadeOut; animation-name: rm-fadeOut;} @-webkit-keyframes rm-fadeOut {0% {opacity: 1} 100% {opacity: 0}} @keyframes rm-fadeOut {0% {opacity: 1} 100% {opacity: 0}} .rm-fadeIn, .rm-fadeOut {-webkit-animation-duration: .25s; animation-duration: .25s; -webkit-animation-fill-mode: both; animation-fill-mode: both;}",
+ data: function() {
+ return {
+ showmodal: false,
+ showbackdrop: false,
+ basedon: false,
+ live: false,
+ appendto: '',
+ class: '',
+ bg_class: '',
+ base_anim_class: '',
+ anim_class: '',
+ bg_anim_class: '',
+ bg_in_class: 'rm-fadeIn',
+ bg_out_class: 'rm-fadeOut',
+ in_class: 'rm-fadeIn',
+ out_class: 'rm-fadeOut',
+ style: '',
+ title: '',
+ modal_id: this._guid + '_rm',
+ enableclose: true,
+ base_zindex: 1051,
+ opacity: 0,
+ display: 'none',
+ zindex: 0
+ }
+ },
+ delegate: false,
+ elToFocus: null,
+ on: {
+ close: function(ctx){
+ ctx.original.preventDefault();
+ if(this.get('enableclose')){
+ this.set('basedon', false);
+ }
+ },
+ clickoutside: function(ctx){
+ if(ctx.original.target === ctx.node){
+ this.fire('close', ctx);
+ }
+ },
+ keydown: function(ctx){
+ var e = ctx.original;
+ if(e.which === 27){
+ this.fire('close', ctx);
+ }
+ if(e.which === 9){
+ // Get only visible elements
+ var all = this.findAll('input, select, textarea, button, a').filter(function(el){
+ return !!( el.offsetWidth || el.offsetHeight || el.getClientRects().length );
+ });
+ if(e.shiftKey){
+ if(e.target === all[0] || e.target === this.find('.rm-wrapper')){
+ e.preventDefault();
+ all[all.length-1].focus();
+ }
+ }else{
+ if(e.target === all[all.length-1]){
+ e.preventDefault();
+ all[0].focus();
+ }
+ }
+ }
+ }
+ },
+ onconfig: function(){
+ if(this.get('live')){
+ this.set('showmodal', true);
+ }
+ },
+ onrender: function(){
+ var modal_id = this.get('modal_id');
+ this.observe_basedon = this.observe('basedon', function(newValue, oldValue, keypath){
+ var live = this.get('live');
+ if(newValue === true){
+ if(document.querySelector('.'+modal_id) && document.querySelector('.'+modal_id).style.display === 'block'){
+ return;
+ }
+ this.elToFocus = document.activeElement;
+ this.fire('beforeOpen');
+ var lastZindex = this.getTopZindex();
+ var zindex = (lastZindex === 0) ? this.get('base_zindex') : lastZindex+2;
+ if(!live){
+ this.set('showmodal', true);
+ }
+ this.insert(this.get('appendto') ? document.querySelector(this.get('appendto')) : this.root.el);
+ this.set({'display': 'block', 'zindex': zindex});
+ this.fire('opening');
+ this.animateModal('in').then(function(){
+ this.find('[autofocus]') ? this.find('[autofocus]').focus() : this.find('.rm-wrapper').focus();
+ this.fire('afterOpen');
+ }.bind(this));
+ }else{
+ if(!document.querySelector('.'+modal_id) || document.querySelector('.'+modal_id).style.display !== 'block'){
+ return;
+ }
+ this.fire('beforeClose');
+ this.animateModal('out').then(function(){
+ this.set({'display': 'none', 'zindex': 0});
+ if(!live){
+ this.set('showmodal', false);
+ }
+ this.fire('afterClose');
+ var lastZindex = this.getTopZindex();
+ if(lastZindex > 0){
+ var all = document.querySelectorAll('.rm-wrapper');
+ for (var i = 0; i < all.length; i++) {
+ if(all[i].style.zIndex == lastZindex){
+ var r = ractive__WEBPACK_IMPORTED_MODULE_0___default.a.getContext(all[i]).ractive;
+ if(r.find('.rm-wrapper').contains(this.elToFocus)){
+ this.elToFocus.focus();
+ }else{
+ r.find('[autofocus]') ? r.find('[autofocus]').focus() : r.find('.rm-wrapper').focus();
+ }
+ break;
+ }
+ };
+ }else{
+ if(document.body.contains(this.elToFocus)){
+ this.elToFocus.focus();
+ }
+ }
+ }.bind(this));
+ }
+ }, {
+ defer: true
+ });
+ },
+ onunrender: function(){
+ this.observe_basedon.cancel();
+ },
+ animateModal: function(dir){
+ return new Promise(function(resolve, reject){
+ var handler = function(e) {
+ this.find('.rm-wrapper').removeEventListener('animationend', handler);
+ this.set({
+ 'anim_class': '',
+ 'bg_anim_class': '',
+ '@shared.rm.animating': undefined,
+ '@shared.rm.delay': 0
+ });
+ if(dir == 'out'){
+ this.set({showbackdrop: false, opacity: 0});
+ }
+ resolve();
+ }.bind(this);
+ this.find('.rm-wrapper').addEventListener('animationend', handler);
+ if(typeof this.get('@shared.rm.animating') === 'object'){
+ this.set('@shared.rm.delay', this.get('@shared.rm.delay') + this.getAnimationDuration(this.get('@shared.rm.animating').find('.rm-wrapper')) + 100);
+ }
+ this.set('@shared.rm.animating', this);
+ setTimeout(function(){
+ if(dir == 'in'){
+ this.set({showbackdrop: true, opacity: 1});
+ }
+ this.set({'anim_class': this.get(dir+'_class'), 'bg_anim_class': this.get('bg_'+dir+'_class')});
+ }.bind(this), this.get('@shared.rm.delay'));
+ }.bind(this));
+ },
+ getTopZindex: function(){
+ var toret = 0;
+ var all = document.querySelectorAll('.rm-wrapper');
+ for (var i = 0; i < all.length; i++) {
+ toret = parseInt(all[i].style.zIndex) > toret ? parseInt(all[i].style.zIndex) : toret;
+ };
+ return toret;
+ },
+ getAnimationDuration: function(el){
+ var duration = window.getComputedStyle(el, null)['animation-duration'];
+ return (duration.indexOf('ms') !== -1) ? parseFloat(duration.replace('ms', '')) : parseFloat(duration.replace('s', '')) * 1000;
+ }
+}));
/***/ })
-
-/******/ })["default"];
+/******/ ])["default"];
});
\ No newline at end of file
diff --git a/dist/ractive-modal.min.js b/dist/ractive-modal.min.js
index 497a660..076c998 100644
--- a/dist/ractive-modal.min.js
+++ b/dist/ractive-modal.min.js
@@ -1,9 +1 @@
-!function(e,n){"object"==typeof exports&&"object"==typeof module?module.exports=n(require("ractive")):"function"==typeof define&&define.amd?define(["ractive"],n):"object"==typeof exports?exports.RactiveModal=n(require("ractive")):e.RactiveModal=n(e.Ractive)}(window,function(__WEBPACK_EXTERNAL_MODULE_ractive__){return function(t){var i={};function r(e){if(i[e])return i[e].exports;var n=i[e]={i:e,l:!1,exports:{}};return t[e].call(n.exports,n,n.exports,r),n.l=!0,n.exports}return r.m=t,r.c=i,r.d=function(e,n,t){r.o(e,n)||Object.defineProperty(e,n,{enumerable:!0,get:t})},r.r=function(e){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},r.t=function(n,e){if(1&e&&(n=r(n)),8&e)return n;if(4&e&&"object"==typeof n&&n&&n.__esModule)return n;var t=Object.create(null);if(r.r(t),Object.defineProperty(t,"default",{enumerable:!0,value:n}),2&e&&"string"!=typeof n)for(var i in n)r.d(t,i,function(e){return n[e]}.bind(null,i));return t},r.n=function(e){var n=e&&e.__esModule?function(){return e.default}:function(){return e};return r.d(n,"a",n),n},r.o=function(e,n){return Object.prototype.hasOwnProperty.call(e,n)},r.p="",r(r.s="./ractive-modal.ractive.html")}({"./ractive-modal.ractive.html":
-/*!************************************!*\
- !*** ./ractive-modal.ractive.html ***!
- \************************************/
-/*! exports provided: default */function(module,__webpack_exports__,__webpack_require__){"use strict";eval("__webpack_require__.r(__webpack_exports__);\n/* harmony import */ var ractive__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ractive */ \"ractive\");\n/* harmony import */ var ractive__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(ractive__WEBPACK_IMPORTED_MODULE_0__);\n\n\n\nractive__WEBPACK_IMPORTED_MODULE_0___default.a.sharedSet({'rm.animating': undefined, 'rm.delay': 0});\n/* harmony default export */ __webpack_exports__[\"default\"] = (ractive__WEBPACK_IMPORTED_MODULE_0___default.a.extend({\n template: {v:4,t:[{t:4,f:[{t:7,e:\"div\",m:[{n:\"class\",f:[\"rm-backdrop \",{t:2,r:\"bg_class\"},\" \",{t:2,r:\"base_anim_class\"},\" \",{t:2,r:\"bg_anim_class\"},\" backdrop-\",{t:2,r:\"modal_id\"}],t:13},{n:\"style\",f:[\"z-index: \",{t:2,x:{r:[\"zindex\"],s:\"_0-1\"}},\";\"],t:13}]}],n:50,r:\"showbackdrop\"},{t:4,f:[{t:7,e:\"div\",m:[{n:\"class\",f:[\"rm-wrapper \",{t:2,r:\"base_anim_class\"},\" \",{t:2,r:\"anim_class\"},\" \",{t:2,r:\"modal_id\"}],t:13},{n:\"role\",f:\"dialog\",t:13,g:1},{n:\"aria-label\",f:[{t:2,r:\"title\"}],t:13},{n:\"tabindex\",f:\"0\",t:13,g:1},{n:\"style\",f:[\"opacity: \",{t:2,r:\"opacity\"},\"; display: \",{t:2,r:\"display\"},\"; z-index: \",{t:2,r:\"zindex\"},\"; cursor: \",{t:2,x:{r:[\"enableclose\"],s:\"_0?\\\"pointer\\\":\\\"default\\\"\"}}],t:13},{n:[\"click\"],t:70,f:\"clickoutside\"},{n:[\"keydown\"],t:70,f:\"keydown\"}],f:[{t:7,e:\"div\",m:[{n:\"class\",f:[\"rm \",{t:2,r:\"class\"}],t:13},{n:\"style\",f:[{t:2,r:\"style\"}],t:13}],f:[{t:4,f:[{t:7,e:\"div\",m:[{t:13,n:\"class\",f:\"rm-titlebar\",g:1}],f:[{t:7,e:\"h3\",m:[{t:13,n:\"class\",f:\"rm-title\",g:1}],f:[{t:2,r:\"title\"}]},\" \",{t:4,f:[{t:7,e:\"button\",m:[{t:13,n:\"class\",f:\"rm-btn-close\",g:1},{n:\"type\",f:\"button\",t:13,g:1},{n:[\"click\"],t:70,f:\"close\"}],f:[\"×\"]}],n:50,r:\"enableclose\"}]}],n:50,x:{r:[\"title\",\"enableclose\"],s:\"_0||_1\"}},\" \",{t:7,e:\"div\",m:[{t:13,n:\"class\",f:\"rm-content\",g:1}],f:[{t:16}]}]}]}],n:50,r:\"showmodal\"}],e:{\"_0-1\":function (_0){return(_0-1);},\"_0?\\\"pointer\\\":\\\"default\\\"\":function (_0){return(_0?\"pointer\":\"default\");},\"_0||_1\":function (_0,_1){return(_0||_1);}}},\n css: \" .rm-backdrop {position: fixed; top: 0; right: 0; bottom: 0; left: 0; background-color: rgba(0, 0, 0, 0.5);} .rm-wrapper {position: fixed; text-align: center; top: 0; right: 0; bottom: 0; left: 0; overflow-x: hidden; overflow-y: auto; display: none; outline: 0;} .rm {position: relative; display: inline-block; width:100%; text-align: left; color: #333333; background-color: #fff; top:30px; cursor: default; min-width: 110px; max-width: 500px; box-shadow: 0 5px 15px rgba(0, 0, 0, 0.5);} .rm-titlebar {padding:15px; color: #333; overflow: auto; border-bottom: 1px solid #e5e5e5;} .rm-title {margin-top:2px; margin-bottom: 0px; display: inline-block; font-size:1.25rem;} .rm-btn-close {padding: 0px 4px 0px 4px; cursor: pointer; background: 0 0; border: 0; font-weight:700; float: right; font-size: 1.5rem; line-height: 1; margin-right: -5px; color:#ccc;} .rm-btn-close:hover, .rm-btn-close:focus:hover{color:#6f6f6f; border-color: transparent; background-color: transparent;} .rm-btn-close:focus {color:#939393; border-color: transparent; background-color: transparent;} .rm-content {padding:15px 15px 15px 15px;} .rm-content .full-hr {width: auto; border: 0; border-top: 1px solid #e0e0e0; margin-top:15px; margin-bottom:15px; margin-left:-14px; margin-right:-14px;} .rm-fadeIn {-webkit-animation-name: rm-fadeIn; animation-name: rm-fadeIn;} @-webkit-keyframes rm-fadeIn {0% {opacity: 0} 100% {opacity: 1}} @keyframes rm-fadeIn {0% {opacity: 0} 100% {opacity: 1}} .rm-fadeOut {-webkit-animation-name: rm-fadeOut; animation-name: rm-fadeOut;} @-webkit-keyframes rm-fadeOut {0% {opacity: 1} 100% {opacity: 0}} @keyframes rm-fadeOut {0% {opacity: 1} 100% {opacity: 0}} .rm-fadeIn, .rm-fadeOut {-webkit-animation-duration: .25s; animation-duration: .25s; -webkit-animation-fill-mode: both; animation-fill-mode: both;}\",\n data: function() {\n return {\n showmodal: false,\n showbackdrop: false,\n basedon: false,\n live: false,\n appendto: '',\n class: '',\n bg_class: '',\n base_anim_class: '',\n anim_class: '',\n bg_anim_class: '',\n bg_in_class: 'rm-fadeIn',\n bg_out_class: 'rm-fadeOut',\n in_class: 'rm-fadeIn',\n out_class: 'rm-fadeOut',\n style: '',\n title: '',\n modal_id: this._guid + '_rm',\n enableclose: true,\n base_zindex: 1051,\n opacity: 0,\n display: 'none',\n zindex: 0\n }\n },\n delegate: false,\n elToFocus: null,\n on: {\n close: function(ctx){\n ctx.original.preventDefault();\n if(this.get('enableclose')){\n this.set('basedon', false);\n }\n },\n clickoutside: function(ctx){\n if(ctx.original.target === ctx.node){\n this.fire('close', ctx);\n }\n },\n keydown: function(ctx){\n var e = ctx.original;\n if(e.which === 27){\n this.fire('close', ctx);\n }\n if(e.which === 9){\n // Get only visible elements\n var all = this.findAll('input, select, textarea, button, a').filter(function(el){\n return !!( el.offsetWidth || el.offsetHeight || el.getClientRects().length );\n });\n if(e.shiftKey){\n if(e.target === all[0] || e.target === this.find('.rm-wrapper')){\n e.preventDefault();\n all[all.length-1].focus();\n }\n }else{\n if(e.target === all[all.length-1]){\n e.preventDefault();\n all[0].focus();\n }\n }\n }\n }\n },\n onconfig: function(){\n if(this.get('live')){\n this.set('showmodal', true);\n }\n },\n onrender: function(){\n var modal_id = this.get('modal_id');\n this.observe_basedon = this.observe('basedon', function(newValue, oldValue, keypath){\n var live = this.get('live');\n if(newValue === true){\n if(document.querySelector('.'+modal_id) && document.querySelector('.'+modal_id).style.display === 'block'){\n return;\n }\n this.elToFocus = document.activeElement;\n this.fire('beforeOpen');\n var lastZindex = this.getTopZindex();\n var zindex = (lastZindex === 0) ? this.get('base_zindex') : lastZindex+2;\n if(!live){\n this.set('showmodal', true);\n }\n this.insert(this.get('appendto') ? document.querySelector(this.get('appendto')) : this.root.el);\n this.set({'display': 'block', 'zindex': zindex});\n this.fire('opening');\n this.animateModal('in').then(function(){\n this.find('[autofocus]') ? this.find('[autofocus]').focus() : this.find('.rm-wrapper').focus();\n this.fire('afterOpen');\n }.bind(this));\n }else{\n if(!document.querySelector('.'+modal_id) || document.querySelector('.'+modal_id).style.display !== 'block'){\n return;\n }\n this.fire('beforeClose');\n this.animateModal('out').then(function(){\n this.set({'display': 'none', 'zindex': 0});\n if(!live){\n this.set('showmodal', false);\n }\n this.fire('afterClose');\n var lastZindex = this.getTopZindex();\n if(lastZindex > 0){\n var all = document.querySelectorAll('.rm-wrapper');\n for (var i = 0; i < all.length; i++) {\n if(all[i].style.zIndex == lastZindex){\n var r = ractive__WEBPACK_IMPORTED_MODULE_0___default.a.getContext(all[i]).ractive;\n if(r.find('.rm-wrapper').contains(this.elToFocus)){\n this.elToFocus.focus();\n }else{\n r.find('[autofocus]') ? r.find('[autofocus]').focus() : r.find('.rm-wrapper').focus();\n }\n break;\n }\n };\n }else{\n if(document.body.contains(this.elToFocus)){\n this.elToFocus.focus();\n }\n }\n }.bind(this));\n }\n }, {\n defer: true\n });\n },\n onunrender: function(){\n this.observe_basedon.cancel();\n },\n animateModal: function(dir){\n return new Promise(function(resolve, reject){\n var handler = function(e) {\n this.find('.rm-wrapper').removeEventListener('animationend', handler);\n this.set({\n 'anim_class': '',\n 'bg_anim_class': '',\n '@shared.rm.animating': undefined,\n '@shared.rm.delay': 0\n });\n if(dir == 'out'){\n this.set({showbackdrop: false, opacity: 0});\n }\n resolve();\n }.bind(this);\n this.find('.rm-wrapper').addEventListener('animationend', handler);\n if(typeof this.get('@shared.rm.animating') === 'object'){\n this.set('@shared.rm.delay', this.get('@shared.rm.delay') + this.getAnimationDuration(this.get('@shared.rm.animating').find('.rm-wrapper')) + 100);\n }\n this.set('@shared.rm.animating', this);\n setTimeout(function(){\n if(dir == 'in'){\n this.set({showbackdrop: true, opacity: 1});\n }\n this.set({'anim_class': this.get(dir+'_class'), 'bg_anim_class': this.get('bg_'+dir+'_class')});\n }.bind(this), this.get('@shared.rm.delay'));\n }.bind(this));\n },\n getTopZindex: function(){\n var toret = 0;\n var all = document.querySelectorAll('.rm-wrapper');\n for (var i = 0; i < all.length; i++) {\n toret = parseInt(all[i].style.zIndex) > toret ? parseInt(all[i].style.zIndex) : toret;\n };\n return toret;\n },\n getAnimationDuration: function(el){\n var duration = window.getComputedStyle(el, null)['animation-duration'];\n return (duration.indexOf('ms') !== -1) ? parseFloat(duration.replace('ms', '')) : parseFloat(duration.replace('s', '')) * 1000;\n }\n}));\n\n//# sourceURL=webpack://RactiveModal/./ractive-modal.ractive.html?")},ractive:
-/*!**********************************************************************************************!*\
- !*** external {"commonjs":"ractive","commonjs2":"ractive","amd":"ractive","root":"Ractive"} ***!
- \**********************************************************************************************/
-/*! no static exports found */function(module,exports){eval("module.exports = __WEBPACK_EXTERNAL_MODULE_ractive__;\n\n//# sourceURL=webpack://RactiveModal/external_%7B%22commonjs%22:%22ractive%22,%22commonjs2%22:%22ractive%22,%22amd%22:%22ractive%22,%22root%22:%22Ractive%22%7D?")}}).default});
\ No newline at end of file
+!function(t,e){"object"==typeof exports&&"object"==typeof module?module.exports=e(require("ractive")):"function"==typeof define&&define.amd?define(["ractive"],e):"object"==typeof exports?exports.RactiveModal=e(require("ractive")):t.RactiveModal=e(t.Ractive)}(window,function(n){return function(n){var i={};function o(t){if(i[t])return i[t].exports;var e=i[t]={i:t,l:!1,exports:{}};return n[t].call(e.exports,e,e.exports,o),e.l=!0,e.exports}return o.m=n,o.c=i,o.d=function(t,e,n){o.o(t,e)||Object.defineProperty(t,e,{enumerable:!0,get:n})},o.r=function(t){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(t,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(t,"__esModule",{value:!0})},o.t=function(e,t){if(1&t&&(e=o(e)),8&t)return e;if(4&t&&"object"==typeof e&&e&&e.__esModule)return e;var n=Object.create(null);if(o.r(n),Object.defineProperty(n,"default",{enumerable:!0,value:e}),2&t&&"string"!=typeof e)for(var i in e)o.d(n,i,function(t){return e[t]}.bind(null,i));return n},o.n=function(t){var e=t&&t.__esModule?function(){return t.default}:function(){return t};return o.d(e,"a",e),e},o.o=function(t,e){return Object.prototype.hasOwnProperty.call(t,e)},o.p="",o(o.s=1)}([function(t,e){t.exports=n},function(t,e,n){"use strict";n.r(e);var i=n(0),s=n.n(i);s.a.sharedSet({"rm.animating":void 0,"rm.delay":0}),e.default=s.a.extend({template:{v:4,t:[{t:4,f:[{t:7,e:"div",m:[{n:"class",f:["rm-backdrop ",{t:2,r:"bg_class"}," ",{t:2,r:"base_anim_class"}," ",{t:2,r:"bg_anim_class"}," backdrop-",{t:2,r:"modal_id"}],t:13},{n:"style",f:["z-index: ",{t:2,x:{r:["zindex"],s:"_0-1"}},";"],t:13}]}],n:50,r:"showbackdrop"},{t:4,f:[{t:7,e:"div",m:[{n:"class",f:["rm-wrapper ",{t:2,r:"base_anim_class"}," ",{t:2,r:"anim_class"}," ",{t:2,r:"modal_id"}],t:13},{n:"role",f:"dialog",t:13,g:1},{n:"aria-label",f:[{t:2,r:"title"}],t:13},{n:"tabindex",f:"0",t:13,g:1},{n:"style",f:["opacity: ",{t:2,r:"opacity"},"; display: ",{t:2,r:"display"},"; z-index: ",{t:2,r:"zindex"},"; cursor: ",{t:2,x:{r:["enableclose"],s:'_0?"pointer":"default"'}}],t:13},{n:["click"],t:70,f:"clickoutside"},{n:["keydown"],t:70,f:"keydown"}],f:[{t:7,e:"div",m:[{n:"class",f:["rm ",{t:2,r:"class"}],t:13},{n:"style",f:[{t:2,r:"style"}],t:13}],f:[{t:4,f:[{t:7,e:"div",m:[{t:13,n:"class",f:"rm-titlebar",g:1}],f:[{t:7,e:"h3",m:[{t:13,n:"class",f:"rm-title",g:1}],f:[{t:2,r:"title"}]}," ",{t:4,f:[{t:7,e:"button",m:[{t:13,n:"class",f:"rm-btn-close",g:1},{n:"type",f:"button",t:13,g:1},{n:["click"],t:70,f:"close"}],f:["×"]}],n:50,r:"enableclose"}]}],n:50,x:{r:["title","enableclose"],s:"_0||_1"}}," ",{t:7,e:"div",m:[{t:13,n:"class",f:"rm-content",g:1}],f:[{t:16}]}]}]}],n:50,r:"showmodal"}],e:{"_0-1":function(t){return t-1},'_0?"pointer":"default"':function(t){return t?"pointer":"default"},"_0||_1":function(t,e){return t||e}}},css:" .rm-backdrop {position: fixed; top: 0; right: 0; bottom: 0; left: 0; background-color: rgba(0, 0, 0, 0.5);} .rm-wrapper {position: fixed; text-align: center; top: 0; right: 0; bottom: 0; left: 0; overflow-x: hidden; overflow-y: auto; display: none; outline: 0;} .rm {position: relative; display: inline-block; width:100%; text-align: left; color: #333333; background-color: #fff; top:30px; cursor: default; min-width: 110px; max-width: 500px; box-shadow: 0 5px 15px rgba(0, 0, 0, 0.5);} .rm-titlebar {padding:15px; color: #333; overflow: auto; border-bottom: 1px solid #e5e5e5;} .rm-title {margin-top:2px; margin-bottom: 0px; display: inline-block; font-size:1.25rem;} .rm-btn-close {padding: 0px 4px 0px 4px; cursor: pointer; background: 0 0; border: 0; font-weight:700; float: right; font-size: 1.5rem; line-height: 1; margin-right: -5px; color:#ccc;} .rm-btn-close:hover, .rm-btn-close:focus:hover{color:#6f6f6f; border-color: transparent; background-color: transparent;} .rm-btn-close:focus {color:#939393; border-color: transparent; background-color: transparent;} .rm-content {padding:15px 15px 15px 15px;} .rm-content .full-hr {width: auto; border: 0; border-top: 1px solid #e0e0e0; margin-top:15px; margin-bottom:15px; margin-left:-14px; margin-right:-14px;} .rm-fadeIn {-webkit-animation-name: rm-fadeIn; animation-name: rm-fadeIn;} @-webkit-keyframes rm-fadeIn {0% {opacity: 0} 100% {opacity: 1}} @keyframes rm-fadeIn {0% {opacity: 0} 100% {opacity: 1}} .rm-fadeOut {-webkit-animation-name: rm-fadeOut; animation-name: rm-fadeOut;} @-webkit-keyframes rm-fadeOut {0% {opacity: 1} 100% {opacity: 0}} @keyframes rm-fadeOut {0% {opacity: 1} 100% {opacity: 0}} .rm-fadeIn, .rm-fadeOut {-webkit-animation-duration: .25s; animation-duration: .25s; -webkit-animation-fill-mode: both; animation-fill-mode: both;}",data:function(){return{showmodal:!1,showbackdrop:!1,basedon:!1,live:!1,appendto:"",class:"",bg_class:"",base_anim_class:"",anim_class:"",bg_anim_class:"",bg_in_class:"rm-fadeIn",bg_out_class:"rm-fadeOut",in_class:"rm-fadeIn",out_class:"rm-fadeOut",style:"",title:"",modal_id:this._guid+"_rm",enableclose:!0,base_zindex:1051,opacity:0,display:"none",zindex:0}},delegate:!1,elToFocus:null,on:{close:function(t){t.original.preventDefault(),this.get("enableclose")&&this.set("basedon",!1)},clickoutside:function(t){t.original.target===t.node&&this.fire("close",t)},keydown:function(t){var e=t.original;if(27===e.which&&this.fire("close",t),9===e.which){var n=this.findAll("input, select, textarea, button, a").filter(function(t){return!!(t.offsetWidth||t.offsetHeight||t.getClientRects().length)});e.shiftKey?e.target!==n[0]&&e.target!==this.find(".rm-wrapper")||(e.preventDefault(),n[n.length-1].focus()):e.target===n[n.length-1]&&(e.preventDefault(),n[0].focus())}}},onconfig:function(){this.get("live")&&this.set("showmodal",!0)},onrender:function(){var a=this.get("modal_id");this.observe_basedon=this.observe("basedon",function(t,e,n){var o=this.get("live");if(!0===t){if(document.querySelector("."+a)&&"block"===document.querySelector("."+a).style.display)return;this.elToFocus=document.activeElement,this.fire("beforeOpen");var i=this.getTopZindex(),r=0===i?this.get("base_zindex"):i+2;o||this.set("showmodal",!0),this.insert(this.get("appendto")?document.querySelector(this.get("appendto")):this.root.el),this.set({display:"block",zindex:r}),this.fire("opening"),this.animateModal("in").then(function(){this.find("[autofocus]")?this.find("[autofocus]").focus():this.find(".rm-wrapper").focus(),this.fire("afterOpen")}.bind(this))}else{if(!document.querySelector("."+a)||"block"!==document.querySelector("."+a).style.display)return;this.fire("beforeClose"),this.animateModal("out").then(function(){this.set({display:"none",zindex:0}),o||this.set("showmodal",!1),this.fire("afterClose");var t=this.getTopZindex();if(0t?parseInt(e[n].style.zIndex):t;return t},getAnimationDuration:function(t){var e=window.getComputedStyle(t,null)["animation-duration"];return-1!==e.indexOf("ms")?parseFloat(e.replace("ms","")):1e3*parseFloat(e.replace("s",""))}})}]).default});
\ No newline at end of file
diff --git a/package.json b/package.json
index 1e95d56..48cff6a 100644
--- a/package.json
+++ b/package.json
@@ -1,7 +1,7 @@
{
- "//": "To use type: npm run dev",
+ "//": "To use type: npm run watch",
"name": "ractive-modal",
- "version": "0.3.1",
+ "version": "0.3.2",
"description": "A modal popup component for ractive",
"main": "dist/ractive-modal.js",
"repository": "https://github.com/kouts/ractive-modal",
@@ -12,15 +12,15 @@
"popup"
],
"devDependencies": {
- "onchange": "*",
- "ractive": "*",
+ "ractive": "^1.1.1",
"ractive-bin-loader": "^1.0.1",
"uglifyjs-webpack-plugin": "^2.0.1",
"webpack": "^4.27.1",
"webpack-cli": "^3.1.2"
},
"scripts": {
- "start": "webpack --config webpack.config.js"
+ "build": "webpack --config webpack.config.js",
+ "watch": "webpack --config webpack.config.js --watch"
},
"author": "kouts",
"license": "ISC",
diff --git a/webpack.config.js b/webpack.config.js
index 85ce862..3b7552f 100644
--- a/webpack.config.js
+++ b/webpack.config.js
@@ -4,7 +4,7 @@ const UglifyJsPlugin = require('uglifyjs-webpack-plugin');
module.exports = {
node: false,
- mode: 'development',
+ mode: 'production',
target: 'web',
context: path.resolve(__dirname, 'src'),
optimization: {
diff --git a/webpack.config.old.js b/webpack.config.old.js
deleted file mode 100644
index 5f88576..0000000
--- a/webpack.config.old.js
+++ /dev/null
@@ -1,49 +0,0 @@
-var path = require('path');
-var webpack = require('webpack');
-
-var commonsPlugin = new webpack.optimize.CommonsChunkPlugin('common');
-
-// Lazymode so we don't have to require Ractive in every component / endpoint / etc
-/*
-var providerPlugin = new webpack.ProvidePlugin({
- Ractive: 'ractive'
-});
-*/
-
-// Minify javascript
-var minifyPlugin = new webpack.optimize.UglifyJsPlugin({
- include: /\.min\.js$/,
- compress: {
- warnings: false
- }
-});
-
-module.exports = {
- module: {
- loaders: [
- {
- test: /\.ractive\.html$/,
- loaders: 'ractive-bin-loader'
- }
- ]
- },
- plugins: [
- // providerPlugin,
- minifyPlugin
- ],
- externals: {
- ractive: 'Ractive'
- },
- target: 'web',
- entry: {
- 'ractive-modal': './src/ractive-modal.ractive.html',
- 'ractive-modal.min': './src/ractive-modal.ractive.html'
- },
- output: {
- filename: '[name].js',
- path: path.resolve(__dirname, 'dist'),
- library: "RactiveModal",
- libraryExport: "default",
- libraryTarget: "umd"
- }
-};
\ No newline at end of file