npm - @nanoporetech-digital/components - Versions diffs - 1.15.4 → 1.15.5 - Mend

@nanoporetech-digital/components 1.15.4 → 1.15.5

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (174) hide show

package/dist/collection/components/global-search-results/global-search-results.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"global-search-results.js","sourceRoot":"","sources":["../../../src/components/global-search-results/global-search-results.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n Component,\n h,\n Host,\n Element,\n State,\n ComponentInterface,\n Watch,\n Listen,\n} from '@stencil/core';\nimport ResizeObserver from 'resize-observer-polyfill';\n\nimport { AloliaSearchResultDetail } from '../../interface';\nimport { SearchIndex } from '../../interface';\n\n/*\n Nanopore Global Search results component\n * to be used in conjunction with [Globla-Nav](/story/nano-compounds-global-nav).\n * A shortcut / helper which combines algolia components.\n * There should only be one <nano-global-search-results> per page\n * and should be a direct child of <nano-global-nav>\n */\n@Component({\n tag: 'nano-global-search-results',\n styleUrl: 'global-search-results.scss',\n shadow: true,\n})\nexport class GlobalSearchResults implements ComponentInterface {\n private algoliaResultsEle: HTMLNanoAlgoliaResultsElement;\n private filtersDiv: HTMLElement;\n private openFilterBtn: HTMLButtonElement;\n private ro: ResizeObserver;\n\n @State() algoliaEle: HTMLNanoAlgoliaElement;\n @State() currentWidth: number;\n @State() apiKey: string;\n @State() appId: string;\n @State() index: SearchIndex;\n\n @Element() private el: HTMLNanoGlobalSearchResultsElement;\n\n @Watch('algoliaEle')\n @Watch('apiKey')\n @Watch('appId')\n handleAlgoliaCredsChange() {\n if (!this.apiKey \|\| !this.appId \|\| !this.algoliaEle) return;\n this.algoliaEle.apiKey = this.apiKey;\n this.algoliaEle.appId = this.appId;\n }\n\n @Watch('algoliaEle')\n @Watch('index')\n handleAlgoliaIndexChange() {\n if (!this.index \|\| !this.algoliaEle) return;\n this.algoliaEle.searchIndex = this.index;\n }\n\n @Listen('nanoSearchReset', { target: 'body' })\n handleGlobalNavReset(e: CustomEvent & { target: HTMLElement }) {\n if (e.target.tagName !== 'NANO-GLOBAL-NAV') return;\n this.algoliaResultsEle = null;\n this.goback();\n }\n\n @Listen('nanoSearchResult', { target: 'body' })\n handleGlobalNavSearch(e: CustomEvent & { target: HTMLElement }) {\n if (e.target.tagName !== 'NANO-GLOBAL-NAV') return;\n const {\n detail: { results, client },\n } = e as { detail: AloliaSearchResultDetail };\n const result = results.find((result) => result.selected);\n\n this.apiKey = client.apiKey;\n this.appId = client.appId;\n this.index = {\n name: result.indexName,\n index: result.index,\n domain: result.domain,\n filters: result.filters,\n };\n this.algoliaEle.query = result.query;\n }\n\n @Listen('nanoChange')\n handleReorder(e: CustomEvent & { target: HTMLNanoSelectElement }) {\n if (\n e\n .composedPath()\n .find(\n (ele: HTMLElement) =>\n ele.classList && ele.classList.contains('indexchange')\n ) &&\n !!this.algoliaResultsEle\n ) {\n this.changeOrder(e);\n }\n }\n\n @Listen('nanoResultsShown')\n attachListeners(e: CustomEvent & { target: HTMLElement }) {\n if (\n !e\n .composedPath()\n .find((ele: HTMLElement) => ele.id && ele.id === 'main-search')\n )\n return;\n\n this.algoliaResultsEle = this.algoliaEle.querySelector(\n '#main-search-results'\n );\n\n // add results listeners\n this.attachResultListeners();\n\n this.algoliaEle.querySelectorAll('.filters-reset').forEach((item) => {\n item.addEventListener('click', () => {\n this.removeAllFilters();\n });\n });\n\n this.algoliaEle.querySelectorAll('.close-filters').forEach((item) => {\n item.addEventListener('click', () => {\n this.closefilters();\n });\n });\n\n let filterWrap = this.algoliaEle.querySelector('.filters-wrap');\n if (filterWrap) {\n filterWrap.addEventListener('click', (e) => {\n e.stopPropagation();\n });\n }\n\n this.filtersDiv = this.algoliaEle.querySelector('#main-search-filters');\n }\n\n @Listen('nanoNewResults', { target: 'body' })\n attachResultListeners(e?: CustomEvent & { target: HTMLElement }) {\n if (e && e.composedPath().find((el) => el === this.algoliaEle)) {\n this.algoliaResultsEle = this.algoliaEle.querySelector(\n 'nano-algolia-results'\n );\n }\n if (!this.algoliaResultsEle) return;\n let resultEle = this.algoliaResultsEle;\n\n resultEle.querySelectorAll('.remove-filter').forEach((item) => {\n item.addEventListener('click', (clickEv: MouseEvent) => {\n let filter = clickEv.target as HTMLElement;\n this.removeFilter(filter.dataset.filter, filter.dataset.filterVal);\n });\n });\n\n resultEle.querySelectorAll('.back-btn').forEach((item) => {\n item.addEventListener('click', () => {\n this.goback();\n });\n });\n\n resultEle.querySelectorAll('.topbar__show-filters').forEach((item) => {\n this.openFilterBtn = item as HTMLButtonElement;\n item.addEventListener('click', () => {\n this.filtersDiv.tabIndex = -1;\n this.filtersDiv.classList.add('show');\n this.filtersDiv.setAttribute('aria-expanded', 'true');\n document.body.style.overflow = 'hidden';\n setTimeout(() => this.filtersDiv.focus(), 20);\n });\n });\n }\n\n private changeOrder(ev) {\n this.algoliaEle.replicaIndex = ev.detail.value;\n }\n\n private goback() {\n this.removeAllFilters();\n this.algoliaEle.showResults = false;\n this.algoliaEle.query = '';\n }\n\n private removeFilter(facet, filter) {\n this.algoliaEle.removeFilters(facet, filter);\n }\n\n private removeAllFilters() {\n this.algoliaEle.removeFilters();\n }\n\n private closefilters() {\n if (!this.filtersDiv) return;\n this.filtersDiv.tabIndex = null;\n this.filtersDiv.classList.remove('show');\n this.filtersDiv.setAttribute('aria-expanded', 'false');\n document.body.style.overflow = '';\n setTimeout(() => this.openFilterBtn.focus(), 20);\n }\n\n componentDidLoad() {\n this.ro = new ResizeObserver((entries) => {\n for (const entry of entries) {\n if (!entry.contentRect.width) return;\n this.currentWidth = entry.contentRect.width;\n }\n });\n this.ro.observe(this.el);\n this.algoliaEle.filters = [\n 'created > ' + Math.floor((Date.now() - 63115200000) / 1000),\n ]; // only get last 2 years\n }\n\n render() {\n return (\n <Host\n class={{ small: this.currentWidth < 577 }}\n dir={(this.el.ownerDocument as Document).dir === 'rtl' ? 'rtl' : false}\n >\n <nano-algolia\n store-id=\"searchq\"\n store-method=\"url-hash-push\"\n class=\"main-search__wrap sc-nano-global-search-results\"\n ref={(ele) => (this.algoliaEle = ele)}\n infinite-scroll\n id=\"main-search\"\n >\n <script type=\"text/template\" slot=\"template\">\n {`<div class=\"main-search sc-nano-global-search-results\">\n <nano-algolia-results id=\"main-search-results\" class=\"main-search__results sc-nano-global-search-results\">\n <script type=\"text/template\" slot=\"start-template\">\n <div class=\"sc-nano-global-search-results main-search__topbar topbar\">\n <button class=\"sc-nano-global-search-results topbar__bkbtn back-btn icon-button\">\n <nano-icon class=\"sc-nano-global-search-results\" name=\"light/chevron-left\" size=\"small\"></nano-icon>\n </button>\n <div>\n <em class=\"sc-nano-global-search-results topbar__query\">'{{ it.query }}' - </em> <strong>{{ it.totalHitsWithFilters }}</strong> Results\n </div>\n\n <div class=\"sc-nano-global-search-results topbar__filtering\">\n {{ @if (it.results.length) }}\n\n {{ @if (it.indexName === 'All') }}\n <nano-select class=\"sc-nano-global-search-results topbar__order topbar__order--www indexchange\" value=\"{{ it.index }}\" hide-label=\"true\" label=\"Sort order\" show-inline-error=\"false\">\n <option value=\"all_prod_en\">Sort by: Most relevant</option>\n <option value=\"all_prod_en_date_desc\">Sort by: Newest</option>\n <option value=\"all_prod_en_date_asc\">Sort by: Oldest</option>\n <option value=\"all_prod_en_activity_date_desc\">Sort by: Recent activity</option>\n </nano-select>\n {{ /if }}\n\n {{ @if (it.indexName === 'www') }}\n <nano-select class=\"sc-nano-global-search-results topbar__order topbar__order--www indexchange\" value=\"{{ it.index }}\" hide-label=\"true\" label=\"Sort order\" show-inline-error=\"false\">\n <option value=\"cws_english_en\">Sort by: Most relevant</option>\n <option value=\"cws_english_en_date_desc\">Sort by: Newest</option>\n <option value=\"cws_english_en_date_asc\">Sort by: Oldest</option>\n </nano-select>\n {{ /if }}\n\n {{ @if (it.indexName === 'Resources') }}\n <nano-select class=\"sc-nano-global-search-results topbar__order topbar__order--www indexchange\" value=\"{{ it.index }}\" hide-label=\"true\" label=\"Sort order\" show-inline-error=\"false\">\n <option value=\"cws_english_resources_en\">Sort by: Most relevant</option>\n <option value=\"cws_english_resources_en_featured_desc\">Sort by: Newest</option>\n <option value=\"cws_english_resources_en_featured_asc\">Sort by: Oldest</option>\n </nano-select>\n {{ /if }}\n\n {{ @if (it.indexName === 'Store') }}\n <nano-select class=\"sc-nano-global-search-results topbar__order topbar__order--www indexchange\" value=\"{{ it.index }}\" hide-label=\"true\" label=\"Sort order\" show-inline-error=\"false\">\n <option value=\"store_prod\">Sort by: Most relevant</option>\n <option value=\"store_prod_date_desc\">Sort by: Newest</option>\n <option value=\"store_prod_date_asc\">Sort by: Oldest</option>\n </nano-select>\n {{ /if }}\n\n {{ @if (it.indexName === 'Community') }}\n <nano-select class=\"sc-nano-global-search-results topbar__order topbar__order--community indexchange\" value=\"{{ it.index }}\" hide-label=\"true\" label=\"Sort order\" show-inline-error=\"false\">\n <option value=\"community_prod\">Sort by: Most relevant</option>\n <option value=\"community_prod_date_desc\">Sort by: Newest</option>\n <option value=\"community_prod_date_asc\">Sort by: Oldest</option>\n <option value=\"community_prod_activity_date_desc\">Sort by: Recent activity</option>\n </nano-select>\n {{ /if }}\n {{ /if }}\n\n <button class=\"sc-nano-global-search-results topbar__show-filters filters-title\" aria-controls=\"main-search-filters\">\n {{ @if (it.appliedFilters && it.appliedFilters.length > 0) }}\n <span class=\"sc-nano-global-search-results topbar__filter-count\">\n {{ (it.appliedFilters.reduce(function(a, b) { return a + (b.values ? b.values.length : 0) }, 0)) }}\n </span>\n {{ /if }}\n <nano-icon class=\"sc-nano-global-search-results\" name=\"light/filter\"></nano-icon>\n </button>\n </div>\n </div>\n\n {{ @if (it.results.length) }}\n <div class=\"sc-nano-global-search-results main-search__applied-filters\">\n {{ @if (it.appliedFilters) }}\n {{ @each(it.appliedFilters) => filterObj }}\n {{ @each(filterObj.values) => filterVal }}\n <span class=\"sc-nano-global-search-results main-search__applied-filter\">\n {{ filterVal \| public_name }}\n <button class=\"sc-nano-global-search-results icon-button remove-filter\" data-filter=\"{{ filterObj.name }}\" data-filter-val=\"{{ filterVal }}\">\n <nano-icon class=\"sc-nano-global-search-results\" name=\"light/times\"></nano-icon>\n </button>\n </span>\n {{ /each }}\n {{ /each }}\n {{ #else }}\n <span class=\"sc-nano-global-search-results main-search__applied-nofilter\"> </span>\n {{ /if }}\n </div>\n {{ /if }}\n </script>\n\n <script type=\"text/template\" slot=\"result-template\">\n {{ @if (it.totalHitsWithFilters > 0) }}\n {{ @each(it.results) => result }}\n <li class=\"sc-nano-global-search-results\">\n <a class=\"sc-nano-global-search-results result\" href=\"{{ result.url \| abs_url(it, result) }}\">\n <h4 class=\"sc-nano-global-search-results result__title\" data-icon-set=\"{{(iconSet = false)}}\">\n {{ @if (!it.legacy) }}\n\n {{ @if (result.type === 'faq' \|\| result.type === 'faqs') }}\n <nano-icon data-icon-set=\"{{(iconSet = true)}}\" class=\"sc-nano-global-search-results\" name=\"light/question-circle\"></nano-icon>\n {{ /if }}\n\n {{ @if (result.type === 'comment') }}\n <nano-icon data-icon-set=\"{{(iconSet = true)}}\" class=\"sc-nano-global-search-results\" name=\"light/comment\"></nano-icon>\n {{ /if }}\n\n {{ @if (result.type === 'protocol') }}\n <nano-icon data-icon-set=\"{{(iconSet = true)}}\" class=\"sc-nano-global-search-results\" name=\"light/clipboard-list\"></nano-icon>\n {{ /if }}\n\n {{ @if (result.type === 'publication') }}\n <nano-icon data-icon-set=\"{{(iconSet = true)}}\" class=\"sc-nano-global-search-results\" name=\"light/file-chart-line\"></nano-icon>\n {{ /if }}\n\n {{ @if (result.type === 'poster' \|\| result.type === 'lc_poster') }}\n <nano-icon data-icon-set=\"{{(iconSet = true)}}\" class=\"sc-nano-global-search-results\" name=\"light/presentation\"></nano-icon>\n {{ /if }}\n\n {{ @if (result.type === 'post') }}\n <nano-icon data-icon-set=\"{{(iconSet = true)}}\" class=\"sc-nano-global-search-results\" name=\"light/comments\"></nano-icon>\n {{ /if }}\n\n {{ @if (result.type === 'news_item') }}\n <nano-icon data-icon-set=\"{{(iconSet = true)}}\" class=\"sc-nano-global-search-results\" name=\"light/newspaper\"></nano-icon>\n {{ /if }}\n\n {{ @if (result.type === 'event') }}\n <nano-icon data-icon-set=\"{{(iconSet = true)}}\" class=\"sc-nano-global-search-results\" name=\"light/calendar\"></nano-icon>\n {{ /if }}\n\n {{ @if (result.type === 'talk' \|\| result.type === 'lc_lightning_talk' \|\| result.type === 'ncm_plenary_talk' \|\| result.type === 'ncm_lightning_talk') }}\n <nano-icon data-icon-set=\"{{(iconSet = true)}}\" class=\"sc-nano-global-search-results\" name=\"light/keynote\"></nano-icon>\n {{ /if }}\n\n {{ @if (result.type === 'video') }}\n <nano-icon data-icon-set=\"{{(iconSet = true)}}\" class=\"sc-nano-global-search-results\" name=\"light/video\"></nano-icon>\n {{ /if }}\n\n {{ @if (result.type === 'data_release') }}\n <nano-icon data-icon-set=\"{{(iconSet = true)}}\" class=\"sc-nano-global-search-results\" name=\"light/analytics\"></nano-icon>\n {{ /if }}\n\n {{ @if (result.type === 'job_vacancy') }}\n <nano-icon data-icon-set=\"{{(iconSet = true)}}\" class=\"sc-nano-global-search-results\" name=\"light/ballot-check\"></nano-icon>\n {{ /if }}\n\n {{ @if (result.type === 'tool') }}\n <nano-icon data-icon-set=\"{{(iconSet = true)}}\" class=\"sc-nano-global-search-results\" name=\"light/wrench\"></nano-icon>\n {{ /if }}\n\n {{ @if (result.type === 'literature') }}\n <nano-icon data-icon-set=\"{{(iconSet = true)}}\" class=\"sc-nano-global-search-results\" name=\"light/book\"></nano-icon>\n {{ /if }}\n\n {{ @if (result.type === 'community_info') }}\n <nano-icon data-icon-set=\"{{(iconSet = true)}}\" class=\"sc-nano-global-search-results\" name=\"light/users\"></nano-icon>\n {{ /if }}\n\n {{ @if (result.type === 'article') }}\n <nano-icon data-icon-set=\"{{(iconSet = true)}}\" class=\"sc-nano-global-search-results\" name=\"light/file-alt\"></nano-icon>\n {{ /if }}\n\n {{ @if (result.type === 'provider') }}\n <nano-icon data-icon-set=\"{{(iconSet = true)}}\" class=\"sc-nano-global-search-results\" name=\"light/handshake\"></nano-icon>\n {{ /if }}\n\n {{ @if (result.type === 'apps') }}\n <nano-icon data-icon-set=\"{{(iconSet = true)}}\" class=\"sc-nano-global-search-results\" name=\"light/vials\"></nano-icon>\n {{ /if }}\n\n {{ @if (result.type === 'white_paper') }}\n <nano-icon data-icon-set=\"{{(iconSet = true)}}\" class=\"sc-nano-global-search-results\" name=\"light/file-pdf\"></nano-icon>\n {{ /if }}\n\n {{ @if (result.type === 'Nanopore Store') }}\n <nano-icon data-icon-set=\"{{(iconSet = true)}}\" class=\"sc-nano-global-search-results\" name=\"light/shopping-cart\"></nano-icon>\n {{ /if }}\n\n {{ @if (!result.type \|\| !iconSet) }}\n <nano-icon class=\"sc-nano-global-search-results\" name=\"light/file\"></nano-icon>\n {{ /if }}\n {{ /if }}\n {{ result.title \| safe }}\n </h4>\n {{ @if (result.body) }}\n <div class=\"sc-nano-global-search-results result__body\">{{ result.body \| safe \| trim_to(200) }}</div>\n {{ /if }}\n {{ @if (result.updated) }}\n <div class=\"sc-nano-global-search-results result__date\">Last Updated: {{ result.updated \| date_short }}</div>\n {{ #else }}\n {{ @if (result.created) }}\n <div class=\"sc-nano-global-search-results result__date\">Added: {{ result.created \| date_short }}</div>\n {{ /if }}\n {{ /if }}\n </a>\n </li>\n {{ /each }}\n {{ /if }}\n </script>\n\n <div slot=\"start-output\"></div>\n <ul slot=\"result-output\" class=\"sc-nano-global-search-results\"></ul>\n </nano-algolia-results>\n\n {{ @if(Object.keys(it.origFilters).length) }}\n <div class=\"sc-nano-global-search-results main-search__filters filters close-filters\" id=\"main-search-filters\">\n <div class=\"sc-nano-global-search-results filters-wrap\">\n {{ @if(it.totalHits) }}\n <div class=\"sc-nano-global-search-results filters-header\">\n <strong class=\"sc-nano-global-search-results filters-title\">Filters</strong>\n <button class=\"sc-nano-global-search-results filters-reset\">Reset</button>\n <button class=\"sc-nano-global-search-results filters__close-filters close-filters icon-button\" aria-controls=\"main-search-filters\">\n <nano-icon class=\"sc-nano-global-search-results\" name=\"light/times\"></nano-icon>\n </button>\n </div>\n {{ /if }}\n\n <div>\n {{ @if(it.origFilters['type']) }}\n <nano-details class=\"sc-nano-global-search-results\" open={true} icon-rotation=\"180\">\n <strong slot=\"label\">Type</strong>\n <nano-icon slot=\"icon-end\" name=\"light/chevron-down\" size=\"small\"></nano-icon>\n <nano-algolia-filter store-id=\"searchf1\" store-method=\"url-hash-push\" filter-name=\"type\">\n <script type=\"text/template\" slot=\"filter-template\">\n <ul class=\"sc-nano-global-search-results\" data-num=\"{{(x = 0)}}\">\n {{ @foreach(it.dyn) => filter, filterVal }}\n <li class=\"sc-nano-global-search-results\" data-num=\"{{(x++)}}\">\n <input class=\"sc-nano-global-search-results filter-cb\" type=\"checkbox\" value=\"{{ filter }}\" id=\"type-{{ filter }}-{{x}}\" />\n <label class=\"sc-nano-global-search-results filter-label\" for=\"type-{{ filter }}-{{x}}\">\n <span>{{ filter \| public_name }} (<strong>{{ filterVal }}</strong>)</span>\n </label></li>\n {{ /foreach }}\n </ul>\n </script>\n <div slot=\"output\"></div>\n </nano-algolia-filter>\n </nano-details>\n {{ /if }}\n\n {{ @if(it.origFilters['channel']) }}\n <nano-details open={true} icon-rotation=\"180\">\n <strong slot=\"label\">Channels</strong>\n <nano-icon slot=\"icon-end\" name=\"light/chevron-down\" size=\"small\"></nano-icon>\n <nano-algolia-filter store-id=\"searchf2\" store-method=\"url-hash-push\" filter-name=\"channel\">\n <script type=\"text/template\" slot=\"filter-template\">\n <ul class=\"sc-nano-global-search-results\" data-num=\"{{(x = 0)}}\">\n {{ @foreach(it.dyn) => filter, filterVal }}\n <li class=\"sc-nano-global-search-results\" data-num=\"{{(x++)}}\">\n <input class=\"filter-cb sc-nano-global-search-results\" type=\"checkbox\" value=\"{{ filter }}\" id=\"channel-{{ filter }}-{{x}}\" />\n <label class=\"filter-label sc-nano-global-search-results\" for=\"channel-{{ filter }}-{{x}}\">\n <span>{{ filter \| public_name }} (<strong>{{ filterVal }}</strong>)</span>\n </label></li>\n {{ /foreach }}\n </ul>\n </script>\n <div slot=\"output\"></div>\n </nano-algolia-filter>\n </nano-details>\n {{ /if }}\n\n {{ @if(it.origFilters['authors']) }}\n <nano-details open={true} icon-rotation=\"180\">\n <strong slot=\"label\">Authors</strong>\n <nano-icon slot=\"icon-end\" name=\"light/chevron-down\" size=\"small\"></nano-icon>\n <nano-algolia-filter store-id=\"searchf3\" store-method=\"url-hash-push\" filter-name=\"authors\">\n <script type=\"text/template\" slot=\"filter-template\">\n <ul class=\"sc-nano-global-search-results\" data-num=\"{{(x = 0)}}\">\n {{ @foreach(it.dyn) => filter, filterVal }}\n <li class=\"sc-nano-global-search-results\" data-num=\"{{(x++)}}\">\n <input class=\"filter-cb sc-nano-global-search-results\" type=\"checkbox\" value=\"{{ filter }}\" id=\"authors-{{ filter }}-{{x}}\" />\n <label class=\"filter-label sc-nano-global-search-results\" for=\"authors-{{ filter }}-{{x}}\">\n <span>{{ filter \| public_name }} (<strong>{{ filterVal }}</strong>)</span>\n </label></li>\n {{ /foreach }}\n </ul>\n </script>\n <div slot=\"output\"></div>\n </nano-algolia-filter>\n </nano-details>\n {{ /if }}\n\n {{ @if(it.origFilters['categories_without_path']) }}\n <nano-details open={true} icon-rotation=\"180\">\n <strong slot=\"label\">Category</strong>\n <nano-icon slot=\"icon-end\" name=\"light/chevron-down\" size=\"small\"></nano-icon>\n <nano-algolia-filter store-id=\"searchf4\" store-method=\"url-hash-push\" filter-name=\"categories_without_path\">\n <script type=\"text/template\" slot=\"filter-template\">\n <ul class=\"sc-nano-global-search-results\" data-num=\"{{(x = 0)}}\">\n {{ @foreach(it.dyn) => filter, filterVal }}\n {{ @if(!filter.match(/publication/)) }}\n <li class=\"sc-nano-global-search-results\" data-num=\"{{(x++)}}\">\n <input class=\"sc-nano-global-search-results filter-cb\" type=\"checkbox\" value=\"{{ filter }}\" id=\"cwp-{{ filter }}-{{x}}\" />\n <label class=\"sc-nano-global-search-results filter-label\" for=\"cwp-{{ filter }}-{{x}}\">\n <span>{{ filter \| public_name }} (<strong>{{ filterVal }}</strong>)</span>\n </label></li>\n {{ /if }}\n {{ /foreach }}\n </ul>\n </script>\n <div slot=\"output\"></div>\n </nano-algolia-filter>\n </nano-details>\n {{ /if }}\n\n {{ @if(it.origFilters['tags']) }}\n <nano-details open={true} icon-rotation=\"180\">\n <strong slot=\"label\">Tags</strong>\n <nano-icon slot=\"icon-end\" name=\"light/chevron-down\" size=\"small\"></nano-icon>\n <nano-algolia-filter store-id=\"searchf5\" store-method=\"url-hash-push\" filter-name=\"tags\">\n <script type=\"text/template\" slot=\"filter-template\">\n <ul class=\"sc-nano-global-search-results\" data-num=\"{{(x = 0)}}\">\n {{ @foreach(it.dyn) => filter, filterVal }}\n <li class=\"sc-nano-global-search-results\" data-num=\"{{(x++)}}\">\n <input class=\"filter-cb sc-nano-global-search-results\" type=\"checkbox\" value=\"{{ filter }}\" id=\"tags-{{ filter }}-{{x}}\" />\n <label class=\"filter-label sc-nano-global-search-results\" for=\"tags-{{ filter }}-{{x}}\">\n <span>{{ filter \| public_name }} (<strong>{{ filterVal }}</strong>)</span>\n </label></li>\n {{ /foreach }}\n </ul>\n </script>\n <div slot=\"output\"></div>\n </nano-algolia-filter>\n </nano-details>\n {{ /if }}\n </div>\n </div>\n </div>\n {{ /if }}\n </div>`}\n </script>\n <div slot=\"output\"></div>\n <slot />\n </nano-algolia>\n </Host>\n );\n }\n}\n"]}
1	+ {"version":3,"file":"global-search-results.js","sourceRoot":"","sources":["../../../src/components/global-search-results/global-search-results.tsx"],"names":[],"mappings":"AAAA,OAAO,EACL,SAAS,EACT,CAAC,EACD,IAAI,EACJ,OAAO,EACP,KAAK,EAEL,KAAK,EACL,MAAM,GACP,MAAM,eAAe,CAAC;AACvB,OAAO,cAAc,MAAM,0BAA0B,CAAC;AAItD,OAAO,EAAE,GAAG,EAAE,MAAM,aAAa,CAAC;AAElC;;;;;;GAMG;AAMH,MAAM,OAAO,mBAAmB;EAiB9B,wBAAwB;IACtB,IAAI,CAAC,IAAI,CAAC,MAAM,IAAI,CAAC,IAAI,CAAC,KAAK,IAAI,CAAC,IAAI,CAAC,UAAU;MAAE,OAAO;IAC5D,IAAI,CAAC,UAAU,CAAC,MAAM,GAAG,IAAI,CAAC,MAAM,CAAC;IACrC,IAAI,CAAC,UAAU,CAAC,KAAK,GAAG,IAAI,CAAC,KAAK,CAAC;EACrC,CAAC;EAID,wBAAwB;IACtB,IAAI,CAAC,IAAI,CAAC,KAAK,IAAI,CAAC,IAAI,CAAC,UAAU;MAAE,OAAO;IAC5C,IAAI,CAAC,UAAU,CAAC,WAAW,GAAG,IAAI,CAAC,KAAK,CAAC;EAC3C,CAAC;EAGD,oBAAoB,CAAC,CAAwC;IAC3D,IAAI,CAAC,CAAC,MAAM,CAAC,OAAO,KAAK,iBAAiB;MAAE,OAAO;IACnD,IAAI,CAAC,iBAAiB,GAAG,IAAI,CAAC;IAC9B,IAAI,CAAC,MAAM,EAAE,CAAC;EAChB,CAAC;EAGD,qBAAqB,CAAC,CAAwC;IAC5D,IAAI,CAAC,CAAC,MAAM,CAAC,OAAO,KAAK,iBAAiB;MAAE,OAAO;IACnD,MAAM,EACJ,MAAM,EAAE,EAAE,OAAO,EAAE,MAAM,EAAE,GAC5B,GAAG,CAAyC,CAAC;IAC9C,MAAM,MAAM,GAAG,OAAO,CAAC,IAAI,CAAC,CAAC,MAAM,EAAE,EAAE,CAAC,MAAM,CAAC,QAAQ,CAAC,CAAC;IAEzD,IAAI,CAAC,MAAM,GAAG,MAAM,CAAC,MAAM,CAAC;IAC5B,IAAI,CAAC,KAAK,GAAG,MAAM,CAAC,KAAK,CAAC;IAC1B,IAAI,CAAC,KAAK,GAAG;MACX,IAAI,EAAE,MAAM,CAAC,SAAS;MACtB,KAAK,EAAE,MAAM,CAAC,KAAK;MACnB,MAAM,EAAE,MAAM,CAAC,MAAM;MACrB,OAAO,EAAE,MAAM,CAAC,OAAO;KACxB,CAAC;IACF,IAAI,CAAC,UAAU,CAAC,KAAK,GAAG,MAAM,CAAC,KAAK,CAAC;EACvC,CAAC;EAGD,aAAa,CAAC,CAAkD;IAC9D,IACE,CAAC;OACE,YAAY,EAAE;OACd,IAAI,CACH,CAAC,GAAgB,EAAE,EAAE,CACnB,GAAG,CAAC,SAAS,IAAI,GAAG,CAAC,SAAS,CAAC,QAAQ,CAAC,aAAa,CAAC,CACzD;MACH,CAAC,CAAC,IAAI,CAAC,iBAAiB,EACxB;MACA,IAAI,CAAC,WAAW,CAAC,CAAC,CAAC,CAAC;KACrB;EACH,CAAC;EAGD,eAAe,CAAC,CAAwC;IACtD,IACE,CAAC,CAAC;OACC,YAAY,EAAE;OACd,IAAI,CAAC,CAAC,GAAgB,EAAE,EAAE,CAAC,GAAG,CAAC,EAAE,IAAI,GAAG,CAAC,EAAE,KAAK,aAAa,CAAC;MAEjE,OAAO;IAET,IAAI,CAAC,iBAAiB,GAAG,IAAI,CAAC,UAAU,CAAC,aAAa,CACpD,sBAAsB,CACvB,CAAC;IAEF,wBAAwB;IACxB,IAAI,CAAC,qBAAqB,EAAE,CAAC;IAE7B,IAAI,CAAC,UAAU,CAAC,gBAAgB,CAAC,gBAAgB,CAAC,CAAC,OAAO,CAAC,CAAC,IAAI,EAAE,EAAE;MAClE,IAAI,CAAC,gBAAgB,CAAC,OAAO,EAAE,GAAG,EAAE;QAClC,IAAI,CAAC,gBAAgB,EAAE,CAAC;MAC1B,CAAC,CAAC,CAAC;IACL,CAAC,CAAC,CAAC;IAEH,IAAI,CAAC,UAAU,CAAC,gBAAgB,CAAC,gBAAgB,CAAC,CAAC,OAAO,CAAC,CAAC,IAAI,EAAE,EAAE;MAClE,IAAI,CAAC,gBAAgB,CAAC,OAAO,EAAE,GAAG,EAAE;QAClC,IAAI,CAAC,YAAY,EAAE,CAAC;MACtB,CAAC,CAAC,CAAC;IACL,CAAC,CAAC,CAAC;IAEH,IAAI,UAAU,GAAG,IAAI,CAAC,UAAU,CAAC,aAAa,CAAC,eAAe,CAAC,CAAC;IAChE,IAAI,UAAU,EAAE;MACd,UAAU,CAAC,gBAAgB,CAAC,OAAO,EAAE,CAAC,CAAC,EAAE,EAAE;QACzC,CAAC,CAAC,eAAe,EAAE,CAAC;MACtB,CAAC,CAAC,CAAC;KACJ;IAED,IAAI,CAAC,UAAU,GAAG,IAAI,CAAC,UAAU,CAAC,aAAa,CAAC,sBAAsB,CAAC,CAAC;EAC1E,CAAC;EAGD,qBAAqB,CAAC,CAAyC;IAC7D,IAAI,CAAC,IAAI,CAAC,CAAC,YAAY,EAAE,CAAC,IAAI,CAAC,CAAC,EAAE,EAAE,EAAE,CAAC,EAAE,KAAK,IAAI,CAAC,UAAU,CAAC,EAAE;MAC9D,IAAI,CAAC,iBAAiB,GAAG,IAAI,CAAC,UAAU,CAAC,aAAa,CACpD,sBAAsB,CACvB,CAAC;KACH;IACD,IAAI,CAAC,IAAI,CAAC,iBAAiB;MAAE,OAAO;IACpC,IAAI,SAAS,GAAG,IAAI,CAAC,iBAAiB,CAAC;IAEvC,SAAS,CAAC,gBAAgB,CAAC,gBAAgB,CAAC,CAAC,OAAO,CAAC,CAAC,IAAI,EAAE,EAAE;MAC5D,IAAI,CAAC,gBAAgB,CAAC,OAAO,EAAE,CAAC,OAAmB,EAAE,EAAE;QACrD,IAAI,MAAM,GAAG,OAAO,CAAC,MAAqB,CAAC;QAC3C,IAAI,CAAC,YAAY,CAAC,MAAM,CAAC,OAAO,CAAC,MAAM,EAAE,MAAM,CAAC,OAAO,CAAC,SAAS,CAAC,CAAC;MACrE,CAAC,CAAC,CAAC;IACL,CAAC,CAAC,CAAC;IAEH,SAAS,CAAC,gBAAgB,CAAC,WAAW,CAAC,CAAC,OAAO,CAAC,CAAC,IAAI,EAAE,EAAE;MACvD,IAAI,CAAC,gBAAgB,CAAC,OAAO,EAAE,GAAG,EAAE;QAClC,IAAI,CAAC,MAAM,EAAE,CAAC;MAChB,CAAC,CAAC,CAAC;IACL,CAAC,CAAC,CAAC;IAEH,SAAS,CAAC,gBAAgB,CAAC,uBAAuB,CAAC,CAAC,OAAO,CAAC,CAAC,IAAI,EAAE,EAAE;MACnE,IAAI,CAAC,aAAa,GAAG,IAAyB,CAAC;MAC/C,IAAI,CAAC,gBAAgB,CAAC,OAAO,EAAE,GAAG,EAAE;QAClC,IAAI,CAAC,UAAU,CAAC,QAAQ,GAAG,CAAC,CAAC,CAAC;QAC9B,IAAI,CAAC,UAAU,CAAC,SAAS,CAAC,GAAG,CAAC,MAAM,CAAC,CAAC;QACtC,IAAI,CAAC,UAAU,CAAC,YAAY,CAAC,eAAe,EAAE,MAAM,CAAC,CAAC;QACtD,QAAQ,CAAC,IAAI,CAAC,KAAK,CAAC,QAAQ,GAAG,QAAQ,CAAC;QACxC,UAAU,CAAC,GAAG,EAAE,CAAC,IAAI,CAAC,UAAU,CAAC,KAAK,EAAE,EAAE,EAAE,CAAC,CAAC;MAChD,CAAC,CAAC,CAAC;IACL,CAAC,CAAC,CAAC;EACL,CAAC;EAEO,WAAW,CAAC,EAAE;IACpB,IAAI,CAAC,UAAU,CAAC,YAAY,GAAG,EAAE,CAAC,MAAM,CAAC,KAAK,CAAC;EACjD,CAAC;EAEO,MAAM;IACZ,IAAI,CAAC,gBAAgB,EAAE,CAAC;IACxB,IAAI,CAAC,UAAU,CAAC,WAAW,GAAG,KAAK,CAAC;IACpC,IAAI,CAAC,UAAU,CAAC,KAAK,GAAG,EAAE,CAAC;EAC7B,CAAC;EAEO,YAAY,CAAC,KAAK,EAAE,MAAM;IAChC,IAAI,CAAC,UAAU,CAAC,aAAa,CAAC,KAAK,EAAE,MAAM,CAAC,CAAC;EAC/C,CAAC;EAEO,gBAAgB;IACtB,IAAI,CAAC,UAAU,CAAC,aAAa,EAAE,CAAC;EAClC,CAAC;EAEO,YAAY;IAClB,IAAI,CAAC,IAAI,CAAC,UAAU;MAAE,OAAO;IAC7B,IAAI,CAAC,UAAU,CAAC,QAAQ,GAAG,IAAI,CAAC;IAChC,IAAI,CAAC,UAAU,CAAC,SAAS,CAAC,MAAM,CAAC,MAAM,CAAC,CAAC;IACzC,IAAI,CAAC,UAAU,CAAC,YAAY,CAAC,eAAe,EAAE,OAAO,CAAC,CAAC;IACvD,QAAQ,CAAC,IAAI,CAAC,KAAK,CAAC,QAAQ,GAAG,EAAE,CAAC;IAClC,UAAU,CAAC,GAAG,EAAE,CAAC,IAAI,CAAC,aAAa,CAAC,KAAK,EAAE,EAAE,EAAE,CAAC,CAAC;EACnD,CAAC;EAED,gBAAgB;IACd,IAAI,CAAC,EAAE,GAAG,IAAI,cAAc,CAAC,CAAC,OAAO,EAAE,EAAE;MACvC,KAAK,MAAM,KAAK,IAAI,OAAO,EAAE;QAC3B,IAAI,CAAC,KAAK,CAAC,WAAW,CAAC,KAAK;UAAE,OAAO;QACrC,IAAI,CAAC,YAAY,GAAG,KAAK,CAAC,WAAW,CAAC,KAAK,CAAC;OAC7C;IACH,CAAC,CAAC,CAAC;IACH,IAAI,CAAC,EAAE,CAAC,OAAO,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;IACzB,IAAI,CAAC,UAAU,CAAC,OAAO,GAAG;MACxB,YAAY,GAAG,IAAI,CAAC,KAAK,CAAC,CAAC,IAAI,CAAC,GAAG,EAAE,GAAG,WAAW,CAAC,GAAG,IAAI,CAAC;KAC7D,CAAC,CAAC,wBAAwB;EAC7B,CAAC;EAED,MAAM;IACJ,OAAO,CACL,EAAC,IAAI,IACH,KAAK,EAAE,EAAE,KAAK,EAAE,IAAI,CAAC,YAAY,GAAG,GAAG,EAAE,EACzC,GAAG,EAAG,IAAI,CAAC,EAAE,CAAC,aAA0B,CAAC,GAAG,KAAK,KAAK,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,KAAK;MAEtE,gCACW,SAAS,kBACL,eAAe,EAC5B,KAAK,EAAC,iDAAiD,EACvD,GAAG,EAAE,CAAC,GAAG,EAAE,EAAE,CAAC,GAAG,CAAC,GAAG,EAAE,CAAC,CAAC,IAAI,CAAC,UAAU,GAAG,GAAG,CAAC,CAAC,EAChD,EAAE,EAAC,aAAa;QAEhB,cAAQ,IAAI,EAAC,eAAe,EAAC,IAAI,EAAC,UAAU,IACzC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;mBAsUM,CACA;QACT,WAAK,IAAI,EAAC,QAAQ,GAAO;QACzB,eAAQ,CACK,CACV,CACR,CAAC;EACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import {\n Component,\n h,\n Host,\n Element,\n State,\n ComponentInterface,\n Watch,\n Listen,\n} from '@stencil/core';\nimport ResizeObserver from 'resize-observer-polyfill';\n\nimport { AloliaSearchResultDetail } from '../../interface';\nimport { SearchIndex } from '../../interface';\nimport { raf } from '../../utils';\n\n/*\n Nanopore Global Search results component\n * to be used in conjunction with [Globla-Nav](/story/nano-compounds-global-nav).\n * A shortcut / helper which combines algolia components.\n * There should only be one <nano-global-search-results> per page\n * and should be a direct child of <nano-global-nav>\n */\n@Component({\n tag: 'nano-global-search-results',\n styleUrl: 'global-search-results.scss',\n shadow: true,\n})\nexport class GlobalSearchResults implements ComponentInterface {\n private algoliaResultsEle: HTMLNanoAlgoliaResultsElement;\n private filtersDiv: HTMLElement;\n private openFilterBtn: HTMLButtonElement;\n private ro: ResizeObserver;\n\n @State() algoliaEle: HTMLNanoAlgoliaElement;\n @State() currentWidth: number;\n @State() apiKey: string;\n @State() appId: string;\n @State() index: SearchIndex;\n\n @Element() private el: HTMLNanoGlobalSearchResultsElement;\n\n @Watch('algoliaEle')\n @Watch('apiKey')\n @Watch('appId')\n handleAlgoliaCredsChange() {\n if (!this.apiKey \|\| !this.appId \|\| !this.algoliaEle) return;\n this.algoliaEle.apiKey = this.apiKey;\n this.algoliaEle.appId = this.appId;\n }\n\n @Watch('algoliaEle')\n @Watch('index')\n handleAlgoliaIndexChange() {\n if (!this.index \|\| !this.algoliaEle) return;\n this.algoliaEle.searchIndex = this.index;\n }\n\n @Listen('nanoSearchReset', { target: 'body' })\n handleGlobalNavReset(e: CustomEvent & { target: HTMLElement }) {\n if (e.target.tagName !== 'NANO-GLOBAL-NAV') return;\n this.algoliaResultsEle = null;\n this.goback();\n }\n\n @Listen('nanoSearchResult', { target: 'body' })\n handleGlobalNavSearch(e: CustomEvent & { target: HTMLElement }) {\n if (e.target.tagName !== 'NANO-GLOBAL-NAV') return;\n const {\n detail: { results, client },\n } = e as { detail: AloliaSearchResultDetail };\n const result = results.find((result) => result.selected);\n\n this.apiKey = client.apiKey;\n this.appId = client.appId;\n this.index = {\n name: result.indexName,\n index: result.index,\n domain: result.domain,\n filters: result.filters,\n };\n this.algoliaEle.query = result.query;\n }\n\n @Listen('nanoChange')\n handleReorder(e: CustomEvent & { target: HTMLNanoSelectElement }) {\n if (\n e\n .composedPath()\n .find(\n (ele: HTMLElement) =>\n ele.classList && ele.classList.contains('indexchange')\n ) &&\n !!this.algoliaResultsEle\n ) {\n this.changeOrder(e);\n }\n }\n\n @Listen('nanoResultsShown')\n attachListeners(e: CustomEvent & { target: HTMLElement }) {\n if (\n !e\n .composedPath()\n .find((ele: HTMLElement) => ele.id && ele.id === 'main-search')\n )\n return;\n\n this.algoliaResultsEle = this.algoliaEle.querySelector(\n '#main-search-results'\n );\n\n // add results listeners\n this.attachResultListeners();\n\n this.algoliaEle.querySelectorAll('.filters-reset').forEach((item) => {\n item.addEventListener('click', () => {\n this.removeAllFilters();\n });\n });\n\n this.algoliaEle.querySelectorAll('.close-filters').forEach((item) => {\n item.addEventListener('click', () => {\n this.closefilters();\n });\n });\n\n let filterWrap = this.algoliaEle.querySelector('.filters-wrap');\n if (filterWrap) {\n filterWrap.addEventListener('click', (e) => {\n e.stopPropagation();\n });\n }\n\n this.filtersDiv = this.algoliaEle.querySelector('#main-search-filters');\n }\n\n @Listen('nanoNewResults', { target: 'body' })\n attachResultListeners(e?: CustomEvent & { target: HTMLElement }) {\n if (e && e.composedPath().find((el) => el === this.algoliaEle)) {\n this.algoliaResultsEle = this.algoliaEle.querySelector(\n 'nano-algolia-results'\n );\n }\n if (!this.algoliaResultsEle) return;\n let resultEle = this.algoliaResultsEle;\n\n resultEle.querySelectorAll('.remove-filter').forEach((item) => {\n item.addEventListener('click', (clickEv: MouseEvent) => {\n let filter = clickEv.target as HTMLElement;\n this.removeFilter(filter.dataset.filter, filter.dataset.filterVal);\n });\n });\n\n resultEle.querySelectorAll('.back-btn').forEach((item) => {\n item.addEventListener('click', () => {\n this.goback();\n });\n });\n\n resultEle.querySelectorAll('.topbar__show-filters').forEach((item) => {\n this.openFilterBtn = item as HTMLButtonElement;\n item.addEventListener('click', () => {\n this.filtersDiv.tabIndex = -1;\n this.filtersDiv.classList.add('show');\n this.filtersDiv.setAttribute('aria-expanded', 'true');\n document.body.style.overflow = 'hidden';\n setTimeout(() => this.filtersDiv.focus(), 20);\n });\n });\n }\n\n private changeOrder(ev) {\n this.algoliaEle.replicaIndex = ev.detail.value;\n }\n\n private goback() {\n this.removeAllFilters();\n this.algoliaEle.showResults = false;\n this.algoliaEle.query = '';\n }\n\n private removeFilter(facet, filter) {\n this.algoliaEle.removeFilters(facet, filter);\n }\n\n private removeAllFilters() {\n this.algoliaEle.removeFilters();\n }\n\n private closefilters() {\n if (!this.filtersDiv) return;\n this.filtersDiv.tabIndex = null;\n this.filtersDiv.classList.remove('show');\n this.filtersDiv.setAttribute('aria-expanded', 'false');\n document.body.style.overflow = '';\n setTimeout(() => this.openFilterBtn.focus(), 20);\n }\n\n componentDidLoad() {\n this.ro = new ResizeObserver((entries) => {\n for (const entry of entries) {\n if (!entry.contentRect.width) return;\n this.currentWidth = entry.contentRect.width;\n }\n });\n this.ro.observe(this.el);\n this.algoliaEle.filters = [\n 'created > ' + Math.floor((Date.now() - 63115200000) / 1000),\n ]; // only get last 2 years\n }\n\n render() {\n return (\n <Host\n class={{ small: this.currentWidth < 577 }}\n dir={(this.el.ownerDocument as Document).dir === 'rtl' ? 'rtl' : false}\n >\n <nano-algolia\n store-id=\"searchq\"\n store-method=\"url-hash-push\"\n class=\"main-search__wrap sc-nano-global-search-results\"\n ref={(ele) => raf(() => (this.algoliaEle = ele))}\n id=\"main-search\"\n >\n <script type=\"text/template\" slot=\"template\">\n {`<div class=\"main-search sc-nano-global-search-results\">\n <nano-algolia-results id=\"main-search-results\" class=\"main-search__results sc-nano-global-search-results\" infinite-scroll>\n <script type=\"text/template\" slot=\"start-template\">\n <div class=\"sc-nano-global-search-results main-search__topbar topbar\">\n <button class=\"sc-nano-global-search-results topbar__bkbtn back-btn icon-button\">\n <nano-icon class=\"sc-nano-global-search-results\" name=\"light/chevron-left\" size=\"small\"></nano-icon>\n </button>\n <div>\n <em class=\"sc-nano-global-search-results topbar__query\">'{{ it.query }}' - </em> <strong>{{ it.totalHitsWithFilters }}</strong> Results\n </div>\n\n <div class=\"sc-nano-global-search-results topbar__filtering\">\n {{ @if (it.results.length) }}\n\n {{ @if (it.indexName === 'All') }}\n <nano-select class=\"sc-nano-global-search-results topbar__order topbar__order--www indexchange\" value=\"{{ it.index }}\" hide-label=\"true\" label=\"Sort order\" show-inline-error=\"false\">\n <option value=\"all_prod_en\">Sort by: Most relevant</option>\n <option value=\"all_prod_en_date_desc\">Sort by: Newest</option>\n <option value=\"all_prod_en_date_asc\">Sort by: Oldest</option>\n <option value=\"all_prod_en_activity_date_desc\">Sort by: Recent activity</option>\n </nano-select>\n {{ /if }}\n\n {{ @if (it.indexName === 'www') }}\n <nano-select class=\"sc-nano-global-search-results topbar__order topbar__order--www indexchange\" value=\"{{ it.index }}\" hide-label=\"true\" label=\"Sort order\" show-inline-error=\"false\">\n <option value=\"cws_english_en\">Sort by: Most relevant</option>\n <option value=\"cws_english_en_date_desc\">Sort by: Newest</option>\n <option value=\"cws_english_en_date_asc\">Sort by: Oldest</option>\n </nano-select>\n {{ /if }}\n\n {{ @if (it.indexName === 'Resources') }}\n <nano-select class=\"sc-nano-global-search-results topbar__order topbar__order--www indexchange\" value=\"{{ it.index }}\" hide-label=\"true\" label=\"Sort order\" show-inline-error=\"false\">\n <option value=\"cws_english_resources_en\">Sort by: Most relevant</option>\n <option value=\"cws_english_resources_en_featured_desc\">Sort by: Newest</option>\n <option value=\"cws_english_resources_en_featured_asc\">Sort by: Oldest</option>\n </nano-select>\n {{ /if }}\n\n {{ @if (it.indexName === 'Store') }}\n <nano-select class=\"sc-nano-global-search-results topbar__order topbar__order--www indexchange\" value=\"{{ it.index }}\" hide-label=\"true\" label=\"Sort order\" show-inline-error=\"false\">\n <option value=\"store_prod\">Sort by: Most relevant</option>\n <option value=\"store_prod_date_desc\">Sort by: Newest</option>\n <option value=\"store_prod_date_asc\">Sort by: Oldest</option>\n </nano-select>\n {{ /if }}\n\n {{ @if (it.indexName === 'Community') }}\n <nano-select class=\"sc-nano-global-search-results topbar__order topbar__order--community indexchange\" value=\"{{ it.index }}\" hide-label=\"true\" label=\"Sort order\" show-inline-error=\"false\">\n <option value=\"community_prod\">Sort by: Most relevant</option>\n <option value=\"community_prod_date_desc\">Sort by: Newest</option>\n <option value=\"community_prod_date_asc\">Sort by: Oldest</option>\n <option value=\"community_prod_activity_date_desc\">Sort by: Recent activity</option>\n </nano-select>\n {{ /if }}\n {{ /if }}\n\n <button class=\"sc-nano-global-search-results topbar__show-filters filters-title\" aria-controls=\"main-search-filters\">\n {{ @if (it.appliedFilters && it.appliedFilters.length > 0) }}\n <span class=\"sc-nano-global-search-results topbar__filter-count\">\n {{ (it.appliedFilters.reduce(function(a, b) { return a + (b.values ? b.values.length : 0) }, 0)) }}\n </span>\n {{ /if }}\n <nano-icon class=\"sc-nano-global-search-results\" name=\"light/filter\"></nano-icon>\n </button>\n </div>\n </div>\n\n {{ @if (it.results.length) }}\n <div class=\"sc-nano-global-search-results main-search__applied-filters\">\n {{ @if (it.appliedFilters) }}\n {{ @each(it.appliedFilters) => filterObj }}\n {{ @each(filterObj.values) => filterVal }}\n <span class=\"sc-nano-global-search-results main-search__applied-filter\">\n {{ filterVal \| public_name }}\n <button class=\"sc-nano-global-search-results icon-button remove-filter\" data-filter=\"{{ filterObj.name }}\" data-filter-val=\"{{ filterVal }}\">\n <nano-icon class=\"sc-nano-global-search-results\" name=\"light/times\"></nano-icon>\n </button>\n </span>\n {{ /each }}\n {{ /each }}\n {{ #else }}\n <span class=\"sc-nano-global-search-results main-search__applied-nofilter\"> </span>\n {{ /if }}\n </div>\n {{ /if }}\n </script>\n\n <script type=\"text/template\" slot=\"result-template\">\n {{ @if (it.totalHitsWithFilters > 0) }}\n {{ @each(it.results) => result }}\n <li class=\"sc-nano-global-search-results\">\n <a class=\"sc-nano-global-search-results result\" href=\"{{ result.url \| abs_url(it, result) }}\">\n <h4 class=\"sc-nano-global-search-results result__title\" data-icon-set=\"{{(iconSet = false)}}\">\n {{ @if (!it.legacy) }}\n\n {{ @if (result.type === 'faq' \|\| result.type === 'faqs') }}\n <nano-icon data-icon-set=\"{{(iconSet = true)}}\" class=\"sc-nano-global-search-results\" name=\"light/question-circle\"></nano-icon>\n {{ /if }}\n\n {{ @if (result.type === 'comment') }}\n <nano-icon data-icon-set=\"{{(iconSet = true)}}\" class=\"sc-nano-global-search-results\" name=\"light/comment\"></nano-icon>\n {{ /if }}\n\n {{ @if (result.type === 'protocol') }}\n <nano-icon data-icon-set=\"{{(iconSet = true)}}\" class=\"sc-nano-global-search-results\" name=\"light/clipboard-list\"></nano-icon>\n {{ /if }}\n\n {{ @if (result.type === 'publication') }}\n <nano-icon data-icon-set=\"{{(iconSet = true)}}\" class=\"sc-nano-global-search-results\" name=\"light/file-chart-line\"></nano-icon>\n {{ /if }}\n\n {{ @if (result.type === 'poster' \|\| result.type === 'lc_poster') }}\n <nano-icon data-icon-set=\"{{(iconSet = true)}}\" class=\"sc-nano-global-search-results\" name=\"light/presentation\"></nano-icon>\n {{ /if }}\n\n {{ @if (result.type === 'post') }}\n <nano-icon data-icon-set=\"{{(iconSet = true)}}\" class=\"sc-nano-global-search-results\" name=\"light/comments\"></nano-icon>\n {{ /if }}\n\n {{ @if (result.type === 'news_item') }}\n <nano-icon data-icon-set=\"{{(iconSet = true)}}\" class=\"sc-nano-global-search-results\" name=\"light/newspaper\"></nano-icon>\n {{ /if }}\n\n {{ @if (result.type === 'event') }}\n <nano-icon data-icon-set=\"{{(iconSet = true)}}\" class=\"sc-nano-global-search-results\" name=\"light/calendar\"></nano-icon>\n {{ /if }}\n\n {{ @if (result.type === 'talk' \|\| result.type === 'lc_lightning_talk' \|\| result.type === 'ncm_plenary_talk' \|\| result.type === 'ncm_lightning_talk') }}\n <nano-icon data-icon-set=\"{{(iconSet = true)}}\" class=\"sc-nano-global-search-results\" name=\"light/keynote\"></nano-icon>\n {{ /if }}\n\n {{ @if (result.type === 'video') }}\n <nano-icon data-icon-set=\"{{(iconSet = true)}}\" class=\"sc-nano-global-search-results\" name=\"light/video\"></nano-icon>\n {{ /if }}\n\n {{ @if (result.type === 'data_release') }}\n <nano-icon data-icon-set=\"{{(iconSet = true)}}\" class=\"sc-nano-global-search-results\" name=\"light/analytics\"></nano-icon>\n {{ /if }}\n\n {{ @if (result.type === 'job_vacancy') }}\n <nano-icon data-icon-set=\"{{(iconSet = true)}}\" class=\"sc-nano-global-search-results\" name=\"light/ballot-check\"></nano-icon>\n {{ /if }}\n\n {{ @if (result.type === 'tool') }}\n <nano-icon data-icon-set=\"{{(iconSet = true)}}\" class=\"sc-nano-global-search-results\" name=\"light/wrench\"></nano-icon>\n {{ /if }}\n\n {{ @if (result.type === 'literature') }}\n <nano-icon data-icon-set=\"{{(iconSet = true)}}\" class=\"sc-nano-global-search-results\" name=\"light/book\"></nano-icon>\n {{ /if }}\n\n {{ @if (result.type === 'community_info') }}\n <nano-icon data-icon-set=\"{{(iconSet = true)}}\" class=\"sc-nano-global-search-results\" name=\"light/users\"></nano-icon>\n {{ /if }}\n\n {{ @if (result.type === 'article') }}\n <nano-icon data-icon-set=\"{{(iconSet = true)}}\" class=\"sc-nano-global-search-results\" name=\"light/file-alt\"></nano-icon>\n {{ /if }}\n\n {{ @if (result.type === 'provider') }}\n <nano-icon data-icon-set=\"{{(iconSet = true)}}\" class=\"sc-nano-global-search-results\" name=\"light/handshake\"></nano-icon>\n {{ /if }}\n\n {{ @if (result.type === 'apps') }}\n <nano-icon data-icon-set=\"{{(iconSet = true)}}\" class=\"sc-nano-global-search-results\" name=\"light/vials\"></nano-icon>\n {{ /if }}\n\n {{ @if (result.type === 'white_paper') }}\n <nano-icon data-icon-set=\"{{(iconSet = true)}}\" class=\"sc-nano-global-search-results\" name=\"light/file-pdf\"></nano-icon>\n {{ /if }}\n\n {{ @if (result.type === 'Nanopore Store') }}\n <nano-icon data-icon-set=\"{{(iconSet = true)}}\" class=\"sc-nano-global-search-results\" name=\"light/shopping-cart\"></nano-icon>\n {{ /if }}\n\n {{ @if (!result.type \|\| !iconSet) }}\n <nano-icon class=\"sc-nano-global-search-results\" name=\"light/file\"></nano-icon>\n {{ /if }}\n {{ /if }}\n {{ result.title \| safe }}\n </h4>\n {{ @if (result.body) }}\n <div class=\"sc-nano-global-search-results result__body\">{{ result.body \| safe \| trim_to(200) }}</div>\n {{ /if }}\n {{ @if (result.updated) }}\n <div class=\"sc-nano-global-search-results result__date\">Last Updated: {{ result.updated \| date_short }}</div>\n {{ #else }}\n {{ @if (result.created) }}\n <div class=\"sc-nano-global-search-results result__date\">Added: {{ result.created \| date_short }}</div>\n {{ /if }}\n {{ /if }}\n </a>\n </li>\n {{ /each }}\n {{ /if }}\n </script>\n\n <div slot=\"start-output\"></div>\n <ul slot=\"result-output\" class=\"sc-nano-global-search-results\"></ul>\n </nano-algolia-results>\n\n {{ @if(Object.keys(it.origFilters).length) }}\n <div class=\"sc-nano-global-search-results main-search__filters filters close-filters\" id=\"main-search-filters\">\n <div class=\"sc-nano-global-search-results filters-wrap\">\n {{ @if(it.totalHits) }}\n <div class=\"sc-nano-global-search-results filters-header\">\n <strong class=\"sc-nano-global-search-results filters-title\">Filters</strong>\n <button class=\"sc-nano-global-search-results filters-reset\">Reset</button>\n <button class=\"sc-nano-global-search-results filters__close-filters close-filters icon-button\" aria-controls=\"main-search-filters\">\n <nano-icon class=\"sc-nano-global-search-results\" name=\"light/times\"></nano-icon>\n </button>\n </div>\n {{ /if }}\n\n <div>\n {{ @if(it.origFilters['type']) }}\n <nano-details class=\"sc-nano-global-search-results\" open={true} icon-rotation=\"180\">\n <strong slot=\"label\">Type</strong>\n <nano-icon slot=\"icon-end\" name=\"light/chevron-down\" size=\"small\"></nano-icon>\n <nano-algolia-filter store-id=\"searchf1\" store-method=\"url-hash-push\" filter-name=\"type\">\n <script type=\"text/template\" slot=\"filter-template\">\n <ul class=\"sc-nano-global-search-results\" data-num=\"{{(x = 0)}}\">\n {{ @foreach(it.dyn) => filter, filterVal }}\n <li class=\"sc-nano-global-search-results\" data-num=\"{{(x++)}}\">\n <input class=\"sc-nano-global-search-results filter-cb\" type=\"checkbox\" value=\"{{ filter }}\" id=\"type-{{ filter }}-{{x}}\" />\n <label class=\"sc-nano-global-search-results filter-label\" for=\"type-{{ filter }}-{{x}}\">\n <span>{{ filter \| public_name }} (<strong>{{ filterVal }}</strong>)</span>\n </label></li>\n {{ /foreach }}\n </ul>\n </script>\n <div slot=\"output\"></div>\n </nano-algolia-filter>\n </nano-details>\n {{ /if }}\n\n {{ @if(it.origFilters['channel']) }}\n <nano-details open={true} icon-rotation=\"180\">\n <strong slot=\"label\">Channels</strong>\n <nano-icon slot=\"icon-end\" name=\"light/chevron-down\" size=\"small\"></nano-icon>\n <nano-algolia-filter store-id=\"searchf2\" store-method=\"url-hash-push\" filter-name=\"channel\">\n <script type=\"text/template\" slot=\"filter-template\">\n <ul class=\"sc-nano-global-search-results\" data-num=\"{{(x = 0)}}\">\n {{ @foreach(it.dyn) => filter, filterVal }}\n <li class=\"sc-nano-global-search-results\" data-num=\"{{(x++)}}\">\n <input class=\"filter-cb sc-nano-global-search-results\" type=\"checkbox\" value=\"{{ filter }}\" id=\"channel-{{ filter }}-{{x}}\" />\n <label class=\"filter-label sc-nano-global-search-results\" for=\"channel-{{ filter }}-{{x}}\">\n <span>{{ filter \| public_name }} (<strong>{{ filterVal }}</strong>)</span>\n </label></li>\n {{ /foreach }}\n </ul>\n </script>\n <div slot=\"output\"></div>\n </nano-algolia-filter>\n </nano-details>\n {{ /if }}\n\n {{ @if(it.origFilters['authors']) }}\n <nano-details open={true} icon-rotation=\"180\">\n <strong slot=\"label\">Authors</strong>\n <nano-icon slot=\"icon-end\" name=\"light/chevron-down\" size=\"small\"></nano-icon>\n <nano-algolia-filter store-id=\"searchf3\" store-method=\"url-hash-push\" filter-name=\"authors\">\n <script type=\"text/template\" slot=\"filter-template\">\n <ul class=\"sc-nano-global-search-results\" data-num=\"{{(x = 0)}}\">\n {{ @foreach(it.dyn) => filter, filterVal }}\n <li class=\"sc-nano-global-search-results\" data-num=\"{{(x++)}}\">\n <input class=\"filter-cb sc-nano-global-search-results\" type=\"checkbox\" value=\"{{ filter }}\" id=\"authors-{{ filter }}-{{x}}\" />\n <label class=\"filter-label sc-nano-global-search-results\" for=\"authors-{{ filter }}-{{x}}\">\n <span>{{ filter \| public_name }} (<strong>{{ filterVal }}</strong>)</span>\n </label></li>\n {{ /foreach }}\n </ul>\n </script>\n <div slot=\"output\"></div>\n </nano-algolia-filter>\n </nano-details>\n {{ /if }}\n\n {{ @if(it.origFilters['categories_without_path']) }}\n <nano-details open={true} icon-rotation=\"180\">\n <strong slot=\"label\">Category</strong>\n <nano-icon slot=\"icon-end\" name=\"light/chevron-down\" size=\"small\"></nano-icon>\n <nano-algolia-filter store-id=\"searchf4\" store-method=\"url-hash-push\" filter-name=\"categories_without_path\">\n <script type=\"text/template\" slot=\"filter-template\">\n <ul class=\"sc-nano-global-search-results\" data-num=\"{{(x = 0)}}\">\n {{ @foreach(it.dyn) => filter, filterVal }}\n {{ @if(!filter.match(/publication/)) }}\n <li class=\"sc-nano-global-search-results\" data-num=\"{{(x++)}}\">\n <input class=\"sc-nano-global-search-results filter-cb\" type=\"checkbox\" value=\"{{ filter }}\" id=\"cwp-{{ filter }}-{{x}}\" />\n <label class=\"sc-nano-global-search-results filter-label\" for=\"cwp-{{ filter }}-{{x}}\">\n <span>{{ filter \| public_name }} (<strong>{{ filterVal }}</strong>)</span>\n </label></li>\n {{ /if }}\n {{ /foreach }}\n </ul>\n </script>\n <div slot=\"output\"></div>\n </nano-algolia-filter>\n </nano-details>\n {{ /if }}\n\n {{ @if(it.origFilters['tags']) }}\n <nano-details open={true} icon-rotation=\"180\">\n <strong slot=\"label\">Tags</strong>\n <nano-icon slot=\"icon-end\" name=\"light/chevron-down\" size=\"small\"></nano-icon>\n <nano-algolia-filter store-id=\"searchf5\" store-method=\"url-hash-push\" filter-name=\"tags\">\n <script type=\"text/template\" slot=\"filter-template\">\n <ul class=\"sc-nano-global-search-results\" data-num=\"{{(x = 0)}}\">\n {{ @foreach(it.dyn) => filter, filterVal }}\n <li class=\"sc-nano-global-search-results\" data-num=\"{{(x++)}}\">\n <input class=\"filter-cb sc-nano-global-search-results\" type=\"checkbox\" value=\"{{ filter }}\" id=\"tags-{{ filter }}-{{x}}\" />\n <label class=\"filter-label sc-nano-global-search-results\" for=\"tags-{{ filter }}-{{x}}\">\n <span>{{ filter \| public_name }} (<strong>{{ filterVal }}</strong>)</span>\n </label></li>\n {{ /foreach }}\n </ul>\n </script>\n <div slot=\"output\"></div>\n </nano-algolia-filter>\n </nano-details>\n {{ /if }}\n </div>\n </div>\n </div>\n {{ /if }}\n </div>`}\n </script>\n <div slot=\"output\"></div>\n <slot />\n </nano-algolia>\n </Host>\n );\n }\n}\n"]}

