npm - @nanoporetech-digital/components - Versions diffs - 5.9.3 → 5.9.5 - Mend

@nanoporetech-digital/components 5.9.3 → 5.9.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 (161) hide show

package/dist/cjs/nano-table.cjs.entry.js CHANGED Viewed

@@ -5,7 +5,7 @@
 Object.defineProperty(exports, '__esModule', { value: true });
-const nanoTable_entry = require('./nano-table-2151a433.js');
+const nanoTable_entry = require('./nano-table-be63f3e1.js');
 require('./index-1d3ebe1a.js');
 require('./math-a8123703.js');
 require('./throttle-dfa64b9e.js');

package/dist/cjs/{scroll-6a9bedb4.js → scroll-fc1b8387.js} RENAMED Viewed

@@ -3,7 +3,7 @@
  */
 'use strict';
-const dom = require('./dom-7acf7afd.js');
+const dom = require('./dom-1d35ea4d.js');
 const locks = new Set();
 /**
@@ -84,4 +84,4 @@ exports.lockBodyScrolling = lockBodyScrolling;
 exports.scrollIntoView = scrollIntoView;
 exports.unlockBodyScrolling = unlockBodyScrolling;
-//# sourceMappingURL=scroll-6a9bedb4.js.map
+//# sourceMappingURL=scroll-fc1b8387.js.map

package/dist/cjs/{scroll-6a9bedb4.js.map → scroll-fc1b8387.js.map} RENAMED Viewed

	@@ -1 +1 @@
1	- {"file":"scroll-~~6a9bedb4~~.js","mappings":"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","names":["getOffset"],"sources":["./src/utils/scroll.ts"],"sourcesContent":["import { getOffset } from './dom';\n\nconst locks = new Set();\n\n/*\n Prevents body scrolling. Keeps track of which elements requested a lock so multiple levels of locking are possible\n * without premature unlocking.\n /\nexport function lockBodyScrolling(lockingEl: HTMLElement) {\n locks.add(lockingEl);\n document.body.classList.add('nano-scroll-lock');\n}\n\n/\n Unlocks body scrolling. Scrolling will only be unlocked once all elements that requested a lock call this method.\n /\nexport function unlockBodyScrolling(lockingEl: HTMLElement) {\n locks.delete(lockingEl);\n\n if (locks.size === 0) {\n document.body.classList.remove('nano-scroll-lock');\n }\n}\n\nfunction scrollTo(\n element: HTMLElement,\n scrollAmt: number,\n vertical: boolean = false\n) {\n if (!vertical) {\n try {\n element.scrollTo({ left: scrollAmt, behavior: 'smooth' });\n } catch (e) {\n element.scrollLeft = scrollAmt;\n }\n return;\n }\n try {\n element.scrollTo({ top: scrollAmt, behavior: 'smooth' });\n } catch (e) {\n element.scrollTop = scrollAmt;\n }\n}\n\n/\n Scrolls an element into view of its container. If the element is already in view, nothing will happen.\n */\nexport function scrollIntoView(\n element: HTMLElement,\n container: HTMLElement,\n direction: 'horizontal' \| 'vertical' \| 'both' = 'vertical',\n position: 'center' \| 'start' = 'start'\n) {\n const offset = getOffset(element, container);\n const offsetTop = offset.top + container.scrollTop;\n const offsetLeft = offset.left + container.scrollLeft;\n const minX = container.scrollLeft;\n const maxX = container.scrollLeft + container.offsetWidth;\n const minY = container.scrollTop;\n const maxY = container.scrollTop + container.offsetHeight;\n\n if (direction === 'horizontal' \|\| direction === 'both') {\n if (position === 'start') {\n if (offsetLeft < minX) scrollTo(container, offsetLeft);\n else if (offsetLeft + element.clientWidth > maxX)\n scrollTo(\n container,\n offsetLeft - container.offsetWidth + element.clientWidth\n );\n } else {\n scrollTo(\n container,\n container.scrollLeft +\n offset.left -\n (container.offsetWidth / 2 + element.offsetWidth / 2)\n );\n }\n }\n\n if (direction === 'vertical' \|\| direction === 'both') {\n if (position === 'start') {\n if (offsetTop < minY) scrollTo(container, offsetTop, true);\n else if (offsetTop + element.clientHeight > maxY) {\n scrollTo(\n container,\n offsetTop - container.offsetHeight + element.clientHeight,\n true\n );\n }\n } else {\n scrollTo(\n container,\n container.scrollTop +\n offset.top -\n (container.offsetHeight / 2 + element.offsetHeight / 2),\n true\n );\n }\n }\n}\n"],"version":3}
1	+ {"file":"scroll-fc1b8387.js","mappings":"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","names":["getOffset"],"sources":["./src/utils/scroll.ts"],"sourcesContent":["import { getOffset } from './dom';\n\nconst locks = new Set();\n\n/*\n Prevents body scrolling. Keeps track of which elements requested a lock so multiple levels of locking are possible\n * without premature unlocking.\n /\nexport function lockBodyScrolling(lockingEl: HTMLElement) {\n locks.add(lockingEl);\n document.body.classList.add('nano-scroll-lock');\n}\n\n/\n Unlocks body scrolling. Scrolling will only be unlocked once all elements that requested a lock call this method.\n /\nexport function unlockBodyScrolling(lockingEl: HTMLElement) {\n locks.delete(lockingEl);\n\n if (locks.size === 0) {\n document.body.classList.remove('nano-scroll-lock');\n }\n}\n\nfunction scrollTo(\n element: HTMLElement,\n scrollAmt: number,\n vertical: boolean = false\n) {\n if (!vertical) {\n try {\n element.scrollTo({ left: scrollAmt, behavior: 'smooth' });\n } catch (e) {\n element.scrollLeft = scrollAmt;\n }\n return;\n }\n try {\n element.scrollTo({ top: scrollAmt, behavior: 'smooth' });\n } catch (e) {\n element.scrollTop = scrollAmt;\n }\n}\n\n/\n Scrolls an element into view of its container. If the element is already in view, nothing will happen.\n */\nexport function scrollIntoView(\n element: HTMLElement,\n container: HTMLElement,\n direction: 'horizontal' \| 'vertical' \| 'both' = 'vertical',\n position: 'center' \| 'start' = 'start'\n) {\n const offset = getOffset(element, container);\n const offsetTop = offset.top + container.scrollTop;\n const offsetLeft = offset.left + container.scrollLeft;\n const minX = container.scrollLeft;\n const maxX = container.scrollLeft + container.offsetWidth;\n const minY = container.scrollTop;\n const maxY = container.scrollTop + container.offsetHeight;\n\n if (direction === 'horizontal' \|\| direction === 'both') {\n if (position === 'start') {\n if (offsetLeft < minX) scrollTo(container, offsetLeft);\n else if (offsetLeft + element.clientWidth > maxX)\n scrollTo(\n container,\n offsetLeft - container.offsetWidth + element.clientWidth\n );\n } else {\n scrollTo(\n container,\n container.scrollLeft +\n offset.left -\n (container.offsetWidth / 2 + element.offsetWidth / 2)\n );\n }\n }\n\n if (direction === 'vertical' \|\| direction === 'both') {\n if (position === 'start') {\n if (offsetTop < minY) scrollTo(container, offsetTop, true);\n else if (offsetTop + element.clientHeight > maxY) {\n scrollTo(\n container,\n offsetTop - container.offsetHeight + element.clientHeight,\n true\n );\n }\n } else {\n scrollTo(\n container,\n container.scrollTop +\n offset.top -\n (container.offsetHeight / 2 + element.offsetHeight / 2),\n true\n );\n }\n }\n}\n"],"version":3}

