and-component-library/Modal.js

Distribution of AND Web Components

function t(){}function e(t){return t()}function n(){return Object.create(null)}function o(t){t.forEach(e)}function i(t){return"function"==typeof t}function s(t,e){return t!=t?e==e:t!==e||t&&"object"==typeof t||"function"==typeof t}function r(t,e){t.appendChild(e)}function a(t,e,n){t.insertBefore(e,n||null)}function c(t){t.parentNode.removeChild(t)}function d(t){return document.createElement(t)}function l(t){return document.createTextNode(t)}function u(){return l(" ")}function p(t,e,n,o){return t.addEventListener(e,n,o),()=>t.removeEventListener(e,n,o)}function m(t,e,n){null==n?t.removeAttribute(e):t.getAttribute(e)!==n&&t.setAttribute(e,n)}let f;function h(t){f=t}function g(){if(!f)throw new Error("Function called outside component initialization");return f}function $(){const t=g();return(e,n)=>{const o=t.$$.callbacks[e];if(o){const i=function(t,e){const n=document.createEvent("CustomEvent");return n.initCustomEvent(t,!1,!1,e),n}(e,n);o.slice().forEach(e=>{e.call(t,i)})}}}const v=[],b=[],y=[],x=[],k=Promise.resolve();let E=!1;function _(t){y.push(t)}let w=!1;const q=new Set;function C(){if(!w){w=!0;do{for(let t=0;t<v.length;t+=1){const e=v[t];h(e),L(e.$$)}for(h(null),v.length=0;b.length;)b.pop()();for(let t=0;t<y.length;t+=1){const e=y[t];q.has(e)||(q.add(e),e())}y.length=0}while(v.length);for(;x.length;)x.pop()();E=!1,w=!1,q.clear()}}function L(t){if(null!==t.fragment){t.update(),o(t.before_update);const e=t.dirty;t.dirty=[-1],t.fragment&&t.fragment.p(t.ctx,e),t.after_update.forEach(_)}}const M=new Set;function S(t,e){-1===t.$$.dirty[0]&&(v.push(t),E||(E=!0,k.then(C)),t.$$.dirty.fill(0)),t.$$.dirty[e/31|0]|=1<<e%31}function j(s,r,a,d,l,u,p=[-1]){const m=f;h(s);const g=r.props||{},$=s.$$={fragment:null,ctx:null,props:u,update:t,not_equal:l,bound:n(),on_mount:[],on_destroy:[],before_update:[],after_update:[],context:new Map(m?m.$$.context:[]),callbacks:n(),dirty:p,skip_bound:!1};let v=!1;if($.ctx=a?a(s,g,(t,e,...n)=>{const o=n.length?n[0]:e;return $.ctx&&l($.ctx[t],$.ctx[t]=o)&&(!$.skip_bound&&$.bound[t]&&$.bound[t](o),v&&S(s,t)),e}):[],$.update(),v=!0,o($.before_update),$.fragment=!!d&&d($.ctx),r.target){if(r.hydrate){const t=function(t){return Array.from(t.childNodes)}(r.target);$.fragment&&$.fragment.l(t),t.forEach(c)}else $.fragment&&$.fragment.c();r.intro&&((b=s.$$.fragment)&&b.i&&(M.delete(b),b.i(y))),function(t,n,s){const{fragment:r,on_mount:a,on_destroy:c,after_update:d}=t.$$;r&&r.m(n,s),_(()=>{const n=a.map(e).filter(i);c?c.push(...n):o(n),t.$$.on_mount=[]}),d.forEach(_)}(s,r.target,r.anchor),C()}var b,y;h(m)}let H;"function"==typeof HTMLElement&&(H=class extends HTMLElement{constructor(){super(),this.attachShadow({mode:"open"})}connectedCallback(){for(const t in this.$$.slotted)this.appendChild(this.$$.slotted[t])}attributeChangedCallback(t,e,n){this[t]=n}$destroy(){!function(t,e){const n=t.$$;null!==n.fragment&&(o(n.on_destroy),n.fragment&&n.fragment.d(e),n.on_destroy=n.fragment=null,n.ctx=[])}(this,1),this.$destroy=t}$on(t,e){const n=this.$$.callbacks[t]||(this.$$.callbacks[t]=[]);return n.push(e),()=>{const t=n.indexOf(e);-1!==t&&n.splice(t,1)}}$set(t){var e;this.$$set&&(e=t,0!==Object.keys(e).length)&&(this.$$.skip_bound=!0,this.$$set(t),this.$$.skip_bound=!1)}});var T={dispatch(t,e,n){t.dispatchEvent&&t.dispatchEvent(new CustomEvent(e,{detail:n}))},dispatchCustomEvent(t,e,n,o){let i=o||{};e&&e.type&&e.target&&(i={type:e.type,target:e.target},n||(n=e.type)),this.dispatch(t,n,i)}};function A(t){let e,n,i,s,l,f,h,g,$,v,b,y,x,k,E,_;return{c(){e=d("div"),n=d("div"),i=u(),s=d("div"),l=d("div"),f=d("button"),f.textContent="X",h=u(),g=d("slot"),g.innerHTML="<div><h1>Heading</h1></div>",$=u(),v=d("div"),v.innerHTML='<slot name="content"><div><p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Similique, magni earum ut ex\n                        totam corporis unde incidunt deserunt, dolorem voluptatum libero quia. Maiores,\n                        provident error vel veritatis itaque nemo commodi.</p> \n\n                        <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Similique, magni earum ut ex\n                        totam corporis unde incidunt deserunt, dolorem voluptatum libero quia. Maiores,\n                        provident error vel veritatis itaque nemo commodi.</p> \n\n                        <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Similique, magni earum ut ex\n                        totam corporis unde incidunt deserunt, dolorem voluptatum libero quia. Maiores,\n                        provident error vel veritatis itaque nemo commodi.</p> \n\n                        <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Similique, magni earum ut ex\n                        totam corporis unde incidunt deserunt, dolorem voluptatum libero quia. Maiores,\n                        provident error vel veritatis itaque nemo commodi.</p></div></slot>',b=u(),y=d("div"),y.innerHTML='<slot name="footer"><div class="footer-content"><button>Sample</button> \n                        <button>Sample 2</button></div></slot>',m(n,"data-testid","custom-modal-backdrop"),m(n,"class","backdrop"),m(f,"class","close-button"),m(g,"name","header"),m(l,"data-testid","custom-modal-header"),m(l,"class","header"),m(v,"data-testid","custom-modal-content"),m(v,"class","content"),m(y,"data-testid","custom-modal-footer"),m(y,"class","footer"),m(s,"class","content-wrapper"),m(e,"id",t[2]),m(e,"data-testid","custom-modal"),m(e,"class",x=["modal",t[1]].join(" ")),m(e,"tabindex",k=0)},m(o,c){a(o,e,c),r(e,n),r(e,i),r(e,s),r(s,l),r(l,f),r(l,h),r(l,g),r(s,$),r(s,v),r(s,b),r(s,y),E||(_=[p(n,"click",t[4]),p(f,"click",t[4]),p(e,"keydown",t[5])],E=!0)},p(t,n){4&n&&m(e,"id",t[2]),2&n&&x!==(x=["modal",t[1]].join(" "))&&m(e,"class",x)},d(t){t&&c(e),E=!1,o(_)}}}function N(e){let n,o,i,s=e[0]&&A(e);return{c(){n=d("link"),o=u(),s&&s.c(),i=l(""),this.c=t,m(n,"rel","stylesheet"),m(n,"href","and-component-styles.css"),m(n,"style_disabled",e[3])},m(t,e){a(t,n,e),a(t,o,e),s&&s.m(t,e),a(t,i,e)},p(t,[e]){8&e&&m(n,"style_disabled",t[3]),t[0]?s?s.p(t,e):(s=A(t),s.c(),s.m(i.parentNode,i)):s&&(s.d(1),s=null)},i:t,o:t,d(t){t&&c(n),t&&c(o),s&&s.d(t),t&&c(i)}}}function P(t,e,n){let{overidestyle:o=!1}=e,{class:i=""}=e,{isopen:s=!0}=e,{id:r="and-modal"}=e;function a(){n(0,s=!1),l()}const c=g(),d=$(),l=t=>{d("close",t),T.dispatchCustomEvent(c,t,"close")};let u;return t.$$set=t=>{"overidestyle"in t&&n(6,o=t.overidestyle),"class"in t&&n(1,i=t.class),"isopen"in t&&n(0,s=t.isopen),"id"in t&&n(2,r=t.id)},t.$$.update=()=>{64&t.$$.dirty&&n(3,u=!o||null)},[s,i,r,u,a,function(t){t.stopPropagation(),"Escape"===t.key&&a()},o]}class O extends H{constructor(t){super(),this.shadowRoot.innerHTML='<style>@import url(https://fonts.googleapis.com/css2?family=Poppins);:root{--step:50}.modal{position:absolute;top:0;left:0;width:100%;height:100vh;display:flex;justify-content:center;align-items:center;font-family:"Poppins", sans-serif}.backdrop{position:absolute;width:100%;height:100%;background-color:darkgray}.header h1{margin:0}.content-wrapper{background:white;border:1px solid black;border-radius:0.25rem;flex-basis:32em;position:relative;padding:0.9375rem}.close-button{float:right;background:none;outline:none;border-radius:0.3125rem}.content{max-height:25rem;max-width:37.5rem;overflow:auto}.footer{display:flex;justify-content:flex-end}.footer .footer-content{padding:15px}</style>',j(this,{target:this.shadowRoot},P,N,s,{overidestyle:6,class:1,isopen:0,id:2}),t&&(t.target&&a(t.target,this,t.anchor),t.props&&(this.$set(t.props),C()))}static get observedAttributes(){return["overidestyle","class","isopen","id"]}get overidestyle(){return this.$$.ctx[6]}set overidestyle(t){this.$set({overidestyle:t}),C()}get class(){return this.$$.ctx[1]}set class(t){this.$set({class:t}),C()}get isopen(){return this.$$.ctx[0]}set isopen(t){this.$set({isopen:t}),C()}get id(){return this.$$.ctx[2]}set id(t){this.$set({id:t}),C()}}customElements.define("and-modal",O);export default O;
//# sourceMappingURL=Modal.js.map