@nanoporetech-digital/components 5.10.0 → 5.11.1

package/dist/nano-components/{p-bb07c3d0.js → index-f626f476.js}

@@ -2,4 +2,4 @@
  * Web Components for Nanopore digital Web Apps
  */
 class t{constructor(){this.gestureId=0;this.requestedStart=new Map;this.disabledGestures=new Map;this.disabledScroll=new Set}createGesture(t){return new e(this,this.newID(),t.name,t.priority||0,!!t.disableScroll)}createBlocker(t={}){return new s(this,this.newID(),t.disable,!!t.disableScroll)}start(t,e,s){if(!this.canStart(t)){this.requestedStart.delete(e);return false}this.requestedStart.set(e,s);return true}capture(t,e,s){if(!this.start(t,e,s)){return false}const n=this.requestedStart;let i=-1e4;n.forEach((t=>{i=Math.max(i,t)}));if(i===s){this.capturedId=e;n.clear();const s=new CustomEvent("ionGestureCaptured",{detail:{gestureName:t}});document.dispatchEvent(s);return true}n.delete(e);return false}release(t){this.requestedStart.delete(t);if(this.capturedId===t){this.capturedId=undefined}}disableGesture(t,e){let s=this.disabledGestures.get(t);if(s===undefined){s=new Set;this.disabledGestures.set(t,s)}s.add(e)}enableGesture(t,e){const s=this.disabledGestures.get(t);if(s!==undefined){s.delete(e)}}disableScroll(t){this.disabledScroll.add(t);if(this.disabledScroll.size===1){document.body.classList.add(n)}}enableScroll(t){this.disabledScroll.delete(t);if(this.disabledScroll.size===0){document.body.classList.remove(n)}}canStart(t){if(this.capturedId!==undefined){return false}if(this.isDisabled(t)){return false}return true}isCaptured(){return this.capturedId!==undefined}isScrollDisabled(){return this.disabledScroll.size>0}isDisabled(t){const e=this.disabledGestures.get(t);if(e&&e.size>0){return true}return false}newID(){this.gestureId++;return this.gestureId}}class e{constructor(t,e,s,n,i){this.id=e;this.name=s;this.disableScroll=i;this.priority=n*1e6+e;this.ctrl=t}canStart(){if(!this.ctrl){return false}return this.ctrl.canStart(this.name)}start(){if(!this.ctrl){return false}return this.ctrl.start(this.name,this.id,this.priority)}capture(){if(!this.ctrl){return false}const t=this.ctrl.capture(this.name,this.id,this.priority);if(t&&this.disableScroll){this.ctrl.disableScroll(this.id)}return t}release(){if(this.ctrl){this.ctrl.release(this.id);if(this.disableScroll){this.ctrl.enableScroll(this.id)}}}destroy(){this.release();this.ctrl=undefined}}class s{constructor(t,e,s,n){this.id=e;this.disable=s;this.disableScroll=n;this.ctrl=t}block(){if(!this.ctrl){return}if(this.disable){for(const t of this.disable){this.ctrl.disableGesture(t,this.id)}}if(this.disableScroll){this.ctrl.disableScroll(this.id)}}unblock(){if(!this.ctrl){return}if(this.disable){for(const t of this.disable){this.ctrl.enableGesture(t,this.id)}}if(this.disableScroll){this.ctrl.enableScroll(this.id)}}destroy(){this.unblock();this.ctrl=undefined}}const n="backdrop-no-scroll";const i=new t;const r=(t,e,s,n)=>{const i=o(t)?{capture:!!n.capture,passive:!!n.passive}:!!n.capture;let r;let f;if(t["__zone_symbol__addEventListener"]){r="__zone_symbol__addEventListener";f="__zone_symbol__removeEventListener"}else{r="addEventListener";f="removeEventListener"}t[r](e,s,i);return()=>{t[f](e,s,i)}};const o=t=>{if(f===undefined){try{const e=Object.defineProperty({},"passive",{get:()=>{f=true}});t.addEventListener("optsTest",(()=>{}),e)}catch(t){f=false}}return!!f};let f;const c=2e3;const u=(t,e,s,n,i)=>{let o;let f;let u;let a;let h;let d;let m;let p=0;const b=n=>{p=Date.now()+c;if(!e(n)){return}if(!f&&s){f=r(t,"touchmove",s,i)}if(!u){u=r(t,"touchend",y,i)}if(!a){a=r(t,"touchcancel",y,i)}};const v=n=>{if(p>Date.now()){return}if(!e(n)){return}if(!d&&s){d=r(l(t),"mousemove",s,i)}if(!m){m=r(l(t),"mouseup",w,i)}};const y=t=>{_();if(n){n(t)}};const w=t=>{S();if(n){n(t)}};const _=()=>{if(f){f()}if(u){u()}if(a){a()}f=u=a=undefined};const S=()=>{if(d){d()}if(m){m()}d=m=undefined};const D=()=>{_();S()};const M=(e=true)=>{if(!e){if(o){o()}if(h){h()}o=h=undefined;D()}else{if(!o){o=r(t,"touchstart",b,i)}if(!h){h=r(t,"mousedown",v,i)}}};const g=()=>{M(false);n=s=e=undefined};return{enable:M,stop:D,destroy:g}};const l=t=>t instanceof Document?t:t.ownerDocument;const a=(t,e,s)=>{const n=s*(Math.PI/180);const i=t==="x";const r=Math.cos(n);const o=e*e;let f=0;let c=0;let u=false;let l=0;return{start(t,e){f=t;c=e;l=0;u=true},detect(t,e){if(!u){return false}const s=t-f;const n=e-c;const a=s*s+n*n;if(a<o){return false}const h=Math.sqrt(a);const d=(i?s:n)/h;if(d>r){l=1}else if(d<-r){l=-1}else{l=0}u=false;return true},isGesture(){return l!==0},getDirection(){return l}}};const h=t=>{let e=false;let s=false;let n=true;let r=false;const o=Object.assign({disableScroll:false,direction:"x",gesturePriority:0,passive:true,maxAngle:40,threshold:10},t);const f=o.canStart;const c=o.onWillStart;const l=o.onStart;const h=o.onEnd;const b=o.notCaptured;const v=o.onMove;const y=o.threshold;const w=o.passive;const _=o.blurOnStart;const S={type:"pan",startX:0,startY:0,startTime:0,currentX:0,currentY:0,velocityX:0,velocityY:0,deltaX:0,deltaY:0,currentTime:0,event:undefined,data:undefined};const D=a(o.direction,o.threshold,o.maxAngle);const M=i.createGesture({name:t.gestureName,priority:t.gesturePriority,disableScroll:t.disableScroll});const g=t=>{const e=p(t);if(s||!n){return false}m(t,S);S.startX=S.currentX;S.startY=S.currentY;S.startTime=S.currentTime=e;S.velocityX=S.velocityY=S.deltaX=S.deltaY=0;S.event=t;if(f&&f(S)===false){return false}M.release();if(!M.start()){return false}s=true;if(y===0){return k()}D.start(S.startX,S.startY);return true};const E=t=>{if(e){if(!r&&n){r=true;d(S,t);requestAnimationFrame(G)}return}d(S,t);if(D.detect(S.currentX,S.currentY)){if(!D.isGesture()||!k()){T()}}};const G=()=>{if(!e){return}r=false;if(v){v(S)}};const k=()=>{if(M&&!M.capture()){return false}e=true;n=false;S.startX=S.currentX;S.startY=S.currentY;S.startTime=S.currentTime;if(c){c(S).then(L)}else{L()}return true};const x=()=>{if(typeof document!=="undefined"){const t=document.activeElement;if(t!==null&&t.blur){t.blur()}}};const L=()=>{if(_){x()}if(l){l(S)}n=true};const X=()=>{e=false;s=false;r=false;n=true;M.release()};const Y=t=>{const s=e;const i=n;X();if(!i){return}d(S,t);if(s){if(h){h(S)}return}if(b){b(S)}};const C=u(o.el,g,E,Y,{capture:false,passive:w});const T=()=>{X();C.stop();if(b){b(S)}};return{enable(t=true){if(!t){if(e){Y(undefined)}X()}C.enable(t)},destroy(){M.destroy();C.destroy()}}};const d=(t,e)=>{if(!e){return}const s=t.currentX;const n=t.currentY;const i=t.currentTime;m(e,t);const r=t.currentX;const o=t.currentY;const f=t.currentTime=p(e);const c=f-i;if(c>0&&c<100){const e=(r-s)/c;const i=(o-n)/c;t.velocityX=e*.7+t.velocityX*.3;t.velocityY=i*.7+t.velocityY*.3}t.deltaX=r-t.startX;t.deltaY=o-t.startY;t.event=e};const m=(t,e)=>{let s=0;let n=0;if(t){const e=t.changedTouches;if(e&&e.length>0){const t=e[0];s=t.clientX;n=t.clientY}else if(t.pageX!==undefined){s=t.pageX;n=t.pageY}}e.currentX=s;e.currentY=n};const p=t=>t.timeStamp||Date.now();export{i as GESTURE_CONTROLLER,h as createGesture};
-//# sourceMappingURL=p-bb07c3d0.js.map
+//# sourceMappingURL=index-f626f476.js.map

package/dist/nano-components/index.esm.js

@@ -1,5 +1,5 @@
 /*!
  * Web Components for Nanopore digital Web Apps
  */
-export{d as nanoDebounce,t as nanoThrottle}from"./p-7bff5224.js";export{g as nanoGetTabElements}from"./p-f88fa15c.js";const n=(n,t=[])=>`${n}\n    ${t.length?t.map(((n,t)=>`<button data-btn="${t}" class="button ${n.classes}" slot="footer">${n.content}</button>`)).join(""):""}`;const o=(n,t=[])=>{if(t.length){Array.from(n.querySelectorAll('button[slot="footer"]')).map((n=>{const o=t.find(((t,o)=>n.dataset.btn===o.toString()));if(o&&o.handler){n.addEventListener("click",o.handler)}}))}};async function e(t,e="tr",c,a,i=[]){const r=Object.assign({color:"primary",duration:3e3,closable:true},a);c=c||"light/info-circle";const s=Object.assign(document.createElement("nano-alert"),Object.assign(Object.assign({},r),{open:false,innerHTML:`\n        <nano-icon name="${c}" slot="icon"></nano-icon>\n        ${n(t,i)}\n      `}));o(s,i);document.body.appendChild(s);return new Promise((n=>{requestAnimationFrame((async t=>{await s.toast(e);n(s)}))}))}function c(t,e=[],c,a="light/info-circle",i={}){const r=Object.assign({color:"primary",duration:Infinity,closable:false},i);a=a||"light/info-circle";const s=Object.assign(document.createElement("nano-alert"),Object.assign(Object.assign({},r),{open:false,innerHTML:`\n        ${a?`<nano-icon name="${a}" slot="icon"></nano-icon>`:""}\n        ${n(t,e)}\n      `}));o(s,e);document.body.appendChild(s);return new Promise((n=>{setTimeout((async t=>{await s.alert(c);n(s)}),100)}))}function a(n,t=[],o){const e=Object.assign({noUserDismiss:false,label:"Dialog"},o);const c=Object.assign(document.createElement("nano-dialog"),Object.assign(Object.assign({},e),{open:false,innerHTML:`\n      ${n}\n      ${t.length?t.map(((n,t)=>`<button data-btn="${t}" class="button ${n.classes}" slot="footer">${n.content}</button>`)).join(""):""}`}));if(t.length){Array.from(c.querySelectorAll('button[slot="footer"]')).map((n=>{const o=t.find(((t,o)=>n.dataset.btn===o.toString()));if(o&&o.handler){n.addEventListener("click",o.handler)}}))}document.body.appendChild(c);return c}const i=(n={})=>{if(typeof window==="undefined"){return}};export{i as initialize,a as nanoCreateDialog,c as nanoShowAlert,e as nanoShowToast};
+export{d as nanoDebounce,t as nanoThrottle}from"./throttle-ac4fcefa.js";export{g as nanoGetTabElements}from"./tabbable-26a66a22.js";const n=(n,t=[])=>`${n}\n    ${t.length?t.map(((n,t)=>`<button data-btn="${t}" class="button ${n.classes}" slot="footer">${n.content}</button>`)).join(""):""}`;const o=(n,t=[])=>{if(t.length){Array.from(n.querySelectorAll('button[slot="footer"]')).map((n=>{const o=t.find(((t,o)=>n.dataset.btn===o.toString()));if(o&&o.handler){n.addEventListener("click",o.handler)}}))}};async function e(t,e="tr",c,a,i=[]){const r=Object.assign({color:"primary",duration:3e3,closable:true},a);c=c||"light/info-circle";const s=Object.assign(document.createElement("nano-alert"),Object.assign(Object.assign({},r),{open:false,innerHTML:`\n        <nano-icon name="${c}" slot="icon"></nano-icon>\n        ${n(t,i)}\n      `}));o(s,i);document.body.appendChild(s);return new Promise((n=>{requestAnimationFrame((async t=>{await s.toast(e);n(s)}))}))}function c(t,e=[],c,a="light/info-circle",i={}){const r=Object.assign({color:"primary",duration:Infinity,closable:false},i);a=a||"light/info-circle";const s=Object.assign(document.createElement("nano-alert"),Object.assign(Object.assign({},r),{open:false,innerHTML:`\n        ${a?`<nano-icon name="${a}" slot="icon"></nano-icon>`:""}\n        ${n(t,e)}\n      `}));o(s,e);document.body.appendChild(s);return new Promise((n=>{setTimeout((async t=>{await s.alert(c);n(s)}),100)}))}function a(n,t=[],o){const e=Object.assign({noUserDismiss:false,label:"Dialog"},o);const c=Object.assign(document.createElement("nano-dialog"),Object.assign(Object.assign({},e),{open:false,innerHTML:`\n      ${n}\n      ${t.length?t.map(((n,t)=>`<button data-btn="${t}" class="button ${n.classes}" slot="footer">${n.content}</button>`)).join(""):""}`}));if(t.length){Array.from(c.querySelectorAll('button[slot="footer"]')).map((n=>{const o=t.find(((t,o)=>n.dataset.btn===o.toString()));if(o&&o.handler){n.addEventListener("click",o.handler)}}))}document.body.appendChild(c);return c}const i=(n={})=>{if(typeof window==="undefined"){return}};export{i as initialize,a as nanoCreateDialog,c as nanoShowAlert,e as nanoShowToast};
 //# sourceMappingURL=index.esm.js.map

package/dist/nano-components/index.esm.js.map

