{"version":3,"names":["SewWsLightbox","constructor","hostRef","this","triggerSelector","contentSrc","openDialog","event","button","target","url","getAttribute","dialogElement","open","loaded","setAttribute","getSrcContent","componentWillLoad","triggerElements","document","querySelectorAll","forEach","el","addEventListener","fetch","then","response","text","html","dialogContentElement","append","createRange","createContextualFragment","catch","e","console","error","render","h","Host","key","ws","type","size","ref"],"sources":["src/components/website-components/sew-ws-lightbox/sew-ws-lightbox.tsx"],"sourcesContent":["import { Component, Host, h, Prop } from '@stencil/core';\n\n@Component({\n    tag: 'sew-ws-lightbox',\n    shadow: false,\n})\nexport class SewWsLightbox {\n    @Prop() triggerSelector = '.sew-ws-lightbox-trigger';\n    @Prop() contentSrc = 'data-url';\n\n    private dialogElement: HTMLSewDialogElement;\n    private dialogContentElement: HTMLDivElement;\n\n    componentWillLoad() {\n        const triggerElements = document.querySelectorAll(this.triggerSelector);\n\n        triggerElements.forEach(el => {\n            el.addEventListener('click', this.openDialog);\n        });\n    }\n\n    private openDialog = (event: Event) => {\n        const button = event.target as HTMLDivElement;\n        const url = button.getAttribute(this.contentSrc);\n\n        // early exit if there is no contentSrc\n        if (!url) {\n            this.dialogElement.open = true;\n\n            return;\n        }\n\n        const loaded = button.getAttribute('loaded');\n\n        if (loaded) {\n            this.dialogElement.open = true;\n        } else {\n            button.setAttribute('loaded', 'true');\n            this.getSrcContent(url);\n        }\n    };\n\n    private getSrcContent(url): void {\n        fetch(url)\n            .then(response => response.text())\n            .then(html => {\n                this.dialogContentElement.append(document.createRange().createContextualFragment(html));\n                this.dialogElement.open = true;\n            })\n            .catch(e => {\n                console.error(e);\n            });\n    }\n\n    render() {\n        return (\n            <Host>\n                <sew-dialog\n                    ws\n                    type={'blank'}\n                    close-button={true}\n                    size={'l'}\n                    ref={el => (this.dialogElement = el)}\n                >\n                    <div ref={el => (this.dialogContentElement = el)}></div>\n                    <slot></slot>\n                </sew-dialog>\n            </Host>\n        );\n    }\n}\n"],"mappings":"wDAMaA,EAAa,MAJ1B,WAAAC,CAAAC,G,UAKYC,KAAeC,gBAAG,2BAClBD,KAAUE,WAAG,WAabF,KAAAG,WAAcC,IAClB,MAAMC,EAASD,EAAME,OACrB,MAAMC,EAAMF,EAAOG,aAAaR,KAAKE,YAGrC,IAAKK,EAAK,CACNP,KAAKS,cAAcC,KAAO,KAE1B,M,CAGJ,MAAMC,EAASN,EAAOG,aAAa,UAEnC,GAAIG,EAAQ,CACRX,KAAKS,cAAcC,KAAO,I,KACvB,CACHL,EAAOO,aAAa,SAAU,QAC9BZ,KAAKa,cAAcN,E,EAgC9B,CAzDG,iBAAAO,GACI,MAAMC,EAAkBC,SAASC,iBAAiBjB,KAAKC,iBAEvDc,EAAgBG,SAAQC,IACpBA,EAAGC,iBAAiB,QAASpB,KAAKG,WAAW,G,CAyB7C,aAAAU,CAAcN,GAClBc,MAAMd,GACDe,MAAKC,GAAYA,EAASC,SAC1BF,MAAKG,IACFzB,KAAK0B,qBAAqBC,OAAOX,SAASY,cAAcC,yBAAyBJ,IACjFzB,KAAKS,cAAcC,KAAO,IAAI,IAEjCoB,OAAMC,IACHC,QAAQC,MAAMF,EAAE,G,CAI5B,MAAAG,GACI,OACIC,EAACC,EAAI,CAAAC,IAAA,4CACDF,EACI,cAAAE,IAAA,2CAAAC,GACA,KAAAC,KAAM,QAAO,eACC,KACdC,KAAM,IACNC,IAAKtB,GAAOnB,KAAKS,cAAgBU,GAEjCgB,EAAA,OAAAE,IAAA,2CAAKI,IAAKtB,GAAOnB,KAAK0B,qBAAuBP,IAC7CgB,EAAa,QAAAE,IAAA,8C","ignoreList":[]}