Socket
Socket
Sign inDemoInstall

@stormid/modal-gallery

Package Overview
Dependencies
Maintainers
0
Versions
9
Alerts
File Explorer

Advanced tools

License
Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

@stormid/modal-gallery - npm Package Compare versions

Comparing version 1.0.0-alpha.11 to 1.0.0-alpha.12

dist/index.modern.js
dist/index.modern.js.map

2

dist/index.js

@@ -1,2 +0,2 @@

function e(){return e=Object.assign?Object.assign.bind():function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var l in n)Object.prototype.hasOwnProperty.call(n,l)&&(e[l]=n[l])}return e},e.apply(this,arguments)}var t=["button","a"],n=["a[href]","area[href]","input:not([disabled])","select:not([disabled])","textarea:not([disabled])","button:not([disabled])","iframe","object","embed","[contenteditable]",'[tabindex]:not([tabindex="-1"])'],l=function(e){return e.replace(/&/g,"&amp;").replace(/</g,"&lt;").replace(/>/g,"&gt;")},i={fullscreen:!1,preload:!1,totals:!0,scrollable:!1,single:!1,templates:{__proto__:null,overlay:function(){var e=document.createElement("div");return e.className="modal-gallery__outer js-modal-gallery__outer",e.setAttribute("role","dialog"),e.setAttribute("tabindex","-1"),e.setAttribute("aria-hidden",!0),e},overlayInner:function(e,t){return'<div class="modal-gallery__inner js-modal-gallery__inner" role="group" aria-roledescription="carousel">\n <div class="modal-gallery__content js-modal-gallery__content" aria-atomic="false" aria-live="polite">\n '+t+"\n </div>\n </div>\n "+e+'\n <button class="js-modal-gallery__close modal-gallery__close" aria-label="Close">\n <svg focusable="false" aria-hidden="true" width="30" height="30" stroke="#fff">\n <g stroke-width="4">\n <line x1="5" y1="5" x2="25" y2="25"/>\n <line x1="5" y1="25" x2="25" y2="5"/>\n </g>\n </svg>\n </button>\n <div class="modal-gallery__total js-gallery-totals"></div>'},buttons:function(){return'<button class="js-modal-gallery__next modal-gallery__next" aria-label="Next">\n <svg focusable="false" aria-hidden="true" width="44" height="60" stroke="#fff">\n <polyline points="14 10 34 30 14 50" stroke-width="4" stroke-linecap="butt" fill="none" stroke-linejoin="round"/>\n </svg>\n </button>\n <button class="js-modal-gallery__previous modal-gallery__previous" aria-label="Previous">\n <svg focusable="false" aria-hidden="true" width="44" height="60" stroke="#fff">\n <polyline points="30 10 10 30 30 50" stroke-width="4" stroke-linecap="butt" fill="none" stroke-linejoin="round"/>\n </svg>\n</button>'},item:function(e){return function(t,n){return'<div class="modal-gallery__item js-modal-gallery__item" role="group" aria-roledescription="slide" aria-label="Image '+(n+1)+" of "+e.length+(e[n].title?", "+e[n].title:"")+'">\n <div class="modal-gallery__img-container js-modal-gallery__img-container"></div>\n '+t+"\n </div>"}},details:function(e){return e.title||e.description?'<div class="modal-gallery__details">\n '+(e.title?'<h1 class="modal-gallery__title">'+l(e.title)+"</h1>":"")+"\n "+(e.description?'<div class="modal-gallery__description">'+l(e.description)+"</div>":"")+"\n </div>":""}}},r=function(e){return function(t){var n=t.items,l=t.settings;n.map(function(t,n){t.trigger&&t.trigger.addEventListener("click",function(t){t.preventDefault(),h(e)(n)})}),l.preload&&n.map(a(e))}},a=function(e){return function(t,n){try{var l=new Image,i=function(){var t=e.getState().imageCache;t[n]=l,e.dispatch({imageCache:t}),c(e.getState(),n)};l.onload=i,l.src=t.src,l.complete&&i()}catch(e){console.warn(e)}}},o=function(e){return function(t){var l=e.getState(),i=l.settings,r=l.items,a=l.keyListener,o=document.body.appendChild(i.templates.overlay()),c=r.length>1?i.templates.buttons():"";o.insertAdjacentHTML("beforeend",i.templates.overlayInner(c,r.map(i.templates.details).map(i.templates.item(r)).join("")));var d,m=[].slice.call(o.querySelectorAll(".js-modal-gallery__item")),v=o.querySelector(".js-gallery-totals");e.dispatch({dom:{overlay:o,items:m,totals:v,focusableChildren:(d=o,[].slice.call(d.querySelectorAll(n.join(",")))),lastFocused:document.activeElement}},[s(e),u(e),function(){return document.addEventListener("keydown",a)},g(e),f])}},s=function(e){return function(t){var n=e.getState(),l=n.imageCache,i=n.items,r=n.current;Object.keys(l).length===i.length?l.map(function(e,n){c(t,n)}):function(e){return function(t){var n=e.getState(),l=n.imageCache,i=n.items,r=n.dom,o=[t];i.length>1&&o.push(0===t?i.length-1:t-1),i.length>2&&o.push(t===i.length-1?0:t+1),o.forEach(function(t){void 0===l[t]&&(r.items[t].classList.add("loading"),a(e)(i[t],t))})}}(e)(r)}},c=function(e,t){var n=e.dom,l=e.settings,i=e.items;if(n){var r=n.items[t].querySelector(".js-modal-gallery__img-container");r.querySelector(".modal-gallery__img")||(r.innerHTML='<img class="'+(l.scrollable?"modal-gallery__img modal-gallery__img--scrollable":"modal-gallery__img")+'" src="'+i[t].src+'" alt="'+i[t].title+'"'+(n.items[t].srcset?' srcset="'+n.items[t].srcset+'"':"")+(n.items[t].sizes?' sizes="'+n.items[t].sizes+'"':"")+">",n.items[t].classList.remove("loading"))}},u=function(e){return function(n){var l=e.getState().dom,i=function(e){return t.map(function(t){return t+"."+e}).join(", ")},r=l.overlay.querySelector(i("js-modal-gallery__close"));r?r.addEventListener("click",function(t){b(e)}):console.warn("No close buttons or links found.");var a=l.overlay.querySelector(i("js-modal-gallery__previous")),o=l.overlay.querySelector(i("js-modal-gallery__next"));a||o?(a&&a.addEventListener("click",function(t){y(e)}),o&&o.addEventListener("click",function(t){p(e)})):console.warn("No next or previous buttons or links found.")}},d=function(e){return function(t){if(e.getState().isOpen)switch(t.keyCode){case 27:b(e);break;case 9:m(e,t);break;case 37:y(e);break;case 39:p(e)}}},m=function(e,t){var n=e.getState().dom,l=n.focusableChildren.indexOf(document.activeElement);t.shiftKey&&0===l&&(t.preventDefault(),n.focusableChildren[n.focusableChildren.length-1].focus()),t.shiftKey||l!==n.focusableChildren.length-1||(t.preventDefault(),n.focusableChildren[0].focus())},g=function(e){return function(t){var n=e.getState(),l=n.dom,i=n.current,r=n.isOpen,a=n.settings;l.overlay.classList.toggle("is--active"),l.overlay.setAttribute("aria-hidden",!r),l.overlay.setAttribute("tabindex",r?"0":"-1"),null!==r&&l.items[i].classList.add("is--active"),l.focusableChildren&&l.focusableChildren.length>0&&window.setTimeout(function(){l.focusableChildren[0].focus()},0),a.fullscreen&&v(t)}},f=function(e){e.settings.totals&&(e.dom.totals.innerHTML=e.current+1+"/"+e.items.length)},v=function(e){var t=e.dom;e.isOpen?(t.overlay.requestFullscreen&&t.overlay.requestFullscreen(),t.overlay.webkitRequestFullscreen&&t.overlay.webkitRequestFullscreen(),t.overlay.mozRequestFullScreen&&t.overlay.mozRequestFullScreen()):(document.exitFullscreen&&document.exitFullscreen(),document.mozCancelFullScreen&&document.mozCancelFullScreen(),document.webkitExitFullscreen&&document.webkitExitFullscreen())},y=function(e){var t=e.getState(),n=t.current,l=t.dom,i=0===n?l.items.length-1:n-1;e.dispatch({current:i},[function(){return l.items[n].classList.remove("is--active")},function(){return l.items[i].classList.add("is--active")},s(e),f])},p=function(e){var t=e.getState(),n=t.current,l=t.dom,i=n===l.items.length-1?0:n+1;e.dispatch({current:i},[function(){return l.items[n].classList.remove("is--active")},function(){return l.items[i].classList.add("is--active")},s(e),f])},b=function(e){var t=e.getState(),n=t.keyListener,l=t.lastFocused,i=t.dom;e.dispatch({current:null,isOpen:!1},[function(){return document.removeEventListener("keydown",n)},function(){l&&l.focus()},function(){return i.overlay.parentNode.removeChild(i.overlay)}])},h=function(e){return function(t){void 0===t&&(t=0),e.dispatch({current:t,isOpen:!0},[o(e)])}},_=function(t,n){return Object.create((l={items:t,settings:e({},i,n)},a={},(o={dispatch:function(t,n){a=t?e({},a,t):a,n&&n.forEach(function(e){return e(a)})},getState:function(){return a}}).dispatch({settings:l.settings,items:l.items,imageCache:[],isOpen:!1,current:null,keyListener:d(o)},[r(o)]),{getState:o.getState,open:h(o)}));var l,a,o},k=function(e){return"string"==typeof e?[].slice.call(document.querySelectorAll(e)):e instanceof Array?e:Object.prototype.isPrototypeOf.call(NodeList.prototype,e)?[].slice.call(e):e instanceof HTMLElement?[e]:[]};module.exports=function(e,t){if(e)return t&&t.single?function(e,t){var n=k(e);if(n.length)return n.map(function(e){return _([{trigger:e,src:e.getAttribute("href"),srcset:e.getAttribute("data-srcset")||null,sizes:e.getAttribute("data-sizes")||null,title:e.getAttribute("data-title")||"",description:e.getAttribute("data-description")||""}],t)});console.warn("Modal Gallery cannot be initialised, no images found")}(e,t):function(e,t){var n=k(e);if(n.length){var l=n.map(function(e){return e instanceof HTMLElement?{trigger:e,src:e.getAttribute("href"),srcset:e.getAttribute("data-srcset")||null,sizes:e.getAttribute("data-sizes")||null,title:e.getAttribute("data-title")||"",description:e.getAttribute("data-description")||""}:e});return _(l,t)}console.warn("Modal Gallery cannot be initialised, no images found")}(e,t);console.warn("Modal Gallery cannot be initialised, no images found")};
function e(){return(e=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var l in n)Object.prototype.hasOwnProperty.call(n,l)&&(e[l]=n[l])}return e}).apply(this,arguments)}var t=["button","a"],n=["a[href]","area[href]","input:not([disabled])","select:not([disabled])","textarea:not([disabled])","button:not([disabled])","iframe","object","embed","[contenteditable]",'[tabindex]:not([tabindex="-1"])'],l=function(e){return e.replace(/&/g,"&amp;").replace(/</g,"&lt;").replace(/>/g,"&gt;")},r={fullscreen:!1,preload:!1,totals:!0,scrollable:!1,single:!1,templates:{__proto__:null,overlay:function(){var e=document.createElement("div");return e.className="modal-gallery__outer js-modal-gallery__outer",e.setAttribute("role","dialog"),e.setAttribute("tabindex","-1"),e.setAttribute("aria-hidden",!0),e},overlayInner:function(e,t){return'<div class="modal-gallery__inner js-modal-gallery__inner" role="group" aria-roledescription="carousel">\n <div class="modal-gallery__content js-modal-gallery__content" aria-atomic="false" aria-live="polite">\n '+t+"\n </div>\n </div>\n "+e+'\n <button class="js-modal-gallery__close modal-gallery__close" aria-label="Close">\n <svg focusable="false" aria-hidden="true" width="30" height="30" stroke="#fff">\n <g stroke-width="4">\n <line x1="5" y1="5" x2="25" y2="25"/>\n <line x1="5" y1="25" x2="25" y2="5"/>\n </g>\n </svg>\n </button>\n <div class="modal-gallery__total js-gallery-totals"></div>'},buttons:function(){return'<button class="js-modal-gallery__next modal-gallery__next" aria-label="Next">\n <svg focusable="false" aria-hidden="true" width="44" height="60" stroke="#fff">\n <polyline points="14 10 34 30 14 50" stroke-width="4" stroke-linecap="butt" fill="none" stroke-linejoin="round"/>\n </svg>\n </button>\n <button class="js-modal-gallery__previous modal-gallery__previous" aria-label="Previous">\n <svg focusable="false" aria-hidden="true" width="44" height="60" stroke="#fff">\n <polyline points="30 10 10 30 30 50" stroke-width="4" stroke-linecap="butt" fill="none" stroke-linejoin="round"/>\n </svg>\n</button>'},item:function(e){return function(t,n){return'<div class="modal-gallery__item js-modal-gallery__item" role="group" aria-roledescription="slide" aria-label="Image '+(n+1)+" of "+e.length+(e[n].title?", "+e[n].title:"")+'">\n <div class="modal-gallery__img-container js-modal-gallery__img-container"></div>\n '+t+"\n </div>"}},details:function(e){return e.title||e.description?'<div class="modal-gallery__details">\n '+(e.title?'<h1 class="modal-gallery__title">'+l(e.title)+"</h1>":"")+"\n "+(e.description?'<div class="modal-gallery__description">'+l(e.description)+"</div>":"")+"\n </div>":""}}},i=function(e){return function(t){var n=t.items,l=t.settings;n.map(function(t,n){t.trigger&&t.trigger.addEventListener("click",function(t){t.preventDefault(),h(e)(n)})}),l.preload&&n.map(a(e))}},a=function(e){return function(t,n){try{var l=new Image,r=function(){var t=e.getState().imageCache;t[n]=l,e.dispatch({imageCache:t}),c(e.getState(),n)};l.onload=r,l.src=t.src,l.complete&&r()}catch(e){console.warn(e)}}},o=function(e){return function(t){var l=e.getState(),r=l.settings,i=l.items,a=l.keyListener,o=document.body.appendChild(r.templates.overlay()),c=i.length>1?r.templates.buttons():"";o.insertAdjacentHTML("beforeend",r.templates.overlayInner(c,i.map(r.templates.details).map(r.templates.item(i)).join("")));var d,m=[].slice.call(o.querySelectorAll(".js-modal-gallery__item")),v=o.querySelector(".js-gallery-totals");e.dispatch({dom:{overlay:o,items:m,totals:v,focusableChildren:(d=o,[].slice.call(d.querySelectorAll(n.join(",")))),lastFocused:document.activeElement}},[s(e),u(e),function(){return document.addEventListener("keydown",a)},g(e),f])}},s=function(e){return function(t){var n=e.getState(),l=n.imageCache,r=n.items,i=n.current;Object.keys(l).length===r.length?l.map(function(e,n){c(t,n)}):function(e){return function(t){var n=e.getState(),l=n.imageCache,r=n.items,i=n.dom,o=[t];r.length>1&&o.push(0===t?r.length-1:t-1),r.length>2&&o.push(t===r.length-1?0:t+1),o.forEach(function(t){void 0===l[t]&&(i.items[t].classList.add("loading"),a(e)(r[t],t))})}}(e)(i)}},c=function(e,t){var n=e.dom,l=e.settings,r=e.items;if(n){var i=n.items[t].querySelector(".js-modal-gallery__img-container");i.querySelector(".modal-gallery__img")||(i.innerHTML='<img class="'+(l.scrollable?"modal-gallery__img modal-gallery__img--scrollable":"modal-gallery__img")+'" src="'+r[t].src+'" alt="'+r[t].title+'"'+(n.items[t].srcset?' srcset="'+n.items[t].srcset+'"':"")+(n.items[t].sizes?' sizes="'+n.items[t].sizes+'"':"")+">",n.items[t].classList.remove("loading"))}},u=function(e){return function(n){var l=e.getState().dom,r=function(e){return t.map(function(t){return t+"."+e}).join(", ")},i=l.overlay.querySelector(r("js-modal-gallery__close"));i?i.addEventListener("click",function(t){b(e)}):console.warn("No close buttons or links found.");var a=l.overlay.querySelector(r("js-modal-gallery__previous")),o=l.overlay.querySelector(r("js-modal-gallery__next"));a||o?(a&&a.addEventListener("click",function(t){y(e)}),o&&o.addEventListener("click",function(t){p(e)})):console.warn("No next or previous buttons or links found.")}},d=function(e){return function(t){if(e.getState().isOpen)switch(t.keyCode){case 27:b(e);break;case 9:m(e,t);break;case 37:y(e);break;case 39:p(e)}}},m=function(e,t){var n=e.getState().dom,l=n.focusableChildren.indexOf(document.activeElement);t.shiftKey&&0===l&&(t.preventDefault(),n.focusableChildren[n.focusableChildren.length-1].focus()),t.shiftKey||l!==n.focusableChildren.length-1||(t.preventDefault(),n.focusableChildren[0].focus())},g=function(e){return function(t){var n=e.getState(),l=n.dom,r=n.current,i=n.isOpen,a=n.settings;l.overlay.classList.toggle("is--active"),l.overlay.setAttribute("aria-hidden",!i),l.overlay.setAttribute("tabindex",i?"0":"-1"),null!==i&&l.items[r].classList.add("is--active"),l.focusableChildren&&l.focusableChildren.length>0&&window.setTimeout(function(){l.focusableChildren[0].focus()},0),a.fullscreen&&v(t)}},f=function(e){e.settings.totals&&(e.dom.totals.innerHTML=e.current+1+"/"+e.items.length)},v=function(e){var t=e.dom;e.isOpen?(t.overlay.requestFullscreen&&t.overlay.requestFullscreen(),t.overlay.webkitRequestFullscreen&&t.overlay.webkitRequestFullscreen(),t.overlay.mozRequestFullScreen&&t.overlay.mozRequestFullScreen()):(document.exitFullscreen&&document.exitFullscreen(),document.mozCancelFullScreen&&document.mozCancelFullScreen(),document.webkitExitFullscreen&&document.webkitExitFullscreen())},y=function(e){var t=e.getState(),n=t.current,l=t.dom,r=0===n?l.items.length-1:n-1;e.dispatch({current:r},[function(){return l.items[n].classList.remove("is--active")},function(){return l.items[r].classList.add("is--active")},s(e),f])},p=function(e){var t=e.getState(),n=t.current,l=t.dom,r=n===l.items.length-1?0:n+1;e.dispatch({current:r},[function(){return l.items[n].classList.remove("is--active")},function(){return l.items[r].classList.add("is--active")},s(e),f])},b=function(e){var t=e.getState(),n=t.keyListener,l=t.lastFocused,r=t.dom;e.dispatch({current:null,isOpen:!1},[function(){return document.removeEventListener("keydown",n)},function(){l&&l.focus()},function(){return r.overlay.parentNode.removeChild(r.overlay)}])},h=function(e){return function(t){void 0===t&&(t=0),e.dispatch({current:t,isOpen:!0},[o(e)])}},_=function(t,n){return Object.create((l={items:t,settings:e({},r,n)},a={},(o={dispatch:function(t,n){a=t?e({},a,t):a,n&&n.forEach(function(e){return e(a)})},getState:function(){return a}}).dispatch({settings:l.settings,items:l.items,imageCache:[],isOpen:!1,current:null,keyListener:d(o)},[i(o)]),{getState:o.getState,open:h(o)}));var l,a,o},k=function(e){return"string"==typeof e?[].slice.call(document.querySelectorAll(e)):e instanceof Array?e:Object.prototype.isPrototypeOf.call(NodeList.prototype,e)?[].slice.call(e):e instanceof HTMLElement?[e]:[]};module.exports=function(e,t){if(e)return t&&t.single?function(e,t){var n=k(e);if(n.length)return n.map(function(e){return _([{trigger:e,src:e.getAttribute("href"),srcset:e.getAttribute("data-srcset")||null,sizes:e.getAttribute("data-sizes")||null,title:e.getAttribute("data-title")||"",description:e.getAttribute("data-description")||""}],t)});console.warn("Modal Gallery cannot be initialised, no images found")}(e,t):function(e,t){var n=k(e);if(n.length){var l=n.map(function(e){return e instanceof HTMLElement?{trigger:e,src:e.getAttribute("href"),srcset:e.getAttribute("data-srcset")||null,sizes:e.getAttribute("data-sizes")||null,title:e.getAttribute("data-title")||"",description:e.getAttribute("data-description")||""}:e});return _(l,t)}console.warn("Modal Gallery cannot be initialised, no images found")}(e,t);console.warn("Modal Gallery cannot be initialised, no images found")};
//# sourceMappingURL=index.js.map