@@ -1 +1 @@
-{"version":3,"names":["alertContent","message","buttons","length","map","btn","i","classes","content","join","addBtnHandlers","alert","Array","from","querySelectorAll","foundBtn","find","_fb","dataset","toString","handler","addEventListener","async","nanoShowToast","position","icon","alertOptions","opts","Object","assign","color","duration","closable","document","createElement","open","innerHTML","body","appendChild","Promise","resolve","requestAnimationFrame","_","toast","nanoShowAlert","label","Infinity","setTimeout","nanoCreateDialog","dialogOptions","noUserDismiss","dialog","initialize","helpers","window"],"sources":["./src/components/alert/alert.helpers.ts","./src/components/dialog/dialog.helpers.ts","./src/index.ts"],"sourcesContent":["import type { Color, AlertToastPosition } from '../../interface';\n\ninterface ImperativeAlertOptions {\n  color?: Color;\n  duration?: number;\n  closable?: boolean;\n}\n\ninterface ImperativeAlertButton {\n  classes: string;\n  content: string;\n  handler?: (e: MouseEvent) => void;\n}\n\nconst alertContent = (\n  message: string,\n  buttons: ImperativeAlertButton[] = []\n) => {\n  return `${message}\n    ${\n      buttons.length\n        ? buttons\n            .map(\n              (btn, i) =>\n                `<button data-btn=\"${i}\" class=\"button ${btn.classes}\" slot=\"footer\">${btn.content}</button>`\n            )\n            .join('')\n        : ''\n    }`;\n};\n\nconst addBtnHandlers = (\n  alert: HTMLNanoAlertElement,\n  buttons: ImperativeAlertButton[] = []\n) => {\n  if (buttons.length) {\n    Array.from(alert.querySelectorAll('button[slot=\"footer\"]')).map(\n      (btn: HTMLElement) => {\n        const foundBtn = buttons.find(\n          (_fb, i) => btn.dataset.btn === i.toString()\n        );\n        if (foundBtn && foundBtn.handler) {\n          btn.addEventListener('click', foundBtn.handler);\n        }\n      }\n    );\n  }\n};\n\n/**\n * `nano-alert` helper to create toast notifications imperatively.\n * @param message - a JS template string e.g. `<h4>Hello</h4> ${aVariable}`\n * @param position - the position of the toast. Options are 'tr', 'tl', 'bl' & 'br'\n * @param icon - name for the `nano-icon`\n * @param alertOptions - { color: Color, duration: number, closable: boolean }\n * @returns `Promise<void>`\n */\nexport async function nanoShowToast(\n  message: string,\n  position: AlertToastPosition = 'tr',\n  icon?: string | undefined,\n  alertOptions?: ImperativeAlertOptions,\n  buttons: ImperativeAlertButton[] = []\n) {\n  const opts: ImperativeAlertOptions = {\n    color: 'primary',\n    duration: 3000,\n    closable: true,\n    ...alertOptions,\n  };\n  icon = icon || 'light/info-circle';\n  const alert: HTMLNanoAlertElement = Object.assign(\n    document.createElement('nano-alert'),\n    {\n      ...opts,\n      open: false,\n      innerHTML: `\n        <nano-icon name=\"${icon}\" slot=\"icon\"></nano-icon>\n        ${alertContent(message, buttons)}\n      `,\n    }\n  );\n  addBtnHandlers(alert, buttons);\n\n  document.body.appendChild(alert);\n  return new Promise<HTMLNanoAlertElement>((resolve) => {\n    requestAnimationFrame(async (_) => {\n      await alert.toast(position);\n      resolve(alert);\n    });\n  });\n}\n\n/**\n * `nano-alert` helper to create alert notifications imperatively.\n * @param message - a JS template string e.g. `<h4>Hello</h4> ${aVariable}`\n * @param buttons\n * @param label - descriptive label for assitive technology\n * @param icon - name for the `nano-icon`\n * @param alertOptions\n * @returns `Promise<void>`\n */\nexport function nanoShowAlert(\n  message: string,\n  buttons: ImperativeAlertButton[] = [],\n  label: string,\n  icon: string | undefined = 'light/info-circle',\n  alertOptions: ImperativeAlertOptions = {}\n) {\n  const opts: ImperativeAlertOptions = {\n    color: 'primary',\n    duration: Infinity,\n    closable: false,\n    ...alertOptions,\n  };\n  icon = icon || 'light/info-circle';\n  const alert: HTMLNanoAlertElement = Object.assign(\n    document.createElement('nano-alert'),\n    {\n      ...opts,\n      open: false,\n      innerHTML: `\n        ${icon ? `<nano-icon name=\"${icon}\" slot=\"icon\"></nano-icon>` : ''}\n        ${alertContent(message, buttons)}\n      `,\n    }\n  );\n  addBtnHandlers(alert, buttons);\n\n  document.body.appendChild(alert);\n  return new Promise<HTMLNanoAlertElement>((resolve) => {\n    setTimeout(async (_) => {\n      await alert.alert(label);\n      resolve(alert);\n    }, 100);\n  });\n}\n","interface ImperativeDialogOptions {\n  noUserDismiss: boolean;\n  noHeader?: boolean;\n  noFooter?: boolean;\n  label: string;\n}\n/**\n * `nano-dialog` helper to create dialog modals imperatively.\n * @param body - a JS template string e.g. `<h4>Hello</h4> ${aVariable}`\n * @param buttons - { classes: string; content: string; handler: () => {} }[]\n * @param dialogOptions - { noUserDismiss: boolean, noHeader?: boolean, noFooter?: boolean, label: string }\n * @returns `Promise<void>`\n */\nexport function nanoCreateDialog(\n  body: string,\n  buttons: { classes: string; content: string; handler: () => void }[] = [],\n  dialogOptions?: ImperativeDialogOptions\n) {\n  const opts: ImperativeDialogOptions = {\n    noUserDismiss: false,\n    label: 'Dialog',\n    ...dialogOptions,\n  };\n  const dialog: HTMLNanoDialogElement = Object.assign(\n    document.createElement('nano-dialog'),\n    {\n      ...opts,\n      open: false,\n      innerHTML: `\n      ${body}\n      ${\n        buttons.length\n          ? buttons\n              .map(\n                (btn, i) =>\n                  `<button data-btn=\"${i}\" class=\"button ${btn.classes}\" slot=\"footer\">${btn.content}</button>`\n              )\n              .join('')\n          : ''\n      }`,\n    }\n  );\n\n  if (buttons.length) {\n    Array.from(dialog.querySelectorAll('button[slot=\"footer\"]')).map(\n      (btn: HTMLElement) => {\n        const foundBtn = buttons.find(\n          (_fb, i) => btn.dataset.btn === i.toString()\n        );\n        if (foundBtn && foundBtn.handler) {\n          btn.addEventListener('click', foundBtn.handler);\n        }\n      }\n    );\n  }\n\n  document.body.appendChild(dialog);\n  return dialog;\n}\n","// import { setPlatformHelpers } from '@stencil/core';\nexport * from './components/alert/alert.helpers';\nexport * from './components/dialog/dialog.helpers';\nexport {\n  debounce as nanoDebounce,\n  throttle as nanoThrottle,\n} from './utils/throttle';\nexport { getTabbableElements as nanoGetTabElements } from './utils/tabbable';\n\nexport const initialize = (\n  helpers: { _ael?: any; _ce?: any; _rel?: any } = {}\n) => {\n  if (typeof (window as any) === 'undefined') {\n    return;\n  }\n\n  const platformHelpers: any = {};\n  if (helpers._ael) {\n    platformHelpers.ael = helpers._ael;\n  }\n  if (helpers._rel) {\n    platformHelpers.rel = helpers._rel;\n  }\n  if (helpers._ce) {\n    platformHelpers.ce = helpers._ce;\n  }\n  // setPlatformHelpers(platformHelpers);\n};\n"],"mappings":";;;sHAcA,MAAMA,EAAe,CACnBC,EACAC,EAAmC,KAE5B,GAAGD,UAENC,EAAQC,OACJD,EACGE,KACC,CAACC,EAAKC,IACJ,qBAAqBA,oBAAoBD,EAAIE,0BAA0BF,EAAIG,qBAE9EC,KAAK,IACR,KAIV,MAAMC,EAAiB,CACrBC,EACAT,EAAmC,MAEnC,GAAIA,EAAQC,OAAQ,CAClBS,MAAMC,KAAKF,EAAMG,iBAAiB,0BAA0BV,KACzDC,IACC,MAAMU,EAAWb,EAAQc,MACvB,CAACC,EAAKX,IAAMD,EAAIa,QAAQb,MAAQC,EAAEa,aAEpC,GAAIJ,GAAYA,EAASK,QAAS,CAChCf,EAAIgB,iBAAiB,QAASN,EAASK,Q,OAe1CE,eAAeC,EACpBtB,EACAuB,EAA+B,KAC/BC,EACAC,EACAxB,EAAmC,IAEnC,MAAMyB,EAAIC,OAAAC,OAAA,CACRC,MAAO,UACPC,SAAU,IACVC,SAAU,MACPN,GAELD,EAAOA,GAAQ,oBACf,MAAMd,EAA8BiB,OAAOC,OACzCI,SAASC,cAAc,cAAaN,OAAAC,OAAAD,OAAAC,OAAA,GAE/BF,GAAI,CACPQ,KAAM,MACNC,UAAW,8BACUX,wCACjBzB,EAAaC,EAASC,gBAI9BQ,EAAeC,EAAOT,GAEtB+B,SAASI,KAAKC,YAAY3B,GAC1B,OAAO,IAAI4B,SAA+BC,IACxCC,uBAAsBnB,MAAOoB,UACrB/B,EAAMgC,MAAMnB,GAClBgB,EAAQ7B,EAAM,GACd,GAEN,C,SAWgBiC,EACd3C,EACAC,EAAmC,GACnC2C,EACApB,EAA2B,oBAC3BC,EAAuC,IAEvC,MAAMC,EAAIC,OAAAC,OAAA,CACRC,MAAO,UACPC,SAAUe,SACVd,SAAU,OACPN,GAELD,EAAOA,GAAQ,oBACf,MAAMd,EAA8BiB,OAAOC,OACzCI,SAASC,cAAc,cAAaN,OAAAC,OAAAD,OAAAC,OAAA,GAE/BF,GAAI,CACPQ,KAAM,MACNC,UAAW,aACPX,EAAO,oBAAoBA,8BAAmC,eAC9DzB,EAAaC,EAASC,gBAI9BQ,EAAeC,EAAOT,GAEtB+B,SAASI,KAAKC,YAAY3B,GAC1B,OAAO,IAAI4B,SAA+BC,IACxCO,YAAWzB,MAAOoB,UACV/B,EAAMA,MAAMkC,GAClBL,EAAQ7B,EAAM,GACb,IAAI,GAEX,C,SC3HgBqC,EACdX,EACAnC,EAAuE,GACvE+C,GAEA,MAAMtB,EAAIC,OAAAC,OAAA,CACRqB,cAAe,MACfL,MAAO,UACJI,GAEL,MAAME,EAAgCvB,OAAOC,OAC3CI,SAASC,cAAc,eAAcN,OAAAC,OAAAD,OAAAC,OAAA,GAEhCF,GAAI,CACPQ,KAAM,MACNC,UAAW,WACTC,YAEAnC,EAAQC,OACJD,EACGE,KACC,CAACC,EAAKC,IACJ,qBAAqBA,oBAAoBD,EAAIE,0BAA0BF,EAAIG,qBAE9EC,KAAK,IACR,QAKV,GAAIP,EAAQC,OAAQ,CAClBS,MAAMC,KAAKsC,EAAOrC,iBAAiB,0BAA0BV,KAC1DC,IACC,MAAMU,EAAWb,EAAQc,MACvB,CAACC,EAAKX,IAAMD,EAAIa,QAAQb,MAAQC,EAAEa,aAEpC,GAAIJ,GAAYA,EAASK,QAAS,CAChCf,EAAIgB,iBAAiB,QAASN,EAASK,Q,KAM/Ca,SAASI,KAAKC,YAAYa,GAC1B,OAAOA,CACT,C,MCjDaC,EAAa,CACxBC,EAAiD,MAEjD,UAAYC,SAAmB,YAAa,CAC1C,M"}
+{"version":3,"names":["alertContent","message","buttons","length","map","btn","i","classes","content","join","addBtnHandlers","alert","Array","from","querySelectorAll","foundBtn","find","_fb","dataset","toString","handler","addEventListener","async","nanoShowToast","position","icon","alertOptions","opts","Object","assign","color","duration","closable","document","createElement","open","innerHTML","body","appendChild","Promise","resolve","requestAnimationFrame","_","toast","nanoShowAlert","label","Infinity","setTimeout","nanoCreateDialog","dialogOptions","noUserDismiss","dialog","initialize","helpers","window"],"sources":["./src/components/alert/alert.helpers.ts","./src/components/dialog/dialog.helpers.ts","./src/index.ts"],"sourcesContent":["import type { Color, AlertToastPosition } from '../../interface';\n\ninterface ImperativeAlertOptions {\n  color?: Color;\n  duration?: number;\n  closable?: boolean;\n}\n\ninterface ImperativeAlertButton {\n  classes: string;\n  content: string;\n  handler?: (e: MouseEvent) => void;\n}\n\nconst alertContent = (\n  message: string,\n  buttons: ImperativeAlertButton[] = []\n) => {\n  return `${message}\n    ${\n      buttons.length\n        ? buttons\n            .map(\n              (btn, i) =>\n                `<button data-btn=\"${i}\" class=\"button ${btn.classes}\" slot=\"footer\">${btn.content}</button>`\n            )\n            .join('')\n        : ''\n    }`;\n};\n\nconst addBtnHandlers = (\n  alert: HTMLNanoAlertElement,\n  buttons: ImperativeAlertButton[] = []\n) => {\n  if (buttons.length) {\n    Array.from(alert.querySelectorAll('button[slot=\"footer\"]')).map(\n      (btn: HTMLElement) => {\n        const foundBtn = buttons.find(\n          (_fb, i) => btn.dataset.btn === i.toString()\n        );\n        if (foundBtn && foundBtn.handler) {\n          btn.addEventListener('click', foundBtn.handler);\n        }\n      }\n    );\n  }\n};\n\n/**\n * `nano-alert` helper to create toast notifications imperatively.\n * @param message - a JS template string e.g. `<h4>Hello</h4> ${aVariable}`\n * @param position - the position of the toast. Options are 'tr', 'tl', 'bl' & 'br'\n * @param icon - name for the `nano-icon`\n * @param alertOptions - { color: Color, duration: number, closable: boolean }\n * @returns `Promise<void>`\n */\nexport async function nanoShowToast(\n  message: string,\n  position: AlertToastPosition = 'tr',\n  icon?: string | undefined,\n  alertOptions?: ImperativeAlertOptions,\n  buttons: ImperativeAlertButton[] = []\n) {\n  const opts: ImperativeAlertOptions = {\n    color: 'primary',\n    duration: 3000,\n    closable: true,\n    ...alertOptions,\n  };\n  icon = icon || 'light/info-circle';\n  const alert: HTMLNanoAlertElement = Object.assign(\n    document.createElement('nano-alert'),\n    {\n      ...opts,\n      open: false,\n      innerHTML: `\n        <nano-icon name=\"${icon}\" slot=\"icon\"></nano-icon>\n        ${alertContent(message, buttons)}\n      `,\n    }\n  );\n  addBtnHandlers(alert, buttons);\n\n  document.body.appendChild(alert);\n  return new Promise<HTMLNanoAlertElement>((resolve) => {\n    requestAnimationFrame(async (_) => {\n      await alert.toast(position);\n      resolve(alert);\n    });\n  });\n}\n\n/**\n * `nano-alert` helper to create alert notifications imperatively.\n * @param message - a JS template string e.g. `<h4>Hello</h4> ${aVariable}`\n * @param buttons\n * @param label - descriptive label for assitive technology\n * @param icon - name for the `nano-icon`\n * @param alertOptions\n * @returns `Promise<void>`\n */\nexport function nanoShowAlert(\n  message: string,\n  buttons: ImperativeAlertButton[] = [],\n  label: string,\n  icon: string | undefined = 'light/info-circle',\n  alertOptions: ImperativeAlertOptions = {}\n) {\n  const opts: ImperativeAlertOptions = {\n    color: 'primary',\n    duration: Infinity,\n    closable: false,\n    ...alertOptions,\n  };\n  icon = icon || 'light/info-circle';\n  const alert: HTMLNanoAlertElement = Object.assign(\n    document.createElement('nano-alert'),\n    {\n      ...opts,\n      open: false,\n      innerHTML: `\n        ${icon ? `<nano-icon name=\"${icon}\" slot=\"icon\"></nano-icon>` : ''}\n        ${alertContent(message, buttons)}\n      `,\n    }\n  );\n  addBtnHandlers(alert, buttons);\n\n  document.body.appendChild(alert);\n  return new Promise<HTMLNanoAlertElement>((resolve) => {\n    setTimeout(async (_) => {\n      await alert.alert(label);\n      resolve(alert);\n    }, 100);\n  });\n}\n","interface ImperativeDialogOptions {\n  noUserDismiss: boolean;\n  noHeader?: boolean;\n  noFooter?: boolean;\n  label: string;\n}\n/**\n * `nano-dialog` helper to create dialog modals imperatively.\n * @param body - a JS template string e.g. `<h4>Hello</h4> ${aVariable}`\n * @param buttons - { classes: string; content: string; handler: () => {} }[]\n * @param dialogOptions - { noUserDismiss: boolean, noHeader?: boolean, noFooter?: boolean, label: string }\n * @returns `Promise<void>`\n */\nexport function nanoCreateDialog(\n  body: string,\n  buttons: { classes: string; content: string; handler: () => void }[] = [],\n  dialogOptions?: ImperativeDialogOptions\n) {\n  const opts: ImperativeDialogOptions = {\n    noUserDismiss: false,\n    label: 'Dialog',\n    ...dialogOptions,\n  };\n  const dialog: HTMLNanoDialogElement = Object.assign(\n    document.createElement('nano-dialog'),\n    {\n      ...opts,\n      open: false,\n      innerHTML: `\n      ${body}\n      ${\n        buttons.length\n          ? buttons\n              .map(\n                (btn, i) =>\n                  `<button data-btn=\"${i}\" class=\"button ${btn.classes}\" slot=\"footer\">${btn.content}</button>`\n              )\n              .join('')\n          : ''\n      }`,\n    }\n  );\n\n  if (buttons.length) {\n    Array.from(dialog.querySelectorAll('button[slot=\"footer\"]')).map(\n      (btn: HTMLElement) => {\n        const foundBtn = buttons.find(\n          (_fb, i) => btn.dataset.btn === i.toString()\n        );\n        if (foundBtn && foundBtn.handler) {\n          btn.addEventListener('click', foundBtn.handler);\n        }\n      }\n    );\n  }\n\n  document.body.appendChild(dialog);\n  return dialog;\n}\n","// import { setPlatformHelpers } from '@stencil/core';\nexport * from './components/alert/alert.helpers';\nexport * from './components/dialog/dialog.helpers';\nexport {\n  debounce as nanoDebounce,\n  throttle as nanoThrottle,\n} from './utils/throttle';\nexport { getTabbableElements as nanoGetTabElements } from './utils/tabbable';\n\nexport const initialize = (\n  helpers: { _ael?: any; _ce?: any; _rel?: any } = {}\n) => {\n  if (typeof (window as any) === 'undefined') {\n    return;\n  }\n\n  const platformHelpers: any = {};\n  if (helpers._ael) {\n    platformHelpers.ael = helpers._ael;\n  }\n  if (helpers._rel) {\n    platformHelpers.rel = helpers._rel;\n  }\n  if (helpers._ce) {\n    platformHelpers.ce = helpers._ce;\n  }\n  // setPlatformHelpers(platformHelpers);\n};\n"],"mappings":";;;oIAcA,MAAMA,EAAe,CACnBC,EACAC,EAAmC,KAE5B,GAAGD,UAENC,EAAQC,OACJD,EACGE,KACC,CAACC,EAAKC,IACJ,qBAAqBA,oBAAoBD,EAAIE,0BAA0BF,EAAIG,qBAE9EC,KAAK,IACR,KAIV,MAAMC,EAAiB,CACrBC,EACAT,EAAmC,MAEnC,GAAIA,EAAQC,OAAQ,CAClBS,MAAMC,KAAKF,EAAMG,iBAAiB,0BAA0BV,KACzDC,IACC,MAAMU,EAAWb,EAAQc,MACvB,CAACC,EAAKX,IAAMD,EAAIa,QAAQb,MAAQC,EAAEa,aAEpC,GAAIJ,GAAYA,EAASK,QAAS,CAChCf,EAAIgB,iBAAiB,QAASN,EAASK,Q,OAe1CE,eAAeC,EACpBtB,EACAuB,EAA+B,KAC/BC,EACAC,EACAxB,EAAmC,IAEnC,MAAMyB,EAAIC,OAAAC,OAAA,CACRC,MAAO,UACPC,SAAU,IACVC,SAAU,MACPN,GAELD,EAAOA,GAAQ,oBACf,MAAMd,EAA8BiB,OAAOC,OACzCI,SAASC,cAAc,cAAaN,OAAAC,OAAAD,OAAAC,OAAA,GAE/BF,GAAI,CACPQ,KAAM,MACNC,UAAW,8BACUX,wCACjBzB,EAAaC,EAASC,gBAI9BQ,EAAeC,EAAOT,GAEtB+B,SAASI,KAAKC,YAAY3B,GAC1B,OAAO,IAAI4B,SAA+BC,IACxCC,uBAAsBnB,MAAOoB,UACrB/B,EAAMgC,MAAMnB,GAClBgB,EAAQ7B,EAAM,GACd,GAEN,C,SAWgBiC,EACd3C,EACAC,EAAmC,GACnC2C,EACApB,EAA2B,oBAC3BC,EAAuC,IAEvC,MAAMC,EAAIC,OAAAC,OAAA,CACRC,MAAO,UACPC,SAAUe,SACVd,SAAU,OACPN,GAELD,EAAOA,GAAQ,oBACf,MAAMd,EAA8BiB,OAAOC,OACzCI,SAASC,cAAc,cAAaN,OAAAC,OAAAD,OAAAC,OAAA,GAE/BF,GAAI,CACPQ,KAAM,MACNC,UAAW,aACPX,EAAO,oBAAoBA,8BAAmC,eAC9DzB,EAAaC,EAASC,gBAI9BQ,EAAeC,EAAOT,GAEtB+B,SAASI,KAAKC,YAAY3B,GAC1B,OAAO,IAAI4B,SAA+BC,IACxCO,YAAWzB,MAAOoB,UACV/B,EAAMA,MAAMkC,GAClBL,EAAQ7B,EAAM,GACb,IAAI,GAEX,C,SC3HgBqC,EACdX,EACAnC,EAAuE,GACvE+C,GAEA,MAAMtB,EAAIC,OAAAC,OAAA,CACRqB,cAAe,MACfL,MAAO,UACJI,GAEL,MAAME,EAAgCvB,OAAOC,OAC3CI,SAASC,cAAc,eAAcN,OAAAC,OAAAD,OAAAC,OAAA,GAEhCF,GAAI,CACPQ,KAAM,MACNC,UAAW,WACTC,YAEAnC,EAAQC,OACJD,EACGE,KACC,CAACC,EAAKC,IACJ,qBAAqBA,oBAAoBD,EAAIE,0BAA0BF,EAAIG,qBAE9EC,KAAK,IACR,QAKV,GAAIP,EAAQC,OAAQ,CAClBS,MAAMC,KAAKsC,EAAOrC,iBAAiB,0BAA0BV,KAC1DC,IACC,MAAMU,EAAWb,EAAQc,MACvB,CAACC,EAAKX,IAAMD,EAAIa,QAAQb,MAAQC,EAAEa,aAEpC,GAAIJ,GAAYA,EAASK,QAAS,CAChCf,EAAIgB,iBAAiB,QAASN,EAASK,Q,KAM/Ca,SAASI,KAAKC,YAAYa,GAC1B,OAAOA,CACT,C,MCjDaC,EAAa,CACxBC,EAAiD,MAEjD,UAAYC,SAAmB,YAAa,CAC1C,M"}

package/dist/nano-components/lazyload-994232a6.js

@@ -0,0 +1,5 @@
+/*!
+ * Web Components for Nanopore digital Web Apps
+ */
+import{F as t,u as i}from"./nano-slides-9908c44d.js";import"./index-9695db0a.js";t.createMethods.push("_createLazyload");const s=t.prototype;s._createLazyload=function(){this.on("select",this.lazyLoad)};s.lazyLoad=function(){const t=this.options.lazyLoad;if(!t){return}const i=typeof t=="number"?t:0;const s=this.getAdjacentCellElements(i);let o=[];s.forEach((function(t){const i=a(t);o=o.concat(i)}));o.forEach((function(t){new c(t,this)}),this)};function a(t){if(t.nodeName=="IMG"){const i=t.getAttribute("data-flickity-lazyload");const s=t.getAttribute("data-flickity-lazyload-src");const a=t.getAttribute("data-flickity-lazyload-srcset");if(i||s||a){return[t]}}const s="img[data-flickity-lazyload], "+"img[data-flickity-lazyload-src], img[data-flickity-lazyload-srcset]";const a=t.querySelectorAll(s);return i.makeArray(a)}function c(t,i){this.img=t;this.flickity=i;this.load()}c.prototype.handleEvent=i.handleEvent;c.prototype.load=function(){this.img.addEventListener("load",this);this.img.addEventListener("error",this);const t=this.img.getAttribute("data-flickity-lazyload")||this.img.getAttribute("data-flickity-lazyload-src");const i=this.img.getAttribute("data-flickity-lazyload-srcset");this.img.src=t;if(i){this.img.setAttribute("srcset",i)}this.img.removeAttribute("data-flickity-lazyload");this.img.removeAttribute("data-flickity-lazyload-src");this.img.removeAttribute("data-flickity-lazyload-srcset")};c.prototype.onload=function(t){this.complete(t,"flickity-lazyloaded")};c.prototype.onerror=function(t){this.complete(t,"flickity-lazyerror")};c.prototype.complete=function(t,i){this.img.removeEventListener("load",this);this.img.removeEventListener("error",this);const s=this.flickity.getParentCell(this.img);const a=s&&s.element;this.flickity.cellSizeChange(a);this.img.classList.add(i);this.flickity.dispatchEvent("lazyLoad",t,a)};t.LazyLoader=c;
+//# sourceMappingURL=lazyload-994232a6.js.map

package/dist/nano-components/lazyload-994232a6.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["Flickity","createMethods","push","proto","prototype","_createLazyload","this","on","lazyLoad","options","adjCount","cellElems","getAdjacentCellElements","lazyImages","forEach","cellElem","lazyCellImages","getCellLazyImages","concat","img","LazyLoader","nodeName","lazyloadAttr","getAttribute","srcAttr","srcsetAttr","lazySelector","imgs","querySelectorAll","utils","makeArray","flickity","load","handleEvent","addEventListener","src","srcset","setAttribute","removeAttribute","onload","event","complete","onerror","className","removeEventListener","cell","getParentCell","element","cellSizeChange","classList","add","dispatchEvent"],"sources":["./src/components/slides/lib/js/lazyload.ts"],"sourcesContent":["import Flickity from './flickity';\nimport { utils } from './utils/utils';\n\nFlickity.createMethods.push('_createLazyload');\nconst proto = Flickity.prototype;\n\nproto._createLazyload = function () {\n  this.on('select', this.lazyLoad);\n};\n\nproto.lazyLoad = function () {\n  const lazyLoad = this.options.lazyLoad;\n  if (!lazyLoad) {\n    return;\n  }\n  // get adjacent cells, use lazyLoad option for adjacent count\n  const adjCount = typeof lazyLoad == 'number' ? lazyLoad : 0;\n  const cellElems = this.getAdjacentCellElements(adjCount);\n  // get lazy images in those cells\n  let lazyImages = [];\n  cellElems.forEach(function (cellElem) {\n    const lazyCellImages = getCellLazyImages(cellElem);\n    lazyImages = lazyImages.concat(lazyCellImages);\n  });\n  // load lazy images\n  lazyImages.forEach(function (img) {\n    new LazyLoader(img, this);\n  }, this);\n};\n\nfunction getCellLazyImages(cellElem) {\n  // check if cell element is lazy image\n  if (cellElem.nodeName == 'IMG') {\n    const lazyloadAttr = cellElem.getAttribute('data-flickity-lazyload');\n    const srcAttr = cellElem.getAttribute('data-flickity-lazyload-src');\n    const srcsetAttr = cellElem.getAttribute('data-flickity-lazyload-srcset');\n    if (lazyloadAttr || srcAttr || srcsetAttr) {\n      return [cellElem];\n    }\n  }\n  // select lazy images in cell\n  const lazySelector =\n    'img[data-flickity-lazyload], ' +\n    'img[data-flickity-lazyload-src], img[data-flickity-lazyload-srcset]';\n  const imgs = cellElem.querySelectorAll(lazySelector);\n  return utils.makeArray(imgs);\n}\n\n// -------------------------- LazyLoader -------------------------- //\n\n/**\n * class to handle loading images\n */\nfunction LazyLoader(img, flickity) {\n  this.img = img;\n  this.flickity = flickity;\n  this.load();\n}\n\nLazyLoader.prototype.handleEvent = utils.handleEvent;\n\nLazyLoader.prototype.load = function () {\n  this.img.addEventListener('load', this);\n  this.img.addEventListener('error', this);\n  // get src & srcset\n  const src =\n    this.img.getAttribute('data-flickity-lazyload') ||\n    this.img.getAttribute('data-flickity-lazyload-src');\n  const srcset = this.img.getAttribute('data-flickity-lazyload-srcset');\n  // set src & serset\n  this.img.src = src;\n  if (srcset) {\n    this.img.setAttribute('srcset', srcset);\n  }\n  // remove attr\n  this.img.removeAttribute('data-flickity-lazyload');\n  this.img.removeAttribute('data-flickity-lazyload-src');\n  this.img.removeAttribute('data-flickity-lazyload-srcset');\n};\n\nLazyLoader.prototype.onload = function (event) {\n  this.complete(event, 'flickity-lazyloaded');\n};\n\nLazyLoader.prototype.onerror = function (event) {\n  this.complete(event, 'flickity-lazyerror');\n};\n\nLazyLoader.prototype.complete = function (event, className) {\n  // unbind events\n  this.img.removeEventListener('load', this);\n  this.img.removeEventListener('error', this);\n\n  const cell = this.flickity.getParentCell(this.img);\n  const cellElem = cell && cell.element;\n  this.flickity.cellSizeChange(cellElem);\n\n  this.img.classList.add(className);\n  this.flickity.dispatchEvent('lazyLoad', event, cellElem);\n};\n\n// @ts-ignore\nFlickity.LazyLoader = LazyLoader;\n"],"mappings":";;;iFAGAA,EAASC,cAAcC,KAAK,mBAC5B,MAAMC,EAAQH,EAASI,UAEvBD,EAAME,gBAAkB,WACtBC,KAAKC,GAAG,SAAUD,KAAKE,SACzB,EAEAL,EAAMK,SAAW,WACf,MAAMA,EAAWF,KAAKG,QAAQD,SAC9B,IAAKA,EAAU,CACb,M,CAGF,MAAME,SAAkBF,GAAY,SAAWA,EAAW,EAC1D,MAAMG,EAAYL,KAAKM,wBAAwBF,GAE/C,IAAIG,EAAa,GACjBF,EAAUG,SAAQ,SAAUC,GAC1B,MAAMC,EAAiBC,EAAkBF,GACzCF,EAAaA,EAAWK,OAAOF,E,IAGjCH,EAAWC,SAAQ,SAAUK,GAC3B,IAAIC,EAAWD,EAAKb,K,GACnBA,KACL,EAEA,SAASW,EAAkBF,GAEzB,GAAIA,EAASM,UAAY,MAAO,CAC9B,MAAMC,EAAeP,EAASQ,aAAa,0BAC3C,MAAMC,EAAUT,EAASQ,aAAa,8BACtC,MAAME,EAAaV,EAASQ,aAAa,iCACzC,GAAID,GAAgBE,GAAWC,EAAY,CACzC,MAAO,CAACV,E,EAIZ,MAAMW,EACJ,gCACA,sEACF,MAAMC,EAAOZ,EAASa,iBAAiBF,GACvC,OAAOG,EAAMC,UAAUH,EACzB,CAOA,SAASP,EAAWD,EAAKY,GACvBzB,KAAKa,IAAMA,EACXb,KAAKyB,SAAWA,EAChBzB,KAAK0B,MACP,CAEAZ,EAAWhB,UAAU6B,YAAcJ,EAAMI,YAEzCb,EAAWhB,UAAU4B,KAAO,WAC1B1B,KAAKa,IAAIe,iBAAiB,OAAQ5B,MAClCA,KAAKa,IAAIe,iBAAiB,QAAS5B,MAEnC,MAAM6B,EACJ7B,KAAKa,IAAII,aAAa,2BACtBjB,KAAKa,IAAII,aAAa,8BACxB,MAAMa,EAAS9B,KAAKa,IAAII,aAAa,iCAErCjB,KAAKa,IAAIgB,IAAMA,EACf,GAAIC,EAAQ,CACV9B,KAAKa,IAAIkB,aAAa,SAAUD,E,CAGlC9B,KAAKa,IAAImB,gBAAgB,0BACzBhC,KAAKa,IAAImB,gBAAgB,8BACzBhC,KAAKa,IAAImB,gBAAgB,gCAC3B,EAEAlB,EAAWhB,UAAUmC,OAAS,SAAUC,GACtClC,KAAKmC,SAASD,EAAO,sBACvB,EAEApB,EAAWhB,UAAUsC,QAAU,SAAUF,GACvClC,KAAKmC,SAASD,EAAO,qBACvB,EAEApB,EAAWhB,UAAUqC,SAAW,SAAUD,EAAOG,GAE/CrC,KAAKa,IAAIyB,oBAAoB,OAAQtC,MACrCA,KAAKa,IAAIyB,oBAAoB,QAAStC,MAEtC,MAAMuC,EAAOvC,KAAKyB,SAASe,cAAcxC,KAAKa,KAC9C,MAAMJ,EAAW8B,GAAQA,EAAKE,QAC9BzC,KAAKyB,SAASiB,eAAejC,GAE7BT,KAAKa,IAAI8B,UAAUC,IAAIP,GACvBrC,KAAKyB,SAASoB,cAAc,WAAYX,EAAOzB,EACjD,EAGAf,EAASoB,WAAaA"}

package/dist/nano-components/{p-2155fc2c.js → local-my-account-6662da72.js}

