{
  "version": 3,
  "sources": ["../../../../../../../../source/febe/ui/static/svg/icons/close.svg", "../../../../../../../../source/febe/ui/src/scripts/components/Modal.ts"],
  "sourcesContent": ["<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\"><path d=\"M19 6.41 17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12z\"/></svg>", "import close from \"@icons/close.svg\";\nimport { Hatch, SafeString } from \"../classes/Hatch.js\";\n\ninterface ModalOptions {\n  cb?: Function;\n  body: SafeString;\n  onclose?: Function;\n}\n\ninterface FormModalOptions extends ModalOptions {\n  action: string;\n  successMsg?: string;\n  failedMsg?: string;\n  method?: \"POST\" | \"GET\";\n  cb?: Function;\n}\n\nexport class Modal {\n  body: SafeString;\n  el: HTMLElement;\n  cb?: Function;\n  onclose?: Function;\n\n  constructor(options: ModalOptions) {\n    this.body = options.body;\n    this.onclose = options.onclose;\n    this.cb = options.cb;\n    document.body.appendChild(this.getTemplate(options));\n  }\n\n  close() {\n    this.el.classList.add(\"out\");\n    if (this.onclose) this.onclose();\n    setTimeout(() => {\n      this.el.remove();\n    }, 400);\n  }\n\n  getTemplate(options: ModalOptions) {\n    this.el = document.createElement(\"div\");\n    this.el.classList.add(\"modal\");\n    this.el.classList.add(\"out\");\n    this.el.innerHTML = Hatch`\n            <div class=\"tile article\">\n                <button data-close>\n                    <div class=\"ma-icon default\">\n                        ${new SafeString(close)}\n                    </div>\n                </button>\n                ${options.body}\n            </div>\n            <div class=\"modal-backdrop\"></div>\n        `.s;\n\n    this.el.querySelectorAll(\".modal-backdrop, [data-close]\").forEach((item) => {\n      item.addEventListener(\"click\", (e: Event) => {\n        if (item.tagName !== \"A\") {\n          e.preventDefault();\n        }\n        this.close();\n      });\n    });\n\n    this.el.querySelectorAll(\".modal-backdrop, [data-cb]\").forEach((item) => {\n      item.addEventListener(\"click\", (e: Event) => {\n        this.cb?.();\n      });\n    });\n\n    window.addEventListener(\"keydown\", (e: KeyboardEvent) => {\n      if (e.key === \"Escape\") {\n        this.close();\n      }\n    });\n\n    setTimeout(() => {\n      this.el.classList.remove(\"out\");\n    }, 1);\n    return this.el;\n  }\n}\n\nexport class FormModal extends Modal {\n  body: SafeString;\n  action: string;\n  method?: \"POST\" | \"GET\";\n\n  constructor(options: FormModalOptions) {\n    let form = Hatch`\n            <form class=\"article\" method=\"${options.method || \"POST\"}\" action=\"${options.action}\">\n                ${options.body}\n                <input type=\"hidden\" name=\"csrf_token\" value=\"${globalThis.csrf_token}\" />\n            </form>\n        `;\n    options.body = form;\n    super(options);\n\n    this.action = options.action;\n  }\n}\n\nexport class FetchFormModal extends FormModal {\n  successMsg?: string;\n  failedMsg?: string;\n  cb?: Function;\n\n  constructor(options: FormModalOptions) {\n    super(options);\n    this.successMsg = options.successMsg;\n    this.failedMsg = options.failedMsg;\n    this.method = options.method;\n    this.cb = options.cb;\n    this.afterRender();\n  }\n\n  afterRender() {\n    let form = this.el.querySelector<HTMLFormElement>(\"form\");\n    form.addEventListener(\"submit\", async (e: Event) => {\n      e.preventDefault();\n      let req = await fetch(this.action, {\n        body: new FormData(form),\n        method: this.method || \"post\",\n      });\n      if (req.ok) {\n        this.close();\n        if (this.cb) this.cb();\n        globalThis.notification.notify({\n          type: \"info\",\n          message: this.successMsg || \"The action was successful\",\n          title: \"Success\",\n        });\n      } else {\n        globalThis.notification.notify({\n          type: \"danger\",\n          message: this.failedMsg || \"The action failed, feel free to get in touch if the problem persists.\",\n          title: \"Failed\",\n        });\n      }\n    });\n  }\n}\n"],
  "mappings": "+CAAA,IAAAA,EAAA,6MCiBO,IAAMC,EAAN,KAAY,CAMjB,YAAYC,EAAuB,CACjC,KAAK,KAAOA,EAAQ,KACpB,KAAK,QAAUA,EAAQ,QACvB,KAAK,GAAKA,EAAQ,GAClB,SAAS,KAAK,YAAY,KAAK,YAAYA,CAAO,CAAC,CACrD,CAEA,OAAQ,CACN,KAAK,GAAG,UAAU,IAAI,KAAK,EACvB,KAAK,SAAS,KAAK,QAAQ,EAC/B,WAAW,IAAM,CACf,KAAK,GAAG,OAAO,CACjB,EAAG,GAAG,CACR,CAEA,YAAYA,EAAuB,CACjC,YAAK,GAAK,SAAS,cAAc,KAAK,EACtC,KAAK,GAAG,UAAU,IAAI,OAAO,EAC7B,KAAK,GAAG,UAAU,IAAI,KAAK,EAC3B,KAAK,GAAG,UAAYC;AAAA;AAAA;AAAA;AAAA,0BAIE,IAAIC,EAAWC,CAAK,CAAC;AAAA;AAAA;AAAA,kBAG7BH,EAAQ,IAAI;AAAA;AAAA;AAAA,UAGpB,EAEN,KAAK,GAAG,iBAAiB,+BAA+B,EAAE,QAASI,GAAS,CAC1EA,EAAK,iBAAiB,QAAUC,GAAa,CACvCD,EAAK,UAAY,KACnBC,EAAE,eAAe,EAEnB,KAAK,MAAM,CACb,CAAC,CACH,CAAC,EAED,KAAK,GAAG,iBAAiB,4BAA4B,EAAE,QAASD,GAAS,CACvEA,EAAK,iBAAiB,QAAUC,GAAa,CAC3C,KAAK,KAAK,CACZ,CAAC,CACH,CAAC,EAED,OAAO,iBAAiB,UAAYA,GAAqB,CACnDA,EAAE,MAAQ,UACZ,KAAK,MAAM,CAEf,CAAC,EAED,WAAW,IAAM,CACf,KAAK,GAAG,UAAU,OAAO,KAAK,CAChC,EAAG,CAAC,EACG,KAAK,EACd,CACF,EAEaC,EAAN,cAAwBP,CAAM,CAKnC,YAAYC,EAA2B,CACrC,IAAIO,EAAON;AAAA,4CAC6BD,EAAQ,QAAU,MAAM,aAAaA,EAAQ,MAAM;AAAA,kBAC7EA,EAAQ,IAAI;AAAA,gEACkC,WAAW,UAAU;AAAA;AAAA,UAGjFA,EAAQ,KAAOO,EACf,MAAMP,CAAO,EAEb,KAAK,OAASA,EAAQ,MACxB,CACF,EAEaQ,EAAN,cAA6BF,CAAU,CAK5C,YAAYN,EAA2B,CACrC,MAAMA,CAAO,EACb,KAAK,WAAaA,EAAQ,WAC1B,KAAK,UAAYA,EAAQ,UACzB,KAAK,OAASA,EAAQ,OACtB,KAAK,GAAKA,EAAQ,GAClB,KAAK,YAAY,CACnB,CAEA,aAAc,CACZ,IAAIO,EAAO,KAAK,GAAG,cAA+B,MAAM,EACxDA,EAAK,iBAAiB,SAAU,MAAOF,GAAa,CAClDA,EAAE,eAAe,GACP,MAAM,MAAM,KAAK,OAAQ,CACjC,KAAM,IAAI,SAASE,CAAI,EACvB,OAAQ,KAAK,QAAU,MACzB,CAAC,GACO,IACN,KAAK,MAAM,EACP,KAAK,IAAI,KAAK,GAAG,EACrB,WAAW,aAAa,OAAO,CAC7B,KAAM,OACN,QAAS,KAAK,YAAc,4BAC5B,MAAO,SACT,CAAC,GAED,WAAW,aAAa,OAAO,CAC7B,KAAM,SACN,QAAS,KAAK,WAAa,wEAC3B,MAAO,QACT,CAAC,CAEL,CAAC,CACH,CACF",
  "names": ["close_default", "Modal", "options", "Hatch", "SafeString", "close_default", "item", "e", "FormModal", "form", "FetchFormModal"]
}