webcimes-modal 1.1.1 → 1.1.2

package/dist/js/webcimes-modal.esm.js

@@ -0,0 +1,2 @@
+var t={d:(o,e)=>{for(var s in e)t.o(e,s)&&!t.o(o,s)&&Object.defineProperty(o,s,{enumerable:!0,get:e[s]})},o:(t,o)=>Object.prototype.hasOwnProperty.call(t,o)},o={};t.d(o,{V:()=>e});class e{webcimesModals;modal;options;eventCancelButton=()=>{"function"==typeof this.options.onCancelButton&&this.options.onCancelButton()};eventConfirmButton=()=>{"function"==typeof this.options.onConfirmButton&&this.options.onConfirmButton()};eventClickOutside=t=>{t.target==this.webcimesModals&&(this.options.allowCloseOutside?this.destroy():(this.modal.classList.add("animGrowShrink"),setTimeout((()=>{this.modal.classList.remove("animGrowShrink")}),this.options.animationDuration)))};eventClickCloseButton=()=>{this.destroy()};eventDragModalOnTop=t=>{if(!t.target.closest(".close")&&document.querySelectorAll(".modal").length>1&&null!==this.modal.nextElementSibling){let t=this.modal.scrollTop;this.webcimesModals.insertAdjacentElement("beforeend",this.modal),this.modal.scrollTop=t}};position;offset;isDragging=!1;moveFromElements=[];eventDragStart=t=>{t.target.closest("button")||(this.isDragging=!0,t.clientX?this.offset={x:this.modal.offsetLeft-t.clientX,y:this.modal.offsetTop-t.clientY}:t.touches&&(this.offset={x:this.modal.offsetLeft-t.touches[0].clientX,y:this.modal.offsetTop-t.touches[0].clientY}))};eventMove=t=>{this.isDragging&&(t.clientX?this.position={x:t.clientX,y:t.clientY}:t.touches&&(this.position={x:t.touches[0].clientX,y:t.touches[0].clientY}),this.modal.style.left=this.position.x+this.offset.x+"px",this.modal.style.top=this.position.y+this.offset.y+"px")};eventDragStop=()=>{this.isDragging=!1};eventPreventSelectText=t=>{this.isDragging&&t.preventDefault()};eventResize=()=>{this.modal.style.removeProperty("left"),this.modal.style.removeProperty("top")};constructor(t){this.options={setId:null,setClass:null,width:"auto",height:"auto",titleHtml:null,bodyHtml:null,buttonCancelHtml:null,buttonConfirmHtml:null,closeOnCancelButton:!0,closeOnConfirmButton:!0,showCloseButton:!0,allowCloseOutside:!0,allowMovement:!0,moveFromHeader:!0,moveFromBody:!1,moveFromFooter:!0,stickyHeader:!0,stickyFooter:!0,style:null,animationOnShow:"animDropDown",animationOnDestroy:"animDropUp",animationDuration:500,beforeShow:()=>{},afterShow:()=>{},beforeDestroy:()=>{},afterDestroy:()=>{},onCancelButton:()=>{},onConfirmButton:()=>{},...t},this.init()}init(){if(document.querySelector(".webcimesModals")?(this.webcimesModals=document.querySelector(".webcimesModals"),this.webcimesModals.classList.remove("animFadeOut")):(document.body.insertAdjacentHTML("beforeend",'<div class="webcimesModals animFadeIn"></div>'),this.webcimesModals=document.querySelector(".webcimesModals"),this.webcimesModals.style.setProperty("animation-duration",this.options.animationDuration+"ms"),setTimeout((()=>{this.webcimesModals.classList.remove("animFadeIn")}),this.options.animationDuration)),this.webcimesModals.insertAdjacentHTML("beforeend",'<div class="modal '+(this.options.setClass?this.options.setClass:"")+" "+this.options.animationOnShow+'" '+(this.options.setId?'id="'+this.options.setId+'"':"")+">\n\t\t\t\t"+(this.options.titleHtml||this.options.showCloseButton?'<div class="modalHeader '+(this.options.stickyHeader?"sticky":"")+" "+(this.options.moveFromHeader?"movable":"")+'">\n\t\t\t\t\t\t'+(this.options.titleHtml?'<div class="title">'+this.options.titleHtml+"</div>":"")+"\n\t\t\t\t\t\t"+(this.options.showCloseButton?'<button class="close"></button>':"")+"\n\t\t\t\t\t</div>":"")+"\n\t\t\t\t"+(this.options.bodyHtml?'<div class="modalBody '+(this.options.moveFromBody?"movable":"")+'">\n\t\t\t\t\t\t'+this.options.bodyHtml+"\n\t\t\t\t\t</div>":"")+"\n\t\t\t\t"+(this.options.buttonCancelHtml||this.options.buttonConfirmHtml?'<div class="modalFooter '+(this.options.stickyFooter?"sticky":"")+" "+(this.options.moveFromFooter?"movable":"")+'">\n\t\t\t\t\t\t'+(this.options.buttonCancelHtml?'<button class="cancel '+(this.options.closeOnCancelButton?"close":"")+'">'+this.options.buttonCancelHtml+"</button>":"")+"\n\t\t\t\t\t\t"+(this.options.buttonConfirmHtml?'<button class="confirm '+(this.options.closeOnConfirmButton?"close":"")+'">'+this.options.buttonConfirmHtml+"</button>":"")+"\n\t\t\t\t\t</div>":"")+"\n\t\t\t</div>"),this.modal=this.webcimesModals.lastElementChild,"function"==typeof this.options.beforeShow&&setTimeout((()=>{this.options.beforeShow()}),0),this.modal.style.setProperty("animation-duration",this.options.animationDuration+"ms"),setTimeout((()=>{this.modal.classList.remove(this.options.animationOnShow),"function"==typeof this.options.afterShow&&this.options.afterShow()}),this.options.animationDuration),this.modal.style.setProperty("max-width","90%"),"auto"!=this.options.width&&this.options.width?this.modal.style.setProperty("width",this.options.width):this.modal.style.setProperty("width","max-content"),this.modal.style.setProperty("max-height","90%"),"auto"!=this.options.height&&this.options.height?this.modal.style.setProperty("height",this.options.height):this.modal.style.setProperty("height","max-content"),this.options.style){let t=this.modal.getAttribute("style");this.modal.setAttribute("style",t+this.options.style)}this.options.buttonCancelHtml&&this.modal.querySelector(".cancel")?.addEventListener("click",this.eventCancelButton),this.options.buttonConfirmHtml&&this.modal.querySelector(".confirm")?.addEventListener("click",this.eventConfirmButton),this.webcimesModals.addEventListener("click",this.eventClickOutside),this.modal.querySelectorAll(".close").forEach((t=>{t.addEventListener("click",this.eventClickCloseButton)})),["mousedown","touchstart"].forEach((t=>{this.modal.addEventListener(t,this.eventDragModalOnTop)})),this.options.allowMovement&&(this.options.moveFromHeader||this.options.moveFromBody||this.options.moveFromFooter)&&(this.options.moveFromHeader&&this.modal.querySelector(".modalHeader")&&this.moveFromElements.push(this.modal.querySelector(".modalHeader")),this.options.moveFromBody&&this.modal.querySelector(".modalBody")&&this.moveFromElements.push(this.modal.querySelector(".modalBody")),this.options.moveFromFooter&&this.modal.querySelector(".modalFooter")&&this.moveFromElements.push(this.modal.querySelector(".modalFooter")),["mousedown","touchstart"].forEach((t=>{this.moveFromElements.forEach((o=>{o.addEventListener(t,this.eventDragStart)}))})),["mousemove","touchmove"].forEach((t=>{document.addEventListener(t,this.eventMove)})),["mouseup","touchend"].forEach((t=>{document.addEventListener(t,this.eventDragStop)})),document.addEventListener("selectstart",this.eventPreventSelectText)),window.addEventListener("resize",this.eventResize)}destroy(){this.modal.getAttribute("data-destroying")||("function"==typeof this.options.beforeDestroy&&this.options.beforeDestroy(),1==document.querySelectorAll(".modal:not([data-destroying])").length&&this.webcimesModals.classList.add("animFadeOut"),this.modal.setAttribute("data-destroying","1"),this.modal.classList.add(this.options.animationOnDestroy),setTimeout((()=>{void 0!==this.modal&&(this.options.buttonCancelHtml&&this.modal.querySelector(".cancel")?.removeEventListener("click",this.eventCancelButton),this.options.buttonConfirmHtml&&this.modal.querySelector(".confirm")?.removeEventListener("click",this.eventConfirmButton),this.webcimesModals.removeEventListener("click",this.eventClickOutside),this.modal.querySelectorAll(".close").forEach((t=>{t.removeEventListener("click",this.eventClickCloseButton)})),["mousedown","touchstart"].forEach((t=>{this.modal.removeEventListener(t,this.eventDragModalOnTop)})),this.options.allowMovement&&(this.options.moveFromHeader||this.options.moveFromBody||this.options.moveFromFooter)&&(["mousedown","touchstart"].forEach((t=>{this.moveFromElements.forEach((o=>{o.removeEventListener(t,this.eventDragStart)}))})),["mousemove","touchmove"].forEach((t=>{document.removeEventListener(t,this.eventMove)})),["mouseup","touchend"].forEach((t=>{document.removeEventListener(t,this.eventDragStop)})),document.removeEventListener("selectstart",this.eventPreventSelectText)),window.removeEventListener("resize",this.eventResize),(document.querySelectorAll(".modal").length>1?this.modal:this.webcimesModals).remove()),"function"==typeof this.options.afterDestroy&&this.options.afterDestroy()}),this.options.animationDuration))}}var s=o.V;export{s as WebcimesModal};
+//# sourceMappingURL=webcimes-modal.esm.js.map