@@ -2,4 +2,4 @@
  * Web Components for Nanopore digital Web Apps
  */
 const e={id:"mr.test",uuid:"2589690E-A907-50BB-9551-55E18ABB1273",name:"Logged in user",first_name:"mr",last_name:"test",email:"mr.test@nanoporetech.com",job_title:"CEO",company:"ONT",small_avatar_url:"https://picsum.photos/75",is_nanopore_user:false,lifecycle_stage:"Lead",indirect_customer:false,registration:{next_url:null}};const t=[{origin:"cws",domain:"nanoporetech.com"},{origin:"store",domain:"store.nanoporetech.com"},{origin:"community",domain:"community.nanoporetech.com"}];const o={count:0,url:"https://shop-test.nanoporetech.com/checkout/cart"};const r={count:0};const a=[{id:1,area:"main",address:"#",title:"Trousers",order:1,target:null},{id:2,area:"logged-out",address:"#",title:"Mouse",order:1,target:null},{id:20,area:"profile-panel-block",address:"https://nanoporetech.com/about-us/news",title:"News",order:3,target:""},{id:21,area:"profile-panel-block",address:"https://nanoporetech.com/about-us",title:"About",order:3,target:""},{id:22,area:"profile-panel-block",address:"https://nanoporetech.com/contact",title:"Contact",order:3,target:""},{id:28,area:"right-side-logged-out",address:"https://nanoporetech.com/contact",title:"Contact",order:3,target:""},{id:29,area:"right-side-logged-out",address:"https://nanoporetech.com/about-us/news",title:"News",order:3,target:""},{id:30,area:"right-side-logged-out",address:"https://nanoporetech.com/about-us",title:"About",order:3,target:""},{id:9,area:"right-side-logged-in",address:"https://nanoporetech.com/contact",title:"Contact",order:4,target:""},{id:10,area:"right-side-logged-in",address:"https://nanoporetech.com/about-us/news",title:"News",order:4,target:""},{id:11,area:"right-side-logged-in",address:"https://nanoporetech.com/about-us",title:"About",order:4,target:""},{id:12,area:"right-side-logged-in",address:"https://nanoporetech.com/events",title:"Events",order:4,target:""},{id:23,area:"left-side-logged-out",address:"https://nanoporetech.com/",title:"Nanoporetech",order:5,target:""},{id:24,area:"left-side-logged-out",address:"https://metrichor.com/",title:"Metrichor",order:5,target:""},{id:25,area:"left-side-logged-out",address:"https://community.nanoporetech.com/",title:"Community",order:5,target:""},{id:26,area:"left-side-logged-out",address:"https://nanoporetech.com/events",title:"Events",order:5,target:""},{id:27,area:"left-side-logged-out",address:"https://store.nanoporetech.com",title:"Store",order:5,target:""},{id:3,area:"left-side-logged-in",address:"https://nanoporetech.com/",title:"Nanoporetech",order:6,target:""},{id:4,area:"left-side-logged-in",address:"https://metrichor.com/",title:"Metrichor",order:6,target:""},{id:5,area:"left-side-logged-in",address:"https://community.nanoporetech.com/",title:"Community",order:6,target:""},{id:6,area:"left-side-logged-in",address:"https://nanoporetech.com/events",title:"Events",order:6,target:""},{id:7,area:"left-side-logged-in",address:"https://store.nanoporetech.com",title:"Store",order:6,target:""},{id:8,area:"left-side-logged-in",address:"https://epi2me.nanoporetech.com",title:"EPI2ME",order:6,target:"_blank"},{id:13,area:"profile-panel-list",address:"https://community.nanoporetech.com/",title:"Community Dashboard",order:7,target:""},{id:14,area:"profile-panel-list",address:"https://myaccount.nanoporetech.com/message_centre",title:"Messages",order:7,target:""},{id:15,area:"profile-panel-list",address:"https://community.nanoporetech.com/my-activity",title:"My Activity",order:7,target:""},{id:16,area:"profile-panel-list",address:"https://myaccount.nanoporetech.com/home",title:"My Account",order:7,target:""},{id:17,area:"profile-panel-list",address:"https://myaccount.nanoporetech.com/account/teams",title:"Team Management ",order:7,target:""},{id:18,area:"profile-panel-list",address:"https://nanoporetech.com/resource-centre/publications",title:"Publications",order:7,target:""},{id:19,area:"profile-panel-list",address:"https://myaccount.nanoporetech.com/profile/status",title:"Preferences",order:7,target:""}];const s={forgot_password:"https://myaccount-dev.nanoporetech.com/profile/details#password-form?RelayState=",logout:"https://myaccount-dev.nanoporetech.com/sso/logout?RelayState=",login:null,messages:"https://myaccount-dev.nanoporetech.com/message_centre",cart:"https://shop-test.nanoporetech.com/checkout/cart"};const n={app_id:"N8NZI5A47F",api_key:"b38860b015b02c9cb6993cf0367ed203",indeces:[{index:"all_prod_en",name:"All",domain:"nanoporetech.com",all_group:true,filters:["tags","type"]},{index:"cws_english_en",name:"www",domain:"nanoporetech.com",filters:["tags","type"]},{index:"store_prod",name:"Store",domain:"store.nanoporetech.com",filters:["type"]},{index:"cws_english_resources_en",name:"Resources",domain:"nanoporetech.com",filters:["tags"]},{index:"community_prod",name:"Community",domain:"community.nanoporetech.com",filters:["type","channel","authors","tags"]}]};const d={user:e,domains:t,cart:o,notifications:r,links:a,urls:s,search:n};export default d;export{o as cart,t as domains,a as links,r as notifications,n as search,s as urls,e as user};
-//# sourceMappingURL=p-2155fc2c.js.map
+//# sourceMappingURL=local-my-account-6662da72.js.map

package/dist/nano-components/{p-ee045579.js → math-c02ddfda.js}

@@ -2,4 +2,4 @@
  * Web Components for Nanopore digital Web Apps
  */
 const t=(t,a,h)=>Math.max(t,Math.min(a,h));function a(t,a=0){let h=3735928559^a,M=1103547991^a;for(let a=0,e;a<t.length;a++){e=t.charCodeAt(a);h=Math.imul(h^e,2654435761);M=Math.imul(M^e,1597334677)}h=Math.imul(h^h>>>16,2246822507)^Math.imul(M^M>>>13,3266489909);M=Math.imul(M^M>>>16,2246822507)^Math.imul(h^h>>>13,3266489909);return 4294967296*(2097151&M)+(h>>>0)}export{a,t as c};
-//# sourceMappingURL=p-ee045579.js.map
+//# sourceMappingURL=math-c02ddfda.js.map

package/dist/nano-components/modal-bd9638c0.js

@@ -0,0 +1,5 @@
+/*!
+ * Web Components for Nanopore digital Web Apps
+ */
+import{g as t}from"./tabbable-26a66a22.js";let s=[];class i{constructor(t){this.tabDirection="forward";this.element=t;this.handleFocusIn=this.handleFocusIn.bind(this);this.handleKeyDown=this.handleKeyDown.bind(this)}activate(){s.push(this.element);document.addEventListener("focusin",this.handleFocusIn);document.addEventListener("keydown",this.handleKeyDown)}deactivate(){s=s.filter((t=>t!==this.element));document.removeEventListener("focusin",this.handleFocusIn);document.removeEventListener("keydown",this.handleKeyDown)}isActive(){return s[s.length-1]===this.element}handleFocusIn(s){var i;const o=s.composedPath();if(this.isActive()&&!o.includes(this.element)){const s=t(this.element);const o=this.tabDirection==="backward"?s.length-1:0;(i=s[o])===null||i===void 0?void 0:i.focus({preventScroll:true})}}handleKeyDown(t){if(t.key==="Tab"&&t.shiftKey){this.tabDirection="backward";setTimeout((()=>this.tabDirection="forward"))}}}export{i as M};
+//# sourceMappingURL=modal-bd9638c0.js.map

package/dist/nano-components/{p-2234694a.js.map → modal-bd9638c0.js.map}

@@ -1 +1 @@
-{"version":3,"names":["activeModals","Modal","constructor","element","this","tabDirection","handleFocusIn","bind","handleKeyDown","activate","push","document","addEventListener","deactivate","filter","modal","removeEventListener","isActive","length","event","path","composedPath","includes","tabbableElements","getTabbableElements","index","_a","focus","preventScroll","key","shiftKey","setTimeout"],"sources":["./src/utils/modal.ts"],"sourcesContent":["import { getTabbableElements } from './tabbable';\n\nlet activeModals: HTMLElement[] = [];\n\nexport default class Modal {\n  element: HTMLElement;\n  tabDirection: 'forward' | 'backward' = 'forward';\n\n  constructor(element: HTMLElement) {\n    this.element = element;\n    this.handleFocusIn = this.handleFocusIn.bind(this);\n    this.handleKeyDown = this.handleKeyDown.bind(this);\n  }\n\n  activate() {\n    activeModals.push(this.element);\n    document.addEventListener('focusin', this.handleFocusIn);\n    document.addEventListener('keydown', this.handleKeyDown);\n  }\n\n  deactivate() {\n    activeModals = activeModals.filter((modal) => modal !== this.element);\n    document.removeEventListener('focusin', this.handleFocusIn);\n    document.removeEventListener('keydown', this.handleKeyDown);\n  }\n\n  isActive() {\n    // The \"active\" modal is always the most recent one shown\n    return activeModals[activeModals.length - 1] === this.element;\n  }\n\n  handleFocusIn(event: Event) {\n    const path = event.composedPath();\n\n    // Trap focus so it doesn't go out of the modal's boundary\n    if (this.isActive() && !path.includes(this.element)) {\n      const tabbableElements = getTabbableElements(this.element);\n      const index =\n        this.tabDirection === 'backward' ? tabbableElements.length - 1 : 0;\n      tabbableElements[index]?.focus({ preventScroll: true });\n    }\n  }\n\n  handleKeyDown(event: KeyboardEvent) {\n    // Quick hack to determine tab direction\n    if (event.key === 'Tab' && event.shiftKey) {\n      this.tabDirection = 'backward';\n      setTimeout(() => (this.tabDirection = 'forward'));\n    }\n  }\n}\n"],"mappings":";;;oCAEA,IAAIA,EAA8B,G,MAEbC,EAInBC,YAAYC,GAFZC,KAAAC,aAAuC,UAGrCD,KAAKD,QAAUA,EACfC,KAAKE,cAAgBF,KAAKE,cAAcC,KAAKH,MAC7CA,KAAKI,cAAgBJ,KAAKI,cAAcD,KAAKH,K,CAG/CK,WACET,EAAaU,KAAKN,KAAKD,SACvBQ,SAASC,iBAAiB,UAAWR,KAAKE,eAC1CK,SAASC,iBAAiB,UAAWR,KAAKI,c,CAG5CK,aACEb,EAAeA,EAAac,QAAQC,GAAUA,IAAUX,KAAKD,UAC7DQ,SAASK,oBAAoB,UAAWZ,KAAKE,eAC7CK,SAASK,oBAAoB,UAAWZ,KAAKI,c,CAG/CS,WAEE,OAAOjB,EAAaA,EAAakB,OAAS,KAAOd,KAAKD,O,CAGxDG,cAAca,G,MACZ,MAAMC,EAAOD,EAAME,eAGnB,GAAIjB,KAAKa,aAAeG,EAAKE,SAASlB,KAAKD,SAAU,CACnD,MAAMoB,EAAmBC,EAAoBpB,KAAKD,SAClD,MAAMsB,EACJrB,KAAKC,eAAiB,WAAakB,EAAiBL,OAAS,EAAI,GACnEQ,EAAAH,EAAiBE,MAAM,MAAAC,SAAA,SAAAA,EAAEC,MAAM,CAAEC,cAAe,M,EAIpDpB,cAAcW,GAEZ,GAAIA,EAAMU,MAAQ,OAASV,EAAMW,SAAU,CACzC1B,KAAKC,aAAe,WACpB0B,YAAW,IAAO3B,KAAKC,aAAe,W"}
+{"version":3,"names":["activeModals","Modal","constructor","element","this","tabDirection","handleFocusIn","bind","handleKeyDown","activate","push","document","addEventListener","deactivate","filter","modal","removeEventListener","isActive","length","event","path","composedPath","includes","tabbableElements","getTabbableElements","index","_a","focus","preventScroll","key","shiftKey","setTimeout"],"sources":["./src/utils/modal.ts"],"sourcesContent":["import { getTabbableElements } from './tabbable';\n\nlet activeModals: HTMLElement[] = [];\n\nexport default class Modal {\n  element: HTMLElement;\n  tabDirection: 'forward' | 'backward' = 'forward';\n\n  constructor(element: HTMLElement) {\n    this.element = element;\n    this.handleFocusIn = this.handleFocusIn.bind(this);\n    this.handleKeyDown = this.handleKeyDown.bind(this);\n  }\n\n  activate() {\n    activeModals.push(this.element);\n    document.addEventListener('focusin', this.handleFocusIn);\n    document.addEventListener('keydown', this.handleKeyDown);\n  }\n\n  deactivate() {\n    activeModals = activeModals.filter((modal) => modal !== this.element);\n    document.removeEventListener('focusin', this.handleFocusIn);\n    document.removeEventListener('keydown', this.handleKeyDown);\n  }\n\n  isActive() {\n    // The \"active\" modal is always the most recent one shown\n    return activeModals[activeModals.length - 1] === this.element;\n  }\n\n  handleFocusIn(event: Event) {\n    const path = event.composedPath();\n\n    // Trap focus so it doesn't go out of the modal's boundary\n    if (this.isActive() && !path.includes(this.element)) {\n      const tabbableElements = getTabbableElements(this.element);\n      const index =\n        this.tabDirection === 'backward' ? tabbableElements.length - 1 : 0;\n      tabbableElements[index]?.focus({ preventScroll: true });\n    }\n  }\n\n  handleKeyDown(event: KeyboardEvent) {\n    // Quick hack to determine tab direction\n    if (event.key === 'Tab' && event.shiftKey) {\n      this.tabDirection = 'backward';\n      setTimeout(() => (this.tabDirection = 'forward'));\n    }\n  }\n}\n"],"mappings":";;;2CAEA,IAAIA,EAA8B,G,MAEbC,EAInBC,YAAYC,GAFZC,KAAAC,aAAuC,UAGrCD,KAAKD,QAAUA,EACfC,KAAKE,cAAgBF,KAAKE,cAAcC,KAAKH,MAC7CA,KAAKI,cAAgBJ,KAAKI,cAAcD,KAAKH,K,CAG/CK,WACET,EAAaU,KAAKN,KAAKD,SACvBQ,SAASC,iBAAiB,UAAWR,KAAKE,eAC1CK,SAASC,iBAAiB,UAAWR,KAAKI,c,CAG5CK,aACEb,EAAeA,EAAac,QAAQC,GAAUA,IAAUX,KAAKD,UAC7DQ,SAASK,oBAAoB,UAAWZ,KAAKE,eAC7CK,SAASK,oBAAoB,UAAWZ,KAAKI,c,CAG/CS,WAEE,OAAOjB,EAAaA,EAAakB,OAAS,KAAOd,KAAKD,O,CAGxDG,cAAca,G,MACZ,MAAMC,EAAOD,EAAME,eAGnB,GAAIjB,KAAKa,aAAeG,EAAKE,SAASlB,KAAKD,SAAU,CACnD,MAAMoB,EAAmBC,EAAoBpB,KAAKD,SAClD,MAAMsB,EACJrB,KAAKC,eAAiB,WAAakB,EAAiBL,OAAS,EAAI,GACnEQ,EAAAH,EAAiBE,MAAM,MAAAC,SAAA,SAAAA,EAAEC,MAAM,CAAEC,cAAe,M,EAIpDpB,cAAcW,GAEZ,GAAIA,EAAMU,MAAQ,OAASV,EAAMW,SAAU,CACzC1B,KAAKC,aAAe,WACpB0B,YAAW,IAAO3B,KAAKC,aAAe,W"}

package/dist/nano-components/nano-accordion.entry.js

@@ -0,0 +1,5 @@
+/*!
+ * Web Components for Nanopore digital Web Apps
+ */
+import{r as s,c as o,h as t,a as e,g as n}from"./index-9695db0a.js";import{g as i}from"./dom-8599fac1.js";import{c as r}from"./theme-82feb8cf.js";const a=":host{box-sizing:border-box}*,*::before,*::after{box-sizing:border-box}[hidden]{display:none !important}:host{display:block}";const l=class{constructor(t){s(this,t);this.nanoToggle=o(this,"nanoToggle",7);this.itemOpened=undefined;this.color=undefined}onToggleHandler(s){s.stopPropagation();const o=i(this.el,"nano-details")||this.el.querySelectorAll("nano-details");o.forEach(((o,t)=>{if(o!==s.target)o.open=false;else this.itemOpened=t}));this.nanoToggle.emit()}onClosedHandler(s){s.stopPropagation();this.itemOpened=null;this.nanoToggle.emit()}render(){return t(e,{class:Object.assign(Object.assign({},r(this.color)),{[`nano-color-${this.itemOpened}`]:typeof this.itemOpened==="number"})},t("slot",null))}get el(){return n(this)}};l.style=a;export{l as nano_accordion};
+//# sourceMappingURL=nano-accordion.entry.js.map

package/dist/nano-components/{p-9f60ff14.entry.js.map → nano-accordion.entry.js.map}

@@ -1 +1 @@
-{"version":3,"names":["accordionCss","Accordion","onToggleHandler","event","stopPropagation","items","getDirectChildren","this","el","querySelectorAll","forEach","item","i","target","open","itemOpened","nanoToggle","emit","onClosedHandler","render","h","Host","class","Object","assign","createColorClasses","color"],"sources":["./src/components/accordion/accordion.scss?tag=nano-accordion&encapsulation=shadow","./src/components/accordion/accordion.tsx"],"sourcesContent":[":host {\n  display: block;\n}\n","import {\n  Component,\n  h,\n  Listen,\n  Element,\n  Host,\n  Prop,\n  EventEmitter,\n  Event,\n  State,\n} from '@stencil/core';\n\nimport { getDirectChildren } from '../../utils/dom';\nimport { createColorClasses } from '../../utils/theme';\nimport type { Color } from '../../interface';\n\n/**\n * Simple accordion - only one item open at a time - must be used with [details](story/components-accordion--details) elements.\n */\n@Component({\n  tag: 'nano-accordion',\n  styleUrl: 'accordion.scss',\n  shadow: true,\n})\nexport class Accordion {\n  @State() itemOpened?: number;\n\n  @Element() el: HTMLNanoAccordionElement;\n\n  /**\n   * Fires when accordion elements toggle\n   */\n  @Event() nanoToggle: EventEmitter;\n\n  /**\n   * Color to use from the color palette.\n   */\n  @Prop() color?: Color;\n\n  @Listen('nanoOpened')\n  onToggleHandler(event: CustomEvent) {\n    event.stopPropagation();\n\n    const items =\n      getDirectChildren(this.el, 'nano-details') ||\n      this.el.querySelectorAll('nano-details');\n    items.forEach((item: HTMLNanoDetailsElement, i) => {\n      if (item !== event.target) item.open = false;\n      else this.itemOpened = i;\n    });\n    this.nanoToggle.emit();\n  }\n\n  @Listen('nanoClosed')\n  onClosedHandler(event: CustomEvent) {\n    event.stopPropagation();\n    this.itemOpened = null;\n    this.nanoToggle.emit();\n  }\n\n  render() {\n    return (\n      <Host\n        class={{\n          ...createColorClasses(this.color),\n          [`nano-color-${this.itemOpened}`]:\n            typeof this.itemOpened === 'number',\n        }}\n      >\n        <slot />\n      </Host>\n    );\n  }\n}\n"],"mappings":";;;wIAAA,MAAMA,EAAe,+H,MCwBRC,EAAS,M,+GAgBpBC,gBAAgBC,GACdA,EAAMC,kBAEN,MAAMC,EACJC,EAAkBC,KAAKC,GAAI,iBAC3BD,KAAKC,GAAGC,iBAAiB,gBAC3BJ,EAAMK,SAAQ,CAACC,EAA8BC,KAC3C,GAAID,IAASR,EAAMU,OAAQF,EAAKG,KAAO,WAClCP,KAAKQ,WAAaH,CAAC,IAE1BL,KAAKS,WAAWC,M,CAIlBC,gBAAgBf,GACdA,EAAMC,kBACNG,KAAKQ,WAAa,KAClBR,KAAKS,WAAWC,M,CAGlBE,SACE,OACEC,EAACC,EAAI,CACHC,MAAKC,OAAAC,OAAAD,OAAAC,OAAA,GACAC,EAAmBlB,KAAKmB,QAAM,CACjC,CAAC,cAAcnB,KAAKQ,qBACXR,KAAKQ,aAAe,YAG/BK,EAAA,a"}
+{"version":3,"names":["accordionCss","Accordion","onToggleHandler","event","stopPropagation","items","getDirectChildren","this","el","querySelectorAll","forEach","item","i","target","open","itemOpened","nanoToggle","emit","onClosedHandler","render","h","Host","class","Object","assign","createColorClasses","color"],"sources":["./src/components/accordion/accordion.scss?tag=nano-accordion&encapsulation=shadow","./src/components/accordion/accordion.tsx"],"sourcesContent":[":host {\n  display: block;\n}\n","import {\n  Component,\n  h,\n  Listen,\n  Element,\n  Host,\n  Prop,\n  EventEmitter,\n  Event,\n  State,\n} from '@stencil/core';\n\nimport { getDirectChildren } from '../../utils/dom';\nimport { createColorClasses } from '../../utils/theme';\nimport type { Color } from '../../interface';\n\n/**\n * Simple accordion - only one item open at a time - must be used with [details](story/components-accordion--details) elements.\n */\n@Component({\n  tag: 'nano-accordion',\n  styleUrl: 'accordion.scss',\n  shadow: true,\n})\nexport class Accordion {\n  @State() itemOpened?: number;\n\n  @Element() el: HTMLNanoAccordionElement;\n\n  /**\n   * Fires when accordion elements toggle\n   */\n  @Event() nanoToggle: EventEmitter;\n\n  /**\n   * Color to use from the color palette.\n   */\n  @Prop() color?: Color;\n\n  @Listen('nanoOpened')\n  onToggleHandler(event: CustomEvent) {\n    event.stopPropagation();\n\n    const items =\n      getDirectChildren(this.el, 'nano-details') ||\n      this.el.querySelectorAll('nano-details');\n    items.forEach((item: HTMLNanoDetailsElement, i) => {\n      if (item !== event.target) item.open = false;\n      else this.itemOpened = i;\n    });\n    this.nanoToggle.emit();\n  }\n\n  @Listen('nanoClosed')\n  onClosedHandler(event: CustomEvent) {\n    event.stopPropagation();\n    this.itemOpened = null;\n    this.nanoToggle.emit();\n  }\n\n  render() {\n    return (\n      <Host\n        class={{\n          ...createColorClasses(this.color),\n          [`nano-color-${this.itemOpened}`]:\n            typeof this.itemOpened === 'number',\n        }}\n      >\n        <slot />\n      </Host>\n    );\n  }\n}\n"],"mappings":";;;kJAAA,MAAMA,EAAe,+H,MCwBRC,EAAS,M,+GAgBpBC,gBAAgBC,GACdA,EAAMC,kBAEN,MAAMC,EACJC,EAAkBC,KAAKC,GAAI,iBAC3BD,KAAKC,GAAGC,iBAAiB,gBAC3BJ,EAAMK,SAAQ,CAACC,EAA8BC,KAC3C,GAAID,IAASR,EAAMU,OAAQF,EAAKG,KAAO,WAClCP,KAAKQ,WAAaH,CAAC,IAE1BL,KAAKS,WAAWC,M,CAIlBC,gBAAgBf,GACdA,EAAMC,kBACNG,KAAKQ,WAAa,KAClBR,KAAKS,WAAWC,M,CAGlBE,SACE,OACEC,EAACC,EAAI,CACHC,MAAKC,OAAAC,OAAAD,OAAAC,OAAA,GACAC,EAAmBlB,KAAKmB,QAAM,CACjC,CAAC,cAAcnB,KAAKQ,qBACXR,KAAKQ,aAAe,YAG/BK,EAAA,a"}

package/dist/nano-components/nano-alert.entry.js