package/dist/cjs/{table.worker-60493788.js → table.worker-b05ffc52.js} RENAMED Viewed

@@ -3,7 +3,7 @@
  */
 'use strict';
-const nanoTable_entry = require('./nano-table-2151a433.js');
+const nanoTable_entry = require('./nano-table-be63f3e1.js');
 require('./index-1d3ebe1a.js');
 require('./math-a8123703.js');
 require('./throttle-dfa64b9e.js');
@@ -22,4 +22,4 @@ exports.workerMsgId = workerMsgId;
 exports.workerName = workerName;
 exports.workerPath = workerPath;
-//# sourceMappingURL=table.worker-60493788.js.map
+//# sourceMappingURL=table.worker-b05ffc52.js.map

package/dist/cjs/table.worker-b05ffc52.js.map ADDED Viewed

	@@ -0,0 +1 @@
1	+ {"file":"table.worker-b05ffc52.js","mappings":";;;;;;;;;;;;;;;;;;;;;;;;","names":[],"sources":[],"sourcesContent":[],"version":3}

package/dist/cjs/{transitions-e410ef6a.js → transitions-8c57ddb1.js} RENAMED Viewed

@@ -21,14 +21,14 @@ const displayTransition = (el, options) => {
   return new Promise((resolve) => {
     const showCb = (e) => {
       if ((e.target === el || e.composedPath().some((el) => el === e.target)) &&
-        (!opts.transitionProp || opts.transitionProp === e.propertyName)) {
+        (!opts.transitionProp || opts.transitionProp.includes(e.propertyName))) {
         resolve('shown');
         el.removeEventListener('transitionend', showCb);
       }
     };
     const hideCb = (e) => {
       if ((e.target === el || e.composedPath().some((el) => el === e.target)) &&
-        (!opts.transitionProp || opts.transitionProp === e.propertyName)) {
+        (!opts.transitionProp || opts.transitionProp.includes(e.propertyName))) {
         el.style.display = 'none';
         resolve('hidden');
         el.removeEventListener('transitionend', hideCb);
@@ -49,4 +49,4 @@ const displayTransition = (el, options) => {
 exports.displayTransition = displayTransition;
-//# sourceMappingURL=transitions-e410ef6a.js.map
+//# sourceMappingURL=transitions-8c57ddb1.js.map

package/dist/cjs/transitions-8c57ddb1.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"file":"transitions-8c57ddb1.js","mappings":";;;;;AAAA;;;;AAiBA;;;;;;;;;MASa,iBAAiB,GAAG,CAC/B,EAAe,EACf,OAKC;EAED,MAAM,IAAI,mBACR,SAAS,EAAE,EAAE,EACb,IAAI,EAAE,IAAI,EACV,WAAW,EAAE,OAAO,IACjB,OAAO,CACX,CAAC;EAEF,OAAO,IAAI,OAAO,CAAC,CAAC,OAAO;IACzB,MAAM,MAAM,GAAG,CAAC,CAAkB;MAChC,IACE,CAAC,CAAC,CAAC,MAAM,KAAK,EAAE,IAAI,CAAC,CAAC,YAAY,EAAE,CAAC,IAAI,CAAC,CAAC,EAAE,KAAK,EAAE,KAAK,CAAC,CAAC,MAAM,CAAC;SACjE,CAAC,IAAI,CAAC,cAAc,IAAI,IAAI,CAAC,cAAc,CAAC,QAAQ,CAAC,CAAC,CAAC,YAAY,CAAC,CAAC,EACtE;QACA,OAAO,CAAC,OAAO,CAAC,CAAC;QACjB,EAAE,CAAC,mBAAmB,CAAC,eAAe,EAAE,MAAM,CAAC,CAAC;OACjD;KACF,CAAC;IAEF,MAAM,MAAM,GAAG,CAAC,CAAkB;MAChC,IACE,CAAC,CAAC,CAAC,MAAM,KAAK,EAAE,IAAI,CAAC,CAAC,YAAY,EAAE,CAAC,IAAI,CAAC,CAAC,EAAE,KAAK,EAAE,KAAK,CAAC,CAAC,MAAM,CAAC;SACjE,CAAC,IAAI,CAAC,cAAc,IAAI,IAAI,CAAC,cAAc,CAAC,QAAQ,CAAC,CAAC,CAAC,YAAY,CAAC,CAAC,EACtE;QACA,EAAE,CAAC,KAAK,CAAC,OAAO,GAAG,MAAM,CAAC;QAC1B,OAAO,CAAC,QAAQ,CAAC,CAAC;QAClB,EAAE,CAAC,mBAAmB,CAAC,eAAe,EAAE,MAAM,CAAC,CAAC;OACjD;KACF,CAAC;IAEF,IAAI,IAAI,CAAC,IAAI,EAAE;MACb,EAAE,CAAC,gBAAgB,CAAC,eAAe,EAAE,MAAM,CAAC,CAAC;MAC7C,EAAE,CAAC,KAAK,CAAC,OAAO,GAAG,IAAI,CAAC,WAAW,CAAC;MACpC,EAAE,CAAC,OAAO,CAAC,iBAAiB,GAAG,MAAM,CAAC;MACtC,UAAU,CAAC,MAAM,EAAE,CAAC,SAAS,CAAC,GAAG,CAAC,IAAI,CAAC,SAAS,CAAC,EAAE,EAAE,CAAC,CAAC;KACxD;SAAM;MACL,EAAE,CAAC,gBAAgB,CAAC,eAAe,EAAE,MAAM,CAAC,CAAC;MAC7C,EAAE,CAAC,SAAS,CAAC,MAAM,CAAC,IAAI,CAAC,SAAS,CAAC,CAAC;KACrC;GACF,CAAC,CAAC;AACL;;;;","names":[],"sources":["./src/utils/transitions.ts"],"sourcesContent":["/**\n * Quality of life for transition handling.\n * Adds / removes transitionend events. Resolves on complete\n */\nexport const transitionDone = (\n el: HTMLElement\n): Promise<'shown' | 'hidden'> => {\n return new Promise((resolve) => {\n const callback = () => {\n el.removeEventListener('transitionend', callback);\n resolve;\n };\n el.addEventListener('transitionend', callback);\n // ??\n });\n};\n\n/**\n * handles hiding and showing elements properly (with display),\n * along with transitions, so they are no longer viewable in the dom.\n * - OnHide remove show class, listen for transition end, then display: none on finish\n * - OnShow, display block on start then add a show class\n * @param el\n * @param options\n * @returns a promise of resolving as either 'show' or 'hidden'\n */\nexport const displayTransition = (\n el: HTMLElement,\n options?: {\n className?: string;\n show?: boolean;\n showDisplay?: string;\n transitionProp?: string[];\n }\n): Promise<'shown' | 'hidden'> => {\n const opts = {\n className: '',\n show: true,\n showDisplay: 'block',\n ...options,\n };\n\n return new Promise((resolve) => {\n const showCb = (e: TransitionEvent) => {\n if (\n (e.target === el || e.composedPath().some((el) => el === e.target)) &&\n (!opts.transitionProp || opts.transitionProp.includes(e.propertyName))\n ) {\n resolve('shown');\n el.removeEventListener('transitionend', showCb);\n }\n };\n\n const hideCb = (e: TransitionEvent) => {\n if (\n (e.target === el || e.composedPath().some((el) => el === e.target)) &&\n (!opts.transitionProp || opts.transitionProp.includes(e.propertyName))\n ) {\n el.style.display = 'none';\n resolve('hidden');\n el.removeEventListener('transitionend', hideCb);\n }\n };\n\n if (opts.show) {\n el.addEventListener('transitionend', showCb);\n el.style.display = opts.showDisplay;\n el.dataset.displayTransition = 'true';\n setTimeout(() => el.classList.add(opts.className), 20);\n } else {\n el.addEventListener('transitionend', hideCb);\n el.classList.remove(opts.className);\n }\n });\n};\n"],"version":3}

package/dist/collection/components/algolia/algolia-pagination.js CHANGED Viewed

@@ -27,7 +27,7 @@ export class AlgoliaPagination {
   async prevPage() { }
   /** Go to a particular page */
   async goToPage(page) {
-    console.log(page);
+    console.info(page);
   }
   updateContent() {
     this.outputTo = this.outputSlot || this.outputEle;

package/dist/collection/components/algolia/algolia-pagination.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"algolia-pagination.js","sourceRoot":"","sources":["../../../src/components/algolia/algolia-pagination.tsx"],"names":[],"mappings":"AAAA,OAAO,EACL,SAAS,EACT,CAAC,EACD,OAAO,EACP,IAAI,EACJ,IAAI,EACJ,KAAK,EACL,KAAK,EACL,MAAM,EACN,KAAK,GAEN,MAAM,eAAe,CAAC;AACvB,OAAO,EAAE,QAAQ,EAA+B,MAAM,yBAAyB,CAAC;AAGhF;;gBAEgB;AAKhB,MAAM,OAAO,iBAAiB;;uBASG,IAAI;qBACL,KAAK;qBACL,KAAK;gBACV,IAAI;;wBAEQ,IAAI;0BACN,KAAK;qBAGZ,IAAI;;EAQhC,iBAAiB,KAAI,CAAC;EAGtB,oBAAoB;IAClB,IAAI,CAAC,IAAI,GAAG,CAAC,IAAI,CAAC,cAAc,CAAC;EACnC,CAAC;EAED,mCAAmC;EAEnC,KAAK,CAAC,QAAQ,KAAI,CAAC;EAEnB,uCAAuC;EAEvC,KAAK,CAAC,QAAQ,KAAI,CAAC;EAEnB,8BAA8B;EAE9B,KAAK,CAAC,QAAQ,CAAC,IAAY;IACzB,OAAO,CAAC,~~GAAG~~,CAAC,IAAI,CAAC,CAAC;~~EACpB~~,CAAC;EAEO,aAAa;IACnB,IAAI,CAAC,QAAQ,GAAG,IAAI,CAAC,UAAU,IAAI,IAAI,CAAC,SAAS,CAAC;IAClD,IAAI,CAAC,IAAI,CAAC,WAAW,IAAI,CAAC,IAAI,CAAC,QAAQ,IAAI,CAAC,IAAI,CAAC,YAAY,EAAE;MAC7D,IAAI,CAAC,IAAI,GAAG,KAAK,CAAC;MAClB,OAAO;KACR;IAED,iEAAiE;IACjE,iEAAiE;IACjE,8DAA8D;IAC9D,MAAM;EACR,CAAC;EAED,iBAAiB;IACf,IAAI,CAAC,YAAY,GAAG,IAAI,CAAC,EAAE,CAAC,aAAa,CAAC,0BAA0B,CAAC,CAAC;IACtE,IAAI,CAAC,UAAU,GAAG,IAAI,CAAC,EAAE,CAAC,aAAa,CAAC,iBAAiB,CAAC,CAAC;IAE3D,IAAI,CAAC,CAAC,IAAI,CAAC,YAAY;MAAE,IAAI,CAAC,WAAW,GAAG,IAAI,CAAC,YAAY,CAAC,SAAS,CAAC;IACxE,6DAA6D;EAC/D,CAAC;EAED,gBAAgB;IACd,IAAI,CAAC,aAAa,EAAE,CAAC;EACvB,CAAC;EAED,MAAM;IACJ,OAAO,CACL,EAAC,IAAI,IACH,KAAK,EAAE;QACL,iBAAiB,EAAE,IAAI,CAAC,IAAI;OAC7B;MAED,WAAK,GAAG,EAAE,CAAC,GAAG,EAAE,EAAE,CAAC,CAAC,IAAI,CAAC,SAAS,GAAG,GAAG,CAAC;QACvC,YAAM,IAAI,EAAC,QAAQ,GAAG,CAClB,CACD,CACR,CAAC;EACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF;AAED,+EAA+E;AAC/E,QAAQ,CAAC,iBAAgD,EAAE;EACzD,cAAc;EACd,eAAe;EACf,aAAa;CACd,CAAC,CAAC","sourcesContent":["import {\n Component,\n h,\n Element,\n Host,\n Prop,\n Watch,\n State,\n Method,\n Event,\n EventEmitter,\n} from '@stencil/core';\nimport { Wormhole, WormholeConsumerConstructor } from '../algolia/algolia-data';\nimport type { IndexResult } from '../../interface';\n\n/*\n Displays results from Algolia searches.\n * TODO / WIP /\n@Component({\n tag: 'nano-algolia-pagination',\n shadow: true,\n})\nexport class AlgoliaPagination {\n @Element() el: HTMLNanoAlgoliaPaginationElement;\n\n private outputEle: HTMLDivElement;\n private outputSlot: HTMLElement;\n private outputTo: HTMLElement;\n private templateStr: string;\n private templateSlot: HTMLElement;\n\n @State() currentPage: number = null;\n @State() canGoPrev: boolean = false;\n @State() canGoNext: boolean = false;\n @State() show: boolean = true;\n @State() tplRenderFn: (...args: any[]) => string;\n @State() indexResults: IndexResult = null;\n @State() infiniteScroll: boolean = false;\n\n /* Max number of page numbers to show /\n @Prop() maxToShow: number = null;\n\n /\n Emitted when the page number changes\n /\n @Event() nanoPageChanged!: EventEmitter<{ page: number }>;\n\n @Watch('currentPage')\n currentPageChange() {}\n\n @Watch('infiniteScroll')\n infiniteScrollChange() {\n this.show = !this.infiniteScroll;\n }\n\n /* Go to next page from current /\n @Method()\n async nextPage() {}\n\n /* Go to previous page from current /\n @Method()\n async prevPage() {}\n\n /* Go to a particular page */\n @Method()\n async goToPage(page: number) {\n console.~~log~~(page);\n }\n\n private updateContent() {\n this.outputTo = this.outputSlot \|\| this.outputEle;\n if (!this.templateStr \|\| !this.outputTo \|\| !this.indexResults) {\n this.show = false;\n return;\n }\n\n // this.outputTo.innerHTML = this.tplRenderFn(this.templateStr, {\n // orig: { ...this.currentIndex.origFilters[this.filterName] },\n // dyn: { ...this.currentIndex.dynFilters[this.filterName] }\n // });\n }\n\n componentWillLoad() {\n this.templateSlot = this.el.querySelector('[slot=\"filter-template\"]');\n this.outputSlot = this.el.querySelector('[slot=\"output\"]');\n\n if (!!this.templateSlot) this.templateStr = this.templateSlot.innerHTML;\n // this.boundChangeEvent = this.handleChangeEvent.bind(this);\n }\n\n componentDidLoad() {\n this.updateContent();\n }\n\n render() {\n return (\n <Host\n class={{\n 'show-pagination': this.show,\n }}\n >\n <div ref={(div) => (this.outputEle = div)}>\n <slot name=\"output\" />\n </div>\n </Host>\n );\n }\n}\n\n// Use the injectProps method to pass from the tunnel as props to the component\nWormhole(AlgoliaPagination as WormholeConsumerConstructor, [\n 'indexResults',\n 'filterChanged',\n 'tplRenderFn',\n]);\n"]}
1	+ {"version":3,"file":"algolia-pagination.js","sourceRoot":"","sources":["../../../src/components/algolia/algolia-pagination.tsx"],"names":[],"mappings":"AAAA,OAAO,EACL,SAAS,EACT,CAAC,EACD,OAAO,EACP,IAAI,EACJ,IAAI,EACJ,KAAK,EACL,KAAK,EACL,MAAM,EACN,KAAK,GAEN,MAAM,eAAe,CAAC;AACvB,OAAO,EAAE,QAAQ,EAA+B,MAAM,yBAAyB,CAAC;AAGhF;;gBAEgB;AAKhB,MAAM,OAAO,iBAAiB;;uBASG,IAAI;qBACL,KAAK;qBACL,KAAK;gBACV,IAAI;;wBAEQ,IAAI;0BACN,KAAK;qBAGZ,IAAI;;EAQhC,iBAAiB,KAAI,CAAC;EAGtB,oBAAoB;IAClB,IAAI,CAAC,IAAI,GAAG,CAAC,IAAI,CAAC,cAAc,CAAC;EACnC,CAAC;EAED,mCAAmC;EAEnC,KAAK,CAAC,QAAQ,KAAI,CAAC;EAEnB,uCAAuC;EAEvC,KAAK,CAAC,QAAQ,KAAI,CAAC;EAEnB,8BAA8B;EAE9B,KAAK,CAAC,QAAQ,CAAC,IAAY;IACzB,OAAO,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;EACrB,CAAC;EAEO,aAAa;IACnB,IAAI,CAAC,QAAQ,GAAG,IAAI,CAAC,UAAU,IAAI,IAAI,CAAC,SAAS,CAAC;IAClD,IAAI,CAAC,IAAI,CAAC,WAAW,IAAI,CAAC,IAAI,CAAC,QAAQ,IAAI,CAAC,IAAI,CAAC,YAAY,EAAE;MAC7D,IAAI,CAAC,IAAI,GAAG,KAAK,CAAC;MAClB,OAAO;KACR;IAED,iEAAiE;IACjE,iEAAiE;IACjE,8DAA8D;IAC9D,MAAM;EACR,CAAC;EAED,iBAAiB;IACf,IAAI,CAAC,YAAY,GAAG,IAAI,CAAC,EAAE,CAAC,aAAa,CAAC,0BAA0B,CAAC,CAAC;IACtE,IAAI,CAAC,UAAU,GAAG,IAAI,CAAC,EAAE,CAAC,aAAa,CAAC,iBAAiB,CAAC,CAAC;IAE3D,IAAI,CAAC,CAAC,IAAI,CAAC,YAAY;MAAE,IAAI,CAAC,WAAW,GAAG,IAAI,CAAC,YAAY,CAAC,SAAS,CAAC;IACxE,6DAA6D;EAC/D,CAAC;EAED,gBAAgB;IACd,IAAI,CAAC,aAAa,EAAE,CAAC;EACvB,CAAC;EAED,MAAM;IACJ,OAAO,CACL,EAAC,IAAI,IACH,KAAK,EAAE;QACL,iBAAiB,EAAE,IAAI,CAAC,IAAI;OAC7B;MAED,WAAK,GAAG,EAAE,CAAC,GAAG,EAAE,EAAE,CAAC,CAAC,IAAI,CAAC,SAAS,GAAG,GAAG,CAAC;QACvC,YAAM,IAAI,EAAC,QAAQ,GAAG,CAClB,CACD,CACR,CAAC;EACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF;AAED,+EAA+E;AAC/E,QAAQ,CAAC,iBAAgD,EAAE;EACzD,cAAc;EACd,eAAe;EACf,aAAa;CACd,CAAC,CAAC","sourcesContent":["import {\n Component,\n h,\n Element,\n Host,\n Prop,\n Watch,\n State,\n Method,\n Event,\n EventEmitter,\n} from '@stencil/core';\nimport { Wormhole, WormholeConsumerConstructor } from '../algolia/algolia-data';\nimport type { IndexResult } from '../../interface';\n\n/*\n Displays results from Algolia searches.\n * TODO / WIP /\n@Component({\n tag: 'nano-algolia-pagination',\n shadow: true,\n})\nexport class AlgoliaPagination {\n @Element() el: HTMLNanoAlgoliaPaginationElement;\n\n private outputEle: HTMLDivElement;\n private outputSlot: HTMLElement;\n private outputTo: HTMLElement;\n private templateStr: string;\n private templateSlot: HTMLElement;\n\n @State() currentPage: number = null;\n @State() canGoPrev: boolean = false;\n @State() canGoNext: boolean = false;\n @State() show: boolean = true;\n @State() tplRenderFn: (...args: any[]) => string;\n @State() indexResults: IndexResult = null;\n @State() infiniteScroll: boolean = false;\n\n /* Max number of page numbers to show /\n @Prop() maxToShow: number = null;\n\n /\n Emitted when the page number changes\n /\n @Event() nanoPageChanged!: EventEmitter<{ page: number }>;\n\n @Watch('currentPage')\n currentPageChange() {}\n\n @Watch('infiniteScroll')\n infiniteScrollChange() {\n this.show = !this.infiniteScroll;\n }\n\n /* Go to next page from current /\n @Method()\n async nextPage() {}\n\n /* Go to previous page from current /\n @Method()\n async prevPage() {}\n\n /* Go to a particular page */\n @Method()\n async goToPage(page: number) {\n console.info(page);\n }\n\n private updateContent() {\n this.outputTo = this.outputSlot \|\| this.outputEle;\n if (!this.templateStr \|\| !this.outputTo \|\| !this.indexResults) {\n this.show = false;\n return;\n }\n\n // this.outputTo.innerHTML = this.tplRenderFn(this.templateStr, {\n // orig: { ...this.currentIndex.origFilters[this.filterName] },\n // dyn: { ...this.currentIndex.dynFilters[this.filterName] }\n // });\n }\n\n componentWillLoad() {\n this.templateSlot = this.el.querySelector('[slot=\"filter-template\"]');\n this.outputSlot = this.el.querySelector('[slot=\"output\"]');\n\n if (!!this.templateSlot) this.templateStr = this.templateSlot.innerHTML;\n // this.boundChangeEvent = this.handleChangeEvent.bind(this);\n }\n\n componentDidLoad() {\n this.updateContent();\n }\n\n render() {\n return (\n <Host\n class={{\n 'show-pagination': this.show,\n }}\n >\n <div ref={(div) => (this.outputEle = div)}>\n <slot name=\"output\" />\n </div>\n </Host>\n );\n }\n}\n\n// Use the injectProps method to pass from the tunnel as props to the component\nWormhole(AlgoliaPagination as WormholeConsumerConstructor, [\n 'indexResults',\n 'filterChanged',\n 'tplRenderFn',\n]);\n"]}

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

@@ -75,7 +75,7 @@ export class Details {
     displayTransition(this.bodyEl, {
       className: 'is-shown',
       show: false,
-      transitionProp: 'height',
+      transitionProp: ['height'],
     }).then(() => {
       this.stateChanging = false;
       this.detailsEl.open = false;
@@ -97,7 +97,7 @@ export class Details {
     displayTransition(this.bodyEl, {
       className: 'is-shown',
       show: true,
-      transitionProp: 'height',
+      transitionProp: ['height'],
     }).then(() => {
       this.stateChanging = false;
       this.bodyEl.style.height = 'auto';

package/dist/collection/components/details/details.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"details.js","sourceRoot":"","sources":["../../../src/components/details/details.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n Component,\n Event,\n EventEmitter,\n Prop,\n h,\n Element,\n Watch,\n Build,\n} from '@stencil/core';\nimport { displayTransition } from '../../utils/transitions';\n\n/*\n A simple element used to hide or reveal more content with slide effect. Can be used independently or nested within a [accordion](story/components-accordion--accordion) element to add 'one item open at a time' support.\n /\n/\n @slot - content that will be hidden / revealed\n * @slot icon-start - used for icons at the start of the handle\n * @slot label - can be used when you wish to insert complex label markup\n * @slot icon-end - used for icons at the end of the handle\n \n @part base - the root `details` element\n * @part header - the main `summary` ui control\n * @part label - the text wrapper of the ui control\n * @part icon--start - the icon wrapper at the start of the ui control\n * @part icon--end - the icon wrapper at the end of the ui control\n * @part body - the wrapper around content\n * @part content - the main content wrapper\n /\n@Component({\n tag: 'nano-details',\n styleUrl: 'details.scss',\n shadow: true,\n})\nexport class Details {\n private hasStartSlot: boolean;\n private hasEndSlot: boolean;\n private mo?: MutationObserver;\n private stateChanging: boolean = false;\n private bodyEl: HTMLElement;\n private detailsEl: HTMLDetailsElement;\n private headerEl: HTMLElement;\n private contentEl: HTMLDivElement;\n private cacheHeight: number;\n\n @Element() private host: HTMLNanoDetailsElement;\n\n /* Summary / handle text. Use the `label` slot for HTML markup /\n @Prop() label: string = '';\n\n /* Should item be open on load /\n @Prop({ mutable: true, reflect: true }) open: boolean = false;\n\n /* Disables the details so it can't be toggled. /\n @Prop({ mutable: true, reflect: true }) disabled: boolean = false;\n\n /* Hide the handle. (You will need to control the hiding / showing of content with script) /\n @Prop() noHandle: boolean = false;\n\n /* Icon slot rotation amount (degrees) on open /\n @Prop() iconRotation: number = 90;\n\n /\n Sometimes, nested content will resize within the details component which results in choppy show/hide animations.\n * Set `useCacheHeight` to `true` try to keep animations smooth. /\n @Prop() useCacheHeight = false;\n\n /\n Emitted when the component opens.\n * Note: when wrapped in an accordion this event will not propogate. Use nanoToggle events instead.\n /\n @Event() nanoOpened: EventEmitter;\n\n /\n Emitted when the component closes.\n * Note: when wrapped in an accordion this event will not propogate. Use nanoToggle events instead.\n /\n @Event() nanoClosed: EventEmitter;\n\n /* Emitted after the details opens and all transitions are complete. /\n @Event() nanoAfterOpened: EventEmitter;\n\n /* Emitted after the details closes and all transitions are complete. */\n @Event() nanoAfterClosed: EventEmitter;\n\n @Watch('open')\n toggleClick() {\n this.stateChanging = true;\n if (this.open) this.show();\n else this.hide();\n }\n\n private onKeyDown = (e: KeyboardEvent) => {\n if (this.stateChanging \|\| this.disabled) return;\n\n switch (e.key) {\n case 'Enter':\n case ' ':\n e.preventDefault();\n this.open = !this.open;\n break;\n case 'ArrowUp':\n e.preventDefault();\n this.open = false;\n break;\n case 'ArrowDown':\n e.preventDefault();\n this.open = true;\n break;\n }\n };\n\n private onMouseDown = (e: MouseEvent) => {\n e.preventDefault();\n this.headerEl.focus();\n\n if (this.stateChanging \|\| this.disabled) return;\n this.open = !this.open;\n };\n\n private hide() {\n const nanoClose = this.nanoClosed.emit(this.open);\n\n if (nanoClose.defaultPrevented) {\n this.open = true;\n this.detailsEl.open = true;\n return;\n }\n\n this.cacheHeight = this.contentEl.scrollHeight;\n this.bodyEl.style.height = this.cacheHeight + 'px';\n\n displayTransition(this.bodyEl, {\n className: 'is-shown',\n show: false,\n transitionProp: 'height',\n }).then(() => {\n this.stateChanging = false;\n this.detailsEl.open = false;\n this.bodyEl.classList.add('is-hidden');\n this.nanoAfterClosed.emit();\n });\n\n requestAnimationFrame(() => {\n this.bodyEl.style.height = '0px';\n });\n }\n\n private show() {\n const nanoOpen = this.nanoOpened.emit();\n this.detailsEl.open = true;\n\n if (nanoOpen.defaultPrevented) {\n this.open = false;\n this.detailsEl.open = false;\n return;\n }\n\n displayTransition(this.bodyEl, {\n className: 'is-shown',\n show: true,\n transitionProp: 'height',\n }).then(() => {\n this.stateChanging = false;\n this.bodyEl.style.height = 'auto';\n this.nanoAfterOpened.emit();\n });\n\n this.bodyEl.style.height =\n (this.useCacheHeight && this.cacheHeight\n ? this.cacheHeight\n : this.contentEl.scrollHeight) + 'px';\n }\n\n private attachMo() {\n if (this.mo \|\| !this.detailsEl \|\| !Build.isBrowser) return;\n\n this.mo = new MutationObserver((changes) => {\n if (this.stateChanging) return;\n\n for (const change of changes) {\n if (change.type === 'attributes' && change.attributeName === 'open') {\n this.open = this.detailsEl.open;\n }\n }\n });\n this.mo.observe(this.detailsEl, { attributes: true });\n }\n\n componentWillLoad() {\n this.hasStartSlot = !!this.host.querySelector('[slot=\"icon-start\"]');\n this.hasEndSlot = !!this.host.querySelector('[slot=\"icon-end\"]');\n }\n\n componentDidLoad() {\n this.bodyEl.style.height = this.open ? 'auto' : '0';\n if (this.open) this.detailsEl.setAttribute('open', 'true');\n this.attachMo();\n }\n\n connectedCallback() {\n this.attachMo();\n }\n\n disconnectedCallback() {\n if (this.mo) {\n this.mo.disconnect();\n this.mo = undefined;\n }\n }\n\n render() {\n return (\n <details\n part=\"base\"\n ref={(d: HTMLDetailsElement) => (this.detailsEl = d)}\n class={{\n details: true,\n open: this.open,\n disabled: this.disabled,\n }}\n >\n <summary\n part=\"header\"\n aria-controls=\"content\"\n aria-expanded={this.open ? 'true' : 'false'}\n aria-disabled={this.disabled ? 'true' : 'false'}\n tabindex={this.disabled ? '-1' : '0'}\n style={{ display: this.noHandle ? 'none' : '' }}\n id=\"header\"\n role=\"button\"\n class=\"header\"\n ref={(s) => (this.headerEl = s)}\n onKeyDown={this.onKeyDown}\n onClick={this.onMouseDown}\n >\n {this.hasStartSlot ? (\n <span\n part=\"icon--start\"\n class=\"icon icon--start\"\n style={{\n transform: this.open ? `rotate(${this.iconRotation}deg)` : '',\n }}\n >\n <slot name=\"icon-start\" />\n </span>\n ) : (\n ''\n )}\n <div part=\"label\" class=\"label\">\n {this.label ? this.label : <slot name=\"label\" />}\n </div>\n {this.hasEndSlot ? (\n <span\n part=\"icon--end\"\n class=\"icon icon--end\"\n style={{\n transform: this.open ? `rotate(${this.iconRotation}deg)` : '',\n }}\n >\n <slot name=\"icon-end\" />\n </span>\n ) : (\n ''\n )}\n </summary>\n <div\n part=\"body\"\n class=\"body\"\n ref={(div) => (this.bodyEl = div)}\n tabindex=\"-1\"\n role=\"region\"\n aria-labelledby=\"header\"\n >\n <div\n part=\"content\"\n ref={(div) => (this.contentEl = div)}\n class=\"content\"\n id=\"content\"\n >\n <slot />\n </div>\n </div>\n </details>\n );\n }\n}\n"]}
1	+ {"version":3,"file":"details.js","sourceRoot":"","sources":["../../../src/components/details/details.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n Component,\n Event,\n EventEmitter,\n Prop,\n h,\n Element,\n Watch,\n Build,\n} from '@stencil/core';\nimport { displayTransition } from '../../utils/transitions';\n\n/*\n A simple element used to hide or reveal more content with slide effect. Can be used independently or nested within a [accordion](story/components-accordion--accordion) element to add 'one item open at a time' support.\n /\n/\n @slot - content that will be hidden / revealed\n * @slot icon-start - used for icons at the start of the handle\n * @slot label - can be used when you wish to insert complex label markup\n * @slot icon-end - used for icons at the end of the handle\n \n @part base - the root `details` element\n * @part header - the main `summary` ui control\n * @part label - the text wrapper of the ui control\n * @part icon--start - the icon wrapper at the start of the ui control\n * @part icon--end - the icon wrapper at the end of the ui control\n * @part body - the wrapper around content\n * @part content - the main content wrapper\n /\n@Component({\n tag: 'nano-details',\n styleUrl: 'details.scss',\n shadow: true,\n})\nexport class Details {\n private hasStartSlot: boolean;\n private hasEndSlot: boolean;\n private mo?: MutationObserver;\n private stateChanging: boolean = false;\n private bodyEl: HTMLElement;\n private detailsEl: HTMLDetailsElement;\n private headerEl: HTMLElement;\n private contentEl: HTMLDivElement;\n private cacheHeight: number;\n\n @Element() private host: HTMLNanoDetailsElement;\n\n /* Summary / handle text. Use the `label` slot for HTML markup /\n @Prop() label: string = '';\n\n /* Should item be open on load /\n @Prop({ mutable: true, reflect: true }) open: boolean = false;\n\n /* Disables the details so it can't be toggled. /\n @Prop({ mutable: true, reflect: true }) disabled: boolean = false;\n\n /* Hide the handle. (You will need to control the hiding / showing of content with script) /\n @Prop() noHandle: boolean = false;\n\n /* Icon slot rotation amount (degrees) on open /\n @Prop() iconRotation: number = 90;\n\n /\n Sometimes, nested content will resize within the details component which results in choppy show/hide animations.\n * Set `useCacheHeight` to `true` try to keep animations smooth. /\n @Prop() useCacheHeight = false;\n\n /\n Emitted when the component opens.\n * Note: when wrapped in an accordion this event will not propogate. Use nanoToggle events instead.\n /\n @Event() nanoOpened: EventEmitter;\n\n /\n Emitted when the component closes.\n * Note: when wrapped in an accordion this event will not propogate. Use nanoToggle events instead.\n /\n @Event() nanoClosed: EventEmitter;\n\n /* Emitted after the details opens and all transitions are complete. /\n @Event() nanoAfterOpened: EventEmitter;\n\n /* Emitted after the details closes and all transitions are complete. */\n @Event() nanoAfterClosed: EventEmitter;\n\n @Watch('open')\n toggleClick() {\n this.stateChanging = true;\n if (this.open) this.show();\n else this.hide();\n }\n\n private onKeyDown = (e: KeyboardEvent) => {\n if (this.stateChanging \|\| this.disabled) return;\n\n switch (e.key) {\n case 'Enter':\n case ' ':\n e.preventDefault();\n this.open = !this.open;\n break;\n case 'ArrowUp':\n e.preventDefault();\n this.open = false;\n break;\n case 'ArrowDown':\n e.preventDefault();\n this.open = true;\n break;\n }\n };\n\n private onMouseDown = (e: MouseEvent) => {\n e.preventDefault();\n this.headerEl.focus();\n\n if (this.stateChanging \|\| this.disabled) return;\n this.open = !this.open;\n };\n\n private hide() {\n const nanoClose = this.nanoClosed.emit(this.open);\n\n if (nanoClose.defaultPrevented) {\n this.open = true;\n this.detailsEl.open = true;\n return;\n }\n\n this.cacheHeight = this.contentEl.scrollHeight;\n this.bodyEl.style.height = this.cacheHeight + 'px';\n\n displayTransition(this.bodyEl, {\n className: 'is-shown',\n show: false,\n transitionProp: ['height'],\n }).then(() => {\n this.stateChanging = false;\n this.detailsEl.open = false;\n this.bodyEl.classList.add('is-hidden');\n this.nanoAfterClosed.emit();\n });\n\n requestAnimationFrame(() => {\n this.bodyEl.style.height = '0px';\n });\n }\n\n private show() {\n const nanoOpen = this.nanoOpened.emit();\n this.detailsEl.open = true;\n\n if (nanoOpen.defaultPrevented) {\n this.open = false;\n this.detailsEl.open = false;\n return;\n }\n\n displayTransition(this.bodyEl, {\n className: 'is-shown',\n show: true,\n transitionProp: ['height'],\n }).then(() => {\n this.stateChanging = false;\n this.bodyEl.style.height = 'auto';\n this.nanoAfterOpened.emit();\n });\n\n this.bodyEl.style.height =\n (this.useCacheHeight && this.cacheHeight\n ? this.cacheHeight\n : this.contentEl.scrollHeight) + 'px';\n }\n\n private attachMo() {\n if (this.mo \|\| !this.detailsEl \|\| !Build.isBrowser) return;\n\n this.mo = new MutationObserver((changes) => {\n if (this.stateChanging) return;\n\n for (const change of changes) {\n if (change.type === 'attributes' && change.attributeName === 'open') {\n this.open = this.detailsEl.open;\n }\n }\n });\n this.mo.observe(this.detailsEl, { attributes: true });\n }\n\n componentWillLoad() {\n this.hasStartSlot = !!this.host.querySelector('[slot=\"icon-start\"]');\n this.hasEndSlot = !!this.host.querySelector('[slot=\"icon-end\"]');\n }\n\n componentDidLoad() {\n this.bodyEl.style.height = this.open ? 'auto' : '0';\n if (this.open) this.detailsEl.setAttribute('open', 'true');\n this.attachMo();\n }\n\n connectedCallback() {\n this.attachMo();\n }\n\n disconnectedCallback() {\n if (this.mo) {\n this.mo.disconnect();\n this.mo = undefined;\n }\n }\n\n render() {\n return (\n <details\n part=\"base\"\n ref={(d: HTMLDetailsElement) => (this.detailsEl = d)}\n class={{\n details: true,\n open: this.open,\n disabled: this.disabled,\n }}\n >\n <summary\n part=\"header\"\n aria-controls=\"content\"\n aria-expanded={this.open ? 'true' : 'false'}\n aria-disabled={this.disabled ? 'true' : 'false'}\n tabindex={this.disabled ? '-1' : '0'}\n style={{ display: this.noHandle ? 'none' : '' }}\n id=\"header\"\n role=\"button\"\n class=\"header\"\n ref={(s) => (this.headerEl = s)}\n onKeyDown={this.onKeyDown}\n onClick={this.onMouseDown}\n >\n {this.hasStartSlot ? (\n <span\n part=\"icon--start\"\n class=\"icon icon--start\"\n style={{\n transform: this.open ? `rotate(${this.iconRotation}deg)` : '',\n }}\n >\n <slot name=\"icon-start\" />\n </span>\n ) : (\n ''\n )}\n <div part=\"label\" class=\"label\">\n {this.label ? this.label : <slot name=\"label\" />}\n </div>\n {this.hasEndSlot ? (\n <span\n part=\"icon--end\"\n class=\"icon icon--end\"\n style={{\n transform: this.open ? `rotate(${this.iconRotation}deg)` : '',\n }}\n >\n <slot name=\"icon-end\" />\n </span>\n ) : (\n ''\n )}\n </summary>\n <div\n part=\"body\"\n class=\"body\"\n ref={(div) => (this.bodyEl = div)}\n tabindex=\"-1\"\n role=\"region\"\n aria-labelledby=\"header\"\n >\n <div\n part=\"content\"\n ref={(div) => (this.contentEl = div)}\n class=\"content\"\n id=\"content\"\n >\n <slot />\n </div>\n </div>\n </details>\n );\n }\n}\n"]}

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

@@ -928,13 +928,13 @@ export class GlobalNav {
       })))),
       ((this.threshold < this.THRESHOLDLIMIT - 2 &&
         this.mainSlotLen >= 2) ||
-        this.overflowSlotLen >= 2) && (h("nav", { class: "nav-links", "aria-label": "Different company site links" }, h("nano-nav-item", { class: "nano-global-nav nano-global-nav-menu" }, "Sites", h("nano-icon", { slot: "icon-end", name: "solid/chevron-right" }), h("div", { slot: "secondary" }, h("div", { class: "content" }, h("button", { class: "back-btn", onClick: this.subMenuClose }, h("nano-icon", { slot: "icon-end", name: "solid/chevron-left", "aria-label": "go back" }), "Sites"), h("div", { class: "content--sub" }, h("slot", { name: "site", onSlotchange: this.assessSlottedContent }), this.siteNavItms.map((link) => {
+        this.overflowSlotLen >= 2) && (h("nav", { class: "nav-links", "aria-label": "Different company site links" }, h("nano-nav-item", { class: "nano-global-nav nano-global-nav-menu", closeOnBlur: false }, "Sites", h("nano-icon", { slot: "icon-end", name: "solid/chevron-right" }), h("div", { slot: "secondary" }, h("div", { class: "content" }, h("button", { class: "back-btn", onClick: this.subMenuClose }, h("nano-icon", { slot: "icon-end", name: "solid/chevron-left", "aria-label": "go back" }), "Sites"), h("div", { class: "content--sub" }, h("slot", { name: "site", onSlotchange: this.assessSlottedContent }), this.siteNavItms.map((link) => {
         return (h("nano-nav-item", { class: "nano-global-nav nano-global-nav-menu" }, h("a", { href: link.address, target: link.target }, link.title)));
       }))))))),
     ]))), this.isLoggedIn &&
       this.threshold <
         this.THRESHOLDLIMIT - THRESHOLDBREAKS.login &&
-      (this.loggedInNavItms.length || this.hasLoggedinSlot) && (h("nav", { class: "nav-links", "aria-label": "Your user account links" }, h("nano-nav-item", { class: "nano-global-nav user-nav nano-global-nav-menu" }, this.myAccountUser.name, h("nano-icon", { slot: "icon-end", name: "solid/chevron-right" }), h("div", { slot: "secondary" }, h("div", { class: "content" }, h("button", { class: "back-btn", onClick: this.subMenuClose }, h("nano-icon", { slot: "icon-end", name: "solid/chevron-left", "aria-label": "go back" }), this.myAccountUser.name), !!((_a = this.myAccountUser) === null || _a === void 0 ? void 0 : _a.small_avatar_url) && (h("nano-global-nav-user-profile", { myAccountUser: this.myAccountUser, userProfileUrl: this.userProfileUrl })), h("div", { class: "content--sub" }, h("slot", { name: "loggedin", onSlotchange: this.assessSlottedContent }), this.loggedInNavItms.map((link) => {
+      (this.loggedInNavItms.length || this.hasLoggedinSlot) && (h("nav", { class: "nav-links", "aria-label": "Your user account links" }, h("nano-nav-item", { class: "nano-global-nav user-nav nano-global-nav-menu", closeOnBlur: false }, this.myAccountUser.name, h("nano-icon", { slot: "icon-end", name: "solid/chevron-right" }), h("div", { slot: "secondary" }, h("div", { class: "content" }, h("button", { class: "back-btn", onClick: this.subMenuClose }, h("nano-icon", { slot: "icon-end", name: "solid/chevron-left", "aria-label": "go back" }), this.myAccountUser.name), !!((_a = this.myAccountUser) === null || _a === void 0 ? void 0 : _a.small_avatar_url) && (h("nano-global-nav-user-profile", { myAccountUser: this.myAccountUser, userProfileUrl: this.userProfileUrl })), h("div", { class: "content--sub" }, h("slot", { name: "loggedin", onSlotchange: this.assessSlottedContent }), this.loggedInNavItms.map((link) => {
       return (h("nano-nav-item", { class: "nano-global-nav nano-global-nav-menu" }, h("a", { href: link.address, target: link.target }, link.title)));
     }), h("nano-nav-item", { class: "nano-global-nav nano-global-nav-menu" }, h("a", { href: this.myAccData.urls.forgot_password +
         this.ssoRedirect }, "Change Password")))))))), h("slot", { name: "promotion", onSlotchange: this.assessSlottedContent }), this.myAccData && this.myAccData.urls.logout && (h("div", { class: "login-btn logout-btn" }, h("a", { href: this.myAccData.urls.logout + this.ssoRedirect }, "Logout")))))), h("div", { class: "sticker-trigger" }), h("nano-sticker", { "auto-resize": "false", "break-point-max": "800", quietMode: { h: 600, w: 800 }, part: "sticker" }, h("div", { class: "bars", part: "bars" }, h("nav", { part: "main-bar", class: "main-bar", "aria-label": "Main site navigation", tabindex: "-1", ref: (div) => (this.mainBarDiv = div) }, (this.hasPromotionSlot ||