@nanoporetech-digital/components 7.6.0 → 7.8.0

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

@@ -1 +1 @@
-{"file":"nano-alert.js","mappings":";;;;;;;;;;;AAAA,MAAM,QAAQ,GAAG,s4FAAs4F,CAAC;AACx5F,wBAAe,QAAQ;;ACmBvB,IAAI,YAAyB,CAAC;AAC9B,IAAI,YAAyB,CAAC;AAC9B,IAAI,YAAyB,CAAC;AAC9B,IAAI,YAAyB,CAAC;AAE9B,IAAI,UAAU,CAAC,UAAU,CAAC,EAAE;IAC1B,YAAY,GAAG,MAAM,CAAC,MAAM,CAAC,QAAQ,CAAC,aAAa,CAAC,KAAK,CAAC,EAAE;QAC1D,SAAS,EAAE,uCAAuC;KACnD,CAAC,CAAC;IACH,YAAY,GAAG,MAAM,CAAC,MAAM,CAAC,QAAQ,CAAC,aAAa,CAAC,KAAK,CAAC,EAAE;QAC1D,SAAS,EAAE,uCAAuC;KACnD,CAAC,CAAC;IACH,YAAY,GAAG,MAAM,CAAC,MAAM,CAAC,QAAQ,CAAC,aAAa,CAAC,KAAK,CAAC,EAAE;QAC1D,SAAS,EAAE,uCAAuC;KACnD,CAAC,CAAC;IACH,YAAY,GAAG,MAAM,CAAC,MAAM,CAAC,QAAQ,CAAC,aAAa,CAAC,KAAK,CAAC,EAAE;QAC1D,SAAS,EAAE,uCAAuC;KACnD,CAAC,CAAC;AACL,CAAC;MAaY,KAAK;;;;;;;;;;IACR,eAAe,CAAgC;IAC/C,KAAK,CAAc;IACnB,OAAO,CAAc;IACrB,KAAK,CAAQ;IACb,eAAe,CAAqB;IACpC,WAAW,GAAG,KAAK,CAAC;IACpB,WAAW,GAAG,KAAK,CAAC;IAEnB,OAAO,GAAG,KAAK,CAAC;IAChB,OAAO,GAAG,KAAK,CAAC;IAChB,SAAS,GAAG,KAAK,CAAC;IAClB,KAAK,CAAS;IACd,SAAS,GAAG,KAAK,CAAC;;;IAKa,IAAI,GAAG,KAAK,CAAC;IAGrD,gBAAgB;QACd,IAAI,IAAI,CAAC,IAAI;YAAE,IAAI,CAAC,IAAI,EAAE,CAAC;;YACtB,IAAI,CAAC,IAAI,EAAE,CAAC;KAClB;;IAGwB,QAAQ,GAAG,KAAK,CAAC;;IAGjB,KAAK,CAAS;;;;;IAM/B,QAAQ,GAAG,QAAQ,CAAC;IAG5B,oBAAoB;QAClB,IAAI,CAAC,eAAe,EAAE,CAAC;KACxB;;;;;;IAOO,KAAK,GAAG,KAAK,CAAC;IAGtB,iBAAiB;QACf,IAAI,CAAC,IAAI,CAAC,KAAK,IAAI,QAAQ,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,KAAK,IAAI,CAAC,IAAI;YAAE,OAAO;QACnE,QAAQ,CAAC,IAAI,CAAC,OAAO,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;KAClC;;IAGQ,QAAQ,CAAe;;IAGvB,aAAa,CAAe;;IAG5B,QAAQ,CAAe;;IAGvB,aAAa,CAAe;;;;;IAOrC,MAAM,IAAI;QACR,IAAI,IAAI,CAAC,WAAW;YAAE,OAAO;QAE7B,MAAM,QAAQ,GAAG,IAAI,CAAC,QAAQ,CAAC,IAAI,EAAE,CAAC;QACtC,IAAI,QAAQ,CAAC,gBAAgB,EAAE;YAC7B,IAAI,CAAC,IAAI,GAAG,KAAK,CAAC;YAClB,OAAO,KAAK,CAAC;SACd;QAED,IAAI,CAAC,IAAI,CAAC,MAAM,GAAG,KAAK,CAAC;QACzB,IAAI,CAAC,WAAW,GAAG,IAAI,CAAC;QACxB,IAAI,CAAC,IAAI,GAAG,IAAI,CAAC;QAEjB,IAAI,KAAK,CAAC,SAAS,EAAE;YACnB,qBAAqB,CAAC;gBACpB,IAAI,CAAC,SAAS,GAAG,IAAI,CAAC;gBACtB,IAAI,CAAC,WAAW,GAAG,KAAK,CAAC;aAC1B,CAAC,CAAC;SACJ;aAAM;YACL,IAAI,CAAC,SAAS,GAAG,IAAI,CAAC;YACtB,IAAI,CAAC,WAAW,GAAG,KAAK,CAAC;SAC1B;QAED,IAAI,IAAI,CAAC,QAAQ,GAAG,QAAQ,EAAE;YAC5B,YAAY,CAAC,IAAI,CAAC,eAAe,CAAC,CAAC;YACnC,IAAI,CAAC,eAAe,GAAG,UAAU,CAAC,MAAM,IAAI,CAAC,IAAI,EAAE,EAAE,IAAI,CAAC,QAAQ,CAAC,CAAC;SACrE;KACF;;;;;IAOD,MAAM,IAAI;QACR,IAAI,IAAI,CAAC,WAAW,EAAE;YACpB,OAAO;SACR;QACD,MAAM,QAAQ,GAAG,IAAI,CAAC,QAAQ,CAAC,IAAI,EAAE,CAAC;QAEtC,IAAI,QAAQ,CAAC,gBAAgB,EAAE;YAC7B,IAAI,CAAC,IAAI,GAAG,IAAI,CAAC;YACjB,OAAO,KAAK,CAAC;SACd;QACD,IAAI,CAAC,WAAW,GAAG,IAAI,CAAC;QACxB,IAAI,CAAC,IAAI,GAAG,KAAK,CAAC;QAElB,qBAAqB,CAAC,OAAO,IAAI,CAAC,WAAW,GAAG,KAAK,CAAC,CAAC,CAAC;QACxD,YAAY,CAAC,IAAI,CAAC,eAAe,CAAC,CAAC;KACpC;;;;;;;;;IAWD,MAAM,KAAK,CAAC,WAAsC,IAAI;QACpD,IAAI,CAAC,OAAO,GAAG,IAAI,CAAC;QACpB,OAAO,IAAI,OAAO,CAAO,CAAC,OAAO;YAC/B,IAAI,UAAuB,CAAC;YAC5B,QAAQ,QAAQ;gBACd,KAAK,IAAI;oBACP,UAAU,GAAG,YAAY,CAAC;oBAC1B,MAAM;gBACR,KAAK,IAAI;oBACP,UAAU,GAAG,YAAY,CAAC;oBAC1B,MAAM;gBACR,KAAK,IAAI;oBACP,UAAU,GAAG,YAAY,CAAC;oBAC1B,MAAM;gBACR;oBACE,UAAU,GAAG,YAAY,CAAC;oBAC1B,MAAM;aACT;YAED,IAAI,CAAC,UAAU,CAAC,aAAa,EAAE;gBAC7B,QAAQ,CAAC,IAAI,CAAC,WAAW,CAAC,UAAU,CAAC,CAAC;aACvC;YAED,UAAU,CAAC,WAAW,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;YAClC,IAAI,CAAC,iBAAiB,EAAE,CAAC;YACzB,IAAI,CAAC,IAAI,EAAE,CAAC;YAEZ,MAAM,OAAO,GAAG;gBACd,IAAI,CAAC,IAAI,CAAC,MAAM,EAAE,CAAC;gBACnB,IAAI,CAAC,OAAO,GAAG,KAAK,CAAC;gBACrB,OAAO,EAAE,CAAC;;gBAGV,IAAI,CAAC,UAAU,CAAC,aAAa,CAAC,YAAY,CAAC,EAAE;oBAC3C,UAAU,CAAC,MAAM,EAAE,CAAC;iBACrB;aACF,CAAC;YAEF,IAAI,CAAC,IAAI,CAAC,gBAAgB,CAAC,eAAe,EAAE,OAAO,EAAE,EAAE,IAAI,EAAE,IAAI,EAAE,CAAC,CAAC;YACrE,IAAI,CAAC,IAAI,CAAC,gBAAgB,CAAC,iBAAiB,EAAE,OAAO,EAAE,EAAE,IAAI,EAAE,IAAI,EAAE,CAAC,CAAC;SACxE,CAAC,CAAC;KACJ;;;;;IAOD,MAAM,KAAK,CAAC,KAAa;QACvB,IAAI,CAAC,OAAO,GAAG,IAAI,CAAC;QACpB,IAAI,CAAC,KAAK,GAAG,KAAK,CAAC;QAEnB,OAAO,IAAI,OAAO,CAAO,CAAC,OAAO;YAC/B,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,IAAI,CAAC,EAAE;gBACtC,QAAQ,CAAC,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;aACtC;YAED,IAAI,CAAC,KAAK,CAAC,QAAQ,EAAE,CAAC;YACtB,iBAAiB,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;YAC7B,IAAI,CAAC,eAAe,GAAG,QAAQ,CAAC,aAA4B,CAAC;YAE7D,qBAAqB,CAAC;gBACpB,IAAI,CAAC,IAAI,EAAE,CAAC;aACb,CAAC,CAAC;YAEH,MAAM,MAAM,GAAG,MACb,qBAAqB,CAAC,MAAM,IAAI,CAAC,KAAK,CAAC,KAAK,CAAC,EAAE,aAAa,EAAE,IAAI,EAAE,CAAC,CAAC,CAAC;YAEzE,MAAM,OAAO,GAAG;gBACd,IAAI,CAAC,KAAK,CAAC,UAAU,EAAE,CAAC;gBACxB,IAAI,CAAC,IAAI,CAAC,MAAM,EAAE,CAAC;gBACnB,IAAI,CAAC,KAAK,GAAG,SAAS,CAAC;gBACvB,IAAI,CAAC,OAAO,GAAG,KAAK,CAAC;gBACrB,OAAO,EAAE,CAAC;;gBAGV,IACE,IAAI,CAAC,eAAe;oBACpB,OAAO,IAAI,CAAC,eAAe,CAAC,KAAK,KAAK,UAAU,EAChD;oBACA,UAAU,CAAC,MAAM,IAAI,CAAC,eAAe,CAAC,KAAK,EAAE,CAAC,CAAC;iBAChD;aACF,CAAC;YAEF,IAAI,CAAC,IAAI,CAAC,gBAAgB,CAAC,eAAe,EAAE,MAAM,EAAE,EAAE,IAAI,EAAE,IAAI,EAAE,CAAC,CAAC;YACpE,IAAI,CAAC,IAAI,CAAC,gBAAgB,CAAC,iBAAiB,EAAE,MAAM,EAAE,EAAE,IAAI,EAAE,IAAI,EAAE,CAAC,CAAC;YAEtE,IAAI,CAAC,IAAI,CAAC,gBAAgB,CAAC,eAAe,EAAE,OAAO,EAAE;gBACnD,IAAI,EAAE,IAAI;aACX,CAAC,CAAC;YACH,IAAI,CAAC,IAAI,CAAC,gBAAgB,CAAC,iBAAiB,EAAE,OAAO,EAAE;gBACrD,IAAI,EAAE,IAAI;aACX,CAAC,CAAC;SACJ,CAAC,CAAC;KACJ;IAEO,eAAe,GAAG;QACxB,IAAI,CAAC,eAAe,EAAE,CAAC;KACxB,CAAC;IAEM,gBAAgB,GAAG;QACzB,IAAI,CAAC,IAAI,EAAE,CAAC;KACb,CAAC;IAEM,mBAAmB,GAAG,CAAC,KAAsB;QACnD,IACE,KAAK,CAAC,YAAY,KAAK,SAAS;aAC/B,KAAK,CAAC,MAAM,KAAK,IAAI,CAAC,KAAK,IAAI,KAAK,CAAC,MAAM,KAAK,IAAI,CAAC,OAAO,CAAC,EAC9D;YACA,IAAI,CAAC,IAAI,CAAC,MAAM,GAAG,CAAC,IAAI,CAAC,IAAI,CAAC;YAC9B,IAAI,CAAC,SAAS,GAAG,IAAI,CAAC,IAAI,CAAC;YAE3B,IAAI,IAAI,CAAC,IAAI;gBAAE,IAAI,CAAC,aAAa,CAAC,IAAI,EAAE,CAAC;;gBACpC,IAAI,CAAC,aAAa,CAAC,IAAI,EAAE,CAAC;SAChC;KACF,CAAC;IAEM,iBAAiB,GAAG,CAAC,CAAyC;QACpE,IAAI,CAAC,CAAC,gBAAgB;YAAE,OAAO;QAC/B,IAAI,CAAC,CAAC,MAAM,CAAC,OAAO,IAAI,CAAC,CAAC,MAAM,CAAC,OAAO,CAAC,WAAW,EAAE,KAAK,QAAQ;YACjE,IAAI,CAAC,IAAI,EAAE,CAAC;KACf,CAAC;IAEM,eAAe,GAAG;QACxB,YAAY,CAAC,IAAI,CAAC,eAAe,CAAC,CAAC;QACnC,IAAI,IAAI,CAAC,IAAI,IAAI,IAAI,CAAC,QAAQ,GAAG,QAAQ,EAAE;YACzC,IAAI,CAAC,eAAe,GAAG,UAAU,CAAC,MAAM,IAAI,CAAC,IAAI,EAAE,EAAE,IAAI,CAAC,QAAQ,CAAC,CAAC;SACrE;KACF,CAAC;IAEF,iBAAiB;QACf,IAAI,CAAC,KAAK,GAAG,IAAI,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;QAClC,IAAI,CAAC,iBAAiB,EAAE,CAAC;QACzB,IAAI,CAAC,IAAI,CAAC,gBAAgB,CAAC,OAAO,EAAE,IAAI,CAAC,iBAAiB,CAAC,CAAC;QAC5D,IAAI,CAAC,SAAS,GAAG,OAAO,IAAI,CAAC,IAAI,CAAC,YAAY,CAAC,SAAS,CAAC,KAAK,QAAQ,CAAC;KACxE;IAED,oBAAoB;QAClB,mBAAmB,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;QAC/B,IAAI,CAAC,IAAI,CAAC,mBAAmB,CAAC,OAAO,EAAE,IAAI,CAAC,iBAAiB,CAAC,CAAC;KAChE;IAED,gBAAgB;;QAEd,IAAI,IAAI,CAAC,IAAI,IAAI,CAAC,IAAI,CAAC,SAAS,EAAE;YAChC,IAAI,CAAC,IAAI,EAAE,CAAC;SACb;KACF;IAEO,KAAK,GAAG;QACd,QACE,WACE,GAAG,EAAE,CAAC,GAAG,MAAM,IAAI,CAAC,KAAK,GAAG,GAAG,CAAC,EAChC,IAAI,EAAC,OAAO,EACZ,KAAK,EAAE;gBACL,KAAK,EAAE,IAAI;gBACX,aAAa,EAAE,IAAI,CAAC,IAAI;gBACxB,eAAe,EAAE,IAAI,CAAC,OAAO;gBAC7B,cAAc,EAAE,CAAC,CAAC,IAAI,CAAC,OAAO;gBAC9B,gBAAgB,EAAE,IAAI,CAAC,SAAS;gBAChC,kBAAkB,EAAE,IAAI,CAAC,SAAS;aACnC,EACD,QAAQ,EAAE,IAAI,CAAC,OAAO,GAAG,CAAC,GAAG,SAAS,EACtC,IAAI,EAAE,IAAI,CAAC,OAAO,GAAG,aAAa,GAAG,OAAO,eAClC,WAAW,iBACT,MAAM,iBACL,IAAI,CAAC,SAAS,GAAG,OAAO,GAAG,MAAM,gBAClC,IAAI,CAAC,OAAO,GAAG,MAAM,GAAG,SAAS,gBACjC,IAAI,CAAC,KAAK,GAAG,IAAI,CAAC,KAAK,GAAG,SAAS,EAC/C,WAAW,EAAE,IAAI,CAAC,eAAe,EACjC,eAAe,EAAE,IAAI,CAAC,mBAAmB,IAEzC,WAAK,KAAK,EAAC,gBAAgB,IACzB,WAAK,IAAI,EAAC,MAAM,EAAC,KAAK,EAAC,aAAa,IAClC,YAAM,IAAI,EAAC,MAAM,GAAG,CAChB,EACN,WAAK,IAAI,EAAC,SAAS,EAAC,KAAK,EAAC,gBAAgB,IACxC,eAAQ,CACJ,EACL,IAAI,CAAC,QAAQ,KACZ,WAAK,KAAK,EAAC,cAAc,IACvB,wBACE,KAAK,EAAC,cAAc,EACpB,QAAQ,EAAC,aAAa,EACtB,KAAK,EAAC,YAAY,EAClB,OAAO,EAAE,IAAI,CAAC,gBAAgB,GACZ,CAChB,CACP,CACG,EACN,WAAK,KAAK,EAAC,eAAe,IACxB,YAAM,IAAI,EAAC,QAAQ,GAAG,CAClB,CACF,EACN;KACH,CAAC;IAEF,MAAM;QACJ,QACE,EAAC,IAAI,qDACH,KAAK,EAAE,EAAE,GAAG,kBAAkB,CAAC,IAAI,CAAC,KAAK,CAAC,EAAE,EAC5C,OAAO,EAAE,IAAI,CAAC,SAAS,IAEtB,IAAI,CAAC,OAAO,IAAI;YACf,4DACE,IAAI,EAAC,SAAS,EACd,KAAK,EAAE;oBACL,cAAc,EAAE,IAAI;oBACpB,sBAAsB,EAAE,IAAI,CAAC,IAAI;iBAClC,EACD,GAAG,EAAE,CAAC,GAAG,MAAM,IAAI,CAAC,OAAO,GAAG,GAAG,CAAC,GAClC;YACF,4DACE,KAAK,EAAC,mBAAmB,EACzB,OAAO,EAAE,CAAC,CAAuC;oBAC/C,IAAI,CAAC,CAAC,CAAC,MAAM,CAAC,SAAS,CAAC,QAAQ,CAAC,mBAAmB,CAAC;wBAAE,OAAO;oBAC9D,IAAI,CAAC,SAAS,GAAG,IAAI,CAAC;oBACtB,UAAU,CAAC,OAAO,IAAI,CAAC,SAAS,GAAG,KAAK,CAAC,EAAE,GAAG,CAAC,CAAC;iBACjD,IAED,EAAC,IAAI,CAAC,KAAK,sDAAG,CACV;SACP,EACA,CAAC,IAAI,CAAC,OAAO,IAAI,EAAC,IAAI,CAAC,KAAK,sDAAG,CAC3B,EACP;KACH;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":[],"sources":["src/components/alert/alert.scss?tag=nano-alert&encapsulation=shadow","src/components/alert/alert.tsx"],"sourcesContent":["@use 'sass:map';\n@use '../../global/style/nano-theme/tokens' as tokens;\n@use '../../global/style/utilities/mixins' as mx;\n\n:host {\n  /**\n   * @prop --border-radius: defaults to #{tokens.$layer-border-radius};\n   * @prop --border-color: defaults to #{tokens.$layer-border-color};\n   * @prop --border-width: defaults to #{tokens.$layer-border-width};\n   * @prop --background: defaults to #{tokens.$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 #{tokens.$layer-overlay-dark};\n   * @prop --close-button-color: defaults to #{map.get(tokens.$colors, mediumgrey)} ;\n   */\n\n  --border-radius: #{tokens.$layer-border-radius};\n  --border-color: #{tokens.$layer-border-color};\n  --border-width: #{tokens.$layer-border-width};\n  --background: #{tokens.$layer-bg-color};\n  --tint-color: var(--nano-color-base, #{tokens.nano-color(primary, base)});\n  --icon-size: 2rem;\n  --scrim-color: #{tokens.$layer-overlay-dark};\n  --close-button-color: #{map.get(tokens.$colors, palegrey)};\n\n  display: block;\n}\n\n:host(.nano-color) {\n  --tint-color: var(--nano-color-base, #{tokens.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    #{tokens.$transition-medium} opacity ease,\n    #{tokens.$transition-fast} transform ease;\n\n  &:focus {\n    outline: none;\n  }\n\n  &:not(.alert--showing) {\n    @include mx.hidden;\n  }\n\n  &--open {\n    opacity: 1;\n    transform: none;\n  }\n\n  &--toasty,\n  &--modal {\n    box-shadow: #{tokens.$layer-shadow-large};\n    margin: #{tokens.$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: #{tokens.$layer-index-alert};\n}\n\n.alert__message {\n  flex: 1 1 auto;\n  padding: #{tokens.$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 #{tokens.$spacing-medium};\n  padding-block: 0;\n}\n\n.alert__footer {\n  padding: 0 #{tokens.$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 #{tokens.$spacing-small} #{tokens.$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: #{tokens.$transition-fast} opacity;\n  z-index: #{tokens.$layer-index-alert};\n  backdrop-filter: blur(#{tokens.$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(*), &::slotted(*) {\n    color: var(--tint-color);\n    margin-inline-start: #{tokens.$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  Build,\n} from '@stencil/core';\nimport Modal from '../../utils/modal';\nimport { lockBodyScrolling, unlockBodyScrolling } from '../../utils/scroll';\nimport { createColorClasses } from '../../utils/theme';\nimport type { Color } from '../../types/shared';\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 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    if (this.open) this.show();\n    else 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  /**\n   * Shows the alert.\n   * @returns a promise that resolves after the alert is shown\n   */\n  @Method()\n  async show() {\n    if (this.goingToShow) 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\n    if (Build.isBrowser) {\n      requestAnimationFrame(() => {\n        this.isShowing = true;\n        this.goingToShow = false;\n      });\n    } else {\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  /**\n   * Hides the alert\n   * @returns a promise that resolves after the alert is hidden\n   */\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\n      if (this.open) this.nanoAfterShow.emit();\n      else 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    this.isShowing = typeof this.host.getAttribute('showing') === 'string';\n  }\n\n  disconnectedCallback() {\n    unlockBodyScrolling(this.host);\n    this.host.removeEventListener('click', this.handleButtonClick);\n  }\n\n  componentDidLoad() {\n    // Show on init if open\n    if (this.open && !this.isShowing) {\n      this.show();\n    }\n  }\n\n  private Panel = (): VNode => {\n    return (\n      <div\n        ref={(div) => (this.panel = div)}\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        tabIndex={this.isModal ? 0 : undefined}\n        role={this.isModal ? 'alertdialog' : 'alert'}\n        aria-live=\"assertive\"\n        aria-atomic=\"true\"\n        aria-hidden={this.isShowing ? 'false' : 'true'}\n        aria-modal={this.isModal ? 'true' : undefined}\n        aria-label={this.label ? this.label : undefined}\n        onMouseMove={this.handleMouseMove}\n        onTransitionEnd={this.handleTransitionEnd}\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/xmark\"\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"],"version":3}
+{"file":"nano-alert.js","mappings":"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","names":[],"sources":["src/components/alert/alert.scss?tag=nano-alert&encapsulation=shadow","src/components/alert/alert.tsx"],"sourcesContent":["@use 'sass:map';\n@use '../../global/style/nano-theme/tokens' as tokens;\n@use '../../global/style/utilities/mixins' as mx;\n\n:host {\n  /**\n   * @prop --border-radius: defaults to #{tokens.$layer-border-radius};\n   * @prop --border-color: defaults to #{tokens.$layer-border-color};\n   * @prop --border-width: defaults to #{tokens.$layer-border-width};\n   * @prop --background: defaults to #{tokens.$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 #{tokens.$layer-overlay-dark};\n   * @prop --close-button-color: defaults to #{map.get(tokens.$colors, mediumgrey)} ;\n   */\n\n  --border-radius: #{tokens.$layer-border-radius};\n  --border-color: #{tokens.$layer-border-color};\n  --border-width: #{tokens.$layer-border-width};\n  --background: #{tokens.$layer-bg-color};\n  --tint-color: var(--nano-color-base, #{tokens.nano-color(primary, base)});\n  --icon-size: 2rem;\n  --scrim-color: #{tokens.$layer-overlay-dark};\n  --close-button-color: #{map.get(tokens.$colors, palegrey)};\n\n  display: block;\n}\n\n:host(.nano-color) {\n  --tint-color: var(--nano-color-base, #{tokens.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    #{tokens.$transition-medium} opacity ease,\n    #{tokens.$transition-fast} transform ease;\n\n  &:focus {\n    outline: none;\n  }\n\n  &:not(.alert--showing) {\n    @include mx.hidden;\n  }\n\n  &--open {\n    opacity: 1;\n    transform: none;\n  }\n\n  &--toasty,\n  &--modal {\n    box-shadow: #{tokens.$layer-shadow-large};\n    margin: #{tokens.$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: #{tokens.$layer-index-alert};\n}\n\n.alert__message {\n  flex: 1 1 auto;\n  padding: #{tokens.$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 #{tokens.$spacing-medium};\n  padding-block: 0;\n}\n\n.alert__footer {\n  padding: 0 #{tokens.$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 #{tokens.$spacing-small} #{tokens.$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: #{tokens.$transition-fast} opacity;\n  z-index: #{tokens.$layer-index-alert};\n  backdrop-filter: blur(#{tokens.$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(*), &::slotted(*) {\n    color: var(--tint-color);\n    margin-inline-start: #{tokens.$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  Host,\n  VNode,\n  Build,\n} from '@stencil/core';\nimport Modal from '../../utils/modal';\nimport { lockBodyScrolling, unlockBodyScrolling } from '../../utils/scroll';\nimport { createColorClasses } from '../../utils/theme';\nimport { transformTag, h } from '../../utils/renderer';\nimport type { Color } from '../../types/shared';\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 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    if (this.open) this.show();\n    else 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  /**\n   * Shows the alert.\n   * @returns a promise that resolves after the alert is shown\n   */\n  @Method()\n  async show() {\n    if (this.goingToShow) 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\n    if (Build.isBrowser) {\n      requestAnimationFrame(() => {\n        this.isShowing = true;\n        this.goingToShow = false;\n      });\n    } else {\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  /**\n   * Hides the alert\n   * @returns a promise that resolves after the alert is hidden\n   */\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(transformTag('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\n      if (this.open) this.nanoAfterShow.emit();\n      else 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    this.isShowing = typeof this.host.getAttribute('showing') === 'string';\n  }\n\n  disconnectedCallback() {\n    unlockBodyScrolling(this.host);\n    this.host.removeEventListener('click', this.handleButtonClick);\n  }\n\n  componentDidLoad() {\n    // Show on init if open\n    if (this.open && !this.isShowing) {\n      this.show();\n    }\n  }\n\n  private Panel = (): VNode => {\n    return (\n      <div\n        ref={(div) => (this.panel = div)}\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        tabIndex={this.isModal ? 0 : undefined}\n        role={this.isModal ? 'alertdialog' : 'alert'}\n        aria-live=\"assertive\"\n        aria-atomic=\"true\"\n        aria-hidden={this.isShowing ? 'false' : 'true'}\n        aria-modal={this.isModal ? 'true' : undefined}\n        aria-label={this.label ? this.label : undefined}\n        onMouseMove={this.handleMouseMove}\n        onTransitionEnd={this.handleTransitionEnd}\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/xmark\"\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), 'nano-alert': true }}\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"],"version":3}

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