@@ -0,0 +1,5 @@
+/*!
+ * Web Components for Nanopore digital Web Apps
+ */
+import{r as t,c as e,h as i,a,g as s}from"./index-9695db0a.js";import{M as n}from"./modal-bd9638c0.js";import{l as o,u as r}from"./scroll-ac332213.js";import{c as l}from"./theme-82feb8cf.js";import"./tabbable-26a66a22.js";import"./dom-8599fac1.js";const h=":host{box-sizing:border-box}*,*::before,*::after{box-sizing:border-box}[hidden]{display:none !important}:host{--border-radius:var(--nano-layer-border-radius, var(--nano-border-radius-medium, 4px));--border-color:var(--nano-layer-border-color, rgba(0, 0, 0, 0.1));--border-width:var(--nano-layer-border-width, 1px);--background:var(--nano-layer-bg, #fff);--tint-color:var(--nano-color-base, var(--nano-color-primary, #007495));--icon-size:2rem;--scrim-color:var(--nano-layer-overlay-dark, rgb(74 74 74 / 50%));--close-button-color:#b5aea7;display:block}:host(.nano-color){--tint-color:var(--nano-color-base, var(--nano-color-primary, #007495))}.alert{position:relative;background-color:var(--background);border:solid var(--border-width) var(--border-color);border-block-start-width:4px;border-block-start-color:var(--tint-color);border-radius:var(--border-radius);opacity:0;transform:scale(0.9);transition:var(--nano-transition-medium, 0.5s) opacity ease, var(--nano-transition-fast, 0.3s) transform ease}.alert:focus{outline:none}.alert:not(.alert--showing){position:absolute;inline-size:1px;block-size:1px;clip:rect(0 0 0 0);-webkit-clip-path:inset(50%);clip-path:inset(50%);overflow:hidden;pointer-events:none;visibility:hidden}.alert--open{opacity:1;transform:none}.alert--toasty,.alert--modal{box-shadow:var(--nano-layer-shadow-large, 0 2px 8px rgba(0, 0, 0, 0.2));margin:var(--nano-spacing-medium, 16px)}.alert--modal.alert--nodismiss{animation:cannotClose 0.25s ease-in-out 1}@keyframes cannotClose{0%{transform:scale(1)}50%{transform:scale(1.08)}100%{transform:scale(1)}}.alert__content{display:flex;align-items:stretch}.alert__modal-wrap{position:fixed;display:flex;align-items:center;justify-content:center;inset:0;z-index:var(--nano-layer-index-alert, 800)}.alert__message{flex:1 1 auto;padding:var(--nano-spacing-medium, 16px);overflow:hidden;line-height:1.6}.alert__close{--color:var(--close-button-color);flex:0 0 auto;display:flex;align-items:center;font-size:1.1em;padding-inline:0 var(--nano-spacing-medium, 16px);padding-block:0}.alert__footer{padding:0 var(--nano-spacing-small, 8px) 0;display:flex;flex-direction:row;justify-content:space-around;align-items:center}.alert__footer ::slotted(*){flex:1;margin:0 var(--nano-spacing-small, 8px) var(--nano-spacing-medium, 16px) !important}.alert__overlay{position:fixed;inset:0;background-color:var(--scrim-color);opacity:0;transition:var(--nano-transition-fast, 0.3s) opacity;z-index:var(--nano-layer-index-alert, 800);-webkit-backdrop-filter:blur(var(--nano-layer-overlay-blur, 3px));backdrop-filter:blur(var(--nano-layer-overlay-blur, 3px));pointer-events:all}.alert__overlay--open{opacity:1}.alert__icon{flex:0 0 auto;display:flex;align-items:center;font-size:var(--icon-size)}.alert__icon ::slotted(*){color:var(--tint-color);margin-inline-start:var(--nano-spacing-medium, 16px)}";let c;let d;let f;let u;if(globalThis["document"]){c=Object.assign(document.createElement("div"),{className:"nano-toast-stack nano-toast-stack--tr"});d=Object.assign(document.createElement("div"),{className:"nano-toast-stack nano-toast-stack--tl"});f=Object.assign(document.createElement("div"),{className:"nano-toast-stack nano-toast-stack--bl"});u=Object.assign(document.createElement("div"),{className:"nano-toast-stack nano-toast-stack--br"})}const m=class{constructor(a){t(this,a);this.nanoShow=e(this,"nanoShow",7);this.nanoAfterShow=e(this,"nanoAfterShow",7);this.nanoHide=e(this,"nanoHide",7);this.nanoAfterHide=e(this,"nanoAfterHide",7);this.addedTransEnd=false;this.goingToHide=false;this.goingToShow=false;this.handleMouseMove=()=>{this.restartAutoHide()};this.handleCloseClick=()=>{this.hide()};this.handleTransitionEnd=t=>{if(t.propertyName==="opacity"&&(t.target===this.panel||t.target===this.overlay)){this.host.hidden=!this.open;this.isShowing=this.open;this.open?this.nanoAfterShow.emit():this.nanoAfterHide.emit()}};this.handleButtonClick=t=>{if(t.defaultPrevented)return;if(t.target.tagName&&t.target.tagName.toLowerCase()==="button")this.hide()};this.restartAutoHide=()=>{clearTimeout(this.autoHideTimeout);if(this.open&&this.duration<Infinity){this.autoHideTimeout=setTimeout((()=>this.hide()),this.duration)}};this.Panel=()=>i("div",{ref:t=>this.panel=t,part:"panel",class:{alert:true,"alert--open":this.open,"alert--toasty":this.isToast,"alert--modal":!!this.isModal,"alert--showing":this.isShowing,"alert--nodismiss":this.noDismiss},role:!!this.isModal?"alertdialog":"alert","aria-live":"assertive","aria-atomic":"true","aria-hidden":this.open?"false":"true","aria-modal":!!this.isModal?"true":undefined,"aria-label":this.label?this.label:undefined,onMouseMove:this.handleMouseMove,tabIndex:!!this.isModal?0:undefined},i("div",{class:"alert__content"},i("div",{part:"icon",class:"alert__icon"},i("slot",{name:"icon"})),i("div",{part:"message",class:"alert__message"},i("slot",null)),this.closable&&i("div",{class:"alert__close"},i("nano-icon-button",{class:"alert__close",iconName:"light/times",label:"close menu",onClick:this.handleCloseClick}))),i("div",{class:"alert__footer"},i("slot",{name:"footer"})));this.isModal=false;this.isToast=false;this.isShowing=false;this.label=undefined;this.noDismiss=false;this.open=false;this.closable=false;this.color=undefined;this.duration=Infinity;this.hoist=false}handleOpenChange(){this.open?this.show():this.hide()}handleDurationChange(){this.restartAutoHide()}handleHoistChange(){if(!this.hoist||document.body.children[0]===this.host)return;document.body.prepend(this.host)}async show(){if(this.goingToShow){return}const t=this.nanoShow.emit();if(t.defaultPrevented){this.open=false;return false}this.host.hidden=false;this.goingToShow=true;this.open=true;requestAnimationFrame((()=>{this.isShowing=true;this.goingToShow=false}));if(this.duration<Infinity){clearTimeout(this.autoHideTimeout);this.autoHideTimeout=setTimeout((()=>this.hide()),this.duration)}}async hide(){if(this.goingToHide){return}const t=this.nanoHide.emit();if(t.defaultPrevented){this.open=true;return false}this.goingToHide=true;this.open=false;requestAnimationFrame((()=>this.goingToHide=false));clearTimeout(this.autoHideTimeout)}async toast(t="tr"){this.isToast=true;return new Promise((e=>{let i;switch(t){case"tl":i=d;break;case"bl":i=f;break;case"br":i=u;break;default:i=c;break}if(!i.parentElement){document.body.appendChild(i)}i.appendChild(this.host);this.connectedCallback();this.show();const a=()=>{this.host.remove();this.isToast=false;e();if(!i.querySelector("nano-alert")){i.remove()}};this.host.addEventListener("nanoAfterHide",a,{once:true});this.host.addEventListener("nano-after-hide",a,{once:true})}))}async alert(t){this.isModal=true;this.label=t;return new Promise((t=>{if(!document.body.contains(this.host)){document.body.appendChild(this.host)}this.modal.activate();o(this.host);this.originalTrigger=document.activeElement;requestAnimationFrame((()=>{this.show()}));const e=()=>requestAnimationFrame((()=>this.panel.focus({preventScroll:true})));const i=()=>{this.modal.deactivate();this.host.remove();this.label=undefined;this.isModal=false;t();if(this.originalTrigger&&typeof this.originalTrigger.focus==="function"){setTimeout((()=>this.originalTrigger.focus()))}};this.host.addEventListener("nanoAfterShow",e,{once:true});this.host.addEventListener("nano-after-show",e,{once:true});this.host.addEventListener("nanoAfterHide",i,{once:true});this.host.addEventListener("nano-after-hide",i,{once:true})}))}connectedCallback(){this.modal=new n(this.host);this.handleHoistChange();this.host.addEventListener("click",this.handleButtonClick);if(this.panel){this.addedTransEnd=true;this.panel.addEventListener("transitionend",this.handleTransitionEnd)}}disconnectedCallback(){r(this.host);this.host.removeEventListener("click",this.handleButtonClick);this.addedTransEnd=false;if(this.panel)this.panel.removeEventListener("transitionend",this.handleTransitionEnd)}componentDidLoad(){if(this.open){this.show()}if(!this.addedTransEnd){this.panel.addEventListener("transitionend",this.handleTransitionEnd)}}render(){return i(a,{class:Object.assign({},l(this.color)),showing:this.isShowing},this.isModal&&[i("div",{part:"overlay",class:{alert__overlay:true,"alert__overlay--open":this.open},ref:t=>this.overlay=t}),i("div",{class:"alert__modal-wrap",onClick:t=>{if(!t.target.classList.contains("alert__modal-wrap"))return;this.noDismiss=true;setTimeout((()=>this.noDismiss=false),250)}},i(this.Panel,null))],!this.isModal&&i(this.Panel,null))}get host(){return s(this)}static get watchers(){return{open:["handleOpenChange"],duration:["handleDurationChange"],hoist:["handleHoistChange"]}}};m.style=h;export{m as nano_alert};
+//# sourceMappingURL=nano-alert.entry.js.map

package/dist/nano-components/{p-191352c4.entry.js.map → nano-alert.entry.js.map}

