@biggive/components 0.0.17 → 0.0.21

package/dist/biggive/biggive.esm.js

@@ -1 +1 @@
-import{p as a,b as i}from"./p-ce3d5ebc.js";(()=>{const i=import.meta.url,n={};return""!==i&&(n.resourcesUrl=new URL(".",i).href),a(n)})().then((a=>i([["p-59970be1",[[1,"demo-campaign-cards"],[1,"biggive-campaign-card",{banner:[1],daysRemaining:[2,"days-remaining"],currencyCode:[1,"currency-code"],target:[2],organisationName:[1,"organisation-name"],campaignTitle:[1,"campaign-title"],campaignType:[1,"campaign-type"],beneficiaries:[16],categories:[16],matchFundsRemaining:[2,"match-funds-remaining"],totalFundsRaised:[2,"total-funds-raised"],callToActionUrl:[1,"call-to-action-url"],callToActionLabel:[1,"call-to-action-label"]}],[1,"biggive-grid"]]]],a)));
+import{p as a,b as i}from"./p-89e49cb6.js";(()=>{const i=import.meta.url,n={};return""!==i&&(n.resourcesUrl=new URL(".",i).href),a(n)})().then((a=>i([["p-e330fae6",[[1,"demo-campaign-cards"],[1,"biggive-campaign-card",{banner:[1],daysRemaining:[2,"days-remaining"],currencyCode:[1,"currency-code"],target:[2],organisationName:[1,"organisation-name"],campaignTitle:[1,"campaign-title"],campaignType:[1,"campaign-type"],beneficiaries:[16],categories:[16],matchFundsRemaining:[2,"match-funds-remaining"],totalFundsRaised:[2,"total-funds-raised"],callToActionUrl:[1,"call-to-action-url"],callToActionLabel:[1,"call-to-action-label"]}],[1,"biggive-grid"]]]],a)));

package/dist/biggive/p-89e49cb6.js