package/dist/collection/components/grid/grid-item.js CHANGED Viewed

@@ -124,7 +124,7 @@ export class GridItem {
           },
           "GridSizes": {
             "location": "import",
-            "path": "/builds/ca3VH5WE/0/Digital/nano-components/packages/components/src/interface.d.ts"
+            "path": "/builds/DM3XkNuX/0/Digital/nano-components/packages/components/src/interface.d.ts"
           }
         },
         "return": "Promise<void>"

package/dist/collection/components/icon/icon.js CHANGED Viewed

@@ -116,7 +116,7 @@ export class Icon {
         "references": {
           "Color": {
             "location": "import",
-            "path": "/builds/ca3VH5WE/0/Digital/nano-components/packages/components/src/interface.d.ts"
+            "path": "/builds/DM3XkNuX/0/Digital/nano-components/packages/components/src/interface.d.ts"
           }
         }
       },

package/dist/collection/components/input/input.js CHANGED Viewed

@@ -440,7 +440,7 @@ export class Input {
         "references": {
           "Color": {
             "location": "import",
-            "path": "/builds/ca3VH5WE/0/Digital/nano-components/packages/components/src/interface.d.ts"
+            "path": "/builds/DM3XkNuX/0/Digital/nano-components/packages/components/src/interface.d.ts"
           }
         }
       },