@@ -1 +1 @@
-{"version":3,"names":["alertCss","toastStackTr","toastStackTl","toastStackBl","toastStackBr","globalThis","Object","assign","document","createElement","className","Alert","this","addedTransEnd","goingToHide","goingToShow","handleMouseMove","restartAutoHide","handleCloseClick","hide","handleTransitionEnd","event","propertyName","target","panel","overlay","host","hidden","open","isShowing","nanoAfterShow","emit","nanoAfterHide","handleButtonClick","e","defaultPrevented","tagName","toLowerCase","clearTimeout","autoHideTimeout","duration","Infinity","setTimeout","Panel","h","ref","el","part","class","alert","isToast","isModal","noDismiss","role","undefined","label","onMouseMove","tabIndex","name","closable","iconName","onClick","handleOpenChange","show","handleDurationChange","handleHoistChange","hoist","body","children","prepend","async","nanoShow","requestAnimationFrame","nanoHide","position","Promise","resolve","toastStack","parentElement","appendChild","connectedCallback","onClose","remove","querySelector","addEventListener","once","contains","modal","activate","lockBodyScrolling","originalTrigger","activeElement","onOpen","focus","preventScroll","deactivate","Modal","disconnectedCallback","unlockBodyScrolling","removeEventListener","componentDidLoad","render","Host","createColorClasses","color","showing","alert__overlay","div","classList"],"sources":["./src/components/alert/alert.scss?tag=nano-alert&encapsulation=shadow","./src/components/alert/alert.tsx"],"sourcesContent":["@use 'sass:map';\n@use 'sass:list';\n\n@import '../../global/style/nano-theme/base';\n@import '../../global/style/nano-theme/colours';\n@import '../../global/style/nano-theme/layers';\n\n:host {\n  /**\n   * @prop --border-radius: defaults to #{$layer-border-radius};\n   * @prop --border-color: defaults to #{$layer-border-color};\n   * @prop --border-width: defaults to #{$layer-border-width};\n   * @prop --background: defaults to #{$layer-bg-color};\n   * @prop --tint-color: defaults to var(--nano-color-base, #{nano-color(primary, base)});\n   * @prop --icon-size: defaults to 1.5rem;\n   * @prop --scrim-color: overlay colour of alert display. Defaults to #{$layer-overlay-dark};\n   * @prop --close-button-color: defaults to #{map.get($colors, mediumgrey)} ;\n   */\n\n  --border-radius: #{$layer-border-radius};\n  --border-color: #{$layer-border-color};\n  --border-width: #{$layer-border-width};\n  --background: #{$layer-bg-color};\n  --tint-color: var(--nano-color-base, #{nano-color(primary, base)});\n  --icon-size: 2rem;\n  --scrim-color: #{$layer-overlay-dark};\n  --close-button-color: #{map.get($colors, palegrey)};\n\n  display: block;\n}\n\n:host(.nano-color) {\n  --tint-color: var(--nano-color-base, #{nano-color(primary, base)});\n}\n\n.alert {\n  position: relative;\n  background-color: var(--background);\n  border: solid var(--border-width) var(--border-color);\n  border-block-start-width: 4px;\n  border-block-start-color: var(--tint-color);\n  border-radius: var(--border-radius);\n  opacity: 0;\n  transform: scale(0.9);\n  transition:\n    #{$transition-medium} opacity ease,\n    #{$transition-fast} transform ease;\n\n  &:focus {\n    outline: none;\n  }\n\n  &:not(.alert--showing) {\n    @include hidden;\n  }\n\n  &--open {\n    opacity: 1;\n    transform: none;\n  }\n\n  &--toasty,\n  &--modal {\n    box-shadow: #{$layer-shadow-large};\n    margin: #{$spacing-medium};\n  }\n\n  &--modal {\n    &.alert--nodismiss {\n      animation: cannotClose 0.25s ease-in-out 1;\n\n      @keyframes cannotClose {\n        0% {\n          transform: scale(1);\n        }\n\n        50% {\n          transform: scale(1.08);\n        }\n\n        100% {\n          transform: scale(1);\n        }\n      }\n    }\n  }\n}\n\n.alert__content {\n  display: flex;\n  align-items: stretch;\n}\n\n.alert__modal-wrap {\n  position: fixed;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  inset: 0;\n  z-index: #{$layer-index-alert};\n}\n\n.alert__message {\n  flex: 1 1 auto;\n  padding: #{$spacing-medium};\n  overflow: hidden;\n  line-height: 1.6;\n}\n\n.alert__close {\n  --color: var(--close-button-color);\n\n  flex: 0 0 auto;\n  display: flex;\n  align-items: center;\n  font-size: 1.1em;\n  padding-inline: 0 #{$spacing-medium};\n  padding-block: 0;\n}\n\n.alert__footer {\n  padding: 0 #{$spacing-small} 0;\n  display: flex;\n  flex-direction: row;\n  justify-content: space-around;\n  align-items: center;\n\n  ::slotted(*) {\n    flex: 1;\n    margin: 0 #{$spacing-small} #{$spacing-medium} !important;\n  }\n}\n\n.alert__overlay {\n  position: fixed;\n  inset: 0;\n  background-color: var(--scrim-color);\n  opacity: 0;\n  transition: #{$transition-fast} opacity;\n  z-index: #{$layer-index-alert};\n  backdrop-filter: blur(#{$layer-overlay-blur});\n  pointer-events: all;\n\n  &--open {\n    opacity: 1;\n  }\n}\n\n.alert__icon {\n  flex: 0 0 auto;\n  display: flex;\n  align-items: center;\n  font-size: var(--icon-size);\n\n  ::slotted(*) {\n    color: var(--tint-color);\n    margin-inline-start: #{$spacing-medium};\n  }\n}\n","import {\n  Component,\n  ComponentInterface,\n  Element,\n  Event,\n  EventEmitter,\n  Method,\n  Prop,\n  State,\n  Watch,\n  h,\n  Host,\n  VNode,\n} from '@stencil/core';\nimport Modal from '../../utils/modal';\nimport { lockBodyScrolling, unlockBodyScrolling } from '../../utils/scroll';\nimport { createColorClasses } from '../../utils/theme';\nimport type { Color } from '../../interface';\n\nlet toastStackTr: HTMLElement;\nlet toastStackTl: HTMLElement;\nlet toastStackBl: HTMLElement;\nlet toastStackBr: HTMLElement;\n\nif (globalThis['document']) {\n  toastStackTr = Object.assign(document.createElement('div'), {\n    className: 'nano-toast-stack nano-toast-stack--tr',\n  });\n  toastStackTl = Object.assign(document.createElement('div'), {\n    className: 'nano-toast-stack nano-toast-stack--tl',\n  });\n  toastStackBl = Object.assign(document.createElement('div'), {\n    className: 'nano-toast-stack nano-toast-stack--bl',\n  });\n  toastStackBr = Object.assign(document.createElement('div'), {\n    className: 'nano-toast-stack nano-toast-stack--br',\n  });\n}\n\n/**\n * Alerts are used to display important messages either inline, as toast notifications or as modals requiring action.\n * @slot - The alert's content.\n * @slot icon - An icon to show in the alert.\n * @slot footer - Place items at the bottom of the alert. Best used with `button` elements - esp when used as with the `alert()` method.\n */\n@Component({\n  tag: 'nano-alert',\n  styleUrl: 'alert.scss',\n  shadow: true,\n})\nexport class Alert implements ComponentInterface {\n  private autoHideTimeout: ReturnType<typeof setTimeout>;\n  private panel: HTMLElement;\n  private overlay: HTMLElement;\n  private modal: Modal;\n  private originalTrigger: HTMLElement | null;\n  private addedTransEnd = false;\n  private goingToHide = false;\n  private goingToShow = false;\n\n  @State() isModal = false;\n  @State() isToast = false;\n  @State() isShowing = false;\n  @State() label: string;\n  @State() noDismiss = false;\n\n  @Element() host: HTMLNanoAlertElement;\n\n  /** Indicates whether or not the alert is open. You can use this in lieu of the show/hide methods. */\n  @Prop({ mutable: true, reflect: true }) open = false;\n\n  @Watch('open')\n  handleOpenChange() {\n    this.open ? this.show() : this.hide();\n  }\n\n  /** Set to true to make the alert closable. */\n  @Prop({ reflect: true }) closable = false;\n\n  /** The color to use from the application's color palette. */\n  @Prop({ reflect: true }) color?: Color;\n\n  /**\n   * The length of time, in milliseconds, the alert will show before closing itself. If the user interacts with the\n   * alert before it closes (e.g. moves the mouse over it), the timer will restart.\n   */\n  @Prop() duration = Infinity;\n\n  @Watch('duration')\n  handleDurationChange() {\n    this.restartAutoHide();\n  }\n\n  /**\n   * Relocate the dialog to the root of the DOM.\n   * Most useful in conjunction with `alert()` when parental elements\n   * have css stacking constraints which don't allow for `position: fixed`\n   */\n  @Prop() hoist = false;\n\n  @Watch('hoist')\n  handleHoistChange() {\n    if (!this.hoist || document.body.children[0] === this.host) return;\n    document.body.prepend(this.host);\n  }\n\n  /** Emitted when the alert opens. Calling `event.preventDefault()` will prevent it from being opened. */\n  @Event() nanoShow: EventEmitter;\n\n  /** Emitted after the alert opens and all transitions are complete. */\n  @Event() nanoAfterShow: EventEmitter;\n\n  /** Emitted when the alert closes. Calling `event.preventDefault()` will prevent it from being closed. */\n  @Event() nanoHide: EventEmitter;\n\n  /** Emitted after the alert closes and all transitions are complete. */\n  @Event() nanoAfterHide: EventEmitter;\n\n  /** Shows the alert. */\n  @Method()\n  async show() {\n    if (this.goingToShow) {\n      return;\n    }\n    const nanoShow = this.nanoShow.emit();\n    if (nanoShow.defaultPrevented) {\n      this.open = false;\n      return false;\n    }\n\n    this.host.hidden = false;\n    this.goingToShow = true;\n    this.open = true;\n    requestAnimationFrame(() => {\n      this.isShowing = true;\n      this.goingToShow = false;\n    });\n\n    if (this.duration < Infinity) {\n      clearTimeout(this.autoHideTimeout);\n      this.autoHideTimeout = setTimeout(() => this.hide(), this.duration);\n    }\n  }\n\n  /** Hides the alert */\n  @Method()\n  async hide() {\n    if (this.goingToHide) {\n      return;\n    }\n    const nanoHide = this.nanoHide.emit();\n\n    if (nanoHide.defaultPrevented) {\n      this.open = true;\n      return false;\n    }\n    this.goingToHide = true;\n    this.open = false;\n\n    requestAnimationFrame(() => (this.goingToHide = false));\n    clearTimeout(this.autoHideTimeout);\n  }\n\n  /**\n   * Displays the alert as a toast notification. This will move the alert out of its position in the DOM and, when\n   * dismissed, it will be removed from the DOM completely. By storing a reference to the alert, you can reuse it by\n   * calling this method again. The returned promise will resolve after the alert is hidden.\n   *\n   * @param position options are tr (top-right - default), tl (top-left), br (bottom-right), bl (bottom-left)\n   * @returns a promise which will resolve after the alert has hidden\n   */\n  @Method()\n  async toast(position: 'tr' | 'tl' | 'bl' | 'br' = 'tr') {\n    this.isToast = true;\n    return new Promise<void>((resolve) => {\n      let toastStack: HTMLElement;\n      switch (position) {\n        case 'tl':\n          toastStack = toastStackTl;\n          break;\n        case 'bl':\n          toastStack = toastStackBl;\n          break;\n        case 'br':\n          toastStack = toastStackBr;\n          break;\n        default:\n          toastStack = toastStackTr;\n          break;\n      }\n\n      if (!toastStack.parentElement) {\n        document.body.appendChild(toastStack);\n      }\n\n      toastStack.appendChild(this.host);\n      this.connectedCallback();\n      this.show();\n\n      const onClose = () => {\n        this.host.remove();\n        this.isToast = false;\n        resolve();\n\n        // Remove the toast stack from the DOM when there are no more alerts\n        if (!toastStack.querySelector('nano-alert')) {\n          toastStack.remove();\n        }\n      };\n\n      this.host.addEventListener('nanoAfterHide', onClose, { once: true });\n      this.host.addEventListener('nano-after-hide', onClose, { once: true });\n    });\n  }\n\n  /**\n   * Displays the alert as a dialog / modal - more akin to a traditional js alert().\n   * @param label a label for assistive technology\n   */\n  @Method()\n  async alert(label: string) {\n    this.isModal = true;\n    this.label = label;\n\n    return new Promise<void>((resolve) => {\n      if (!document.body.contains(this.host)) {\n        document.body.appendChild(this.host);\n      }\n\n      this.modal.activate();\n      lockBodyScrolling(this.host);\n      this.originalTrigger = document.activeElement as HTMLElement;\n\n      requestAnimationFrame(() => {\n        this.show();\n      });\n\n      const onOpen = () =>\n        requestAnimationFrame(() => this.panel.focus({ preventScroll: true }));\n\n      const onClose = () => {\n        this.modal.deactivate();\n        this.host.remove();\n        this.label = undefined;\n        this.isModal = false;\n        resolve();\n\n        // Restore focus to the original trigger\n        if (\n          this.originalTrigger &&\n          typeof this.originalTrigger.focus === 'function'\n        ) {\n          setTimeout(() => this.originalTrigger.focus());\n        }\n      };\n\n      this.host.addEventListener('nanoAfterShow', onOpen, { once: true });\n      this.host.addEventListener('nano-after-show', onOpen, { once: true });\n\n      this.host.addEventListener('nanoAfterHide', onClose, {\n        once: true,\n      });\n      this.host.addEventListener('nano-after-hide', onClose, {\n        once: true,\n      });\n    });\n  }\n\n  private handleMouseMove = () => {\n    this.restartAutoHide();\n  };\n\n  private handleCloseClick = () => {\n    this.hide();\n  };\n\n  private handleTransitionEnd = (event: TransitionEvent) => {\n    if (\n      event.propertyName === 'opacity' &&\n      (event.target === this.panel || event.target === this.overlay)\n    ) {\n      this.host.hidden = !this.open;\n      this.isShowing = this.open;\n      this.open ? this.nanoAfterShow.emit() : this.nanoAfterHide.emit();\n    }\n  };\n\n  private handleButtonClick = (e: PointerEvent & { target: HTMLElement }) => {\n    if (e.defaultPrevented) return;\n    if (e.target.tagName && e.target.tagName.toLowerCase() === 'button')\n      this.hide();\n  };\n\n  private restartAutoHide = () => {\n    clearTimeout(this.autoHideTimeout);\n    if (this.open && this.duration < Infinity) {\n      this.autoHideTimeout = setTimeout(() => this.hide(), this.duration);\n    }\n  };\n\n  connectedCallback() {\n    this.modal = new Modal(this.host);\n    this.handleHoistChange();\n    this.host.addEventListener('click', this.handleButtonClick);\n\n    if (this.panel) {\n      this.addedTransEnd = true;\n      this.panel.addEventListener('transitionend', this.handleTransitionEnd);\n    }\n  }\n\n  disconnectedCallback() {\n    unlockBodyScrolling(this.host);\n    this.host.removeEventListener('click', this.handleButtonClick);\n\n    this.addedTransEnd = false;\n    if (this.panel)\n      this.panel.removeEventListener('transitionend', this.handleTransitionEnd);\n  }\n\n  componentDidLoad() {\n    // Show on init if open\n    if (this.open) {\n      this.show();\n    }\n    if (!this.addedTransEnd) {\n      this.panel.addEventListener('transitionend', this.handleTransitionEnd);\n    }\n  }\n\n  private Panel = (): VNode => {\n    return (\n      <div\n        ref={(el) => (this.panel = el)}\n        part=\"panel\"\n        class={{\n          alert: true,\n          'alert--open': this.open,\n          'alert--toasty': this.isToast,\n          'alert--modal': !!this.isModal,\n          'alert--showing': this.isShowing,\n          'alert--nodismiss': this.noDismiss,\n        }}\n        role={!!this.isModal ? 'alertdialog' : 'alert'}\n        aria-live=\"assertive\"\n        aria-atomic=\"true\"\n        aria-hidden={this.open ? 'false' : 'true'}\n        aria-modal={!!this.isModal ? 'true' : undefined}\n        aria-label={this.label ? this.label : undefined}\n        onMouseMove={this.handleMouseMove}\n        tabIndex={!!this.isModal ? 0 : undefined}\n      >\n        <div class=\"alert__content\">\n          <div part=\"icon\" class=\"alert__icon\">\n            <slot name=\"icon\" />\n          </div>\n          <div part=\"message\" class=\"alert__message\">\n            <slot />\n          </div>\n          {this.closable && (\n            <div class=\"alert__close\">\n              <nano-icon-button\n                class=\"alert__close\"\n                iconName=\"light/times\"\n                label=\"close menu\"\n                onClick={this.handleCloseClick}\n              ></nano-icon-button>\n            </div>\n          )}\n        </div>\n        <div class=\"alert__footer\">\n          <slot name=\"footer\" />\n        </div>\n      </div>\n    );\n  };\n\n  render() {\n    return (\n      <Host\n        class={{ ...createColorClasses(this.color) }}\n        showing={this.isShowing}\n      >\n        {this.isModal && [\n          <div\n            part=\"overlay\"\n            class={{\n              alert__overlay: true,\n              'alert__overlay--open': this.open,\n            }}\n            ref={(div) => (this.overlay = div)}\n          />,\n          <div\n            class=\"alert__modal-wrap\"\n            onClick={(e: MouseEvent & { target: HTMLElement }) => {\n              if (!e.target.classList.contains('alert__modal-wrap')) return;\n              this.noDismiss = true;\n              setTimeout(() => (this.noDismiss = false), 250);\n            }}\n          >\n            <this.Panel />\n          </div>,\n        ]}\n        {!this.isModal && <this.Panel />}\n      </Host>\n    );\n  }\n}\n"],"mappings":";;;8NAAA,MAAMA,EAAW,y1FCmBjB,IAAIC,EACJ,IAAIC,EACJ,IAAIC,EACJ,IAAIC,EAEJ,GAAIC,WAAW,YAAa,CAC1BJ,EAAeK,OAAOC,OAAOC,SAASC,cAAc,OAAQ,CAC1DC,UAAW,0CAEbR,EAAeI,OAAOC,OAAOC,SAASC,cAAc,OAAQ,CAC1DC,UAAW,0CAEbP,EAAeG,OAAOC,OAAOC,SAASC,cAAc,OAAQ,CAC1DC,UAAW,0CAEbN,EAAeE,OAAOC,OAAOC,SAASC,cAAc,OAAQ,CAC1DC,UAAW,yC,OAeFC,EAAK,M,yLAMRC,KAAAC,cAAgB,MAChBD,KAAAE,YAAc,MACdF,KAAAG,YAAc,MAkNdH,KAAAI,gBAAkB,KACxBJ,KAAKK,iBAAiB,EAGhBL,KAAAM,iBAAmB,KACzBN,KAAKO,MAAM,EAGLP,KAAAQ,oBAAuBC,IAC7B,GACEA,EAAMC,eAAiB,YACtBD,EAAME,SAAWX,KAAKY,OAASH,EAAME,SAAWX,KAAKa,SACtD,CACAb,KAAKc,KAAKC,QAAUf,KAAKgB,KACzBhB,KAAKiB,UAAYjB,KAAKgB,KACtBhB,KAAKgB,KAAOhB,KAAKkB,cAAcC,OAASnB,KAAKoB,cAAcD,M,GAIvDnB,KAAAqB,kBAAqBC,IAC3B,GAAIA,EAAEC,iBAAkB,OACxB,GAAID,EAAEX,OAAOa,SAAWF,EAAEX,OAAOa,QAAQC,gBAAkB,SACzDzB,KAAKO,MAAM,EAGPP,KAAAK,gBAAkB,KACxBqB,aAAa1B,KAAK2B,iBAClB,GAAI3B,KAAKgB,MAAQhB,KAAK4B,SAAWC,SAAU,CACzC7B,KAAK2B,gBAAkBG,YAAW,IAAM9B,KAAKO,QAAQP,KAAK4B,S,GAkCtD5B,KAAA+B,MAAQ,IAEZC,EAAA,OACEC,IAAMC,GAAQlC,KAAKY,MAAQsB,EAC3BC,KAAK,QACLC,MAAO,CACLC,MAAO,KACP,cAAerC,KAAKgB,KACpB,gBAAiBhB,KAAKsC,QACtB,iBAAkBtC,KAAKuC,QACvB,iBAAkBvC,KAAKiB,UACvB,mBAAoBjB,KAAKwC,WAE3BC,OAAQzC,KAAKuC,QAAU,cAAgB,QAAO,YACpC,YAAW,cACT,OAAM,cACLvC,KAAKgB,KAAO,QAAU,OAAM,eAC3BhB,KAAKuC,QAAU,OAASG,UAAS,aACnC1C,KAAK2C,MAAQ3C,KAAK2C,MAAQD,UACtCE,YAAa5C,KAAKI,gBAClByC,WAAY7C,KAAKuC,QAAU,EAAIG,WAE/BV,EAAA,OAAKI,MAAM,kBACTJ,EAAA,OAAKG,KAAK,OAAOC,MAAM,eACrBJ,EAAA,QAAMc,KAAK,UAEbd,EAAA,OAAKG,KAAK,UAAUC,MAAM,kBACxBJ,EAAA,cAEDhC,KAAK+C,UACJf,EAAA,OAAKI,MAAM,gBACTJ,EAAA,oBACEI,MAAM,eACNY,SAAS,cACTL,MAAM,aACNM,QAASjD,KAAKM,qBAKtB0B,EAAA,OAAKI,MAAM,iBACTJ,EAAA,QAAMc,KAAK,a,aAvTA,M,aACA,M,eACE,M,oCAEA,M,UAK0B,M,cAQX,M,mCASjBjB,S,WAYH,K,CA1BhBqB,mBACElD,KAAKgB,KAAOhB,KAAKmD,OAASnD,KAAKO,M,CAgBjC6C,uBACEpD,KAAKK,iB,CAWPgD,oBACE,IAAKrD,KAAKsD,OAAS1D,SAAS2D,KAAKC,SAAS,KAAOxD,KAAKc,KAAM,OAC5DlB,SAAS2D,KAAKE,QAAQzD,KAAKc,K,CAiB7B4C,aACE,GAAI1D,KAAKG,YAAa,CACpB,M,CAEF,MAAMwD,EAAW3D,KAAK2D,SAASxC,OAC/B,GAAIwC,EAASpC,iBAAkB,CAC7BvB,KAAKgB,KAAO,MACZ,OAAO,K,CAGThB,KAAKc,KAAKC,OAAS,MACnBf,KAAKG,YAAc,KACnBH,KAAKgB,KAAO,KACZ4C,uBAAsB,KACpB5D,KAAKiB,UAAY,KACjBjB,KAAKG,YAAc,KAAK,IAG1B,GAAIH,KAAK4B,SAAWC,SAAU,CAC5BH,aAAa1B,KAAK2B,iBAClB3B,KAAK2B,gBAAkBG,YAAW,IAAM9B,KAAKO,QAAQP,KAAK4B,S,EAM9D8B,aACE,GAAI1D,KAAKE,YAAa,CACpB,M,CAEF,MAAM2D,EAAW7D,KAAK6D,SAAS1C,OAE/B,GAAI0C,EAAStC,iBAAkB,CAC7BvB,KAAKgB,KAAO,KACZ,OAAO,K,CAEThB,KAAKE,YAAc,KACnBF,KAAKgB,KAAO,MAEZ4C,uBAAsB,IAAO5D,KAAKE,YAAc,QAChDwB,aAAa1B,KAAK2B,gB,CAYpB+B,YAAYI,EAAsC,MAChD9D,KAAKsC,QAAU,KACf,OAAO,IAAIyB,SAAeC,IACxB,IAAIC,EACJ,OAAQH,GACN,IAAK,KACHG,EAAa3E,EACb,MACF,IAAK,KACH2E,EAAa1E,EACb,MACF,IAAK,KACH0E,EAAazE,EACb,MACF,QACEyE,EAAa5E,EACb,MAGJ,IAAK4E,EAAWC,cAAe,CAC7BtE,SAAS2D,KAAKY,YAAYF,E,CAG5BA,EAAWE,YAAYnE,KAAKc,MAC5Bd,KAAKoE,oBACLpE,KAAKmD,OAEL,MAAMkB,EAAU,KACdrE,KAAKc,KAAKwD,SACVtE,KAAKsC,QAAU,MACf0B,IAGA,IAAKC,EAAWM,cAAc,cAAe,CAC3CN,EAAWK,Q,GAIftE,KAAKc,KAAK0D,iBAAiB,gBAAiBH,EAAS,CAAEI,KAAM,OAC7DzE,KAAKc,KAAK0D,iBAAiB,kBAAmBH,EAAS,CAAEI,KAAM,MAAO,G,CAS1Ef,YAAYf,GACV3C,KAAKuC,QAAU,KACfvC,KAAK2C,MAAQA,EAEb,OAAO,IAAIoB,SAAeC,IACxB,IAAKpE,SAAS2D,KAAKmB,SAAS1E,KAAKc,MAAO,CACtClB,SAAS2D,KAAKY,YAAYnE,KAAKc,K,CAGjCd,KAAK2E,MAAMC,WACXC,EAAkB7E,KAAKc,MACvBd,KAAK8E,gBAAkBlF,SAASmF,cAEhCnB,uBAAsB,KACpB5D,KAAKmD,MAAM,IAGb,MAAM6B,EAAS,IACbpB,uBAAsB,IAAM5D,KAAKY,MAAMqE,MAAM,CAAEC,cAAe,SAEhE,MAAMb,EAAU,KACdrE,KAAK2E,MAAMQ,aACXnF,KAAKc,KAAKwD,SACVtE,KAAK2C,MAAQD,UACb1C,KAAKuC,QAAU,MACfyB,IAGA,GACEhE,KAAK8E,wBACE9E,KAAK8E,gBAAgBG,QAAU,WACtC,CACAnD,YAAW,IAAM9B,KAAK8E,gBAAgBG,S,GAI1CjF,KAAKc,KAAK0D,iBAAiB,gBAAiBQ,EAAQ,CAAEP,KAAM,OAC5DzE,KAAKc,KAAK0D,iBAAiB,kBAAmBQ,EAAQ,CAAEP,KAAM,OAE9DzE,KAAKc,KAAK0D,iBAAiB,gBAAiBH,EAAS,CACnDI,KAAM,OAERzE,KAAKc,KAAK0D,iBAAiB,kBAAmBH,EAAS,CACrDI,KAAM,MACN,G,CAoCNL,oBACEpE,KAAK2E,MAAQ,IAAIS,EAAMpF,KAAKc,MAC5Bd,KAAKqD,oBACLrD,KAAKc,KAAK0D,iBAAiB,QAASxE,KAAKqB,mBAEzC,GAAIrB,KAAKY,MAAO,CACdZ,KAAKC,cAAgB,KACrBD,KAAKY,MAAM4D,iBAAiB,gBAAiBxE,KAAKQ,oB,EAItD6E,uBACEC,EAAoBtF,KAAKc,MACzBd,KAAKc,KAAKyE,oBAAoB,QAASvF,KAAKqB,mBAE5CrB,KAAKC,cAAgB,MACrB,GAAID,KAAKY,MACPZ,KAAKY,MAAM2E,oBAAoB,gBAAiBvF,KAAKQ,oB,CAGzDgF,mBAEE,GAAIxF,KAAKgB,KAAM,CACbhB,KAAKmD,M,CAEP,IAAKnD,KAAKC,cAAe,CACvBD,KAAKY,MAAM4D,iBAAiB,gBAAiBxE,KAAKQ,oB,EAmDtDiF,SACE,OACEzD,EAAC0D,EAAI,CACHtD,MAAK1C,OAAAC,OAAA,GAAOgG,EAAmB3F,KAAK4F,QACpCC,QAAS7F,KAAKiB,WAEbjB,KAAKuC,SAAW,CACfP,EAAA,OACEG,KAAK,UACLC,MAAO,CACL0D,eAAgB,KAChB,uBAAwB9F,KAAKgB,MAE/BiB,IAAM8D,GAAS/F,KAAKa,QAAUkF,IAEhC/D,EAAA,OACEI,MAAM,oBACNa,QAAU3B,IACR,IAAKA,EAAEX,OAAOqF,UAAUtB,SAAS,qBAAsB,OACvD1E,KAAKwC,UAAY,KACjBV,YAAW,IAAO9B,KAAKwC,UAAY,OAAQ,IAAI,GAGjDR,EAAChC,KAAK+B,MAAK,SAGb/B,KAAKuC,SAAWP,EAAChC,KAAK+B,MAAK,M"}
+{"version":3,"names":["alertCss","toastStackTr","toastStackTl","toastStackBl","toastStackBr","globalThis","Object","assign","document","createElement","className","Alert","this","addedTransEnd","goingToHide","goingToShow","handleMouseMove","restartAutoHide","handleCloseClick","hide","handleTransitionEnd","event","propertyName","target","panel","overlay","host","hidden","open","isShowing","nanoAfterShow","emit","nanoAfterHide","handleButtonClick","e","defaultPrevented","tagName","toLowerCase","clearTimeout","autoHideTimeout","duration","Infinity","setTimeout","Panel","h","ref","el","part","class","alert","isToast","isModal","noDismiss","role","undefined","label","onMouseMove","tabIndex","name","closable","iconName","onClick","handleOpenChange","show","handleDurationChange","handleHoistChange","hoist","body","children","prepend","async","nanoShow","requestAnimationFrame","nanoHide","position","Promise","resolve","toastStack","parentElement","appendChild","connectedCallback","onClose","remove","querySelector","addEventListener","once","contains","modal","activate","lockBodyScrolling","originalTrigger","activeElement","onOpen","focus","preventScroll","deactivate","Modal","disconnectedCallback","unlockBodyScrolling","removeEventListener","componentDidLoad","render","Host","createColorClasses","color","showing","alert__overlay","div","classList"],"sources":["./src/components/alert/alert.scss?tag=nano-alert&encapsulation=shadow","./src/components/alert/alert.tsx"],"sourcesContent":["@use 'sass:map';\n@use 'sass:list';\n\n@import '../../global/style/nano-theme/base';\n@import '../../global/style/nano-theme/colours';\n@import '../../global/style/nano-theme/layers';\n\n:host {\n  /**\n   * @prop --border-radius: defaults to #{$layer-border-radius};\n   * @prop --border-color: defaults to #{$layer-border-color};\n   * @prop --border-width: defaults to #{$layer-border-width};\n   * @prop --background: defaults to #{$layer-bg-color};\n   * @prop --tint-color: defaults to var(--nano-color-base, #{nano-color(primary, base)});\n   * @prop --icon-size: defaults to 1.5rem;\n   * @prop --scrim-color: overlay colour of alert display. Defaults to #{$layer-overlay-dark};\n   * @prop --close-button-color: defaults to #{map.get($colors, mediumgrey)} ;\n   */\n\n  --border-radius: #{$layer-border-radius};\n  --border-color: #{$layer-border-color};\n  --border-width: #{$layer-border-width};\n  --background: #{$layer-bg-color};\n  --tint-color: var(--nano-color-base, #{nano-color(primary, base)});\n  --icon-size: 2rem;\n  --scrim-color: #{$layer-overlay-dark};\n  --close-button-color: #{map.get($colors, palegrey)};\n\n  display: block;\n}\n\n:host(.nano-color) {\n  --tint-color: var(--nano-color-base, #{nano-color(primary, base)});\n}\n\n.alert {\n  position: relative;\n  background-color: var(--background);\n  border: solid var(--border-width) var(--border-color);\n  border-block-start-width: 4px;\n  border-block-start-color: var(--tint-color);\n  border-radius: var(--border-radius);\n  opacity: 0;\n  transform: scale(0.9);\n  transition:\n    #{$transition-medium} opacity ease,\n    #{$transition-fast} transform ease;\n\n  &:focus {\n    outline: none;\n  }\n\n  &:not(.alert--showing) {\n    @include hidden;\n  }\n\n  &--open {\n    opacity: 1;\n    transform: none;\n  }\n\n  &--toasty,\n  &--modal {\n    box-shadow: #{$layer-shadow-large};\n    margin: #{$spacing-medium};\n  }\n\n  &--modal {\n    &.alert--nodismiss {\n      animation: cannotClose 0.25s ease-in-out 1;\n\n      @keyframes cannotClose {\n        0% {\n          transform: scale(1);\n        }\n\n        50% {\n          transform: scale(1.08);\n        }\n\n        100% {\n          transform: scale(1);\n        }\n      }\n    }\n  }\n}\n\n.alert__content {\n  display: flex;\n  align-items: stretch;\n}\n\n.alert__modal-wrap {\n  position: fixed;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  inset: 0;\n  z-index: #{$layer-index-alert};\n}\n\n.alert__message {\n  flex: 1 1 auto;\n  padding: #{$spacing-medium};\n  overflow: hidden;\n  line-height: 1.6;\n}\n\n.alert__close {\n  --color: var(--close-button-color);\n\n  flex: 0 0 auto;\n  display: flex;\n  align-items: center;\n  font-size: 1.1em;\n  padding-inline: 0 #{$spacing-medium};\n  padding-block: 0;\n}\n\n.alert__footer {\n  padding: 0 #{$spacing-small} 0;\n  display: flex;\n  flex-direction: row;\n  justify-content: space-around;\n  align-items: center;\n\n  ::slotted(*) {\n    flex: 1;\n    margin: 0 #{$spacing-small} #{$spacing-medium} !important;\n  }\n}\n\n.alert__overlay {\n  position: fixed;\n  inset: 0;\n  background-color: var(--scrim-color);\n  opacity: 0;\n  transition: #{$transition-fast} opacity;\n  z-index: #{$layer-index-alert};\n  backdrop-filter: blur(#{$layer-overlay-blur});\n  pointer-events: all;\n\n  &--open {\n    opacity: 1;\n  }\n}\n\n.alert__icon {\n  flex: 0 0 auto;\n  display: flex;\n  align-items: center;\n  font-size: var(--icon-size);\n\n  ::slotted(*) {\n    color: var(--tint-color);\n    margin-inline-start: #{$spacing-medium};\n  }\n}\n","import {\n  Component,\n  ComponentInterface,\n  Element,\n  Event,\n  EventEmitter,\n  Method,\n  Prop,\n  State,\n  Watch,\n  h,\n  Host,\n  VNode,\n} from '@stencil/core';\nimport Modal from '../../utils/modal';\nimport { lockBodyScrolling, unlockBodyScrolling } from '../../utils/scroll';\nimport { createColorClasses } from '../../utils/theme';\nimport type { Color } from '../../interface';\n\nlet toastStackTr: HTMLElement;\nlet toastStackTl: HTMLElement;\nlet toastStackBl: HTMLElement;\nlet toastStackBr: HTMLElement;\n\nif (globalThis['document']) {\n  toastStackTr = Object.assign(document.createElement('div'), {\n    className: 'nano-toast-stack nano-toast-stack--tr',\n  });\n  toastStackTl = Object.assign(document.createElement('div'), {\n    className: 'nano-toast-stack nano-toast-stack--tl',\n  });\n  toastStackBl = Object.assign(document.createElement('div'), {\n    className: 'nano-toast-stack nano-toast-stack--bl',\n  });\n  toastStackBr = Object.assign(document.createElement('div'), {\n    className: 'nano-toast-stack nano-toast-stack--br',\n  });\n}\n\n/**\n * Alerts are used to display important messages either inline, as toast notifications or as modals requiring action.\n * @slot - The alert's content.\n * @slot icon - An icon to show in the alert.\n * @slot footer - Place items at the bottom of the alert. Best used with `button` elements - esp when used as with the `alert()` method.\n */\n@Component({\n  tag: 'nano-alert',\n  styleUrl: 'alert.scss',\n  shadow: true,\n})\nexport class Alert implements ComponentInterface {\n  private autoHideTimeout: ReturnType<typeof setTimeout>;\n  private panel: HTMLElement;\n  private overlay: HTMLElement;\n  private modal: Modal;\n  private originalTrigger: HTMLElement | null;\n  private addedTransEnd = false;\n  private goingToHide = false;\n  private goingToShow = false;\n\n  @State() isModal = false;\n  @State() isToast = false;\n  @State() isShowing = false;\n  @State() label: string;\n  @State() noDismiss = false;\n\n  @Element() host: HTMLNanoAlertElement;\n\n  /** Indicates whether or not the alert is open. You can use this in lieu of the show/hide methods. */\n  @Prop({ mutable: true, reflect: true }) open = false;\n\n  @Watch('open')\n  handleOpenChange() {\n    this.open ? this.show() : this.hide();\n  }\n\n  /** Set to true to make the alert closable. */\n  @Prop({ reflect: true }) closable = false;\n\n  /** The color to use from the application's color palette. */\n  @Prop({ reflect: true }) color?: Color;\n\n  /**\n   * The length of time, in milliseconds, the alert will show before closing itself. If the user interacts with the\n   * alert before it closes (e.g. moves the mouse over it), the timer will restart.\n   */\n  @Prop() duration = Infinity;\n\n  @Watch('duration')\n  handleDurationChange() {\n    this.restartAutoHide();\n  }\n\n  /**\n   * Relocate the dialog to the root of the DOM.\n   * Most useful in conjunction with `alert()` when parental elements\n   * have css stacking constraints which don't allow for `position: fixed`\n   */\n  @Prop() hoist = false;\n\n  @Watch('hoist')\n  handleHoistChange() {\n    if (!this.hoist || document.body.children[0] === this.host) return;\n    document.body.prepend(this.host);\n  }\n\n  /** Emitted when the alert opens. Calling `event.preventDefault()` will prevent it from being opened. */\n  @Event() nanoShow: EventEmitter;\n\n  /** Emitted after the alert opens and all transitions are complete. */\n  @Event() nanoAfterShow: EventEmitter;\n\n  /** Emitted when the alert closes. Calling `event.preventDefault()` will prevent it from being closed. */\n  @Event() nanoHide: EventEmitter;\n\n  /** Emitted after the alert closes and all transitions are complete. */\n  @Event() nanoAfterHide: EventEmitter;\n\n  /** Shows the alert. */\n  @Method()\n  async show() {\n    if (this.goingToShow) {\n      return;\n    }\n    const nanoShow = this.nanoShow.emit();\n    if (nanoShow.defaultPrevented) {\n      this.open = false;\n      return false;\n    }\n\n    this.host.hidden = false;\n    this.goingToShow = true;\n    this.open = true;\n    requestAnimationFrame(() => {\n      this.isShowing = true;\n      this.goingToShow = false;\n    });\n\n    if (this.duration < Infinity) {\n      clearTimeout(this.autoHideTimeout);\n      this.autoHideTimeout = setTimeout(() => this.hide(), this.duration);\n    }\n  }\n\n  /** Hides the alert */\n  @Method()\n  async hide() {\n    if (this.goingToHide) {\n      return;\n    }\n    const nanoHide = this.nanoHide.emit();\n\n    if (nanoHide.defaultPrevented) {\n      this.open = true;\n      return false;\n    }\n    this.goingToHide = true;\n    this.open = false;\n\n    requestAnimationFrame(() => (this.goingToHide = false));\n    clearTimeout(this.autoHideTimeout);\n  }\n\n  /**\n   * Displays the alert as a toast notification. This will move the alert out of its position in the DOM and, when\n   * dismissed, it will be removed from the DOM completely. By storing a reference to the alert, you can reuse it by\n   * calling this method again. The returned promise will resolve after the alert is hidden.\n   *\n   * @param position options are tr (top-right - default), tl (top-left), br (bottom-right), bl (bottom-left)\n   * @returns a promise which will resolve after the alert has hidden\n   */\n  @Method()\n  async toast(position: 'tr' | 'tl' | 'bl' | 'br' = 'tr') {\n    this.isToast = true;\n    return new Promise<void>((resolve) => {\n      let toastStack: HTMLElement;\n      switch (position) {\n        case 'tl':\n          toastStack = toastStackTl;\n          break;\n        case 'bl':\n          toastStack = toastStackBl;\n          break;\n        case 'br':\n          toastStack = toastStackBr;\n          break;\n        default:\n          toastStack = toastStackTr;\n          break;\n      }\n\n      if (!toastStack.parentElement) {\n        document.body.appendChild(toastStack);\n      }\n\n      toastStack.appendChild(this.host);\n      this.connectedCallback();\n      this.show();\n\n      const onClose = () => {\n        this.host.remove();\n        this.isToast = false;\n        resolve();\n\n        // Remove the toast stack from the DOM when there are no more alerts\n        if (!toastStack.querySelector('nano-alert')) {\n          toastStack.remove();\n        }\n      };\n\n      this.host.addEventListener('nanoAfterHide', onClose, { once: true });\n      this.host.addEventListener('nano-after-hide', onClose, { once: true });\n    });\n  }\n\n  /**\n   * Displays the alert as a dialog / modal - more akin to a traditional js alert().\n   * @param label a label for assistive technology\n   */\n  @Method()\n  async alert(label: string) {\n    this.isModal = true;\n    this.label = label;\n\n    return new Promise<void>((resolve) => {\n      if (!document.body.contains(this.host)) {\n        document.body.appendChild(this.host);\n      }\n\n      this.modal.activate();\n      lockBodyScrolling(this.host);\n      this.originalTrigger = document.activeElement as HTMLElement;\n\n      requestAnimationFrame(() => {\n        this.show();\n      });\n\n      const onOpen = () =>\n        requestAnimationFrame(() => this.panel.focus({ preventScroll: true }));\n\n      const onClose = () => {\n        this.modal.deactivate();\n        this.host.remove();\n        this.label = undefined;\n        this.isModal = false;\n        resolve();\n\n        // Restore focus to the original trigger\n        if (\n          this.originalTrigger &&\n          typeof this.originalTrigger.focus === 'function'\n        ) {\n          setTimeout(() => this.originalTrigger.focus());\n        }\n      };\n\n      this.host.addEventListener('nanoAfterShow', onOpen, { once: true });\n      this.host.addEventListener('nano-after-show', onOpen, { once: true });\n\n      this.host.addEventListener('nanoAfterHide', onClose, {\n        once: true,\n      });\n      this.host.addEventListener('nano-after-hide', onClose, {\n        once: true,\n      });\n    });\n  }\n\n  private handleMouseMove = () => {\n    this.restartAutoHide();\n  };\n\n  private handleCloseClick = () => {\n    this.hide();\n  };\n\n  private handleTransitionEnd = (event: TransitionEvent) => {\n    if (\n      event.propertyName === 'opacity' &&\n      (event.target === this.panel || event.target === this.overlay)\n    ) {\n      this.host.hidden = !this.open;\n      this.isShowing = this.open;\n      this.open ? this.nanoAfterShow.emit() : this.nanoAfterHide.emit();\n    }\n  };\n\n  private handleButtonClick = (e: PointerEvent & { target: HTMLElement }) => {\n    if (e.defaultPrevented) return;\n    if (e.target.tagName && e.target.tagName.toLowerCase() === 'button')\n      this.hide();\n  };\n\n  private restartAutoHide = () => {\n    clearTimeout(this.autoHideTimeout);\n    if (this.open && this.duration < Infinity) {\n      this.autoHideTimeout = setTimeout(() => this.hide(), this.duration);\n    }\n  };\n\n  connectedCallback() {\n    this.modal = new Modal(this.host);\n    this.handleHoistChange();\n    this.host.addEventListener('click', this.handleButtonClick);\n\n    if (this.panel) {\n      this.addedTransEnd = true;\n      this.panel.addEventListener('transitionend', this.handleTransitionEnd);\n    }\n  }\n\n  disconnectedCallback() {\n    unlockBodyScrolling(this.host);\n    this.host.removeEventListener('click', this.handleButtonClick);\n\n    this.addedTransEnd = false;\n    if (this.panel)\n      this.panel.removeEventListener('transitionend', this.handleTransitionEnd);\n  }\n\n  componentDidLoad() {\n    // Show on init if open\n    if (this.open) {\n      this.show();\n    }\n    if (!this.addedTransEnd) {\n      this.panel.addEventListener('transitionend', this.handleTransitionEnd);\n    }\n  }\n\n  private Panel = (): VNode => {\n    return (\n      <div\n        ref={(el) => (this.panel = el)}\n        part=\"panel\"\n        class={{\n          alert: true,\n          'alert--open': this.open,\n          'alert--toasty': this.isToast,\n          'alert--modal': !!this.isModal,\n          'alert--showing': this.isShowing,\n          'alert--nodismiss': this.noDismiss,\n        }}\n        role={!!this.isModal ? 'alertdialog' : 'alert'}\n        aria-live=\"assertive\"\n        aria-atomic=\"true\"\n        aria-hidden={this.open ? 'false' : 'true'}\n        aria-modal={!!this.isModal ? 'true' : undefined}\n        aria-label={this.label ? this.label : undefined}\n        onMouseMove={this.handleMouseMove}\n        tabIndex={!!this.isModal ? 0 : undefined}\n      >\n        <div class=\"alert__content\">\n          <div part=\"icon\" class=\"alert__icon\">\n            <slot name=\"icon\" />\n          </div>\n          <div part=\"message\" class=\"alert__message\">\n            <slot />\n          </div>\n          {this.closable && (\n            <div class=\"alert__close\">\n              <nano-icon-button\n                class=\"alert__close\"\n                iconName=\"light/times\"\n                label=\"close menu\"\n                onClick={this.handleCloseClick}\n              ></nano-icon-button>\n            </div>\n          )}\n        </div>\n        <div class=\"alert__footer\">\n          <slot name=\"footer\" />\n        </div>\n      </div>\n    );\n  };\n\n  render() {\n    return (\n      <Host\n        class={{ ...createColorClasses(this.color) }}\n        showing={this.isShowing}\n      >\n        {this.isModal && [\n          <div\n            part=\"overlay\"\n            class={{\n              alert__overlay: true,\n              'alert__overlay--open': this.open,\n            }}\n            ref={(div) => (this.overlay = div)}\n          />,\n          <div\n            class=\"alert__modal-wrap\"\n            onClick={(e: MouseEvent & { target: HTMLElement }) => {\n              if (!e.target.classList.contains('alert__modal-wrap')) return;\n              this.noDismiss = true;\n              setTimeout(() => (this.noDismiss = false), 250);\n            }}\n          >\n            <this.Panel />\n          </div>,\n        ]}\n        {!this.isModal && <this.Panel />}\n      </Host>\n    );\n  }\n}\n"],"mappings":"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"}