package/dist/js/webcimes-modal.esm.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"js/webcimes-modal.esm.js","mappings":"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","sources":["webpack://webcimes-modal/webpack/bootstrap","webpack://webcimes-modal/webpack/runtime/define property getters","webpack://webcimes-modal/webpack/runtime/hasOwnProperty shorthand","webpack://webcimes-modal/./src/ts/webcimes-modal.ts"],"sourcesContent":["// The require scope\nvar __webpack_require__ = {};\n\n","// define getter functions for harmony exports\n__webpack_require__.d = (exports, definition) => {\n\tfor(var key in definition) {\n\t\tif(__webpack_require__.o(definition, key) && !__webpack_require__.o(exports, key)) {\n\t\t\tObject.defineProperty(exports, key, { enumerable: true, get: definition[key] });\n\t\t}\n\t}\n};","__webpack_require__.o = (obj, prop) => (Object.prototype.hasOwnProperty.call(obj, prop))","/**\r\n * Copyright (c) 2023 WebCimes - RICHARD Florian (https://webcimes.com)\r\n * MIT License - https://choosealicense.com/licenses/mit/\r\n * Date: 2023-03-25\r\n */\r\n\r\n\"use strict\";\r\n\r\n/**\r\n * Options\r\n */\r\ninterface Options {\r\n\t/** set a specific id on the modal. default \"null\" */\r\n\tsetId: string | null;\r\n\t/** set a specific class on the modal, default \"null\" */\r\n\tsetClass: string | null;\r\n\t/** width (specify unit), default \"auto\" */\r\n\twidth: string;\r\n\t/** height (specify unit), default \"auto\" */\r\n\theight: string;\r\n\t/** html for title, default \"null\" */\r\n\ttitleHtml: string | null;\r\n\t/** html for body, default \"null\" */\r\n\tbodyHtml: string | null;\r\n\t/** html for cancel button, default \"null\" */\r\n\tbuttonCancelHtml: string | null;\r\n\t/** html for confirm button, default \"null\" */\r\n\tbuttonConfirmHtml: string | null;\r\n\t/** close modal after trigger cancel button, default \"true\" */\r\n\tcloseOnCancelButton: boolean;\r\n\t/** close modal after trigger confirm button, default \"true\" */\r\n\tcloseOnConfirmButton: boolean;\r\n\t/** show close button, default \"true\" */\r\n\tshowCloseButton: boolean;\r\n\t/** allow the modal to close when clicked outside, default \"true\" */\r\n\tallowCloseOutside: boolean;\r\n\t/** ability to move modal, default \"true\" */\r\n\tallowMovement: boolean;\r\n\t/** if allowMovement is set to \"true\", ability to move modal from header, default \"true\" */\r\n\tmoveFromHeader: boolean;\r\n\t/** if allowMovement is set to \"true\", ability to move modal from body, default \"false\" */\r\n\tmoveFromBody: boolean;\r\n\t/** if allowMovement is set to \"true\", ability to move modal from footer, default \"true\" */\r\n\tmoveFromFooter: boolean;\r\n\t/** keep header sticky (visible) when scrolling, default \"true\" */\r\n\tstickyHeader: boolean;\r\n\t/** keep footer sticky (visible) when scrolling, default \"true\" */\r\n\tstickyFooter: boolean;\r\n\t/** add extra css style to modal, default null */\r\n\tstyle: string | null;\r\n\t/** \"animDropDown\" or \"animFadeIn\" for show animation, default \"animDropDown\" */\r\n\tanimationOnShow: \"animDropDown\" | \"animFadeIn\";\r\n\t/** \"animDropUp\" or \"animFadeOut\" for destroy animation, default \"animDropUp\" */\r\n\tanimationOnDestroy: \"animDropUp\" | \"animFadeOut\";\r\n\t/** animation duration in ms, default \"500\" */\r\n\tanimationDuration: number;\r\n\t/** callback before show modal */\r\n\tbeforeShow: () => void;\r\n\t/** callback after show modal */\r\n\tafterShow: () => void;\r\n\t/** callback before destroy modal */\r\n\tbeforeDestroy: () => void;\r\n\t/** callback after destroy modal */\r\n\tafterDestroy: () => void;\r\n\t/** callback after triggering cancel button */\r\n\tonCancelButton: () => void;\r\n\t/** callback after triggering confirm button */\r\n\tonConfirmButton: () => void;\r\n}\r\n\r\n/**\r\n * Class WebcimesModal\r\n */\r\nexport class WebcimesModal\r\n{\r\n\tpublic webcimesModals: HTMLElement;\r\n\tpublic modal: HTMLElement;\r\n\tprivate options: Options;\r\n\tprivate eventCancelButton: () => void = () => {\r\n\t\t// Callback on cancel button\r\n\t\tif(typeof this.options.onCancelButton === 'function')\r\n\t\t{\r\n\t\t\tthis.options.onCancelButton();\r\n\t\t}\r\n\t};\r\n\tprivate eventConfirmButton: () => void = () => {\r\n\t\t// Callback on confirm button\r\n\t\tif(typeof this.options.onConfirmButton === 'function')\r\n\t\t{\r\n\t\t\tthis.options.onConfirmButton();\r\n\t\t}\r\n\t};\r\n\tprivate eventClickOutside: (e: Event) => void = (e) => {\r\n\t\tif(e.target == this.webcimesModals)\r\n\t\t{\r\n\t\t\tif(this.options.allowCloseOutside)\r\n\t\t\t{\r\n\t\t\t\t// Destroy modal\r\n\t\t\t\tthis.destroy();\r\n\t\t\t}\r\n\t\t\telse\r\n\t\t\t{\r\n\t\t\t\t// Add animation for show modal who can't be close\r\n\t\t\t\tthis.modal.classList.add(\"animGrowShrink\");\r\n\r\n\t\t\t\t// Delete animation after the animation delay\r\n\t\t\t\tsetTimeout(() => {\r\n\t\t\t\t\tthis.modal.classList.remove(\"animGrowShrink\");\r\n\t\t\t\t}, this.options.animationDuration);\r\n\t\t\t}\r\n\t\t}\r\n\t};\r\n\tprivate eventClickCloseButton: () => void = () => {\r\n\t\t// Destroy modal\r\n\t\tthis.destroy();\r\n\t};\r\n\tprivate eventDragModalOnTop: (e: Event) => void = (e) => {\r\n\t\t// Only if target is not close button (for bug in chrome)\r\n\t\tif(!(<HTMLElement>e.target).closest(\".close\"))\r\n\t\t{\r\n\t\t\t// If multiple modal, and modal not already on top (no next sibling), we place the current modal on the top\r\n\t\t\tif(document.querySelectorAll(\".modal\").length > 1 && this.modal.nextElementSibling !== null)\r\n\t\t\t{\r\n\t\t\t\tlet oldScrollTop = this.modal.scrollTop;\r\n\t\t\t\tthis.webcimesModals.insertAdjacentElement(\"beforeend\", this.modal);\r\n\t\t\t\tthis.modal.scrollTop = oldScrollTop;\r\n\t\t\t}\r\n\t\t}\r\n\t};\r\n\tprivate position: {x: number, y: number};\r\n\tprivate offset: {x: number, y: number};\r\n\tprivate isDragging: boolean = false;\r\n\tprivate moveFromElements: HTMLElement[] = [];\r\n\tprivate eventDragStart: (e: Event) => void = (e) => {\r\n\t\t// Start drag only if it's not a button\r\n\t\tif(!(<HTMLElement>e.target).closest(\"button\"))\r\n\t\t{\r\n\t\t\tthis.isDragging = true;\r\n\r\n\t\t\t// Mouse\r\n\t\t\tif((<MouseEvent>e).clientX)\r\n\t\t\t{\r\n\t\t\t\tthis.offset = {\r\n\t\t\t\t\tx: this.modal.offsetLeft - (<MouseEvent>e).clientX,\r\n\t\t\t\t\ty: this.modal.offsetTop - (<MouseEvent>e).clientY\r\n\t\t\t\t};\r\n\t\t\t}\r\n\t\t\t// Touch device (use the first touch only)\r\n\t\t\telse if((<TouchEvent>e).touches)\r\n\t\t\t{\r\n\t\t\t\tthis.offset = {\r\n\t\t\t\t\tx: this.modal.offsetLeft - (<TouchEvent>e).touches[0].clientX,\r\n\t\t\t\t\ty: this.modal.offsetTop - (<TouchEvent>e).touches[0].clientY\r\n\t\t\t\t};\r\n\t\t\t}\r\n\t\t}\r\n\t};\r\n\tprivate eventMove: (e: Event) => void = (e) => {\r\n\t\tif(this.isDragging)\r\n\t\t{\r\n\t\t\t// Mouse\r\n\t\t\tif((<MouseEvent>e).clientX)\r\n\t\t\t{\r\n\t\t\t\tthis.position = {\r\n\t\t\t\t\tx: (<MouseEvent>e).clientX,\r\n\t\t\t\t\ty: (<MouseEvent>e).clientY\r\n\t\t\t\t};\r\n\t\t\t}\r\n\t\t\t// Touch device (use the first touch only)\r\n\t\t\telse if((<TouchEvent>e).touches)\r\n\t\t\t{\r\n\t\t\t\tthis.position = {\r\n\t\t\t\t\tx: (<TouchEvent>e).touches[0].clientX,\r\n\t\t\t\t\ty: (<TouchEvent>e).touches[0].clientY\r\n\t\t\t\t};\r\n\t\t\t}\r\n\t\t\tthis.modal.style.left = (this.position.x + this.offset.x)+'px';\r\n\t\t\tthis.modal.style.top  = (this.position.y + this.offset.y)+'px';\r\n\t\t}\r\n\t};\r\n\tprivate eventDragStop: () => void = () => {\r\n\t\tthis.isDragging = false;\r\n\t};\r\n\tprivate eventPreventSelectText: (e: Event) => void = (e) => {\r\n\t\tif(this.isDragging)\r\n\t\t{\r\n\t\t\te.preventDefault();\r\n\t\t}\r\n\t};\r\n\tprivate eventResize: () => void = () => {\r\n\t\tthis.modal.style.removeProperty(\"left\");\r\n\t\tthis.modal.style.removeProperty(\"top\");\r\n\t\t\r\n\t};\r\n\r\n\t/**\r\n\t * Create modal\r\n\t */\r\n\tconstructor(options: Options)\r\n\t{\r\n\t\t// Defaults\r\n\t\tconst defaults: Options = {\r\n\t\t\tsetId: null,\r\n\t\t\tsetClass: null,\r\n\t\t\twidth: 'auto',\r\n\t\t\theight: 'auto',\r\n\t\t\ttitleHtml: null,\r\n\t\t\tbodyHtml: null,\r\n\t\t\tbuttonCancelHtml: null,\r\n\t\t\tbuttonConfirmHtml: null,\r\n\t\t\tcloseOnCancelButton: true,\r\n\t\t\tcloseOnConfirmButton: true,\r\n\t\t\tshowCloseButton: true,\r\n\t\t\tallowCloseOutside: true,\r\n\t\t\tallowMovement: true,\r\n\t\t\tmoveFromHeader: true,\r\n\t\t\tmoveFromBody: false,\r\n\t\t\tmoveFromFooter: true,\r\n\t\t\tstickyHeader: true,\r\n\t\t\tstickyFooter: true,\r\n\t\t\tstyle: null,\r\n\t\t\tanimationOnShow: 'animDropDown',\r\n\t\t\tanimationOnDestroy: 'animDropUp',\r\n\t\t\tanimationDuration: 500,\r\n\t\t\tbeforeShow: () => {},\r\n\t\t\tafterShow: () => {},\r\n\t\t\tbeforeDestroy: () => {},\r\n\t\t\tafterDestroy: () => {},\r\n\t\t\tonCancelButton: () => {},\r\n\t\t\tonConfirmButton: () => {},\r\n\t\t}\r\n\t\tthis.options = {...defaults, ...options};\r\n\t\t\r\n\t\t// Call init method\r\n\t\tthis.init();\r\n\t}\r\n\r\n\t/**\r\n\t * Init modal\r\n\t */\r\n    init()\r\n\t{\r\n\t\t// Create webcimesModals\r\n\t\tif(!document.querySelector(\".webcimesModals\"))\r\n\t\t{\r\n\t\t\t// Create webcimesModals\r\n\t\t\tdocument.body.insertAdjacentHTML(\"beforeend\", '<div class=\"webcimesModals animFadeIn\"></div>');\r\n\t\t\tthis.webcimesModals = <HTMLElement>document.querySelector(\".webcimesModals\");\r\n\t\t\t\r\n\t\t\t// Set animation duration for webcimesModals\r\n\t\t\tthis.webcimesModals.style.setProperty(\"animation-duration\", this.options.animationDuration+\"ms\");\r\n\t\r\n\t\t\t// Delete enter animation after animation delay\r\n\t\t\tsetTimeout(() => {\r\n\t\t\t\tthis.webcimesModals.classList.remove(\"animFadeIn\");\r\n\t\t\t}, this.options.animationDuration);\r\n\t\t}\r\n\t\telse\r\n\t\t{\r\n\t\t\t// Get webcimesModals\r\n\t\t\tthis.webcimesModals = <HTMLElement>document.querySelector(\".webcimesModals\");\r\n\r\n\t\t\t// Remove animFadeOut in case of create new modal after destroy the last one before (during animation duration)\r\n\t\t\tthis.webcimesModals.classList.remove(\"animFadeOut\");\r\n\t\t}\r\n\t\r\n\t\t// Create modal\r\n\t\tthis.webcimesModals.insertAdjacentHTML(\"beforeend\", \r\n\t\t\t`<div class=\"modal `+(this.options.setClass?this.options.setClass:'')+` `+this.options.animationOnShow+`\" `+(this.options.setId?'id=\"'+this.options.setId+'\"':'')+`>\r\n\t\t\t\t`+(this.options.titleHtml||this.options.showCloseButton?\r\n\t\t\t\t\t`<div class=\"modalHeader `+(this.options.stickyHeader?'sticky':'')+` `+(this.options.moveFromHeader?'movable':'')+`\">\r\n\t\t\t\t\t\t`+(this.options.titleHtml?'<div class=\"title\">'+this.options.titleHtml+'</div>':'')+`\r\n\t\t\t\t\t\t`+(this.options.showCloseButton?'<button class=\"close\"></button>':'')+`\r\n\t\t\t\t\t</div>`\r\n\t\t\t\t:'')+`\r\n\t\t\t\t`+(this.options.bodyHtml?\r\n\t\t\t\t\t`<div class=\"modalBody `+(this.options.moveFromBody?'movable':'')+`\">\r\n\t\t\t\t\t\t`+this.options.bodyHtml+`\r\n\t\t\t\t\t</div>`\r\n\t\t\t\t:'')+`\r\n\t\t\t\t`+(this.options.buttonCancelHtml||this.options.buttonConfirmHtml?\r\n\t\t\t\t\t`<div class=\"modalFooter `+(this.options.stickyFooter?'sticky':'')+` `+(this.options.moveFromFooter?'movable':'')+`\">\r\n\t\t\t\t\t\t`+(this.options.buttonCancelHtml?'<button class=\"cancel '+(this.options.closeOnCancelButton?'close':'')+'\">'+this.options.buttonCancelHtml+'</button>':'')+`\r\n\t\t\t\t\t\t`+(this.options.buttonConfirmHtml?'<button class=\"confirm '+(this.options.closeOnConfirmButton?'close':'')+'\">'+this.options.buttonConfirmHtml+'</button>':'')+`\r\n\t\t\t\t\t</div>`\r\n\t\t\t\t:'')+`\r\n\t\t\t</div>`\r\n\t\t);\r\n\t\tthis.modal = <HTMLElement>this.webcimesModals.lastElementChild;\r\n\t\t\r\n\t\t// Callback before show modal\r\n\t\tif(typeof this.options.beforeShow === 'function')\r\n\t\t{\r\n\t\t\t// Set a timeout of zero, to wait for some dom to load\r\n\t\t\tsetTimeout(() => {\r\n\t\t\t\tthis.options.beforeShow();\r\n\t\t\t}, 0);\r\n\t\t}\r\n\t\t\r\n\t\t// Set animation duration for modal\r\n\t\tthis.modal.style.setProperty(\"animation-duration\", this.options.animationDuration+\"ms\");\r\n\t\t\r\n\t\t// Delete animation of enter after the animation delay\r\n\t\tsetTimeout(() => {\r\n\t\t\tthis.modal.classList.remove(this.options.animationOnShow);\r\n\t\r\n\t\t\t// Callback after show modal\r\n\t\t\tif(typeof this.options.afterShow === 'function')\r\n\t\t\t{\r\n\t\t\t\tthis.options.afterShow();\r\n\t\t\t}\r\n\t\t}, this.options.animationDuration);\r\n\t\r\n\t\t// Width of modal\r\n\t\tthis.modal.style.setProperty(\"max-width\", \"90%\");\r\n\t\tif(this.options.width != \"auto\" && this.options.width)\r\n\t\t{\r\n\t\t\tthis.modal.style.setProperty(\"width\", this.options.width);\r\n\t\t}\r\n\t\telse\r\n\t\t{\r\n\t\t\t// \"max-content\" is for keep size in \"auto\" and for maximum to max-width\r\n\t\t\tthis.modal.style.setProperty(\"width\", \"max-content\");\r\n\t\t}\r\n\t\r\n\t\t// Height of modal\r\n\t\tthis.modal.style.setProperty(\"max-height\", \"90%\");\r\n\t\tif(this.options.height != \"auto\" && this.options.height)\r\n\t\t{\r\n\t\t\tthis.modal.style.setProperty(\"height\", this.options.height);\r\n\t\t}\r\n\t\telse\r\n\t\t{\r\n\t\t\t// \"max-content\" is for keep size in \"auto\" and for maximum to max-height\r\n\t\t\tthis.modal.style.setProperty(\"height\", \"max-content\");\r\n\t\t}\r\n\t\r\n\t\t// Style\r\n\t\tif(this.options.style)\r\n\t\t{\r\n\t\t\tlet oldStyle = this.modal.getAttribute(\"style\");\r\n\t\t\tthis.modal.setAttribute(\"style\", oldStyle+this.options.style);\r\n\t\t}\r\n\t\r\n\t\t// Event on cancel button\r\n\t\tif(this.options.buttonCancelHtml)\r\n\t\t{\r\n\t\t\tthis.modal.querySelector(\".cancel\")?.addEventListener(\"click\", this.eventCancelButton);\r\n\t\t}\r\n\t\r\n\t\t// Event on confirm button\r\n\t\tif(this.options.buttonConfirmHtml)\r\n\t\t{\r\n\t\t\tthis.modal.querySelector(\".confirm\")?.addEventListener(\"click\", this.eventConfirmButton);\r\n\t\t}\r\n\t\t\r\n\t\t// Event click outside (on webcimesModals)\r\n\t\tthis.webcimesModals.addEventListener(\"click\", this.eventClickOutside);\r\n\t\r\n\t\t// Event close modal when click on close button\r\n\t\tthis.modal.querySelectorAll(\".close\").forEach((el) => {\r\n\t\t\tel.addEventListener(\"click\", this.eventClickCloseButton);\r\n\t\t});\r\n\t\r\n\t\t// Place selected modal on top\r\n\t\t['mousedown', 'touchstart'].forEach((typeEvent) => {\r\n\t\t\tthis.modal.addEventListener(typeEvent, this.eventDragModalOnTop);\r\n\t\t});\r\n\t\t\r\n\t\t// Move modal\r\n\t\tif(this.options.allowMovement && (this.options.moveFromHeader || this.options.moveFromBody || this.options.moveFromFooter))\r\n\t\t{\r\n\t\t\tif(this.options.moveFromHeader && this.modal.querySelector(\".modalHeader\"))\r\n\t\t\t{\r\n\t\t\t\tthis.moveFromElements.push(<HTMLElement>this.modal.querySelector(\".modalHeader\"));\r\n\t\t\t}\r\n\t\t\tif(this.options.moveFromBody && this.modal.querySelector(\".modalBody\"))\r\n\t\t\t{\r\n\t\t\t\tthis.moveFromElements.push(<HTMLElement>this.modal.querySelector(\".modalBody\"));\r\n\t\t\t}\r\n\t\t\tif(this.options.moveFromFooter && this.modal.querySelector(\".modalFooter\"))\r\n\t\t\t{\r\n\t\t\t\tthis.moveFromElements.push(<HTMLElement>this.modal.querySelector(\".modalFooter\"));\r\n\t\t\t}\r\n\t\r\n\t\t\t['mousedown', 'touchstart'].forEach((typeEvent) => {\r\n\t\t\t\tthis.moveFromElements.forEach((el) => {\r\n\t\t\t\t\tel.addEventListener(typeEvent, this.eventDragStart);\r\n\t\t\t\t});\r\n\t\t\t});\r\n\r\n\t\t\t['mousemove', 'touchmove'].forEach((typeEvent) => {\r\n\t\t\t\tdocument.addEventListener(typeEvent, this.eventMove);\r\n\t\t\t});\r\n\r\n\t\t\t['mouseup', 'touchend'].forEach((typeEvent) => {\r\n\t\t\t\tdocument.addEventListener(typeEvent, this.eventDragStop);\r\n\t\t\t});\r\n\r\n\t\t\tdocument.addEventListener(\"selectstart\", this.eventPreventSelectText);\r\n\t\t}\r\n\r\n\t\t// When resizing window, reset modal position to center\r\n\t\twindow.addEventListener(\"resize\", this.eventResize);\r\n    }\r\n\r\n\t/**\r\n\t * Destroy modal\r\n\t */\r\n\tdestroy()\r\n\t{\r\n\t\t// If modal is not already destroying\r\n\t\tif(!this.modal.getAttribute(\"data-destroying\"))\r\n\t\t{\r\n\t\t\t// Callback before destroy modal\r\n\t\t\tif(typeof this.options.beforeDestroy === 'function')\r\n\t\t\t{\r\n\t\t\t\tthis.options.beforeDestroy();\r\n\t\t\t}\r\n\r\n\t\t\t// Close webcimesModals (according the number of modal not already destroying)\r\n\t\t\tif(document.querySelectorAll(\".modal:not([data-destroying])\").length == 1)\r\n\t\t\t{\r\n\t\t\t\tthis.webcimesModals.classList.add(\"animFadeOut\");\r\n\t\t\t}\r\n\r\n\t\t\t// Close modal\r\n\t\t\tthis.modal.setAttribute(\"data-destroying\", \"1\");\r\n\t\t\tthis.modal.classList.add(this.options.animationOnDestroy);\r\n\r\n\t\t\t// Destroy all events from modal and remove webcimesModals or modal after animation duration\r\n\t\t\tsetTimeout(() => {\r\n\t\t\t\tif(typeof this.modal !== 'undefined')\r\n\t\t\t\t{\r\n\t\t\t\t\t// Destroy all events from modal\r\n\r\n\t\t\t\t\tif(this.options.buttonCancelHtml)\r\n\t\t\t\t\t{\r\n\t\t\t\t\t\tthis.modal.querySelector(\".cancel\")?.removeEventListener(\"click\", this.eventCancelButton);\r\n\t\t\t\t\t}\r\n\r\n\t\t\t\t\tif(this.options.buttonConfirmHtml)\r\n\t\t\t\t\t{\r\n\t\t\t\t\t\tthis.modal.querySelector(\".confirm\")?.removeEventListener(\"click\", this.eventConfirmButton);\r\n\t\t\t\t\t}\r\n\r\n\t\t\t\t\tthis.webcimesModals.removeEventListener(\"click\", this.eventClickOutside);\r\n\r\n\t\t\t\t\tthis.modal.querySelectorAll(\".close\").forEach((el) => {\r\n\t\t\t\t\t\tel.removeEventListener(\"click\", this.eventClickCloseButton);\r\n\t\t\t\t\t});\r\n\r\n\t\t\t\t\t['mousedown', 'touchstart'].forEach((typeEvent) => {\r\n\t\t\t\t\t\tthis.modal.removeEventListener(typeEvent, this.eventDragModalOnTop);\r\n\t\t\t\t\t});\r\n\r\n\t\t\t\t\tif(this.options.allowMovement && (this.options.moveFromHeader || this.options.moveFromBody || this.options.moveFromFooter))\r\n\t\t\t\t\t{\r\n\t\t\t\t\t\t['mousedown', 'touchstart'].forEach((typeEvent) => {\r\n\t\t\t\t\t\t\tthis.moveFromElements.forEach((el) => {\r\n\t\t\t\t\t\t\t\tel.removeEventListener(typeEvent, this.eventDragStart);\r\n\t\t\t\t\t\t\t});\r\n\t\t\t\t\t\t});\r\n\t\t\t\r\n\t\t\t\t\t\t['mousemove', 'touchmove'].forEach((typeEvent) => {\r\n\t\t\t\t\t\t\tdocument.removeEventListener(typeEvent, this.eventMove);\r\n\t\t\t\t\t\t});\r\n\t\t\t\r\n\t\t\t\t\t\t['mouseup', 'touchend'].forEach((typeEvent) => {\r\n\t\t\t\t\t\t\tdocument.removeEventListener(typeEvent, this.eventDragStop);\r\n\t\t\t\t\t\t});\r\n\t\t\t\t\t\t\r\n\t\t\t\t\t\tdocument.removeEventListener(\"selectstart\", this.eventPreventSelectText);\r\n\t\t\t\t\t}\r\n\r\n\t\t\t\t\twindow.removeEventListener(\"resize\", this.eventResize);\r\n\t\t\t\t\t\r\n\t\t\t\t\t// Remove webcimesModals or modal according the number of modal\r\n\t\t\t\t\t(document.querySelectorAll(\".modal\").length>1?this.modal:this.webcimesModals).remove();\r\n\t\t\t\t}\r\n\r\n\t\t\t\t// Callback after destroy modal\r\n\t\t\t\tif(typeof this.options.afterDestroy === 'function')\r\n\t\t\t\t{\r\n\t\t\t\t\tthis.options.afterDestroy();\r\n\t\t\t\t}\r\n\t\t\t}, this.options.animationDuration);\r\n\t\t}\r\n\t}\r\n}"],"names":["__webpack_require__","exports","definition","key","o","Object","defineProperty","enumerable","get","obj","prop","prototype","hasOwnProperty","call","WebcimesModal","webcimesModals","modal","options","eventCancelButton","this","onCancelButton","eventConfirmButton","onConfirmButton","eventClickOutside","e","target","allowCloseOutside","destroy","classList","add","setTimeout","remove","animationDuration","eventClickCloseButton","eventDragModalOnTop","closest","document","querySelectorAll","length","nextElementSibling","oldScrollTop","scrollTop","insertAdjacentElement","position","offset","isDragging","moveFromElements","eventDragStart","clientX","x","offsetLeft","y","offsetTop","clientY","touches","eventMove","style","left","top","eventDragStop","eventPreventSelectText","preventDefault","eventResize","removeProperty","constructor","setId","setClass","width","height","titleHtml","bodyHtml","buttonCancelHtml","buttonConfirmHtml","closeOnCancelButton","closeOnConfirmButton","showCloseButton","allowMovement","moveFromHeader","moveFromBody","moveFromFooter","stickyHeader","stickyFooter","animationOnShow","animationOnDestroy","beforeShow","afterShow","beforeDestroy","afterDestroy","init","querySelector","body","insertAdjacentHTML","setProperty","lastElementChild","oldStyle","getAttribute","setAttribute","addEventListener","forEach","el","typeEvent","push","window","removeEventListener"],"sourceRoot":""}