@@ -1,8 +1,9 @@
 /*!
  * Web Components for Nanopore digital Web Apps
  */
-import { proxyCustomElement, HTMLElement, createEvent, writeTask, h, Host } from '@stencil/core/internal/client';
+import { proxyCustomElement, HTMLElement, createEvent, writeTask, Host } from '@stencil/core/internal/client';
 import { C as ComponentStore } from './component-store.js';
+import { h } from './renderer.js';
 import { W as Wormhole } from './algolia-data.js';
 
 const algoliaFilterCss = ":host{box-sizing:border-box}*,*::before,*::after{box-sizing:border-box}[hidden]{display:none !important}: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}";
@@ -281,9 +282,10 @@ const AlgoliaFilter = /*@__PURE__*/ proxyCustomElement(class AlgoliaFilter exten
             this.showFilter = true;
     }
     render() {
-        return (h(Host, { key: '7fceca55176bed53e7b205f9a76d7756d77d1525', class: {
+        return (h(Host, { key: '81d343828cf739b8e85cab7f56fa48ad1c3fc34e', class: {
                 'show-filter': this.showFilter,
-            } }, h("div", { key: '9a4de79e4b28d167a4dd1ff2d92381e2a2e942a7', ref: (div) => (this.outputEle = div) }, h("slot", { key: '112ec321906665e4ba7b3e0c8377bfb49d12b6de', name: "output" }))));
+                'nano-filter': true,
+            } }, h("div", { key: '909831f2c2e4605163227a188df31b3b130fd7d1', ref: (div) => (this.outputEle = div) }, h("slot", { key: '854cff616358aaee8cb6594db55a4a49d4322b74', name: "output" }))));
     }
     static get watchers() { return {
         "value": ["valueSet"],

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

@@ -1 +1 @@
-{"file":"nano-algolia-filter.js","mappings":";;;;;;;AAAA,MAAM,gBAAgB,GAAG,uUAAuU,CAAC;AACjW,gCAAe,gBAAgB;;MCsClB,aAAa;;;;;;;;;IAGhB,WAAW,CAAS;IACpB,YAAY,CAAc;IAC1B,UAAU,CAAc;IACxB,SAAS,CAAc;IACvB,QAAQ,GAAW,IAAI,CAAC;IACxB,WAAW,CAAC;IACZ,YAAY,GAAG,IAAI,OAAO,CAAC,CAAC,OAAO;QACzC,IAAI,CAAC,WAAW,GAAG,OAAO,CAAC;KAC5B,CAAC,CAAC;IAEM,WAAW,CAAoB;IAC/B,aAAa,GAAkB,CAAC,SAAS,CAAC,CAAC;IAC3C,UAAU,GAAY,KAAK,CAAC;IAC5B,YAAY,GAAgB,IAAI,CAAC;IACjC,aAAa,GAAW,IAAI,CAAC;IAC7B,MAAM,CAAe;IACrB,WAAW,CAA0B;IACrC,iBAAiB,CAAiB;;;;IAKnC,UAAU,GAAW,IAAI,CAAC;;;;IAKT,KAAK,GAA2B,EAAE,CAAC;;;;IAKpD,QAAQ,GAAiB,IAAI,CAAC;;;;;IAM9B,OAAO,CAAU;;;;;IAMjB,WAAW,GAAmB,SAAS,CAAC;;;;IAKvC,iBAAiB,CAAyC;;;;IAK1D,cAAc,CAA8C;;IAIrE,QAAQ;QACN,MAAM,MAAM,GAAG,IAAI,CAAC,KAAe,CAAC;QACpC,IAAI,IAAI,CAAC;QAET,IAAI,OAAO,MAAM,KAAK,QAAQ;YAC5B,IAAI,GAAG,MAAM,CAAC,MAAM,GAAG,MAAM,CAAC,KAAK,CAAC,GAAG,CAAC,GAAG,EAAE,CAAC;;YAC3C,IAAI,GAAG,IAAI,CAAC,KAAsB,CAAC;QAExC,IAAI,IAAI,CAAC,cAAc,CAAC,IAAI,CAAC,EAAE;YAC7B,MAAM,SAAS,GAAG,IAAI,CAAC,cAAc,CAAC,IAAI,CAAC,CAAC;;YAE5C,IAAI,SAAS,IAAI,SAAS,CAAC,MAAM;gBAAE,IAAI,CAAC,aAAa,GAAG,IAAI,CAAC;;iBAExD;gBACH,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,CAAC,CAAC;oBACvB,IAAI,CAAC,cAAc,CAAC,IAAI,CAAC,CAAC;oBAC1B,IAAI,CAAC,aAAa,GAAG,IAAI,CAAC;iBAC3B,CAAC,CAAC;aACJ;SACF;KACF;;IAID,YAAY;QACV,IAAI,CAAC,KAAK,GAAG,IAAI,CAAC,aAAa,CAAC;QAChC,IAAI,CAAC,iBAAiB,CAAC,IAAI,CAAC;YAC1B,QAAQ,EAAE,IAAI,CAAC,QAAQ;YACvB,SAAS,EAAE,IAAI,CAAC,UAAU;YAC1B,KAAK,EAAE,IAAI,CAAC,aAAa;YACzB,QAAQ,EAAE,IAAI,CAAC,QAAQ;SACxB,CAAC,CAAC;KACJ;;IAID,oBAAoB;QAClB,IACE,IAAI,CAAC,UAAU;YACf,IAAI,CAAC,aAAa;aACjB,IAAI,CAAC,aAAa,KAAK,IAAI,CAAC,QAAQ,IAAI,IAAI,CAAC,QAAQ,KAAK,KAAK,CAAC,EACjE;YACA,IAAI,CAAC,aAAa,EAAE,CAAC;SACtB;KACF;IAGD,SAAS;QACP,IAAI,CAAC,aAAa,EAAE,CAAC;KACtB;IAGD,kBAAkB;QAChB,IAAI,IAAI,CAAC,YAAY,IAAI,IAAI,CAAC,YAAY,CAAC,cAAc,EAAE;YACzD,MAAM,UAAU,GAAG,IAAI,CAAC,YAAY,CAAC,cAAc,CAAC,IAAI,CACtD,CAAC,MAAM,KAAK,MAAM,CAAC,IAAI,KAAK,IAAI,CAAC,UAAU,CAC5C,CAAC;YACF,IAAI,CAAC,UAAU;gBAAE,OAAO;YAExB,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,CAAC,CAAC;gBACvB,MAAM,SAAS,GAAG,IAAI,CAAC,cAAc,CAAC,UAAU,CAAC,MAAM,CAAC,CAAC;gBACzD,IAAI,SAAS,IAAI,SAAS,CAAC,MAAM;oBAAE,IAAI,CAAC,KAAK,GAAG,SAAS,CAAC;aAC3D,CAAC,CAAC;SACJ;QACD,IAAI,CAAC,aAAa,EAAE,CAAC;KACtB;IAID,iBAAiB;QACf,MAAM,IAAI,GAAG,IAAI,CAAC,cAAc,EAAE,CAAC;QACnC,IAAI,IAAI,CAAC,cAAc,CAAC,IAAI,CAAC,EAAE;YAC7B,IAAI,CAAC,aAAa,GAAG,IAAI,CAAC;YAC1B,OAAO,IAAI,CAAC;SACb;QACD,OAAO,KAAK,CAAC;KACd;IAEO,aAAa;QACnB,MAAM,QAAQ,GAAG,IAAI,CAAC,UAAU,IAAI,IAAI,CAAC,SAAS,CAAC;QACnD,IAAI,CAAC,IAAI,CAAC,EAAE;YAAE,OAAO;;QAGrB,IAAI,CAAC,IAAI,CAAC,WAAW;YAAE,IAAI,CAAC,UAAU,GAAG,IAAI,CAAC;;aAEzC,IACH,CAAC,IAAI,CAAC,UAAU;YAChB,CAAC,QAAQ;aACR,IAAI,CAAC,WAAW;iBACd,CAAC,IAAI,CAAC,YAAY,IAAI,CAAC,IAAI,CAAC,YAAY,CAAC,WAAW,CAAC,IAAI,CAAC,UAAU,CAAC,CAAC,CAAC,EAC1E;YACA,IAAI,CAAC,UAAU,GAAG,KAAK,CAAC;SACzB;;QAGD,IAAI,CAAC,QAAQ;YAAE,OAAO;;QAGtB,IAAI,CAAC,IAAI,CAAC,YAAY,EAAE;YACtB,IAAI,IAAI,CAAC,WAAW,EAAE;gBACpB,SAAS,CAAC;oBACR,QAAQ,CAAC,SAAS,GAAG,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,WAAW,EAAE;wBACtD,IAAI,EAAE,EAAE;wBACR,GAAG,EAAE,EAAE;wBACP,QAAQ,EACN,IAAI,CAAC,aAAa,IAAI,IAAI,CAAC,aAAa,CAAC,MAAM;8BAC3C,IAAI,CAAC,aAAa;8BAClB,IAAI,CAAC,KAAK;qBACjB,CAAC,CAAC;oBACH,IAAI,CAAC,IAAI,CAAC,KAAK,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,MAAM;wBAAE,IAAI,CAAC,iBAAiB,EAAE,CAAC;iBACjE,CAAC,CAAC;aACJ;iBAAM,IAAI,CAAC,IAAI,CAAC,KAAK,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,MAAM;gBAAE,IAAI,CAAC,iBAAiB,EAAE,CAAC;YACvE,OAAO;SACR;;QAGD,SAAS,CAAC;YACR,QAAQ,CAAC,SAAS,GAAG,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,WAAW,EAAE;gBACtD,IAAI,EAAE,EAAE,GAAG,IAAI,CAAC,YAAY,CAAC,WAAW,CAAC,IAAI,CAAC,UAAU,CAAC,EAAE;gBAC3D,GAAG,EAAE,EAAE,GAAG,IAAI,CAAC,YAAY,CAAC,UAAU,CAAC,IAAI,CAAC,UAAU,CAAC,EAAE;gBACzD,QAAQ,EACN,IAAI,CAAC,aAAa,IAAI,IAAI,CAAC,aAAa,CAAC,MAAM;sBAC3C,IAAI,CAAC,aAAa;sBAClB,IAAI,CAAC,KAAK;aACjB,CAAC,CAAC;YACH,IAAI,CAAC,WAAW,EAAE,CAAC;YACnB,IAAI,CAAC,cAAc,EAAE,CAAC;YAEtB,IAAI,CAAC,IAAI,CAAC,UAAU;gBAAE,IAAI,CAAC,UAAU,GAAG,IAAI,CAAC;YAC7C,IAAI,CAAC,cAAc,CAAC,IAAI,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;SACnC,CAAC,CAAC;KACJ;;IAGO,cAAc;QACpB,MAAM,MAAM,GAAG,EAAE,CAAC;QAClB,MAAM,MAAM,GAAG,IAAI,CAAC,UAAU,CAAC,gBAAgB,CAC7C,qDAAqD,CACtD,CAAC;QAEF,KAAK,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,MAAM,CAAC,MAAM,EAAE,CAAC,EAAE,EAAE;YACtC,MAAM,KAAK,GAAG,MAAM,CAAC,CAAC,CAAqB,CAAC;;YAG5C,IAAI,KAAK,CAAC,IAAI,KAAK,iBAAiB,EAAE;gBACpC,MAAM,MAAM,GAAsB,KAAY,CAAC;gBAC/C,KAAK,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,MAAM,CAAC,OAAO,CAAC,MAAM,EAAE,CAAC,EAAE,EAAE;oBAC9C,IAAI,CAAC,MAAM,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,QAAQ,IAAI,CAAC,MAAM,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC,MAAM;wBAChE,SAAS;oBACX,MAAM,CAAC,IAAI,CAAC,MAAM,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC;iBACtC;aACF;iBAAM,IACL,CAAC,KAAK,CAAC,IAAI,KAAK,UAAU,IAAI,KAAK,CAAC,IAAI,KAAK,OAAO;iBACnD,KAAK,CAAC,OAAO,IAAI,KAAK,CAAC,KAAK,CAAC,MAAM,CAAC,EACrC;gBACA,MAAM,CAAC,IAAI,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC;aAC1B;SACF;QACD,OAAO,MAAM,CAAC;KACf;;IAGO,cAAc,CAAC,IAAe;QACpC,IAAI,GAAG,IAAI,IAAI,IAAI,CAAC,aAAa,CAAC;QAClC,IAAI,CAAC,IAAI;YAAE,OAAO;QAElB,MAAM,KAAK,GAAG,EAAE,CAAC;QACjB,MAAM,MAAM,GAAG,IAAI,CAAC,UAAU,CAAC,gBAAgB,CAC7C,iFAAiF,CAClF,CAAC;QAEF,KAAK,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,MAAM,CAAC,MAAM,EAAE,CAAC,EAAE,EAAE;YACtC,MAAM,KAAK,GAAG,MAAM,CAAC,CAAC,CAAqB,CAAC;YAE5C,IACE,KAAK,CAAC,QAAQ;gBACd,KAAK,CAAC,IAAI,KAAK,MAAM;gBACrB,KAAK,CAAC,IAAI,KAAK,OAAO;gBACtB,KAAK,CAAC,IAAI,KAAK,QAAQ;gBACvB,KAAK,CAAC,IAAI,KAAK,QAAQ;gBAEvB,SAAS;YAEX,IAAI,KAAK,CAAC,IAAI,KAAK,iBAAiB,IAAI,KAAK,CAAC,IAAI,KAAK,YAAY,EAAE;gBACnE,MAAM,MAAM,GAAsB,KAAY,CAAC;gBAC/C,KAAK,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,MAAM,CAAC,OAAO,CAAC,MAAM,EAAE,CAAC,EAAE,EAAE;oBAC9C,IAAI,CAAC,IAAI,CAAC,QAAQ,CAAC,MAAM,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC;wBACzC,MAAM,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,QAAQ,GAAG,KAAK,CAAC;yBAChC;wBACH,KAAK,CAAC,IAAI,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC;wBACzB,MAAM,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,QAAQ,GAAG,IAAI,CAAC;wBAClC,IAAI,KAAK,CAAC,IAAI,KAAK,YAAY;4BAC7B,MAAM,CAAC,KAAK,GAAG,MAAM,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC;qBAC1C;iBACF;aACF;iBAAM,IACL,CAAC,UAAU,EAAE,OAAO,EAAE,KAAK,EAAE,SAAS,EAAE,cAAc,CAAC,CAAC,QAAQ,CAC9D,KAAK,CAAC,IAAI,CACX,EACD;gBACA,IAAI,IAAI,CAAC,QAAQ,CAAC,KAAK,CAAC,KAAK,CAAC,EAAE;oBAC9B,KAAK,CAAC,IAAI,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC;oBACxB,KAAK,CAAC,OAAO,GAAG,IAAI,CAAC;iBACtB;qBAAM,IAAI,CAAC,IAAI,CAAC,MAAM,IAAI,CAAC,KAAK,CAAC,KAAK,CAAC,MAAM,EAAE;oBAC9C,KAAK,CAAC,OAAO,GAAG,IAAI,CAAC;iBACtB;;oBAAM,KAAK,CAAC,OAAO,GAAG,KAAK,CAAC;aAC9B;SACF;QACD,OAAO,KAAK,CAAC;KACd;IAEO,cAAc,CAAC,MAAqB;QAC1C,IAAI,CAAC,CAAC,IAAI,CAAC,aAAa,IAAI,CAAC,MAAM;YAAE,OAAO,IAAI,CAAC;QACjD,IAAI,CAAC,IAAI,CAAC,aAAa,IAAI,CAAC,MAAM;YAAE,OAAO,KAAK,CAAC;QACjD,IAAI,IAAI,CAAC,aAAa,IAAI,MAAM,CAAC,MAAM,KAAK,IAAI,CAAC,aAAa,CAAC,MAAM;YACnE,OAAO,IAAI,CAAC;QAEd,IAAI,UAAU,GAAG,KAAK,CAAC;QACvB,KAAK,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,MAAM,CAAC,MAAM,EAAE,CAAC,EAAE,EAAE;YACtC,IACE,CAAC,UAAU;iBACV,CAAC,IAAI,CAAC,aAAa,IAAI,CAAC,IAAI,CAAC,aAAa,CAAC,QAAQ,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,CAAC;gBAEhE,UAAU,GAAG,IAAI,CAAC;SACrB;QACD,OAAO,UAAU,CAAC;KACnB;IAED,iBAAiB;QACf,IAAI,CAAC,YAAY,GAAG,IAAI,CAAC,EAAE,CAAC,aAAa,CAAC,0BAA0B,CAAC,CAAC;QACtE,IAAI,CAAC,UAAU,GAAG,IAAI,CAAC,EAAE,CAAC,aAAa,CAAC,iBAAiB,CAAC,CAAC;QAC3D,IAAI,CAAC,QAAQ,GAAG,IAAI,CAAC,UAAU,GAAG,GAAG,GAAG,SAAS,EAAE,CAAC;QAEpD,IAAI,IAAI,CAAC,YAAY,EAAE;YACrB,IAAI,CAAC,WAAW,GAAG,IAAI,CAAC,YAAY,CAAC,SAAS,CAAC;YAC/C,IAAI,CAAC,WAAW,GAAG,IAAI,CAAC,WAAW,CAAC,OAAO,CAAC,SAAS,EAAE,IAAI,CAAC,CAAC;SAC9D;KACF;IAED,iBAAiB;QACf,IAAI,IAAI,CAAC,OAAO;YACd,cAAc,CAAC,IAAI,CACjB,IAAI,EACJ,CAAC,OAAO,CAAC,EACT,IAAI,CAAC,WAAW,IAAI,IAAI,CAAC,iBAAiB,EAC1C,IAAI,CAAC,OAAO,CACb,CAAC;KACL;IAED,gBAAgB;QACd,IAAI,CAAC,aAAa,EAAE,CAAC;QAErB,IACE,IAAI,CAAC,WAAW;YAChB,IAAI,CAAC,UAAU;YACf,IAAI,CAAC,YAAY;YACjB,IAAI,CAAC,YAAY,CAAC,WAAW,CAAC,IAAI,CAAC,UAAU,CAAC;YAE9C,IAAI,CAAC,UAAU,GAAG,IAAI,CAAC;KAC1B;IAED,MAAM;QACJ,QACE,EAAC,IAAI,qDACH,KAAK,EAAE;gBACL,aAAa,EAAE,IAAI,CAAC,UAAU;aAC/B,IAED,4DAAK,GAAG,EAAE,CAAC,GAAG,MAAM,IAAI,CAAC,SAAS,GAAG,GAAG,CAAC,IACvC,6DAAM,IAAI,EAAC,QAAQ,GAAG,CAClB,CACD,EACP;KACH;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAGH,QAAQ,CAAC,aAA4C,EAAE;IACrD,mBAAmB;IACnB,cAAc;IACd,eAAe;IACf,QAAQ;IACR,aAAa;IACb,aAAa;CACd,CAAC,CAAC;AACH,IAAI,SAAS,GAAG,CAAC,CAAC;;;;;;;;;;;;;;;;;;;;","names":[],"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-data';\nimport type {\n  IndexResult,\n  FilterChangeEventDetail,\n  AlgoliaFacet,\n} from './algolia-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"],"version":3}
+{"file":"nano-algolia-filter.js","mappings":"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","names":[],"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  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 { h } from '../../utils/renderer';\nimport {\n  SearchChangeEvent,\n  Wormhole,\n  WormholeConsumerConstructor,\n} from './algolia-data';\nimport type {\n  IndexResult,\n  FilterChangeEventDetail,\n  AlgoliaFacet,\n} from './algolia-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          'nano-filter': true,\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"],"version":3}

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