package/dist/nano-components/nano-algolia-filter.entry.js

@@ -0,0 +1,5 @@
+/*!
+ * Web Components for Nanopore digital Web Apps
+ */
+import{r as t,c as i,w as s,h as e,a as h,g as n}from"./index-9695db0a.js";import{C as l}from"./component-store-f7eb0a56.js";import{W as o}from"./algolia-data-1b42827c.js";import"./throttle-ac4fcefa.js";const r=":host{box-sizing:border-box}*,*::before,*::after{box-sizing:border-box}[hidden]{display:none !important}:host{display:none}:host ::slotted([slot=filter-template]){display:none !important}:host(.show-filter){display:block}";const a=class{constructor(s){t(this,s);this.nanoFilterChanged=i(this,"nanoFilterChanged",7);this.nanoTplUpdated=i(this,"nanoTplUpdated",7);this.filterId=null;this.tplWillRnder=new Promise((t=>{this.tplDidRnder=t}));this.changeEvent=undefined;this.internalValue=[undefined];this.showFilter=false;this.indexResults=null;this.filterChanged=null;this.facets=undefined;this.tplRenderFn=undefined;this.globalStoreMethod=undefined;this.filterName=null;this.value="";this.operator="or";this.storeId=undefined;this.storeMethod="session"}valueSet(){const t=this.value;let i;if(typeof t==="string")i=t.length?t.split("|"):[];else i=this.value;if(this.didValueChange(i)){const t=this.setFieldValues(i);if(t&&t.length)this.internalValue=i;else{this.tplWillRnder.then((t=>{this.setFieldValues(i);this.internalValue=i}))}}}valueChanged(){this.value=this.internalValue;this.nanoFilterChanged.emit({filterId:this.filterId,facetName:this.filterName,value:this.internalValue,operator:this.operator})}appliedFilterChanged(){if(this.filterName&&this.filterChanged&&(this.filterChanged!==this.filterId||this.operator==="and")){this.updateContent()}}tplUpdate(){this.updateContent()}handleFilterChange(){if(this.indexResults&&this.indexResults.appliedFilters){const t=this.indexResults.appliedFilters.find((t=>t.name===this.filterName));if(!t)return;this.tplWillRnder.then((i=>{const s=this.setFieldValues(t.values);if(s&&s.length)this.value=s}))}this.updateContent()}handleChangeEvent(){const t=this.getFieldValues();if(this.didValueChange(t)){this.internalValue=t;return true}return false}updateContent(){const t=this.outputSlot||this.outputEle;if(!this.el)return;if(!this.templateStr)this.showFilter=true;else if(!this.filterName||!t||this.templateStr&&(!this.indexResults||!this.indexResults.origFilters[this.filterName])){this.showFilter=false}if(!t)return;if(!this.indexResults){if(this.templateStr){s((()=>{t.innerHTML=this.tplRenderFn(this.templateStr,{orig:{},dyn:{},selected:this.internalValue&&this.internalValue.length?this.internalValue:this.value});if(!this.value||!this.value.length)this.handleChangeEvent()}))}else if(!this.value||!this.value.length)this.handleChangeEvent();return}s((()=>{t.innerHTML=this.tplRenderFn(this.templateStr,{orig:Object.assign({},this.indexResults.origFilters[this.filterName]),dyn:Object.assign({},this.indexResults.dynFilters[this.filterName]),selected:this.internalValue&&this.internalValue.length?this.internalValue:this.value});this.tplDidRnder();this.setFieldValues();if(!this.showFilter)this.showFilter=true;this.nanoTplUpdated.emit(this.el)}))}getFieldValues(){const t=[];const i=this.outputSlot.querySelectorAll('input[type="checkbox"], input[type="radio"], select');for(let s=0;s<i.length;s++){const e=i[s];if(e.type==="select-multiple"){const i=e;for(let s=0;s<i.options.length;s++){if(!i.options[s].selected||!i.options[s].value.length)continue;t.push(i.options[s].value)}}else if(e.type!=="checkbox"&&e.type!=="radio"||e.checked&&e.value.length){t.push(e.value)}}return t}setFieldValues(t){t=t||this.internalValue;if(!t)return;const i=[];const s=this.outputSlot.querySelectorAll('input[type="checkbox"], input[type="radio"], select, nano-select, nano-checkbox');for(let e=0;e<s.length;e++){const h=s[e];if(h.disabled||h.type==="file"||h.type==="reset"||h.type==="submit"||h.type==="button")continue;if(h.type==="select-multiple"||h.type==="select-one"){const s=h;for(let e=0;e<s.options.length;e++){if(!t.includes(s.options[e].value))s.options[e].selected=false;else{i.push(s.value);s.options[e].selected=true;if(h.type==="select-one")s.value=s.options[e].value}}}else if(["checkbox","radio","tag","segment","segment-pill"].includes(h.type)){if(t.includes(h.value)){i.push(h.value);h.checked=true}else if(!t.length&&!h.value.length){h.checked=true}else h.checked=false}}return i}didValueChange(t){if(!!this.internalValue&&!t)return true;if(!this.internalValue&&!t)return false;if(this.internalValue&&t.length!==this.internalValue.length)return true;let i=false;for(let s=0;s<t.length;s++){if(!i&&(!this.internalValue||!this.internalValue.includes(t[s])))i=true}return i}connectedCallback(){this.templateSlot=this.el.querySelector('[slot="filter-template"]');this.outputSlot=this.el.querySelector('[slot="output"]');this.filterId=this.filterName+"_"+f++;if(!!this.templateSlot){this.templateStr=this.templateSlot.innerHTML;this.templateStr=this.templateStr.replace(/=&gt;/gm,"=>")}}componentWillLoad(){if(this.storeId)l.init(this,["value"],this.storeMethod||this.globalStoreMethod,this.storeId)}componentDidLoad(){this.updateContent();if(this.templateStr&&this.filterName&&this.indexResults&&this.indexResults.origFilters[this.filterName])this.showFilter=true}render(){return e(h,{class:{"show-filter":this.showFilter}},e("div",{ref:t=>this.outputEle=t},e("slot",{name:"output"})))}get el(){return n(this)}static get watchers(){return{value:["valueSet"],internalValue:["valueChanged"],facets:["appliedFilterChanged"],tplRenderFn:["tplUpdate"],indexResults:["handleFilterChange"]}}};o(a,["globalStoreMethod","indexResults","filterChanged","facets","tplRenderFn","changeEvent"]);let f=0;a.style=r;export{a as nano_algolia_filter};
+//# sourceMappingURL=nano-algolia-filter.entry.js.map

package/dist/nano-components/nano-algolia-filter.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["algoliaFilterCss","AlgoliaFilter","this","filterId","tplWillRnder","Promise","resolve","tplDidRnder","undefined","valueSet","valStr","value","vals","length","split","didValueChange","foundVals","setFieldValues","internalValue","then","_","valueChanged","nanoFilterChanged","emit","facetName","filterName","operator","appliedFilterChanged","filterChanged","updateContent","tplUpdate","handleFilterChange","indexResults","appliedFilters","foundValue","find","filter","name","values","handleChangeEvent","getFieldValues","outputTo","outputSlot","outputEle","el","templateStr","showFilter","origFilters","writeTask","innerHTML","tplRenderFn","orig","dyn","selected","Object","assign","dynFilters","nanoTplUpdated","fields","querySelectorAll","i","field","type","select","n","options","push","checked","found","disabled","includes","newVal","hasChanged","connectedCallback","templateSlot","querySelector","filterIds","replace","componentWillLoad","storeId","ComponentStore","init","storeMethod","globalStoreMethod","componentDidLoad","render","h","Host","class","ref","div","Wormhole"],"sources":["./src/components/algolia/algolia-filter.scss?tag=nano-algolia-filter&encapsulation=shadow","./src/components/algolia/algolia-filter.tsx"],"sourcesContent":[":host {\n  display: none;\n\n  ::slotted([slot='filter-template']) {\n    display: none !important;\n  }\n}\n\n:host(.show-filter) {\n  display: block;\n}\n","import {\n  Component,\n  h,\n  Element,\n  Host,\n  Prop,\n  Watch,\n  State,\n  EventEmitter,\n  Event,\n  writeTask,\n  Listen,\n} from '@stencil/core';\nimport {\n  ComponentStore,\n  StorageMethods,\n} from '../../utils/store/component-store';\nimport {\n  SearchChangeEvent,\n  Wormhole,\n  WormholeConsumerConstructor,\n} from '../algolia/algolia-data';\nimport type {\n  IndexResult,\n  FilterChangeEventDetail,\n  AlgoliaFacet,\n} from '../../interface';\n\n/**\n * Displays and syncs algolia filters\n * Must be nested within an nano-algolia component.\n * @slot filter-template - Template string (format from nano-algolia 'tplEngine' property).\n * @slot output - A placeholder for template output.\n */\n@Component({\n  tag: 'nano-algolia-filter',\n  shadow: true,\n  styleUrl: 'algolia-filter.scss',\n})\nexport class AlgoliaFilter {\n  @Element() el: HTMLNanoAlgoliaFilterElement;\n\n  private templateStr: string;\n  private templateSlot: HTMLElement;\n  private outputSlot: HTMLElement;\n  private outputEle: HTMLElement;\n  private filterId: string = null;\n  private tplDidRnder;\n  private tplWillRnder = new Promise((resolve) => {\n    this.tplDidRnder = resolve;\n  });\n\n  @State() changeEvent: SearchChangeEvent;\n  @State() internalValue: Array<string> = [undefined];\n  @State() showFilter: boolean = false;\n  @State() indexResults: IndexResult = null;\n  @State() filterChanged: string = null;\n  @State() facets: AlgoliaFacet;\n  @State() tplRenderFn: (...args: any[]) => any;\n  @State() globalStoreMethod: StorageMethods;\n\n  /**\n   * Name of this filter - must match an appropriate algolia facet on a parent nano-algolia index to display\n   */\n  @Prop() filterName: string = null;\n\n  /**\n   * Set values of this filter. Will result in form elements being selected. '|' delimited string or array.\n   */\n  @Prop({ mutable: true }) value: string | Array<string> = '';\n\n  /**\n   * The internal operator joining filter values.\n   */\n  @Prop() operator: 'or' | 'and' = 'or';\n\n  /**\n   * Store search queries (against this ID) to the component store.\n   * Use in conjunction with storeMethod\n   */\n  @Prop() storeId?: string;\n\n  /**\n   * The method of storage.\n   * Either session storage, url hash (after the '#') or url query (after the '?').\n   */\n  @Prop() storeMethod: StorageMethods = 'session';\n\n  /**\n   * Emitted when the filter value changes\n   */\n  @Event() nanoFilterChanged!: EventEmitter<FilterChangeEventDetail>;\n\n  /**\n   * Emitted when templates are updated\n   */\n  @Event() nanoTplUpdated!: EventEmitter<HTMLNanoAlgoliaFilterElement>;\n\n  // Public facing. When changed attempts to 'check' any relevant fields in the template.\n  @Watch('value')\n  valueSet() {\n    const valStr = this.value as string;\n    let vals;\n\n    if (typeof valStr === 'string')\n      vals = valStr.length ? valStr.split('|') : [];\n    else vals = this.value as Array<string>;\n\n    if (this.didValueChange(vals)) {\n      const foundVals = this.setFieldValues(vals);\n      // found in template, set the internal state (this emits the changed event)\n      if (foundVals && foundVals.length) this.internalValue = vals;\n      // not found in template, wait for it to render.\n      else {\n        this.tplWillRnder.then((_) => {\n          this.setFieldValues(vals);\n          this.internalValue = vals;\n        });\n      }\n    }\n  }\n\n  // Value has changed and is reflected in template. Emit event.\n  @Watch('internalValue')\n  valueChanged() {\n    this.value = this.internalValue;\n    this.nanoFilterChanged.emit({\n      filterId: this.filterId,\n      facetName: this.filterName,\n      value: this.internalValue,\n      operator: this.operator,\n    });\n  }\n\n  // New facets from algolia. Update template\n  @Watch('facets')\n  appliedFilterChanged() {\n    if (\n      this.filterName &&\n      this.filterChanged &&\n      (this.filterChanged !== this.filterId || this.operator === 'and')\n    ) {\n      this.updateContent();\n    }\n  }\n\n  @Watch('tplRenderFn')\n  tplUpdate() {\n    this.updateContent();\n  }\n\n  @Watch('indexResults')\n  handleFilterChange() {\n    if (this.indexResults && this.indexResults.appliedFilters) {\n      const foundValue = this.indexResults.appliedFilters.find(\n        (filter) => filter.name === this.filterName\n      );\n      if (!foundValue) return;\n\n      this.tplWillRnder.then((_) => {\n        const foundVals = this.setFieldValues(foundValue.values);\n        if (foundVals && foundVals.length) this.value = foundVals;\n      });\n    }\n    this.updateContent();\n  }\n\n  @Listen('nanoChange')\n  @Listen('change')\n  handleChangeEvent() {\n    const vals = this.getFieldValues();\n    if (this.didValueChange(vals)) {\n      this.internalValue = vals;\n      return true;\n    }\n    return false;\n  }\n\n  private updateContent() {\n    const outputTo = this.outputSlot || this.outputEle;\n    if (!this.el) return;\n\n    // there's no template so show output right away\n    if (!this.templateStr) this.showFilter = true;\n    // there's a template but no index set so hide filters atm\n    else if (\n      !this.filterName ||\n      !outputTo ||\n      (this.templateStr &&\n        (!this.indexResults || !this.indexResults.origFilters[this.filterName]))\n    ) {\n      this.showFilter = false;\n    }\n\n    // there's no output element so nothing else to do\n    if (!outputTo) return;\n\n    // there's no index set atm but get any static filter values so we can apply them\n    if (!this.indexResults) {\n      if (this.templateStr) {\n        writeTask(() => {\n          outputTo.innerHTML = this.tplRenderFn(this.templateStr, {\n            orig: {},\n            dyn: {},\n            selected:\n              this.internalValue && this.internalValue.length\n                ? this.internalValue\n                : this.value,\n          });\n          if (!this.value || !this.value.length) this.handleChangeEvent();\n        });\n      } else if (!this.value || !this.value.length) this.handleChangeEvent();\n      return;\n    }\n\n    // everything is in place - render as normal and set values\n    writeTask(() => {\n      outputTo.innerHTML = this.tplRenderFn(this.templateStr, {\n        orig: { ...this.indexResults.origFilters[this.filterName] },\n        dyn: { ...this.indexResults.dynFilters[this.filterName] },\n        selected:\n          this.internalValue && this.internalValue.length\n            ? this.internalValue\n            : this.value,\n      });\n      this.tplDidRnder();\n      this.setFieldValues();\n\n      if (!this.showFilter) this.showFilter = true;\n      this.nanoTplUpdated.emit(this.el);\n    });\n  }\n\n  // go through form elements and extract their current value\n  private getFieldValues() {\n    const values = [];\n    const fields = this.outputSlot.querySelectorAll(\n      'input[type=\"checkbox\"], input[type=\"radio\"], select'\n    );\n\n    for (let i = 0; i < fields.length; i++) {\n      const field = fields[i] as HTMLInputElement;\n\n      // If a multi-select, get all selections\n      if (field.type === 'select-multiple') {\n        const select: HTMLSelectElement = field as any;\n        for (let n = 0; n < select.options.length; n++) {\n          if (!select.options[n].selected || !select.options[n].value.length)\n            continue;\n          values.push(select.options[n].value);\n        }\n      } else if (\n        (field.type !== 'checkbox' && field.type !== 'radio') ||\n        (field.checked && field.value.length)\n      ) {\n        values.push(field.value);\n      }\n    }\n    return values;\n  }\n\n  // go through form elements and select / check them as appropriate\n  private setFieldValues(vals?: string[]): void | string[] {\n    vals = vals || this.internalValue;\n    if (!vals) return;\n\n    const found = [];\n    const fields = this.outputSlot.querySelectorAll(\n      'input[type=\"checkbox\"], input[type=\"radio\"], select, nano-select, nano-checkbox'\n    );\n\n    for (let i = 0; i < fields.length; i++) {\n      const field = fields[i] as HTMLInputElement;\n\n      if (\n        field.disabled ||\n        field.type === 'file' ||\n        field.type === 'reset' ||\n        field.type === 'submit' ||\n        field.type === 'button'\n      )\n        continue;\n\n      if (field.type === 'select-multiple' || field.type === 'select-one') {\n        const select: HTMLSelectElement = field as any;\n        for (let n = 0; n < select.options.length; n++) {\n          if (!vals.includes(select.options[n].value))\n            select.options[n].selected = false;\n          else {\n            found.push(select.value);\n            select.options[n].selected = true;\n            if (field.type === 'select-one')\n              select.value = select.options[n].value;\n          }\n        }\n      } else if (\n        ['checkbox', 'radio', 'tag', 'segment', 'segment-pill'].includes(\n          field.type\n        )\n      ) {\n        if (vals.includes(field.value)) {\n          found.push(field.value);\n          field.checked = true;\n        } else if (!vals.length && !field.value.length) {\n          field.checked = true;\n        } else field.checked = false;\n      }\n    }\n    return found;\n  }\n\n  private didValueChange(newVal: Array<string>) {\n    if (!!this.internalValue && !newVal) return true;\n    if (!this.internalValue && !newVal) return false;\n    if (this.internalValue && newVal.length !== this.internalValue.length)\n      return true;\n\n    let hasChanged = false;\n    for (let i = 0; i < newVal.length; i++) {\n      if (\n        !hasChanged &&\n        (!this.internalValue || !this.internalValue.includes(newVal[i]))\n      )\n        hasChanged = true;\n    }\n    return hasChanged;\n  }\n\n  connectedCallback() {\n    this.templateSlot = this.el.querySelector('[slot=\"filter-template\"]');\n    this.outputSlot = this.el.querySelector('[slot=\"output\"]');\n    this.filterId = this.filterName + '_' + filterIds++;\n\n    if (!!this.templateSlot) {\n      this.templateStr = this.templateSlot.innerHTML;\n      this.templateStr = this.templateStr.replace(/=&gt;/gm, '=>');\n    }\n  }\n\n  componentWillLoad() {\n    if (this.storeId)\n      ComponentStore.init(\n        this,\n        ['value'],\n        this.storeMethod || this.globalStoreMethod,\n        this.storeId\n      );\n  }\n\n  componentDidLoad() {\n    this.updateContent();\n\n    if (\n      this.templateStr &&\n      this.filterName &&\n      this.indexResults &&\n      this.indexResults.origFilters[this.filterName]\n    )\n      this.showFilter = true;\n  }\n\n  render() {\n    return (\n      <Host\n        class={{\n          'show-filter': this.showFilter,\n        }}\n      >\n        <div ref={(div) => (this.outputEle = div)}>\n          <slot name=\"output\" />\n        </div>\n      </Host>\n    );\n  }\n}\n\nWormhole(AlgoliaFilter as WormholeConsumerConstructor, [\n  'globalStoreMethod',\n  'indexResults',\n  'filterChanged',\n  'facets',\n  'tplRenderFn',\n  'changeEvent',\n]);\nlet filterIds = 0;\n"],"mappings":"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"}

package/dist/nano-components/nano-algolia-pagination.entry.js

@@ -0,0 +1,5 @@
+/*!
+ * Web Components for Nanopore digital Web Apps
+ */
+import{r as t,c as s,h as i,a as e,g as n}from"./index-9695db0a.js";import{W as a}from"./algolia-data-1b42827c.js";const h=class{constructor(i){t(this,i);this.nanoPageChanged=s(this,"nanoPageChanged",7);this.currentPage=null;this.canGoPrev=false;this.canGoNext=false;this.show=true;this.tplRenderFn=undefined;this.indexResults=null;this.infiniteScroll=false;this.maxToShow=null}currentPageChange(){}infiniteScrollChange(){this.show=!this.infiniteScroll}async nextPage(){}async prevPage(){}async goToPage(t){console.info(t)}updateContent(){this.outputTo=this.outputSlot||this.outputEle;if(!this.templateStr||!this.outputTo||!this.indexResults){this.show=false;return}}componentWillLoad(){this.templateSlot=this.el.querySelector('[slot="filter-template"]');this.outputSlot=this.el.querySelector('[slot="output"]');if(!!this.templateSlot)this.templateStr=this.templateSlot.innerHTML}componentDidLoad(){this.updateContent()}render(){return i(e,{class:{"show-pagination":this.show}},i("div",{ref:t=>this.outputEle=t},i("slot",{name:"output"})))}get el(){return n(this)}static get watchers(){return{currentPage:["currentPageChange"],infiniteScroll:["infiniteScrollChange"]}}};a(h,["indexResults","filterChanged","tplRenderFn"]);export{h as nano_algolia_pagination};
+//# sourceMappingURL=nano-algolia-pagination.entry.js.map

package/dist/nano-components/nano-algolia-pagination.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["AlgoliaPagination","currentPageChange","infiniteScrollChange","this","show","infiniteScroll","async","page","console","info","updateContent","outputTo","outputSlot","outputEle","templateStr","indexResults","componentWillLoad","templateSlot","el","querySelector","innerHTML","componentDidLoad","render","h","Host","class","ref","div","name","Wormhole"],"sources":["./src/components/algolia/algolia-pagination.tsx"],"sourcesContent":["import {\n  Component,\n  h,\n  Element,\n  Host,\n  Prop,\n  Watch,\n  State,\n  Method,\n  Event,\n  EventEmitter,\n} from '@stencil/core';\nimport { Wormhole, WormholeConsumerConstructor } from '../algolia/algolia-data';\nimport type { IndexResult } from '../../interface';\n\n/**\n * Displays results from Algolia searches.\n * TODO / WIP */\n@Component({\n  tag: 'nano-algolia-pagination',\n  shadow: true,\n})\nexport class AlgoliaPagination {\n  @Element() el: HTMLNanoAlgoliaPaginationElement;\n\n  private outputEle: HTMLDivElement;\n  private outputSlot: HTMLElement;\n  private outputTo: HTMLElement;\n  private templateStr: string;\n  private templateSlot: HTMLElement;\n\n  @State() currentPage: number = null;\n  @State() canGoPrev: boolean = false;\n  @State() canGoNext: boolean = false;\n  @State() show: boolean = true;\n  @State() tplRenderFn: (...args: any[]) => any;\n  @State() indexResults: IndexResult = null;\n  @State() infiniteScroll: boolean = false;\n\n  /** Max number of page numbers to show */\n  @Prop() maxToShow: number = null;\n\n  /**\n   * Emitted when the page number changes\n   */\n  @Event() nanoPageChanged!: EventEmitter<{ page: number }>;\n\n  @Watch('currentPage')\n  currentPageChange() {}\n\n  @Watch('infiniteScroll')\n  infiniteScrollChange() {\n    this.show = !this.infiniteScroll;\n  }\n\n  /** Go to next page from current */\n  @Method()\n  async nextPage() {}\n\n  /** Go to previous page from current */\n  @Method()\n  async prevPage() {}\n\n  /** Go to a particular page */\n  @Method()\n  async goToPage(page: number) {\n    console.info(page);\n  }\n\n  private updateContent() {\n    this.outputTo = this.outputSlot || this.outputEle;\n    if (!this.templateStr || !this.outputTo || !this.indexResults) {\n      this.show = false;\n      return;\n    }\n  }\n\n  componentWillLoad() {\n    this.templateSlot = this.el.querySelector('[slot=\"filter-template\"]');\n    this.outputSlot = this.el.querySelector('[slot=\"output\"]');\n\n    if (!!this.templateSlot) this.templateStr = this.templateSlot.innerHTML;\n  }\n\n  componentDidLoad() {\n    this.updateContent();\n  }\n\n  render() {\n    return (\n      <Host\n        class={{\n          'show-pagination': this.show,\n        }}\n      >\n        <div ref={(div) => (this.outputEle = div)}>\n          <slot name=\"output\" />\n        </div>\n      </Host>\n    );\n  }\n}\n\n// Use the injectProps method to pass from the tunnel as props to the component\nWormhole(AlgoliaPagination as WormholeConsumerConstructor, [\n  'indexResults',\n  'filterChanged',\n  'tplRenderFn',\n]);\n"],"mappings":";;;yHAsBaA,EAAiB,M,2FASG,K,eACD,M,eACA,M,UACL,K,6CAEY,K,oBACF,M,eAGP,I,CAQ5BC,oBAAiB,CAGjBC,uBACEC,KAAKC,MAAQD,KAAKE,c,CAKpBC,iBAAc,CAIdA,iBAAc,CAIdA,eAAeC,GACbC,QAAQC,KAAKF,E,CAGPG,gBACNP,KAAKQ,SAAWR,KAAKS,YAAcT,KAAKU,UACxC,IAAKV,KAAKW,cAAgBX,KAAKQ,WAAaR,KAAKY,aAAc,CAC7DZ,KAAKC,KAAO,MACZ,M,EAIJY,oBACEb,KAAKc,aAAed,KAAKe,GAAGC,cAAc,4BAC1ChB,KAAKS,WAAaT,KAAKe,GAAGC,cAAc,mBAExC,KAAMhB,KAAKc,aAAcd,KAAKW,YAAcX,KAAKc,aAAaG,S,CAGhEC,mBACElB,KAAKO,e,CAGPY,SACE,OACEC,EAACC,EAAI,CACHC,MAAO,CACL,kBAAmBtB,KAAKC,OAG1BmB,EAAA,OAAKG,IAAMC,GAASxB,KAAKU,UAAYc,GACnCJ,EAAA,QAAMK,KAAK,Y,mIAQrBC,EAAS7B,EAAkD,CACzD,eACA,gBACA,uB"}

