UNPKG

b-components-js

Version:

Generate Bootstrap components through JavaScript

8 lines (7 loc) 6.1 kB
/*! * b-components-js v0.0.2 * https://github.com/ZhangChengLin/b-components * Copyright (c) 2020 - 2022 MIT */ import{Modal as e,Offcanvas as a,Toast as t}from"bootstrap";const n=e=>null===e,s=e=>"string"==typeof e&&""===e,d=(e,a=!1)=>{const t=document.createElement("button");return t.className=a?"btn-close btn-close-white":"btn-close",t.type="button",t.dataset.bsDismiss=e,t.ariaLabel="Close",t},o=()=>Date.now().toString(),c=(a,t,c,r,l,i,m,b,u)=>{const p="modalId_"+o(),f=(e=>{const a=document.createElement("div");return a.className="modal fade",a.id=e,a.tabIndex=-1,a.role="dialog",a.setAttribute("aria-labelledby","modalTitleLabel"),a})(p),v=((e="",a=!1,t=!1)=>{const n=document.createElement("div");switch(n.className="modal-dialog",e){case"sm":n.classList.add("modal-sm");break;case"lg":n.classList.add("modal-lg");break;case"xl":n.classList.add("modal-xl");break;case"full":n.classList.add("modal-fullscreen");break;case"full-sm":n.classList.add("modal-fullscreen-sm-down");break;case"full-md":n.classList.add("modal-fullscreen-md-down");break;case"full-lg":n.classList.add("modal-fullscreen-lg-down");break;case"full-xl":n.classList.add("modal-fullscreen-xl-down");break;case"":case"default":break;default:n.classList.add(e)}!0===a&&n.classList.add("modal-dialog-centered");!0===t&&n.classList.add("modal-dialog-scrollable");return n})(r,l,i),h=(()=>{const e=document.createElement("div");return e.className="modal-content",e})(),L=(e=>{if(n(e)||s(e))return"";const a=document.createElement("div"),t=document.createElement("h5");return a.className="modal-header",t.className="modal-title",t.id="modalTitleLabel",e instanceof Function?t.append(e()):e instanceof HTMLElement?t.append(e):t.innerHTML=e,a.append(t,d("modal")),a})(a),E=(e=>{const a=document.createElement("div");return a.className="modal-body",e instanceof Function?a.append(e()):e instanceof HTMLElement?a.append(e):a.innerHTML=e,a})(t),w=(e=>{if(n(e)||s(e))return"";const a=document.createElement("div");return a.className="modal-footer",e instanceof Function?a.append(e()):e instanceof HTMLElement?a.append(e):a.innerHTML=e,a})(c);h.append(L,E,w),v.append(h),f.append(v),document.body.append(f),b&&u&&((e,a,t)=>{switch(a){case"show":e.addEventListener("show.bs.modal",(()=>t()));break;case"shown":e.addEventListener("shown.bs.modal",(()=>t()));break;case"hide":e.addEventListener("hide.bs.modal",(()=>t()));break;case"hidden":e.addEventListener("hidden.bs.modal",(()=>t()));break;case"hidePrevented":e.addEventListener("hidePrevented.bs.modal",(()=>t()))}})(f,b,u);return(m?new e(f,m):new e(f)).show(),(a=>{a.addEventListener("hidden.bs.modal",(()=>{e.getInstance(a).dispose(),setTimeout((()=>{a.remove()}),2e3)}))})(f),p},r=(e,t,c,r,l,i)=>{const m="offcanvasId_"+o(),b=((e,a)=>{const t=document.createElement("div");switch(e=e??"start"){case"start":case"top":case"end":case"bottom":break;default:throw"Placement error"}return t.className=`offcanvas offcanvas-${e}`,t.id=a,t.tabIndex=-1,t.role="dialog",t.setAttribute("aria-labelledby","offcanvasTitleLabel"),t})(c,m),u=(e=>{if(n(e)||s(e))return"";const a=document.createElement("div"),t=document.createElement("h5");return a.className="offcanvas-header",t.className="offcanvas-title",t.id="offcanvasTitleLabel",e instanceof Function?t.append(e()):e instanceof HTMLElement?t.append(e):t.innerHTML=e,a.append(t,d("offcanvas")),a})(e),p=(e=>{const a=document.createElement("div");return a.className="offcanvas-body",e instanceof Function?a.append(e()):e instanceof HTMLElement?a.append(e):a.innerHTML=e,a})(t);b.append(u,p),document.body.append(b),l&&i&&((e,a,t)=>{switch(a){case"show":e.addEventListener("show.bs.offcanvas",(()=>t()));break;case"shown":e.addEventListener("shown.bs.offcanvas",(()=>t()));break;case"hide":e.addEventListener("hide.bs.offcanvas",(()=>t()));break;case"hidden":e.addEventListener("hidden.bs.offcanvas",(()=>t()));break;default:throw"eventsType error"}})(b,l,i);return(r?new a(b,r):new a(b)).show(),(e=>{e.addEventListener("hidden.bs.offcanvas",(()=>{a.getInstance(e).dispose(),setTimeout((()=>{e.remove()}),3e3)}))})(b),m},l=(e,a,c,r,l,i)=>{const m="toastId_"+o(),b=(e=>{const a=document.createElement("div");return a.className="position-relative",a.ariaLive=e??"polite",a.ariaAtomic="true",a})(),u=document.querySelector(".toast-container")??(e=>{const a=document.createElement("div");switch(e=e??"be"){case"ts":e="top-0 start-0";break;case"tc":e="top-0 start-50 translate-middle-x";break;case"te":e="top-0 end-0";break;case"ms":e="top-50 start-0 translate-middle-y";break;case"mc":e="top-50 start-50 translate-middle";break;case"me":e="top-50 end-0 translate-middle-y";break;case"bs":e="bottom-0 start-0";break;case"bc":e="bottom-0 start-50 translate-middle-x";break;case"be":e="bottom-0 end-0";break;default:throw"Placement error"}return a.className=`toast-container position-fixed ${e}`,a})(c),p=(e=>{const a=document.createElement("div");return a.className="toast",a.id=e,a.role="alert",a.ariaLive="assertive",a.ariaAtomic="true",a})(m),f=(e=>{if(n(e)||s(e))return"";const a=document.createElement("div"),t=document.createElement("strong");return a.className="toast-header",t.className="toast-title me-auto",e instanceof Function?t.append(e()):e instanceof HTMLElement?t.append(e):t.innerHTML=e,a.append(t,d("toast")),a})(e),v=(e=>{const a=document.createElement("div");return a.className="toast-body",e instanceof Function?a.append(e()):e instanceof HTMLElement?a.append(e):a.innerHTML=e,a})(a);p.append(f,v),u.append(p),b.append(u),document.body.append(b),l&&i&&((e,a,t)=>{switch(a){case"show":e.addEventListener("show.bs.toast",(()=>t()));break;case"shown":e.addEventListener("shown.bs.toast",(()=>t()));break;case"hide":e.addEventListener("hide.bs.toast",(()=>t()));break;case"hidden":e.addEventListener("hidden.bs.toast",(()=>t()));break;default:throw"eventsType error"}})(p,l,i);return(r?new t(p,r):new t(p)).show(),(e=>{e.addEventListener("hidden.bs.toast",(()=>{t.getInstance(e).dispose(),setTimeout((()=>{e.remove()}),3e3)}))})(p),m};export{c as bModal,r as bOffcanvas,l as bToast}; //# sourceMappingURL=b.bundle.esm.min.js.map