@@ -59,9 +59,9 @@ const AlgoliaPagination = /*@__PURE__*/ proxyCustomElement(class AlgoliaPaginati
         this.updateContent();
     }
     render() {
-        return (h(Host, { key: '3168d162f59e4a753d3b1c1557ccdd502de66cbb', class: {
+        return (h(Host, { key: '12cc1de8e3bfe96c0368ff394eb6a2cfdf0344c8', class: {
                 'show-pagination': this.show,
-            } }, h("div", { key: 'e90d2eeaef3131be78bb6bebfd4e62c3e2abf708', ref: (div) => (this.outputEle = div) }, h("slot", { key: '36e2f104745f285da532c099c863a6ac48e3f265', name: "output" }))));
+            } }, h("div", { key: '70dc4683c476084346dc69246acb2092719d0b60', ref: (div) => (this.outputEle = div) }, h("slot", { key: '04f51858db37f6a25cae5fead48c5016a4159944', name: "output" }))));
     }
     static get watchers() { return {
         "currentPage": ["currentPageChange"],

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

@@ -1,7 +1,8 @@
 /*!
  * Web Components for Nanopore digital Web Apps
  */
-import { proxyCustomElement, HTMLElement, createEvent, Build, readTask, h, Host } from '@stencil/core/internal/client';
+import { proxyCustomElement, HTMLElement, createEvent, Build, readTask, Host } from '@stencil/core/internal/client';
+import { h } from './renderer.js';
 import { S as SearchChangeEvent, W as Wormhole } from './algolia-data.js';
 
 const AlgoliaResults = /*@__PURE__*/ proxyCustomElement(class AlgoliaResults extends HTMLElement {
@@ -196,9 +197,10 @@ const AlgoliaResults = /*@__PURE__*/ proxyCustomElement(class AlgoliaResults ext
         }
     }
     render() {
-        return (h(Host, { key: '4147d35d40d51e93ad297d55b78c7cb19b6b20c1', class: {
+        return (h(Host, { key: 'e5124d09c5619d77f6debca38bd5059ecfb9dce5', class: {
                 'show-results': this.showResults,
-            } }, h("div", { key: '354c9705a9650c00ab1e4787cf4ff9673d47e6bf', class: "default" }, h("slot", { key: 'afc1b38a92df5498f471e09137e214899c93b99a' })), h("div", { key: '904cf500535009e93fff280964c57f7b00f5c9bd', ref: (div) => (this.outputEle = div) }, h("slot", { key: '46724c1448e12efab63f79d29dfff8d45be29150', name: "start-output" }), h("slot", { key: '14f524dae0de0418dbc34dbe0878552a36876173', name: "result-output" }), h("div", { key: '065e03e12a29882464e89ec74664eb2613c60ebf', ref: (div) => (this.infiniteScrollBar = div) }), h("slot", { key: 'ee51e59caa058ba382c1e361f1d538b863ff2a6d', name: "end-output" }))));
+                'nano-results': true,
+            } }, h("div", { key: '773924ac30cd4e8c57d6767f96a8c9173d6e9ec6', class: "default" }, h("slot", { key: '5a330fe6afa15143c006fc3690d1ddb0ccf3bc8d' })), h("div", { key: '3a716202a7364efa1eeb90ea525670c4da5fc7e1', ref: (div) => (this.outputEle = div) }, h("slot", { key: 'af5860bd4dc7e2472d18f1b86175f5772bac426b', name: "start-output" }), h("slot", { key: '7b57ec404897b71f60a06ca661558624d5db1ac0', name: "result-output" }), h("div", { key: 'cff39c4ed229e1081f9160d8a447d56841209b4e', ref: (div) => (this.infiniteScrollBar = div) }), h("slot", { key: '79c19d45895d5f7a285e0beb640f84251d37b558', name: "end-output" }))));
     }
     static get watchers() { return {
         "results": ["addContentIndex", "resultsChange"],

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

@@ -1 +1 @@
-{"file":"nano-algolia-results.js","mappings":"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","names":[],"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-data';\nimport type {\n  IndexResult,\n  AlgoliaResultHit,\n  PageChangeEventDetail,\n  AlgoliaFacet,\n} from './algolia-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    if (this.infiniteScroll) this.attachIO();\n    else this.detachIO();\n  }\n\n  @Watch('resultsPage')\n  handlePageChage() {\n    if (this.infiniteScroll) this.attachIO();\n    else 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"],"version":3}
+{"file":"nano-algolia-results.js","mappings":"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","names":[],"sources":["src/components/algolia/algolia-results.tsx"],"sourcesContent":["import {\n  Component,\n  Element,\n  Host,\n  Watch,\n  State,\n  Build,\n  EventEmitter,\n  Event,\n  Prop,\n  readTask,\n} from '@stencil/core';\nimport { h } from '../../utils/renderer';\nimport { Wormhole, SearchChangeEvent } from './algolia-data';\nimport type {\n  IndexResult,\n  AlgoliaResultHit,\n  PageChangeEventDetail,\n  AlgoliaFacet,\n} from './algolia-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    if (this.infiniteScroll) this.attachIO();\n    else this.detachIO();\n  }\n\n  @Watch('resultsPage')\n  handlePageChage() {\n    if (this.infiniteScroll) this.attachIO();\n    else 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          'nano-results': true,\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"],"version":3}

package/dist/components/nano-animation.js

@@ -1,7 +1,8 @@
 /*!
  * Web Components for Nanopore digital Web Apps
  */
-import { proxyCustomElement, HTMLElement, createEvent, h, Host } from '@stencil/core/internal/client';
+import { proxyCustomElement, HTMLElement, createEvent, Host } from '@stencil/core/internal/client';
+import { h } from './renderer.js';
 
 const bounce = [
     {
@@ -1211,7 +1212,7 @@ const NanoAnimation$1 = /*@__PURE__*/ proxyCustomElement(class NanoAnimation ext
         this.animation?.finish();
     }
     render() {
-        return (h(Host, { key: '23a7a8ad212b614a4b3f393cbae03a5a360fe391' }, h("slot", { key: '3097cce8b811db4d9ff0d0c5fbc4632f37399038', ref: (slot) => {
+        return (h(Host, { key: '72df233f997594e16f18fbe6009d5bc3849e8248', class: "nano-animation" }, h("slot", { key: 'cc651438b3697408a642e28369b77efe7c781716', ref: (slot) => {
                 this.defaultSlot = slot;
             }, onSlotchange: this.handleSlotChange })));
     }