package/dist/nano-components/nano-algolia-results.entry.js

@@ -0,0 +1,5 @@
+/*!
+ * Web Components for Nanopore digital Web Apps
+ */
+import{r as t,c as s,B as i,d as h,h as e,a as n,g as a}from"./index-9695db0a.js";import{S as l,W as d}from"./algolia-data-1b42827c.js";const o=class{constructor(i){t(this,i);this.nanoPageChanged=s(this,"nanoPageChanged",7);this.nanoTplUpdated=s(this,"nanoTplUpdated",7);this.append=false;this.shouldClear=true;this.currHitNum=0;this.showResults=false;this.tplRenderFn=undefined;this.results=null;this.indexResults=null;this.resultsPage=0;this.changeEvent=l.Init;this.facets=undefined;this.isLoading=true;this.infiniteScroll=false;this.appendPages=false}addContentIndex(){this.shouldPageClear();if(this.shouldClear||this.resultsPage===0)this.currHitNum=0;if(this.indexResults&&this.indexResults.results){this.indexResults.results.map((t=>{t._uIndex=this.currHitNum++}))}}resultsChange(){this.shouldPageClear();this.updateResultContent();this.infiniteScrollChange()}headerFooterChange(){this.updateStartEndContent()}appendChange(){this.append=this.infiniteScroll?true:this.appendPages}infiniteScrollChange(){this.append=this.infiniteScroll?true:this.appendPages;this.infiniteScroll?this.attachIO():this.detachIO()}handlePageChage(){this.infiniteScroll?this.attachIO():this.detachIO()}handleLoading(){if(!this.isLoading)this.infiniteScrollChange()}shouldPageClear(){this.shouldClear=this.changeEvent===l.Page?!this.append:true}nextPage(){this.shouldClear=!this.append;this.nanoPageChanged.emit({page:this.resultsPage+1})}attachIO(){if(!this.infiniteScrollBar||!this.infiniteScroll||this.io||!i.isBrowser||typeof window==="undefined"||!window.IntersectionObserver)return;this.io=new window.IntersectionObserver((async t=>{if(t[0].isIntersecting||t[1]&&t[1].isIntersecting){this.nextPage();this.detachIO()}}),{document,rootMargin:"100px",threshold:1});this.io.observe(this.infiniteScrollBar)}detachIO(){if(this.io){this.io.disconnect();this.io=null}}updateStartEndContent(){if(this.startTpl&&this.startOutputSlot){this.startOutputSlot.innerHTML=this.tplRenderFn(this.startTpl,this.indexResults)}if(this.endOutputSlot&&this.endTpl){this.endOutputSlot.innerHTML=this.tplRenderFn(this.endTpl,this.indexResults)}this.nanoTplUpdated.emit(this.el)}updateResultContent(){this.outputTo=this.outputSlot||this.outputEle;if(!this.resultTpl||!this.indexResults)return;if(this.shouldClear)this.outputTo.innerHTML="";if(!this.tplRenderFn)return;const t=document.createElement("div");t.innerHTML=this.tplRenderFn(this.resultTpl,this.indexResults);Array.from(t.children).forEach((t=>{this.outputTo.appendChild(t)}));this.shouldClear=true;this.nanoTplUpdated.emit(this.el)}connectedCallback(){h((()=>{this.startTplSlot=this.el.querySelector('[slot="start-template"]');this.startOutputSlot=this.el.querySelector('[slot="start-output"]');if(!!this.startTplSlot){this.startTpl=this.startTplSlot.innerHTML;this.startTpl=this.startTpl.replace(/=>/gm,"=>")}this.resultTplSlot=this.el.querySelector('[slot="result-template"]');this.outputSlot=this.el.querySelector('[slot="result-output"]');if(!!this.resultTplSlot){this.resultTpl=this.resultTplSlot.innerHTML;this.resultTpl=this.resultTpl.replace(/=>/gm,"=>")}this.endTplSlot=this.el.querySelector('[slot="end-template"]');this.endOutputSlot=this.el.querySelector('[slot="end-output"]');if(!!this.endTplSlot){this.endTpl=this.endTplSlot.innerHTML;this.endTpl=this.endTpl.replace(/=>/gm,"=>")}if(this.indexResults){this.addContentIndex();this.updateResultContent()}}))}componentDidLoad(){this.updateStartEndContent()}disconnectedCallback(){if(this.io){this.io.disconnect();this.io=undefined}}render(){return e(n,{class:{"show-results":this.showResults}},e("div",{class:"default"},e("slot",null)),e("div",{ref:t=>this.outputEle=t},e("slot",{name:"start-output"}),e("slot",{name:"result-output"}),e("div",{ref:t=>this.infiniteScrollBar=t}),e("slot",{name:"end-output"})))}get el(){return a(this)}static get watchers(){return{results:["addContentIndex","resultsChange"],tplRenderFn:["resultsChange"],facets:["headerFooterChange"],appendPages:["appendChange"],infiniteScroll:["infiniteScrollChange"],resultsPage:["handlePageChage"],isLoading:["handleLoading"]}}};d(o,["indexResults","results","tplRenderFn","resultsPage","changeEvent","facets","isLoading"]);export{o as nano_algolia_results};
+//# sourceMappingURL=nano-algolia-results.entry.js.map

package/dist/nano-components/nano-algolia-results.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["AlgoliaResults","this","append","shouldClear","currHitNum","SearchChangeEvent","Init","addContentIndex","shouldPageClear","resultsPage","indexResults","results","map","res","_uIndex","resultsChange","updateResultContent","infiniteScrollChange","headerFooterChange","updateStartEndContent","appendChange","infiniteScroll","appendPages","attachIO","detachIO","handlePageChage","handleLoading","isLoading","changeEvent","Page","nextPage","nanoPageChanged","emit","page","infiniteScrollBar","io","Build","isBrowser","window","IntersectionObserver","async","data","isIntersecting","document","rootMargin","threshold","observe","disconnect","startTpl","startOutputSlot","innerHTML","tplRenderFn","endOutputSlot","endTpl","nanoTplUpdated","el","outputTo","outputSlot","outputEle","resultTpl","div","createElement","Array","from","children","forEach","child","appendChild","connectedCallback","readTask","startTplSlot","querySelector","replace","resultTplSlot","endTplSlot","componentDidLoad","disconnectedCallback","undefined","render","h","Host","class","showResults","ref","name","Wormhole"],"sources":["./src/components/algolia/algolia-results.tsx"],"sourcesContent":["import {\n  Component,\n  h,\n  Element,\n  Host,\n  Watch,\n  State,\n  Build,\n  EventEmitter,\n  Event,\n  Prop,\n  readTask,\n} from '@stencil/core';\nimport { Wormhole, SearchChangeEvent } from '../algolia/algolia-data';\nimport type {\n  IndexResult,\n  AlgoliaResultHit,\n  PageChangeEventDetail,\n  AlgoliaFacet,\n} from '../../interface';\n\n/**\n * Displays and syncs results from Algolia searches.\n * Must be nested within an nano-algolia component.\n * @slot start-template - Template string (format from nano-algolia 'tplEngine' property).\n * @slot start-output - A placeholder for template output.\n * @slot result-template - Template string (format from nano-algolia 'tplEngine' property).\n * @slot result-output - A placeholder for template output.\n * @slot end-template - Template string (format from nano-algolia 'tplEngine' property).\n * @slot end-output - A placeholder for template output.\n */\n@Component({\n  tag: 'nano-algolia-results',\n  shadow: true,\n})\nexport class AlgoliaResults {\n  @Element() el: HTMLNanoAlgoliaResultsElement;\n\n  private resultTpl: string;\n  private resultTplSlot: HTMLElement;\n  private startTpl: string;\n  private startTplSlot: HTMLElement;\n  private endTpl: string;\n  private endTplSlot: HTMLElement;\n  private outputSlot: HTMLElement;\n  private outputEle: HTMLDivElement;\n  private outputTo: HTMLElement;\n  private startOutputSlot: HTMLElement;\n  private endOutputSlot: HTMLElement;\n\n  private io?: IntersectionObserver;\n  private infiniteScrollBar: HTMLDivElement;\n  private append: boolean = false;\n  private shouldClear: boolean = true;\n  private currHitNum: number = 0;\n\n  @State() showResults: boolean = false;\n  @State() tplRenderFn: (...args: any[]) => any;\n  @State() results: AlgoliaResultHit[] = null;\n  @State() indexResults: IndexResult = null;\n  @State() resultsPage: number = 0;\n  @State() changeEvent: SearchChangeEvent = SearchChangeEvent.Init;\n  @State() facets: AlgoliaFacet;\n  @State() isLoading: boolean = true;\n\n  /**\n   * Load and append pages automatically on scroll\n   */\n  @Prop() infiniteScroll: boolean = false;\n\n  /**\n   * Whether new pages loaded by pagination will replace or be appended to the results block\n   * (this will be ignored if 'infiniteScroll' is set to true)\n   */\n  @Prop() appendPages: boolean = false;\n\n  /**\n   * Emitted when the page number changes\n   */\n  @Event() nanoPageChanged!: EventEmitter<PageChangeEventDetail>;\n\n  /**\n   * Emitted when templates are updated\n   */\n  @Event() nanoTplUpdated!: EventEmitter<HTMLNanoAlgoliaResultsElement>;\n\n  // For append / infinite-scroll it's useful to have a universal index on render\n  @Watch('results')\n  addContentIndex() {\n    this.shouldPageClear();\n    if (this.shouldClear || this.resultsPage === 0) this.currHitNum = 0;\n    if (this.indexResults && this.indexResults.results) {\n      this.indexResults.results.map((res) => {\n        (res as any)._uIndex = this.currHitNum++;\n      });\n    }\n  }\n\n  // Update content template and perhaps add IO for infinite scrolling\n  @Watch('results')\n  @Watch('tplRenderFn')\n  resultsChange() {\n    this.shouldPageClear();\n    // console.log('going to do update', this.resultsPage, this.results.length);\n    this.updateResultContent();\n    this.infiniteScrollChange();\n  }\n\n  // We have a foot / head slot template.\n  // Can be useful to display current filter / search meta\n  @Watch('facets')\n  headerFooterChange() {\n    this.updateStartEndContent();\n  }\n\n  @Watch('appendPages')\n  appendChange() {\n    this.append = this.infiniteScroll ? true : this.appendPages;\n  }\n\n  @Watch('infiniteScroll')\n  infiniteScrollChange() {\n    this.append = this.infiniteScroll ? true : this.appendPages;\n    this.infiniteScroll ? this.attachIO() : this.detachIO();\n  }\n\n  @Watch('resultsPage')\n  handlePageChage() {\n    this.infiniteScroll ? this.attachIO() : this.detachIO();\n  }\n\n  @Watch('isLoading')\n  handleLoading() {\n    if (!this.isLoading) this.infiniteScrollChange();\n  }\n\n  // Decide whether incoming content should clear or not.\n  // if incoming change event is from a pagechange AND the current page is 0 OR appendPages option set...\n  // Then leave up to the current, set append behaviour. Other clear it all out.\n  private shouldPageClear() {\n    this.shouldClear =\n      this.changeEvent === SearchChangeEvent.Page ? !this.append : true;\n  }\n\n  // Called by IO. Emits page change event to parent which then iterated the global page count.\n  private nextPage() {\n    this.shouldClear = !this.append;\n    this.nanoPageChanged.emit({ page: this.resultsPage + 1 });\n  }\n\n  private attachIO() {\n    if (\n      !this.infiniteScrollBar ||\n      !this.infiniteScroll ||\n      this.io ||\n      !Build.isBrowser ||\n      typeof window === 'undefined' ||\n      !(window as any).IntersectionObserver\n    )\n      return;\n\n    this.io = new (window as any).IntersectionObserver(\n      async (data: IntersectionObserverEntry[]) => {\n        if (data[0].isIntersecting || (data[1] && data[1].isIntersecting)) {\n          this.nextPage();\n          this.detachIO();\n        }\n      },\n      { document, rootMargin: '100px', threshold: 1 }\n    );\n    this.io.observe(this.infiniteScrollBar);\n  }\n\n  private detachIO() {\n    if (this.io) {\n      this.io.disconnect();\n      this.io = null;\n    }\n  }\n\n  private updateStartEndContent() {\n    // clear start slot if present\n    if (this.startTpl && this.startOutputSlot) {\n      this.startOutputSlot.innerHTML = this.tplRenderFn(\n        this.startTpl,\n        this.indexResults\n      );\n    }\n    // clear end slot if present\n    if (this.endOutputSlot && this.endTpl) {\n      this.endOutputSlot.innerHTML = this.tplRenderFn(\n        this.endTpl,\n        this.indexResults\n      );\n    }\n    this.nanoTplUpdated.emit(this.el);\n  }\n\n  private updateResultContent() {\n    this.outputTo = this.outputSlot || this.outputEle;\n\n    if (!this.resultTpl || !this.indexResults) return;\n\n    // after filtering or new index - clear all content.\n    // after pagination when the 'appendPages' set to true - don't clear results content\n    if (this.shouldClear) this.outputTo.innerHTML = '';\n\n    if (!this.tplRenderFn) return;\n\n    const div = document.createElement('div');\n    div.innerHTML = this.tplRenderFn(this.resultTpl, this.indexResults);\n\n    Array.from(div.children).forEach((child) => {\n      this.outputTo.appendChild(child);\n    });\n\n    this.shouldClear = true;\n    this.nanoTplUpdated.emit(this.el);\n  }\n\n  connectedCallback() {\n    readTask(() => {\n      this.startTplSlot = this.el.querySelector('[slot=\"start-template\"]');\n      this.startOutputSlot = this.el.querySelector('[slot=\"start-output\"]');\n      if (!!this.startTplSlot) {\n        this.startTpl = this.startTplSlot.innerHTML;\n        this.startTpl = this.startTpl.replace(/=&gt;/gm, '=>');\n      }\n\n      this.resultTplSlot = this.el.querySelector('[slot=\"result-template\"]');\n      this.outputSlot = this.el.querySelector('[slot=\"result-output\"]');\n      if (!!this.resultTplSlot) {\n        this.resultTpl = this.resultTplSlot.innerHTML;\n        this.resultTpl = this.resultTpl.replace(/=&gt;/gm, '=>');\n      }\n\n      this.endTplSlot = this.el.querySelector('[slot=\"end-template\"]');\n      this.endOutputSlot = this.el.querySelector('[slot=\"end-output\"]');\n      if (!!this.endTplSlot) {\n        this.endTpl = this.endTplSlot.innerHTML;\n        this.endTpl = this.endTpl.replace(/=&gt;/gm, '=>');\n      }\n      if (this.indexResults) {\n        this.addContentIndex();\n        this.updateResultContent();\n      }\n    });\n  }\n\n  componentDidLoad() {\n    this.updateStartEndContent();\n  }\n\n  disconnectedCallback() {\n    if (this.io) {\n      this.io.disconnect();\n      this.io = undefined;\n    }\n  }\n\n  render() {\n    return (\n      <Host\n        class={{\n          'show-results': this.showResults,\n        }}\n      >\n        <div class=\"default\">\n          <slot />\n        </div>\n        <div ref={(div) => (this.outputEle = div)}>\n          <slot name=\"start-output\" />\n          <slot name=\"result-output\" />\n          <div ref={(div) => (this.infiniteScrollBar = div)}></div>\n          <slot name=\"end-output\" />\n        </div>\n      </Host>\n    );\n  }\n}\n\nWormhole(AlgoliaResults, [\n  'indexResults',\n  'results',\n  'tplRenderFn',\n  'resultsPage',\n  'changeEvent',\n  'facets',\n  'isLoading',\n]);\n"],"mappings":"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"}

package/dist/nano-components/nano-algolia.entry.js