@@ -1011,7 +1011,7 @@ export class Input {
         "references": {
           "TextFieldTypes": {
             "location": "import",
-            "path": "/builds/ca3VH5WE/0/Digital/nano-components/packages/components/src/interface.d.ts"
+            "path": "/builds/DM3XkNuX/0/Digital/nano-components/packages/components/src/interface.d.ts"
           }
         }
       },
@@ -1170,7 +1170,7 @@ export class Input {
         "references": {
           "InputChangeEventDetail": {
             "location": "import",
-            "path": "/builds/ca3VH5WE/0/Digital/nano-components/packages/components/src/interface.d.ts"
+            "path": "/builds/DM3XkNuX/0/Digital/nano-components/packages/components/src/interface.d.ts"
           }
         }
       }
@@ -1259,7 +1259,7 @@ export class Input {
         "references": {
           "ControlValidityEventDetail": {
             "location": "import",
-            "path": "/builds/ca3VH5WE/0/Digital/nano-components/packages/components/src/interface.d.ts"
+            "path": "/builds/DM3XkNuX/0/Digital/nano-components/packages/components/src/interface.d.ts"
           }
         }
       }
@@ -1281,7 +1281,7 @@ export class Input {
           },
           "ControlValidity": {
             "location": "import",
-            "path": "/builds/ca3VH5WE/0/Digital/nano-components/packages/components/src/interface.d.ts"
+            "path": "/builds/DM3XkNuX/0/Digital/nano-components/packages/components/src/interface.d.ts"
           }
         },
         "return": "Promise<ControlValidity>"