@@ -0,0 +1,2 @@
+let t,e,n=!1,l=!1;const s="undefined"!=typeof window?window:{},o=s.document||{head:{}},i={t:0,l:"",jmp:t=>t(),raf:t=>requestAnimationFrame(t),ael:(t,e,n,l)=>t.addEventListener(e,n,l),rel:(t,e,n,l)=>t.removeEventListener(e,n,l),ce:(t,e)=>new CustomEvent(t,e)},r=t=>Promise.resolve(t),c=(()=>{try{return new CSSStyleSheet,"function"==typeof(new CSSStyleSheet).replaceSync}catch(t){}return!1})(),u=new WeakMap,$=(t,e,n)=>{let l=X.get(t);c&&n?(l=l||new CSSStyleSheet,"string"==typeof l?l=e:l.replaceSync(e)):l=e,X.set(t,l)},a=(t,e)=>{let n=f(e);const l=X.get(n);if(t=11===t.nodeType?t:o,l)if("string"==typeof l){let e,s=u.get(t=t.head||t);s||u.set(t,s=new Set),s.has(n)||(t.host&&(e=t.querySelector(`[sty-id="${n}"]`))?e.innerHTML=l:(e=o.createElement("style"),e.innerHTML=l,t.insertBefore(e,t.querySelector("link"))),s&&s.add(n))}else t.adoptedStyleSheets.includes(l)||(t.adoptedStyleSheets=[...t.adoptedStyleSheets,l]);return n},f=t=>"sc-"+t.o,d=t=>t.replace(/\/\*!@([^\/]+)\*\/[^\{]+\{/g,"$1{"),h={},y=t=>"object"==(t=typeof t)||"function"===t,p=(t,e,...n)=>{let l=null,s=!1,o=!1;const i=[],r=e=>{for(let n=0;n<e.length;n++)l=e[n],Array.isArray(l)?r(l):null!=l&&"boolean"!=typeof l&&((s="function"!=typeof t&&!y(l))&&(l+=""),s&&o?i[i.length-1].i+=l:i.push(s?m(null,l):l),o=s)};if(r(n),e){const t=e.className||e.class;t&&(e.class="object"!=typeof t?t:Object.keys(t).filter((e=>t[e])).join(" "))}const c=m(t,null);return c.u=e,i.length>0&&(c.$=i),c},m=(t,e)=>({t:0,h:t,i:e,p:null,$:null,u:null}),w={},g=(t,e,n,l,s,o)=>{if(n!==l){let i=G(t,e);if(e.toLowerCase(),"class"===e){const e=t.classList,s=v(n),o=v(l);e.remove(...s.filter((t=>t&&!o.includes(t)))),e.add(...o.filter((t=>t&&!s.includes(t))))}else if("style"===e){for(const e in n)l&&null!=l[e]||(e.includes("-")?t.style.removeProperty(e):t.style[e]="");for(const e in l)n&&l[e]===n[e]||(e.includes("-")?t.style.setProperty(e,l[e]):t.style[e]=l[e])}else{const r=y(l);if((i||r&&null!==l)&&!s)try{if(t.tagName.includes("-"))t[e]=l;else{const s=null==l?"":l;"list"===e?i=!1:null!=n&&t[e]==s||(t[e]=s)}}catch(t){}null==l||!1===l?!1===l&&""!==t.getAttribute(e)||t.removeAttribute(e):(!i||4&o||s)&&!r&&t.setAttribute(e,l=!0===l?"":l)}}},b=/\s/,v=t=>t?t.split(b):[],S=(t,e,n,l)=>{const s=11===e.p.nodeType&&e.p.host?e.p.host:e.p,o=t&&t.u||h,i=e.u||h;for(l in o)l in i||g(s,l,o[l],void 0,n,e.t);for(l in i)g(s,l,o[l],i[l],n,e.t)},j=(e,l,s)=>{const i=l.$[s];let r,c,u=0;if(null!==i.i)r=i.p=o.createTextNode(i.i);else{if(n||(n="svg"===i.h),r=i.p=o.createElementNS(n?"http://www.w3.org/2000/svg":"http://www.w3.org/1999/xhtml",i.h),n&&"foreignObject"===i.h&&(n=!1),S(null,i,n),null!=t&&r["s-si"]!==t&&r.classList.add(r["s-si"]=t),i.$)for(u=0;u<i.$.length;++u)c=j(e,i,u),c&&r.appendChild(c);"svg"===i.h?n=!1:"foreignObject"===r.tagName&&(n=!0)}return r},M=(t,n,l,s,o,i)=>{let r,c=t;for(c.shadowRoot&&c.tagName===e&&(c=c.shadowRoot);o<=i;++o)s[o]&&(r=j(null,l,o),r&&(s[o].p=r,c.insertBefore(r,n)))},O=(t,e,n,l)=>{for(;e<=n;++e)(l=t[e])&&l.p.remove()},k=(t,e)=>t.h===e.h,x=(t,e)=>{const l=e.p=t.p,s=t.$,o=e.$,i=e.h,r=e.i;null===r?(n="svg"===i||"foreignObject"!==i&&n,"slot"===i||S(t,e,n),null!==s&&null!==o?((t,e,n,l)=>{let s,o=0,i=0,r=e.length-1,c=e[0],u=e[r],$=l.length-1,a=l[0],f=l[$];for(;o<=r&&i<=$;)null==c?c=e[++o]:null==u?u=e[--r]:null==a?a=l[++i]:null==f?f=l[--$]:k(c,a)?(x(c,a),c=e[++o],a=l[++i]):k(u,f)?(x(u,f),u=e[--r],f=l[--$]):k(c,f)?(x(c,f),t.insertBefore(c.p,u.p.nextSibling),c=e[++o],f=l[--$]):k(u,a)?(x(u,a),t.insertBefore(u.p,c.p),u=e[--r],a=l[++i]):(s=j(e&&e[i],n,i),a=l[++i],s&&c.p.parentNode.insertBefore(s,c.p));o>r?M(t,null==l[$+1]?null:l[$+1].p,n,l,i,$):i>$&&O(e,o,r)})(l,s,e,o):null!==o?(null!==t.i&&(l.textContent=""),M(l,null,e,o,0,o.length-1)):null!==s&&O(s,0,s.length-1),n&&"svg"===i&&(n=!1)):t.i!==r&&(l.data=r)},C=(t,e)=>{e&&!t.m&&e["s-p"]&&e["s-p"].push(new Promise((e=>t.m=e)))},I=(t,e)=>{if(t.t|=16,!(4&t.t))return C(t,t.g),st((()=>P(t,e)));t.t|=512},P=(t,e)=>{const n=t.v;return T(void 0,(()=>E(t,n,e)))},E=async(t,e,n)=>{const l=t.S,s=l["s-rc"];n&&(t=>{const e=t.j,n=t.S,l=e.t,s=a(n.shadowRoot?n.shadowRoot:n.getRootNode(),e);10&l&&(n["s-sc"]=s,n.classList.add(s+"-h"))})(t);L(t,e),s&&(s.map((t=>t())),l["s-rc"]=void 0);{const e=l["s-p"],n=()=>N(t);0===e.length?n():(Promise.all(e).then(n),t.t|=4,e.length=0)}},L=(n,l)=>{try{l=l.render(),n.t&=-17,n.t|=2,((n,l)=>{const s=n.S,o=n.M||m(null,null),i=(t=>t&&t.h===w)(l)?l:p(null,null,l);e=s.tagName,i.h=null,i.t|=4,n.M=i,i.p=o.p=s.shadowRoot||s,t=s["s-sc"],x(o,i)})(n,l)}catch(t){J(t,n.S)}return null},N=t=>{const e=t.S,n=t.g;64&t.t||(t.t|=64,U(e),t.O(e),n||R()),t.m&&(t.m(),t.m=void 0),512&t.t&&lt((()=>I(t,!1))),t.t&=-517},R=()=>{U(o.documentElement),lt((()=>(t=>{const e=i.ce("appload",{detail:{namespace:"biggive"}});return t.dispatchEvent(e),e})(s)))},T=(t,e)=>t&&t.then?t.then(e):e(),U=t=>t.classList.add("hydrated"),A=(t,e,n,l,s,i,r)=>{let c,u,$,a;if(1===i.nodeType){for(c=i.getAttribute("c-id"),c&&(u=c.split("."),u[0]!==r&&"0"!==u[0]||($={t:0,k:u[0],C:u[1],I:u[2],P:u[3],h:i.tagName.toLowerCase(),p:i,u:null,$:null,L:null,N:null,i:null},e.push($),i.removeAttribute("c-id"),t.$||(t.$=[]),t.$[$.P]=$,t=$,l&&"0"===$.I&&(l[$.P]=$.p))),a=i.childNodes.length-1;a>=0;a--)A(t,e,n,l,s,i.childNodes[a],r);if(i.shadowRoot)for(a=i.shadowRoot.childNodes.length-1;a>=0;a--)A(t,e,n,l,s,i.shadowRoot.childNodes[a],r)}else if(8===i.nodeType)u=i.nodeValue.split("."),u[1]!==r&&"0"!==u[1]||(c=u[0],$={t:0,k:u[1],C:u[2],I:u[3],P:u[4],p:i,u:null,$:null,L:null,N:null,h:null,i:null},"t"===c?($.p=i.nextSibling,$.p&&3===$.p.nodeType&&($.i=$.p.textContent,e.push($),i.remove(),t.$||(t.$=[]),t.$[$.P]=$,l&&"0"===$.I&&(l[$.P]=$.p))):$.k===r&&("s"===c?($.h="slot",i["s-sn"]=u[5]?$.N=u[5]:"",i["s-sr"]=!0,l&&($.p=o.createElement($.h),$.N&&$.p.setAttribute("name",$.N),i.parentNode.insertBefore($.p,i),i.remove(),"0"===$.I&&(l[$.P]=$.p)),n.push($),t.$||(t.$=[]),t.$[$.P]=$):"r"===c&&l&&i.remove()));else if(t&&"style"===t.h){const e=m(null,i.textContent);e.p=i,e.P="0",t.$=[e]}},F=(t,e)=>{if(1===t.nodeType){let n=0;for(;n<t.childNodes.length;n++)F(t.childNodes[n],e);if(t.shadowRoot)for(n=0;n<t.shadowRoot.childNodes.length;n++)F(t.shadowRoot.childNodes[n],e)}else if(8===t.nodeType){const n=t.nodeValue.split(".");"o"===n[0]&&(e.set(n[1]+"."+n[2],t),t.nodeValue="",t["s-en"]=n[3])}},W=(t,e,n)=>{if(e.R){const l=Object.entries(e.R),s=t.prototype;if(l.map((([t,[l]])=>{(31&l||2&n&&32&l)&&Object.defineProperty(s,t,{get(){return((t,e)=>z(this).T.get(e))(0,t)},set(n){((t,e,n,l)=>{const s=z(t),o=s.T.get(e),i=s.t,r=s.v;n=((t,e)=>null==t||y(t)?t:2&e?parseFloat(t):1&e?t+"":t)(n,l.R[e][0]),8&i&&void 0!==o||n===o||Number.isNaN(o)&&Number.isNaN(n)||(s.T.set(e,n),r&&2==(18&i)&&I(s,!1))})(this,t,n,e)},configurable:!0,enumerable:!0})})),1&n){const e=new Map;s.attributeChangedCallback=function(t,n,l){i.jmp((()=>{const n=e.get(t);if(this.hasOwnProperty(n))l=this[n],delete this[n];else if(s.hasOwnProperty(n)&&"number"==typeof this[n]&&this[n]==l)return;this[n]=(null!==l||"boolean"!=typeof this[n])&&l}))},t.observedAttributes=l.filter((([t,e])=>15&e[0])).map((([t,n])=>{const l=n[1]||t;return e.set(l,t),l}))}}return t},q=t=>{if(0==(1&i.t)){const e=z(t),n=e.j,l=()=>{};if(!(1&e.t)){let l;if(e.t|=1,l=t.getAttribute("s-id"),l){if(1&n.t){const e=a(t.shadowRoot,n);t.classList.remove(e+"-h",e+"-s")}((t,e,n,l)=>{const s=t.shadowRoot,r=[],c=s?[]:null,u=l.M=m(e,null);i.U||F(o.body,i.U=new Map),t["s-id"]=n,t.removeAttribute("s-id"),A(u,r,[],c,t,t,n),r.map((t=>{const n=t.k+"."+t.C,l=i.U.get(n),o=t.p;l&&""===l["s-en"]&&l.parentNode.insertBefore(o,l.nextSibling),s||(o["s-hn"]=e,l&&(o["s-ol"]=l,o["s-ol"]["s-nr"]=o)),i.U.delete(n)})),s&&c.map((t=>{t&&s.appendChild(t)}))})(t,n.o,l,e)}{let n=t;for(;n=n.parentNode||n.host;)if(1===n.nodeType&&n.hasAttribute("s-id")&&n["s-p"]||n["s-p"]){C(e,e.g=n);break}}n.R&&Object.entries(n.R).map((([e,[n]])=>{if(31&n&&t.hasOwnProperty(e)){const n=t[e];delete t[e],t[e]=n}})),(async(t,e,n,l,s)=>{if(0==(32&e.t)){{if(e.t|=32,(s=Q(n)).then){const t=()=>{};s=await s,t()}s.isProxied||(W(s,n,2),s.isProxied=!0);const t=()=>{};e.t|=8;try{new s(e)}catch(t){J(t)}e.t&=-9,t()}if(s.style){let t=s.style;const e=f(n);if(!X.has(e)){const l=()=>{};$(e,t,!!(1&n.t)),l()}}}const o=e.g,i=()=>I(e,!0);o&&o["s-rc"]?o["s-rc"].push(i):i()})(0,e,n)}l()}},H=(t,e={})=>{const n=[],l=e.exclude||[],r=s.customElements,c=o.head,u=c.querySelector("meta[charset]"),a=o.createElement("style"),f=[],h=o.querySelectorAll("[sty-id]");let y,p=!0,m=0;for(Object.assign(i,e),i.l=new URL(e.resourcesUrl||"./",o.baseURI).href,i.t|=2;m<h.length;m++)$(h[m].getAttribute("sty-id"),d(h[m].innerHTML),!0);t.map((t=>{t[1].map((e=>{const s={t:e[0],o:e[1],R:e[2],A:e[3]};s.R=e[2];const o=s.o,c=class extends HTMLElement{constructor(t){super(t),D(t=this,s),1&s.t&&t.attachShadow({mode:"open"})}connectedCallback(){y&&(clearTimeout(y),y=null),p?f.push(this):i.jmp((()=>q(this)))}disconnectedCallback(){i.jmp((()=>{}))}componentOnReady(){return z(this).F}};s.W=t[0],l.includes(o)||r.get(o)||(n.push(o),r.define(o,W(c,s,1)))}))})),a.innerHTML=n+"{visibility:hidden}.hydrated{visibility:inherit}",a.setAttribute("data-styles",""),c.insertBefore(a,u?u.nextSibling:c.firstChild),p=!1,f.length?f.map((t=>t.connectedCallback())):i.jmp((()=>y=setTimeout(R,30)))},V=t=>{const e=new URL(t,i.l);return e.origin!==s.location.origin?e.href:e.pathname},_=new WeakMap,z=t=>_.get(t),B=(t,e)=>_.set(e.v=t,e),D=(t,e)=>{const n={t:0,S:t,j:e,T:new Map};return n.F=new Promise((t=>n.O=t)),t["s-p"]=[],t["s-rc"]=[],_.set(t,n)},G=(t,e)=>e in t,J=(t,e)=>(0,console.error)(t,e),K=new Map,Q=t=>{const e=t.o.replace(/-/g,"_"),n=t.W,l=K.get(n);return l?l[e]:import(`./${n}.entry.js`).then((t=>(K.set(n,t),t[e])),J)
+/*!__STENCIL_STATIC_IMPORT_SWITCH__*/},X=new Map,Y=[],Z=[],tt=(t,e)=>n=>{t.push(n),l||(l=!0,e&&4&i.t?lt(nt):i.raf(nt))},et=t=>{for(let e=0;e<t.length;e++)try{t[e](performance.now())}catch(t){J(t)}t.length=0},nt=()=>{et(Y),et(Z),(l=Y.length>0)&&i.raf(nt)},lt=t=>r().then(t),st=tt(Z,!0);export{H as b,V as g,p as h,r as p,B as r}

package/dist/biggive/{p-59970be1.entry.js → p-e330fae6.entry.js}

@@ -1,4 +1,4 @@
-import{r as e,h as c,g as a}from"./p-ce3d5ebc.js";
+import{r as e,h as c,g as a}from"./p-89e49cb6.js";
 /*!
  * Font Awesome Free 6.1.2 by @fontawesome - https://fontawesome.com
  * License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License)
@@ -8,4 +8,4 @@ import{r as e,h as c,g as a}from"./p-ce3d5ebc.js";
  * Font Awesome Free 6.1.2 by @fontawesome - https://fontawesome.com
  * License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License)
  * Copyright 2022 Fonticons, Inc.
- */class A{static getBeneficiaries(){return[{name:"Children (3-18)",icon:s},{name:"General Public/Humankind",icon:V},{name:"Infants (<2)",icon:n},{name:"LGBTQAI",icon:L},{name:"Minority Groups",icon:N},{name:"Older People",icon:M},{name:"People With Disabilities",icon:i},{name:"Refugees/Asylum Seekers",icon:l},{name:"Women & Girls",icon:S},{name:"Young People (18-30)",icon:w},{name:"Other",icon:b}]}static getCategories(){return[{name:"Animals",icon:z},{name:"Armed Forces/Emergency Services",icon:h},{name:"Arts/Culture/Heritage",icon:p},{name:"Cancer",icon:v},{name:"Community Support & Development",icon:x},{name:"Disaster Relief",icon:g},{name:"Education/Training/Employment",icon:t},{name:"Environment/Conservation",icon:y},{name:"Health/Wellbeing",icon:C},{name:"Homeless/Refuge",icon:F},{name:"Hospitals/Hospices",icon:m},{name:"Human Rights/Advocacy",icon:H},{name:"Information/Advice",icon:o},{name:"Medical Research",icon:f},{name:"Mental Health",icon:k},{name:"Poverty Alleviation/Relief",icon:d},{name:"Religious",icon:u},{name:"Sports/Recreation",icon:r},{name:"Other",icon:b}]}static getBeneficiaryIcon(e){return A.getBeneficiaries().filter((c=>c.name===e))[0].icon||b}static getCategoryIcon(e){var c;return(null===(c=A.getCategories().filter((c=>c.name===e))[0])||void 0===c?void 0:c.icon)||b}}const R=class{constructor(c){e(this,c),this.banner="",this.daysRemaining=null,this.target=null,this.organisationName=null,this.campaignTitle=null,this.campaignType=null,this.beneficiaries=[],this.categories=[],this.matchFundsRemaining=null,this.totalFundsRaised=null,this.callToActionUrl=null,this.callToActionLabel=null}getBeneficiaryIcons(){return this.beneficiaries.map((e=>A.getBeneficiaryIcon(e)))}getCategoryIcons(){return this.categories.map((e=>A.getCategoryIcon(e)))}formatCurrency(e,c){return null===c||isNaN(c)?"–":Intl.NumberFormat("en-GB",{style:"currency",currency:e,currencyDisplay:"symbol",maximumFractionDigits:0}).format(c)}render(){return c("div",{class:"container"},c("div",{class:"sleeve"},c("div",{class:"campaign-type"},c("span",null,this.campaignType)),this.banner.length>0?c("div",{class:"image-wrap banner",style:{"background-image":"url("+this.banner+")"}},c("img",{src:this.banner,class:"banner"})):null,c("div",{class:"content"},c("div",{class:"meta-wrap style-1"},c("div",{class:"meta-item"},c("span",{class:"label"},"Days Remaining:")," ",c("span",{class:"text"},this.daysRemaining)),c("div",{class:"meta-item"},c("span",{class:"label"},"Target:")," ",c("span",{class:"text"},this.formatCurrency(this.currencyCode,this.target)))),c("header",null,c("div",{class:"slug"},this.organisationName),c("h3",null,this.campaignTitle)),c("div",{class:"meta-wrap style-2"},c("div",{class:"meta-item"},c("span",{class:"label"},"Categories"),c("span",{class:"text"},this.getCategoryIcons().map((e=>c("svg",{width:"512",height:"512",xmlns:"http://www.w3.org/2000/svg",class:"icon",viewBox:"0 0 512 512"},c("path",{d:e.icon[4].toString()})))))),c("div",{class:"meta-item"},c("span",{class:"label"},"Helping"),c("span",{class:"text"},this.getBeneficiaryIcons().map((e=>c("svg",{width:"512",height:"512",xmlns:"http://www.w3.org/2000/svg",class:"icon",viewBox:"0 0 512 512"},c("path",{d:e.icon[4].toString()}))))))),c("div",{class:"meta-wrap style-3"},c("div",{class:"meta-item"},c("span",{class:"label"},"Match",c("br",null),"Funds Remaining"),c("span",{class:"text"},this.formatCurrency(this.currencyCode,this.matchFundsRemaining))),c("div",{class:"meta-item"},c("span",{class:"label"},"Total",c("br",null),"Funds Received"),c("span",{class:"text"},this.formatCurrency(this.currencyCode,this.totalFundsRaised)))),c("div",{class:"button-wrap"},c("a",{href:this.callToActionUrl,class:"call-to-action"},this.callToActionLabel)))))}};R.style=':host{display:block;margin-bottom:30px}.container{font-family:"Euclid Triangle", sans-serif;filter:drop-shadow(-1px 6px 3px rgba(0, 0, 0, 0.25))}.sleeve{clip-path:polygon(0% 0%, 0% 0%, 100% 0%, 100% 0%, 100% 100%, 100% 100%, 10% 100%, 0 90%)}.content{padding:15px;background-color:#FFFFFF}.campaign-type{margin-left:15px;width:0;height:0;border-style:inset;border-width:85px 45px 0 45px;border-color:#2AF135 transparent transparent transparent;float:left;transform:rotate(360deg)}.campaign-type span{display:block;text-align:center;top:-85px;left:-25px;position:relative;width:45px;height:45px;margin:0;color:#2C089B;font-size:0.9rem}.banner{padding-bottom:30%;background-repeat:no-repeat;background-position:center center;background-size:cover}.banner img{display:none}.meta-wrap.style-1{display:flex;font-size:16px;line-height:20px;margin-bottom:20px}.meta-wrap.style-1 .meta-item{width:50%}.meta-wrap.style-1 .meta-item .label{font-weight:bold}.meta-wrap.style-1 .meta-item .text{color:#2C089B}header{margin-bottom:20px}header .slug{text-transform:uppercase;font-size:12px;line-height:14px}header h3{margin:0;padding:0;font-size:24px;line-height:28px}.meta-wrap.style-2{display:flex;font-size:12px;line-height:14px;margin-bottom:40px}.meta-wrap.style-2 .meta-item{width:50%}.meta-wrap.style-2 .meta-item .label{font-weight:bold;display:block;margin-bottom:10px}.meta-wrap.style-2 .meta-item .text{display:block;font-size:16px;line-height:18px}.meta-wrap.style-2 .meta-item .text i{margin-right:10px}.meta-wrap.style-3{display:flex;font-size:16px;line-height:20px;margin-bottom:20px}.meta-wrap.style-3 .meta-item{margin-right:60px}.meta-wrap.style-3 .meta-item .label{font-weight:bold;display:block;font-size:12px;line-height:14px;margin-bottom:10px}.meta-wrap.style-3 .meta-item .text{display:block;font-size:36px;line-height:40px;font-weight:bold}.meta-wrap.style-3 .meta-item:last-child .text{color:#2C089B}.button-wrap{text-align:right}.button-wrap a{display:inline-block;padding:15px 30px;color:#FFFFFF;background-color:#2C089B;cursor:pointer;text-transform:uppercase;font-size:12px;text-decoration:none}.icon{height:1rem;width:2rem;vertical-align:-0.125rem}';const B=class{constructor(c){e(this,c)}render(){return c("div",{class:"grid"},c("slot",null))}};B.style=":host{display:block}.grid{display:flex;flex-flow:row wrap;justify-content:space-between}";const T=class{constructor(c){e(this,c)}render(){return c("biggive-grid",null,[...Array(12)].map((()=>c("biggive-campaign-card",{banner:a("/assets/images/banner.png"),daysRemaining:50,currencyCode:"GBP",target:5e4,organisationName:"Ardent Theatre Company",campaignType:"Match Funded",campaignTitle:"Strike! A play by Tracy Ryan",categories:["Arts/Culture/Heritage","Environment/Conservation","Health/Wellbeing"],beneficiaries:["General Public/Humankind"],matchFundsRemaining:17424,totalFundsRaised:15424,callToActionUrl:"#",callToActionLabel:"Donate"}))))}};T.style=":host{display:block}";export{R as biggive_campaign_card,B as biggive_grid,T as demo_campaign_cards}
+ */class A{static getBeneficiaries(){return[{name:"Children (3-18)",icon:s},{name:"General Public/Humankind",icon:V},{name:"Infants (<2)",icon:n},{name:"LGBTQAI",icon:L},{name:"Minority Groups",icon:N},{name:"Older People",icon:M},{name:"People With Disabilities",icon:i},{name:"Refugees/Asylum Seekers",icon:l},{name:"Women & Girls",icon:S},{name:"Young People (18-30)",icon:w},{name:"Other",icon:b}]}static getCategories(){return[{name:"Animals",icon:z},{name:"Armed Forces/Emergency Services",icon:h},{name:"Arts/Culture/Heritage",icon:p},{name:"Cancer",icon:v},{name:"Community Support & Development",icon:x},{name:"Disaster Relief",icon:g},{name:"Education/Training/Employment",icon:t},{name:"Environment/Conservation",icon:y},{name:"Health/Wellbeing",icon:C},{name:"Homeless/Refuge",icon:F},{name:"Hospitals/Hospices",icon:m},{name:"Human Rights/Advocacy",icon:H},{name:"Information/Advice",icon:o},{name:"Medical Research",icon:f},{name:"Mental Health",icon:k},{name:"Poverty Alleviation/Relief",icon:d},{name:"Religious",icon:u},{name:"Sports/Recreation",icon:r},{name:"Other",icon:b}]}static getBeneficiaryIcon(e){return A.getBeneficiaries().filter((c=>c.name===e))[0].icon||b}static getCategoryIcon(e){var c;return(null===(c=A.getCategories().filter((c=>c.name===e))[0])||void 0===c?void 0:c.icon)||b}}const R=class{constructor(c){e(this,c),this.banner="",this.daysRemaining=null,this.target=null,this.organisationName=null,this.campaignTitle=null,this.campaignType=null,this.beneficiaries=[],this.categories=[],this.matchFundsRemaining=null,this.totalFundsRaised=null,this.callToActionUrl=null,this.callToActionLabel=null}getBeneficiaryIcons(){return this.beneficiaries.map((e=>A.getBeneficiaryIcon(e)))}getCategoryIcons(){return this.categories.map((e=>A.getCategoryIcon(e)))}formatCurrency(e,c){return null===c||isNaN(c)?"–":Intl.NumberFormat("en-GB",{style:"currency",currency:e,currencyDisplay:"symbol",maximumFractionDigits:0}).format(c)}render(){return c("div",{class:"container"},c("div",{class:"sleeve"},c("div",{class:"campaign-type"},c("span",null,this.campaignType)),this.banner.length>0?c("div",{class:"image-wrap banner",style:{"background-image":"url("+this.banner+")"}},c("img",{src:this.banner,class:"banner"})):null,c("div",{class:"content"},c("div",{class:"meta-wrap style-1"},c("div",{class:"meta-item"},c("span",{class:"label"},"Days Remaining:")," ",c("span",{class:"text"},this.daysRemaining)),c("div",{class:"meta-item"},c("span",{class:"label"},"Target:")," ",c("span",{class:"text"},this.formatCurrency(this.currencyCode,this.target)))),c("header",null,c("div",{class:"slug"},this.organisationName),c("h3",null,this.campaignTitle)),c("div",{class:"meta-wrap style-2"},c("div",{class:"meta-item"},c("span",{class:"label"},"Categories"),c("span",{class:"text"},this.getCategoryIcons().map((e=>c("svg",{width:"512",height:"512",xmlns:"http://www.w3.org/2000/svg",class:"icon",viewBox:"0 0 512 512"},c("path",{d:e.icon[4].toString()})))))),c("div",{class:"meta-item"},c("span",{class:"label"},"Helping"),c("span",{class:"text"},this.getBeneficiaryIcons().map((e=>c("svg",{width:"512",height:"512",xmlns:"http://www.w3.org/2000/svg",class:"icon",viewBox:"0 0 512 512"},c("path",{d:e.icon[4].toString()}))))))),c("div",{class:"meta-wrap style-3"},c("div",{class:"meta-item"},c("span",{class:"label"},"Match",c("br",null),"Funds Remaining"),c("span",{class:"text"},this.formatCurrency(this.currencyCode,this.matchFundsRemaining))),c("div",{class:"meta-item"},c("span",{class:"label"},"Total",c("br",null),"Funds Received"),c("span",{class:"text"},this.formatCurrency(this.currencyCode,this.totalFundsRaised)))),c("div",{class:"button-wrap"},c("a",{href:this.callToActionUrl,class:"call-to-action"},this.callToActionLabel)))))}};R.style=':host{display:block;margin-bottom:30px;flex-grow:1;margin:1rem}.container{font-family:"Euclid Triangle", sans-serif;filter:drop-shadow(-1px 6px 3px rgba(0, 0, 0, 0.25))}.sleeve{clip-path:polygon(0% 0%, 0% 0%, 100% 0%, 100% 0%, 100% 100%, 100% 100%, 10% 100%, 0 90%)}.content{padding:15px;background-color:#FFFFFF}.campaign-type{margin-left:15px;width:0;height:0;border-style:inset;border-width:85px 45px 0 45px;border-color:#2AF135 transparent transparent transparent;float:left;transform:rotate(360deg)}.campaign-type span{display:block;text-align:center;top:-85px;left:-25px;position:relative;width:45px;height:45px;margin:0;color:#2C089B;font-size:0.9rem}.banner{padding-bottom:30%;background-repeat:no-repeat;background-position:center center;background-size:cover}.banner img{display:none}.meta-wrap.style-1{display:flex;font-size:16px;line-height:20px;margin-bottom:20px}.meta-wrap.style-1 .meta-item{width:50%}.meta-wrap.style-1 .meta-item .label{font-weight:bold}.meta-wrap.style-1 .meta-item .text{color:#2C089B}header{margin-bottom:20px}header .slug{text-transform:uppercase;font-size:12px;line-height:14px}header h3{margin:0;padding:0;font-size:24px;line-height:28px}.meta-wrap.style-2{display:flex;font-size:12px;line-height:14px;margin-bottom:40px}.meta-wrap.style-2 .meta-item{width:50%}.meta-wrap.style-2 .meta-item .label{font-weight:bold;display:block;margin-bottom:10px}.meta-wrap.style-2 .meta-item .text{display:block;font-size:16px;line-height:18px}.meta-wrap.style-2 .meta-item .text i{margin-right:10px}.meta-wrap.style-3{display:flex;font-size:16px;line-height:20px;margin-bottom:20px}.meta-wrap.style-3 .meta-item{margin-right:60px}.meta-wrap.style-3 .meta-item .label{font-weight:bold;display:block;font-size:12px;line-height:14px;margin-bottom:10px}.meta-wrap.style-3 .meta-item .text{display:block;font-size:36px;line-height:40px;font-weight:bold}.meta-wrap.style-3 .meta-item:last-child .text{color:#2C089B}.button-wrap{text-align:right}.button-wrap a{display:inline-block;padding:15px 30px;color:#FFFFFF;background-color:#2C089B;cursor:pointer;text-transform:uppercase;font-size:12px;text-decoration:none}.icon{height:1rem;width:2rem;vertical-align:-0.125rem}';const B=class{constructor(c){e(this,c)}render(){return c("div",{class:"grid"},c("slot",null))}};B.style=":host{display:block}.grid{display:flex;flex-flow:row wrap;justify-content:space-between}";const T=class{constructor(c){e(this,c)}render(){return c("biggive-grid",null,[...Array(12)].map((()=>c("biggive-campaign-card",{banner:a("/assets/images/banner.png"),daysRemaining:50,currencyCode:"GBP",target:5e4,organisationName:"Ardent Theatre Company",campaignType:"Match Funded",campaignTitle:"Strike! A play by Tracy Ryan",categories:["Arts/Culture/Heritage","Environment/Conservation","Health/Wellbeing"],beneficiaries:["General Public/Humankind"],matchFundsRemaining:17424,totalFundsRaised:15424,callToActionUrl:"#",callToActionLabel:"Donate"}))))}};T.style=":host{display:block}";export{R as biggive_campaign_card,B as biggive_grid,T as demo_campaign_cards}

package/dist/cjs/biggive-campaign-card_3.cjs.entry.js

@@ -2,7 +2,7 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-8692cc53.js');
+const index = require('./index-a275852e.js');
 
 /*!
  * Font Awesome Free 6.1.2 by @fontawesome - https://fontawesome.com
@@ -322,7 +322,7 @@ class CampaignGroupsService {
   }
 }
 
-const biggiveCampaignCardCss = ":host{display:block;margin-bottom:30px}.container{font-family:\"Euclid Triangle\", sans-serif;filter:drop-shadow(-1px 6px 3px rgba(0, 0, 0, 0.25))}.sleeve{clip-path:polygon(0% 0%, 0% 0%, 100% 0%, 100% 0%, 100% 100%, 100% 100%, 10% 100%, 0 90%)}.content{padding:15px;background-color:#FFFFFF}.campaign-type{margin-left:15px;width:0;height:0;border-style:inset;border-width:85px 45px 0 45px;border-color:#2AF135 transparent transparent transparent;float:left;transform:rotate(360deg)}.campaign-type span{display:block;text-align:center;top:-85px;left:-25px;position:relative;width:45px;height:45px;margin:0;color:#2C089B;font-size:0.9rem}.banner{padding-bottom:30%;background-repeat:no-repeat;background-position:center center;background-size:cover}.banner img{display:none}.meta-wrap.style-1{display:flex;font-size:16px;line-height:20px;margin-bottom:20px}.meta-wrap.style-1 .meta-item{width:50%}.meta-wrap.style-1 .meta-item .label{font-weight:bold}.meta-wrap.style-1 .meta-item .text{color:#2C089B}header{margin-bottom:20px}header .slug{text-transform:uppercase;font-size:12px;line-height:14px}header h3{margin:0;padding:0;font-size:24px;line-height:28px}.meta-wrap.style-2{display:flex;font-size:12px;line-height:14px;margin-bottom:40px}.meta-wrap.style-2 .meta-item{width:50%}.meta-wrap.style-2 .meta-item .label{font-weight:bold;display:block;margin-bottom:10px}.meta-wrap.style-2 .meta-item .text{display:block;font-size:16px;line-height:18px}.meta-wrap.style-2 .meta-item .text i{margin-right:10px}.meta-wrap.style-3{display:flex;font-size:16px;line-height:20px;margin-bottom:20px}.meta-wrap.style-3 .meta-item{margin-right:60px}.meta-wrap.style-3 .meta-item .label{font-weight:bold;display:block;font-size:12px;line-height:14px;margin-bottom:10px}.meta-wrap.style-3 .meta-item .text{display:block;font-size:36px;line-height:40px;font-weight:bold}.meta-wrap.style-3 .meta-item:last-child .text{color:#2C089B}.button-wrap{text-align:right}.button-wrap a{display:inline-block;padding:15px 30px;color:#FFFFFF;background-color:#2C089B;cursor:pointer;text-transform:uppercase;font-size:12px;text-decoration:none}.icon{height:1rem;width:2rem;vertical-align:-0.125rem}";
+const biggiveCampaignCardCss = ":host{display:block;margin-bottom:30px;flex-grow:1;margin:1rem}.container{font-family:\"Euclid Triangle\", sans-serif;filter:drop-shadow(-1px 6px 3px rgba(0, 0, 0, 0.25))}.sleeve{clip-path:polygon(0% 0%, 0% 0%, 100% 0%, 100% 0%, 100% 100%, 100% 100%, 10% 100%, 0 90%)}.content{padding:15px;background-color:#FFFFFF}.campaign-type{margin-left:15px;width:0;height:0;border-style:inset;border-width:85px 45px 0 45px;border-color:#2AF135 transparent transparent transparent;float:left;transform:rotate(360deg)}.campaign-type span{display:block;text-align:center;top:-85px;left:-25px;position:relative;width:45px;height:45px;margin:0;color:#2C089B;font-size:0.9rem}.banner{padding-bottom:30%;background-repeat:no-repeat;background-position:center center;background-size:cover}.banner img{display:none}.meta-wrap.style-1{display:flex;font-size:16px;line-height:20px;margin-bottom:20px}.meta-wrap.style-1 .meta-item{width:50%}.meta-wrap.style-1 .meta-item .label{font-weight:bold}.meta-wrap.style-1 .meta-item .text{color:#2C089B}header{margin-bottom:20px}header .slug{text-transform:uppercase;font-size:12px;line-height:14px}header h3{margin:0;padding:0;font-size:24px;line-height:28px}.meta-wrap.style-2{display:flex;font-size:12px;line-height:14px;margin-bottom:40px}.meta-wrap.style-2 .meta-item{width:50%}.meta-wrap.style-2 .meta-item .label{font-weight:bold;display:block;margin-bottom:10px}.meta-wrap.style-2 .meta-item .text{display:block;font-size:16px;line-height:18px}.meta-wrap.style-2 .meta-item .text i{margin-right:10px}.meta-wrap.style-3{display:flex;font-size:16px;line-height:20px;margin-bottom:20px}.meta-wrap.style-3 .meta-item{margin-right:60px}.meta-wrap.style-3 .meta-item .label{font-weight:bold;display:block;font-size:12px;line-height:14px;margin-bottom:10px}.meta-wrap.style-3 .meta-item .text{display:block;font-size:36px;line-height:40px;font-weight:bold}.meta-wrap.style-3 .meta-item:last-child .text{color:#2C089B}.button-wrap{text-align:right}.button-wrap a{display:inline-block;padding:15px 30px;color:#FFFFFF;background-color:#2C089B;cursor:pointer;text-transform:uppercase;font-size:12px;text-decoration:none}.icon{height:1rem;width:2rem;vertical-align:-0.125rem}";
 
 const BiggiveCampaignCard = class {
   constructor(hostRef) {

package/dist/cjs/biggive.cjs.js

@@ -1,9 +1,9 @@
 'use strict';
 
-const index = require('./index-8692cc53.js');
+const index = require('./index-a275852e.js');
 
 /*
- Stencil Client Patch Browser v2.17.1 | MIT Licensed | https://stenciljs.com
+ Stencil Client Patch Browser v2.17.3 | MIT Licensed | https://stenciljs.com
  */
 const patchBrowser = () => {
     const importMeta = (typeof document === 'undefined' ? new (require('u' + 'rl').URL)('file:' + __filename).href : (document.currentScript && document.currentScript.src || new URL('biggive.cjs.js', document.baseURI).href));

package/dist/cjs/{index-8692cc53.js → index-a275852e.js}

@@ -37,6 +37,7 @@ const plt = {
     rel: (el, eventName, listener, opts) => el.removeEventListener(eventName, listener, opts),
     ce: (eventName, opts) => new CustomEvent(eventName, opts),
 };
+const supportsShadow = true;
 const promiseResolve = (v) => Promise.resolve(v);
 const supportsConstructableStylesheets = /*@__PURE__*/ (() => {
         try {
@@ -47,6 +48,13 @@ const supportsConstructableStylesheets = /*@__PURE__*/ (() => {
         return false;
     })()
     ;
+const CONTENT_REF_ID = 'r';
+const ORG_LOCATION_ID = 'o';
+const SLOT_NODE_ID = 's';
+const TEXT_NODE_ID = 't';
+const HYDRATE_ID = 's-id';
+const HYDRATED_STYLE_ID = 'sty-id';
+const HYDRATE_CHILD_ID = 'c-id';
 const HYDRATED_CSS = '{visibility:hidden}.hydrated{visibility:inherit}';
 const createTime = (fnName, tagName = '') => {
     {
@@ -94,7 +102,12 @@ const addStyle = (styleContainerNode, cmpMeta, mode, hostElm) => {
                 rootAppliedStyles.set(styleContainerNode, (appliedStyles = new Set()));
             }
             if (!appliedStyles.has(scopeId)) {
-                {
+                if (styleContainerNode.host &&
+                    (styleElm = styleContainerNode.querySelector(`[${HYDRATED_STYLE_ID}="${scopeId}"]`))) {
+                    // This is only happening on native shadow-dom, do not needs CSS var shim
+                    styleElm.innerHTML = style;
+                }
+                else {
                     {
                         styleElm = doc.createElement('style');
                         styleElm.innerHTML = style;
@@ -132,6 +145,7 @@ const attachStyles = (hostRef) => {
     endAttachStyles();
 };
 const getScopeId = (cmp, mode) => 'sc-' + (cmp.$tagName$);
+const convertScopedToShadow = (css) => css.replace(/\/\*!@([^\/]+)\*\/[^\{]+\{/g, '$1{');
 /**
  * Default style mode id
  */
@@ -697,6 +711,207 @@ const then = (promise, thenFn) => {
 };
 const addHydratedFlag = (elm) => elm.classList.add('hydrated')
     ;
+const initializeClientHydrate = (hostElm, tagName, hostId, hostRef) => {
+    const endHydrate = createTime('hydrateClient', tagName);
+    const shadowRoot = hostElm.shadowRoot;
+    const childRenderNodes = [];
+    const slotNodes = [];
+    const shadowRootNodes = shadowRoot ? [] : null;
+    const vnode = (hostRef.$vnode$ = newVNode(tagName, null));
+    if (!plt.$orgLocNodes$) {
+        initializeDocumentHydrate(doc.body, (plt.$orgLocNodes$ = new Map()));
+    }
+    hostElm[HYDRATE_ID] = hostId;
+    hostElm.removeAttribute(HYDRATE_ID);
+    clientHydrate(vnode, childRenderNodes, slotNodes, shadowRootNodes, hostElm, hostElm, hostId);
+    childRenderNodes.map((c) => {
+        const orgLocationId = c.$hostId$ + '.' + c.$nodeId$;
+        const orgLocationNode = plt.$orgLocNodes$.get(orgLocationId);
+        const node = c.$elm$;
+        if (orgLocationNode && supportsShadow && orgLocationNode['s-en'] === '') {
+            orgLocationNode.parentNode.insertBefore(node, orgLocationNode.nextSibling);
+        }
+        if (!shadowRoot) {
+            node['s-hn'] = tagName;
+            if (orgLocationNode) {
+                node['s-ol'] = orgLocationNode;
+                node['s-ol']['s-nr'] = node;
+            }
+        }
+        plt.$orgLocNodes$.delete(orgLocationId);
+    });
+    if (shadowRoot) {
+        shadowRootNodes.map((shadowRootNode) => {
+            if (shadowRootNode) {
+                shadowRoot.appendChild(shadowRootNode);
+            }
+        });
+    }
+    endHydrate();
+};
+const clientHydrate = (parentVNode, childRenderNodes, slotNodes, shadowRootNodes, hostElm, node, hostId) => {
+    let childNodeType;
+    let childIdSplt;
+    let childVNode;
+    let i;
+    if (node.nodeType === 1 /* ElementNode */) {
+        childNodeType = node.getAttribute(HYDRATE_CHILD_ID);
+        if (childNodeType) {
+            // got the node data from the element's attribute
+            // `${hostId}.${nodeId}.${depth}.${index}`
+            childIdSplt = childNodeType.split('.');
+            if (childIdSplt[0] === hostId || childIdSplt[0] === '0') {
+                childVNode = {
+                    $flags$: 0,
+                    $hostId$: childIdSplt[0],
+                    $nodeId$: childIdSplt[1],
+                    $depth$: childIdSplt[2],
+                    $index$: childIdSplt[3],
+                    $tag$: node.tagName.toLowerCase(),
+                    $elm$: node,
+                    $attrs$: null,
+                    $children$: null,
+                    $key$: null,
+                    $name$: null,
+                    $text$: null,
+                };
+                childRenderNodes.push(childVNode);
+                node.removeAttribute(HYDRATE_CHILD_ID);
+                // this is a new child vnode
+                // so ensure its parent vnode has the vchildren array
+                if (!parentVNode.$children$) {
+                    parentVNode.$children$ = [];
+                }
+                // add our child vnode to a specific index of the vnode's children
+                parentVNode.$children$[childVNode.$index$] = childVNode;
+                // this is now the new parent vnode for all the next child checks
+                parentVNode = childVNode;
+                if (shadowRootNodes && childVNode.$depth$ === '0') {
+                    shadowRootNodes[childVNode.$index$] = childVNode.$elm$;
+                }
+            }
+        }
+        // recursively drill down, end to start so we can remove nodes
+        for (i = node.childNodes.length - 1; i >= 0; i--) {
+            clientHydrate(parentVNode, childRenderNodes, slotNodes, shadowRootNodes, hostElm, node.childNodes[i], hostId);
+        }
+        if (node.shadowRoot) {
+            // keep drilling down through the shadow root nodes
+            for (i = node.shadowRoot.childNodes.length - 1; i >= 0; i--) {
+                clientHydrate(parentVNode, childRenderNodes, slotNodes, shadowRootNodes, hostElm, node.shadowRoot.childNodes[i], hostId);
+            }
+        }
+    }
+    else if (node.nodeType === 8 /* CommentNode */) {
+        // `${COMMENT_TYPE}.${hostId}.${nodeId}.${depth}.${index}`
+        childIdSplt = node.nodeValue.split('.');
+        if (childIdSplt[1] === hostId || childIdSplt[1] === '0') {
+            // comment node for either the host id or a 0 host id
+            childNodeType = childIdSplt[0];
+            childVNode = {
+                $flags$: 0,
+                $hostId$: childIdSplt[1],
+                $nodeId$: childIdSplt[2],
+                $depth$: childIdSplt[3],
+                $index$: childIdSplt[4],
+                $elm$: node,
+                $attrs$: null,
+                $children$: null,
+                $key$: null,
+                $name$: null,
+                $tag$: null,
+                $text$: null,
+            };
+            if (childNodeType === TEXT_NODE_ID) {
+                childVNode.$elm$ = node.nextSibling;
+                if (childVNode.$elm$ && childVNode.$elm$.nodeType === 3 /* TextNode */) {
+                    childVNode.$text$ = childVNode.$elm$.textContent;
+                    childRenderNodes.push(childVNode);
+                    // remove the text comment since it's no longer needed
+                    node.remove();
+                    if (!parentVNode.$children$) {
+                        parentVNode.$children$ = [];
+                    }
+                    parentVNode.$children$[childVNode.$index$] = childVNode;
+                    if (shadowRootNodes && childVNode.$depth$ === '0') {
+                        shadowRootNodes[childVNode.$index$] = childVNode.$elm$;
+                    }
+                }
+            }
+            else if (childVNode.$hostId$ === hostId) {
+                // this comment node is specifcally for this host id
+                if (childNodeType === SLOT_NODE_ID) {
+                    // `${SLOT_NODE_ID}.${hostId}.${nodeId}.${depth}.${index}.${slotName}`;
+                    childVNode.$tag$ = 'slot';
+                    if (childIdSplt[5]) {
+                        node['s-sn'] = childVNode.$name$ = childIdSplt[5];
+                    }
+                    else {
+                        node['s-sn'] = '';
+                    }
+                    node['s-sr'] = true;
+                    if (shadowRootNodes) {
+                        // browser support shadowRoot and this is a shadow dom component
+                        // create an actual slot element
+                        childVNode.$elm$ = doc.createElement(childVNode.$tag$);
+                        if (childVNode.$name$) {
+                            // add the slot name attribute
+                            childVNode.$elm$.setAttribute('name', childVNode.$name$);
+                        }
+                        // insert the new slot element before the slot comment
+                        node.parentNode.insertBefore(childVNode.$elm$, node);
+                        // remove the slot comment since it's not needed for shadow
+                        node.remove();
+                        if (childVNode.$depth$ === '0') {
+                            shadowRootNodes[childVNode.$index$] = childVNode.$elm$;
+                        }
+                    }
+                    slotNodes.push(childVNode);
+                    if (!parentVNode.$children$) {
+                        parentVNode.$children$ = [];
+                    }
+                    parentVNode.$children$[childVNode.$index$] = childVNode;
+                }
+                else if (childNodeType === CONTENT_REF_ID) {
+                    // `${CONTENT_REF_ID}.${hostId}`;
+                    if (shadowRootNodes) {
+                        // remove the content ref comment since it's not needed for shadow
+                        node.remove();
+                    }
+                }
+            }
+        }
+    }
+    else if (parentVNode && parentVNode.$tag$ === 'style') {
+        const vnode = newVNode(null, node.textContent);
+        vnode.$elm$ = node;
+        vnode.$index$ = '0';
+        parentVNode.$children$ = [vnode];
+    }
+};
+const initializeDocumentHydrate = (node, orgLocNodes) => {
+    if (node.nodeType === 1 /* ElementNode */) {
+        let i = 0;
+        for (; i < node.childNodes.length; i++) {
+            initializeDocumentHydrate(node.childNodes[i], orgLocNodes);
+        }
+        if (node.shadowRoot) {
+            for (i = 0; i < node.shadowRoot.childNodes.length; i++) {
+                initializeDocumentHydrate(node.shadowRoot.childNodes[i], orgLocNodes);
+            }
+        }
+    }
+    else if (node.nodeType === 8 /* CommentNode */) {
+        const childIdSplt = node.nodeValue.split('.');
+        if (childIdSplt[0] === ORG_LOCATION_ID) {
+            orgLocNodes.set(childIdSplt[1] + '.' + childIdSplt[2], node);
+            node.nodeValue = '';
+            // useful to know if the original location is
+            // the root light-dom of a shadow dom component
+            node['s-en'] = childIdSplt[3];
+        }
+    }
+};
 /**
  * Parse a new property value for a given property type.
  *
@@ -931,6 +1146,17 @@ const connectedCallback = (elm) => {
         if (!(hostRef.$flags$ & 1 /* hasConnected */)) {
             // first time this component has connected
             hostRef.$flags$ |= 1 /* hasConnected */;
+            let hostId;
+            {
+                hostId = elm.getAttribute(HYDRATE_ID);
+                if (hostId) {
+                    if (cmpMeta.$flags$ & 1 /* shadowDomEncapsulation */) {
+                        const scopeId = addStyle(elm.shadowRoot, cmpMeta);
+                        elm.classList.remove(scopeId + '-h', scopeId + '-s');
+                    }
+                    initializeClientHydrate(elm, cmpMeta.$tagName$, hostId, hostRef);
+                }
+            }
             {
                 // find the first ancestor component (if there is one) and register
                 // this component as one of the actively loading child components for its ancestor
@@ -938,7 +1164,10 @@ const connectedCallback = (elm) => {
                 while ((ancestorComponent = ancestorComponent.parentNode || ancestorComponent.host)) {
                     // climb up the ancestors looking for the first
                     // component that hasn't finished its lifecycle update yet
-                    if (ancestorComponent['s-p']) {
+                    if ((ancestorComponent.nodeType === 1 /* ElementNode */ &&
+                        ancestorComponent.hasAttribute('s-id') &&
+                        ancestorComponent['s-p']) ||
+                        ancestorComponent['s-p']) {
                         // we found this components first ancestor component
                         // keep a reference to this component's ancestor component
                         attachToAncestor(hostRef, (hostRef.$ancestorComponent$ = ancestorComponent));
@@ -978,10 +1207,22 @@ const bootstrapLazy = (lazyBundles, options = {}) => {
     const metaCharset = /*@__PURE__*/ head.querySelector('meta[charset]');
     const visibilityStyle = /*@__PURE__*/ doc.createElement('style');
     const deferredConnectedCallbacks = [];
+    const styles = /*@__PURE__*/ doc.querySelectorAll(`[${HYDRATED_STYLE_ID}]`);
     let appLoadFallback;
     let isBootstrapping = true;
+    let i = 0;
     Object.assign(plt, options);
     plt.$resourcesUrl$ = new URL(options.resourcesUrl || './', doc.baseURI).href;
+    {
+        // If the app is already hydrated there is not point to disable the
+        // async queue. This will improve the first input delay
+        plt.$flags$ |= 2 /* appLoaded */;
+    }
+    {
+        for (; i < styles.length; i++) {
+            registerStyle(styles[i].getAttribute(HYDRATED_STYLE_ID), convertScopedToShadow(styles[i].innerHTML), true);
+        }
+    }
     lazyBundles.map((lazyBundle) => {
         lazyBundle[1].map((compactMeta) => {
             const cmpMeta = {

package/dist/cjs/loader.cjs.js

@@ -2,10 +2,10 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-8692cc53.js');
+const index = require('./index-a275852e.js');
 
 /*
- Stencil Client Patch Esm v2.17.1 | MIT Licensed | https://stenciljs.com
+ Stencil Client Patch Esm v2.17.3 | MIT Licensed | https://stenciljs.com
  */
 const patchEsm = () => {
     return index.promiseResolve();

package/dist/collection/collection-manifest.json

@@ -6,7 +6,7 @@
   ],
   "compiler": {
     "name": "@stencil/core",
-    "version": "2.17.1",
+    "version": "2.17.3",
     "typescriptVersion": "4.5.4"
   },
   "collections": [],

package/dist/collection/components/biggive-campaign-card/biggive-campaign-card.css

@@ -1,6 +1,8 @@
 :host {
   display: block;
   margin-bottom: 30px;
+  flex-grow: 1;
+  margin: 1rem;
 }
 
 .container {

package/dist/collection/components/biggive-campaign-card/biggive-campaign-card.js

@@ -1,8 +1,5 @@
 import { Component, Prop, h } from '@stencil/core';
 import { CampaignGroupsService } from '../../util/campaign-groups';
-/**
- * @todo Currency code for the campaign must be passed as a `@Prop`, not localised to the prospective donor.
- */
 export class BiggiveCampaignCard {
   constructor() {
     /**

package/dist/collection/components/demo-campaign-cards/demo-campaign-cards.stories.js

@@ -0,0 +1,5 @@
+export default {
+  title: 'Components/Demos',
+};
+const Template = () => `<demo-campaign-cards></demo-campaign-cards>`;
+export const DemoCampaignCards = Template.bind({});

package/dist/components/biggive-campaign-card2.js

@@ -318,7 +318,7 @@ class CampaignGroupsService {
   }
 }
 
-const biggiveCampaignCardCss = ":host{display:block;margin-bottom:30px}.container{font-family:\"Euclid Triangle\", sans-serif;filter:drop-shadow(-1px 6px 3px rgba(0, 0, 0, 0.25))}.sleeve{clip-path:polygon(0% 0%, 0% 0%, 100% 0%, 100% 0%, 100% 100%, 100% 100%, 10% 100%, 0 90%)}.content{padding:15px;background-color:#FFFFFF}.campaign-type{margin-left:15px;width:0;height:0;border-style:inset;border-width:85px 45px 0 45px;border-color:#2AF135 transparent transparent transparent;float:left;transform:rotate(360deg)}.campaign-type span{display:block;text-align:center;top:-85px;left:-25px;position:relative;width:45px;height:45px;margin:0;color:#2C089B;font-size:0.9rem}.banner{padding-bottom:30%;background-repeat:no-repeat;background-position:center center;background-size:cover}.banner img{display:none}.meta-wrap.style-1{display:flex;font-size:16px;line-height:20px;margin-bottom:20px}.meta-wrap.style-1 .meta-item{width:50%}.meta-wrap.style-1 .meta-item .label{font-weight:bold}.meta-wrap.style-1 .meta-item .text{color:#2C089B}header{margin-bottom:20px}header .slug{text-transform:uppercase;font-size:12px;line-height:14px}header h3{margin:0;padding:0;font-size:24px;line-height:28px}.meta-wrap.style-2{display:flex;font-size:12px;line-height:14px;margin-bottom:40px}.meta-wrap.style-2 .meta-item{width:50%}.meta-wrap.style-2 .meta-item .label{font-weight:bold;display:block;margin-bottom:10px}.meta-wrap.style-2 .meta-item .text{display:block;font-size:16px;line-height:18px}.meta-wrap.style-2 .meta-item .text i{margin-right:10px}.meta-wrap.style-3{display:flex;font-size:16px;line-height:20px;margin-bottom:20px}.meta-wrap.style-3 .meta-item{margin-right:60px}.meta-wrap.style-3 .meta-item .label{font-weight:bold;display:block;font-size:12px;line-height:14px;margin-bottom:10px}.meta-wrap.style-3 .meta-item .text{display:block;font-size:36px;line-height:40px;font-weight:bold}.meta-wrap.style-3 .meta-item:last-child .text{color:#2C089B}.button-wrap{text-align:right}.button-wrap a{display:inline-block;padding:15px 30px;color:#FFFFFF;background-color:#2C089B;cursor:pointer;text-transform:uppercase;font-size:12px;text-decoration:none}.icon{height:1rem;width:2rem;vertical-align:-0.125rem}";
+const biggiveCampaignCardCss = ":host{display:block;margin-bottom:30px;flex-grow:1;margin:1rem}.container{font-family:\"Euclid Triangle\", sans-serif;filter:drop-shadow(-1px 6px 3px rgba(0, 0, 0, 0.25))}.sleeve{clip-path:polygon(0% 0%, 0% 0%, 100% 0%, 100% 0%, 100% 100%, 100% 100%, 10% 100%, 0 90%)}.content{padding:15px;background-color:#FFFFFF}.campaign-type{margin-left:15px;width:0;height:0;border-style:inset;border-width:85px 45px 0 45px;border-color:#2AF135 transparent transparent transparent;float:left;transform:rotate(360deg)}.campaign-type span{display:block;text-align:center;top:-85px;left:-25px;position:relative;width:45px;height:45px;margin:0;color:#2C089B;font-size:0.9rem}.banner{padding-bottom:30%;background-repeat:no-repeat;background-position:center center;background-size:cover}.banner img{display:none}.meta-wrap.style-1{display:flex;font-size:16px;line-height:20px;margin-bottom:20px}.meta-wrap.style-1 .meta-item{width:50%}.meta-wrap.style-1 .meta-item .label{font-weight:bold}.meta-wrap.style-1 .meta-item .text{color:#2C089B}header{margin-bottom:20px}header .slug{text-transform:uppercase;font-size:12px;line-height:14px}header h3{margin:0;padding:0;font-size:24px;line-height:28px}.meta-wrap.style-2{display:flex;font-size:12px;line-height:14px;margin-bottom:40px}.meta-wrap.style-2 .meta-item{width:50%}.meta-wrap.style-2 .meta-item .label{font-weight:bold;display:block;margin-bottom:10px}.meta-wrap.style-2 .meta-item .text{display:block;font-size:16px;line-height:18px}.meta-wrap.style-2 .meta-item .text i{margin-right:10px}.meta-wrap.style-3{display:flex;font-size:16px;line-height:20px;margin-bottom:20px}.meta-wrap.style-3 .meta-item{margin-right:60px}.meta-wrap.style-3 .meta-item .label{font-weight:bold;display:block;font-size:12px;line-height:14px;margin-bottom:10px}.meta-wrap.style-3 .meta-item .text{display:block;font-size:36px;line-height:40px;font-weight:bold}.meta-wrap.style-3 .meta-item:last-child .text{color:#2C089B}.button-wrap{text-align:right}.button-wrap a{display:inline-block;padding:15px 30px;color:#FFFFFF;background-color:#2C089B;cursor:pointer;text-transform:uppercase;font-size:12px;text-decoration:none}.icon{height:1rem;width:2rem;vertical-align:-0.125rem}";
 
 const BiggiveCampaignCard = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
   constructor() {

package/dist/esm/biggive-campaign-card_3.entry.js

@@ -1,4 +1,4 @@
-import { r as registerInstance, h, g as getAssetPath } from './index-4c3bc0b8.js';
+import { r as registerInstance, h, g as getAssetPath } from './index-2280c7b8.js';
 
 /*!
  * Font Awesome Free 6.1.2 by @fontawesome - https://fontawesome.com
@@ -318,7 +318,7 @@ class CampaignGroupsService {
   }
 }
 
-const biggiveCampaignCardCss = ":host{display:block;margin-bottom:30px}.container{font-family:\"Euclid Triangle\", sans-serif;filter:drop-shadow(-1px 6px 3px rgba(0, 0, 0, 0.25))}.sleeve{clip-path:polygon(0% 0%, 0% 0%, 100% 0%, 100% 0%, 100% 100%, 100% 100%, 10% 100%, 0 90%)}.content{padding:15px;background-color:#FFFFFF}.campaign-type{margin-left:15px;width:0;height:0;border-style:inset;border-width:85px 45px 0 45px;border-color:#2AF135 transparent transparent transparent;float:left;transform:rotate(360deg)}.campaign-type span{display:block;text-align:center;top:-85px;left:-25px;position:relative;width:45px;height:45px;margin:0;color:#2C089B;font-size:0.9rem}.banner{padding-bottom:30%;background-repeat:no-repeat;background-position:center center;background-size:cover}.banner img{display:none}.meta-wrap.style-1{display:flex;font-size:16px;line-height:20px;margin-bottom:20px}.meta-wrap.style-1 .meta-item{width:50%}.meta-wrap.style-1 .meta-item .label{font-weight:bold}.meta-wrap.style-1 .meta-item .text{color:#2C089B}header{margin-bottom:20px}header .slug{text-transform:uppercase;font-size:12px;line-height:14px}header h3{margin:0;padding:0;font-size:24px;line-height:28px}.meta-wrap.style-2{display:flex;font-size:12px;line-height:14px;margin-bottom:40px}.meta-wrap.style-2 .meta-item{width:50%}.meta-wrap.style-2 .meta-item .label{font-weight:bold;display:block;margin-bottom:10px}.meta-wrap.style-2 .meta-item .text{display:block;font-size:16px;line-height:18px}.meta-wrap.style-2 .meta-item .text i{margin-right:10px}.meta-wrap.style-3{display:flex;font-size:16px;line-height:20px;margin-bottom:20px}.meta-wrap.style-3 .meta-item{margin-right:60px}.meta-wrap.style-3 .meta-item .label{font-weight:bold;display:block;font-size:12px;line-height:14px;margin-bottom:10px}.meta-wrap.style-3 .meta-item .text{display:block;font-size:36px;line-height:40px;font-weight:bold}.meta-wrap.style-3 .meta-item:last-child .text{color:#2C089B}.button-wrap{text-align:right}.button-wrap a{display:inline-block;padding:15px 30px;color:#FFFFFF;background-color:#2C089B;cursor:pointer;text-transform:uppercase;font-size:12px;text-decoration:none}.icon{height:1rem;width:2rem;vertical-align:-0.125rem}";
+const biggiveCampaignCardCss = ":host{display:block;margin-bottom:30px;flex-grow:1;margin:1rem}.container{font-family:\"Euclid Triangle\", sans-serif;filter:drop-shadow(-1px 6px 3px rgba(0, 0, 0, 0.25))}.sleeve{clip-path:polygon(0% 0%, 0% 0%, 100% 0%, 100% 0%, 100% 100%, 100% 100%, 10% 100%, 0 90%)}.content{padding:15px;background-color:#FFFFFF}.campaign-type{margin-left:15px;width:0;height:0;border-style:inset;border-width:85px 45px 0 45px;border-color:#2AF135 transparent transparent transparent;float:left;transform:rotate(360deg)}.campaign-type span{display:block;text-align:center;top:-85px;left:-25px;position:relative;width:45px;height:45px;margin:0;color:#2C089B;font-size:0.9rem}.banner{padding-bottom:30%;background-repeat:no-repeat;background-position:center center;background-size:cover}.banner img{display:none}.meta-wrap.style-1{display:flex;font-size:16px;line-height:20px;margin-bottom:20px}.meta-wrap.style-1 .meta-item{width:50%}.meta-wrap.style-1 .meta-item .label{font-weight:bold}.meta-wrap.style-1 .meta-item .text{color:#2C089B}header{margin-bottom:20px}header .slug{text-transform:uppercase;font-size:12px;line-height:14px}header h3{margin:0;padding:0;font-size:24px;line-height:28px}.meta-wrap.style-2{display:flex;font-size:12px;line-height:14px;margin-bottom:40px}.meta-wrap.style-2 .meta-item{width:50%}.meta-wrap.style-2 .meta-item .label{font-weight:bold;display:block;margin-bottom:10px}.meta-wrap.style-2 .meta-item .text{display:block;font-size:16px;line-height:18px}.meta-wrap.style-2 .meta-item .text i{margin-right:10px}.meta-wrap.style-3{display:flex;font-size:16px;line-height:20px;margin-bottom:20px}.meta-wrap.style-3 .meta-item{margin-right:60px}.meta-wrap.style-3 .meta-item .label{font-weight:bold;display:block;font-size:12px;line-height:14px;margin-bottom:10px}.meta-wrap.style-3 .meta-item .text{display:block;font-size:36px;line-height:40px;font-weight:bold}.meta-wrap.style-3 .meta-item:last-child .text{color:#2C089B}.button-wrap{text-align:right}.button-wrap a{display:inline-block;padding:15px 30px;color:#FFFFFF;background-color:#2C089B;cursor:pointer;text-transform:uppercase;font-size:12px;text-decoration:none}.icon{height:1rem;width:2rem;vertical-align:-0.125rem}";
 
 const BiggiveCampaignCard = class {
   constructor(hostRef) {

package/dist/esm/biggive.js

@@ -1,7 +1,7 @@
-import { p as promiseResolve, b as bootstrapLazy } from './index-4c3bc0b8.js';
+import { p as promiseResolve, b as bootstrapLazy } from './index-2280c7b8.js';
 
 /*
- Stencil Client Patch Browser v2.17.1 | MIT Licensed | https://stenciljs.com
+ Stencil Client Patch Browser v2.17.3 | MIT Licensed | https://stenciljs.com
  */
 const patchBrowser = () => {
     const importMeta = import.meta.url;