@@ -0,0 +1,5 @@
+/*!
+ * Web Components for Nanopore digital Web Apps
+ */
+import{g as t,e,r as i,c as s,w as n,d as r,h as o,a as l}from"./index-9695db0a.js";import{a as h}from"./algoliasearch-lite.esm.browser-d71a28dc.js";import{g as a}from"./dom-8599fac1.js";import{C as f}from"./component-store-f7eb0a56.js";import{d as c}from"./throttle-ac4fcefa.js";import{S as u}from"./algolia-data-1b42827c.js";var d=new Map;var p=function(t,e){var i=t.fields,s=t.updater;i.forEach((function(t){s(t,e[t])}))};var m={create:function(e,i){var s=t(e);var n=new Map;var r={wormholes:n,state:i};d.set(e,r);var o=e.connectedCallback;e.connectedCallback=function(){d.set(e,r);if(o){o.call(e)}};var l=e.disconnectedCallback;e.disconnectedCallback=function(){d.delete(e);if(l){l.call(e)}};s.addEventListener("openWormhole",(function(t){t.stopPropagation();var e=t.detail,i=e.consumer,s=e.onOpen;if(n.has(i))return;if(typeof i!=="symbol"){var o=i.connectedCallback,l=i.disconnectedCallback;i.connectedCallback=function(){n.set(i,t.detail);if(o){o.call(i)}};i.disconnectedCallback=function(){n.delete(i);if(l){l.call(i)}}}n.set(i,t.detail);p(t.detail,r.state);s===null||s===void 0?void 0:s.resolve((function(){n.delete(i)}))}));s.addEventListener("closeWormhole",(function(t){var e=t.detail;n.delete(e)}))},Provider:function(t,i){var s=t.state;var n=e();if(d.has(n)){var r=d.get(n);r.state=s;r.wormholes.forEach((function(t){p(t,s)}))}return i}};class g{constructor(){this.queue=[];this.workingOnPromise=false;this.stop=false;this.limit=null}enqueue(t){return new Promise(((e,i)=>{this.queue.push({promise:t,resolve:e,reject:i});this.dequeue()}))}dequeue(){if(this.workingOnPromise){return false}if(this.stop){this.queue=[];this.stop=false;return}const t=this.queue.shift();if(!t){return false}try{this.workingOnPromise=true;t.promise().then((e=>{this.workingOnPromise=false;t.resolve(e);this.dequeue()})).catch((e=>{this.workingOnPromise=false;t.reject(e);this.dequeue()}))}catch(e){this.workingOnPromise=false;t.reject(e);this.dequeue()}return true}}g.pendingPromise=false;function y(t,e){if(Object.setPrototypeOf){Object.setPrototypeOf(t,e)}else{t.__proto__=e}}function w(t){const e=new Error(t);y(e,w.prototype);return e}w.prototype=Object.create(Error.prototype,{name:{value:"Squirrelly Error",enumerable:false}});function b(t,e,i){const s=e.slice(0,i).split(/\n/);const n=s.length;const r=s[n-1].length+1;t+=" at line "+n+" col "+r+":\n\n"+"  "+e.split(/\n/)[n-1]+"\n"+"  "+Array(r).join(" ")+"^";throw w(t)}const v=new Function("return this")().Promise;let x=false;try{x=new Function("return (async function(){}).constructor")()}catch(t){if(!(t instanceof SyntaxError)){throw t}}function F(t,e){return Object.prototype.hasOwnProperty.call(t,e)}function C(t,e,i){for(const s in e){if(F(e,s)){if(e[s]!=null&&typeof e[s]=="object"&&(s==="storage"||s==="prefixes")&&!i){t[s]=C({},e[s])}else{t[s]=e[s]}}}return t}function I(t,e,i,s){let n;let r;if(typeof e.autoTrim==="string"){n=r=e.autoTrim}else if(Array.isArray(e.autoTrim)){n=e.autoTrim[1];r=e.autoTrim[0]}if(i||i===false){n=i}if(s||s===false){r=s}if(n==="slurp"&&r==="slurp"){return t.trim()}if(n==="_"||n==="slurp"){if(!!String.prototype.trimLeft){t=t.trimLeft()}else{t=t.replace(/^[\s\uFEFF\xA0]+/,"")}}else if(n==="-"||n==="nl"){t=t.replace(/^(?:\n|\r|\r\n)/,"")}if(r==="_"||r==="slurp"){if(!!String.prototype.trimRight){t=t.trimRight()}else{t=t.replace(/[\s\uFEFF\xA0]+$/,"")}}else if(r==="-"||r==="nl"){t=t.replace(/(?:\n|\r|\r\n)$/,"")}return t}const S=/^async +/;const j=/`(?:\\[\s\S]|\${(?:[^{}]|{(?:[^{}]|{[^}]*})*})*}|(?!\${)[^\\`])*`/g;const z=/'(?:\\[\s\w"'\\`]|[^\n\r'\\])*?'/g;const R=/"(?:\\[\s\w"'\\`]|[^\n\r"\\])*?"/g;const _=/[.*+\-?^${}()|[\]\\]/g;function A(t){return _.test(t)?t.replace(_,"\\$&"):t}function k(t,e){if(e.rmWhitespace){t=t.replace(/[\r\n]+/g,"\n").replace(/^\s+|\s+$/gm,"")}j.lastIndex=0;z.lastIndex=0;R.lastIndex=0;const i=e.prefixes;const s=[i.h,i.b,i.i,i.r,i.c,i.e].reduce((function(t,e){if(t&&e){return t+"|"+A(e)}else if(e){return A(e)}else{return t}}),"");const n=new RegExp("([|()]|=>)|"+"('|\"|`|\\/\\*)|\\s*((\\/)?(-|_)?"+A(e.tags[1])+")","g");const r=new RegExp("([^]*?)"+A(e.tags[0])+"(-|_)?\\s*("+s+")?\\s*","g");let o=0;let l=false;function h(i,s){const h={f:[]};let a=0;let f="c";if(s==="h"||s==="b"||s==="c"){f="n"}else if(s==="r"){h.raw=true;s="i"}function c(i){const s=t.slice(o,i);let n=s.trim();if(f==="f"){if(n==="safe"){h.raw=true}else{if(e.async&&S.test(n)){n=n.replace(S,"");h.f.push([n,"",true])}else{h.f.push([n,""])}}}else if(f==="fp"){h.f[h.f.length-1][1]+=n}else if(f==="err"){if(n){const e=s.search(/\S/);b("invalid syntax",t,o+e)}}else{h[f]=n}o=i+1}n.lastIndex=o;let u;while((u=n.exec(t))!==null){const e=u[1];const i=u[2];const d=u[3];const p=u[4];const m=u[5];const g=u.index;if(e){if(e==="("){if(a===0){if(f==="n"){c(g);f="p"}else if(f==="f"){c(g);f="fp"}}a++}else if(e===")"){a--;if(a===0&&f!=="c"){c(g);f="err"}}else if(a===0&&e==="|"){c(g);f="f"}else if(e==="=>"){c(g);o+=1;f="res"}}else if(i){if(i==="/*"){const e=t.indexOf("*/",n.lastIndex);if(e===-1){b("unclosed comment",t,u.index)}n.lastIndex=e+2}else if(i==="'"){z.lastIndex=u.index;const e=z.exec(t);if(e){n.lastIndex=z.lastIndex}else{b("unclosed string",t,u.index)}}else if(i==='"'){R.lastIndex=u.index;const e=R.exec(t);if(e){n.lastIndex=R.lastIndex}else{b("unclosed string",t,u.index)}}else if(i==="`"){j.lastIndex=u.index;const e=j.exec(t);if(e){n.lastIndex=j.lastIndex}else{b("unclosed string",t,u.index)}}}else if(d){c(g);o=g+u[0].length;r.lastIndex=o;l=m;if(p&&s==="h"){s="s"}h.t=s;return h}}b("unclosed tag",t,i);return h}function a(s,n){s.b=[];s.d=[];let f=false;let c=[];function u(t,i){if(t){t=I(t,e,l,i);if(t){t=t.replace(/\\|'/g,"\\$&").replace(/\r\n|\n|\r/g,"\\n");c.push(t)}}}let d;while((d=r.exec(t))!==null){const n=d[1];const r=d[2];const l=d[3]||"";let p;for(const t in i){if(i[t]===l){p=t;break}}u(n,r);o=d.index+d[0].length;if(!p){b("unrecognized tag type: "+l,t,o)}let m=h(d.index,p);const g=m.t;if(g==="h"){const t=m.n||"";if(e.async&&S.test(t)){m.a=true;m.n=t.replace(S,"")}m=a(m);c.push(m)}else if(g==="c"){if(s.n===m.n){if(f){f.d=c;s.b.push(f)}else{s.d=c}return s}else{b("Helper start and end don't match",t,d.index+d[0].length)}}else if(g==="b"){if(f){f.d=c;s.b.push(f)}else{s.d=c}const t=m.n||"";if(e.async&&S.test(t)){m.a=true;m.n=t.replace(S,"")}f=m;c=[]}else if(g==="s"){const t=m.n||"";if(e.async&&S.test(t)){m.a=true;m.n=t.replace(S,"")}c.push(m)}else{c.push(m)}}if(n){u(t.slice(o,t.length),false);s.d=c}else{throw w('unclosed helper "'+s.n+'"')}return s}const f=a({f:[]},true);if(e.plugins){for(let t=0;t<e.plugins.length;t++){const i=e.plugins[t];if(i.processAST){f.d=i.processAST(f.d,e)}}}return f.d}function O(t,e){const i=k(t,e);let s="var tR='';"+(e.useWith?"with("+e.varName+"||{}){":"")+H(i,e)+"if(cb){cb(null,tR)} return tR"+(e.useWith?"}":"");if(e.plugins){for(let t=0;t<e.plugins.length;t++){const i=e.plugins[t];if(i.processFnString){s=i.processFnString(s,e)}}}return s}function T(t,e){for(let i=0;i<e.length;i++){const s=e[i][0];const n=e[i][1];const r=e[i][2];t=(r?"await ":"")+"c.l('F','"+s+"')("+t;if(n){t+=","+n}t+=")"}return t}function P(t,e,i,s,n,r){let o="{exec:"+(n?"async ":"")+N(i,e,t)+",params:["+s+"]";if(r){o+=",name:'"+r+"'"}if(n){o+=",async:true"}o+="}";return o}function E(t,e){let i="[";for(let s=0;s<t.length;s++){const n=t[s];i+=P(e,n.res||"",n.d,n.p||"",n.a,n.n);if(s<t.length){i+=","}}i+="]";return i}function N(t,e,i){return"function("+e+"){var tR='';"+H(t,i)+"return tR}"}function H(t,e){let i=0;const s=t.length;let n="";for(i;i<s;i++){const s=t[i];if(typeof s==="string"){const t=s;n+="tR+='"+t+"';"}else{const t=s.t;let i=s.c||"";const r=s.f;const o=s.n||"";const l=s.p||"";const h=s.res||"";const a=s.b;const f=!!s.a;if(t==="i"){if(e.defaultFilter){i="c.l('F','"+e.defaultFilter+"')("+i+")"}let t=T(i,r);if(!s.raw&&e.autoEscape){t="c.l('F','e')("+t+")"}n+="tR+="+t+";"}else if(t==="h"){if(e.storage.nativeHelpers.get(o)){n+=e.storage.nativeHelpers.get(o)(s,e)}else{let t=(f?"await ":"")+"c.l('H','"+o+"')("+P(e,h,s.d,l,f);if(a){t+=","+E(a,e)}else{t+=",[]"}t+=",c)";n+="tR+="+T(t,r)+";"}}else if(t==="s"){n+="tR+="+T((f?"await ":"")+"c.l('H','"+o+"')({params:["+l+"]},[],c)",r)+";"}else if(t==="e"){n+=i+"\n"}}}return n}class q{constructor(t){this.cache=t}define(t,e){this.cache[t]=e}get(t){return this.cache[t]}remove(t){delete this.cache[t]}reset(){this.cache={}}load(t){C(this.cache,t,true)}}function L(t,e,i,s){if(e&&e.length>0){throw w((s?"Native":"")+"Helper '"+t+"' doesn't accept blocks")}if(i&&i.length>0){throw w((s?"Native":"")+"Helper '"+t+"' doesn't accept filters")}}function $(t,e,i,s,n){i(t[e],e).then((function(r){s+=r;if(e===t.length-1){n(s)}else{$(t,e+1,i,s,n)}}))}function D(t,e,i,s,n,r){s(e[i],t[e[i]]).then((function(o){n+=o;if(i===e.length-1){r(n)}else{D(t,e,i+1,s,n,r)}}))}const M={"&":"&amp;","<":"&lt;",">":"&gt;",'"':"&quot;","'":"&#39;"};function W(t){return M[t]}function U(t){const e=String(t);if(/[&<>"']/.test(e)){return e.replace(/[&<>"']/g,W)}else{return e}}const B=new q({});const Q=new q({each:function(t,e){let i="";const s=t.params[0];L("each",e,false);if(t.async){return new Promise((function(e){$(s,0,t.exec,i,e)}))}else{for(let e=0;e<s.length;e++){i+=t.exec(s[e],e)}return i}},foreach:function(t,e){const i=t.params[0];L("foreach",e,false);if(t.async){return new Promise((function(e){D(i,Object.keys(i),0,t.exec,"",e)}))}else{let e="";for(const s in i){if(!F(i,s))continue;e+=t.exec(s,i[s])}return e}},include:function(t,e,i){L("include",e,false);const s=i.storage.templates.get(t.params[0]);if(!s){throw w('Could not fetch template "'+t.params[0]+'"')}return s(t.params[1],i)},extends:function(t,e,i){const s=t.params[1]||{};s.content=t.exec();for(let t=0;t<e.length;t++){const i=e[t];s[i.name]=i.exec()}const n=i.storage.templates.get(t.params[0]);if(!n){throw w('Could not fetch template "'+t.params[0]+'"')}return n(s,i)},useScope:function(t,e){L("useScope",e,false);return t.exec(t.params[0])}});const G=new q({if:function(t,e){L("if",false,t.f,true);let i="if("+t.p+"){"+H(t.d,e)+"}";if(t.b){for(let s=0;s<t.b.length;s++){const n=t.b[s];if(n.n==="else"){i+="else{"+H(n.d,e)+"}"}else if(n.n==="elif"){i+="else if("+n.p+"){"+H(n.d,e)+"}"}}}return i},try:function(t,e){L("try",false,t.f,true);if(!t.b||t.b.length!==1||t.b[0].n!=="catch"){throw w("native helper 'try' only accepts 1 block, 'catch'")}let i="try{"+H(t.d,e)+"}";const s=t.b[0];i+="catch"+(s.res?"("+s.res+")":"")+"{"+H(s.d,e)+"}";return i},block:function(t,e){L("block",t.b,t.f,true);const i="if(!"+e.varName+"["+t.p+"]){tR+=("+N(t.d,"",e)+")()}else{tR+="+e.varName+"["+t.p+"]}";return i}});const K=new q({e:U});const J={varName:"it",autoTrim:[false,"nl"],autoEscape:true,defaultFilter:false,tags:["{{","}}"],l:function(t,e){if(t==="H"){const t=this.storage.helpers.get(e);if(t){return t}else{throw w("Can't find helper '"+e+"'")}}else if(t==="F"){const t=this.storage.filters.get(e);if(t){return t}else{throw w("Can't find filter '"+e+"'")}}},async:false,storage:{helpers:Q,nativeHelpers:G,filters:K,templates:B},prefixes:{h:"@",b:"#",i:"",r:"*",c:"/",e:"!"},cache:false,plugins:[],useWith:false};J.l.bind(J);function V(t,e){const i={};C(i,J);if(e){C(i,e)}if(t){C(i,t)}i.l.bind(i);return i}function X(t,e){const i=V(e||{});let s=Function;if(i.async){if(x){s=x}else{throw w("This environment doesn't support async/await")}}try{return new s(i.varName,"c","cb",O(t,i))}catch(e){if(e instanceof SyntaxError){throw w("Bad template syntax\n\n"+e.message+"\n"+Array(e.message.length+1).join("=")+"\n"+O(t,i))}else{throw e}}}function Y(t,e){let i;if(e.cache&&e.name&&e.storage.templates.get(e.name)){return e.storage.templates.get(e.name)}if(typeof t==="function"){i=t}else{i=X(t,e)}if(e.cache&&e.name){e.storage.templates.define(e.name,i)}return i}function Z(t,e,i,s){const n=V(i||{});if(n.async){let i;if(!s){if(typeof v==="function"){return new v((function(s,r){try{i=Y(t,n)(e,n);s(i)}catch(t){r(t)}}))}else{throw w("Please provide a callback function, this env doesn't support Promises")}}else{try{Y(t,n)(e,n,s)}catch(t){return s(t)}}}else{return Y(t,n)(e,n)}}const tt=Object.freeze({__proto__:null,compileToString:O,compileScope:H,compileScopeIntoFunction:N,compile:X,parse:k,render:Z,helpers:Q,nativeHelpers:G,filters:K,templates:B,defaultConfig:J,getConfig:V});K.define("date_long",((t,e={year:"numeric",month:"long",day:"numeric"})=>{if(!t)return;const i=new Date(parseInt(t)*1e3);t=i.toLocaleDateString("en-GB",e);return t}));K.define("date_short",((t,e="d/m/y")=>{if(!t)return;const i=new Date(parseInt(t)*1e3);t=e.replace(/(d)/,i.getDate().toString());t=t.replace(/(m)/,(i.getMonth()+1).toString());t=t.replace(/(y)/,i.getFullYear().toString());return t}));K.define("public_name",(t=>{if(!t)return;t=t.split("_").map((t=>t.length<3?t.toUpperCase():t)).join(" ");return t.charAt(0).toUpperCase()+t.slice(1)}));K.define("trim_to",((t,e=100)=>{if(!t)return;if(t.length<=e)return t;return t.substr(0,e)+"..."}));K.define("classname",(t=>{if(!t)return;return t.replace(/[\W]+/g,"")}));K.define("abs_url",((t,e=null,i)=>{if(!e)return t;if(!t)return;let s=undefined;if(e.domains&&i&&i.origin){const t=e.domains.find((t=>t.origin===i.origin));s=t?t.domain:""}else if(e.domain)s=e.domain;if(!s)return t;return t.match(/^http/)?t:location.protocol+"//"+s+t}));K.define("replace",((t,e,i)=>t.replace(e,i)));K.define("remove_spaces",(t=>t.replace(/ /g,"_")));K.define("add_spaces",(t=>t=t.replace(/[_\-]/g," ")));K.define("capitalise",(t=>t=t.charAt(0).toUpperCase()+t.slice(1)));K.define("lowercase",(t=>t=t.toLowerCase()));const et=tt;const it=":host{box-sizing:border-box}*,*::before,*::after{box-sizing:border-box}[hidden]{display:none !important}:host{position:relative;display:block}:host ::slotted([slot=search-template]){display:none !important}.loader{opacity:0;position:fixed;block-size:100%;inline-size:100%;min-block-size:100%;max-block-size:100vh !important;max-inline-size:100vw !important;inset-inline-start:0;inset-block-start:0;z-index:-10;font-size:60px;display:flex;align-items:center;justify-content:center;transition:opacity 0.2s ease, z-index 0.01s ease 0.2s}.loader.loading{opacity:1;z-index:10;transition:z-index 0.01s ease, opacity 0.2s ease 0.01s}.default{block-size:100%}.default:focus{outline:none}.results{opacity:0;outline:none;overflow:auto;transition:transform 0.3s ease, opacity 0.3s ease, visibility 0.01s ease 0.3s, z-index 0.01s ease 0.3s;transform:translate(0, 100px);visibility:hidden;z-index:-1;position:absolute;inset-block-start:0;inset-inline-start:0;display:none}.results-container{position:relative}.results.show{transition:z-index 0.01s ease, visibility 0.01s ease, transform 0.3s ease 0.01s, opacity 0.3s ease 0.01s, overflow 0.01s ease 0.31s;transform:translate(0, 0);visibility:visible;opacity:1;z-index:10;overflow:hidden}.results.shown{block-size:auto !important;inline-size:auto !important;display:block;position:static;transform:none;z-index:auto;visibility:inherit;opacity:initial;overflow:visible}";const st=class{constructor(t){i(this,t);this.nanoDidLoad=s(this,"nanoDidLoad",7);this.nanoResultsShown=s(this,"nanoResultsShown",3);this.nanoBeforeQuery=s(this,"nanoBeforeQuery",7);this.nanoAfterQuery=s(this,"nanoAfterQuery",7);this.nanoNewResults=s(this,"nanoNewResults",7);this.staticFacetFilters={};this.dynFacetFilters={};this.hasLoadSlot=false;this.placedAlgoliaEles=[];this.promiseQueue=new g;this.searchChange=async()=>{if(!this.algoliaIndex)return;if(!this.query||this.query.length<this.minChars){if(!this.browseIndex){if(!this.query||this.query.length===0){this.handleSearchReset();return}else return}else if(this.query!=="*"){this.query="*";return}}this.isLoading=true;setTimeout((async()=>{this.resetPage();await this.algoliaSearch(u.Init);await this.updateContent();setTimeout((t=>this.isLoading=false),800);this.showResults=true;this.nanoResultsShown.emit(this.indexResults)}),200)};this.makeAppliedFilters=()=>{const t=[];const e=e=>{Object.values(e).forEach((e=>{if(e.value&&e.value.length){const i=t.find((t=>t.name===e.facetName));if(!i)t.push({name:e.facetName,values:[...e.value]});else i.values=[...i.values,...e.value]}}))};e(this.dynFacetFilters);e(this.staticFacetFilters);if(t.length)return t;return null};this.algoliaSearch=async t=>this.promiseQueue.enqueue((()=>this.queueSearch(t)));this.queueSearch=async t=>{if(!this.algoliaIndex||!this.query||!this.searchIndex||!this.searchIndex.index)return;this.nanoBeforeQuery.emit(this.indexResults);if(u.Init===t)this.clearAllFacetFilters();const e={filters:this.algoliaFilterStr(),page:this.indexResults?this.indexResults.currentPage:0};if(this.searchIndex.filters)e.facets=this.searchIndex.filters;if(this.searchIndex.hitsPerPage)e.hitsPerPage=this.searchIndex.hitsPerPage;let i=await this.algoliaIndex.search(this.query,e);i=this.fixDomain(i);this.changeEvent=t;if(t===u.Init||!this.indexResults){this.indexResults={currentPage:0,totalHits:i.nbHits,hitsPerPage:null,origFilters:i.facets,query:this.query,domain:this.searchIndex.domain||null,totalHitsWithFilters:0,results:[],totalPages:0,appliedFilters:this.makeAppliedFilters(),indexName:this.searchIndex.name||null,index:this.searchIndex.index}}this.indexResults.dynFilters=i.facets;this.indexResults.results=i.hits;this.indexResults.totalHitsWithFilters=i.nbHits;this.indexResults.currentPage=i.page;this.indexResults.totalPages=i.nbPages;this.indexResults.hitsPerPage=i.hitsPerPage;this.indexResults.query=i.query;if(this.changeEvent!==u.Page&&this.changeEvent!==u.Replica){this.facets=i.facets}this.nanoAfterQuery.emit(this.indexResults);return new Promise((t=>{setTimeout((()=>t("tpl updated")),20)})).then((t=>{this.currentHits=this.indexResults.results;this.resultsPage=this.indexResults.currentPage}))};this.handleSearchReset=()=>{this.showResults=false;this.indexResults=null};this.onResultDisplay=()=>{n((()=>{this.resultsDiv.removeEventListener("transitionend",this.onResultDisplay);if(!this.showResults)this.resultsDiv.style.display="none";else{this.defaultDiv.style.display="none";this.resultsDiv.classList.add("shown");this.resultsDiv.style.minHeight="";this.resultsDiv.style.width=""}}))};this._dynFacetFilters={};this.inputField=undefined;this.algoliaIndex=undefined;this.indeces=[];this.indexResults=undefined;this.filterChanged="";this.currentHits=undefined;this.changeEvent=u.Init;this.isLoading=false;this.wormholeState=this;this.showResults=false;this.resultsPage=0;this.appId=undefined;this.apiKey=undefined;this.searchIndex={};this.searchIndexName="";this.listenTo=null;this.query="";this.operator="and";this.filters=[];this.tplRenderFn=et.render;this.replicaIndex="";this.browseIndex=false;this.minChars=2;this.storeId=undefined;this.storeMethod="session"}handleListenToChange(){if(!this.listenTo)return;const t=document.querySelector(this.listenTo);if(["nano-input","input"].includes(t.tagName.toLocaleLowerCase())){this.inputField=t}}async removeFilters(t,e){if(!t&&!e)this.clearAllFacetFilters();else{Object.keys(this._dynFacetFilters).forEach((i=>{if(t&&this._dynFacetFilters[i].facetName===t){if(!e)this._dynFacetFilters[i].element.value="";else{this._dynFacetFilters[i].element.value=this._dynFacetFilters[i].value.filter((t=>t!==e))}}}))}}onAllTplUpdate(t){t.stopPropagation();if(t.target.tagName==="NANO-ALGOLIA-RESULTS"){requestAnimationFrame((()=>{this.nanoNewResults.emit(this.indexResults)}))}}async onPageChange(t){if(!this.indexResults)return;let e=this.resultsPage;if(t){t.stopPropagation();e=t.detail.page}e=Math.min(this.indexResults.totalPages-1,e);e=Math.max(e,0);if(this.indexResults.currentPage===e)return;this.indexResults.currentPage=e;await this.algoliaSearch(u.Page)}async onFilterChange(t){t.stopPropagation();const e={};const i=t.detail;i.element=t.target;if(this.indexResults){if(this.staticFacetFilters[i.filterId])this.staticFacetFilters[i.filterId]=i;else{e[i.filterId]=i;this._dynFacetFilters=Object.assign(Object.assign({},this._dynFacetFilters),e)}this.indexResults.appliedFilters=this.makeAppliedFilters()}else this.staticFacetFilters[i.filterId]=i;this.filterChanged=i.value&&i.value.length?i.filterId:"all";this.resetPage();this.algoliaSearch(u.Filter)}dynFacetFiltersChange(){Object.values(this._dynFacetFilters).forEach((t=>{if(this.host.ownerDocument===t.element.ownerDocument)this.dynFacetFilters[t.filterId]=t;else delete this.dynFacetFilters[t.filterId]}))}browseIndexChange(){if(this.browseIndex&&(!this.query||this.query.length<this.minChars)){this.query="*"}}inputFieldSet(){if(!this.inputField)return;if(this.query!=="*"&&this.inputField&&this.inputField.value!==this.query)this.inputField.value=this.query}queryChange(){this.searchChange()}async internalIndexSwitch(){if(!this.replicaIndex||!this.indexResults||this.indexResults.index===this.replicaIndex)return;this.indexResults.index=this.replicaIndex;this.algoliaIndex=this.algoliaClient.initIndex(this.indexResults.index);this.resetPage();this.algoliaSearch(u.Replica)}pageChange(){this.onPageChange()}searchIndexNameChange(){if(!this.searchIndexName||!this.searchIndexName.length||this.searchIndex&&this.searchIndex.index===this.searchIndexName)return;this.searchIndex={index:this.searchIndexName}}initAlgoliaClient(){if(!this.appId||!this.apiKey)return;this.algoliaClient=h(this.appId,this.apiKey)}initAlgoliaIndex(){if(!this.algoliaClient||!this.searchIndex)return;if(this.searchIndex.index){if(!this.searchIndex.hitsPerPage)this.searchIndex.hitsPerPage=100;if(this.replicaIndex)this.searchIndex.index=this.replicaIndex;this.searchIndexName=this.searchIndex.index;this.algoliaIndex=this.algoliaClient.initIndex(this.searchIndex.index);this.searchChange()}}showResultsChange(){if(!this.resultsDiv||!this.defaultDiv)return;if(this.showResults){this.resultsDiv.style.width=this.host.scrollWidth+"px";this.resultsDiv.style.minHeight=this.host.scrollHeight+"px";n((()=>{this.resultsDiv.addEventListener("transitionend",this.onResultDisplay);this.resultsDiv.style.display="block";setTimeout((()=>this.resultsDiv.classList.add("show")),50)}))}else{n((()=>{this.resultsDiv.classList.remove("shown");this.defaultDiv.style.display="block";setTimeout((()=>{this.resultsDiv.addEventListener("transitionend",this.onResultDisplay);this.resultsDiv.classList.remove("show");if(!!this.slottedInput)this.slottedInput.focus({preventScroll:true});else this.defaultDiv.focus({preventScroll:true})}),50)}))}}handleFilterpropChange(){this.algoliaSearch(u.Init)}fixDomain(t){if(!this.searchIndex||!this.searchIndex.domain)return t;t.hits.map((t=>{if(t.url&&!t.url.match(/^http/))t.url=location.protocol+"//"+this.searchIndex.domain+t.url}));return t}resetPage(){if(!this.indexResults)return;this.indexResults.currentPage=0}clearAllFacetFilters(){Object.values(this._dynFacetFilters).forEach((t=>{t.element.value=""}));this._dynFacetFilters={}}algoliaFilterStr(){const t={};const e=e=>{let i;let s;Object.keys(e).forEach((n=>{i=e[n];t[n]=t[n]||{name:i.facetName,or:[],and:[],not:[]};s=t[n][i.operator];if(i.value&&i.value.length){t[n][i.operator]=[...s,...i.value]}}))};e(this.dynFacetFilters);e(this.staticFacetFilters);const i=(t,e)=>{if(e.indexOf(" ")>-1)return t+':"'+e+'"';else return t+":"+e};let s=[];let n;let r;Object.values(t).forEach((function(t){Object.keys(t).filter((t=>t.match(/(or|and|not)/))).forEach((e=>{n=t;r=t.name;if(e==="or"||e==="and"){if(n[e].length){s.push("(                 "+n[e].map((t=>{if(t.length)return i(r,t)})).join(" "+e.toLocaleUpperCase()+" ")+"               )")}}else{if(n.not.length){s.push("(                 "+n[e].map((t=>{if(t.length)return"NOT "+i(r,t)})).join(" AND ")+"               )")}}}))}));s=[...this.filters,...s];return s.join(" "+this.operator.toLocaleUpperCase()+" ")}handleInputChange(t){if(t.target!==this.inputField)return;this.query=this.inputField.value}async updateContent(){return this.promiseQueue.enqueue((()=>this.updateContentQueue()))}async updateContentQueue(){const t=this.outputSlot||this.resultsDiv;if(!t||!this.tpl)return"no tpl";const e=document.createElement("div");e.innerHTML=this.tpl;const i=[];this.placedAlgoliaEles=[];Array.from(e.querySelectorAll("nano-algolia, nano-algolia-filter, nano-algolia-results")).forEach(((t,e)=>{const s=document.createElement("div");s.dataset.placeholderId=e.toString();s.classList.add("nano-ele-placeholder");i.push(t);t.parentNode.replaceChild(s,t)}));t.innerHTML=this.tplRenderFn(e.innerHTML.replace(/&gt;/gm,">").replace(/&lt;/gm,"<").replace(/&amp;/gm,"&"),this.indexResults);Array.from(t.querySelectorAll("div.nano-ele-placeholder")).forEach((t=>{t.parentNode.replaceChild(i[parseInt(t.dataset.placeholderId)],t);this.placedAlgoliaEles.push(i[parseInt(t.dataset.placeholderId)])}));if(!this.placedAlgoliaEles.length)return Promise.resolve("algolia setup");return new Promise((e=>{const i=s=>{this.placedAlgoliaEles=this.placedAlgoliaEles.filter((t=>t!==s.detail));if(!this.placedAlgoliaEles.length){setTimeout((()=>e("tpl updated")),500);t.removeEventListener("nanoTplUpdated",i)}};t.addEventListener("nanoTplUpdated",i)}))}componentWillLoad(){r((t=>{this.tplSlot=a(this.host,'[slot="template"]')[0];this.outputSlot=a(this.host,'[slot="output"]')[0];this.slottedInput=a(this.host,'[slot="search-input"]')[0];this.hasLoadSlot=!!a(this.host,'[slot="loader"]')[0];if(!!this.tplSlot)this.tpl=this.tplSlot.innerHTML||this.tplSlot.innerText;if(this.slottedInput&&(this.slottedInput.tagName.toLocaleLowerCase()==="nano-input"||this.slottedInput instanceof HTMLInputElement)){this.inputField=this.slottedInput}else if(this.slottedInput){this.inputField=this.slottedInput.querySelector('nano-input, input:not([type="radio"]):not([type="checkbox"])')}else this.handleListenToChange();n((t=>{if(this.showResults&&this.tpl)this.searchChange()}))}));this.searchIndexNameChange();this.initAlgoliaClient();this.initAlgoliaIndex();m.create(this,this.wormholeState);if(this.storeId){f.init(this,["query","replicaIndex"],this.storeMethod,this.storeId);f.init(this,["apiKey","appId","searchIndex"],"session",this.storeId+"_api")}this.internalIndexSwitch()}connectedCallback(){this.searchChange=c(this.searchChange,300);this.browseIndexChange();this.host.dispatchEvent(new CustomEvent("nanoDidLoad",{detail:this.host}))}render(){const t={indexResults:this.indexResults,results:this.currentHits,filterChanged:this.filterChanged,tplRenderFn:this.tplRenderFn,resultsPage:this.resultsPage,changeEvent:this.changeEvent,facets:this.facets,algoliaIndex:this.algoliaIndex,searchIndex:this.searchIndex,globalStoreMethod:this.storeMethod,isLoading:this.isLoading};return o(l,{class:{"show-results":this.showResults,"is-loading":this.isLoading},"aria-busy":this.isLoading},this.hasLoadSlot&&o("div",{hidden:!this.isLoading},o("slot",{name:"loader"})),!this.hasLoadSlot&&o("div",{class:{loader:true,loading:this.isLoading}},o("nano-spinner",{overlay:true,type:"circle"})),o(m.Provider,{state:t},o("slot",{name:"search-input"}),o("div",{class:"results-container","aria-live":"polite"},o("div",{ref:t=>this.resultsDiv=t,class:"results"},o("slot",{name:"output"})))),o("div",{ref:t=>this.defaultDiv=t,class:"default",tabindex:"-1"},o("slot",null)))}get host(){return t(this)}static get watchers(){return{listenTo:["handleListenToChange"],_dynFacetFilters:["dynFacetFiltersChange"],browseIndex:["browseIndexChange"],inputField:["inputFieldSet"],query:["queryChange"],replicaIndex:["internalIndexSwitch"],resultsPage:["pageChange"],searchIndexName:["searchIndexNameChange"],apiKey:["initAlgoliaClient"],appId:["initAlgoliaClient"],searchIndex:["initAlgoliaIndex"],showResults:["showResultsChange"],filters:["handleFilterpropChange"]}}};st.style=it;export{st as nano_algolia};
+//# sourceMappingURL=nano-algolia.entry.js.map