package/dist/collection/components/nav-item/nav-item.js CHANGED Viewed

@@ -488,7 +488,7 @@ export class NavItem {
         "references": {
           "NavItemEventDetail": {
             "location": "import",
-            "path": "/builds/ca3VH5WE/0/Digital/nano-components/packages/components/src/interface.d.ts"
+            "path": "/builds/DM3XkNuX/0/Digital/nano-components/packages/components/src/interface.d.ts"
           }
         }
       }
@@ -508,7 +508,7 @@ export class NavItem {
         "references": {
           "NavItemEventDetail": {
             "location": "import",
-            "path": "/builds/ca3VH5WE/0/Digital/nano-components/packages/components/src/interface.d.ts"
+            "path": "/builds/DM3XkNuX/0/Digital/nano-components/packages/components/src/interface.d.ts"
           }
         }
       }
@@ -528,7 +528,7 @@ export class NavItem {
         "references": {
           "NavItemEventDetail": {
             "location": "import",
-            "path": "/builds/ca3VH5WE/0/Digital/nano-components/packages/components/src/interface.d.ts"
+            "path": "/builds/DM3XkNuX/0/Digital/nano-components/packages/components/src/interface.d.ts"
           }
         }
       }
@@ -548,7 +548,7 @@ export class NavItem {
         "references": {
           "NavItemEventDetail": {
             "location": "import",
-            "path": "/builds/ca3VH5WE/0/Digital/nano-components/packages/components/src/interface.d.ts"
+            "path": "/builds/DM3XkNuX/0/Digital/nano-components/packages/components/src/interface.d.ts"
           }
         }
       }