2

dist/index.umd.js

@@ -1,2 +0,2 @@

!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?module.exports=t():"function"==typeof define&&define.amd?define(t):(e||self).ModalGallery=t()}(this,function(){function e(){return e=Object.assign?Object.assign.bind():function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var l in n)Object.prototype.hasOwnProperty.call(n,l)&&(e[l]=n[l])}return e},e.apply(this,arguments)}var t=["button","a"],n=["a[href]","area[href]","input:not([disabled])","select:not([disabled])","textarea:not([disabled])","button:not([disabled])","iframe","object","embed","[contenteditable]",'[tabindex]:not([tabindex="-1"])'],l=function(e){return e.replace(/&/g,"&amp;").replace(/</g,"&lt;").replace(/>/g,"&gt;")},i={fullscreen:!1,preload:!1,totals:!0,scrollable:!1,single:!1,templates:{__proto__:null,overlay:function(){var e=document.createElement("div");return e.className="modal-gallery__outer js-modal-gallery__outer",e.setAttribute("role","dialog"),e.setAttribute("tabindex","-1"),e.setAttribute("aria-hidden",!0),e},overlayInner:function(e,t){return'<div class="modal-gallery__inner js-modal-gallery__inner" role="group" aria-roledescription="carousel">\n <div class="modal-gallery__content js-modal-gallery__content" aria-atomic="false" aria-live="polite">\n '+t+"\n </div>\n </div>\n "+e+'\n <button class="js-modal-gallery__close modal-gallery__close" aria-label="Close">\n <svg focusable="false" aria-hidden="true" width="30" height="30" stroke="#fff">\n <g stroke-width="4">\n <line x1="5" y1="5" x2="25" y2="25"/>\n <line x1="5" y1="25" x2="25" y2="5"/>\n </g>\n </svg>\n </button>\n <div class="modal-gallery__total js-gallery-totals"></div>'},buttons:function(){return'<button class="js-modal-gallery__next modal-gallery__next" aria-label="Next">\n <svg focusable="false" aria-hidden="true" width="44" height="60" stroke="#fff">\n <polyline points="14 10 34 30 14 50" stroke-width="4" stroke-linecap="butt" fill="none" stroke-linejoin="round"/>\n </svg>\n </button>\n <button class="js-modal-gallery__previous modal-gallery__previous" aria-label="Previous">\n <svg focusable="false" aria-hidden="true" width="44" height="60" stroke="#fff">\n <polyline points="30 10 10 30 30 50" stroke-width="4" stroke-linecap="butt" fill="none" stroke-linejoin="round"/>\n </svg>\n</button>'},item:function(e){return function(t,n){return'<div class="modal-gallery__item js-modal-gallery__item" role="group" aria-roledescription="slide" aria-label="Image '+(n+1)+" of "+e.length+(e[n].title?", "+e[n].title:"")+'">\n <div class="modal-gallery__img-container js-modal-gallery__img-container"></div>\n '+t+"\n </div>"}},details:function(e){return e.title||e.description?'<div class="modal-gallery__details">\n '+(e.title?'<h1 class="modal-gallery__title">'+l(e.title)+"</h1>":"")+"\n "+(e.description?'<div class="modal-gallery__description">'+l(e.description)+"</div>":"")+"\n </div>":""}}},r=function(e){return function(t){var n=t.items,l=t.settings;n.map(function(t,n){t.trigger&&t.trigger.addEventListener("click",function(t){t.preventDefault(),h(e)(n)})}),l.preload&&n.map(a(e))}},a=function(e){return function(t,n){try{var l=new Image,i=function(){var t=e.getState().imageCache;t[n]=l,e.dispatch({imageCache:t}),c(e.getState(),n)};l.onload=i,l.src=t.src,l.complete&&i()}catch(e){console.warn(e)}}},o=function(e){return function(t){var l=e.getState(),i=l.settings,r=l.items,a=l.keyListener,o=document.body.appendChild(i.templates.overlay()),c=r.length>1?i.templates.buttons():"";o.insertAdjacentHTML("beforeend",i.templates.overlayInner(c,r.map(i.templates.details).map(i.templates.item(r)).join("")));var d,f=[].slice.call(o.querySelectorAll(".js-modal-gallery__item")),v=o.querySelector(".js-gallery-totals");e.dispatch({dom:{overlay:o,items:f,totals:v,focusableChildren:(d=o,[].slice.call(d.querySelectorAll(n.join(",")))),lastFocused:document.activeElement}},[s(e),u(e),function(){return document.addEventListener("keydown",a)},m(e),g])}},s=function(e){return function(t){var n=e.getState(),l=n.imageCache,i=n.items,r=n.current;Object.keys(l).length===i.length?l.map(function(e,n){c(t,n)}):function(e){return function(t){var n=e.getState(),l=n.imageCache,i=n.items,r=n.dom,o=[t];i.length>1&&o.push(0===t?i.length-1:t-1),i.length>2&&o.push(t===i.length-1?0:t+1),o.forEach(function(t){void 0===l[t]&&(r.items[t].classList.add("loading"),a(e)(i[t],t))})}}(e)(r)}},c=function(e,t){var n=e.dom,l=e.settings,i=e.items;if(n){var r=n.items[t].querySelector(".js-modal-gallery__img-container");r.querySelector(".modal-gallery__img")||(r.innerHTML='<img class="'+(l.scrollable?"modal-gallery__img modal-gallery__img--scrollable":"modal-gallery__img")+'" src="'+i[t].src+'" alt="'+i[t].title+'"'+(n.items[t].srcset?' srcset="'+n.items[t].srcset+'"':"")+(n.items[t].sizes?' sizes="'+n.items[t].sizes+'"':"")+">",n.items[t].classList.remove("loading"))}},u=function(e){return function(n){var l=e.getState().dom,i=function(e){return t.map(function(t){return t+"."+e}).join(", ")},r=l.overlay.querySelector(i("js-modal-gallery__close"));r?r.addEventListener("click",function(t){b(e)}):console.warn("No close buttons or links found.");var a=l.overlay.querySelector(i("js-modal-gallery__previous")),o=l.overlay.querySelector(i("js-modal-gallery__next"));a||o?(a&&a.addEventListener("click",function(t){y(e)}),o&&o.addEventListener("click",function(t){p(e)})):console.warn("No next or previous buttons or links found.")}},d=function(e){return function(t){if(e.getState().isOpen)switch(t.keyCode){case 27:b(e);break;case 9:f(e,t);break;case 37:y(e);break;case 39:p(e)}}},f=function(e,t){var n=e.getState().dom,l=n.focusableChildren.indexOf(document.activeElement);t.shiftKey&&0===l&&(t.preventDefault(),n.focusableChildren[n.focusableChildren.length-1].focus()),t.shiftKey||l!==n.focusableChildren.length-1||(t.preventDefault(),n.focusableChildren[0].focus())},m=function(e){return function(t){var n=e.getState(),l=n.dom,i=n.current,r=n.isOpen,a=n.settings;l.overlay.classList.toggle("is--active"),l.overlay.setAttribute("aria-hidden",!r),l.overlay.setAttribute("tabindex",r?"0":"-1"),null!==r&&l.items[i].classList.add("is--active"),l.focusableChildren&&l.focusableChildren.length>0&&window.setTimeout(function(){l.focusableChildren[0].focus()},0),a.fullscreen&&v(t)}},g=function(e){e.settings.totals&&(e.dom.totals.innerHTML=e.current+1+"/"+e.items.length)},v=function(e){var t=e.dom;e.isOpen?(t.overlay.requestFullscreen&&t.overlay.requestFullscreen(),t.overlay.webkitRequestFullscreen&&t.overlay.webkitRequestFullscreen(),t.overlay.mozRequestFullScreen&&t.overlay.mozRequestFullScreen()):(document.exitFullscreen&&document.exitFullscreen(),document.mozCancelFullScreen&&document.mozCancelFullScreen(),document.webkitExitFullscreen&&document.webkitExitFullscreen())},y=function(e){var t=e.getState(),n=t.current,l=t.dom,i=0===n?l.items.length-1:n-1;e.dispatch({current:i},[function(){return l.items[n].classList.remove("is--active")},function(){return l.items[i].classList.add("is--active")},s(e),g])},p=function(e){var t=e.getState(),n=t.current,l=t.dom,i=n===l.items.length-1?0:n+1;e.dispatch({current:i},[function(){return l.items[n].classList.remove("is--active")},function(){return l.items[i].classList.add("is--active")},s(e),g])},b=function(e){var t=e.getState(),n=t.keyListener,l=t.lastFocused,i=t.dom;e.dispatch({current:null,isOpen:!1},[function(){return document.removeEventListener("keydown",n)},function(){l&&l.focus()},function(){return i.overlay.parentNode.removeChild(i.overlay)}])},h=function(e){return function(t){void 0===t&&(t=0),e.dispatch({current:t,isOpen:!0},[o(e)])}},_=function(t,n){return Object.create((l={items:t,settings:e({},i,n)},a={},(o={dispatch:function(t,n){a=t?e({},a,t):a,n&&n.forEach(function(e){return e(a)})},getState:function(){return a}}).dispatch({settings:l.settings,items:l.items,imageCache:[],isOpen:!1,current:null,keyListener:d(o)},[r(o)]),{getState:o.getState,open:h(o)}));var l,a,o},k=function(e){return"string"==typeof e?[].slice.call(document.querySelectorAll(e)):e instanceof Array?e:Object.prototype.isPrototypeOf.call(NodeList.prototype,e)?[].slice.call(e):e instanceof HTMLElement?[e]:[]};return function(e,t){if(e)return t&&t.single?function(e,t){var n=k(e);if(n.length)return n.map(function(e){return _([{trigger:e,src:e.getAttribute("href"),srcset:e.getAttribute("data-srcset")||null,sizes:e.getAttribute("data-sizes")||null,title:e.getAttribute("data-title")||"",description:e.getAttribute("data-description")||""}],t)});console.warn("Modal Gallery cannot be initialised, no images found")}(e,t):function(e,t){var n=k(e);if(n.length){var l=n.map(function(e){return e instanceof HTMLElement?{trigger:e,src:e.getAttribute("href"),srcset:e.getAttribute("data-srcset")||null,sizes:e.getAttribute("data-sizes")||null,title:e.getAttribute("data-title")||"",description:e.getAttribute("data-description")||""}:e});return _(l,t)}console.warn("Modal Gallery cannot be initialised, no images found")}(e,t);console.warn("Modal Gallery cannot be initialised, no images found")}});
!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?module.exports=t():"function"==typeof define&&define.amd?define(t):(e=e||self).ModalGallery=t()}(this,function(){function e(){return(e=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var l in n)Object.prototype.hasOwnProperty.call(n,l)&&(e[l]=n[l])}return e}).apply(this,arguments)}var t=["button","a"],n=["a[href]","area[href]","input:not([disabled])","select:not([disabled])","textarea:not([disabled])","button:not([disabled])","iframe","object","embed","[contenteditable]",'[tabindex]:not([tabindex="-1"])'],l=function(e){return e.replace(/&/g,"&amp;").replace(/</g,"&lt;").replace(/>/g,"&gt;")},i={fullscreen:!1,preload:!1,totals:!0,scrollable:!1,single:!1,templates:{__proto__:null,overlay:function(){var e=document.createElement("div");return e.className="modal-gallery__outer js-modal-gallery__outer",e.setAttribute("role","dialog"),e.setAttribute("tabindex","-1"),e.setAttribute("aria-hidden",!0),e},overlayInner:function(e,t){return'<div class="modal-gallery__inner js-modal-gallery__inner" role="group" aria-roledescription="carousel">\n <div class="modal-gallery__content js-modal-gallery__content" aria-atomic="false" aria-live="polite">\n '+t+"\n </div>\n </div>\n "+e+'\n <button class="js-modal-gallery__close modal-gallery__close" aria-label="Close">\n <svg focusable="false" aria-hidden="true" width="30" height="30" stroke="#fff">\n <g stroke-width="4">\n <line x1="5" y1="5" x2="25" y2="25"/>\n <line x1="5" y1="25" x2="25" y2="5"/>\n </g>\n </svg>\n </button>\n <div class="modal-gallery__total js-gallery-totals"></div>'},buttons:function(){return'<button class="js-modal-gallery__next modal-gallery__next" aria-label="Next">\n <svg focusable="false" aria-hidden="true" width="44" height="60" stroke="#fff">\n <polyline points="14 10 34 30 14 50" stroke-width="4" stroke-linecap="butt" fill="none" stroke-linejoin="round"/>\n </svg>\n </button>\n <button class="js-modal-gallery__previous modal-gallery__previous" aria-label="Previous">\n <svg focusable="false" aria-hidden="true" width="44" height="60" stroke="#fff">\n <polyline points="30 10 10 30 30 50" stroke-width="4" stroke-linecap="butt" fill="none" stroke-linejoin="round"/>\n </svg>\n</button>'},item:function(e){return function(t,n){return'<div class="modal-gallery__item js-modal-gallery__item" role="group" aria-roledescription="slide" aria-label="Image '+(n+1)+" of "+e.length+(e[n].title?", "+e[n].title:"")+'">\n <div class="modal-gallery__img-container js-modal-gallery__img-container"></div>\n '+t+"\n </div>"}},details:function(e){return e.title||e.description?'<div class="modal-gallery__details">\n '+(e.title?'<h1 class="modal-gallery__title">'+l(e.title)+"</h1>":"")+"\n "+(e.description?'<div class="modal-gallery__description">'+l(e.description)+"</div>":"")+"\n </div>":""}}},r=function(e){return function(t){var n=t.items,l=t.settings;n.map(function(t,n){t.trigger&&t.trigger.addEventListener("click",function(t){t.preventDefault(),h(e)(n)})}),l.preload&&n.map(a(e))}},a=function(e){return function(t,n){try{var l=new Image,i=function(){var t=e.getState().imageCache;t[n]=l,e.dispatch({imageCache:t}),c(e.getState(),n)};l.onload=i,l.src=t.src,l.complete&&i()}catch(e){console.warn(e)}}},o=function(e){return function(t){var l=e.getState(),i=l.settings,r=l.items,a=l.keyListener,o=document.body.appendChild(i.templates.overlay()),c=r.length>1?i.templates.buttons():"";o.insertAdjacentHTML("beforeend",i.templates.overlayInner(c,r.map(i.templates.details).map(i.templates.item(r)).join("")));var d,f=[].slice.call(o.querySelectorAll(".js-modal-gallery__item")),v=o.querySelector(".js-gallery-totals");e.dispatch({dom:{overlay:o,items:f,totals:v,focusableChildren:(d=o,[].slice.call(d.querySelectorAll(n.join(",")))),lastFocused:document.activeElement}},[s(e),u(e),function(){return document.addEventListener("keydown",a)},m(e),g])}},s=function(e){return function(t){var n=e.getState(),l=n.imageCache,i=n.items,r=n.current;Object.keys(l).length===i.length?l.map(function(e,n){c(t,n)}):function(e){return function(t){var n=e.getState(),l=n.imageCache,i=n.items,r=n.dom,o=[t];i.length>1&&o.push(0===t?i.length-1:t-1),i.length>2&&o.push(t===i.length-1?0:t+1),o.forEach(function(t){void 0===l[t]&&(r.items[t].classList.add("loading"),a(e)(i[t],t))})}}(e)(r)}},c=function(e,t){var n=e.dom,l=e.settings,i=e.items;if(n){var r=n.items[t].querySelector(".js-modal-gallery__img-container");r.querySelector(".modal-gallery__img")||(r.innerHTML='<img class="'+(l.scrollable?"modal-gallery__img modal-gallery__img--scrollable":"modal-gallery__img")+'" src="'+i[t].src+'" alt="'+i[t].title+'"'+(n.items[t].srcset?' srcset="'+n.items[t].srcset+'"':"")+(n.items[t].sizes?' sizes="'+n.items[t].sizes+'"':"")+">",n.items[t].classList.remove("loading"))}},u=function(e){return function(n){var l=e.getState().dom,i=function(e){return t.map(function(t){return t+"."+e}).join(", ")},r=l.overlay.querySelector(i("js-modal-gallery__close"));r?r.addEventListener("click",function(t){b(e)}):console.warn("No close buttons or links found.");var a=l.overlay.querySelector(i("js-modal-gallery__previous")),o=l.overlay.querySelector(i("js-modal-gallery__next"));a||o?(a&&a.addEventListener("click",function(t){y(e)}),o&&o.addEventListener("click",function(t){p(e)})):console.warn("No next or previous buttons or links found.")}},d=function(e){return function(t){if(e.getState().isOpen)switch(t.keyCode){case 27:b(e);break;case 9:f(e,t);break;case 37:y(e);break;case 39:p(e)}}},f=function(e,t){var n=e.getState().dom,l=n.focusableChildren.indexOf(document.activeElement);t.shiftKey&&0===l&&(t.preventDefault(),n.focusableChildren[n.focusableChildren.length-1].focus()),t.shiftKey||l!==n.focusableChildren.length-1||(t.preventDefault(),n.focusableChildren[0].focus())},m=function(e){return function(t){var n=e.getState(),l=n.dom,i=n.current,r=n.isOpen,a=n.settings;l.overlay.classList.toggle("is--active"),l.overlay.setAttribute("aria-hidden",!r),l.overlay.setAttribute("tabindex",r?"0":"-1"),null!==r&&l.items[i].classList.add("is--active"),l.focusableChildren&&l.focusableChildren.length>0&&window.setTimeout(function(){l.focusableChildren[0].focus()},0),a.fullscreen&&v(t)}},g=function(e){e.settings.totals&&(e.dom.totals.innerHTML=e.current+1+"/"+e.items.length)},v=function(e){var t=e.dom;e.isOpen?(t.overlay.requestFullscreen&&t.overlay.requestFullscreen(),t.overlay.webkitRequestFullscreen&&t.overlay.webkitRequestFullscreen(),t.overlay.mozRequestFullScreen&&t.overlay.mozRequestFullScreen()):(document.exitFullscreen&&document.exitFullscreen(),document.mozCancelFullScreen&&document.mozCancelFullScreen(),document.webkitExitFullscreen&&document.webkitExitFullscreen())},y=function(e){var t=e.getState(),n=t.current,l=t.dom,i=0===n?l.items.length-1:n-1;e.dispatch({current:i},[function(){return l.items[n].classList.remove("is--active")},function(){return l.items[i].classList.add("is--active")},s(e),g])},p=function(e){var t=e.getState(),n=t.current,l=t.dom,i=n===l.items.length-1?0:n+1;e.dispatch({current:i},[function(){return l.items[n].classList.remove("is--active")},function(){return l.items[i].classList.add("is--active")},s(e),g])},b=function(e){var t=e.getState(),n=t.keyListener,l=t.lastFocused,i=t.dom;e.dispatch({current:null,isOpen:!1},[function(){return document.removeEventListener("keydown",n)},function(){l&&l.focus()},function(){return i.overlay.parentNode.removeChild(i.overlay)}])},h=function(e){return function(t){void 0===t&&(t=0),e.dispatch({current:t,isOpen:!0},[o(e)])}},_=function(t,n){return Object.create((l={items:t,settings:e({},i,n)},a={},(o={dispatch:function(t,n){a=t?e({},a,t):a,n&&n.forEach(function(e){return e(a)})},getState:function(){return a}}).dispatch({settings:l.settings,items:l.items,imageCache:[],isOpen:!1,current:null,keyListener:d(o)},[r(o)]),{getState:o.getState,open:h(o)}));var l,a,o},k=function(e){return"string"==typeof e?[].slice.call(document.querySelectorAll(e)):e instanceof Array?e:Object.prototype.isPrototypeOf.call(NodeList.prototype,e)?[].slice.call(e):e instanceof HTMLElement?[e]:[]};return function(e,t){if(e)return t&&t.single?function(e,t){var n=k(e);if(n.length)return n.map(function(e){return _([{trigger:e,src:e.getAttribute("href"),srcset:e.getAttribute("data-srcset")||null,sizes:e.getAttribute("data-sizes")||null,title:e.getAttribute("data-title")||"",description:e.getAttribute("data-description")||""}],t)});console.warn("Modal Gallery cannot be initialised, no images found")}(e,t):function(e,t){var n=k(e);if(n.length){var l=n.map(function(e){return e instanceof HTMLElement?{trigger:e,src:e.getAttribute("href"),srcset:e.getAttribute("data-srcset")||null,sizes:e.getAttribute("data-sizes")||null,title:e.getAttribute("data-title")||"",description:e.getAttribute("data-description")||""}:e});return _(l,t)}console.warn("Modal Gallery cannot be initialised, no images found")}(e,t);console.warn("Modal Gallery cannot be initialised, no images found")}});
//# sourceMappingURL=index.umd.js.map

