@nanoporetech-digital/components 2.2.0 → 2.3.1

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 (142) hide show
  1. package/CHANGELOG.md +30 -0
  2. package/dist/cjs/loader.cjs.js +1 -1
  3. package/dist/cjs/nano-components.cjs.js +1 -1
  4. package/dist/cjs/nano-dropdown.cjs.entry.js +2 -1
  5. package/dist/cjs/nano-dropdown.cjs.entry.js.map +1 -1
  6. package/dist/cjs/nano-global-nav.cjs.entry.js +62 -33
  7. package/dist/cjs/nano-global-nav.cjs.entry.js.map +1 -1
  8. package/dist/cjs/nano-nav-item_2.cjs.entry.js +1 -1
  9. package/dist/cjs/nano-nav-item_2.cjs.entry.js.map +1 -1
  10. package/dist/cjs/nano-split-pane.cjs.entry.js +8 -14
  11. package/dist/cjs/nano-split-pane.cjs.entry.js.map +1 -1
  12. package/dist/cjs/nano-tooltip.cjs.entry.js +2 -1
  13. package/dist/cjs/nano-tooltip.cjs.entry.js.map +1 -1
  14. package/dist/cjs/{popover-55c687c2.js → popover-848d73ea.js} +4 -2
  15. package/dist/cjs/popover-848d73ea.js.map +1 -0
  16. package/dist/collection/components/accordion/accordion.js +1 -1
  17. package/dist/collection/components/alert/alert.js +1 -1
  18. package/dist/collection/components/algolia/algolia-filter.js +2 -2
  19. package/dist/collection/components/algolia/algolia-input.js +5 -5
  20. package/dist/collection/components/algolia/algolia-results.js +1 -1
  21. package/dist/collection/components/algolia/algolia.js +6 -6
  22. package/dist/collection/components/checkbox/checkbox-group.js +2 -2
  23. package/dist/collection/components/checkbox/checkbox.js +3 -3
  24. package/dist/collection/components/datalist/datalist.js +1 -1
  25. package/dist/collection/components/date-input/date-input.js +7 -7
  26. package/dist/collection/components/date-picker/date-picker.js +5 -5
  27. package/dist/collection/components/details/details.js +1 -1
  28. package/dist/collection/components/dialog/dialog.js +1 -1
  29. package/dist/collection/components/file-upload/file-upload.js +4 -4
  30. package/dist/collection/components/global-nav/global-nav.css +11 -6
  31. package/dist/collection/components/global-nav/global-nav.js +67 -38
  32. package/dist/collection/components/global-nav/global-nav.js.map +1 -1
  33. package/dist/collection/components/grid/grid-item.js +1 -1
  34. package/dist/collection/components/icon/icon.js +1 -1
  35. package/dist/collection/components/input/input.js +5 -5
  36. package/dist/collection/components/nav-item/nav-item.css +4 -1
  37. package/dist/collection/components/nav-item/nav-item.js +4 -4
  38. package/dist/collection/components/range/range.js +4 -4
  39. package/dist/collection/components/resize-observe/resize-observe.js +1 -1
  40. package/dist/collection/components/select/select.js +7 -7
  41. package/dist/collection/components/slides/slides.js +7 -7
  42. package/dist/collection/components/split-pane/split-pane.js +22 -37
  43. package/dist/collection/components/split-pane/split-pane.js.map +1 -1
  44. package/dist/collection/components/tabs/tab-group.js +2 -2
  45. package/dist/collection/utils/popover.js +2 -1
  46. package/dist/collection/utils/popover.js.map +1 -1
  47. package/dist/components/nano-global-nav.js +62 -33
  48. package/dist/components/nano-global-nav.js.map +1 -1
  49. package/dist/components/nano-split-pane.js +9 -16
  50. package/dist/components/nano-split-pane.js.map +1 -1
  51. package/dist/components/nav-item.js +1 -1
  52. package/dist/components/nav-item.js.map +1 -1
  53. package/dist/components/popover.js +3 -1
  54. package/dist/components/popover.js.map +1 -1
  55. package/dist/custom-elements/index.js +73 -50
  56. package/dist/custom-elements/index.js.map +1 -1
  57. package/dist/esm/loader.js +1 -1
  58. package/dist/esm/nano-components.js +1 -1
  59. package/dist/esm/nano-dropdown.entry.js +2 -1
  60. package/dist/esm/nano-dropdown.entry.js.map +1 -1
  61. package/dist/esm/nano-global-nav.entry.js +62 -33
  62. package/dist/esm/nano-global-nav.entry.js.map +1 -1
  63. package/dist/esm/nano-nav-item_2.entry.js +1 -1
  64. package/dist/esm/nano-nav-item_2.entry.js.map +1 -1
  65. package/dist/esm/nano-split-pane.entry.js +8 -14
  66. package/dist/esm/nano-split-pane.entry.js.map +1 -1
  67. package/dist/esm/nano-tooltip.entry.js +2 -1
  68. package/dist/esm/nano-tooltip.entry.js.map +1 -1
  69. package/dist/esm/{popover-d9dc8e13.js → popover-46b5193d.js} +4 -2
  70. package/dist/{nano-components/p-3c3e9fec.system.js.map → esm/popover-46b5193d.js.map} +1 -1
  71. package/dist/esm-es5/loader.js +1 -1
  72. package/dist/esm-es5/loader.js.map +1 -1
  73. package/dist/esm-es5/nano-components.js +1 -1
  74. package/dist/esm-es5/nano-components.js.map +1 -1
  75. package/dist/esm-es5/nano-dropdown.entry.js +1 -1
  76. package/dist/esm-es5/nano-dropdown.entry.js.map +1 -1
  77. package/dist/esm-es5/nano-global-nav.entry.js +1 -1
  78. package/dist/esm-es5/nano-global-nav.entry.js.map +1 -1
  79. package/dist/esm-es5/nano-nav-item_2.entry.js +1 -1
  80. package/dist/esm-es5/nano-nav-item_2.entry.js.map +1 -1
  81. package/dist/esm-es5/nano-split-pane.entry.js +1 -1
  82. package/dist/esm-es5/nano-split-pane.entry.js.map +1 -1
  83. package/dist/esm-es5/nano-tooltip.entry.js +1 -1
  84. package/dist/esm-es5/nano-tooltip.entry.js.map +1 -1
  85. package/dist/esm-es5/popover-46b5193d.js +5 -0
  86. package/dist/esm-es5/popover-46b5193d.js.map +1 -0
  87. package/dist/nano-components/nano-components.esm.js +1 -1
  88. package/dist/nano-components/nano-components.esm.js.map +1 -1
  89. package/dist/nano-components/p-094ab6f8.entry.js +5 -0
  90. package/dist/nano-components/{p-a0515a0f.entry.js.map → p-094ab6f8.entry.js.map} +1 -1
  91. package/dist/nano-components/p-096682d9.system.js +1 -1
  92. package/dist/nano-components/p-096682d9.system.js.map +1 -1
  93. package/dist/nano-components/p-12f70017.system.entry.js +5 -0
  94. package/dist/nano-components/p-12f70017.system.entry.js.map +1 -0
  95. package/dist/nano-components/p-4b7cd30c.js +5 -0
  96. package/dist/nano-components/p-4b7cd30c.js.map +1 -0
  97. package/dist/nano-components/p-6dd58c39.entry.js +5 -0
  98. package/dist/nano-components/p-6dd58c39.entry.js.map +1 -0
  99. package/dist/nano-components/p-8b3ee91b.system.entry.js +5 -0
  100. package/dist/nano-components/{p-ca466250.system.entry.js.map → p-8b3ee91b.system.entry.js.map} +1 -1
  101. package/dist/nano-components/p-8de6e276.entry.js +5 -0
  102. package/dist/nano-components/p-8de6e276.entry.js.map +1 -0
  103. package/dist/nano-components/p-9ca5e023.system.entry.js +5 -0
  104. package/dist/nano-components/p-9ca5e023.system.entry.js.map +1 -0
  105. package/dist/nano-components/p-d35d468b.system.js +5 -0
  106. package/dist/{cjs/popover-55c687c2.js.map → nano-components/p-d35d468b.system.js.map} +1 -1
  107. package/dist/nano-components/p-d9f2dda5.entry.js +5 -0
  108. package/dist/nano-components/p-d9f2dda5.entry.js.map +1 -0
  109. package/dist/nano-components/p-e01adaa3.entry.js +5 -0
  110. package/dist/nano-components/{p-17bf76c4.entry.js.map → p-e01adaa3.entry.js.map} +1 -1
  111. package/dist/nano-components/p-f9e30f31.system.entry.js +5 -0
  112. package/dist/nano-components/p-f9e30f31.system.entry.js.map +1 -0
  113. package/dist/nano-components/p-fd1a86d2.system.entry.js +5 -0
  114. package/dist/nano-components/{p-7fcbc27f.system.entry.js.map → p-fd1a86d2.system.entry.js.map} +1 -1
  115. package/dist/types/components/global-nav/global-nav.d.ts +1 -0
  116. package/dist/types/components/split-pane/split-pane.d.ts +2 -4
  117. package/dist/types/components.d.ts +2 -6
  118. package/docs-json.json +10 -25
  119. package/docs-vscode.json +0 -4
  120. package/package.json +2 -2
  121. package/dist/esm/popover-d9dc8e13.js.map +0 -1
  122. package/dist/esm-es5/popover-d9dc8e13.js +0 -5
  123. package/dist/esm-es5/popover-d9dc8e13.js.map +0 -1
  124. package/dist/nano-components/p-17bf76c4.entry.js +0 -5
  125. package/dist/nano-components/p-1ec44caf.entry.js +0 -5
  126. package/dist/nano-components/p-1ec44caf.entry.js.map +0 -1
  127. package/dist/nano-components/p-3c3e9fec.system.js +0 -5
  128. package/dist/nano-components/p-58419bed.system.entry.js +0 -5
  129. package/dist/nano-components/p-58419bed.system.entry.js.map +0 -1
  130. package/dist/nano-components/p-625d3733.js +0 -5
  131. package/dist/nano-components/p-625d3733.js.map +0 -1
  132. package/dist/nano-components/p-7fcbc27f.system.entry.js +0 -5
  133. package/dist/nano-components/p-a0515a0f.entry.js +0 -5
  134. package/dist/nano-components/p-b19e0775.system.entry.js +0 -5
  135. package/dist/nano-components/p-b19e0775.system.entry.js.map +0 -1
  136. package/dist/nano-components/p-c954c040.entry.js +0 -5
  137. package/dist/nano-components/p-c954c040.entry.js.map +0 -1
  138. package/dist/nano-components/p-ca466250.system.entry.js +0 -5
  139. package/dist/nano-components/p-d628547b.entry.js +0 -5
  140. package/dist/nano-components/p-d628547b.entry.js.map +0 -1
  141. package/dist/nano-components/p-d87ebf95.system.entry.js +0 -5
  142. package/dist/nano-components/p-d87ebf95.system.entry.js.map +0 -1
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["src/utils/fetch.ts","src/components/global-nav/global-nav.scss?tag=nano-global-nav&encapsulation=shadow","src/components/global-nav/global-nav.tsx"],"names":["clientFetch","url","_a","body","customConfig","__rest","headers","Accept","Access-Control-Allow-Origin","Content-Type","Cache","config","Object","assign","method","credentials","keepalive","mode","JSON","stringify","id","setTimeout","window","AbortController","controller_1","_b","timeout","abort","signal","fetch","response","_c","sent","clearTimeout","ok","json","text","errorMessage","Error","globalNavCss","THRESHOLDBREAKS","search","about","main","login","icon","GlobalNav","exports","class_1","hostRef","_this","this","currSize","thresholdsGoingUp","THRESHOLDLIMIT","keys","length","autocompleteEles","currAIndex","isLoggedIn","myAccData","aboutNavItms","siteNavItms","loggedInNavItms","hasLoggedinSlot","hasSiteSlot","hasPromotionSlot","aboutSlotLen","iconSlotLen","mainSlotLen","overflowSlotLen","searchSlotLen","internalSearchIndeces","thresholdReady","remoteDataReady","ready","isResizing","threshold","modalOpen","modalIsOpen","searchBarShown","scrollingUp","searchLoading","showAutocomplete","secondaryMenuOpen","userMenuOpen","menuFullScreen","searchValInternal","env","ssoRedirect","encodeURIComponent","location","href","getMyAccountData","activeMyAccountSections","showSearch","showLogo","logoUrl","protocol","host","searchIndeces","myAccountUser","searchValue","searchIndex","cartCount","msgCount","cartUrl","msgUrl","setResizingState","state","debounceSetResizingState","debounce","onMenuBtnKeyDown","ev","key","menuClose","menuOpen","onMenuBtnClick","e","preventDefault","menuDiv","style","display","menuWrapDiv","addEventListener","focus","preventScroll","scrollHeight","innerHeight","document","overflow","overflowX","onMenuHidden","removeEventListener","activeElement","menuBtn","mainBarDiv","force","relatedTarget","closestElement","closest","subMenuClose","target","open","onUserBtnClick","onUserBtnKeyDown","onUserMenuBlur","onSearchBtnClick","searchbarShow","searchbarHide","onSearchBtnKeyDown","onSearchBarShown","searchBarEl","searchInput","setFocus","onSearchBarHidden","height","onSearchInput","value","isSearchValSet","detail","type","onSearchChange","__awaiter","autocompleteResults","nanoSearchReset","emit","currentIndex","currentSelectedIndex","processSearchResults","alogliaIndex","attributesToSnippet","hitsPerPage","filters","Math","floor","Date","now","apply","_e","console","error","e_1","scopeSearch","_d","onSearchSubmit","showAutocompleteResults","algoliaSearchResults","queries","map","index","indexName","query","facets","algoliaClient","multipleQueries","nanoSearchError","e_2","results","result","i","name","selected","domain","domains","allGroup","nanoSearchResult","client","apiKey","searchApiKey","appId","searchAppId","onSearchIndexChange","indexStr","selectedIndex","find","switchIndexSubmit","onAutocompleteBlur","hits","onAutocompleteInteract","testIndex","el","shadowRoot","found_1","ele","setActiveElement","found","click","prototype","submitSearch","foundIndex","changeInternalSearchVal","initAlgoliaClient","algoliasearch","addAlgoliaIndeces","addIndeces","__spreadArray","forEach","initIndex","thresholdChange","newThreshold","oldThreshold","ratioChange","intersectRatio","siteContent","minHeight","barsDiv","clientHeight","menuItems_1","barItems_1","readTask","Array","from","querySelectorAll","push","writeTask","item","classList","add","remove","assessReady","remoteReady","attachIO","isReady","nanoIsReady","setupAutocompleteBlur","slotChange","thresholdClasses","classes","onWindowResize","innerWidth","secondaryOpen","secondaryMenu","stopPropagation","menuContentDiv","secondaryClose","handleUserMenu","displayTransition","userLinkPanel","querySelector","autocompleteSnippet","hit","lookFor","_snippetResult","prop","matchLevel","title","substring","resetHitFocus","autocompleteEle","setAttribute","assessSlottedContent","io","root","IntersectionObserver","data","slice","intersectionRatio","observe","componentDidLoad","debounceResize","bind","componentWillLoad","ComponentStore","init","MutationObserver","mo","childList","subtree","disconnectedCallback","disconnect","undefined","connectedCallback","getMyAccData","autocompleteList","content","currentScopeHits","scopeChangeSuggestions","scopeSuggestReducer","total","currentSuggestReducer","reduce","scopeSuggestions_1","h","class","role","ref","a","tabindex","innerHTML","button","onClick","onMouseDown","aria-expanded","hidden","onKeyDown","searchWidget","onSubmit","label","hideLabel","showInlineError","onNanoChange","mask","slot","aria-label","clear-input","placeholder","input","onNanoInput","aria-autocomplete","aria-activedescendant","aria-controls","onNanoFocus","search-icon","search-icon--search","search-icon--show","search-icon--loader","render","isRtl","ownerDocument","dir","Host","join","resizing","global-nav","scrolling-down","gn-menu","has-promotion","menu-full-screen","secondary-open","div","includes","urls","link","address","forgot_password","logout","auto-resize","break-point-max","quietMode","w","btn","src","getAssetPath","alt","aria-owns","icon-btn","user-links-btn","search-bar","show","onTouchEnd","domainFor","origin","dm","multiResults","singleResult","match","module","import","user","processMyAccLinks","processMyAccData","e_3","indeces","api_key","app_id","cart","count","notifications","messages","links","area"],"mappings":"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","sourcesContent":["interface FetchInputConfig {\n body?: { [prop: string]: string };\n headers?: { [prop: string]: string };\n [prop: string]: any;\n}\n\nexport async function clientFetch(\n url: string,\n { body, ...customConfig }: FetchInputConfig = {}\n) {\n const headers: { [prop: string]: string } = {\n Accept: 'application/json, text/plain, */*',\n 'Access-Control-Allow-Origin': '*',\n 'Content-Type': 'application/json',\n Cache: 'no-cache',\n };\n const config: RequestInit = {\n method: body ? 'POST' : 'GET',\n credentials: 'include',\n keepalive: true,\n mode: 'cors',\n ...customConfig,\n headers: {\n ...headers,\n ...customConfig.headers,\n },\n };\n if (body) {\n config.body = JSON.stringify(body);\n }\n\n let id = setTimeout(() => {}, 0);\n if (window.AbortController) {\n const controller = new AbortController();\n const { timeout = 500 } = customConfig;\n id = setTimeout(() => controller.abort(), timeout);\n config.signal = controller.signal;\n }\n\n const response = await fetch(url, config);\n clearTimeout(id);\n\n if (response.ok) {\n return await response.json();\n } else {\n const errorMessage = await response.text();\n return new Error(errorMessage);\n }\n}\n","@use 'sass:map';\n@use 'sass:list';\n\n@import '../../global/style/utilities/globals';\n@import '../../global/style/nano-theme/base';\n@import '../../global/style/nano-theme/colours';\n@import '../../global/style/nano-theme/layers';\n\n:host {\n /**\n * @prop --padding: padding used for many elements. Defaults to '12px 0'.\n * @prop --padding-top: top padding used for many elements. Defaults to --padding.\n * @prop --padding-bottom: bottom padding used for many elements. Defaults to --padding.\n * @prop --padding-end: end (left on l2r / right on r2l) padding used for many elements. Defaulst to --padding.\n * @prop --padding-start: start (right on l2r / left on r2l) padding used for many elements. Defaults to --padding.\n * @prop --bar-background: Background of the bar element. Defaults to rgb(17, 85, 113).\n * @prop --bar-text-color: Text color within the bar element. Defaults to white.\n * @prop --bar-color-shade: Color variant used within the bar element. Defaults to rgb(40, 110, 133).\n * @prop --bar-color-tint: Color variant used within the bar element. Defaults to rgb(88, 140, 161).\n * @prop --bar-color-focus: Focus color of the form element within search. Defaults to #90c6e7;\n * @prop --bar-color-focus: Focus color of the form element within search. Defaults to #90c6e7;\n * @prop --menu-background: Background 'burger', menu element. Defaults to #001a21;\n * @prop --menu-text-color: Text color 'burger', menu element. Defaults to white;\n */\n --padding: 12px;\n --padding-top: var(--padding);\n --padding-end: var(--padding);\n --padding-bottom: var(--padding);\n --padding-start: var(--padding);\n --bar-background: #005c75;\n --bar-text-color: white;\n --bar-color-shade: rgb(19, 89, 111);\n --bar-color-tint: rgb(19, 89, 111);\n --bar-color-focus: #90c6e7;\n --menu-background: #001a21;\n --menu-text-color: white;\n --menu-dropdown-bg: #196c82;\n --menu-dropdown-color: white;\n\n display: block;\n position: relative;\n line-height: 1.5;\n height: 100%;\n\n * {\n box-sizing: inherit;\n }\n}\n\n// Common\n.global-nav {\n @include text-inherit();\n\n font-size: 0.88em;\n z-index: #{$layer-index-menubar};\n\n button {\n background: none;\n color: inherit;\n border: none;\n padding: 0;\n }\n\n .icon-btn {\n position: relative;\n background: none;\n color: inherit;\n border: none;\n align-self: normal;\n padding: 9px 7px;\n cursor: pointer;\n display: flex;\n align-items: center;\n\n nano-icon {\n width: 18px;\n height: 18px;\n }\n }\n\n ::slotted(nano-nav-item[slot='icon']) {\n --padding-top: 9px;\n --padding-bottom: 9px;\n --padding-start: 7px;\n --padding-end: 7px;\n --display: flex;\n\n font-size: 18px;\n }\n\n a {\n color: inherit;\n text-decoration: none;\n white-space: nowrap;\n }\n\n .nav-links {\n &_title {\n margin: 8px 0 3px;\n }\n\n ul {\n margin: 0;\n padding: 0;\n }\n\n li {\n list-style: none;\n }\n }\n\n .login-btn {\n display: flex;\n align-items: center;\n font-size: 0.94em;\n }\n\n .menu-btn {\n padding: 9px var(--padding) 9px var(--padding);\n }\n}\n\n// Popup / Slideout Menu\n.gn-menu {\n position: fixed;\n top: 0;\n left: 0;\n z-index: -1;\n display: none;\n transition: z-index 0.01s ease 0.2s;\n height: 100vh;\n width: 100vw;\n overflow-y: auto;\n\n @include rtl-host() {\n left: auto;\n right: 0;\n }\n\n :host(.threshold-2) & {\n position: absolute;\n width: calc(100vw - 20px);\n }\n\n &.menu-full-screen {\n width: 100vw !important;\n }\n\n // &.secondary-open {\n // overflow-y: hidden;\n // }\n\n &_wrap {\n max-width: 92vw;\n width: 335px;\n background: var(--menu-background);\n color: var(--menu-text-color);\n padding: var(--padding) 0;\n box-shadow: 0 0 36px 0 rgba(0, 0, 0, 0.8);\n position: relative;\n pointer-events: all;\n margin-bottom: 36px;\n opacity: 0;\n outline: none;\n transition: transform 0.2s ease, opacity 0.2s ease;\n\n &.has-promotion {\n padding: var(--padding) 0 0;\n }\n }\n\n &.open {\n z-index: #{$layer-index-dropdown};\n transition: z-index 0.01s ease;\n\n .gn-menu_wrap {\n opacity: 1;\n transform: translate3d(0, 0, 0) !important;\n transition: transform 0.2s ease 0.01s, opacity 0.2s ease 0.01s;\n }\n }\n\n &_actions {\n @include padding(null, calc(var(--padding) / 2), null, null);\n\n display: flex;\n justify-content: space-between;\n\n &-counter {\n background: #d0021b;\n color: #fff;\n position: absolute;\n bottom: 4px;\n right: 0;\n left: auto;\n font-size: 9px;\n height: 14px;\n line-height: 14px;\n width: auto;\n min-width: 14px;\n border-radius: 50%;\n -webkit-box-sizing: border-box;\n box-sizing: border-box;\n text-align: center;\n text-indent: 0;\n }\n }\n\n .content {\n &-wrap {\n position: relative;\n overflow: hidden;\n transition: 0.2s ease min-height;\n min-height: 190px;\n }\n\n &--sub {\n padding: var(--padding) 0 var(--padding) 7px;\n }\n }\n\n .menu-btn {\n @include margin(null, auto, null, null);\n }\n\n .nav-links {\n display: flex;\n flex-wrap: wrap;\n\n ::slotted(nano-nav-item),\n nano-nav-item {\n --icon-size: 14px;\n --display: inline-block;\n --secondary-bg-color: #001a21;\n --padding-top: 10px;\n --padding-bottom: 10px;\n --padding-end: calc(var(--padding) * 2);\n --padding-start: calc(var(--padding) + 3px);\n --color: white;\n --color-hover: #{map.get($colors, lightblue)};\n --bg-color-hover: transparent;\n --bg-color-focus: #002530;\n --focus-outline: none;\n\n font-size: 0.99em;\n width: 100%;\n // margin: 0 0;\n }\n\n .user-nav {\n --bg-color: #193037;\n --padding-top: 9px;\n --padding-bottom: 9px;\n\n font-weight: bold;\n margin: 5px 0 0;\n\n ::slotted(nano-nav-item),\n nano-nav-item {\n font-weight: 500;\n\n --bg-color: transparent;\n }\n }\n\n &_title {\n margin: 0 var(--padding) 4px;\n border-bottom: 1px solid #33484d;\n padding-bottom: 8px;\n font-size: 0.86em;\n text-transform: uppercase;\n color: map.get($colors, lightblue);\n letter-spacing: 1px;\n font-weight: 700;\n }\n\n &-wrap {\n margin: 18px 0;\n\n &:last-child {\n margin-bottom: 0;\n }\n }\n\n .back-btn {\n border-top: 1px solid #33484d;\n border-bottom: 1px solid #33484d;\n display: flex;\n align-items: center;\n padding: 10px 11px 10px 0;\n width: 100%;\n font-size: 12px;\n text-transform: uppercase;\n color: map.get($colors, lightblue);\n letter-spacing: 1px;\n font-weight: 700;\n\n nano-icon {\n @include margin(null, 10px, null, null);\n\n font-size: 12px;\n color: white;\n }\n }\n\n &--sub {\n display: flex;\n flex-wrap: wrap;\n\n ::slotted(nano-nav-item),\n nano-nav-item {\n --border-bottom: none;\n --padding-end: var(--padding);\n --padding-start: var(--padding);\n --padding-top: 8px;\n --padding-bottom: 8px;\n\n margin: 0;\n width: 50%;\n line-height: 1.8;\n }\n }\n\n .content {\n padding: 8px var(--padding);\n }\n }\n\n .login-btn {\n @include padding(9px, var(--padding), 9px, 7px);\n\n nano-icon {\n @include margin(null, null, null, 10px);\n }\n }\n\n .logout-btn {\n justify-content: flex-end;\n\n a {\n padding: 0 5px;\n }\n }\n}\n\n// Main Bar\n.sticker-trigger {\n background: var(--bar-background);\n width: 100%;\n z-index: calc(#{$layer-index-menubar} + 1);\n}\n\n.bars {\n color: var(--bar-text-color);\n z-index: #{$layer-index-menubar};\n position: relative;\n max-width: 100%;\n min-width: 100%;\n box-shadow: none;\n transition: 0.2s ease box-shadow;\n\n [stuck] & {\n box-shadow: 0 1px 25px 0 rgba(0, 0, 0, 0.15);\n }\n\n &::before {\n content: '';\n width: 100%;\n height: 100%;\n z-index: -1;\n background: var(--bar-background);\n position: absolute;\n }\n\n .search {\n &-widget {\n @include margin(null, auto, null, 11px);\n\n position: relative;\n flex: 1 1 auto;\n max-width: 45vw;\n min-width: 269px;\n max-height: 36px;\n }\n\n &-inputs {\n display: flex;\n margin: 0;\n\n input[type='submit'] {\n display: none;\n }\n }\n\n &-autocomplete {\n position: absolute;\n top: calc(100% - 2px);\n width: 100%;\n left: 0;\n background: white;\n border: 2px solid var(--bar-color-tint);\n border-radius: 0 0 5px 5px;\n color: map.get($colors, black);\n font-size: 0.85em;\n padding: calc(var(--padding) / 2) 0 1px 0;\n z-index: 1;\n\n @include rtl-host() {\n left: auto;\n right: 0;\n }\n\n &-hit {\n padding:\n calc(var(--padding) / 4) var(--padding)\n calc(var(--padding) / 4) var(--padding);\n width: 100%;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n display: block;\n text-align: left;\n line-height: 1.5;\n cursor: pointer;\n\n @include rtl-host() {\n text-align: right;\n }\n\n &-scope {\n font-size: 0.76em;\n // text-indent: 10px;\n color: rgb(167, 176, 179);\n font-weight: 600;\n }\n\n &:hover,\n &:focus {\n background-color: map.get($colors, lightgrey);\n }\n\n .search__highlight,\n em {\n font-weight: bold;\n font-style: normal;\n }\n\n &--no-result {\n &:hover,\n &:focus {\n background: none !important;\n }\n }\n }\n\n &-foot {\n margin: 7px 0 0;\n }\n\n &-submit {\n background: none;\n border: none;\n align-self: normal;\n padding: 9px var(--padding);\n cursor: pointer;\n display: flex;\n align-items: center;\n color: map.get($colors, blue);\n justify-content: flex-end;\n width: 100%;\n text-decoration: underline;\n border-top: 1px solid rgb(232, 234, 234);\n\n &:hover,\n &:focus {\n background-color: map.get($colors, lightgrey);\n }\n }\n }\n }\n\n .search-input {\n --input-border-style: solid 1px rgb(85, 140, 157);\n --input-border-style--focus: solid 1px var(--bar-color-focus, #90c6e7);\n --input-border-width: 1px;\n\n font-size: 0.9em;\n }\n\n nano-select.search-input {\n --input-bg-color: var(--bar-color-tint, rgb(88, 140, 161));\n --input-text-color: inherit;\n --input-border-radius: 5px 0 0 5px;\n\n flex: 0 1 auto;\n width: auto;\n display: flex;\n align-items: center;\n flex-direction: column;\n position: relative;\n left: 1px;\n\n @include rtl-host() {\n --input-border-radius: 0 5px 5px 0;\n }\n\n :host(:not(.ready)) & {\n overflow: hidden;\n max-height: 1em;\n }\n\n .down-arrow {\n font-size: 0.65em;\n }\n }\n\n nano-input.search-input {\n --input-text-color: inherit;\n --input-bg-color: var(--bar-color-shade, rgb(40, 110, 133));\n --clear-btn-color: #{map.get($colors, black)};\n --input-border-radius: 0 5px 5px 0;\n --placeholder-color: white;\n\n width: 206px;\n display: flex;\n align-items: center;\n flex-direction: column;\n flex: 1;\n\n @include rtl-host() {\n --input-border-radius: 5px 0 0 5px;\n }\n\n :host(:not(.ready)) & {\n overflow: hidden;\n max-height: 1em;\n }\n\n &.has-value {\n --input-bg-color: #{map.get($colors, white)};\n --input-text-color: #{map.get($colors, black)};\n\n .search-icon {\n color: #{map.get($colors, black)};\n }\n }\n\n .search-icon {\n background: none;\n color: white;\n padding: 0 8px;\n display: none;\n\n &--show {\n display: flex;\n }\n\n &--loader {\n animation: spin 1s linear infinite;\n\n @keyframes spin {\n 100% {\n transform: rotate(360deg);\n }\n }\n }\n\n nano-icon {\n height: 1.4em;\n }\n }\n }\n}\n\n.main-bar {\n width: 100%;\n\n @include padding(var(--padding), var(--padding), var(--padding), 0);\n\n display: flex;\n align-items: center;\n justify-content: space-between;\n overflow-x: hidden;\n\n &:focus {\n outline: none;\n }\n\n :host(.ready) & {\n overflow-x: visible;\n }\n\n > *,\n ::slotted(*) {\n transition: opacity 0.2s ease;\n\n :host(:not(.ready)) & {\n opacity: 0 !important;\n }\n\n :host(.ready) & {\n opacity: 1;\n }\n\n :host(.resizing) & {\n opacity: 0 !important;\n }\n }\n\n > * {\n flex: 0 0 auto;\n\n ::slotted(nano-nav-item[slot='icon']) {\n @include margin(null, null, null, 11px);\n }\n\n ::slotted(nano-nav-item),\n nano-nav-item {\n --color-hover: #{map.get($colors, lightgrey)};\n --secondary-bg-color: var(--menu-dropdown-bg);\n --secondary-color: var(--menu-dropdown-color);\n --bg-color-open: var(--bar-background);\n\n text-decoration: none !important;\n }\n }\n\n .icon-btn {\n @include margin(0, null, 0, 6px);\n\n :host(.threshold-2) & {\n @include margin(0, null, 0, 11px);\n }\n }\n\n .menu-btn.icon-btn {\n margin: 0 !important;\n\n @include ltr-host() {\n border-right: 1.5px solid var(--bar-color-shade);\n }\n\n @include rtl-host() {\n border-left: 1.5px solid var(--bar-color-shade);\n }\n }\n\n .user-links {\n position: relative;\n\n .icon-btn {\n @include padding(null, 0, null, null);\n\n font-size: 0.93em;\n font-weight: 500;\n\n nano-icon {\n @include margin(null, null, null, 5px);\n\n width: 16px;\n height: 16px;\n transform-origin: center;\n transition: transform 0.2s ease, color 0.2s ease;\n }\n\n &.open {\n nano-icon {\n transform: rotate(180deg);\n color: map.get($colors, blue);\n }\n }\n }\n\n &-panel {\n display: none;\n position: absolute;\n border-radius: 4px 0 4px 4px;\n box-shadow: 0 1px 5px 0 rgba(0, 0, 0, 0.4);\n background-color: #568c9d;\n opacity: 0;\n transform: translate3d(0, 24px, 0);\n transition: transform 0.2s ease, opacity 0.2s ease;\n right: 0;\n font-size: 0.85em;\n min-width: 250px;\n z-index: 1;\n\n @include rtl-host() {\n right: auto;\n left: 0;\n }\n\n &:focus {\n outline: none;\n }\n\n &.show {\n opacity: 1;\n transform: translate3d(0, 4px, 0);\n }\n\n &-content {\n padding: 0 18px;\n display: flex;\n flex-direction: column;\n\n a {\n padding: 11px 0;\n border-bottom: #669dac 1px solid;\n\n &:hover,\n &:focus {\n color: map.get($colors, darkgrey);\n }\n\n &:last-child {\n border-bottom: none;\n }\n }\n }\n\n &-foot {\n background-color: #aac5cd;\n border-radius: 0 0 4px 4px;\n padding: var(--padding);\n color: #455556;\n display: flex;\n align-items: center;\n font-weight: 500;\n justify-content: space-between;\n\n a:hover {\n text-decoration: underline;\n }\n }\n }\n }\n\n .logo {\n height: 34px;\n width: auto;\n min-width: 196px;\n\n :host(:not(.threshold-1)) & {\n height: 30px;\n }\n }\n\n .logo-link {\n @include margin(null, auto, null, 0);\n @include padding(null, 11px, null, 11px);\n\n display: flex;\n align-items: center;\n border: none;\n }\n\n .nav-links {\n font-size: 0.75rem;\n flex: 1 0 auto;\n display: flex;\n justify-content: space-around;\n\n ul {\n display: flex;\n justify-content: space-around;\n }\n\n ::slotted(nano-nav-item),\n nano-nav-item {\n --padding-top: 7px;\n --padding-bottom: 7px;\n --padding-end: 2px;\n --padding-start: 2px;\n --margin: 0 8px;\n }\n\n &--main {\n justify-content: flex-start;\n letter-spacing: 0.33px;\n font-weight: 600;\n font-stretch: expanded;\n font-size: 0.8125rem;\n\n ::slotted(nano-nav-item) {\n --color: #fff;\n --padding-end: 3px;\n --padding-start: 0;\n }\n }\n\n &--sub {\n @include margin(null, null, null, 6px);\n\n --color: #e2e2e2;\n\n justify-content: flex-end;\n }\n }\n\n .login-btn {\n display: inline-block;\n border-radius: 4px;\n background-color: #17bb75;\n color: #fff;\n padding: 3px 10px;\n position: relative;\n left: auto;\n bottom: auto;\n\n @include margin(null, 0, null, 11px);\n }\n\n .measure-ele {\n min-width: 1px;\n display: block;\n margin: 0;\n padding: 0;\n }\n}\n\n.search-bar {\n height: 0;\n overflow: hidden;\n transition: 0.2s ease height;\n padding: 0 var(--padding);\n outline: none;\n max-width: 45em;\n margin-left: auto;\n\n .search-widget {\n @include margin(0, 0, 0, 0);\n\n overflow: inherit;\n max-width: none;\n max-height: none;\n padding: 0 0 var(--padding);\n }\n\n .search-inputs {\n padding: 0 0;\n margin: 0 0;\n }\n\n .search-autocomplete {\n top: calc(100% - (var(--padding) + 1px));\n }\n}\n\n.site-content {\n display: flex;\n transition: min-height 0.2s ease;\n min-height: calc(100% - 61px);\n position: relative;\n z-index: auto;\n align-items: stretch;\n}\n\n.mask {\n opacity: 0;\n background: rgba(0, 0, 0, 0.3);\n position: fixed;\n left: 0;\n right: 0;\n top: 0;\n height: 100vh;\n z-index: -1;\n transition:\n transform 0.2s ease,\n opacity 0.2s ease,\n visibility 0.01s ease 0.2s,\n z-index 0.01s ease 0.2s;\n visibility: hidden;\n\n &.open {\n opacity: 1;\n transition:\n z-index 0.01s ease,\n visibility 0.01s ease,\n transform 0.2s ease 0.01s,\n opacity 0.2s ease 0.01s;\n z-index: 3;\n visibility: visible;\n }\n}\n","import {\n Component,\n h,\n Host,\n Element,\n State,\n Watch,\n Event,\n EventEmitter,\n Prop,\n Listen,\n Build,\n getAssetPath,\n readTask,\n writeTask,\n Method,\n VNode,\n ComponentInterface,\n} from '@stencil/core';\nimport algoliasearch, { SearchClient as AlgoliaClient } from 'algoliasearch';\nimport { debounce, closestElement, displayTransition } from '../../utils';\nimport { clientFetch } from '../../utils/fetch';\nimport {\n InputChangeEventDetail,\n SelectChangeEventDetail,\n AlgoliaResults,\n SearchIndex,\n MyAccountLink,\n AloliaSearchResultDetail,\n AlgoliaMultiResult,\n MyAccountUser,\n NavItemEventDetail,\n AlgoliaResultHit,\n AlgoliaNetworkError,\n AlgoliaMultiResults,\n} from '../../interface';\nimport { ComponentStore } from '../../utils/store/component-store';\n\ninterface MyAccountData {\n user: MyAccountUser;\n cart: {\n count: number;\n url: string;\n };\n notifications: { count: number };\n hs: { lists?: Array<number> };\n registration: { next_url: string | null };\n links: null | MyAccountLink[];\n urls: {\n forgot_password: string | null;\n logout: string | null;\n login: string | null;\n messages: string | null;\n cart: string | null;\n };\n domains: [\n {\n origin: string;\n domain: string;\n }\n ];\n search: {\n app_id: string;\n api_key: string;\n indeces: [\n {\n index: string;\n name: string;\n domain: string;\n all_group?: boolean;\n filters?: [string];\n }\n ];\n };\n}\n\n// the 'breakpoints' that different segments of content go into or out-of the burger / overflow menu\nconst THRESHOLDBREAKS = {\n search: 0,\n about: 1,\n main: 2,\n login: 3,\n icon: 4,\n};\n\n/**\n * Nanopore digital global navigation and search bar.\n * Incorporates MyAccount / SSO states (messages / cart / user name etc).\n * Incorporates Algolia search.\n * GlobalNav is designed to be at the root of the `<body>`.\n * There should only be one <nano-global-nav> in the DOM.\n * The following demo uses static data.\n * @slot main - main nav items. Should be used with nano-nav-item's\n * @slot icon - nano-nav-item's displayed alongside icon links that come from MyAccount\n * @slot loggedin - nano-nav-item's to display when users are signed in, alongside links from from MyAccount (within the overflow menu panel).\n * @slot about - nano-nav-item's to display with about links that come from MyAccount\n * @slot site - nano-nav-item's to display with site links that come from MyAccount\n * @slot overflow - items to always display in the overflow menu\n * @slot search - when not using myaccount search OR show-search=\"false\" you can utilise the search slot\n * @slot promotion - a free area for any promotional content, displayed within the overflow menu panel\n * @slot logo - when show-logo=\"false\" you can utilise the logo slot\n */\n@Component({\n tag: 'nano-global-nav',\n styleUrl: 'global-nav.scss',\n shadow: true,\n assetsDirs: ['assets'],\n})\nexport class GlobalNav implements ComponentInterface {\n // position and dimension state\n private io: IntersectionObserver;\n private debounceResize: () => {};\n private debounceSetResizingState: () => {};\n private currSize: number = 0;\n private thresholdsGoingUp: boolean = false;\n private THRESHOLDLIMIT = Object.keys(THRESHOLDBREAKS).length;\n\n // menu\n private menuDiv: HTMLElement;\n private menuBtn: HTMLButtonElement;\n private menuWrapDiv: HTMLDivElement;\n private menuContentDiv: HTMLDivElement;\n\n // search\n private searchBarEl: HTMLDivElement;\n private searchInput: HTMLNanoInputElement;\n private algoliaClient: AlgoliaClient;\n private currentIndex: SearchIndex;\n private autocompleteResults: AlgoliaResults | null;\n private autocompleteEles: Array<HTMLAnchorElement | HTMLButtonElement> = [];\n private currAIndex: number = -1;\n private algoliaSearchResults: AlgoliaMultiResults | null;\n private scopeSearch: AlgoliaMultiResults | null;\n\n // general\n private mainBarDiv: HTMLElement;\n private barsDiv: HTMLDivElement;\n private siteContent: HTMLDivElement;\n private userLinkPanel: HTMLDivElement;\n private isLoggedIn: boolean = false;\n\n private myAccData: MyAccountData = null;\n\n // myaccount links\n private aboutNavItms: MyAccountLink[] = [];\n private siteNavItms: MyAccountLink[] = [];\n private loggedInNavItms: MyAccountLink[] = [];\n\n // has slot tests\n private mo?: MutationObserver;\n @State() hasLoggedinSlot: boolean = false;\n @State() hasSiteSlot: boolean = false;\n @State() hasPromotionSlot: boolean = false;\n\n // slot item number tests\n @State() aboutSlotLen: number = 0;\n @State() iconSlotLen: number = 0;\n @State() mainSlotLen: number = 0;\n @State() overflowSlotLen: number = 0;\n @State() searchSlotLen: number = 0;\n\n @State() internalSearchIndeces: Array<SearchIndex> = [];\n @State() thresholdReady: boolean = false;\n @State() remoteDataReady: boolean = false;\n @State() ready: boolean = false;\n @State() isResizing: boolean = false;\n @State() intersectRatio: number;\n @State() threshold: number = this.THRESHOLDLIMIT;\n @State() modalOpen: boolean = false;\n @State() modalIsOpen: boolean = false;\n @State() searchBarShown: boolean = false;\n @State() scrollingUp: boolean = true;\n @State() searchLoading: boolean = false;\n @State() showAutocomplete: boolean = false;\n @State() secondaryMenuOpen: boolean = false;\n @State() userMenuOpen: boolean = false;\n @State() menuFullScreen: boolean = false;\n @State() searchValInternal: string = '';\n\n @Element() private el: HTMLNanoGlobalNavElement;\n\n /**\n * Connect to local, dev, test or prod MyAccount\n * environments to retrieve global nav / sso data\n */\n @Prop() env: 'local' | 'dev' | 'test' | 'prod' = 'prod';\n\n /**\n * Where to take user after SSO login\n */\n @Prop() ssoRedirect: string = encodeURIComponent(window.location.href);\n\n /**\n * Whether to attempt to get global nav / sso data from MyAccount\n */\n @Prop() getMyAccountData: boolean = true;\n\n /**\n * Active MyAccount link sections. By default all will show.\n */\n @Prop() activeMyAccountSections: (\n | 'about'\n | 'loggedin'\n | 'sites'\n | 'icons'\n )[] = null;\n\n /**\n * Whether to show search functionality\n */\n @Prop() showSearch: boolean = true;\n\n /**\n * Whether to show Nanopore logo\n */\n @Prop() showLogo: boolean = true;\n\n /**\n * The link to put on the logo\n */\n @Prop() logoUrl: string = location.protocol + '//' + location.host;\n\n /**\n * An array of Algolia search indexes (and optional display names). Will be automatically populated from MyAccount\n */\n @Prop() searchIndeces: Array<SearchIndex> = [];\n\n /**\n * Logged in user details automatically populated from MyAccount\n */\n @Prop({ mutable: true }) myAccountUser: {\n id: string | null;\n name: string | null;\n first_name: string | null;\n last_name: string | null;\n email: string | null;\n company: string | null;\n lifecycle_stage: string | null;\n indirect_customer: boolean;\n } = null;\n\n /**\n * An Algolia App ID key. Will be automatically populated from MyAccount\n */\n @Prop({ mutable: true }) searchAppId: string;\n\n /**\n * An Algolia API Key. Will be automatically populated from MyAccount\n */\n @Prop({ mutable: true }) searchApiKey: string;\n\n /**\n * A search value to passed to Algolia to programatically get or to preload search results\n */\n @Prop({ mutable: true }) searchValue: string = '';\n\n /**\n * Algolia search index to programatically set or to set an initial index\n */\n @Prop({ mutable: true }) searchIndex: string = 'all_prod_en';\n\n /**\n * MyAccount store cart count.\n */\n @Prop({ mutable: true }) cartCount: number = 0;\n\n /**\n * MyAccount undread message count.\n */\n @Prop({ mutable: true }) msgCount: number = 0;\n\n /**\n * Url to the Nanopore store cart. Will default to the url supplied by MyAccount\n */\n @Prop({ mutable: true }) cartUrl: string = null;\n\n /**\n * Url to the Nanopore message center. Will default to the url supplied by MyAccount\n */\n @Prop({ mutable: true }) msgUrl: string = null;\n\n /**\n * Emitted when the global nav is ready.\n */\n @Event() nanoIsReady!: EventEmitter<void>;\n\n /**\n * Emitted when search results are successfully returned from Algolia.\n */\n @Event() nanoSearchResult!: EventEmitter<AloliaSearchResultDetail>;\n\n /**\n * Emitted when algolia returns an error.\n */\n @Event() nanoSearchError!: EventEmitter<AlgoliaNetworkError>;\n\n /**\n * Emitted when search field is cleared.\n */\n @Event() nanoSearchReset!: EventEmitter<AloliaSearchResultDetail>;\n\n /**\n * Submit the search form (a search value must be present)\n */\n @Method()\n async submitSearch() {\n this.onSearchSubmit();\n this.showAutocomplete = false;\n return;\n }\n\n @Watch('searchIndex')\n currentSelectedIndex() {\n if (!this.internalSearchIndeces.length) {\n return;\n }\n\n let foundIndex = this.internalSearchIndeces.find(\n (index) => index.index === this.searchIndex\n );\n\n if (!foundIndex) {\n this.currentIndex = this.internalSearchIndeces[0];\n console.error('index not found');\n return;\n }\n\n this.currentIndex = foundIndex;\n return foundIndex;\n }\n\n @Watch('searchValInternal')\n changeInternalSearchVal() {\n if (this.searchValInternal !== this.searchValue)\n this.searchValue = this.searchValInternal;\n }\n\n @Watch('searchApiKey')\n @Watch('searchAppId')\n initAlgoliaClient() {\n if (!this.searchAppId || !this.searchApiKey) return;\n\n this.algoliaClient = algoliasearch(this.searchAppId, this.searchApiKey);\n this.addAlgoliaIndeces();\n }\n\n @Watch('searchIndeces')\n addIndeces() {\n this.internalSearchIndeces = [\n ...this.internalSearchIndeces,\n ...this.searchIndeces,\n ];\n }\n\n @Watch('internalSearchIndeces')\n addAlgoliaIndeces() {\n if (!this.algoliaClient || !this.internalSearchIndeces.length) return;\n\n this.internalSearchIndeces.forEach((searchIndex) => {\n searchIndex.alogliaIndex = this.algoliaClient.initIndex(\n searchIndex.index\n );\n });\n if (!this.searchIndex)\n this.searchIndex = this.internalSearchIndeces[0].index;\n }\n\n @Watch('threshold')\n thresholdChange(newThreshold, oldThreshold) {\n if (newThreshold > oldThreshold) {\n // we've resized to larger screen.\n this.thresholdsGoingUp = true;\n this.setResizingState(true);\n }\n }\n\n /**\n * Primary logic for resizing changes.\n * When content doesn't fit - we loop down through break points until it does\n */\n @Watch('intersectRatio')\n ratioChange() {\n if (this.intersectRatio < 1 && this.threshold > 0) {\n // content doesn't fit\n if (this.thresholdsGoingUp) this.setResizingState(true);\n this.threshold--;\n setTimeout(() => this.ratioChange(), 500);\n } else {\n this.thresholdReady = true;\n\n // content now fits so add / remove context classes\n // on nav-items depending on whether they're added to bar or burger.\n this.siteContent.style.minHeight = `calc(100% - ${\n this.barsDiv.clientHeight + 1\n }px)`;\n\n let menuItems: Array<Element>, barItems: Array<Element>;\n readTask(() => {\n menuItems = [\n ...Array.from(this.el.querySelectorAll('nano-nav-item[slot=\"site\"]')),\n ...Array.from(\n this.el.querySelectorAll('nano-nav-item[slot=\"overflow\"]')\n ),\n ];\n barItems = [];\n\n if (this.threshold < this.THRESHOLDLIMIT - THRESHOLDBREAKS.icon)\n menuItems.push(\n ...Array.from(\n this.el.querySelectorAll('nano-nav-item[slot=\"icon\"]')\n )\n );\n else\n barItems.push(\n ...Array.from(\n this.el.querySelectorAll('nano-nav-item[slot=\"icon\"]')\n )\n );\n\n if (this.threshold < this.THRESHOLDLIMIT - THRESHOLDBREAKS.login)\n menuItems.push(\n ...Array.from(\n this.el.querySelectorAll('nano-nav-item[slot=\"loggedin\"]')\n )\n );\n else\n barItems.push(\n ...Array.from(\n this.el.querySelectorAll('nano-nav-item[slot=\"loggedin\"]')\n )\n );\n\n if (this.threshold < this.THRESHOLDLIMIT - THRESHOLDBREAKS.main)\n menuItems.push(\n ...Array.from(\n this.el.querySelectorAll('nano-nav-item[slot=\"main\"]')\n )\n );\n else\n barItems.push(\n ...Array.from(\n this.el.querySelectorAll('nano-nav-item[slot=\"main\"]')\n )\n );\n\n if (this.threshold < this.THRESHOLDLIMIT - THRESHOLDBREAKS.about)\n menuItems.push(\n ...Array.from(\n this.el.querySelectorAll('nano-nav-item[slot=\"about\"]')\n )\n );\n else\n barItems.push(\n ...Array.from(\n this.el.querySelectorAll('nano-nav-item[slot=\"about\"]')\n )\n );\n });\n\n writeTask(() => {\n menuItems.forEach((item) => {\n item.classList.add('nano-global-nav-menu');\n item.classList.remove('nano-global-nav-bar');\n });\n barItems.forEach((item) => {\n item.classList.remove('nano-global-nav-menu');\n item.classList.add('nano-global-nav-bar');\n });\n });\n }\n }\n\n @Watch('thresholdReady')\n @Watch('remoteDataReady')\n assessReady() {\n if (this.thresholdReady && this.remoteDataReady) {\n this.ready = true;\n }\n }\n\n @Watch('remoteDataReady')\n remoteReady() {\n this.attachIO();\n }\n\n @Watch('ready')\n isReady() {\n this.nanoIsReady.emit();\n }\n\n /**\n * Add / remove events when autocomplete results show / hide.\n */\n @Watch('showAutocomplete')\n setupAutocompleteBlur() {\n this.searchInput.clientWidth; // force reflow\n if (this.showAutocomplete) {\n this.el.shadowRoot.addEventListener('click', this.onAutocompleteBlur);\n } else {\n this.el.shadowRoot.removeEventListener('click', this.onAutocompleteBlur);\n }\n }\n\n /**\n * As relevant slotted items change, reset resizing breakpoints\n */\n @Watch('aboutSlotLen')\n @Watch('iconSlotLen')\n @Watch('mainSlotLen')\n @Watch('overflowSlotLen')\n @Watch('searchSlotLen')\n slotChange() {\n this.threshold = this.THRESHOLDLIMIT;\n }\n\n // General classes for visuals\n\n private thresholdClasses() {\n let classes = [];\n let i = 0;\n for (i; i < this.threshold; i++) classes.push('threshold-' + (i + 1));\n return classes;\n }\n\n /**\n * provides 'isResizing' - we use this to fade content out on 'breakpoint' increase\n * (when the screen size increases). Otherwise the stepping through of\n * breakpoints to calculate if content currently fits shows on screen (looks ugly)\n */\n private setResizingState = (state: boolean = false) => {\n if (typeof this.debounceSetResizingState === 'undefined') {\n this.debounceSetResizingState = debounce(this.setResizingState, 600);\n }\n if (state) {\n this.isResizing = true;\n this.debounceSetResizingState();\n } else {\n this.isResizing = false;\n this.thresholdsGoingUp = false;\n }\n };\n\n // Global DOM Events\n\n private onWindowResize() {\n if (\n this.threshold < this.THRESHOLDLIMIT &&\n window.innerWidth > this.currSize\n ) {\n this.threshold = this.THRESHOLDLIMIT;\n }\n this.currSize = window.innerWidth;\n this.searchBarShown = false;\n }\n\n // Burger / Overflow Menu\n\n // listen to nav-item secondary open / close events primarily for resizing the menu\n @Listen('nanoOpen')\n secondaryOpen(ev: CustomEvent) {\n if (!(ev.detail as NavItemEventDetail).secondaryMenu) return;\n ev.stopPropagation();\n this.secondaryMenuOpen = true;\n this.menuContentDiv.style.minHeight =\n (ev.detail as NavItemEventDetail).secondaryMenu.scrollHeight + 'px';\n }\n\n @Listen('nanoClose')\n secondaryClose(ev: CustomEvent) {\n if (!(ev.detail as NavItemEventDetail).secondaryMenu) return;\n ev.stopPropagation();\n this.secondaryMenuOpen = false;\n this.menuContentDiv.style.minHeight = '';\n }\n\n private onMenuBtnKeyDown = (ev: KeyboardEvent) => {\n switch (ev.key) {\n case 'Enter':\n case ' ':\n this.modalOpen ? this.menuClose(ev, true) : this.menuOpen();\n break;\n }\n };\n\n private onMenuBtnClick = (ev: MouseEvent) => {\n this.menuClose(ev, true);\n };\n\n private menuOpen = (e?: MouseEvent) => {\n if (e) e.preventDefault();\n\n this.menuDiv.style.display = 'block';\n // need to open menu in stages\n // wait for re-flow after changing display\n // wait for repaint after animate, then focus\n\n this.menuDiv.clientWidth; // force reflow\n\n this.modalOpen = true;\n this.modalIsOpen = true;\n this.menuWrapDiv.addEventListener('focusout', this.menuClose);\n\n this.menuDiv.clientWidth; // force reflow\n\n this.menuWrapDiv.focus({ preventScroll: true });\n if (\n this.threshold < 2 ||\n this.menuWrapDiv.scrollHeight > window.innerHeight\n ) {\n document.body.style.overflow = 'hidden';\n this.menuFullScreen = true;\n } else document.body.style.overflowX = 'hidden';\n };\n\n private onMenuHidden = () => {\n this.menuDiv.removeEventListener('transitionend', this.onMenuHidden);\n this.menuWrapDiv.removeEventListener('focusout', this.menuClose);\n\n document.body.style.overflow = '';\n this.menuDiv.style.display = 'none';\n this.modalIsOpen = false;\n this.menuFullScreen = false;\n\n setTimeout(() => {\n if (document.activeElement === document.body && this.menuBtn)\n this.mainBarDiv.focus({ preventScroll: true });\n }, 50);\n };\n\n private menuClose = (\n ev?: FocusEvent | MouseEvent | KeyboardEvent | TouchEvent,\n force: boolean = false\n ) => {\n if (!force) {\n let e = ev as FocusEvent;\n if (\n e &&\n e.relatedTarget &&\n closestElement('#global-nav-menu', e.relatedTarget as HTMLElement)\n )\n return;\n if (\n e &&\n e.relatedTarget &&\n (e.relatedTarget as HTMLElement).closest('#global-nav-menu')\n )\n return;\n if (\n e &&\n e.relatedTarget &&\n (e.relatedTarget as HTMLElement).closest('[slot=\"promotion\"]')\n )\n return;\n if (this.secondaryMenuOpen) return;\n }\n\n this.modalOpen = false;\n this.menuDiv.addEventListener('transitionend', this.onMenuHidden);\n };\n\n private subMenuClose = (ev?: MouseEvent) => {\n ev.preventDefault();\n (ev.target as HTMLNanoNavItemElement).closest('nano-nav-item').open = false;\n };\n\n // User profile menu\n\n private onUserBtnClick = (ev: MouseEvent) => {\n ev.preventDefault();\n this.userMenuOpen = !this.userMenuOpen;\n };\n\n private onUserBtnKeyDown = (ev: KeyboardEvent) => {\n switch (ev.key) {\n case 'Enter':\n case ' ':\n this.userMenuOpen = !this.userMenuOpen;\n break;\n }\n };\n\n private onUserMenuBlur = (ev: FocusEvent) => {\n if (!ev.relatedTarget) {\n this.userMenuOpen = false;\n return;\n }\n if (!!(ev.relatedTarget as HTMLElement).closest('.user-links-panel'))\n return false;\n this.userMenuOpen = false;\n };\n\n @Watch('userMenuOpen')\n async handleUserMenu() {\n await displayTransition(this.userLinkPanel, 'show', this.userMenuOpen);\n if (this.userMenuOpen) {\n this.userLinkPanel.focus();\n this.userLinkPanel.addEventListener('focusout', this.onUserMenuBlur);\n } else {\n this.userLinkPanel.removeEventListener('focusout', this.onUserMenuBlur);\n this.el.focus();\n }\n }\n\n // Search bar (smaller screens / mobile)\n\n private onSearchBtnClick = (ev: MouseEvent) => {\n ev.preventDefault();\n if (!this.searchBarShown) this.searchbarShow();\n else this.searchbarHide();\n };\n\n private onSearchBtnKeyDown = (ev: KeyboardEvent) => {\n switch (ev.key) {\n case 'Enter':\n case ' ':\n this.searchBarShown ? this.searchbarHide() : this.searchbarShow();\n break;\n }\n };\n\n private searchbarShow() {\n this.searchBarShown = true;\n this.searchBarEl.addEventListener('transitionend', this.onSearchBarShown);\n this.searchBarEl.style.display = 'block';\n\n setTimeout(() => {\n this.searchBarEl.style.height =\n this.searchBarEl.querySelector('.search-widget').scrollHeight + 'px';\n }, 50);\n }\n\n private onSearchBarShown = () => {\n this.searchBarEl.removeEventListener(\n 'transitionend',\n this.onSearchBarShown\n );\n if (this.searchInput) this.searchInput.setFocus();\n this.searchBarEl.style.overflow = 'visible';\n };\n\n private searchbarHide = (ev?: FocusEvent) => {\n if (\n ev &&\n ev.relatedTarget &&\n (ev.relatedTarget as HTMLElement).closest('#global-nav-search-bar')\n )\n return;\n this.showAutocomplete = false;\n if (this.searchValInternal.length && ev) return;\n\n this.searchBarEl.addEventListener('transitionend', this.onSearchBarHidden);\n this.searchBarEl.style.overflow = 'hidden';\n this.searchBarEl.style.height = '0px';\n };\n\n private onSearchBarHidden = () => {\n this.searchBarEl.removeEventListener(\n 'transitionend',\n this.onSearchBarHidden\n );\n this.searchBarEl.style.display = 'none';\n this.searchBarShown = false;\n };\n\n // Algolia search\n\n private autocompleteSnippet(hit: AlgoliaResultHit) {\n let lookFor = ['title']; // , 'body'\n if (hit._snippetResult) {\n let found = lookFor.find(\n (prop) =>\n hit._snippetResult[prop] &&\n hit._snippetResult[prop].matchLevel !== 'none'\n );\n\n if (found) {\n if (found !== 'title')\n return (\n (hit.title.length > 15\n ? hit.title.substring(0, 15) + ' ...'\n : hit.title) +\n ' ' +\n hit._snippetResult[found].value\n );\n else return hit._snippetResult['title'].value;\n }\n }\n return hit.title;\n }\n\n private onSearchInput = (ev: CustomEvent<InputEvent>) => {\n this.searchValInternal = this.searchInput.value;\n\n if (!this.isSearchValSet()) {\n this.searchLoading = false;\n return;\n }\n\n if (ev.detail.type === 'input') {\n this.showAutocomplete = false;\n this.searchLoading = true;\n }\n };\n\n private onSearchChange = async (ev?: CustomEvent<InputChangeEventDetail>) => {\n this.searchValInternal = this.searchValue = ev\n ? ev.detail.value\n : this.searchValInternal;\n this.showAutocomplete = false;\n this.autocompleteResults = null;\n\n if (!this.isSearchValSet()) {\n if (!this.searchValInternal.length) {\n this.nanoSearchReset.emit();\n }\n this.searchLoading = false;\n return;\n }\n if (!this.currentIndex) this.currentSelectedIndex();\n\n try {\n this.autocompleteResults = this.processSearchResults(\n (await this.currentIndex.alogliaIndex.search(this.searchValInternal, {\n attributesToSnippet: ['body:5', 'title:8'],\n hitsPerPage: 5,\n filters: 'created > ' + Math.floor((Date.now() - 63115200000) / 1000), // only get last 2 years\n })) as any\n ) as AlgoliaResults;\n } catch (e) {\n console.error(e);\n }\n\n this.scopeSearch = null;\n this.scopeSearch = await this.onSearchSubmit(null, false);\n\n this.searchLoading = false;\n this.showAutocompleteResults();\n };\n\n private onSearchSubmit = async (ev?, emit: boolean = true) => {\n if (ev) ev.preventDefault();\n if (!this.isSearchValSet()) return;\n this.searchLoading = true;\n this.algoliaSearchResults = null;\n\n if (!this.currentIndex) this.currentSelectedIndex();\n\n let queries = this.internalSearchIndeces.map((index) => {\n return {\n indexName: index.index,\n query: this.searchValInternal,\n facets: index.filters,\n hitsPerPage: 10,\n filters: 'created > ' + Math.floor((Date.now() - 63115200000) / 1000), // only get last 2 years\n };\n });\n\n try {\n this.algoliaSearchResults = this.processSearchResults(\n (await this.algoliaClient.multipleQueries(queries)) as any\n ) as AlgoliaMultiResults;\n } catch (e) {\n this.nanoSearchError.emit(e as AlgoliaNetworkError);\n }\n this.searchLoading = false;\n if (!this.algoliaSearchResults) return;\n\n this.algoliaSearchResults.results.map((result, i) => {\n result.indexName = this.internalSearchIndeces[i].name;\n result.selected =\n this.currentIndex.name === this.internalSearchIndeces[i].name;\n result.domain = this.currentIndex.domain || null;\n result.domains = this.myAccData.domains || null;\n result.allGroup = !!this.internalSearchIndeces[i].allGroup;\n result.filters = this.internalSearchIndeces[i].filters;\n });\n\n if (emit) {\n this.nanoSearchResult.emit({\n results: this.algoliaSearchResults.results,\n client: { apiKey: this.searchApiKey, appId: this.searchAppId },\n });\n this.showAutocomplete = false;\n }\n return this.algoliaSearchResults;\n };\n\n private onSearchIndexChange = async (\n index: CustomEvent<SelectChangeEventDetail> | string\n ) => {\n let ev = index as CustomEvent<SelectChangeEventDetail>;\n let indexStr = index as string;\n\n if (!this.currentIndex) this.currentSelectedIndex();\n\n if (ev.detail && ev.detail.value.length)\n indexStr = ev.detail.value as string;\n if (!indexStr || !indexStr.length) return;\n if (this.currentIndex.index === indexStr) return;\n\n let selectedIndex = this.internalSearchIndeces.find(\n (index) => index.index === indexStr\n );\n if (!selectedIndex || !selectedIndex.alogliaIndex) return;\n\n this.searchIndex = selectedIndex.index;\n if (this.isSearchValSet()) await this.onSearchChange();\n };\n\n private isSearchValSet() {\n if (this.searchValInternal.length < 3) return false;\n return true;\n }\n\n private switchIndexSubmit = async (index: string) => {\n if (this.isSearchValSet()) {\n await this.onSearchIndexChange(index);\n this.onSearchSubmit();\n } else this.onSearchIndexChange(index);\n };\n\n // Autocomplete\n\n @Watch('showAutocomplete')\n resetHitFocus() {\n this.currAIndex = -1;\n }\n\n private onAutocompleteBlur = (ev: MouseEvent) => {\n if (!this.showAutocomplete || !this.autocompleteResults) return;\n if (ev && ev.target && (ev.target as HTMLElement).closest('.search-widget'))\n return;\n this.showAutocomplete = false;\n };\n\n private showAutocompleteResults = () => {\n if (!this.autocompleteResults || !this.autocompleteResults.hits) return;\n this.showAutocomplete = true;\n };\n\n private setActiveElement(\n autocompleteEle: HTMLAnchorElement | HTMLButtonElement\n ) {\n this.autocompleteEles.map((ele) =>\n ele.setAttribute('aria-selected', 'false')\n );\n autocompleteEle.focus({ preventScroll: true });\n autocompleteEle.setAttribute('aria-selected', 'true');\n }\n\n private onAutocompleteInteract = (ev: KeyboardEvent) => {\n // list open, navigate items with arrows\n if (!this.showAutocomplete || !this.autocompleteResults) return;\n let testIndex = this.currAIndex;\n\n switch (ev.key) {\n case 'Tab':\n setTimeout(() => {\n if (\n !this.el.shadowRoot.activeElement ||\n !this.el.shadowRoot.activeElement.closest('.search-widget')\n ) {\n this.showAutocomplete = false;\n return;\n } else {\n let found = this.autocompleteEles.find((ele, i) => {\n if (ele === this.el.shadowRoot.activeElement) {\n this.currAIndex = i;\n return true;\n }\n });\n if (found) this.setActiveElement(found);\n else this.currAIndex = -1;\n }\n });\n break;\n case 'ArrowDown':\n case 'ArrowUp':\n if (ev.key === 'ArrowDown') testIndex++;\n else if (ev.key === 'ArrowUp') testIndex--;\n\n let found = this.autocompleteEles[testIndex];\n if (\n found ||\n testIndex < 0 ||\n testIndex > this.autocompleteEles.length - 1\n )\n ev.preventDefault();\n this.searchInput.clientWidth; // force reflow\n\n if (found) {\n this.setActiveElement(found);\n this.currAIndex = testIndex;\n } else if (testIndex < 0) {\n this.searchInput.setFocus();\n this.currAIndex = -1;\n }\n break;\n case 'Enter':\n case ' ':\n if (this.autocompleteEles[this.currAIndex]) {\n this.autocompleteEles[this.currAIndex].click();\n }\n break;\n }\n };\n\n // Various.\n\n /**\n * Assesses what content is present in which slots\n */\n private assessSlottedContent() {\n readTask(() => {\n this.hasSiteSlot = !!this.el.querySelectorAll('[slot=\"site\"]').length;\n this.hasLoggedinSlot =\n !!this.el.querySelectorAll('[slot=\"loggedin\"]').length;\n this.hasPromotionSlot =\n !!this.el.querySelectorAll('[slot=\"promotion\"]').length;\n\n this.aboutSlotLen = this.el.querySelectorAll('[slot=\"about\"]').length;\n this.iconSlotLen = this.el.querySelectorAll('[slot=\"icon\"]').length;\n this.mainSlotLen = this.el.querySelectorAll('[slot=\"main\"]').length;\n this.overflowSlotLen =\n this.el.querySelectorAll('[slot=\"overflow\"]').length;\n this.searchSlotLen = this.el.querySelectorAll('[slot=\"search\"]').length;\n });\n }\n\n /**\n * Attach the IntersectionObserver - from which all threshold / breakpoint logic hinges\n */\n private attachIO() {\n if (this.io) return;\n let root = this.el.shadowRoot.querySelector('.global-nav .main-bar');\n if (\n Build.isBrowser &&\n typeof window !== 'undefined' &&\n (window as any).IntersectionObserver &&\n !!root\n ) {\n const io = (this.io = new (window as any).IntersectionObserver(\n (data: IntersectionObserverEntry[]) => {\n this.intersectRatio = data.slice(-1)[0].intersectionRatio;\n },\n { root, threshold: 1 }\n ));\n io.observe(root.querySelector('.measure-ele'));\n }\n }\n\n // Stencil Lifecycle / Rendering\n\n componentDidLoad() {\n if (Build.isBrowser) {\n this.debounceResize = debounce(this.onWindowResize.bind(this), 300);\n\n window.addEventListener('resize', this.debounceResize);\n this.currSize = window.innerWidth;\n }\n\n this.initAlgoliaClient();\n this.addAlgoliaIndeces();\n if (this.remoteDataReady) this.attachIO();\n }\n\n componentWillLoad() {\n ComponentStore.init(\n this,\n ['searchIndex', 'searchValue'],\n 'url-hash',\n 'gns'\n );\n\n if (\n Build.isBrowser &&\n typeof window !== 'undefined' &&\n (window as any).MutationObserver\n ) {\n const mo = (this.mo = new MutationObserver(() => {\n this.assessSlottedContent();\n }));\n mo.observe(this.el, { childList: true, subtree: false });\n }\n this.assessSlottedContent();\n }\n\n disconnectedCallback() {\n if (this.io) {\n this.io.disconnect();\n this.io = undefined;\n }\n if (this.mo) {\n this.mo.disconnect();\n this.mo = undefined;\n }\n if (Build.isBrowser)\n window.removeEventListener('resize', this.debounceResize);\n }\n\n async connectedCallback() {\n this.getMyAccData();\n }\n\n // Render output\n\n private autocompleteList(): VNode {\n let content;\n if (this.showAutocomplete && this.scrollingUp) {\n let currentScopeHits = 0;\n let scopeChangeSuggestions = 0;\n\n let scopeSuggestReducer = (total: number, result: AlgoliaMultiResult) => {\n return result.index !== this.currentIndex.index\n ? total + result.hits.length\n : total;\n };\n let currentSuggestReducer = (\n total: number,\n result: AlgoliaMultiResult\n ) => {\n return result.index === this.currentIndex.index\n ? total + result.hits.length\n : total;\n };\n\n if (this.scopeSearch) {\n scopeChangeSuggestions = this.scopeSearch.results.reduce(\n scopeSuggestReducer,\n 0\n );\n currentScopeHits = this.scopeSearch.results.reduce(\n currentSuggestReducer,\n 0\n );\n }\n\n if (\n (this.autocompleteResults && this.autocompleteResults.hits.length) ||\n (scopeChangeSuggestions && !currentScopeHits)\n ) {\n let scopeSuggestions = 0;\n\n content = (\n <div>\n {!currentScopeHits && (\n <div class=\"search-autocomplete-hit search-autocomplete-hit--no-result\">\n No results matching '{this.searchValInternal}' were found in{' '}\n <strong>{this.currentIndex.name}</strong>. Try another phrase.\n </div>\n )}\n {this.autocompleteResults && [\n this.autocompleteResults.hits.map((hit, i) => {\n return (\n <a\n role=\"option\"\n ref={(a) => this.autocompleteEles.push(a)}\n tabindex=\"-1\"\n id={'autocomplete-hit-' + i}\n href={hit.url}\n class=\"search-autocomplete-hit\"\n innerHTML={this.autocompleteSnippet(hit)}\n ></a>\n );\n }),\n ]}\n {(!currentScopeHits || this.currentIndex.allGroup) &&\n this.scopeSearch &&\n this.scopeSearch.results && [\n this.scopeSearch.results.map((result, i) => {\n if (\n !result.hits.length ||\n result.index === this.currentIndex.index ||\n scopeSuggestions > 1\n )\n return;\n scopeSuggestions++;\n return (\n <button\n role=\"option\"\n ref={(button) => this.autocompleteEles.push(button)}\n tabindex=\"-1\"\n id={'autocomplete-scope-' + i}\n class=\"search-autocomplete-hit\"\n onClick={() => this.switchIndexSubmit(result.index)}\n onMouseDown={() => this.switchIndexSubmit(result.index)}\n >\n \"{this.searchValInternal}\"{' '}\n <div class=\"search-autocomplete-hit-scope\">\n in {result.indexName}\n </div>\n </button>\n );\n }),\n ]}\n {!!currentScopeHits && (\n <div class=\"search-autocomplete-foot\">\n <button\n role=\"option\"\n class=\"search-autocomplete-submit\"\n ref={(button) => this.autocompleteEles.push(button)}\n id={'autocomplete-foot'}\n onClick={this.onSearchSubmit}\n onMouseDown={this.onSearchSubmit}\n >\n View all results\n </button>\n </div>\n )}\n </div>\n );\n } else if (!currentScopeHits) {\n content = (\n <div class=\"search-autocomplete-hit search-autocomplete-hit--no-result\">\n No results matching '{this.searchValInternal}' were found. Try\n another phrase.\n </div>\n );\n }\n }\n\n return (\n <div\n class=\"search-autocomplete\"\n role=\"listbox\"\n id=\"autocomplete-results\"\n aria-expanded={this.showAutocomplete ? 'true' : 'false'}\n hidden={!this.showAutocomplete}\n onKeyDown={this.onAutocompleteInteract}\n >\n {content}\n </div>\n );\n }\n\n private searchWidget(): VNode[] {\n return [\n <form\n class=\"search-inputs\"\n onSubmit={this.onSearchSubmit}\n id=\"global-nav-search\"\n >\n <nano-select\n class=\"search-input\"\n label=\"Which area of content would you like to search?\"\n hideLabel={true}\n showInlineError={false}\n value={this.searchIndex}\n onNanoChange={this.onSearchIndexChange}\n mask={true}\n >\n {this.internalSearchIndeces.map((index) => {\n return (\n <nano-option\n selected={index.index === this.searchIndex}\n value={index.index}\n >\n {index.name || index.index}\n </nano-option>\n );\n })}\n <nano-icon\n name=\"solid/caret-down\"\n class=\"down-arrow\"\n slot=\"down-arrow\"\n ></nano-icon>\n </nano-select>\n <nano-input\n class=\"search-input\"\n label=\"What would you like to search for?\"\n aria-label=\"What would you like to search for?\"\n hideLabel={true}\n showInlineError={false}\n clear-input\n placeholder=\"Search...\"\n type=\"text\"\n ref={(input) => (this.searchInput = input)}\n onNanoChange={this.onSearchChange}\n onNanoInput={this.onSearchInput}\n onKeyDown={this.onAutocompleteInteract}\n debounce={500}\n aria-autocomplete=\"list\"\n aria-activedescendant={\n this.autocompleteEles[this.currAIndex]\n ? this.autocompleteEles[this.currAIndex].id\n : false\n }\n aria-controls=\"autocomplete-results\"\n onNanoFocus={this.showAutocompleteResults}\n value={this.searchValue}\n role=\"textbox\"\n >\n <button\n class={{\n 'search-icon': true,\n 'search-icon--search': true,\n 'search-icon--show': !this.searchValInternal.length,\n }}\n slot=\"end\"\n onMouseDown={(e) => {\n this.searchValInternal = this.searchInput.value;\n this.onSearchSubmit(e, true);\n }}\n >\n <nano-icon name=\"light/search\"></nano-icon>\n </button>\n <span\n class={{\n 'search-icon': true,\n 'search-icon--loader': true,\n 'search-icon--show': this.searchLoading,\n }}\n slot=\"end\"\n >\n <nano-icon name=\"light/spinner-third\"></nano-icon>\n </span>\n </nano-input>\n <input type=\"submit\" />\n </form>,\n ];\n }\n\n render() {\n this.autocompleteEles = [];\n let isRtl = (this.el.ownerDocument as Document).dir === 'rtl';\n\n let searchWidget = this.searchWidget();\n searchWidget.push(this.autocompleteList());\n\n return (\n <Host\n class={{\n [this.thresholdClasses().join(' ')]: true,\n ready: this.ready,\n 'search-bar-shown': this.searchBarShown && this.scrollingUp,\n 'search-auto-complete-shown':\n this.showAutocomplete && this.scrollingUp,\n 'modal-open': this.modalIsOpen,\n resizing: this.isResizing,\n }}\n dir={isRtl ? 'rtl' : null}\n >\n <div\n class={{\n 'global-nav': true,\n 'scrolling-down': !this.scrollingUp,\n }}\n >\n {/* START BURGER / OVERFLOW MENU */}\n <nav\n id=\"global-nav-menu\"\n class={{\n 'gn-menu': true,\n open: this.modalOpen,\n 'has-promotion': this.hasPromotionSlot,\n 'menu-full-screen': this.menuFullScreen,\n 'secondary-open': this.secondaryMenuOpen,\n }}\n aria-expanded={this.modalOpen ? 'true' : 'false'}\n ref={(div) => (this.menuDiv = div)}\n >\n <div\n class=\"gn-menu_wrap\"\n ref={(div) => (this.menuWrapDiv = div)}\n tabindex=\"-1\"\n >\n <div class=\"gn-menu_actions\">\n <button\n class=\"menu-btn icon-btn icon-btn\"\n onMouseDown={this.onMenuBtnClick}\n onKeyDown={this.onMenuBtnKeyDown}\n >\n {this.threshold < this.THRESHOLDLIMIT - 3 && (\n <nano-icon\n name=\"light/times\"\n aria-label=\"close menu\"\n ></nano-icon>\n )}\n {this.threshold >= this.THRESHOLDLIMIT - 3 && (\n <nano-icon\n name=\"light/bars\"\n aria-label=\"close menu\"\n ></nano-icon>\n )}\n </button>\n\n {this.threshold <\n this.THRESHOLDLIMIT - THRESHOLDBREAKS.icon && [\n !!this.iconSlotLen && <slot name=\"icon\" />,\n this.myAccData &&\n (!this.activeMyAccountSections ||\n this.activeMyAccountSections.includes('icons')) && [\n this.msgUrl && (\n <a href={this.msgUrl} class=\"icon-btn\">\n <nano-icon name=\"light/bell\"></nano-icon>\n {this.msgCount > 0 && (\n <span class=\"gn-menu_actions-counter\">\n {this.msgCount}\n </span>\n )}\n </a>\n ),\n this.cartUrl && (\n <a href={this.cartUrl} class=\"icon-btn\">\n <nano-icon name=\"light/shopping-cart\"></nano-icon>\n {this.cartCount > 0 && (\n <span class=\"gn-menu_actions-counter\">\n {this.cartCount}\n </span>\n )}\n </a>\n ),\n ],\n ]}\n\n {this.myAccData && this.myAccData.urls.login && (\n <a\n href={this.myAccData.urls.login + this.ssoRedirect}\n class=\"login-btn\"\n >\n Login / Register{' '}\n <nano-icon name=\"solid/chevron-right\"></nano-icon>\n </a>\n )}\n </div>\n\n <div\n class=\"content-wrap\"\n ref={(div) => (this.menuContentDiv = div)}\n >\n <div class=\"content\">\n <nav class=\"nav-links nav-links--main\">\n <slot name=\"overflow\" />\n {this.threshold <\n this.THRESHOLDLIMIT - THRESHOLDBREAKS.main &&\n !!this.mainSlotLen && <slot name=\"main\" />}\n </nav>\n\n {/* ABOUT AND SITE MENU IN BURGER */}\n {(((!!this.aboutSlotLen || !!this.aboutNavItms.length) &&\n this.threshold <\n this.THRESHOLDLIMIT - THRESHOLDBREAKS.about) ||\n this.hasSiteSlot ||\n !!this.siteNavItms.length) && (\n <div>\n {(!!this.aboutSlotLen || !!this.aboutNavItms.length) &&\n this.threshold <\n this.THRESHOLDLIMIT - THRESHOLDBREAKS.about && [\n // About Menu as an open list (before more items are added to burger)\n (this.threshold >=\n this.THRESHOLDLIMIT - (THRESHOLDBREAKS.about + 1) ||\n this.mainSlotLen < 2) &&\n this.overflowSlotLen < 2 && (\n <div class=\"nav-links-wrap\">\n {!!this.aboutNavItms.length && (\n <h4 class=\"nav-links_title\">About</h4>\n )}\n <nav\n class=\"nav-links nav-links--sub\"\n aria-label=\"About the company links\"\n >\n <slot name=\"about\" />\n\n {this.aboutNavItms.map((link) => {\n return (\n <nano-nav-item class=\"nano-global-nav nano-global-nav-menu\">\n <a\n href={link.address}\n target={link.target}\n >\n {link.title}\n </a>\n </nano-nav-item>\n );\n })}\n </nav>\n </div>\n ),\n // About Menu as hidden list (when more items are added to burger)\n ((this.threshold <\n this.THRESHOLDLIMIT - (THRESHOLDBREAKS.about + 1) &&\n this.mainSlotLen >= 2) ||\n this.overflowSlotLen >= 2) && (\n <nav\n class=\"nav-links\"\n aria-label=\"About the company links\"\n >\n {!this.aboutNavItms.length && (\n <slot name=\"about\" />\n )}\n {!!this.aboutNavItms.length && (\n <nano-nav-item class=\"nano-global-nav nano-global-nav-menu\">\n Company\n <nano-icon\n slot=\"icon-end\"\n name=\"solid/chevron-right\"\n ></nano-icon>\n <div slot=\"secondary\">\n <div class=\"content\">\n <button\n class=\"back-btn\"\n onClick={this.subMenuClose}\n >\n <nano-icon\n slot=\"icon-end\"\n name=\"solid/chevron-left\"\n aria-label=\"go back\"\n ></nano-icon>\n Company\n </button>\n <slot name=\"about\" />\n <div class=\"content--sub\">\n {this.aboutNavItms.map((link) => {\n return (\n <nano-nav-item class=\"nano-global-nav nano-global-nav-menu\">\n <a\n href={link.address}\n target={link.target}\n >\n {link.title}\n </a>\n </nano-nav-item>\n );\n })}\n </div>\n </div>\n </div>\n </nano-nav-item>\n )}\n </nav>\n ),\n ]}\n\n {/* SITES MENU (Always in burger) */}\n {(this.hasSiteSlot || !!this.siteNavItms.length) && [\n (this.threshold >= this.THRESHOLDLIMIT - 2 ||\n this.mainSlotLen < 2) &&\n this.overflowSlotLen < 2 && (\n <div class=\"nav-links-wrap\">\n <h4 class=\"nav-links_title\">Sites</h4>\n <nav\n class=\"nav-links nav-links--sub\"\n aria-label=\"Different company site links\"\n >\n <slot name=\"site\" />\n {this.siteNavItms.map((link) => {\n return (\n <nano-nav-item class=\"nano-global-nav nano-global-nav-menu\">\n <a\n href={link.address}\n target={link.target}\n >\n {link.title}\n </a>\n </nano-nav-item>\n );\n })}\n </nav>\n </div>\n ),\n ((this.threshold < this.THRESHOLDLIMIT - 2 &&\n this.mainSlotLen >= 2) ||\n this.overflowSlotLen >= 2) && (\n <nav\n class=\"nav-links\"\n aria-label=\"Different company site links\"\n >\n <nano-nav-item class=\"nano-global-nav nano-global-nav-menu\">\n Sites\n <nano-icon\n slot=\"icon-end\"\n name=\"solid/chevron-right\"\n ></nano-icon>\n <div slot=\"secondary\">\n <div class=\"content\">\n <button\n class=\"back-btn\"\n onClick={this.subMenuClose}\n >\n <nano-icon\n slot=\"icon-end\"\n name=\"solid/chevron-left\"\n aria-label=\"go back\"\n ></nano-icon>\n Sites\n </button>\n <div class=\"content--sub\">\n <slot name=\"site\" />\n {this.siteNavItms.map((link) => {\n return (\n <nano-nav-item class=\"nano-global-nav nano-global-nav-menu\">\n <a\n href={link.address}\n target={link.target}\n >\n {link.title}\n </a>\n </nano-nav-item>\n );\n })}\n </div>\n </div>\n </div>\n </nano-nav-item>\n </nav>\n ),\n ]}\n </div>\n )}\n </div>\n\n {this.isLoggedIn &&\n this.threshold <\n this.THRESHOLDLIMIT - THRESHOLDBREAKS.login &&\n (this.loggedInNavItms.length || this.hasLoggedinSlot) && (\n <nav class=\"nav-links\" aria-label=\"Your user account links\">\n <nano-nav-item class=\"nano-global-nav user-nav nano-global-nav-menu\">\n {this.myAccountUser.name}\n <nano-icon\n slot=\"icon-end\"\n name=\"solid/chevron-right\"\n ></nano-icon>\n <div slot=\"secondary\">\n <div class=\"content\">\n <button\n class=\"back-btn\"\n onClick={this.subMenuClose}\n >\n <nano-icon\n slot=\"icon-end\"\n name=\"solid/chevron-left\"\n aria-label=\"go back\"\n ></nano-icon>\n {this.myAccountUser.name}\n </button>\n <div class=\"content--sub\">\n <slot name=\"loggedin\" />\n {this.loggedInNavItms.map((link) => {\n return (\n <nano-nav-item class=\"nano-global-nav nano-global-nav-menu\">\n <a href={link.address} target={link.target}>\n {link.title}\n </a>\n </nano-nav-item>\n );\n })}\n <nano-nav-item class=\"nano-global-nav nano-global-nav-menu\">\n <a\n href={\n this.myAccData.urls.forgot_password +\n this.ssoRedirect\n }\n >\n Change Password\n </a>\n </nano-nav-item>\n </div>\n </div>\n </div>\n </nano-nav-item>\n </nav>\n )}\n\n <slot name=\"promotion\" />\n\n {this.myAccData && this.myAccData.urls.logout && (\n <div class=\"login-btn logout-btn\">\n <a href={this.myAccData.urls.logout + this.ssoRedirect}>\n Logout\n </a>\n </div>\n )}\n </div>\n </div>\n </nav>\n {/* END BURGER / OVERFLOW MENU */}\n\n {/* START MAIN NAV BAR */}\n <nano-sticker\n auto-resize=\"false\"\n break-point-max=\"800\"\n quietMode={{ h: 600, w: 800 }}\n >\n <div class=\"bars\" ref={(div) => (this.barsDiv = div)}>\n <nav\n class=\"main-bar\"\n aria-label=\"Main site navigation\"\n tabindex=\"-1\"\n ref={(div) => (this.mainBarDiv = div)}\n >\n {(this.hasPromotionSlot ||\n !!this.overflowSlotLen ||\n ((this.myAccData || !!this.iconSlotLen) &&\n this.threshold <\n this.THRESHOLDLIMIT - THRESHOLDBREAKS.icon) ||\n (this.isLoggedIn &&\n (!!this.loggedInNavItms.length || this.hasLoggedinSlot) &&\n this.threshold <\n this.THRESHOLDLIMIT - THRESHOLDBREAKS.login) ||\n (!!this.mainSlotLen &&\n this.threshold <\n this.THRESHOLDLIMIT - THRESHOLDBREAKS.main) ||\n ((!!this.aboutSlotLen || !!this.aboutNavItms.length) &&\n this.threshold <\n this.THRESHOLDLIMIT - THRESHOLDBREAKS.about) ||\n this.hasSiteSlot ||\n !!this.siteNavItms.length) && (\n <button\n class=\"menu-btn icon-btn\"\n onMouseDown={this.menuOpen}\n onKeyDown={this.onMenuBtnKeyDown}\n aria-expanded={this.modalOpen ? 'true' : 'false'}\n aria-controls=\"global-nav-menu\"\n ref={(btn) => (this.menuBtn = btn)}\n >\n <nano-icon\n name=\"light/bars\"\n aria-label=\"open menu\"\n ></nano-icon>\n </button>\n )}\n\n {this.showLogo && (\n <a href={this.logoUrl} class=\"logo-link\">\n <img\n src={getAssetPath(`./assets/ont-logo.svg`)}\n alt=\"Oxford Nanopore Technologies Logo\"\n class=\"logo\"\n />\n </a>\n )}\n {!this.showLogo && (\n <div class=\"logo-link\">\n <slot name=\"logo\" />\n </div>\n )}\n\n <div\n class=\"nav-links nav-links--main\"\n // hidden={\n // !(\n // this.threshold >= this.THRESHOLDLIMIT - THRESHOLDBREAKS.main && !!this.mainSlotLen\n // )\n // }\n >\n <slot name=\"main\" />\n </div>\n\n {this.threshold >=\n this.THRESHOLDLIMIT - THRESHOLDBREAKS.search && [\n this.showSearch && !!this.internalSearchIndeces.length && (\n <div\n class=\"search-widget\"\n role=\"combobox\"\n aria-owns=\"autocomplete-results\"\n aria-expanded={\n this.showAutocomplete && this.autocompleteResults\n ? 'true'\n : 'false'\n }\n >\n {searchWidget}\n </div>\n ),\n (!this.showSearch || !this.myAccData) &&\n !!this.searchSlotLen && <slot name=\"search\" />,\n ]}\n\n {this.threshold >=\n this.THRESHOLDLIMIT - THRESHOLDBREAKS.about && (\n <nav\n class=\"nav-links nav-links--sub\"\n aria-label=\"About the company links\"\n >\n {(!!this.aboutSlotLen || !!this.aboutNavItms.length) &&\n this.threshold >=\n this.THRESHOLDLIMIT - THRESHOLDBREAKS.about && [\n <slot name=\"about\" />,\n this.aboutNavItms.map((link) => {\n return (\n <nano-nav-item class=\"nano-global-nav nano-global-nav-bar\">\n <a href={link.address} target={link.target}>\n {link.title}\n </a>\n </nano-nav-item>\n );\n }),\n ]}\n </nav>\n )}\n\n {this.threshold <\n this.THRESHOLDLIMIT - THRESHOLDBREAKS.search &&\n ((this.showSearch && !!this.internalSearchIndeces.length) ||\n !!this.searchSlotLen) && (\n <button\n class=\"icon-btn\"\n aria-controls=\"global-nav-search-bar\"\n aria-expanded={this.searchBarShown ? 'true' : 'false'}\n onMouseDown={this.onSearchBtnClick}\n onKeyDown={this.onSearchBtnKeyDown}\n >\n <nano-icon name=\"light/search\"></nano-icon>\n </button>\n )}\n\n {this.threshold >=\n this.THRESHOLDLIMIT - THRESHOLDBREAKS.icon && [\n !!this.iconSlotLen && <slot name=\"icon\" />,\n this.myAccData &&\n (!this.activeMyAccountSections ||\n this.activeMyAccountSections.includes('icons')) && [\n this.msgUrl && (\n <a href={this.msgUrl} class=\"icon-btn\">\n <nano-icon name=\"light/bell\"></nano-icon>\n {this.msgCount > 0 && (\n <span class=\"gn-menu_actions-counter\">\n {this.msgCount}\n </span>\n )}\n </a>\n ),\n this.cartUrl && (\n <a href={this.cartUrl} class=\"icon-btn\">\n <nano-icon name=\"light/shopping-cart\"></nano-icon>\n {this.cartCount > 0 && (\n <span class=\"gn-menu_actions-counter\">\n {this.cartCount}\n </span>\n )}\n </a>\n ),\n ],\n ]}\n\n {this.myAccData &&\n this.threshold >=\n this.THRESHOLDLIMIT - THRESHOLDBREAKS.login && [\n this.myAccData.urls.login && (\n <a\n href={this.myAccData.urls.login + this.ssoRedirect}\n class=\"login-btn\"\n >\n Login / Register\n </a>\n ),\n this.myAccountUser && (\n <div class=\"user-links\">\n <button\n class={{\n 'icon-btn': true,\n 'user-links-btn': true,\n open: this.userMenuOpen,\n }}\n onMouseDown={this.onUserBtnClick}\n onKeyDown={this.onUserBtnKeyDown}\n >\n {' '}\n {this.myAccountUser.name}\n <nano-icon name=\"solid/caret-down\"></nano-icon>\n </button>\n <div\n class=\"user-links-panel\"\n tabindex=\"-1\"\n ref={(div) => (this.userLinkPanel = div)}\n >\n <div class=\"user-links-panel-content\">\n {this.loggedInNavItms.map((link) => {\n return (\n <a href={link.address} target={link.target}>\n {link.title}\n </a>\n );\n })}\n </div>\n <div class=\"user-links-panel-foot\">\n <a\n href={\n this.myAccData.urls.forgot_password +\n this.ssoRedirect\n }\n >\n Change Password\n </a>\n <a\n href={\n this.myAccData.urls.logout + this.ssoRedirect\n }\n >\n Logout\n </a>\n </div>\n </div>\n </div>\n ),\n ]}\n <span class=\"measure-ele\"></span>\n </nav>\n\n {this.threshold <\n this.THRESHOLDLIMIT - THRESHOLDBREAKS.search && (\n <div\n id=\"global-nav-search-bar\"\n class={{\n 'search-bar': true,\n show: this.searchBarShown,\n }}\n aria-expanded={this.searchBarShown ? 'true' : 'false'}\n role=\"region\"\n tabindex=\"-1\"\n ref={(div) => (this.searchBarEl = div)}\n >\n <div class=\"search-widget\">\n {this.showSearch && !!this.internalSearchIndeces.length && (\n <div>{searchWidget}</div>\n )}\n {(!this.showSearch || !this.myAccData) &&\n !!this.searchSlotLen && <slot name=\"search\" />}\n </div>\n </div>\n )}\n </div>\n </nano-sticker>\n {/* END MAIN NAV BAR */}\n\n {(this.threshold < this.THRESHOLDLIMIT - 3 ||\n this.menuFullScreen) && (\n <div\n class={{\n mask: true,\n open: this.modalOpen,\n }}\n onClick={this.menuClose}\n onTouchEnd={this.menuClose}\n ></div>\n )}\n </div>\n <div class=\"site-content\" ref={(div) => (this.siteContent = div)}>\n <slot />\n </div>\n </Host>\n );\n }\n\n // Data processing\n\n private domainFor(origin: string): string {\n if (!this.myAccData) return '';\n let domain = this.myAccData.domains.find((dm) => dm.origin === origin);\n return domain ? domain.domain : '';\n }\n\n private processSearchResults(results: AlgoliaMultiResults | AlgoliaResults) {\n let multiResults = results as AlgoliaMultiResults;\n let singleResult = results as AlgoliaResults;\n\n if (multiResults.results) {\n multiResults.results.forEach((result, i) => {\n multiResults.results[i] = this.processSearchResults(\n result\n ) as AlgoliaResults;\n });\n return multiResults;\n } else {\n singleResult.hits.map((hit) => {\n if (hit.url && !hit.url.match(/^http/))\n hit.url =\n location.protocol + '//' + this.domainFor(hit.origin) + hit.url;\n });\n return singleResult;\n }\n }\n\n private async getMyAccData() {\n if (!this.getMyAccountData || this.myAccData) {\n this.remoteDataReady = true;\n return;\n }\n\n let url;\n switch (this.env) {\n case 'dev':\n url = 'https://myaccount-dev.nanoporetech.com/';\n break;\n case 'test':\n url = 'https://myaccount-test.nanoporetech.com/';\n break;\n default:\n url = 'https://myaccount.nanoporetech.com/';\n break;\n }\n\n var config = { timeout: 5000 };\n\n try {\n if (this.env === 'local') {\n this.myAccData = (await import(\n `./assets/local-my-account.json`\n )) as unknown as MyAccountData;\n } else {\n this.myAccData = await clientFetch(url + 'nav_bar_data.json', config);\n }\n if (this.myAccData.user.id) {\n this.isLoggedIn = true;\n this.myAccountUser = this.myAccData.user;\n }\n this.processMyAccLinks();\n this.processMyAccData();\n setTimeout(() => (this.remoteDataReady = true), 300);\n } catch (e) {\n console.error(e);\n this.remoteDataReady = true;\n }\n }\n\n private processMyAccData() {\n if (!this.myAccData || !this.myAccData.search.indeces.length) return;\n\n if (this.myAccData.search.api_key)\n this.searchApiKey = this.myAccData.search.api_key;\n if (this.myAccData.search.app_id)\n this.searchAppId = this.myAccData.search.app_id;\n\n if (this.myAccData.cart.count) this.cartCount = this.myAccData.cart.count;\n if (this.myAccData.notifications.count)\n this.msgCount = this.myAccData.notifications.count;\n\n if (!this.searchAppId || !this.searchApiKey) return;\n this.internalSearchIndeces = [\n ...this.myAccData.search.indeces,\n ...this.searchIndeces,\n ];\n\n if (this.myAccData.urls.cart && !this.cartUrl)\n this.cartUrl = this.myAccData.urls.cart;\n if (this.myAccData.urls.messages && !this.msgUrl)\n this.msgUrl = this.myAccData.urls.messages;\n }\n\n private processMyAccLinks() {\n if (!this.myAccData.links || !this.myAccData.links.length) return;\n\n this.myAccData.links.forEach((link) => {\n switch (link.area) {\n case 'left-side-logged-in':\n case 'left-side-logged-out':\n if (\n this.activeMyAccountSections &&\n !this.activeMyAccountSections.includes('sites')\n )\n break;\n if (this.isLoggedIn && link.area === 'left-side-logged-in')\n this.siteNavItms.push(link);\n else if (!this.isLoggedIn && link.area === 'left-side-logged-out')\n this.siteNavItms.push(link);\n break;\n case 'right-side-logged-in':\n case 'right-side-logged-out':\n if (\n this.activeMyAccountSections &&\n !this.activeMyAccountSections.includes('about')\n )\n break;\n if (this.isLoggedIn && link.area === 'right-side-logged-in')\n this.aboutNavItms.push(link);\n else if (!this.isLoggedIn && link.area === 'right-side-logged-out')\n this.aboutNavItms.push(link);\n break;\n case 'profile-panel-list':\n if (\n this.activeMyAccountSections &&\n !this.activeMyAccountSections.includes('loggedin')\n )\n break;\n this.loggedInNavItms.push(link);\n break;\n }\n });\n }\n}\n"]}
@@ -0,0 +1,5 @@
1
+ var __awaiter=this&&this.__awaiter||function(e,t,n,o){function i(e){return e instanceof n?e:new n((function(t){t(e)}))}return new(n||(n=Promise))((function(n,r){function s(e){try{d(o.next(e))}catch(t){r(t)}}function a(e){try{d(o["throw"](e))}catch(t){r(t)}}function d(e){e.done?n(e.value):i(e.value).then(s,a)}d((o=o.apply(e,t||[])).next())}))};var __generator=this&&this.__generator||function(e,t){var n={label:0,sent:function(){if(r[0]&1)throw r[1];return r[1]},trys:[],ops:[]},o,i,r,s;return s={next:a(0),throw:a(1),return:a(2)},typeof Symbol==="function"&&(s[Symbol.iterator]=function(){return this}),s;function a(e){return function(t){return d([e,t])}}function d(s){if(o)throw new TypeError("Generator is already executing.");while(n)try{if(o=1,i&&(r=s[0]&2?i["return"]:s[0]?i["throw"]||((r=i["return"])&&r.call(i),0):i.next)&&!(r=r.call(i,s[1])).done)return r;if(i=0,r)s=[s[0]&2,r.value];switch(s[0]){case 0:case 1:r=s;break;case 4:n.label++;return{value:s[1],done:false};case 5:n.label++;i=s[1];s=[0];continue;case 7:s=n.ops.pop();n.trys.pop();continue;default:if(!(r=n.trys,r=r.length>0&&r[r.length-1])&&(s[0]===6||s[0]===2)){n=0;continue}if(s[0]===3&&(!r||s[1]>r[0]&&s[1]<r[3])){n.label=s[1];break}if(s[0]===6&&n.label<r[1]){n.label=r[1];r=s;break}if(r&&n.label<r[2]){n.label=r[2];n.ops.push(s);break}if(r[2])n.ops.pop();n.trys.pop();continue}s=t.call(e,n)}catch(a){s=[6,a];i=0}finally{o=r=0}if(s[0]&5)throw s[1];return{value:s[0]?s[1]:void 0,done:true}}};
2
+ /*!
3
+ * Web Components for Nanopore digital Web Apps
4
+ */System.register(["./p-59b3d24b.system.js","./p-d35d468b.system.js","./p-09d2d944.system.js","./p-9de508a5.system.js","./p-1c216ca4.system.js"],(function(e){"use strict";var t,n,o,i,r,s,a;return{setters:[function(e){t=e.r;n=e.c;o=e.h;i=e.g},function(e){r=e.P},function(e){s=e.g},function(e){a=e.a},function(){}],execute:function(){var d=":host{-webkit-box-sizing:border-box;box-sizing:border-box}*,*::before,*::after{-webkit-box-sizing:border-box;box-sizing:border-box}[hidden]{display:none !important}:host{--width:auto;--border:var(--nano-layer-border-style, 1px solid var(--nano-layer-border-color, rgba(0, 0, 0, 0.1)));--border-radius:var(--nano-layer-border-radius, var(--nano-border-radius-medium, 4px));--background:var(--nano-layer-bg, #fff);--padding:10px 0;--overflow:hidden;--dropdown-z-index:var(--nano-layer-index-dropdown, 300);--min-width:0;--box-shadow:var(--nano-layer-shadow-large, 0 2px 8px rgba(0, 0, 0, 0.2));display:-webkit-box;display:-ms-flexbox;display:flex}.dropdown{position:relative}.dropdown__trigger{display:block}.dropdown__positioner{position:absolute;z-index:var(--dropdown-z-index);min-width:var(--min-width)}@media (max-width: 35.9375em){.dropdown__positioner{z-index:100}}.dropdown__panel{padding:var(--padding);background:var(--background);min-width:var(--min-width);width:var(--width);border:var(--border);border-radius:var(--border-radius);color:currentColor;-webkit-box-shadow:var(--box-shadow);box-shadow:var(--box-shadow);opacity:0;-webkit-transition:0.2s ease opacity, 0.2s ease transform, 0.2s ease min-height;transition:0.2s ease opacity, 0.2s ease transform, 0.2s ease min-height;min-height:20px;overflow:var(--overflow);-webkit-box-sizing:content-box !important;box-sizing:content-box !important}.dropdown__panel.loading{overflow-y:hidden}.dropdown__panel.top{-webkit-transform:translateY(-20px) translateZ(0);transform:translateY(-20px) translateZ(0)}.dropdown__panel.bottom{-webkit-transform:translateY(20px) translateZ(0);transform:translateY(20px) translateZ(0)}.dropdown__positioner.popover-visible .dropdown__panel{opacity:1;-webkit-transform:translateY(0) translateZ(0);transform:translateY(0) translateZ(0)}.dropdown__panel ::slotted(nano-menu){max-height:50vh}.dropdown__accessible-title{clip:rect(1px, 1px, 1px, 1px);-webkit-clip-path:inset(50%);clip-path:inset(50%);height:1px;width:1px;margin:-1px;overflow:hidden;padding:0;position:absolute}";var h=0;var l=e("nano_dropdown",function(){function e(e){var o=this;t(this,e);this.nanoShow=n(this,"nanoShow",7);this.nanoAfterShow=n(this,"nanoAfterShow",7);this.nanoHide=n(this,"nanoHide",7);this.nanoAfterHide=n(this,"nanoAfterHide",7);this.dropdownId="dropdown-"+h++;this.labelId=this.dropdownId+"-title";this.ignoreOpenWatcher=false;this.didLoad=false;this.autoOpen=true;this.open=false;this.closeOnSelect=true;this.tetherTo=null;this.placement="bottom-start";this.distance=2;this.skidding=0;this.hoist=false;this.togglePanel=function(){if(!o.autoOpen)return;o.open?o.hide():o.show()};this.handleTriggerKeyDown=function(e){if(["ArrowDown","ArrowUp"," "].includes(e.key)){o.show();e.preventDefault();e.stopPropagation();if(o.menu)o.menu.setFocus()}};this.handleTriggerSlotChange=function(){o.updateAccessibleTrigger()}}Object.defineProperty(e.prototype,"menu",{get:function(){return this.host.querySelector("nano-menu")},enumerable:false,configurable:true});e.prototype.handleOpenChange=function(){if(this.ignoreOpenWatcher)return;this.open?this.show():this.hide();if(this.accessibleTrigger){this.accessibleTrigger.setAttribute("aria-expanded",this.open.toString());return}this.updateAccessibleTrigger()};e.prototype.handleTetherToChange=function(){this.createPopover();this.updateAccessibleTrigger()};e.prototype.handlePopoverOptionsChange=function(){this.popover.setOptions({strategy:this.hoist?"fixed":"absolute",placement:this.placement,skidding:this.skidding,distance:this.distance})};e.prototype.secondaryOpen=function(e){var t=this;if(!e.detail.secondaryMenu)return;e.stopPropagation();this.panel.classList.add("loading");this.panel.addEventListener("transitionend",(function(){t.panel.classList.remove("loading")}),{once:true});this.panel.style.minHeight=e.detail.secondaryMenu.scrollHeight+"px"};e.prototype.secondaryClose=function(e){if(!e.detail.secondaryMenu)return;e.stopPropagation();if(!e.target.parentElement)return;this.panel.style.minHeight=e.target.parentElement.scrollHeight+"px"};e.prototype.handlePanelSelect=function(e){var t=e.target;if(this.closeOnSelect&&t.tagName.toLowerCase()==="nano-menu")this.hide()};e.prototype.show=function(){return __awaiter(this,void 0,void 0,(function(){var e;return __generator(this,(function(t){this.ignoreOpenWatcher=true;this.open=true;e=this.nanoShow.emit();if(e.defaultPrevented){this.open=false;this.ignoreOpenWatcher=false;return[2]}this.popover.show();this.ignoreOpenWatcher=false;document.addEventListener("mousedown",this.handleDocumentMouseDown);document.addEventListener("keydown",this.handleDocumentKeyDown);return[2]}))}))};e.prototype.hide=function(){return __awaiter(this,void 0,void 0,(function(){var e;return __generator(this,(function(t){this.ignoreOpenWatcher=true;this.open=false;e=this.nanoHide.emit();if(e.defaultPrevented){this.open=true;this.ignoreOpenWatcher=false;return[2]}if(this.popover)this.popover.hide();this.ignoreOpenWatcher=false;document.removeEventListener("mousedown",this.handleDocumentMouseDown);document.removeEventListener("keydown",this.handleDocumentKeyDown);if(this.accessibleTrigger&&this.focusEleInDropDwn()){this.accessibleTrigger.focus()}return[2]}))}))};e.prototype.focusEleInDropDwn=function(e){var t;var n=s();if(e&&((t=e.composedPath())===null||t===void 0?void 0:t.length)){var o=e.composedPath().includes(this.containingElement);return!e.composedPath().includes(this.accessibleTrigger)&&o}return n&&n.closest(this.containingElement.tagName.toLowerCase())===this.containingElement&&n!==this.accessibleTrigger};e.prototype.updateAccessibleTrigger=function(){if(!this.didLoad)return;var e;this.accessibleTrigger=null;if(!this.tetherTo){var t=Array.from(this.host.querySelectorAll('[slot="trigger"]'));e=t.map(a)[0]}else{e=a(this.tetherTo)}if(e){e.setAttribute("aria-haspopup","true");e.setAttribute("aria-expanded",this.open?"true":"false");this.accessibleTrigger=e}};e.prototype.handleDocumentKeyDown=function(e){var t=this;if(e.key==="Escape"){this.hide();return}if(e.key==="Tab"){setTimeout((function(){if(document.activeElement&&document.activeElement.closest(t.containingElement.tagName.toLowerCase())!==t.containingElement){t.hide();return}}))}if(this.menu&&["ArrowDown","ArrowUp"].includes(e.key)){if(!this.open||this.focusEleInDropDwn(e))return;e.preventDefault();this.menu.setFocus();return}var n=e.composedPath();if(this.menu&&n.length&&!n.find((function(e){return e!==t.menu}))){this.menu.dispatchEvent(new KeyboardEvent(e.type,e));return}};e.prototype.handleDocumentMouseDown=function(e){if(!this.focusEleInDropDwn(e)){this.hide();return}};e.prototype.createPopover=function(){var e=this;if(this.popover){if(this.open)this.hide();this.popover.destroy();this.popover=null}this.popover=new r(this.tetherTo||this.trigger,this.positioner,{strategy:this.hoist?"fixed":"absolute",placement:this.placement,distance:this.distance,skidding:this.skidding,transitionElement:this.panel,onAfterHide:function(){return e.nanoAfterHide.emit()},onAfterShow:function(){return e.nanoAfterShow.emit()},onTransitionEnd:function(){if(!e.open){e.panel.scrollTop=0}else if(e.menu){e.menu.showActiveElement()}}});if(this.open){this.show()}};e.prototype.connectedCallback=function(){this.handleDocumentKeyDown=this.handleDocumentKeyDown.bind(this);this.handleDocumentMouseDown=this.handleDocumentMouseDown.bind(this);if(!this.containingElement)this.containingElement=this.host};e.prototype.componentDidLoad=function(){var e=this;this.didLoad=true;this.createPopover();setTimeout((function(){return e.updateAccessibleTrigger()}),100)};e.prototype.disconnectedCallback=function(){this.hide();if(this.popover)this.popover.destroy()};e.prototype.render=function(){var e=this;return o("div",{part:"base",id:this.dropdownId,class:{dropdown:true,"dropdown--open":this.open}},o("span",{part:"trigger",class:"dropdown__trigger",ref:function(t){return e.trigger=t},onKeyDown:this.handleTriggerKeyDown,onClick:this.togglePanel},o("slot",{name:"trigger",onSlotchange:this.handleTriggerSlotChange})),o("div",{ref:function(t){return e.positioner=t},class:"dropdown__positioner"},o("div",{ref:function(t){return e.panel=t},part:"panel",class:"dropdown__panel "+this.placement.split("-").join(" "),"aria-hidden":!this.open,role:"dialog","aria-modal":"true","aria-labelledby":this.dialogTitle?this.labelId:undefined},this.dialogTitle&&o("h2",{id:this.labelId,class:"dropdown__accessible-title","aria-live":"polite"},this.dialogTitle),o("slot",null))))};Object.defineProperty(e.prototype,"host",{get:function(){return i(this)},enumerable:false,configurable:true});Object.defineProperty(e,"watchers",{get:function(){return{open:["handleOpenChange"],tetherTo:["handleTetherToChange"],placement:["handlePopoverOptionsChange"],distance:["handlePopoverOptionsChange"],skidding:["handlePopoverOptionsChange"],hoist:["handlePopoverOptionsChange"]}},enumerable:false,configurable:true});return e}());l.style=d}}}));
5
+ //# sourceMappingURL=p-fd1a86d2.system.entry.js.map
@@ -1 +1 @@
1
- {"version":3,"sources":["src/components/dropdown/dropdown.scss?tag=nano-dropdown&encapsulation=shadow","src/components/dropdown/dropdown.tsx"],"names":["dropdownCss","dropDownIds","Dropdown","exports","class_1","hostRef","_this","this","dropdownId","labelId","ignoreOpenWatcher","didLoad","autoOpen","open","closeOnSelect","tetherTo","placement","distance","skidding","hoist","togglePanel","hide","show","handleTriggerKeyDown","event","includes","key","preventDefault","stopPropagation","menu","setFocus","handleTriggerSlotChange","updateAccessibleTrigger","Object","defineProperty","prototype","host","querySelector","handleOpenChange","accessibleTrigger","setAttribute","toString","handleTetherToChange","createPopover","handlePopoverOptionsChange","popover","setOptions","strategy","secondaryOpen","ev","detail","secondaryMenu","panel","classList","add","addEventListener","remove","once","style","minHeight","scrollHeight","secondaryClose","target","parentElement","handlePanelSelect","tagName","toLowerCase","nanoShow","emit","defaultPrevented","document","handleDocumentMouseDown","handleDocumentKeyDown","nanoHide","removeEventListener","focusEleInDropDwn","focus","e","activeElement","getActiveElement","_a","composedPath","length","ddInPath","containingElement","closest","assignedElements","Array","from","querySelectorAll","map","getNearestTabbableElement","setTimeout","ePath","find","el","dispatchEvent","KeyboardEvent","type","destroy","Popover","trigger","positioner","transitionElement","onAfterHide","nanoAfterHide","onAfterShow","nanoAfterShow","onTransitionEnd","scrollTop","showActiveElement","connectedCallback","bind","componentDidLoad","disconnectedCallback","render","h","part","id","class","dropdown","dropdown--open","ref","onKeyDown","onClick","name","onSlotchange","split","join","aria-hidden","role","aria-modal","aria-labelledby","dialogTitle","undefined","aria-live"],"mappings":"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","sourcesContent":["@import '../../global/style/utilities/globals';\n@import '../../global/style/nano-theme/layers';\n\n:host {\n /**\n * @prop --width: width of the dropdown. Defaults to 'auto'\n * @prop --border: Defaults to #{$layer-border-style}\n * @prop --border-radius: Defaults to #{$layer-bg-color};\n * @prop --background: Defaults to #{$layer-bg-color};\n * @prop --padding: padding of the drop down. Default to '10px 0';\n * @prop --overflow: `nano-menu` with nested `nav-item` requires hidden overflow. This can be overidden;\n * @prop --dropdown-z-index: Defaults to #{$layer-index-dropdown};\n * @prop --min-width: Defaults to 0;\n * @prop --box-shadow: #{$layer-shadow-large};\n */\n\n --width: auto;\n --border: #{$layer-border-style};\n --border-radius: #{$layer-border-radius};\n --background: #{$layer-bg-color};\n --padding: 10px 0;\n --overflow: hidden;\n --dropdown-z-index: #{$layer-index-dropdown};\n --min-width: 0;\n --box-shadow: #{$layer-shadow-large};\n\n display: flex;\n}\n\n.dropdown {\n position: relative;\n\n &__trigger {\n display: block;\n }\n\n &__positioner {\n position: absolute;\n z-index: var(--dropdown-z-index);\n min-width: var(--min-width);\n\n @media (max-width: 35.9375em) {\n z-index: 100;\n }\n }\n\n &__panel {\n padding: var(--padding);\n background: var(--background);\n min-width: var(--min-width);\n width: var(--width);\n border: var(--border);\n border-radius: var(--border-radius);\n color: currentColor;\n box-shadow: var(--box-shadow);\n opacity: 0;\n transition: 0.2s ease opacity, 0.2s ease transform, 0.2s ease min-height;\n min-height: 20px;\n overflow: var(--overflow);\n box-sizing: content-box !important;\n\n &.loading {\n overflow-y: hidden;\n }\n\n &.top {\n transform: translateY(-20px) translateZ(0);\n }\n\n &.bottom {\n transform: translateY(20px) translateZ(0);\n }\n\n .dropdown__positioner.popover-visible & {\n opacity: 1;\n transform: translateY(0) translateZ(0);\n }\n\n ::slotted(nano-menu) {\n max-height: 50vh;\n }\n }\n\n &__accessible-title {\n @include visually-hide();\n }\n}\n","import {\n Component,\n Element,\n Event,\n EventEmitter,\n Method,\n Prop,\n Watch,\n h,\n Listen,\n ComponentInterface,\n} from '@stencil/core';\nimport Popover from '../../utils/popover';\nimport { NavItemEventDetail } from '../../interface';\nimport { getNearestTabbableElement, getActiveElement } from '../../utils';\n\nlet dropDownIds = 0;\n\n/**\n * Dropdowns show additional content in a panel.\n * Designed to work well with nano-menu components to provide a list of options (`nano-nav-items` / `nano-option`).\n * @slot trigger - The dropdown's trigger.\n * @slot - The dropdown's content.\n */\n@Component({\n tag: 'nano-dropdown',\n styleUrl: 'dropdown.scss',\n shadow: true,\n})\nexport class Dropdown implements ComponentInterface {\n private dropdownId = `dropdown-${dropDownIds++}`;\n private labelId = this.dropdownId + '-title';\n private ignoreOpenWatcher = false;\n private panel: HTMLElement;\n private popover: Popover;\n private trigger: HTMLElement;\n private positioner: HTMLElement;\n private accessibleTrigger: HTMLElement;\n private didLoad = false;\n private get menu() {\n return this.host.querySelector('nano-menu') as HTMLNanoMenuElement;\n }\n\n @Element() host: HTMLNanoDropdownElement;\n\n /** Determines if the dropdown should open automatically when the trigger is clicked */\n @Prop() autoOpen = true;\n\n /** Indicates whether or not the dropdown is open. You can use this in lieu of the show/hide methods. */\n @Prop({ mutable: true, reflect: true }) open = false;\n\n @Watch('open')\n handleOpenChange() {\n if (this.ignoreOpenWatcher) return;\n\n this.open ? this.show() : this.hide();\n\n if (this.accessibleTrigger) {\n this.accessibleTrigger.setAttribute(\n 'aria-expanded',\n this.open.toString()\n );\n return;\n }\n\n this.updateAccessibleTrigger();\n }\n\n /**\n * Determines whether the dropdown should hide when a menu item is selected.\n */\n @Prop() closeOnSelect = true;\n\n /**\n * The dropdown will close when the user interacts outside of this element (e.g. clicking).\n */\n @Prop({ mutable: true }) containingElement: HTMLElement;\n\n /**\n * If you don't want to use the trigger slot, you can use this to 'tether' the dropdown to another element.\n * And you will still need to control when the component is opened (using show() / hide() or the `open` prop)\n */\n @Prop() tetherTo: HTMLElement = null;\n\n @Watch('tetherTo')\n handleTetherToChange() {\n this.createPopover();\n this.updateAccessibleTrigger();\n }\n\n /**\n * The preferred placement of the dropdown panel. Note that the actual placement may vary as needed to keep the panel\n * inside of the viewport.\n */\n @Prop() placement:\n | 'top'\n | 'top-start'\n | 'top-end'\n | 'bottom'\n | 'bottom-start'\n | 'bottom-end'\n | 'right'\n | 'right-start'\n | 'right-end'\n | 'left'\n | 'left-start'\n | 'left-end' = 'bottom-start';\n\n /**\n * The distance in pixels from which to offset the panel away from its trigger.\n */\n @Prop() distance = 2;\n\n /**\n * The distance in pixels from which to offset the panel along its trigger.\n */\n @Prop() skidding = 0;\n\n /**\n * Enable this option to prevent the panel from being clipped when the component is placed inside a container with\n * `overflow: auto|scroll`.\n */\n @Prop() hoist = false;\n\n @Watch('placement')\n @Watch('distance')\n @Watch('skidding')\n @Watch('hoist')\n handlePopoverOptionsChange() {\n this.popover.setOptions({\n strategy: this.hoist ? 'fixed' : 'absolute',\n placement: this.placement,\n skidding: this.skidding,\n distance: this.distance,\n });\n }\n\n /**\n * Title used to describe the dropdown content for accessibility\n */\n @Prop() dialogTitle!: string;\n\n // Events\n\n /**\n * Emitted when the dropdown opens. Calling `event.preventDefault()` will prevent it from being opened.\n */\n @Event() nanoShow: EventEmitter;\n\n /**\n * Emitted after the dropdown opens and all transitions are complete.\n */\n @Event() nanoAfterShow: EventEmitter;\n\n /**\n * Emitted when the dropdown closes. Calling `event.preventDefault()` will prevent it from being closed.\n */\n @Event() nanoHide: EventEmitter;\n\n /**\n * Emitted after the dropdown closes and all transitions are complete.\n */\n @Event() nanoAfterHide: EventEmitter;\n\n // Listeners\n\n @Listen('nanoOpen')\n secondaryOpen(ev: CustomEvent) {\n if (!(ev.detail as NavItemEventDetail).secondaryMenu) return;\n ev.stopPropagation();\n\n this.panel.classList.add('loading');\n this.panel.addEventListener(\n 'transitionend',\n () => {\n this.panel.classList.remove('loading');\n },\n { once: true }\n );\n\n this.panel.style.minHeight =\n (ev.detail as NavItemEventDetail).secondaryMenu.scrollHeight + 'px';\n }\n\n @Listen('nanoClose')\n secondaryClose(ev: CustomEvent) {\n if (!(ev.detail as NavItemEventDetail).secondaryMenu) return;\n ev.stopPropagation();\n if (!(ev.target as HTMLElement).parentElement) return;\n this.panel.style.minHeight =\n (ev.target as HTMLElement).parentElement.scrollHeight + 'px';\n }\n\n @Listen('nanoSelect')\n handlePanelSelect(event: CustomEvent) {\n const target = event.target as HTMLElement;\n\n // Hide the dropdown when a menu item is selected\n if (this.closeOnSelect && target.tagName.toLowerCase() === 'nano-menu')\n this.hide();\n }\n\n // Methods\n\n /** Shows the dropdown panel */\n @Method()\n async show() {\n this.ignoreOpenWatcher = true;\n this.open = true;\n\n const nanoShow = this.nanoShow.emit();\n\n if (nanoShow.defaultPrevented) {\n this.open = false;\n this.ignoreOpenWatcher = false;\n return;\n }\n\n this.popover.show();\n this.ignoreOpenWatcher = false;\n\n document.addEventListener('mousedown', this.handleDocumentMouseDown);\n document.addEventListener('keydown', this.handleDocumentKeyDown);\n }\n\n /** Hides the dropdown panel */\n @Method()\n async hide() {\n this.ignoreOpenWatcher = true;\n this.open = false;\n\n const nanoHide = this.nanoHide.emit();\n\n if (nanoHide.defaultPrevented) {\n this.open = true;\n this.ignoreOpenWatcher = false;\n return;\n }\n\n if (this.popover) this.popover.hide();\n this.ignoreOpenWatcher = false;\n\n document.removeEventListener('mousedown', this.handleDocumentMouseDown);\n document.removeEventListener('keydown', this.handleDocumentKeyDown);\n\n if (this.accessibleTrigger && this.focusEleInDropDwn()) {\n this.accessibleTrigger.focus();\n }\n }\n\n // Private methods\n\n /** Decides if the current active element or element\n * connected to the current event is connected to the Dropdown\n */\n private focusEleInDropDwn(e?: Event) {\n const activeElement = getActiveElement();\n\n if (e && e.composedPath()?.length) {\n const ddInPath = e.composedPath().includes(this.containingElement);\n return !e.composedPath().includes(this.accessibleTrigger) && ddInPath;\n }\n\n return (\n activeElement &&\n activeElement.closest(this.containingElement.tagName.toLowerCase()) ===\n this.containingElement &&\n activeElement !== this.accessibleTrigger\n );\n }\n\n private togglePanel = () => {\n if (!this.autoOpen) return;\n this.open ? this.hide() : this.show();\n };\n\n // Slotted triggers can be arbitrary content, but we need to link them to the dropdown panel with `aria-haspopup` and\n // `aria-expanded`. These must be applied to the \"accessible trigger\" (the tabbable portion of the trigger element\n // that gets slotted in) so screen readers will understand them. The accessible trigger could be the slotted element,\n private updateAccessibleTrigger() {\n if (!this.didLoad) return;\n\n let accessibleTrigger: HTMLElement;\n this.accessibleTrigger = null;\n\n if (!this.tetherTo) {\n const assignedElements = Array.from(\n this.host.querySelectorAll('[slot=\"trigger\"]')\n );\n accessibleTrigger = assignedElements.map(getNearestTabbableElement)[0];\n } else {\n accessibleTrigger = getNearestTabbableElement(this.tetherTo);\n }\n\n if (accessibleTrigger) {\n accessibleTrigger.setAttribute('aria-haspopup', 'true');\n accessibleTrigger.setAttribute(\n 'aria-expanded',\n this.open ? 'true' : 'false'\n );\n this.accessibleTrigger = accessibleTrigger;\n }\n }\n\n // Handlers\n\n private handleDocumentKeyDown(event: KeyboardEvent) {\n // Close when escape is pressed\n if (event.key === 'Escape') {\n this.hide();\n return;\n }\n\n // Close when tabbing results in the focus leaving the close element\n if (event.key === 'Tab') {\n setTimeout(() => {\n if (\n document.activeElement &&\n document.activeElement.closest(\n this.containingElement.tagName.toLowerCase()\n ) !== this.containingElement\n ) {\n this.hide();\n return;\n }\n });\n }\n\n // If a menu is present, focus on it when certain keys are pressed\n if (this.menu && ['ArrowDown', 'ArrowUp'].includes(event.key)) {\n // must have menu item, must have pressed down, must be open and must not have focus within dd\n if (!this.open || this.focusEleInDropDwn(event)) return;\n event.preventDefault();\n this.menu.setFocus();\n return;\n }\n\n // All other keys focus the menu and pass the event through to menu (necessary for type-to-search to work)\n const ePath = event.composedPath();\n if (this.menu && ePath.length && !ePath.find((el) => el !== this.menu)) {\n this.menu.dispatchEvent(new KeyboardEvent(event.type, event));\n return;\n }\n }\n\n private handleDocumentMouseDown(event: MouseEvent) {\n // Close when clicking outside of the close element\n\n if (!this.focusEleInDropDwn(event)) {\n this.hide();\n return;\n }\n }\n\n private handleTriggerKeyDown = (event: KeyboardEvent) => {\n // Open the panel when pressing down or up while focused on the trigger\n if (['ArrowDown', 'ArrowUp', ' '].includes(event.key)) {\n this.show();\n event.preventDefault();\n event.stopPropagation();\n\n if (this.menu) this.menu.setFocus();\n }\n };\n\n private handleTriggerSlotChange = () => {\n this.updateAccessibleTrigger();\n };\n\n private createPopover() {\n if (this.popover) {\n if (this.open) this.hide();\n this.popover.destroy();\n this.popover = null;\n }\n\n this.popover = new Popover(this.tetherTo || this.trigger, this.positioner, {\n strategy: this.hoist ? 'fixed' : 'absolute',\n placement: this.placement,\n distance: this.distance,\n skidding: this.skidding,\n transitionElement: this.panel,\n onAfterHide: () => this.nanoAfterHide.emit(),\n onAfterShow: () => this.nanoAfterShow.emit(),\n onTransitionEnd: () => {\n if (!this.open) {\n this.panel.scrollTop = 0;\n } else if (this.menu) {\n this.menu.showActiveElement();\n }\n },\n });\n // Show on init if open\n if (this.open) {\n this.show();\n }\n }\n\n // Stencil hooks\n\n connectedCallback() {\n this.handleDocumentKeyDown = this.handleDocumentKeyDown.bind(this);\n this.handleDocumentMouseDown = this.handleDocumentMouseDown.bind(this);\n\n if (!this.containingElement) this.containingElement = this.host;\n }\n\n componentDidLoad() {\n this.didLoad = true;\n this.createPopover();\n setTimeout(() => this.updateAccessibleTrigger(), 100);\n }\n\n disconnectedCallback() {\n this.hide();\n if (this.popover) this.popover.destroy();\n }\n\n render() {\n return (\n <div\n part=\"base\"\n id={this.dropdownId}\n class={{\n dropdown: true,\n 'dropdown--open': this.open,\n }}\n >\n <span\n part=\"trigger\"\n class=\"dropdown__trigger\"\n ref={(el) => (this.trigger = el)}\n onKeyDown={this.handleTriggerKeyDown}\n onClick={this.togglePanel}\n >\n <slot name=\"trigger\" onSlotchange={this.handleTriggerSlotChange} />\n </span>\n\n <div ref={(el) => (this.positioner = el)} class=\"dropdown__positioner\">\n <div\n ref={(el) => (this.panel = el)}\n part=\"panel\"\n class={`dropdown__panel ${this.placement.split('-').join(' ')}`}\n aria-hidden={!this.open}\n role=\"dialog\"\n aria-modal=\"true\"\n aria-labelledby={this.dialogTitle ? this.labelId : undefined}\n >\n {this.dialogTitle && (\n <h2\n id={this.labelId}\n class=\"dropdown__accessible-title\"\n aria-live=\"polite\"\n >\n {this.dialogTitle}\n </h2>\n )}\n <slot />\n </div>\n </div>\n </div>\n );\n }\n}\n"]}
1
+ {"version":3,"sources":["src/components/dropdown/dropdown.scss?tag=nano-dropdown&encapsulation=shadow","src/components/dropdown/dropdown.tsx"],"names":["dropdownCss","dropDownIds","Dropdown","exports","class_1","hostRef","_this","this","dropdownId","labelId","ignoreOpenWatcher","didLoad","autoOpen","open","closeOnSelect","tetherTo","placement","distance","skidding","hoist","togglePanel","hide","show","handleTriggerKeyDown","event","includes","key","preventDefault","stopPropagation","menu","setFocus","handleTriggerSlotChange","updateAccessibleTrigger","Object","defineProperty","prototype","host","querySelector","handleOpenChange","accessibleTrigger","setAttribute","toString","handleTetherToChange","createPopover","handlePopoverOptionsChange","popover","setOptions","strategy","secondaryOpen","ev","detail","secondaryMenu","panel","classList","add","addEventListener","remove","once","style","minHeight","scrollHeight","secondaryClose","target","parentElement","handlePanelSelect","tagName","toLowerCase","nanoShow","emit","defaultPrevented","document","handleDocumentMouseDown","handleDocumentKeyDown","nanoHide","removeEventListener","focusEleInDropDwn","focus","e","activeElement","getActiveElement","_a","composedPath","length","ddInPath","containingElement","closest","assignedElements","Array","from","querySelectorAll","map","getNearestTabbableElement","setTimeout","ePath","find","el","dispatchEvent","KeyboardEvent","type","destroy","Popover","trigger","positioner","transitionElement","onAfterHide","nanoAfterHide","onAfterShow","nanoAfterShow","onTransitionEnd","scrollTop","showActiveElement","connectedCallback","bind","componentDidLoad","disconnectedCallback","render","h","part","id","class","dropdown","dropdown--open","ref","onKeyDown","onClick","name","onSlotchange","split","join","aria-hidden","role","aria-modal","aria-labelledby","dialogTitle","undefined","aria-live"],"mappings":"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","sourcesContent":["@import '../../global/style/utilities/globals';\n@import '../../global/style/nano-theme/layers';\n\n:host {\n /**\n * @prop --width: width of the dropdown. Defaults to 'auto'\n * @prop --border: Defaults to #{$layer-border-style}\n * @prop --border-radius: Defaults to #{$layer-bg-color};\n * @prop --background: Defaults to #{$layer-bg-color};\n * @prop --padding: padding of the drop down. Default to '10px 0';\n * @prop --overflow: `nano-menu` with nested `nav-item` requires hidden overflow. This can be overidden;\n * @prop --dropdown-z-index: Defaults to #{$layer-index-dropdown};\n * @prop --min-width: Defaults to 0;\n * @prop --box-shadow: #{$layer-shadow-large};\n */\n\n --width: auto;\n --border: #{$layer-border-style};\n --border-radius: #{$layer-border-radius};\n --background: #{$layer-bg-color};\n --padding: 10px 0;\n --overflow: hidden;\n --dropdown-z-index: #{$layer-index-dropdown};\n --min-width: 0;\n --box-shadow: #{$layer-shadow-large};\n\n display: flex;\n}\n\n.dropdown {\n position: relative;\n\n &__trigger {\n display: block;\n }\n\n &__positioner {\n position: absolute;\n z-index: var(--dropdown-z-index);\n min-width: var(--min-width);\n\n @media (max-width: 35.9375em) {\n z-index: 100;\n }\n }\n\n &__panel {\n padding: var(--padding);\n background: var(--background);\n min-width: var(--min-width);\n width: var(--width);\n border: var(--border);\n border-radius: var(--border-radius);\n color: currentColor;\n box-shadow: var(--box-shadow);\n opacity: 0;\n transition: 0.2s ease opacity, 0.2s ease transform, 0.2s ease min-height;\n min-height: 20px;\n overflow: var(--overflow);\n box-sizing: content-box !important;\n\n &.loading {\n overflow-y: hidden;\n }\n\n &.top {\n transform: translateY(-20px) translateZ(0);\n }\n\n &.bottom {\n transform: translateY(20px) translateZ(0);\n }\n\n .dropdown__positioner.popover-visible & {\n opacity: 1;\n transform: translateY(0) translateZ(0);\n }\n\n ::slotted(nano-menu) {\n max-height: 50vh;\n }\n }\n\n &__accessible-title {\n @include visually-hide();\n }\n}\n","import {\n Component,\n Element,\n Event,\n EventEmitter,\n Method,\n Prop,\n Watch,\n h,\n Listen,\n ComponentInterface,\n} from '@stencil/core';\nimport Popover from '../../utils/popover';\nimport { NavItemEventDetail } from '../../interface';\nimport { getNearestTabbableElement, getActiveElement } from '../../utils';\n\nlet dropDownIds = 0;\n\n/**\n * Dropdowns show additional content in a panel.\n * Designed to work well with nano-menu components to provide a list of options (`nano-nav-items` / `nano-option`).\n * @slot trigger - The dropdown's trigger.\n * @slot - The dropdown's content.\n */\n@Component({\n tag: 'nano-dropdown',\n styleUrl: 'dropdown.scss',\n shadow: true,\n})\nexport class Dropdown implements ComponentInterface {\n private dropdownId = `dropdown-${dropDownIds++}`;\n private labelId = this.dropdownId + '-title';\n private ignoreOpenWatcher = false;\n private panel: HTMLElement;\n private popover: Popover;\n private trigger: HTMLElement;\n private positioner: HTMLElement;\n private accessibleTrigger: HTMLElement;\n private didLoad = false;\n private get menu() {\n return this.host.querySelector('nano-menu') as HTMLNanoMenuElement;\n }\n\n @Element() host: HTMLNanoDropdownElement;\n\n /** Determines if the dropdown should open automatically when the trigger is clicked */\n @Prop() autoOpen = true;\n\n /** Indicates whether or not the dropdown is open. You can use this in lieu of the show/hide methods. */\n @Prop({ mutable: true, reflect: true }) open = false;\n\n @Watch('open')\n handleOpenChange() {\n if (this.ignoreOpenWatcher) return;\n\n this.open ? this.show() : this.hide();\n\n if (this.accessibleTrigger) {\n this.accessibleTrigger.setAttribute(\n 'aria-expanded',\n this.open.toString()\n );\n return;\n }\n\n this.updateAccessibleTrigger();\n }\n\n /**\n * Determines whether the dropdown should hide when a menu item is selected.\n */\n @Prop() closeOnSelect = true;\n\n /**\n * The dropdown will close when the user interacts outside of this element (e.g. clicking).\n */\n @Prop({ mutable: true }) containingElement: HTMLElement;\n\n /**\n * If you don't want to use the trigger slot, you can use this to 'tether' the dropdown to another element.\n * And you will still need to control when the component is opened (using show() / hide() or the `open` prop)\n */\n @Prop() tetherTo: HTMLElement = null;\n\n @Watch('tetherTo')\n handleTetherToChange() {\n this.createPopover();\n this.updateAccessibleTrigger();\n }\n\n /**\n * The preferred placement of the dropdown panel. Note that the actual placement may vary as needed to keep the panel\n * inside of the viewport.\n */\n @Prop() placement:\n | 'top'\n | 'top-start'\n | 'top-end'\n | 'bottom'\n | 'bottom-start'\n | 'bottom-end'\n | 'right'\n | 'right-start'\n | 'right-end'\n | 'left'\n | 'left-start'\n | 'left-end' = 'bottom-start';\n\n /**\n * The distance in pixels from which to offset the panel away from its trigger.\n */\n @Prop() distance = 2;\n\n /**\n * The distance in pixels from which to offset the panel along its trigger.\n */\n @Prop() skidding = 0;\n\n /**\n * Enable this option to prevent the panel from being clipped when the component is placed inside a container with\n * `overflow: auto|scroll`.\n */\n @Prop() hoist = false;\n\n @Watch('placement')\n @Watch('distance')\n @Watch('skidding')\n @Watch('hoist')\n handlePopoverOptionsChange() {\n this.popover.setOptions({\n strategy: this.hoist ? 'fixed' : 'absolute',\n placement: this.placement,\n skidding: this.skidding,\n distance: this.distance,\n });\n }\n\n /**\n * Title used to describe the dropdown content for accessibility\n */\n @Prop() dialogTitle!: string;\n\n // Events\n\n /**\n * Emitted when the dropdown opens. Calling `event.preventDefault()` will prevent it from being opened.\n */\n @Event() nanoShow: EventEmitter;\n\n /**\n * Emitted after the dropdown opens and all transitions are complete.\n */\n @Event() nanoAfterShow: EventEmitter;\n\n /**\n * Emitted when the dropdown closes. Calling `event.preventDefault()` will prevent it from being closed.\n */\n @Event() nanoHide: EventEmitter;\n\n /**\n * Emitted after the dropdown closes and all transitions are complete.\n */\n @Event() nanoAfterHide: EventEmitter;\n\n // Listeners\n\n @Listen('nanoOpen')\n secondaryOpen(ev: CustomEvent) {\n if (!(ev.detail as NavItemEventDetail).secondaryMenu) return;\n ev.stopPropagation();\n\n this.panel.classList.add('loading');\n this.panel.addEventListener(\n 'transitionend',\n () => {\n this.panel.classList.remove('loading');\n },\n { once: true }\n );\n\n this.panel.style.minHeight =\n (ev.detail as NavItemEventDetail).secondaryMenu.scrollHeight + 'px';\n }\n\n @Listen('nanoClose')\n secondaryClose(ev: CustomEvent) {\n if (!(ev.detail as NavItemEventDetail).secondaryMenu) return;\n ev.stopPropagation();\n if (!(ev.target as HTMLElement).parentElement) return;\n this.panel.style.minHeight =\n (ev.target as HTMLElement).parentElement.scrollHeight + 'px';\n }\n\n @Listen('nanoSelect')\n handlePanelSelect(event: CustomEvent) {\n const target = event.target as HTMLElement;\n\n // Hide the dropdown when a menu item is selected\n if (this.closeOnSelect && target.tagName.toLowerCase() === 'nano-menu')\n this.hide();\n }\n\n // Methods\n\n /** Shows the dropdown panel */\n @Method()\n async show() {\n this.ignoreOpenWatcher = true;\n this.open = true;\n\n const nanoShow = this.nanoShow.emit();\n\n if (nanoShow.defaultPrevented) {\n this.open = false;\n this.ignoreOpenWatcher = false;\n return;\n }\n\n this.popover.show();\n this.ignoreOpenWatcher = false;\n\n document.addEventListener('mousedown', this.handleDocumentMouseDown);\n document.addEventListener('keydown', this.handleDocumentKeyDown);\n }\n\n /** Hides the dropdown panel */\n @Method()\n async hide() {\n this.ignoreOpenWatcher = true;\n this.open = false;\n\n const nanoHide = this.nanoHide.emit();\n\n if (nanoHide.defaultPrevented) {\n this.open = true;\n this.ignoreOpenWatcher = false;\n return;\n }\n\n if (this.popover) this.popover.hide();\n this.ignoreOpenWatcher = false;\n\n document.removeEventListener('mousedown', this.handleDocumentMouseDown);\n document.removeEventListener('keydown', this.handleDocumentKeyDown);\n\n if (this.accessibleTrigger && this.focusEleInDropDwn()) {\n this.accessibleTrigger.focus();\n }\n }\n\n // Private methods\n\n /** Decides if the current active element or element\n * connected to the current event is connected to the Dropdown\n */\n private focusEleInDropDwn(e?: Event) {\n const activeElement = getActiveElement();\n\n if (e && e.composedPath()?.length) {\n const ddInPath = e.composedPath().includes(this.containingElement);\n return !e.composedPath().includes(this.accessibleTrigger) && ddInPath;\n }\n\n return (\n activeElement &&\n activeElement.closest(this.containingElement.tagName.toLowerCase()) ===\n this.containingElement &&\n activeElement !== this.accessibleTrigger\n );\n }\n\n private togglePanel = () => {\n if (!this.autoOpen) return;\n this.open ? this.hide() : this.show();\n };\n\n // Slotted triggers can be arbitrary content, but we need to link them to the dropdown panel with `aria-haspopup` and\n // `aria-expanded`. These must be applied to the \"accessible trigger\" (the tabbable portion of the trigger element\n // that gets slotted in) so screen readers will understand them. The accessible trigger could be the slotted element,\n private updateAccessibleTrigger() {\n if (!this.didLoad) return;\n\n let accessibleTrigger: HTMLElement;\n this.accessibleTrigger = null;\n\n if (!this.tetherTo) {\n const assignedElements = Array.from(\n this.host.querySelectorAll('[slot=\"trigger\"]')\n );\n accessibleTrigger = assignedElements.map(getNearestTabbableElement)[0];\n } else {\n accessibleTrigger = getNearestTabbableElement(this.tetherTo);\n }\n\n if (accessibleTrigger) {\n accessibleTrigger.setAttribute('aria-haspopup', 'true');\n accessibleTrigger.setAttribute(\n 'aria-expanded',\n this.open ? 'true' : 'false'\n );\n this.accessibleTrigger = accessibleTrigger;\n }\n }\n\n // Handlers\n\n private handleDocumentKeyDown(event: KeyboardEvent) {\n // Close when escape is pressed\n if (event.key === 'Escape') {\n this.hide();\n return;\n }\n\n // Close when tabbing results in the focus leaving the close element\n if (event.key === 'Tab') {\n setTimeout(() => {\n if (\n document.activeElement &&\n document.activeElement.closest(\n this.containingElement.tagName.toLowerCase()\n ) !== this.containingElement\n ) {\n this.hide();\n return;\n }\n });\n }\n\n // If a menu is present, focus on it when certain keys are pressed\n if (this.menu && ['ArrowDown', 'ArrowUp'].includes(event.key)) {\n // must have menu item, must have pressed down, must be open and must not have focus within dd\n if (!this.open || this.focusEleInDropDwn(event)) return;\n event.preventDefault();\n this.menu.setFocus();\n return;\n }\n\n // All other keys focus the menu and pass the event through to menu (necessary for type-to-search to work)\n const ePath = event.composedPath();\n if (this.menu && ePath.length && !ePath.find((el) => el !== this.menu)) {\n this.menu.dispatchEvent(new KeyboardEvent(event.type, event));\n return;\n }\n }\n\n private handleDocumentMouseDown(event: MouseEvent) {\n // Close when clicking outside of the close element\n\n if (!this.focusEleInDropDwn(event)) {\n this.hide();\n return;\n }\n }\n\n private handleTriggerKeyDown = (event: KeyboardEvent) => {\n // Open the panel when pressing down or up while focused on the trigger\n if (['ArrowDown', 'ArrowUp', ' '].includes(event.key)) {\n this.show();\n event.preventDefault();\n event.stopPropagation();\n\n if (this.menu) this.menu.setFocus();\n }\n };\n\n private handleTriggerSlotChange = () => {\n this.updateAccessibleTrigger();\n };\n\n private createPopover() {\n if (this.popover) {\n if (this.open) this.hide();\n this.popover.destroy();\n this.popover = null;\n }\n\n this.popover = new Popover(this.tetherTo || this.trigger, this.positioner, {\n strategy: this.hoist ? 'fixed' : 'absolute',\n placement: this.placement,\n distance: this.distance,\n skidding: this.skidding,\n transitionElement: this.panel,\n onAfterHide: () => this.nanoAfterHide.emit(),\n onAfterShow: () => this.nanoAfterShow.emit(),\n onTransitionEnd: () => {\n if (!this.open) {\n this.panel.scrollTop = 0;\n } else if (this.menu) {\n this.menu.showActiveElement();\n }\n },\n });\n // Show on init if open\n if (this.open) {\n this.show();\n }\n }\n\n // Stencil hooks\n\n connectedCallback() {\n this.handleDocumentKeyDown = this.handleDocumentKeyDown.bind(this);\n this.handleDocumentMouseDown = this.handleDocumentMouseDown.bind(this);\n\n if (!this.containingElement) this.containingElement = this.host;\n }\n\n componentDidLoad() {\n this.didLoad = true;\n this.createPopover();\n setTimeout(() => this.updateAccessibleTrigger(), 100);\n }\n\n disconnectedCallback() {\n this.hide();\n if (this.popover) this.popover.destroy();\n }\n\n render() {\n return (\n <div\n part=\"base\"\n id={this.dropdownId}\n class={{\n dropdown: true,\n 'dropdown--open': this.open,\n }}\n >\n <span\n part=\"trigger\"\n class=\"dropdown__trigger\"\n ref={(el) => (this.trigger = el)}\n onKeyDown={this.handleTriggerKeyDown}\n onClick={this.togglePanel}\n >\n <slot name=\"trigger\" onSlotchange={this.handleTriggerSlotChange} />\n </span>\n\n <div ref={(el) => (this.positioner = el)} class=\"dropdown__positioner\">\n <div\n ref={(el) => (this.panel = el)}\n part=\"panel\"\n class={`dropdown__panel ${this.placement.split('-').join(' ')}`}\n aria-hidden={!this.open}\n role=\"dialog\"\n aria-modal=\"true\"\n aria-labelledby={this.dialogTitle ? this.labelId : undefined}\n >\n {this.dialogTitle && (\n <h2\n id={this.labelId}\n class=\"dropdown__accessible-title\"\n aria-live=\"polite\"\n >\n {this.dialogTitle}\n </h2>\n )}\n <slot />\n </div>\n </div>\n </div>\n );\n }\n}\n"]}
@@ -23,6 +23,7 @@ export declare class GlobalNav implements ComponentInterface {
23
23
  private debounceSetResizingState;
24
24
  private currSize;
25
25
  private thresholdsGoingUp;
26
+ private THRESHOLDLIMIT;
26
27
  private menuDiv;
27
28
  private menuBtn;
28
29
  private menuWrapDiv;
@@ -54,17 +54,15 @@ export declare class SplitPane implements ComponentInterface {
54
54
  snapThreshold: number;
55
55
  /** When changing `position` via property, the pane will animate into position. Make `animationDuration` 0 to disable. */
56
56
  animationDuration: number;
57
- /** @readonly - hook to know if the pane is currently being dragged */
58
- get isDragging(): boolean;
59
- private _isDragging;
60
57
  /** Emitted when the divider's position changes. */
61
58
  nanoReposition: EventEmitter;
59
+ /** Emitted when the divider is being dragged. */
60
+ nanoDragging: EventEmitter<number>;
62
61
  private animatePosition;
63
62
  private percentageToPixels;
64
63
  private pixelsToPercentage;
65
64
  private attachRO;
66
65
  private detachRO;
67
- private handleIsDragging;
68
66
  private handleDrag;
69
67
  private handleKeyDown;
70
68
  private handleResize;
@@ -1693,10 +1693,6 @@ export namespace Components {
1693
1693
  * Disables resizing. Note that the position may still change as a result of resizing the host element.
1694
1694
  */
1695
1695
  "disabled": boolean;
1696
- /**
1697
- * @readonly - hook to know if the pane is currently being dragged
1698
- */
1699
- "isDragging": boolean;
1700
1696
  /**
1701
1697
  * The current position of the divider from the primary panel's edge as a percentage 0-100. Defaults to 50% of the container's initial size.
1702
1698
  */
@@ -4006,9 +4002,9 @@ declare namespace LocalJSX {
4006
4002
  */
4007
4003
  "disabled"?: boolean;
4008
4004
  /**
4009
- * @readonly - hook to know if the pane is currently being dragged
4005
+ * Emitted when the divider is being dragged.
4010
4006
  */
4011
- "isDragging"?: boolean;
4007
+ "onNanoDragging"?: (event: CustomEvent<number>) => void;
4012
4008
  /**
4013
4009
  * Emitted when the divider's position changes.
4014
4010
  */
package/docs-json.json CHANGED
@@ -1,5 +1,5 @@
1
1
  {
2
- "timestamp": "2022-05-06T15:07:19",
2
+ "timestamp": "2022-05-18T08:50:04",
3
3
  "compiler": {
4
4
  "name": "@stencil/core",
5
5
  "version": "2.12.2",
@@ -12314,30 +12314,6 @@
12314
12314
  "getter": false,
12315
12315
  "setter": false
12316
12316
  },
12317
- {
12318
- "name": "isDragging",
12319
- "type": "boolean",
12320
- "mutable": false,
12321
- "attr": "is-dragging",
12322
- "reflectToAttr": true,
12323
- "docs": "",
12324
- "docsTags": [
12325
- {
12326
- "name": "readonly",
12327
- "text": "- hook to know if the pane is currently being dragged"
12328
- }
12329
- ],
12330
- "default": "false",
12331
- "values": [
12332
- {
12333
- "type": "boolean"
12334
- }
12335
- ],
12336
- "optional": false,
12337
- "required": false,
12338
- "getter": true,
12339
- "setter": false
12340
- },
12341
12317
  {
12342
12318
  "name": "position",
12343
12319
  "type": "number",
@@ -12456,6 +12432,15 @@
12456
12432
  ],
12457
12433
  "methods": [],
12458
12434
  "events": [
12435
+ {
12436
+ "event": "nanoDragging",
12437
+ "detail": "number",
12438
+ "bubbles": true,
12439
+ "cancelable": true,
12440
+ "composed": true,
12441
+ "docs": "Emitted when the divider is being dragged.",
12442
+ "docsTags": []
12443
+ },
12459
12444
  {
12460
12445
  "event": "nanoReposition",
12461
12446
  "detail": "any",
package/docs-vscode.json CHANGED
@@ -2313,10 +2313,6 @@
2313
2313
  "name": "disabled",
2314
2314
  "description": "Disables resizing. Note that the position may still change as a result of resizing the host element."
2315
2315
  },
2316
- {
2317
- "name": "is-dragging",
2318
- "description": ""
2319
- },
2320
2316
  {
2321
2317
  "name": "position",
2322
2318
  "description": "The current position of the divider from the primary panel's edge as a percentage 0-100. Defaults to 50% of the\ncontainer's initial size."