package/dist/collection/components/range/range.js CHANGED Viewed

@@ -370,7 +370,7 @@ export class Range {
         "references": {
           "Color": {
             "location": "import",
-            "path": "/builds/ca3VH5WE/0/Digital/nano-components/packages/components/src/interface.d.ts"
+            "path": "/builds/DM3XkNuX/0/Digital/nano-components/packages/components/src/interface.d.ts"
           }
         }
       },
@@ -594,7 +594,7 @@ export class Range {
         "references": {
           "RangeValue": {
             "location": "import",
-            "path": "/builds/ca3VH5WE/0/Digital/nano-components/packages/components/src/interface.d.ts"
+            "path": "/builds/DM3XkNuX/0/Digital/nano-components/packages/components/src/interface.d.ts"
           }
         }
       },
@@ -632,7 +632,7 @@ export class Range {
         "references": {
           "RangeChangeEventDetail": {
             "location": "import",
-            "path": "/builds/ca3VH5WE/0/Digital/nano-components/packages/components/src/interface.d.ts"
+            "path": "/builds/DM3XkNuX/0/Digital/nano-components/packages/components/src/interface.d.ts"
           }
         }
       }
@@ -655,7 +655,7 @@ export class Range {
         "references": {
           "StyleEventDetail": {
             "location": "import",
-            "path": "/builds/ca3VH5WE/0/Digital/nano-components/packages/components/src/interface.d.ts"
+            "path": "/builds/DM3XkNuX/0/Digital/nano-components/packages/components/src/interface.d.ts"
           }
         }
       }

package/dist/collection/components/resize-observe/resize-observe.js CHANGED Viewed

@@ -176,7 +176,7 @@ export class ResizeObserve {
         "references": {
           "ResizeStateChangeEventDetail": {
             "location": "import",
-            "path": "/builds/ca3VH5WE/0/Digital/nano-components/packages/components/src/interface.d.ts"
+            "path": "/builds/DM3XkNuX/0/Digital/nano-components/packages/components/src/interface.d.ts"
           }
         }
       }

package/dist/collection/components/select/select.js CHANGED Viewed

@@ -873,7 +873,7 @@ export class Select {
         "references": {
           "Color": {
             "location": "import",
-            "path": "/builds/ca3VH5WE/0/Digital/nano-components/packages/components/src/interface.d.ts"
+            "path": "/builds/DM3XkNuX/0/Digital/nano-components/packages/components/src/interface.d.ts"
           }
         }
       },
@@ -1377,7 +1377,7 @@ export class Select {
         "references": {
           "SelectChangeEventDetail": {
             "location": "import",
-            "path": "/builds/ca3VH5WE/0/Digital/nano-components/packages/components/src/interface.d.ts"
+            "path": "/builds/DM3XkNuX/0/Digital/nano-components/packages/components/src/interface.d.ts"
           }
         }
       }
@@ -1463,7 +1463,7 @@ export class Select {
         "references": {
           "InputChangeEventDetail": {
             "location": "import",
-            "path": "/builds/ca3VH5WE/0/Digital/nano-components/packages/components/src/interface.d.ts"
+            "path": "/builds/DM3XkNuX/0/Digital/nano-components/packages/components/src/interface.d.ts"
           }
         }
       }
@@ -1486,7 +1486,7 @@ export class Select {
         "references": {
           "ControlValidityEventDetail": {
             "location": "import",
-            "path": "/builds/ca3VH5WE/0/Digital/nano-components/packages/components/src/interface.d.ts"
+            "path": "/builds/DM3XkNuX/0/Digital/nano-components/packages/components/src/interface.d.ts"
           }
         }
       }
@@ -1508,7 +1508,7 @@ export class Select {
           },
           "ControlValidity": {
             "location": "import",
-            "path": "/builds/ca3VH5WE/0/Digital/nano-components/packages/components/src/interface.d.ts"
+            "path": "/builds/DM3XkNuX/0/Digital/nano-components/packages/components/src/interface.d.ts"
           }
         },
         "return": "Promise<ControlValidity>"

package/dist/collection/components/slides/slides.js CHANGED Viewed

@@ -453,7 +453,7 @@ export class Slides {
         "references": {
           "FlickityOptions": {
             "location": "import",
-            "path": "/builds/ca3VH5WE/0/Digital/nano-components/packages/components/src/interface.d.ts"
+            "path": "/builds/DM3XkNuX/0/Digital/nano-components/packages/components/src/interface.d.ts"
           }
         }
       },
@@ -556,7 +556,7 @@ export class Slides {
         "references": {
           "SlideAnimation": {
             "location": "import",
-            "path": "/builds/ca3VH5WE/0/Digital/nano-components/packages/components/src/interface.d.ts"
+            "path": "/builds/DM3XkNuX/0/Digital/nano-components/packages/components/src/interface.d.ts"
           }
         }
       },
@@ -747,7 +747,7 @@ export class Slides {
         "references": {
           "DragEvent": {
             "location": "import",
-            "path": "/builds/ca3VH5WE/0/Digital/nano-components/packages/components/src/interface.d.ts"
+            "path": "/builds/DM3XkNuX/0/Digital/nano-components/packages/components/src/interface.d.ts"
           }
         }
       }
@@ -767,7 +767,7 @@ export class Slides {
         "references": {
           "DragEvent": {
             "location": "import",
-            "path": "/builds/ca3VH5WE/0/Digital/nano-components/packages/components/src/interface.d.ts"
+            "path": "/builds/DM3XkNuX/0/Digital/nano-components/packages/components/src/interface.d.ts"
           }
         }
       }
@@ -787,7 +787,7 @@ export class Slides {
         "references": {
           "DragEvent": {
             "location": "import",
-            "path": "/builds/ca3VH5WE/0/Digital/nano-components/packages/components/src/interface.d.ts"
+            "path": "/builds/DM3XkNuX/0/Digital/nano-components/packages/components/src/interface.d.ts"
           }
         }
       }
@@ -807,7 +807,7 @@ export class Slides {
         "references": {
           "DragEvent": {
             "location": "import",
-            "path": "/builds/ca3VH5WE/0/Digital/nano-components/packages/components/src/interface.d.ts"
+            "path": "/builds/DM3XkNuX/0/Digital/nano-components/packages/components/src/interface.d.ts"
           }
         }
       }
@@ -1114,7 +1114,7 @@ export class Slides {
           },
           "Flickity": {
             "location": "import",
-            "path": "/builds/ca3VH5WE/0/Digital/nano-components/packages/components/src/interface.d.ts"
+            "path": "/builds/DM3XkNuX/0/Digital/nano-components/packages/components/src/interface.d.ts"
           }
         },
         "return": "Promise<Flickity>"

package/dist/collection/components/tabs/tab-group.js CHANGED Viewed

@@ -443,7 +443,7 @@ export class TabGroup {
         "references": {
           "Color": {
             "location": "import",
-            "path": "/builds/ca3VH5WE/0/Digital/nano-components/packages/components/src/interface.d.ts"
+            "path": "/builds/DM3XkNuX/0/Digital/nano-components/packages/components/src/interface.d.ts"
           }
         }
       },
@@ -486,7 +486,7 @@ export class TabGroup {
         "references": {
           "StorageMethods": {
             "location": "import",
-            "path": "/builds/ca3VH5WE/0/Digital/nano-components/packages/components/src/utils/store/component-store.ts"
+            "path": "/builds/DM3XkNuX/0/Digital/nano-components/packages/components/src/utils/store/component-store.ts"
           }
         }
       },

package/dist/collection/utils/testing/index.js CHANGED Viewed

@@ -45,6 +45,7 @@ export class E2EPlayGround {
       viewportWidth: this.viewportWidth,
       viewportHeight: this.viewportHeight,
       dir: docOpts ? docOpts.dir : 'ltr',
+      padding: docOpts ? docOpts.padding : '1rem',
     });
     return this.page;
   }
@@ -96,7 +97,7 @@ export async function getFocusedElement(page, shadowEleSelector = null) {
 }
 export async function createPage(optionsOrHtml) {
   const options = typeof optionsOrHtml === 'string'
-    ? { html: optionsOrHtml, viewportWidth: 600, dir: 'ltr' }
+    ? { html: optionsOrHtml, viewportWidth: 600, dir: 'ltr', padding: '1rem' }
     : optionsOrHtml;
   const page = (await newE2EPage());
   // setup navigator langs for consistent localization
@@ -117,7 +118,7 @@ export async function createPage(optionsOrHtml) {
   await page.setViewport(viewport);
   // add content
   await page.setContent(`<link rel="stylesheet" href="/themes/nanopore.css">
-    <div class="screenshot" style="padding: 1rem;">${options.html}</div>`, { waitUntil: 'networkidle2' });
+    <div class="screenshot" style="padding: ${options.padding || '1rem'};">${options.html}</div>`, { waitUntil: 'networkidle2' });
   // set the direction - need to set here as stencil removes it on setContent
   await page.evaluate((dir) => {
     document.documentElement.setAttribute('dir', dir);

package/dist/collection/utils/testing/index.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/utils/testing/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAW,MAAM,uBAAuB,CAAC;AAE5D,OAAO,GAAkC,MAAM,UAAU,CAAC;AAsB1D,MAAM,OAAO,aAAa;EAUxB,YAAY,KAAiD;IAJtD,kBAAa,GAAG,GAAG,CAAC;IAKzB,KAAK;MACH,OAAO,KAAK,KAAK,QAAQ;QACvB,CAAC,CAAC,EAAE,QAAQ,EAAE,IAAI,KAAK,kBAAkB,KAAK,GAAG,EAAE,GAAG,EAAE,KAAK,EAAE;QAC/D,CAAC,CAAC,KAAK,CAAC;IACZ,IAAI,CAAC,QAAQ,GAAG,KAAK,CAAC,QAAQ,CAAC;IAC/B,IAAI,CAAC,GAAG,GAAG,KAAK,CAAC,GAAG,CAAC;EACvB,CAAC;EAED,IAAY,KAAK;IACf,IAAI,CAAC,IAAI,CAAC,KAAK;MAAE,OAAO,EAAE,CAAC;IAC3B,OAAO,MAAM,CAAC,OAAO,CAAC,IAAI,CAAC,KAAK,CAAC;OAC9B,GAAG,CAAC,CAAC,CAAC,IAAI,EAAE,KAAK,CAAC,EAAE,EAAE,CAAC,GAAG,QAAQ,CAAC,IAAI,CAAC,KAAK,KAAK,GAAG,CAAC;OACtD,IAAI,CAAC,GAAG,CAAC,CAAC;EACf,CAAC;EAED,IAAY,GAAG;IACb,IAAI,CAAC,IAAI,CAAC,OAAO;MAAE,OAAO,EAAE,CAAC;IAC7B,OAAO,MAAM,CAAC,OAAO,CAAC,IAAI,CAAC,OAAO,CAAC;OAChC,GAAG,CAAC,CAAC,CAAC,IAAI,EAAE,KAAK,CAAC,EAAE,EAAE,CAAC,GAAG,IAAI,KAAK,KAAK,EAAE,CAAC;OAC3C,IAAI,CAAC,IAAI,CAAC,CAAC;EAChB,CAAC;EAEM,KAAK,CAAC,OAAO,CAAC,KAAkB,EAAE,OAAgC;IACvE,IAAI,CAAC,IAAI,CAAC,QAAQ,IAAI,CAAC,IAAI,CAAC,GAAG,EAAE;MAC/B,OAAO,CAAC,IAAI,CAAC,iBAAiB,CAAC,CAAC;MAChC,OAAO;KACR;IAED,IAAI,CAAC,KAAK,GAAG,KAAK,CAAC;IACnB,IAAI,CAAC,IAAI,GAAG,MAAM,UAAU,CAAC;MAC3B,IAAI,EAAE;;;YAGA,IAAI,CAAC,GAAG;;;QAGZ,IAAI,CAAC,QAAQ,CAAC,OAAO,CAAC,oBAAoB,EAAE,IAAI,CAAC,KAAK,CAAC;KAC1D;MACC,aAAa,EAAE,IAAI,CAAC,aAAa;MACjC,cAAc,EAAE,IAAI,CAAC,cAAc;MACnC,GAAG,EAAE,OAAO,CAAC,CAAC,CAAC,OAAO,CAAC,GAAG,CAAC,CAAC,CAAC,KAAK;KACnC,CAAC,CAAC;IAEH,OAAO,IAAI,CAAC,IAAI,CAAC;EACnB,CAAC;EAEM,UAAU;IACf,IAAI,CAAC,IAAI,CAAC,IAAI,EAAE;MACd,OAAO,CAAC,IAAI,CAAC,kBAAkB,CAAC,CAAC;MACjC,OAAO;KACR;IACD,OAAO,IAAI,CAAC,IAAI,CAAC,UAAU,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;EACxC,CAAC;EAEM,SAAS;IACd,IAAI,CAAC,IAAI,CAAC,IAAI,EAAE;MACd,OAAO,CAAC,IAAI,CAAC,kBAAkB,CAAC,CAAC;MACjC,OAAO;KACR;IACD,OAAO,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;EAClC,CAAC;EAEM,KAAK,CAAC,cAAc,CAAC,WAAmB,EAAE,MAAM,GAAG,IAAI;IAC5D,IAAI,CAAC,IAAI,CAAC,IAAI,EAAE;MACd,OAAO,CAAC,IAAI,CAAC,kBAAkB,CAAC,CAAC;MACjC,OAAO;KACR;IACD,IAAI,CAAC,WAAW,EAAE;MAChB,OAAO,CAAC,IAAI,CAAC,qBAAqB,CAAC,CAAC;MACpC,OAAO;KACR;IAED,IAAI,MAAM,EAAE;MACV,OAAO,CACL,MAAM,IAAI,CAAC,IAAI,CAAC,eAAe,CAC7B,CAAC,IAAI,EAAE,EAAE;QACP,MAAM,CAAC,GAAG,EAAE,WAAW,CAAC,GAAG,IAAI,CAAC;QAChC,OAAO,QAAQ;WACZ,aAAa,CAAC,GAAG,CAAC;WAClB,UAAU,CAAC,aAAa,CAAC,WAAW,CAAC,CAAC;MAC3C,CAAC,EACD,EAAE,EACF,CAAC,IAAI,CAAC,GAAG,EAAE,WAAW,CAAC,CACxB,CACF,CAAC,SAAS,EAAE,CAAC;KACf;SAAM;MACL,OAAO,CACL,MAAM,IAAI,CAAC,IAAI,CAAC,eAAe,CAC7B,CAAC,IAAI,EAAE,EAAE;QACP,MAAM,CAAC,GAAG,EAAE,WAAW,CAAC,GAAG,IAAI,CAAC;QAChC,OAAO,QAAQ,CAAC,aAAa,CAAC,GAAG,GAAG,GAAG,GAAG,WAAW,CAAC,CAAC;MACzD,CAAC,EACD,EAAE,EACF,CAAC,IAAI,CAAC,GAAG,EAAE,WAAW,CAAC,CACxB,CACF,CAAC,SAAS,EAAE,CAAC;KACf;EACH,CAAC;CACF;AAED,MAAM,CAAC,KAAK,UAAU,iBAAiB,CACrC,IAAa,EACb,oBAA4B,IAAI;EAEhC,IAAI,CAAC,iBAAiB;IACpB,OAAO,IAAI,CAAC,cAAc,CAAC,GAAG,EAAE,CAAC,QAAQ,CAAC,aAAa,CAAC,CAAC;OACtD;IACH,OAAO,IAAI,CAAC,cAAc,CACxB,CAAC,iBAAiB,EAAE,EAAE,CACpB,QAAQ,CAAC,aAAa,CAAC,iBAAiB,CAAC,CAAC,UAAU,CAAC,aAAa,EACpE,iBAAiB,CAClB,CAAC;GACH;AACH,CAAC;AAED,MAAM,CAAC,KAAK,UAAU,UAAU,CAAC,aAA2C;EAC1E,MAAM,OAAO,GACX,OAAO,aAAa,KAAK,QAAQ;IAC/B,CAAC,CAAC,EAAE,IAAI,EAAE,aAAa,EAAE,aAAa,EAAE,GAAG,EAAE,GAAG,EAAE,KAAK,EAAE;IACzD,CAAC,CAAC,aAAa,CAAC;EAEpB,MAAM,IAAI,GAAG,CAAC,MAAM,UAAU,EAAE,CAAgB,CAAC;EAEjD,oDAAoD;EACpD,MAAM,IAAI,CAAC,QAAQ,CAAC,GAAG,EAAE;IACvB,MAAM,CAAC,cAAc,CAAC,SAAS,EAAE,UAAU,EAAE;MAC3C,GAAG,EAAE;QACH,OAAO,OAAO,CAAC;MACjB,CAAC;KACF,CAAC,CAAC;IACH,MAAM,CAAC,cAAc,CAAC,SAAS,EAAE,WAAW,EAAE;MAC5C,GAAG,EAAE;QACH,OAAO,CAAC,OAAO,CAAC,CAAC;MACnB,CAAC;KACF,CAAC,CAAC;EACL,CAAC,CAAC,CAAC;EACH,MAAM,QAAQ,GAAG,MAAM,CAAC,MAAM,CAC5B,EAAE,MAAM,EAAE,OAAO,CAAC,cAAc,IAAI,IAAI,CAAC,QAAQ,EAAE,CAAC,MAAM,EAAE,EAC5D,EAAE,KAAK,EAAE,OAAO,CAAC,aAAa,EAAE,CACjC,CAAC;EACF,oBAAoB;EACpB,MAAM,IAAI,CAAC,WAAW,CAAC,QAAQ,CAAC,CAAC;EAEjC,cAAc;EACd,MAAM,IAAI,CAAC,UAAU,CACnB;qDACiD,OAAO,CAAC,IAAI,QAAQ,EACrE,EAAE,SAAS,EAAE,cAAc,EAAE,CAC9B,CAAC;EAEF,2EAA2E;EAC3E,MAAM,IAAI,CAAC,QAAQ,CAAC,CAAC,GAAG,EAAE,EAAE;IAC1B,QAAQ,CAAC,eAAe,CAAC,YAAY,CAAC,KAAK,EAAE,GAAG,CAAC,CAAC;IAClD,QAAQ,CAAC,GAAG,GAAG,GAAG,CAAC;EACrB,CAAC,EAAE,OAAO,CAAC,GAAG,CAAC,CAAC;EAEhB,8DAA8D;EAC9D,MAAM,UAAU,GAAG,IAAI,CAAC,UAAU,CAAC;EACnC,IAAI,CAAC,UAAU,GAAG,KAAK;IACrB,4DAA4D;IAC5D,wDAAwD;IACxD,MAAM,WAAW,GAAG,MAAM,IAAI,CAAC,CAAC,CAAC,aAAa,CAAC,CAAC;IAChD,IAAI,EAAE,KAAK,EAAE,MAAM,EAAE,GAAG,MAAM,WAAW,CAAC,WAAW,EAAE,CAAC;IAExD,MAAM,IAAI,CAAC,WAAW,CAAC;MACrB,KAAK,EAAE,IAAI,CAAC,QAAQ,EAAE,CAAC,KAAK;MAC5B,MAAM,EAAE,OAAO,CAAC,cAAc,IAAI,IAAI,CAAC,KAAK,CAAC,MAAM,CAAC;KACrD,CAAC,CAAC;IAEH,OAAO,UAAU,CAAC,IAAI,CAAC,IAAI,EAAE;MAC3B,IAAI,EAAE;QACJ,CAAC,EAAE,CAAC;QACJ,CAAC,EAAE,CAAC;QACJ,KAAK,EAAE,IAAI,CAAC,KAAK,CAAC,KAAK,CAAC;QACxB,MAAM,EAAE,OAAO,CAAC,cAAc,IAAI,IAAI,CAAC,KAAK,CAAC,MAAM,CAAC;OACrD;MACD,qBAAqB,EAAE,KAAK;KAC7B,CAAC,CAAC;EACL,CAAC,CAAC;EAEF,MAAM,IAAI,CAAC,QAAQ,CAAC,KAAK,EAAE,MAAM,EAAE,EAAE,CAAC,MAAM,MAAM,CAAC,IAAI,CAAC,MAAM,CAAC,EAAE,GAAG,CAAC,MAAM,CAAC,CAAC;EAE7E,IAAI,CAAC,UAAU,GAAG,KAAK,EAAE,YAAqB,EAAE,EAAE;IAChD,MAAM,MAAM,GAAG,MAAM,IAAI,CAAC,QAAQ,CAAC,KAAK,EAAE,YAAY,EAAE,EAAE;MACxD,MAAM,OAAO,GAAkB;QAC7B,OAAO,EAAE,YAAY,CAAC,CAAC,CAAC,CAAC,CAAC,YAAY,CAAC,CAAC,CAAC,CAAC,CAAC,SAAS;QACpD,OAAO,EAAE,CAAC,CAAC,YAAY,GAAG,mBAAmB,CAAC,CAAC;OAChD,CAAC;MACF,MAAM,IAAI,GAAe,EAAE,CAAC;MAC5B,OAAO,MAAM,MAAM,CAAC,GAAG,CAAC,GAAG,CAAC,OAAO,EAAE,IAAI,CAAC,CAAC;IAC7C,CAAC,EAAE,YAAY,CAAC,CAAC;IAEjB,kGAAkG;IAClG,MAAM,UAAU,GAAG,MAAM,CAAC,UAAU;OACjC,MAAM,CAAC,CAAC,SAAS,EAAE,EAAE,CAAC,CAAC,SAAS,EAAE,UAAU,CAAC,CAAC,QAAQ,CAAC,SAAS,CAAC,MAAM,CAAC,CAAC;OACzE,MAAM,CAAC,CAAC,SAAS,EAAE,EAAE;MACpB,SAAS,CAAC,KAAK,GAAG,SAAS,CAAC,KAAK,CAAC,MAAM,CACtC,CAAC,IAAI,EAAE,EAAE,CAAC,CAAC,IAAI,CAAC,MAAM,CAAC,IAAI,EAAE,CAAC,KAAK,CAAC,WAAW,CAAC,CACjD,CAAC;MACF,OAAO,CAAC,CAAC,SAAS,CAAC,KAAK,CAAC,MAAM,CAAC;IAClC,CAAC,CAAC,CAAC;IAEL,MAAM,MAAM,GAAG,UAAU;OACtB,GAAG,CACF,CAAC,UAAU,EAAE,KAAK,EAAE,EAAE,CAAC,IAAI,KAAK,YAAY,UAAU,CAAC,EAAE,MACvD,UAAU,CAAC,WACb,KAAK,UAAU,CAAC,IAAI;sBACN,UAAU,CAAC,KAAK;OACzB,GAAG,CAAC,CAAC,IAAI,EAAE,KAAK,EAAE,EAAE,CAAC,IAAI,KAAK,KAAK,IAAI,CAAC,MAAM,GAAG,CAAC;OAClD,IAAI,CAAC,IAAI,CAAC,GAAG,CACnB;OACA,IAAI,CAAC,MAAM,CAAC,CAAC;IAChB,OAAO,MAAM,CAAC;EAChB,CAAC,CAAC;EAEF,OAAO,IAAI,CAAC;AACd,CAAC;AAED,MAAM,CAAC,MAAM,QAAQ,GAAG,CAAC,GAAG,EAAE,EAAE;EAC9B,OAAO,GAAG;KACP,KAAK,CAAC,EAAE,CAAC;KACT,GAAG,CAAC,CAAC,MAAM,EAAE,GAAG,EAAE,EAAE;IACnB,OAAO,MAAM,CAAC,WAAW,EAAE,KAAK,MAAM;MACpC,CAAC,CAAC,GAAG,GAAG,KAAK,CAAC,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,GAAG,MAAM,CAAC,WAAW,EAAE,EAAE;MAClD,CAAC,CAAC,MAAM,CAAC;EACb,CAAC,CAAC;KACD,IAAI,CAAC,EAAE,CAAC,CAAC;AACd,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,kBAAkB,GAAG,CAChC,OAAe,EACY,EAAE;EAC7B,OAAO;IACL,gBAAgB,EAAE,KAAK;IACvB,oBAAoB,EAAE,SAAS;IAC/B,kBAAkB,EAAE,GAAG,OAAO,oBAAoB,OAAO,CAAC,QAAQ,EAAE;GACrE,CAAC;AACJ,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,qBAAqB,GAAG,CAAC,QAAQ,EAAE,EAAE;EAChD,OAAO;;;;;;;;;;;;;;;;;;;;;;;;;;+CA0BsC,QAAQ;;CAEtD,CAAC;AACF,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,oBAAoB,GAAG;;;;;;;;;;;;;;;;;;;;;;UAsB1B,CAAC","sourcesContent":["import { newE2EPage, E2EPage } from '@stencil/core/testing';\nimport { Page as PuppeteerPage } from 'puppeteer';\nimport axe, { RunOptions, ContextObject } from 'axe-core';\nimport { MatchImageSnapshotOptions } from 'jest-image-snapshot';\n\ndeclare global {\n interface Window {\n axe: typeof axe;\n }\n}\n\nexport interface NanoE2EPage\n extends E2EPage,\n Pick<PuppeteerPage, 'screenshot' \| 'viewport'> {\n reportA11y: (contextQuery?: string) => Promise<string>;\n}\n\ntype NanoE2EPageOptions = {\n html: string;\n viewportWidth: number;\n viewportHeight?: number;\n dir: 'ltr' \| 'rtl';\n};\n\nexport class E2EPlayGround<T> {\n public props: Partial<T>;\n public viewportHeight: number;\n /** element template string. Add `{{ attrs }}` to place the attributes */\n public template: string;\n public cssVars: { [key: string]: string };\n public viewportWidth = 600;\n public page: NanoE2EPage;\n public tag: string;\n\n constructor(setup: { template: string; tag: string } \| string) {\n setup =\n typeof setup === 'string'\n ? { template: `<${setup} {{ attrs }}></${setup}>`, tag: setup }\n : setup;\n this.template = setup.template;\n this.tag = setup.tag;\n }\n\n private get attrs() {\n if (!this.props) return '';\n return Object.entries(this.props)\n .map(([attr, value]) => `${kebabize(attr)}=\"${value}\"`)\n .join(' ');\n }\n\n private get css() {\n if (!this.cssVars) return '';\n return Object.entries(this.cssVars)\n .map(([attr, value]) => `${attr}: ${value}`)\n .join('\\n');\n }\n\n public async newPage(props?: Partial<T>, docOpts?: { dir: 'rtl' \| 'ltr' }) {\n if (!this.template \|\| !this.tag) {\n console.warn('no template set');\n return;\n }\n\n this.props = props;\n this.page = await createPage({\n html: `\n <style>\n :root {\n ${this.css}\n }\n </style>\n ${this.template.replace(/(\\{\\{ attrs \\}\\})/g, this.attrs)}\n `,\n viewportWidth: this.viewportWidth,\n viewportHeight: this.viewportHeight,\n dir: docOpts ? docOpts.dir : 'ltr',\n });\n\n return this.page;\n }\n\n public reportA11y() {\n if (!this.page) {\n console.warn('no page rendered');\n return;\n }\n return this.page.reportA11y(this.tag);\n }\n\n public component() {\n if (!this.page) {\n console.warn('no page rendered');\n return;\n }\n return this.page.find(this.tag);\n }\n\n public async componentQuery(selectorStr: string, shadow = true) {\n if (!this.page) {\n console.warn('no page rendered');\n return;\n }\n if (!selectorStr) {\n console.warn('selectorStr not set');\n return;\n }\n\n if (shadow) {\n return (\n await this.page.waitForFunction(\n (args) => {\n const [tag, selectorStr] = args;\n return document\n .querySelector(tag)\n .shadowRoot.querySelector(selectorStr);\n },\n {},\n [this.tag, selectorStr]\n )\n ).asElement();\n } else {\n return (\n await this.page.waitForFunction(\n (args) => {\n const [tag, selectorStr] = args;\n return document.querySelector(tag + ' ' + selectorStr);\n },\n {},\n [this.tag, selectorStr]\n )\n ).asElement();\n }\n }\n}\n\nexport async function getFocusedElement(\n page: E2EPage,\n shadowEleSelector: string = null\n) {\n if (!shadowEleSelector)\n return page.evaluateHandle(() => document.activeElement);\n else {\n return page.evaluateHandle(\n (shadowEleSelector) =>\n document.querySelector(shadowEleSelector).shadowRoot.activeElement,\n shadowEleSelector\n );\n }\n}\n\nexport async function createPage(optionsOrHtml?: string \| NanoE2EPageOptions) {\n const options: NanoE2EPageOptions =\n typeof optionsOrHtml === 'string'\n ? { html: optionsOrHtml, viewportWidth: 600, dir: 'ltr' }\n : optionsOrHtml;\n\n const page = (await newE2EPage()) as NanoE2EPage;\n\n // setup navigator langs for consistent localization\n await page.evaluate(() => {\n Object.defineProperty(navigator, 'language', {\n get: function () {\n return 'en-GB';\n },\n });\n Object.defineProperty(navigator, 'languages', {\n get: function () {\n return ['en-GB'];\n },\n });\n });\n const viewport = Object.assign(\n { height: options.viewportHeight \|\| page.viewport().height },\n { width: options.viewportWidth }\n );\n // set viewport size\n await page.setViewport(viewport);\n\n // add content\n await page.setContent(\n `<link rel=\"stylesheet\" href=\"/themes/nanopore.css\">\n <div class=\"screenshot\" style=\"padding: 1rem;\">${options.html}</div>`,\n { waitUntil: 'networkidle2' }\n );\n\n // set the direction - need to set here as stencil removes it on setContent\n await page.evaluate((dir) => {\n document.documentElement.setAttribute('dir', dir);\n document.dir = dir;\n }, options.dir);\n\n // monkey patch screenshot function to add some extra features\n const screenshot = page.screenshot;\n page.screenshot = async function () {\n // get the element's height, and set viewport to that height\n // this enables us to get full page, clipped screenshots\n const htmlElement = await page.$('.screenshot');\n let { width, height } = await htmlElement.boundingBox();\n\n await page.setViewport({\n width: page.viewport().width,\n height: options.viewportHeight \|\| Math.round(height),\n });\n\n return screenshot.call(page, {\n clip: {\n x: 0,\n y: 0,\n width: Math.round(width),\n height: options.viewportHeight \|\| Math.round(height),\n },\n captureBeyondViewport: false,\n });\n };\n\n await page.evaluate(async (source) => await window.eval(source), axe.source);\n\n page.reportA11y = async (contextQuery?: string) => {\n const result = await page.evaluate(async (contextQuery) => {\n const context: ContextObject = {\n include: contextQuery ? [[contextQuery]] : undefined,\n exclude: [[contextQuery + ' .button--primary']],\n };\n const opts: RunOptions = {};\n return await window.axe.run(context, opts);\n }, contextQuery);\n\n // we only want serious issues and we want to ignore nanopore buttons. We know though they're bad.\n const violations = result.violations\n .filter((violation) => [`serious`, `critical`].includes(violation.impact))\n .filter((violation) => {\n violation.nodes = violation.nodes.filter(\n (node) => !node.target.join().match('.button--')\n );\n return !!violation.nodes.length;\n });\n\n const outout = violations\n .map(\n (violations, index) => `(${index}) [Type: ${violations.id}]: ${\n violations.description\n } (${violations.help}).\n Elements: ${violations.nodes\n .map((node, index) => `[${index}]'${node.target}'`)\n .join(`, `)}.`\n )\n .join(`\\n\\n`);\n return outout;\n };\n\n return page;\n}\n\nexport const kebabize = (str) => {\n return str\n .split('')\n .map((letter, idx) => {\n return letter.toUpperCase() === letter\n ? `${idx !== 0 ? '-' : ''}${letter.toLowerCase()}`\n : letter;\n })\n .join('');\n};\n\nexport const screenshotSettings = (\n dirname: string\n): MatchImageSnapshotOptions => {\n return {\n failureThreshold: 0.002,\n failureThresholdType: 'percent',\n customSnapshotsDir: `${dirname}/__screenshots__/${process.platform}`,\n };\n};\n\nexport const waitForVisibleSnippet = (selector) => {\n return `\n (function () {\n function isVisible(elem) {\n if (!(elem instanceof Element)) throw Error('DomUtil: elem is not an element.');\n const style = getComputedStyle(elem);\n if (style.display === 'none') return false;\n if (style.visibility !== 'visible') return false;\n if (style.opacity < 0.1) return false;\n if (elem.offsetWidth + elem.offsetHeight + elem.getBoundingClientRect().height +\n elem.getBoundingClientRect().width === 0) {\n return false;\n }\n const elemCenter = {\n x: elem.getBoundingClientRect().left + elem.offsetWidth / 2,\n y: elem.getBoundingClientRect().top + elem.offsetHeight / 2\n };\n if (elemCenter.x < 0) return false;\n if (elemCenter.x > (document.documentElement.clientWidth \|\| window.innerWidth)) return false;\n if (elemCenter.y < 0) return false;\n if (elemCenter.y > (document.documentElement.clientHeight \|\| window.innerHeight)) return false;\n let pointContainer = document.elementFromPoint(elemCenter.x, elemCenter.y);\n do {\n if (pointContainer === elem) return true;\n } while (pointContainer = pointContainer.parentNode);\n return false;\n }\n return isVisible(document.querySelector(\"${selector}\"));\n })()\n`;\n};\n\nexport const stringifyFormSnippet = `\n<div id=\"form-result\"></div>\n<script>\n var form = document.querySelector('form');\n var result = document.querySelector('#form-result');\n form.addEventListener('submit', (e) => {\n e.preventDefault();\n var data = new FormData(event.target);\n var object = {};\n data.forEach((value, key) => {\n // Reflect.has in favor of: object.hasOwnProperty(key)\n if(!Reflect.has(object, key)){\n object[key] = value;\n return;\n }\n if(!Array.isArray(object[key])){\n object[key] = [object[key]];\n }\n object[key].push(value);\n });\n result.innerHTML = JSON.stringify(object);\n })\n</script>`;\n"]}
1	+ {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/utils/testing/index.ts"],"names":[],"mappings":"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","sourcesContent":["import { newE2EPage, E2EPage } from '@stencil/core/testing';\nimport { Page as PuppeteerPage } from 'puppeteer';\nimport axe, { RunOptions, ContextObject } from 'axe-core';\nimport { MatchImageSnapshotOptions } from 'jest-image-snapshot';\n\ndeclare global {\n interface Window {\n axe: typeof axe;\n }\n}\n\nexport interface NanoE2EPage\n extends E2EPage,\n Pick<PuppeteerPage, 'screenshot' \| 'viewport'> {\n reportA11y: (contextQuery?: string) => Promise<string>;\n}\n\ntype NanoE2EPageOptions = {\n html: string;\n viewportWidth: number;\n viewportHeight?: number;\n dir: 'ltr' \| 'rtl';\n padding?: string;\n};\n\nexport class E2EPlayGround<T> {\n public props: Partial<T>;\n public viewportHeight: number;\n /** element template string. Add `{{ attrs }}` to place the attributes */\n public template: string;\n public cssVars: { [key: string]: string };\n public viewportWidth = 600;\n public page: NanoE2EPage;\n public tag: string;\n\n constructor(setup: { template: string; tag: string } \| string) {\n setup =\n typeof setup === 'string'\n ? { template: `<${setup} {{ attrs }}></${setup}>`, tag: setup }\n : setup;\n this.template = setup.template;\n this.tag = setup.tag;\n }\n\n private get attrs() {\n if (!this.props) return '';\n return Object.entries(this.props)\n .map(([attr, value]) => `${kebabize(attr)}=\"${value}\"`)\n .join(' ');\n }\n\n private get css() {\n if (!this.cssVars) return '';\n return Object.entries(this.cssVars)\n .map(([attr, value]) => `${attr}: ${value}`)\n .join('\\n');\n }\n\n public async newPage(\n props?: Partial<T>,\n docOpts?: { dir?: 'rtl' \| 'ltr'; padding?: string }\n ) {\n if (!this.template \|\| !this.tag) {\n console.warn('no template set');\n return;\n }\n\n this.props = props;\n this.page = await createPage({\n html: `\n <style>\n :root {\n ${this.css}\n }\n </style>\n ${this.template.replace(/(\\{\\{ attrs \\}\\})/g, this.attrs)}\n `,\n viewportWidth: this.viewportWidth,\n viewportHeight: this.viewportHeight,\n dir: docOpts ? docOpts.dir : 'ltr',\n padding: docOpts ? docOpts.padding : '1rem',\n });\n\n return this.page;\n }\n\n public reportA11y() {\n if (!this.page) {\n console.warn('no page rendered');\n return;\n }\n return this.page.reportA11y(this.tag);\n }\n\n public component() {\n if (!this.page) {\n console.warn('no page rendered');\n return;\n }\n return this.page.find(this.tag);\n }\n\n public async componentQuery(selectorStr: string, shadow = true) {\n if (!this.page) {\n console.warn('no page rendered');\n return;\n }\n if (!selectorStr) {\n console.warn('selectorStr not set');\n return;\n }\n\n if (shadow) {\n return (\n await this.page.waitForFunction(\n (args) => {\n const [tag, selectorStr] = args;\n return document\n .querySelector(tag)\n .shadowRoot.querySelector(selectorStr);\n },\n {},\n [this.tag, selectorStr]\n )\n ).asElement();\n } else {\n return (\n await this.page.waitForFunction(\n (args) => {\n const [tag, selectorStr] = args;\n return document.querySelector(tag + ' ' + selectorStr);\n },\n {},\n [this.tag, selectorStr]\n )\n ).asElement();\n }\n }\n}\n\nexport async function getFocusedElement(\n page: E2EPage,\n shadowEleSelector: string = null\n) {\n if (!shadowEleSelector)\n return page.evaluateHandle(() => document.activeElement);\n else {\n return page.evaluateHandle(\n (shadowEleSelector) =>\n document.querySelector(shadowEleSelector).shadowRoot.activeElement,\n shadowEleSelector\n );\n }\n}\n\nexport async function createPage(optionsOrHtml?: string \| NanoE2EPageOptions) {\n const options: NanoE2EPageOptions =\n typeof optionsOrHtml === 'string'\n ? { html: optionsOrHtml, viewportWidth: 600, dir: 'ltr', padding: '1rem' }\n : optionsOrHtml;\n\n const page = (await newE2EPage()) as NanoE2EPage;\n\n // setup navigator langs for consistent localization\n await page.evaluate(() => {\n Object.defineProperty(navigator, 'language', {\n get: function () {\n return 'en-GB';\n },\n });\n Object.defineProperty(navigator, 'languages', {\n get: function () {\n return ['en-GB'];\n },\n });\n });\n const viewport = Object.assign(\n { height: options.viewportHeight \|\| page.viewport().height },\n { width: options.viewportWidth }\n );\n // set viewport size\n await page.setViewport(viewport);\n\n // add content\n await page.setContent(\n `<link rel=\"stylesheet\" href=\"/themes/nanopore.css\">\n <div class=\"screenshot\" style=\"padding: ${options.padding \|\| '1rem'};\">${\n options.html\n }</div>`,\n { waitUntil: 'networkidle2' }\n );\n\n // set the direction - need to set here as stencil removes it on setContent\n await page.evaluate((dir) => {\n document.documentElement.setAttribute('dir', dir);\n document.dir = dir;\n }, options.dir);\n\n // monkey patch screenshot function to add some extra features\n const screenshot = page.screenshot;\n page.screenshot = async function () {\n // get the element's height, and set viewport to that height\n // this enables us to get full page, clipped screenshots\n const htmlElement = await page.$('.screenshot');\n let { width, height } = await htmlElement.boundingBox();\n\n await page.setViewport({\n width: page.viewport().width,\n height: options.viewportHeight \|\| Math.round(height),\n });\n\n return screenshot.call(page, {\n clip: {\n x: 0,\n y: 0,\n width: Math.round(width),\n height: options.viewportHeight \|\| Math.round(height),\n },\n captureBeyondViewport: false,\n });\n };\n\n await page.evaluate(async (source) => await window.eval(source), axe.source);\n\n page.reportA11y = async (contextQuery?: string) => {\n const result = await page.evaluate(async (contextQuery) => {\n const context: ContextObject = {\n include: contextQuery ? [[contextQuery]] : undefined,\n exclude: [[contextQuery + ' .button--primary']],\n };\n const opts: RunOptions = {};\n return await window.axe.run(context, opts);\n }, contextQuery);\n\n // we only want serious issues and we want to ignore nanopore buttons. We know though they're bad.\n const violations = result.violations\n .filter((violation) => [`serious`, `critical`].includes(violation.impact))\n .filter((violation) => {\n violation.nodes = violation.nodes.filter(\n (node) => !node.target.join().match('.button--')\n );\n return !!violation.nodes.length;\n });\n\n const outout = violations\n .map(\n (violations, index) => `(${index}) [Type: ${violations.id}]: ${\n violations.description\n } (${violations.help}).\n Elements: ${violations.nodes\n .map((node, index) => `[${index}]'${node.target}'`)\n .join(`, `)}.`\n )\n .join(`\\n\\n`);\n return outout;\n };\n\n return page;\n}\n\nexport const kebabize = (str) => {\n return str\n .split('')\n .map((letter, idx) => {\n return letter.toUpperCase() === letter\n ? `${idx !== 0 ? '-' : ''}${letter.toLowerCase()}`\n : letter;\n })\n .join('');\n};\n\nexport const screenshotSettings = (\n dirname: string\n): MatchImageSnapshotOptions => {\n return {\n failureThreshold: 0.002,\n failureThresholdType: 'percent',\n customSnapshotsDir: `${dirname}/__screenshots__/${process.platform}`,\n };\n};\n\nexport const waitForVisibleSnippet = (selector) => {\n return `\n (function () {\n function isVisible(elem) {\n if (!(elem instanceof Element)) throw Error('DomUtil: elem is not an element.');\n const style = getComputedStyle(elem);\n if (style.display === 'none') return false;\n if (style.visibility !== 'visible') return false;\n if (style.opacity < 0.1) return false;\n if (elem.offsetWidth + elem.offsetHeight + elem.getBoundingClientRect().height +\n elem.getBoundingClientRect().width === 0) {\n return false;\n }\n const elemCenter = {\n x: elem.getBoundingClientRect().left + elem.offsetWidth / 2,\n y: elem.getBoundingClientRect().top + elem.offsetHeight / 2\n };\n if (elemCenter.x < 0) return false;\n if (elemCenter.x > (document.documentElement.clientWidth \|\| window.innerWidth)) return false;\n if (elemCenter.y < 0) return false;\n if (elemCenter.y > (document.documentElement.clientHeight \|\| window.innerHeight)) return false;\n let pointContainer = document.elementFromPoint(elemCenter.x, elemCenter.y);\n do {\n if (pointContainer === elem) return true;\n } while (pointContainer = pointContainer.parentNode);\n return false;\n }\n return isVisible(document.querySelector(\"${selector}\"));\n })()\n`;\n};\n\nexport const stringifyFormSnippet = `\n<div id=\"form-result\"></div>\n<script>\n var form = document.querySelector('form');\n var result = document.querySelector('#form-result');\n form.addEventListener('submit', (e) => {\n e.preventDefault();\n var data = new FormData(event.target);\n var object = {};\n data.forEach((value, key) => {\n // Reflect.has in favor of: object.hasOwnProperty(key)\n if(!Reflect.has(object, key)){\n object[key] = value;\n return;\n }\n if(!Array.isArray(object[key])){\n object[key] = [object[key]];\n }\n object[key].push(value);\n });\n result.innerHTML = JSON.stringify(object);\n })\n</script>`;\n"]}