package/dist/js/webcimes-modal.udm.d.ts

@@ -0,0 +1,102 @@
+/**
+ * Copyright (c) 2023 WebCimes - RICHARD Florian (https://webcimes.com)
+ * MIT License - https://choosealicense.com/licenses/mit/
+ * Date: 2023-03-25
+ */
+/**
+ * Options
+ */
+interface Options {
+    /** set a specific id on the modal. default "null" */
+    setId: string | null;
+    /** set a specific class on the modal, default "null" */
+    setClass: string | null;
+    /** width (specify unit), default "auto" */
+    width: string;
+    /** height (specify unit), default "auto" */
+    height: string;
+    /** html for title, default "null" */
+    titleHtml: string | null;
+    /** html for body, default "null" */
+    bodyHtml: string | null;
+    /** html for cancel button, default "null" */
+    buttonCancelHtml: string | null;
+    /** html for confirm button, default "null" */
+    buttonConfirmHtml: string | null;
+    /** close modal after trigger cancel button, default "true" */
+    closeOnCancelButton: boolean;
+    /** close modal after trigger confirm button, default "true" */
+    closeOnConfirmButton: boolean;
+    /** show close button, default "true" */
+    showCloseButton: boolean;
+    /** allow the modal to close when clicked outside, default "true" */
+    allowCloseOutside: boolean;
+    /** ability to move modal, default "true" */
+    allowMovement: boolean;
+    /** if allowMovement is set to "true", ability to move modal from header, default "true" */
+    moveFromHeader: boolean;
+    /** if allowMovement is set to "true", ability to move modal from body, default "false" */
+    moveFromBody: boolean;
+    /** if allowMovement is set to "true", ability to move modal from footer, default "true" */
+    moveFromFooter: boolean;
+    /** keep header sticky (visible) when scrolling, default "true" */
+    stickyHeader: boolean;
+    /** keep footer sticky (visible) when scrolling, default "true" */
+    stickyFooter: boolean;
+    /** add extra css style to modal, default null */
+    style: string | null;
+    /** "animDropDown" or "animFadeIn" for show animation, default "animDropDown" */
+    animationOnShow: "animDropDown" | "animFadeIn";
+    /** "animDropUp" or "animFadeOut" for destroy animation, default "animDropUp" */
+    animationOnDestroy: "animDropUp" | "animFadeOut";
+    /** animation duration in ms, default "500" */
+    animationDuration: number;
+    /** callback before show modal */
+    beforeShow: () => void;
+    /** callback after show modal */
+    afterShow: () => void;
+    /** callback before destroy modal */
+    beforeDestroy: () => void;
+    /** callback after destroy modal */
+    afterDestroy: () => void;
+    /** callback after triggering cancel button */
+    onCancelButton: () => void;
+    /** callback after triggering confirm button */
+    onConfirmButton: () => void;
+}
+/**
+ * Class WebcimesModal
+ */
+export declare class WebcimesModal {
+    webcimesModals: HTMLElement;
+    modal: HTMLElement;
+    private options;
+    private eventCancelButton;
+    private eventConfirmButton;
+    private eventClickOutside;
+    private eventClickCloseButton;
+    private eventDragModalOnTop;
+    private position;
+    private offset;
+    private isDragging;
+    private moveFromElements;
+    private eventDragStart;
+    private eventMove;
+    private eventDragStop;
+    private eventPreventSelectText;
+    private eventResize;
+    /**
+     * Create modal
+     */
+    constructor(options: Options);
+    /**
+     * Init modal
+     */
+    init(): void;
+    /**
+     * Destroy modal
+     */
+    destroy(): void;
+}
+export {};
+

package/dist/js/webcimes-modal.udm.js

@@ -0,0 +1,2 @@
+!function(t,o){if("object"==typeof exports&&"object"==typeof module)module.exports=o();else if("function"==typeof define&&define.amd)define([],o);else{var e=o();for(var s in e)("object"==typeof exports?exports:t)[s]=e[s]}}(self,(()=>(()=>{"use strict";var t={d:(o,e)=>{for(var s in e)t.o(e,s)&&!t.o(o,s)&&Object.defineProperty(o,s,{enumerable:!0,get:e[s]})},o:(t,o)=>Object.prototype.hasOwnProperty.call(t,o),r:t=>{"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(t,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(t,"__esModule",{value:!0})}},o={};t.r(o),t.d(o,{WebcimesModal:()=>e});class e{webcimesModals;modal;options;eventCancelButton=()=>{"function"==typeof this.options.onCancelButton&&this.options.onCancelButton()};eventConfirmButton=()=>{"function"==typeof this.options.onConfirmButton&&this.options.onConfirmButton()};eventClickOutside=t=>{t.target==this.webcimesModals&&(this.options.allowCloseOutside?this.destroy():(this.modal.classList.add("animGrowShrink"),setTimeout((()=>{this.modal.classList.remove("animGrowShrink")}),this.options.animationDuration)))};eventClickCloseButton=()=>{this.destroy()};eventDragModalOnTop=t=>{if(!t.target.closest(".close")&&document.querySelectorAll(".modal").length>1&&null!==this.modal.nextElementSibling){let t=this.modal.scrollTop;this.webcimesModals.insertAdjacentElement("beforeend",this.modal),this.modal.scrollTop=t}};position;offset;isDragging=!1;moveFromElements=[];eventDragStart=t=>{t.target.closest("button")||(this.isDragging=!0,t.clientX?this.offset={x:this.modal.offsetLeft-t.clientX,y:this.modal.offsetTop-t.clientY}:t.touches&&(this.offset={x:this.modal.offsetLeft-t.touches[0].clientX,y:this.modal.offsetTop-t.touches[0].clientY}))};eventMove=t=>{this.isDragging&&(t.clientX?this.position={x:t.clientX,y:t.clientY}:t.touches&&(this.position={x:t.touches[0].clientX,y:t.touches[0].clientY}),this.modal.style.left=this.position.x+this.offset.x+"px",this.modal.style.top=this.position.y+this.offset.y+"px")};eventDragStop=()=>{this.isDragging=!1};eventPreventSelectText=t=>{this.isDragging&&t.preventDefault()};eventResize=()=>{this.modal.style.removeProperty("left"),this.modal.style.removeProperty("top")};constructor(t){this.options={setId:null,setClass:null,width:"auto",height:"auto",titleHtml:null,bodyHtml:null,buttonCancelHtml:null,buttonConfirmHtml:null,closeOnCancelButton:!0,closeOnConfirmButton:!0,showCloseButton:!0,allowCloseOutside:!0,allowMovement:!0,moveFromHeader:!0,moveFromBody:!1,moveFromFooter:!0,stickyHeader:!0,stickyFooter:!0,style:null,animationOnShow:"animDropDown",animationOnDestroy:"animDropUp",animationDuration:500,beforeShow:()=>{},afterShow:()=>{},beforeDestroy:()=>{},afterDestroy:()=>{},onCancelButton:()=>{},onConfirmButton:()=>{},...t},this.init()}init(){if(document.querySelector(".webcimesModals")?(this.webcimesModals=document.querySelector(".webcimesModals"),this.webcimesModals.classList.remove("animFadeOut")):(document.body.insertAdjacentHTML("beforeend",'<div class="webcimesModals animFadeIn"></div>'),this.webcimesModals=document.querySelector(".webcimesModals"),this.webcimesModals.style.setProperty("animation-duration",this.options.animationDuration+"ms"),setTimeout((()=>{this.webcimesModals.classList.remove("animFadeIn")}),this.options.animationDuration)),this.webcimesModals.insertAdjacentHTML("beforeend",'<div class="modal '+(this.options.setClass?this.options.setClass:"")+" "+this.options.animationOnShow+'" '+(this.options.setId?'id="'+this.options.setId+'"':"")+">\n\t\t\t\t"+(this.options.titleHtml||this.options.showCloseButton?'<div class="modalHeader '+(this.options.stickyHeader?"sticky":"")+" "+(this.options.moveFromHeader?"movable":"")+'">\n\t\t\t\t\t\t'+(this.options.titleHtml?'<div class="title">'+this.options.titleHtml+"</div>":"")+"\n\t\t\t\t\t\t"+(this.options.showCloseButton?'<button class="close"></button>':"")+"\n\t\t\t\t\t</div>":"")+"\n\t\t\t\t"+(this.options.bodyHtml?'<div class="modalBody '+(this.options.moveFromBody?"movable":"")+'">\n\t\t\t\t\t\t'+this.options.bodyHtml+"\n\t\t\t\t\t</div>":"")+"\n\t\t\t\t"+(this.options.buttonCancelHtml||this.options.buttonConfirmHtml?'<div class="modalFooter '+(this.options.stickyFooter?"sticky":"")+" "+(this.options.moveFromFooter?"movable":"")+'">\n\t\t\t\t\t\t'+(this.options.buttonCancelHtml?'<button class="cancel '+(this.options.closeOnCancelButton?"close":"")+'">'+this.options.buttonCancelHtml+"</button>":"")+"\n\t\t\t\t\t\t"+(this.options.buttonConfirmHtml?'<button class="confirm '+(this.options.closeOnConfirmButton?"close":"")+'">'+this.options.buttonConfirmHtml+"</button>":"")+"\n\t\t\t\t\t</div>":"")+"\n\t\t\t</div>"),this.modal=this.webcimesModals.lastElementChild,"function"==typeof this.options.beforeShow&&setTimeout((()=>{this.options.beforeShow()}),0),this.modal.style.setProperty("animation-duration",this.options.animationDuration+"ms"),setTimeout((()=>{this.modal.classList.remove(this.options.animationOnShow),"function"==typeof this.options.afterShow&&this.options.afterShow()}),this.options.animationDuration),this.modal.style.setProperty("max-width","90%"),"auto"!=this.options.width&&this.options.width?this.modal.style.setProperty("width",this.options.width):this.modal.style.setProperty("width","max-content"),this.modal.style.setProperty("max-height","90%"),"auto"!=this.options.height&&this.options.height?this.modal.style.setProperty("height",this.options.height):this.modal.style.setProperty("height","max-content"),this.options.style){let t=this.modal.getAttribute("style");this.modal.setAttribute("style",t+this.options.style)}this.options.buttonCancelHtml&&this.modal.querySelector(".cancel")?.addEventListener("click",this.eventCancelButton),this.options.buttonConfirmHtml&&this.modal.querySelector(".confirm")?.addEventListener("click",this.eventConfirmButton),this.webcimesModals.addEventListener("click",this.eventClickOutside),this.modal.querySelectorAll(".close").forEach((t=>{t.addEventListener("click",this.eventClickCloseButton)})),["mousedown","touchstart"].forEach((t=>{this.modal.addEventListener(t,this.eventDragModalOnTop)})),this.options.allowMovement&&(this.options.moveFromHeader||this.options.moveFromBody||this.options.moveFromFooter)&&(this.options.moveFromHeader&&this.modal.querySelector(".modalHeader")&&this.moveFromElements.push(this.modal.querySelector(".modalHeader")),this.options.moveFromBody&&this.modal.querySelector(".modalBody")&&this.moveFromElements.push(this.modal.querySelector(".modalBody")),this.options.moveFromFooter&&this.modal.querySelector(".modalFooter")&&this.moveFromElements.push(this.modal.querySelector(".modalFooter")),["mousedown","touchstart"].forEach((t=>{this.moveFromElements.forEach((o=>{o.addEventListener(t,this.eventDragStart)}))})),["mousemove","touchmove"].forEach((t=>{document.addEventListener(t,this.eventMove)})),["mouseup","touchend"].forEach((t=>{document.addEventListener(t,this.eventDragStop)})),document.addEventListener("selectstart",this.eventPreventSelectText)),window.addEventListener("resize",this.eventResize)}destroy(){this.modal.getAttribute("data-destroying")||("function"==typeof this.options.beforeDestroy&&this.options.beforeDestroy(),1==document.querySelectorAll(".modal:not([data-destroying])").length&&this.webcimesModals.classList.add("animFadeOut"),this.modal.setAttribute("data-destroying","1"),this.modal.classList.add(this.options.animationOnDestroy),setTimeout((()=>{void 0!==this.modal&&(this.options.buttonCancelHtml&&this.modal.querySelector(".cancel")?.removeEventListener("click",this.eventCancelButton),this.options.buttonConfirmHtml&&this.modal.querySelector(".confirm")?.removeEventListener("click",this.eventConfirmButton),this.webcimesModals.removeEventListener("click",this.eventClickOutside),this.modal.querySelectorAll(".close").forEach((t=>{t.removeEventListener("click",this.eventClickCloseButton)})),["mousedown","touchstart"].forEach((t=>{this.modal.removeEventListener(t,this.eventDragModalOnTop)})),this.options.allowMovement&&(this.options.moveFromHeader||this.options.moveFromBody||this.options.moveFromFooter)&&(["mousedown","touchstart"].forEach((t=>{this.moveFromElements.forEach((o=>{o.removeEventListener(t,this.eventDragStart)}))})),["mousemove","touchmove"].forEach((t=>{document.removeEventListener(t,this.eventMove)})),["mouseup","touchend"].forEach((t=>{document.removeEventListener(t,this.eventDragStop)})),document.removeEventListener("selectstart",this.eventPreventSelectText)),window.removeEventListener("resize",this.eventResize),(document.querySelectorAll(".modal").length>1?this.modal:this.webcimesModals).remove()),"function"==typeof this.options.afterDestroy&&this.options.afterDestroy()}),this.options.animationDuration))}}return o})()));
+//# sourceMappingURL=webcimes-modal.udm.js.map

package/dist/js/webcimes-modal.udm.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"js/webcimes-modal.udm.js","mappings":"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","sources":["webpack://webcimes-modal/webpack/universalModuleDefinition","webpack://webcimes-modal/webpack/bootstrap","webpack://webcimes-modal/webpack/runtime/define property getters","webpack://webcimes-modal/webpack/runtime/hasOwnProperty shorthand","webpack://webcimes-modal/webpack/runtime/make namespace object","webpack://webcimes-modal/./src/ts/webcimes-modal.ts"],"sourcesContent":["(function webpackUniversalModuleDefinition(root, factory) {\n\tif(typeof exports === 'object' && typeof module === 'object')\n\t\tmodule.exports = factory();\n\telse if(typeof define === 'function' && define.amd)\n\t\tdefine([], factory);\n\telse {\n\t\tvar a = factory();\n\t\tfor(var i in a) (typeof exports === 'object' ? exports : root)[i] = a[i];\n\t}\n})(self, () => {\nreturn ","// The require scope\nvar __webpack_require__ = {};\n\n","// define getter functions for harmony exports\n__webpack_require__.d = (exports, definition) => {\n\tfor(var key in definition) {\n\t\tif(__webpack_require__.o(definition, key) && !__webpack_require__.o(exports, key)) {\n\t\t\tObject.defineProperty(exports, key, { enumerable: true, get: definition[key] });\n\t\t}\n\t}\n};","__webpack_require__.o = (obj, prop) => (Object.prototype.hasOwnProperty.call(obj, prop))","// define __esModule on exports\n__webpack_require__.r = (exports) => {\n\tif(typeof Symbol !== 'undefined' && Symbol.toStringTag) {\n\t\tObject.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });\n\t}\n\tObject.defineProperty(exports, '__esModule', { value: true });\n};","/**\r\n * Copyright (c) 2023 WebCimes - RICHARD Florian (https://webcimes.com)\r\n * MIT License - https://choosealicense.com/licenses/mit/\r\n * Date: 2023-03-25\r\n */\r\n\r\n\"use strict\";\r\n\r\n/**\r\n * Options\r\n */\r\ninterface Options {\r\n\t/** set a specific id on the modal. default \"null\" */\r\n\tsetId: string | null;\r\n\t/** set a specific class on the modal, default \"null\" */\r\n\tsetClass: string | null;\r\n\t/** width (specify unit), default \"auto\" */\r\n\twidth: string;\r\n\t/** height (specify unit), default \"auto\" */\r\n\theight: string;\r\n\t/** html for title, default \"null\" */\r\n\ttitleHtml: string | null;\r\n\t/** html for body, default \"null\" */\r\n\tbodyHtml: string | null;\r\n\t/** html for cancel button, default \"null\" */\r\n\tbuttonCancelHtml: string | null;\r\n\t/** html for confirm button, default \"null\" */\r\n\tbuttonConfirmHtml: string | null;\r\n\t/** close modal after trigger cancel button, default \"true\" */\r\n\tcloseOnCancelButton: boolean;\r\n\t/** close modal after trigger confirm button, default \"true\" */\r\n\tcloseOnConfirmButton: boolean;\r\n\t/** show close button, default \"true\" */\r\n\tshowCloseButton: boolean;\r\n\t/** allow the modal to close when clicked outside, default \"true\" */\r\n\tallowCloseOutside: boolean;\r\n\t/** ability to move modal, default \"true\" */\r\n\tallowMovement: boolean;\r\n\t/** if allowMovement is set to \"true\", ability to move modal from header, default \"true\" */\r\n\tmoveFromHeader: boolean;\r\n\t/** if allowMovement is set to \"true\", ability to move modal from body, default \"false\" */\r\n\tmoveFromBody: boolean;\r\n\t/** if allowMovement is set to \"true\", ability to move modal from footer, default \"true\" */\r\n\tmoveFromFooter: boolean;\r\n\t/** keep header sticky (visible) when scrolling, default \"true\" */\r\n\tstickyHeader: boolean;\r\n\t/** keep footer sticky (visible) when scrolling, default \"true\" */\r\n\tstickyFooter: boolean;\r\n\t/** add extra css style to modal, default null */\r\n\tstyle: string | null;\r\n\t/** \"animDropDown\" or \"animFadeIn\" for show animation, default \"animDropDown\" */\r\n\tanimationOnShow: \"animDropDown\" | \"animFadeIn\";\r\n\t/** \"animDropUp\" or \"animFadeOut\" for destroy animation, default \"animDropUp\" */\r\n\tanimationOnDestroy: \"animDropUp\" | \"animFadeOut\";\r\n\t/** animation duration in ms, default \"500\" */\r\n\tanimationDuration: number;\r\n\t/** callback before show modal */\r\n\tbeforeShow: () => void;\r\n\t/** callback after show modal */\r\n\tafterShow: () => void;\r\n\t/** callback before destroy modal */\r\n\tbeforeDestroy: () => void;\r\n\t/** callback after destroy modal */\r\n\tafterDestroy: () => void;\r\n\t/** callback after triggering cancel button */\r\n\tonCancelButton: () => void;\r\n\t/** callback after triggering confirm button */\r\n\tonConfirmButton: () => void;\r\n}\r\n\r\n/**\r\n * Class WebcimesModal\r\n */\r\nexport class WebcimesModal\r\n{\r\n\tpublic webcimesModals: HTMLElement;\r\n\tpublic modal: HTMLElement;\r\n\tprivate options: Options;\r\n\tprivate eventCancelButton: () => void = () => {\r\n\t\t// Callback on cancel button\r\n\t\tif(typeof this.options.onCancelButton === 'function')\r\n\t\t{\r\n\t\t\tthis.options.onCancelButton();\r\n\t\t}\r\n\t};\r\n\tprivate eventConfirmButton: () => void = () => {\r\n\t\t// Callback on confirm button\r\n\t\tif(typeof this.options.onConfirmButton === 'function')\r\n\t\t{\r\n\t\t\tthis.options.onConfirmButton();\r\n\t\t}\r\n\t};\r\n\tprivate eventClickOutside: (e: Event) => void = (e) => {\r\n\t\tif(e.target == this.webcimesModals)\r\n\t\t{\r\n\t\t\tif(this.options.allowCloseOutside)\r\n\t\t\t{\r\n\t\t\t\t// Destroy modal\r\n\t\t\t\tthis.destroy();\r\n\t\t\t}\r\n\t\t\telse\r\n\t\t\t{\r\n\t\t\t\t// Add animation for show modal who can't be close\r\n\t\t\t\tthis.modal.classList.add(\"animGrowShrink\");\r\n\r\n\t\t\t\t// Delete animation after the animation delay\r\n\t\t\t\tsetTimeout(() => {\r\n\t\t\t\t\tthis.modal.classList.remove(\"animGrowShrink\");\r\n\t\t\t\t}, this.options.animationDuration);\r\n\t\t\t}\r\n\t\t}\r\n\t};\r\n\tprivate eventClickCloseButton: () => void = () => {\r\n\t\t// Destroy modal\r\n\t\tthis.destroy();\r\n\t};\r\n\tprivate eventDragModalOnTop: (e: Event) => void = (e) => {\r\n\t\t// Only if target is not close button (for bug in chrome)\r\n\t\tif(!(<HTMLElement>e.target).closest(\".close\"))\r\n\t\t{\r\n\t\t\t// If multiple modal, and modal not already on top (no next sibling), we place the current modal on the top\r\n\t\t\tif(document.querySelectorAll(\".modal\").length > 1 && this.modal.nextElementSibling !== null)\r\n\t\t\t{\r\n\t\t\t\tlet oldScrollTop = this.modal.scrollTop;\r\n\t\t\t\tthis.webcimesModals.insertAdjacentElement(\"beforeend\", this.modal);\r\n\t\t\t\tthis.modal.scrollTop = oldScrollTop;\r\n\t\t\t}\r\n\t\t}\r\n\t};\r\n\tprivate position: {x: number, y: number};\r\n\tprivate offset: {x: number, y: number};\r\n\tprivate isDragging: boolean = false;\r\n\tprivate moveFromElements: HTMLElement[] = [];\r\n\tprivate eventDragStart: (e: Event) => void = (e) => {\r\n\t\t// Start drag only if it's not a button\r\n\t\tif(!(<HTMLElement>e.target).closest(\"button\"))\r\n\t\t{\r\n\t\t\tthis.isDragging = true;\r\n\r\n\t\t\t// Mouse\r\n\t\t\tif((<MouseEvent>e).clientX)\r\n\t\t\t{\r\n\t\t\t\tthis.offset = {\r\n\t\t\t\t\tx: this.modal.offsetLeft - (<MouseEvent>e).clientX,\r\n\t\t\t\t\ty: this.modal.offsetTop - (<MouseEvent>e).clientY\r\n\t\t\t\t};\r\n\t\t\t}\r\n\t\t\t// Touch device (use the first touch only)\r\n\t\t\telse if((<TouchEvent>e).touches)\r\n\t\t\t{\r\n\t\t\t\tthis.offset = {\r\n\t\t\t\t\tx: this.modal.offsetLeft - (<TouchEvent>e).touches[0].clientX,\r\n\t\t\t\t\ty: this.modal.offsetTop - (<TouchEvent>e).touches[0].clientY\r\n\t\t\t\t};\r\n\t\t\t}\r\n\t\t}\r\n\t};\r\n\tprivate eventMove: (e: Event) => void = (e) => {\r\n\t\tif(this.isDragging)\r\n\t\t{\r\n\t\t\t// Mouse\r\n\t\t\tif((<MouseEvent>e).clientX)\r\n\t\t\t{\r\n\t\t\t\tthis.position = {\r\n\t\t\t\t\tx: (<MouseEvent>e).clientX,\r\n\t\t\t\t\ty: (<MouseEvent>e).clientY\r\n\t\t\t\t};\r\n\t\t\t}\r\n\t\t\t// Touch device (use the first touch only)\r\n\t\t\telse if((<TouchEvent>e).touches)\r\n\t\t\t{\r\n\t\t\t\tthis.position = {\r\n\t\t\t\t\tx: (<TouchEvent>e).touches[0].clientX,\r\n\t\t\t\t\ty: (<TouchEvent>e).touches[0].clientY\r\n\t\t\t\t};\r\n\t\t\t}\r\n\t\t\tthis.modal.style.left = (this.position.x + this.offset.x)+'px';\r\n\t\t\tthis.modal.style.top  = (this.position.y + this.offset.y)+'px';\r\n\t\t}\r\n\t};\r\n\tprivate eventDragStop: () => void = () => {\r\n\t\tthis.isDragging = false;\r\n\t};\r\n\tprivate eventPreventSelectText: (e: Event) => void = (e) => {\r\n\t\tif(this.isDragging)\r\n\t\t{\r\n\t\t\te.preventDefault();\r\n\t\t}\r\n\t};\r\n\tprivate eventResize: () => void = () => {\r\n\t\tthis.modal.style.removeProperty(\"left\");\r\n\t\tthis.modal.style.removeProperty(\"top\");\r\n\t\t\r\n\t};\r\n\r\n\t/**\r\n\t * Create modal\r\n\t */\r\n\tconstructor(options: Options)\r\n\t{\r\n\t\t// Defaults\r\n\t\tconst defaults: Options = {\r\n\t\t\tsetId: null,\r\n\t\t\tsetClass: null,\r\n\t\t\twidth: 'auto',\r\n\t\t\theight: 'auto',\r\n\t\t\ttitleHtml: null,\r\n\t\t\tbodyHtml: null,\r\n\t\t\tbuttonCancelHtml: null,\r\n\t\t\tbuttonConfirmHtml: null,\r\n\t\t\tcloseOnCancelButton: true,\r\n\t\t\tcloseOnConfirmButton: true,\r\n\t\t\tshowCloseButton: true,\r\n\t\t\tallowCloseOutside: true,\r\n\t\t\tallowMovement: true,\r\n\t\t\tmoveFromHeader: true,\r\n\t\t\tmoveFromBody: false,\r\n\t\t\tmoveFromFooter: true,\r\n\t\t\tstickyHeader: true,\r\n\t\t\tstickyFooter: true,\r\n\t\t\tstyle: null,\r\n\t\t\tanimationOnShow: 'animDropDown',\r\n\t\t\tanimationOnDestroy: 'animDropUp',\r\n\t\t\tanimationDuration: 500,\r\n\t\t\tbeforeShow: () => {},\r\n\t\t\tafterShow: () => {},\r\n\t\t\tbeforeDestroy: () => {},\r\n\t\t\tafterDestroy: () => {},\r\n\t\t\tonCancelButton: () => {},\r\n\t\t\tonConfirmButton: () => {},\r\n\t\t}\r\n\t\tthis.options = {...defaults, ...options};\r\n\t\t\r\n\t\t// Call init method\r\n\t\tthis.init();\r\n\t}\r\n\r\n\t/**\r\n\t * Init modal\r\n\t */\r\n    init()\r\n\t{\r\n\t\t// Create webcimesModals\r\n\t\tif(!document.querySelector(\".webcimesModals\"))\r\n\t\t{\r\n\t\t\t// Create webcimesModals\r\n\t\t\tdocument.body.insertAdjacentHTML(\"beforeend\", '<div class=\"webcimesModals animFadeIn\"></div>');\r\n\t\t\tthis.webcimesModals = <HTMLElement>document.querySelector(\".webcimesModals\");\r\n\t\t\t\r\n\t\t\t// Set animation duration for webcimesModals\r\n\t\t\tthis.webcimesModals.style.setProperty(\"animation-duration\", this.options.animationDuration+\"ms\");\r\n\t\r\n\t\t\t// Delete enter animation after animation delay\r\n\t\t\tsetTimeout(() => {\r\n\t\t\t\tthis.webcimesModals.classList.remove(\"animFadeIn\");\r\n\t\t\t}, this.options.animationDuration);\r\n\t\t}\r\n\t\telse\r\n\t\t{\r\n\t\t\t// Get webcimesModals\r\n\t\t\tthis.webcimesModals = <HTMLElement>document.querySelector(\".webcimesModals\");\r\n\r\n\t\t\t// Remove animFadeOut in case of create new modal after destroy the last one before (during animation duration)\r\n\t\t\tthis.webcimesModals.classList.remove(\"animFadeOut\");\r\n\t\t}\r\n\t\r\n\t\t// Create modal\r\n\t\tthis.webcimesModals.insertAdjacentHTML(\"beforeend\", \r\n\t\t\t`<div class=\"modal `+(this.options.setClass?this.options.setClass:'')+` `+this.options.animationOnShow+`\" `+(this.options.setId?'id=\"'+this.options.setId+'\"':'')+`>\r\n\t\t\t\t`+(this.options.titleHtml||this.options.showCloseButton?\r\n\t\t\t\t\t`<div class=\"modalHeader `+(this.options.stickyHeader?'sticky':'')+` `+(this.options.moveFromHeader?'movable':'')+`\">\r\n\t\t\t\t\t\t`+(this.options.titleHtml?'<div class=\"title\">'+this.options.titleHtml+'</div>':'')+`\r\n\t\t\t\t\t\t`+(this.options.showCloseButton?'<button class=\"close\"></button>':'')+`\r\n\t\t\t\t\t</div>`\r\n\t\t\t\t:'')+`\r\n\t\t\t\t`+(this.options.bodyHtml?\r\n\t\t\t\t\t`<div class=\"modalBody `+(this.options.moveFromBody?'movable':'')+`\">\r\n\t\t\t\t\t\t`+this.options.bodyHtml+`\r\n\t\t\t\t\t</div>`\r\n\t\t\t\t:'')+`\r\n\t\t\t\t`+(this.options.buttonCancelHtml||this.options.buttonConfirmHtml?\r\n\t\t\t\t\t`<div class=\"modalFooter `+(this.options.stickyFooter?'sticky':'')+` `+(this.options.moveFromFooter?'movable':'')+`\">\r\n\t\t\t\t\t\t`+(this.options.buttonCancelHtml?'<button class=\"cancel '+(this.options.closeOnCancelButton?'close':'')+'\">'+this.options.buttonCancelHtml+'</button>':'')+`\r\n\t\t\t\t\t\t`+(this.options.buttonConfirmHtml?'<button class=\"confirm '+(this.options.closeOnConfirmButton?'close':'')+'\">'+this.options.buttonConfirmHtml+'</button>':'')+`\r\n\t\t\t\t\t</div>`\r\n\t\t\t\t:'')+`\r\n\t\t\t</div>`\r\n\t\t);\r\n\t\tthis.modal = <HTMLElement>this.webcimesModals.lastElementChild;\r\n\t\t\r\n\t\t// Callback before show modal\r\n\t\tif(typeof this.options.beforeShow === 'function')\r\n\t\t{\r\n\t\t\t// Set a timeout of zero, to wait for some dom to load\r\n\t\t\tsetTimeout(() => {\r\n\t\t\t\tthis.options.beforeShow();\r\n\t\t\t}, 0);\r\n\t\t}\r\n\t\t\r\n\t\t// Set animation duration for modal\r\n\t\tthis.modal.style.setProperty(\"animation-duration\", this.options.animationDuration+\"ms\");\r\n\t\t\r\n\t\t// Delete animation of enter after the animation delay\r\n\t\tsetTimeout(() => {\r\n\t\t\tthis.modal.classList.remove(this.options.animationOnShow);\r\n\t\r\n\t\t\t// Callback after show modal\r\n\t\t\tif(typeof this.options.afterShow === 'function')\r\n\t\t\t{\r\n\t\t\t\tthis.options.afterShow();\r\n\t\t\t}\r\n\t\t}, this.options.animationDuration);\r\n\t\r\n\t\t// Width of modal\r\n\t\tthis.modal.style.setProperty(\"max-width\", \"90%\");\r\n\t\tif(this.options.width != \"auto\" && this.options.width)\r\n\t\t{\r\n\t\t\tthis.modal.style.setProperty(\"width\", this.options.width);\r\n\t\t}\r\n\t\telse\r\n\t\t{\r\n\t\t\t// \"max-content\" is for keep size in \"auto\" and for maximum to max-width\r\n\t\t\tthis.modal.style.setProperty(\"width\", \"max-content\");\r\n\t\t}\r\n\t\r\n\t\t// Height of modal\r\n\t\tthis.modal.style.setProperty(\"max-height\", \"90%\");\r\n\t\tif(this.options.height != \"auto\" && this.options.height)\r\n\t\t{\r\n\t\t\tthis.modal.style.setProperty(\"height\", this.options.height);\r\n\t\t}\r\n\t\telse\r\n\t\t{\r\n\t\t\t// \"max-content\" is for keep size in \"auto\" and for maximum to max-height\r\n\t\t\tthis.modal.style.setProperty(\"height\", \"max-content\");\r\n\t\t}\r\n\t\r\n\t\t// Style\r\n\t\tif(this.options.style)\r\n\t\t{\r\n\t\t\tlet oldStyle = this.modal.getAttribute(\"style\");\r\n\t\t\tthis.modal.setAttribute(\"style\", oldStyle+this.options.style);\r\n\t\t}\r\n\t\r\n\t\t// Event on cancel button\r\n\t\tif(this.options.buttonCancelHtml)\r\n\t\t{\r\n\t\t\tthis.modal.querySelector(\".cancel\")?.addEventListener(\"click\", this.eventCancelButton);\r\n\t\t}\r\n\t\r\n\t\t// Event on confirm button\r\n\t\tif(this.options.buttonConfirmHtml)\r\n\t\t{\r\n\t\t\tthis.modal.querySelector(\".confirm\")?.addEventListener(\"click\", this.eventConfirmButton);\r\n\t\t}\r\n\t\t\r\n\t\t// Event click outside (on webcimesModals)\r\n\t\tthis.webcimesModals.addEventListener(\"click\", this.eventClickOutside);\r\n\t\r\n\t\t// Event close modal when click on close button\r\n\t\tthis.modal.querySelectorAll(\".close\").forEach((el) => {\r\n\t\t\tel.addEventListener(\"click\", this.eventClickCloseButton);\r\n\t\t});\r\n\t\r\n\t\t// Place selected modal on top\r\n\t\t['mousedown', 'touchstart'].forEach((typeEvent) => {\r\n\t\t\tthis.modal.addEventListener(typeEvent, this.eventDragModalOnTop);\r\n\t\t});\r\n\t\t\r\n\t\t// Move modal\r\n\t\tif(this.options.allowMovement && (this.options.moveFromHeader || this.options.moveFromBody || this.options.moveFromFooter))\r\n\t\t{\r\n\t\t\tif(this.options.moveFromHeader && this.modal.querySelector(\".modalHeader\"))\r\n\t\t\t{\r\n\t\t\t\tthis.moveFromElements.push(<HTMLElement>this.modal.querySelector(\".modalHeader\"));\r\n\t\t\t}\r\n\t\t\tif(this.options.moveFromBody && this.modal.querySelector(\".modalBody\"))\r\n\t\t\t{\r\n\t\t\t\tthis.moveFromElements.push(<HTMLElement>this.modal.querySelector(\".modalBody\"));\r\n\t\t\t}\r\n\t\t\tif(this.options.moveFromFooter && this.modal.querySelector(\".modalFooter\"))\r\n\t\t\t{\r\n\t\t\t\tthis.moveFromElements.push(<HTMLElement>this.modal.querySelector(\".modalFooter\"));\r\n\t\t\t}\r\n\t\r\n\t\t\t['mousedown', 'touchstart'].forEach((typeEvent) => {\r\n\t\t\t\tthis.moveFromElements.forEach((el) => {\r\n\t\t\t\t\tel.addEventListener(typeEvent, this.eventDragStart);\r\n\t\t\t\t});\r\n\t\t\t});\r\n\r\n\t\t\t['mousemove', 'touchmove'].forEach((typeEvent) => {\r\n\t\t\t\tdocument.addEventListener(typeEvent, this.eventMove);\r\n\t\t\t});\r\n\r\n\t\t\t['mouseup', 'touchend'].forEach((typeEvent) => {\r\n\t\t\t\tdocument.addEventListener(typeEvent, this.eventDragStop);\r\n\t\t\t});\r\n\r\n\t\t\tdocument.addEventListener(\"selectstart\", this.eventPreventSelectText);\r\n\t\t}\r\n\r\n\t\t// When resizing window, reset modal position to center\r\n\t\twindow.addEventListener(\"resize\", this.eventResize);\r\n    }\r\n\r\n\t/**\r\n\t * Destroy modal\r\n\t */\r\n\tdestroy()\r\n\t{\r\n\t\t// If modal is not already destroying\r\n\t\tif(!this.modal.getAttribute(\"data-destroying\"))\r\n\t\t{\r\n\t\t\t// Callback before destroy modal\r\n\t\t\tif(typeof this.options.beforeDestroy === 'function')\r\n\t\t\t{\r\n\t\t\t\tthis.options.beforeDestroy();\r\n\t\t\t}\r\n\r\n\t\t\t// Close webcimesModals (according the number of modal not already destroying)\r\n\t\t\tif(document.querySelectorAll(\".modal:not([data-destroying])\").length == 1)\r\n\t\t\t{\r\n\t\t\t\tthis.webcimesModals.classList.add(\"animFadeOut\");\r\n\t\t\t}\r\n\r\n\t\t\t// Close modal\r\n\t\t\tthis.modal.setAttribute(\"data-destroying\", \"1\");\r\n\t\t\tthis.modal.classList.add(this.options.animationOnDestroy);\r\n\r\n\t\t\t// Destroy all events from modal and remove webcimesModals or modal after animation duration\r\n\t\t\tsetTimeout(() => {\r\n\t\t\t\tif(typeof this.modal !== 'undefined')\r\n\t\t\t\t{\r\n\t\t\t\t\t// Destroy all events from modal\r\n\r\n\t\t\t\t\tif(this.options.buttonCancelHtml)\r\n\t\t\t\t\t{\r\n\t\t\t\t\t\tthis.modal.querySelector(\".cancel\")?.removeEventListener(\"click\", this.eventCancelButton);\r\n\t\t\t\t\t}\r\n\r\n\t\t\t\t\tif(this.options.buttonConfirmHtml)\r\n\t\t\t\t\t{\r\n\t\t\t\t\t\tthis.modal.querySelector(\".confirm\")?.removeEventListener(\"click\", this.eventConfirmButton);\r\n\t\t\t\t\t}\r\n\r\n\t\t\t\t\tthis.webcimesModals.removeEventListener(\"click\", this.eventClickOutside);\r\n\r\n\t\t\t\t\tthis.modal.querySelectorAll(\".close\").forEach((el) => {\r\n\t\t\t\t\t\tel.removeEventListener(\"click\", this.eventClickCloseButton);\r\n\t\t\t\t\t});\r\n\r\n\t\t\t\t\t['mousedown', 'touchstart'].forEach((typeEvent) => {\r\n\t\t\t\t\t\tthis.modal.removeEventListener(typeEvent, this.eventDragModalOnTop);\r\n\t\t\t\t\t});\r\n\r\n\t\t\t\t\tif(this.options.allowMovement && (this.options.moveFromHeader || this.options.moveFromBody || this.options.moveFromFooter))\r\n\t\t\t\t\t{\r\n\t\t\t\t\t\t['mousedown', 'touchstart'].forEach((typeEvent) => {\r\n\t\t\t\t\t\t\tthis.moveFromElements.forEach((el) => {\r\n\t\t\t\t\t\t\t\tel.removeEventListener(typeEvent, this.eventDragStart);\r\n\t\t\t\t\t\t\t});\r\n\t\t\t\t\t\t});\r\n\t\t\t\r\n\t\t\t\t\t\t['mousemove', 'touchmove'].forEach((typeEvent) => {\r\n\t\t\t\t\t\t\tdocument.removeEventListener(typeEvent, this.eventMove);\r\n\t\t\t\t\t\t});\r\n\t\t\t\r\n\t\t\t\t\t\t['mouseup', 'touchend'].forEach((typeEvent) => {\r\n\t\t\t\t\t\t\tdocument.removeEventListener(typeEvent, this.eventDragStop);\r\n\t\t\t\t\t\t});\r\n\t\t\t\t\t\t\r\n\t\t\t\t\t\tdocument.removeEventListener(\"selectstart\", this.eventPreventSelectText);\r\n\t\t\t\t\t}\r\n\r\n\t\t\t\t\twindow.removeEventListener(\"resize\", this.eventResize);\r\n\t\t\t\t\t\r\n\t\t\t\t\t// Remove webcimesModals or modal according the number of modal\r\n\t\t\t\t\t(document.querySelectorAll(\".modal\").length>1?this.modal:this.webcimesModals).remove();\r\n\t\t\t\t}\r\n\r\n\t\t\t\t// Callback after destroy modal\r\n\t\t\t\tif(typeof this.options.afterDestroy === 'function')\r\n\t\t\t\t{\r\n\t\t\t\t\tthis.options.afterDestroy();\r\n\t\t\t\t}\r\n\t\t\t}, this.options.animationDuration);\r\n\t\t}\r\n\t}\r\n}"],"names":["root","factory","exports","module","define","amd","a","i","self","__webpack_require__","definition","key","o","Object","defineProperty","enumerable","get","obj","prop","prototype","hasOwnProperty","call","Symbol","toStringTag","value","WebcimesModal","webcimesModals","modal","options","eventCancelButton","this","onCancelButton","eventConfirmButton","onConfirmButton","eventClickOutside","e","target","allowCloseOutside","destroy","classList","add","setTimeout","remove","animationDuration","eventClickCloseButton","eventDragModalOnTop","closest","document","querySelectorAll","length","nextElementSibling","oldScrollTop","scrollTop","insertAdjacentElement","position","offset","isDragging","moveFromElements","eventDragStart","clientX","x","offsetLeft","y","offsetTop","clientY","touches","eventMove","style","left","top","eventDragStop","eventPreventSelectText","preventDefault","eventResize","removeProperty","constructor","setId","setClass","width","height","titleHtml","bodyHtml","buttonCancelHtml","buttonConfirmHtml","closeOnCancelButton","closeOnConfirmButton","showCloseButton","allowMovement","moveFromHeader","moveFromBody","moveFromFooter","stickyHeader","stickyFooter","animationOnShow","animationOnDestroy","beforeShow","afterShow","beforeDestroy","afterDestroy","init","querySelector","body","insertAdjacentHTML","setProperty","lastElementChild","oldStyle","getAttribute","setAttribute","addEventListener","forEach","el","typeEvent","push","window","removeEventListener"],"sourceRoot":""}

package/package.json

@@ -1,11 +1,13 @@
 {
   "name": "webcimes-modal",
-  "version": "1.1.1",
+  "version": "1.1.2",
   "description": "Simply create and animate modals. It works with vanilla javascript + html + css.",
-  "main": "./dist/js/udm/webcimes-modal.udm.min.js",
+  "main": "./dist/js/webcimes-modal.udm.js",
+  "module": "./dist/js/webcimes-modal.esm.js",
+  "types": "./src/ts/webcimes-modal.d.ts",
   "scripts": {
-    "build": "webpack --config webpack.config.ts --node-env=production",
-    "build:dev": "webpack --config webpack.config.ts --node-env=development"
+    "build": "webpack --config webpack.config.ts",
+    "watch": "webpack --config webpack.config.ts --watch"
   },
   "repository": {
     "type": "git",
@@ -34,6 +36,7 @@
     "ts-loader": "^9.4.4",
     "ts-node": "^10.9.1",
     "typescript": "^5.2.2",
+    "typescript-declaration-webpack-plugin": "^0.3.0",
     "webpack": "^5.88.2",
     "webpack-cli": "^5.1.4"
   }

package/src/ts/webcimes-modal.d.ts

@@ -0,0 +1,101 @@
+/**
+ * Copyright (c) 2023 WebCimes - RICHARD Florian (https://webcimes.com)
+ * MIT License - https://choosealicense.com/licenses/mit/
+ * Date: 2023-03-25
+ */
+/**
+ * Options
+ */
+interface Options {
+    /** set a specific id on the modal. default "null" */
+    setId: string | null;
+    /** set a specific class on the modal, default "null" */
+    setClass: string | null;
+    /** width (specify unit), default "auto" */
+    width: string;
+    /** height (specify unit), default "auto" */
+    height: string;
+    /** html for title, default "null" */
+    titleHtml: string | null;
+    /** html for body, default "null" */
+    bodyHtml: string | null;
+    /** html for cancel button, default "null" */
+    buttonCancelHtml: string | null;
+    /** html for confirm button, default "null" */
+    buttonConfirmHtml: string | null;
+    /** close modal after trigger cancel button, default "true" */
+    closeOnCancelButton: boolean;
+    /** close modal after trigger confirm button, default "true" */
+    closeOnConfirmButton: boolean;
+    /** show close button, default "true" */
+    showCloseButton: boolean;
+    /** allow the modal to close when clicked outside, default "true" */
+    allowCloseOutside: boolean;
+    /** ability to move modal, default "true" */
+    allowMovement: boolean;
+    /** if allowMovement is set to "true", ability to move modal from header, default "true" */
+    moveFromHeader: boolean;
+    /** if allowMovement is set to "true", ability to move modal from body, default "false" */
+    moveFromBody: boolean;
+    /** if allowMovement is set to "true", ability to move modal from footer, default "true" */
+    moveFromFooter: boolean;
+    /** keep header sticky (visible) when scrolling, default "true" */
+    stickyHeader: boolean;
+    /** keep footer sticky (visible) when scrolling, default "true" */
+    stickyFooter: boolean;
+    /** add extra css style to modal, default null */
+    style: string | null;
+    /** "animDropDown" or "animFadeIn" for show animation, default "animDropDown" */
+    animationOnShow: "animDropDown" | "animFadeIn";
+    /** "animDropUp" or "animFadeOut" for destroy animation, default "animDropUp" */
+    animationOnDestroy: "animDropUp" | "animFadeOut";
+    /** animation duration in ms, default "500" */
+    animationDuration: number;
+    /** callback before show modal */
+    beforeShow: () => void;
+    /** callback after show modal */
+    afterShow: () => void;
+    /** callback before destroy modal */
+    beforeDestroy: () => void;
+    /** callback after destroy modal */
+    afterDestroy: () => void;
+    /** callback after triggering cancel button */
+    onCancelButton: () => void;
+    /** callback after triggering confirm button */
+    onConfirmButton: () => void;
+}
+/**
+ * Class WebcimesModal
+ */
+export declare class WebcimesModal {
+    webcimesModals: HTMLElement;
+    modal: HTMLElement;
+    private options;
+    private eventCancelButton;
+    private eventConfirmButton;
+    private eventClickOutside;
+    private eventClickCloseButton;
+    private eventDragModalOnTop;
+    private position;
+    private offset;
+    private isDragging;
+    private moveFromElements;
+    private eventDragStart;
+    private eventMove;
+    private eventDragStop;
+    private eventPreventSelectText;
+    private eventResize;
+    /**
+     * Create modal
+     */
+    constructor(options: Options);
+    /**
+     * Init modal
+     */
+    init(): void;
+    /**
+     * Destroy modal
+     */
+    destroy(): void;
+}
+export {};

package/src/ts/webcimes-modal.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"webcimes-modal.d.ts","sourceRoot":"","sources":["webcimes-modal.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AAIH;;GAEG;AACH,UAAU,OAAO;IAChB,qDAAqD;IACrD,KAAK,EAAE,MAAM,GAAG,IAAI,CAAC;IACrB,wDAAwD;IACxD,QAAQ,EAAE,MAAM,GAAG,IAAI,CAAC;IACxB,2CAA2C;IAC3C,KAAK,EAAE,MAAM,CAAC;IACd,4CAA4C;IAC5C,MAAM,EAAE,MAAM,CAAC;IACf,qCAAqC;IACrC,SAAS,EAAE,MAAM,GAAG,IAAI,CAAC;IACzB,oCAAoC;IACpC,QAAQ,EAAE,MAAM,GAAG,IAAI,CAAC;IACxB,6CAA6C;IAC7C,gBAAgB,EAAE,MAAM,GAAG,IAAI,CAAC;IAChC,8CAA8C;IAC9C,iBAAiB,EAAE,MAAM,GAAG,IAAI,CAAC;IACjC,8DAA8D;IAC9D,mBAAmB,EAAE,OAAO,CAAC;IAC7B,+DAA+D;IAC/D,oBAAoB,EAAE,OAAO,CAAC;IAC9B,wCAAwC;IACxC,eAAe,EAAE,OAAO,CAAC;IACzB,oEAAoE;IACpE,iBAAiB,EAAE,OAAO,CAAC;IAC3B,4CAA4C;IAC5C,aAAa,EAAE,OAAO,CAAC;IACvB,2FAA2F;IAC3F,cAAc,EAAE,OAAO,CAAC;IACxB,0FAA0F;IAC1F,YAAY,EAAE,OAAO,CAAC;IACtB,2FAA2F;IAC3F,cAAc,EAAE,OAAO,CAAC;IACxB,kEAAkE;IAClE,YAAY,EAAE,OAAO,CAAC;IACtB,kEAAkE;IAClE,YAAY,EAAE,OAAO,CAAC;IACtB,iDAAiD;IACjD,KAAK,EAAE,MAAM,GAAG,IAAI,CAAC;IACrB,gFAAgF;IAChF,eAAe,EAAE,cAAc,GAAG,YAAY,CAAC;IAC/C,gFAAgF;IAChF,kBAAkB,EAAE,YAAY,GAAG,aAAa,CAAC;IACjD,8CAA8C;IAC9C,iBAAiB,EAAE,MAAM,CAAC;IAC1B,iCAAiC;IACjC,UAAU,EAAE,MAAM,IAAI,CAAC;IACvB,gCAAgC;IAChC,SAAS,EAAE,MAAM,IAAI,CAAC;IACtB,oCAAoC;IACpC,aAAa,EAAE,MAAM,IAAI,CAAC;IAC1B,mCAAmC;IACnC,YAAY,EAAE,MAAM,IAAI,CAAC;IACzB,8CAA8C;IAC9C,cAAc,EAAE,MAAM,IAAI,CAAC;IAC3B,+CAA+C;IAC/C,eAAe,EAAE,MAAM,IAAI,CAAC;CAC5B;AAED;;GAEG;AACH,qBAAa,aAAa;IAElB,cAAc,EAAE,WAAW,CAAC;IAC5B,KAAK,EAAE,WAAW,CAAC;IAC1B,OAAO,CAAC,OAAO,CAAU;IACzB,OAAO,CAAC,iBAAiB,CAMvB;IACF,OAAO,CAAC,kBAAkB,CAMxB;IACF,OAAO,CAAC,iBAAiB,CAmBvB;IACF,OAAO,CAAC,qBAAqB,CAG3B;IACF,OAAO,CAAC,mBAAmB,CAYzB;IACF,OAAO,CAAC,QAAQ,CAAyB;IACzC,OAAO,CAAC,MAAM,CAAyB;IACvC,OAAO,CAAC,UAAU,CAAkB;IACpC,OAAO,CAAC,gBAAgB,CAAqB;IAC7C,OAAO,CAAC,cAAc,CAuBpB;IACF,OAAO,CAAC,SAAS,CAsBf;IACF,OAAO,CAAC,aAAa,CAEnB;IACF,OAAO,CAAC,sBAAsB,CAK5B;IACF,OAAO,CAAC,WAAW,CAIjB;IAEF;;OAEG;gBACS,OAAO,EAAE,OAAO;IAuC5B;;OAEG;IACA,IAAI;IAsKP;;OAEG;IACH,OAAO;CAgFP"}

package/src/ts/webcimes-modal.ts

@@ -195,35 +195,6 @@ export class WebcimesModal
 
 	/**
 	 * Create modal
-	 * @param {Object} options
-	 * @param {string | null} options.setId - set a specific id on the modal. default "null" 
-	 * @param {string | null} options.setClass - set a specific class on the modal, default "null"
-	 * @param {string} options.width - width (specify unit), default "auto"
-	 * @param {string} options.height - height (specify unit), default "auto"
-	 * @param {string | null} options.titleHtml - html for title, default "null"
-	 * @param {string | null} options.bodyHtml - html for body, default "null"
-	 * @param {string | null} options.buttonCancelHtml - html for cancel button, default "null"
-	 * @param {string | null} options.buttonConfirmHtml - html for confirm button, default "null"
-	 * @param {boolean} options.closeOnCancelButton - close modal after trigger cancel button, default "true"
-	 * @param {boolean} options.closeOnConfirmButton - close modal after trigger confirm button, default "true"
-	 * @param {boolean} options.showCloseButton - show close button, default "true"
-	 * @param {boolean} options.allowCloseOutside - allow the modal to close when clicked outside, default "true"
-	 * @param {boolean} options.allowMovement - ability to move modal, default "true"
-	 * @param {boolean} options.moveFromHeader - if allowMovement is set to "true", ability to move modal from header, default "true"
-	 * @param {boolean} options.moveFromBody - if allowMovement is set to "true", ability to move modal from body, default "false"
-	 * @param {boolean} options.moveFromFooter - if allowMovement is set to "true", ability to move modal from footer, default "true"
-	 * @param {boolean} options.stickyHeader - keep header sticky (visible) when scrolling, default "true"
-	 * @param {boolean} options.stickyFooter - keep footer sticky (visible) when scrolling, default "true"
-	 * @param {string | null} options.style - add extra css style to modal, default null
-	 * @param {"animDropDown" | "animFadeIn"} options.animationOnShow - "animDropDown" or "animFadeIn" for show animation, default "animDropDown"
-	 * @param {"animDropUp" | "animFadeOut"} options.animationOnDestroy - "animDropUp" or "animFadeOut" for destroy animation, default "animDropUp"
-	 * @param {number} options.animationDuration - animation duration in ms, default "500"
-	 * @param {() => void} options.beforeShow - callback before show modal
-	 * @param {() => void} options.afterShow - callback after show modal
-	 * @param {() => void} options.beforeDestroy - callback before destroy modal
-	 * @param {() => void} options.afterDestroy - callback after destroy modal
-	 * @param {() => void} options.onCancelButton - callback after triggering cancel button
-	 * @param {() => void} options.onConfirmButton - callback after triggering confirm button
 	 */
 	constructor(options: Options)
 	{
@@ -286,7 +257,11 @@ export class WebcimesModal
 		}
 		else
 		{
+			// Get webcimesModals
 			this.webcimesModals = <HTMLElement>document.querySelector(".webcimesModals");
+
+			// Remove animFadeOut in case of create new modal after destroy the last one before (during animation duration)
+			this.webcimesModals.classList.remove("animFadeOut");
 		}
 	
 		// Create modal

package/test/script.js

@@ -0,0 +1,25 @@
+// Import webcimes-modal
+import {WebcimesModal} from "../dist/js/webcimes-modal.esm.js";
+
+// Wait for dom content loaded
+document.addEventListener("DOMContentLoaded", function()
+{
+    let modal1 = new WebcimesModal({
+        titleHtml: "My title",
+        bodyHtml: "My Body",
+        afterDestroy: () => {
+            console.log("destroy modal 1");
+        },
+    });
+
+    document.querySelector(".modalBody")?.addEventListener("click", (e) => {
+        // modal1.options.moveFromBody = false;
+        new WebcimesModal({
+            titleHtml: "My title 2",
+            bodyHtml: "My Body 2",
+            afterDestroy: () => {
+                console.log("after destroy modal 2");
+            },
+        });
+    });
+});

package/test/test.html

@@ -0,0 +1,55 @@
+<!DOCTYPE html>
+<html>
+    <head>
+        <meta charset="utf-8">
+        <meta name="Author" content="WebCimes">
+        <meta name="Copyright" content="© https://webcimes.com">
+        <meta name="viewport" content="initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
+		<title>Demo webcimes-modal ESM</title>
+        <link rel="stylesheet" href="../dist/css/webcimes-modal.css">
+        <script type="importmap">
+        {
+            "imports": {
+                "webcimes-modal": "../dist/js/webcimes-modal.esm.js"
+            }
+        }
+        </script>
+		<script type="module" src="script.js"></script>
+    </head>
+    <body>
+        <div style="display:none;">
+            <div class="test">
+                Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Dui sapien eget mi proin sed libero enim. Quis lectus nulla at volutpat diam ut venenatis tellus. Odio eu feugiat pretium nibh ipsum consequat nisl vel. Ultricies integer quis auctor elit sed.
+                <br>
+                Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Dui sapien eget mi proin sed libero enim. Quis lectus nulla at volutpat diam ut venenatis tellus. Odio eu feugiat pretium nibh ipsum consequat nisl vel. Ultricies integer quis auctor elit sed.
+                Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Dui sapien eget mi proin sed libero enim. Quis lectus nulla at volutpat diam ut venenatis tellus. Odio eu feugiat pretium nibh ipsum consequat nisl vel. Ultricies integer quis auctor elit sed.
+                <br>
+                Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Dui sapien eget mi proin sed libero enim. Quis lectus nulla at volutpat diam ut venenatis tellus. Odio eu feugiat pretium nibh ipsum consequat nisl vel. Ultricies integer quis auctor elit sed.
+                Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Dui sapien eget mi proin sed libero enim. Quis lectus nulla at volutpat diam ut venenatis tellus. Odio eu feugiat pretium nibh ipsum consequat nisl vel. Ultricies integer quis auctor elit sed.
+                <br>
+                Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Dui sapien eget mi proin sed libero enim. Quis lectus nulla at volutpat diam ut venenatis tellus. Odio eu feugiat pretium nibh ipsum consequat nisl vel. Ultricies integer quis auctor elit sed.
+                Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Dui sapien eget mi proin sed libero enim. Quis lectus nulla at volutpat diam ut venenatis tellus. Odio eu feugiat pretium nibh ipsum consequat nisl vel. Ultricies integer quis auctor elit sed.
+                <br>
+                Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Dui sapien eget mi proin sed libero enim. Quis lectus nulla at volutpat diam ut venenatis tellus. Odio eu feugiat pretium nibh ipsum consequat nisl vel. Ultricies integer quis auctor elit sed.
+                Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Dui sapien eget mi proin sed libero enim. Quis lectus nulla at volutpat diam ut venenatis tellus. Odio eu feugiat pretium nibh ipsum consequat nisl vel. Ultricies integer quis auctor elit sed.
+                <br>
+                Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Dui sapien eget mi proin sed libero enim. Quis lectus nulla at volutpat diam ut venenatis tellus. Odio eu feugiat pretium nibh ipsum consequat nisl vel. Ultricies integer quis auctor elit sed.
+                Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Dui sapien eget mi proin sed libero enim. Quis lectus nulla at volutpat diam ut venenatis tellus. Odio eu feugiat pretium nibh ipsum consequat nisl vel. Ultricies integer quis auctor elit sed.
+                <br>
+                Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Dui sapien eget mi proin sed libero enim. Quis lectus nulla at volutpat diam ut venenatis tellus. Odio eu feugiat pretium nibh ipsum consequat nisl vel. Ultricies integer quis auctor elit sed.
+                Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Dui sapien eget mi proin sed libero enim. Quis lectus nulla at volutpat diam ut venenatis tellus. Odio eu feugiat pretium nibh ipsum consequat nisl vel. Ultricies integer quis auctor elit sed.
+                <br>
+                Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Dui sapien eget mi proin sed libero enim. Quis lectus nulla at volutpat diam ut venenatis tellus. Odio eu feugiat pretium nibh ipsum consequat nisl vel. Ultricies integer quis auctor elit sed.
+                Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Dui sapien eget mi proin sed libero enim. Quis lectus nulla at volutpat diam ut venenatis tellus. Odio eu feugiat pretium nibh ipsum consequat nisl vel. Ultricies integer quis auctor elit sed.
+                <br>
+                Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Dui sapien eget mi proin sed libero enim. Quis lectus nulla at volutpat diam ut venenatis tellus. Odio eu feugiat pretium nibh ipsum consequat nisl vel. Ultricies integer quis auctor elit sed.
+                Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Dui sapien eget mi proin sed libero enim. Quis lectus nulla at volutpat diam ut venenatis tellus. Odio eu feugiat pretium nibh ipsum consequat nisl vel. Ultricies integer quis auctor elit sed.
+                <br>
+                Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Dui sapien eget mi proin sed libero enim. Quis lectus nulla at volutpat diam ut venenatis tellus. Odio eu feugiat pretium nibh ipsum consequat nisl vel. Ultricies integer quis auctor elit sed.
+                Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Dui sapien eget mi proin sed libero enim. Quis lectus nulla at volutpat diam ut venenatis tellus. Odio eu feugiat pretium nibh ipsum consequat nisl vel. Ultricies integer quis auctor elit sed.
+                <br>
+                Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Dui sapien eget mi proin sed libero enim. Quis lectus nulla at volutpat diam ut venenatis tellus. Odio eu feugiat pretium nibh ipsum consequat nisl vel. Ultricies integer quis auctor elit sed.
+            </div>
+		</div>
+    </body>
+</html>

package/tsconfig.json

@@ -3,6 +3,7 @@
         "module": "ESNext",
         "target": "ESNext",
         "removeComments": false,
+        "declaration": true,
         "sourceMap": true,
         "noImplicitAny": true,
         "strictNullChecks": true,