6

package.json
{
"name": "@stormid/modal-gallery",
"version": "1.0.0-alpha.11",
"version": "1.0.0-alpha.12",
"description": "Accessible modal image gallery",

@@ -26,3 +26,3 @@ "author": "stormid",

"build": "npx microbundle --name ModalGallery",
"test": "node_modules/.bin/jest --coverage",
"test": "jest --coverage",
"dev": "webpack-dev-server --config example/webpack.config.js --mode development",

@@ -32,3 +32,3 @@ "prod": "webpack --config example/webpack.config.js --mode production",

},
"gitHead": "b12c22ebd5e0f6ef2f85b070fe48bc129ff99a84"
"gitHead": "bded3b26feaef4bea564b6037c54030d53aea31a"
}

0

README.md

@@ -0,0 +0,0 @@ # Modal Gallery

dist/index.js.map

Sorry, the diff of this file is not supported yet

dist/index.modern.mjs

Sorry, the diff of this file is not supported yet

dist/index.modern.mjs.map

Sorry, the diff of this file is not supported yet

dist/index.umd.js.map

Sorry, the diff of this file is not supported yet

LICENSE

Sorry, the diff of this file is not supported yet

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

About

Packages

npm

Go

Maven

PyPI

Rubygems

Stay in touch

Get open source security insights delivered straight into your inbox.

  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc