@nanoporetech-digital/components 3.13.0 → 4.0.0

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 (374) hide show
  1. package/CHANGELOG.md +51 -0
  2. package/dist/cjs/{algolia-data-533e3a95.js → algolia-data-ed53eaa8.js} +2 -2
  3. package/dist/cjs/{algolia-data-533e3a95.js.map → algolia-data-ed53eaa8.js.map} +1 -1
  4. package/dist/cjs/{component-store-5ad4de07.js → component-store-74d25f63.js} +2 -2
  5. package/dist/cjs/{component-store-5ad4de07.js.map → component-store-74d25f63.js.map} +1 -1
  6. package/dist/cjs/{form-control-80c69d1d.js → form-control-2e900f54.js} +2 -2
  7. package/dist/cjs/{form-control-80c69d1d.js.map → form-control-2e900f54.js.map} +1 -1
  8. package/dist/cjs/{index-46286eea.js → index-71f899a7.js} +85 -42
  9. package/dist/cjs/index-71f899a7.js.map +1 -0
  10. package/dist/cjs/{index-b13f69e7.js → index-99649bef.js} +2 -2
  11. package/dist/cjs/{index-b13f69e7.js.map → index-99649bef.js.map} +1 -1
  12. package/dist/cjs/loader.cjs.js +3 -3
  13. package/dist/cjs/loader.cjs.js.map +1 -1
  14. package/dist/cjs/nano-accordion.cjs.entry.js +1 -1
  15. package/dist/cjs/nano-alert.cjs.entry.js +2 -2
  16. package/dist/cjs/nano-algolia-filter.cjs.entry.js +3 -3
  17. package/dist/cjs/nano-algolia-input.cjs.entry.js +3 -3
  18. package/dist/cjs/nano-algolia-pagination.cjs.entry.js +2 -2
  19. package/dist/cjs/nano-algolia-results.cjs.entry.js +2 -2
  20. package/dist/cjs/nano-algolia.cjs.entry.js +3 -3
  21. package/dist/cjs/nano-aspect-ratio.cjs.entry.js +1 -1
  22. package/dist/cjs/nano-checkbox-group.cjs.entry.js +1 -1
  23. package/dist/cjs/nano-checkbox.cjs.entry.js +1 -1
  24. package/dist/cjs/nano-checkbox.cjs.entry.js.map +1 -1
  25. package/dist/cjs/nano-components.cjs.js +3 -3
  26. package/dist/cjs/nano-components.cjs.js.map +1 -1
  27. package/dist/cjs/nano-datalist_3.cjs.entry.js +1 -1
  28. package/dist/cjs/nano-date-input.cjs.entry.js +1 -1
  29. package/dist/cjs/nano-date-picker.cjs.entry.js +1 -1
  30. package/dist/cjs/nano-demo.cjs.entry.js +1 -1
  31. package/dist/cjs/nano-details.cjs.entry.js +2 -2
  32. package/dist/cjs/nano-dialog.cjs.entry.js +3 -3
  33. package/dist/cjs/nano-drawer.cjs.entry.js +2 -2
  34. package/dist/cjs/nano-drawer.cjs.entry.js.map +1 -1
  35. package/dist/cjs/nano-dropdown.cjs.entry.js +1 -1
  36. package/dist/cjs/nano-field-validator.cjs.entry.js +2 -2
  37. package/dist/cjs/nano-file-upload.cjs.entry.js +1 -1
  38. package/dist/cjs/nano-global-nav-user-profile_3.cjs.entry.js +5 -5
  39. package/dist/cjs/nano-global-nav-user-profile_3.cjs.entry.js.map +1 -1
  40. package/dist/cjs/nano-global-nav.cjs.entry.js +61 -75
  41. package/dist/cjs/nano-global-nav.cjs.entry.js.map +1 -1
  42. package/dist/cjs/nano-global-search-results.cjs.entry.js +1 -1
  43. package/dist/cjs/nano-grid_3.cjs.entry.js +2 -2
  44. package/dist/cjs/nano-grid_3.cjs.entry.js.map +1 -1
  45. package/dist/cjs/nano-hero.cjs.entry.js +2 -2
  46. package/dist/cjs/nano-hero.cjs.entry.js.map +1 -1
  47. package/dist/cjs/nano-icon-button.cjs.entry.js +1 -1
  48. package/dist/cjs/nano-icon.cjs.entry.js +2 -2
  49. package/dist/cjs/nano-icon.cjs.entry.js.map +1 -1
  50. package/dist/cjs/nano-input.cjs.entry.js +2 -2
  51. package/dist/cjs/nano-menu-drawer.cjs.entry.js +1 -1
  52. package/dist/cjs/nano-overflow-nav.cjs.entry.js +282 -0
  53. package/dist/cjs/nano-overflow-nav.cjs.entry.js.map +1 -0
  54. package/dist/cjs/nano-progress-bar_2.cjs.entry.js +1 -1
  55. package/dist/cjs/nano-progress-bar_2.cjs.entry.js.map +1 -1
  56. package/dist/cjs/nano-range.cjs.entry.js +1 -1
  57. package/dist/cjs/nano-range.cjs.entry.js.map +1 -1
  58. package/dist/cjs/nano-rating.cjs.entry.js +1 -1
  59. package/dist/cjs/nano-resize-observe_2.cjs.entry.js +4 -4
  60. package/dist/cjs/nano-resize-observe_2.cjs.entry.js.map +1 -1
  61. package/dist/cjs/nano-slide.cjs.entry.js +1 -1
  62. package/dist/cjs/nano-slides.cjs.entry.js +11 -14
  63. package/dist/cjs/nano-slides.cjs.entry.js.map +1 -1
  64. package/dist/cjs/nano-spinner.cjs.entry.js +1 -1
  65. package/dist/cjs/nano-spinner.cjs.entry.js.map +1 -1
  66. package/dist/cjs/nano-split-pane.cjs.entry.js +1 -1
  67. package/dist/cjs/nano-sticker.cjs.entry.js +1 -1
  68. package/dist/cjs/nano-tab-content.cjs.entry.js +1 -1
  69. package/dist/cjs/nano-tab-group.cjs.entry.js +4 -4
  70. package/dist/cjs/nano-tab.cjs.entry.js +2 -2
  71. package/dist/cjs/nano-tab.cjs.entry.js.map +1 -1
  72. package/dist/cjs/{nano-table-60c06885.js → nano-table-737365b7.js} +4 -4
  73. package/dist/cjs/{nano-table-60c06885.js.map → nano-table-737365b7.js.map} +1 -1
  74. package/dist/cjs/nano-table.cjs.entry.js +3 -3
  75. package/dist/cjs/{scroll-a197d9c4.js → scroll-6a9bedb4.js} +15 -8
  76. package/dist/cjs/scroll-6a9bedb4.js.map +1 -0
  77. package/dist/cjs/{table.worker-f902766e.js → table.worker-c3b11144.js} +4 -4
  78. package/dist/cjs/table.worker-c3b11144.js.map +1 -0
  79. package/dist/cjs/{transitions-5cd8f697.js → transitions-1205f12b.js} +3 -3
  80. package/dist/cjs/transitions-1205f12b.js.map +1 -0
  81. package/dist/collection/collection-manifest.json +2 -1
  82. package/dist/collection/components/checkbox/checkbox.css +3 -3
  83. package/dist/collection/components/drawer/drawer.css +1 -1
  84. package/dist/collection/components/global-nav/global-nav-user-profile.js +1 -1
  85. package/dist/collection/components/global-nav/global-nav-user-profile.js.map +1 -1
  86. package/dist/collection/components/global-nav/global-nav.js +60 -73
  87. package/dist/collection/components/global-nav/global-nav.js.map +1 -1
  88. package/dist/collection/components/global-nav/style/global-nav.css +4 -3
  89. package/dist/collection/components/hero/hero.css +2 -2
  90. package/dist/collection/components/icon/utils.js +1 -1
  91. package/dist/collection/components/icon/utils.js.map +1 -1
  92. package/dist/collection/components/img/img.css +1 -1
  93. package/dist/collection/components/input/input.css +3 -3
  94. package/dist/collection/components/nav-item/nav-item.css +2 -0
  95. package/dist/collection/components/overflow-nav/overflow-nav.css +223 -0
  96. package/dist/collection/components/overflow-nav/overflow-nav.js +441 -0
  97. package/dist/collection/components/overflow-nav/overflow-nav.js.map +1 -0
  98. package/dist/collection/components/progress-bar/progress-bar.css +2 -2
  99. package/dist/collection/components/range/range.css +1 -1
  100. package/dist/collection/components/resize-observe/resize-observe.js +5 -5
  101. package/dist/collection/components/resize-observe/resize-observe.js.map +1 -1
  102. package/dist/collection/components/select/select.css +3 -3
  103. package/dist/collection/components/slides/slides.css +5 -1
  104. package/dist/collection/components/slides/slides.js +9 -12
  105. package/dist/collection/components/slides/slides.js.map +1 -1
  106. package/dist/collection/components/spinner/spinner.css +2 -2
  107. package/dist/collection/components/tabs/tab.css +3 -3
  108. package/dist/collection/utils/scroll.js +14 -7
  109. package/dist/collection/utils/scroll.js.map +1 -1
  110. package/dist/collection/utils/transitions.js +2 -2
  111. package/dist/collection/utils/transitions.js.map +1 -1
  112. package/dist/components/global-nav-user-profile.js +1 -1
  113. package/dist/components/global-nav-user-profile.js.map +1 -1
  114. package/dist/components/icon.js +1 -1
  115. package/dist/components/icon.js.map +1 -1
  116. package/dist/components/img.js +1 -1
  117. package/dist/components/img.js.map +1 -1
  118. package/dist/components/index.d.ts +1 -0
  119. package/dist/components/index.js +1 -0
  120. package/dist/components/index.js.map +1 -1
  121. package/dist/components/nano-checkbox.js.map +1 -1
  122. package/dist/components/nano-drawer.js.map +1 -1
  123. package/dist/components/nano-global-nav.js +59 -74
  124. package/dist/components/nano-global-nav.js.map +1 -1
  125. package/dist/components/nano-hero.js +1 -1
  126. package/dist/components/nano-hero.js.map +1 -1
  127. package/dist/components/nano-overflow-nav.d.ts +11 -0
  128. package/dist/components/nano-overflow-nav.js +317 -0
  129. package/dist/components/nano-overflow-nav.js.map +1 -0
  130. package/dist/components/nano-range.js.map +1 -1
  131. package/dist/components/nano-slides.js +10 -13
  132. package/dist/components/nano-slides.js.map +1 -1
  133. package/dist/components/nano-tab.js +1 -1
  134. package/dist/components/nano-tab.js.map +1 -1
  135. package/dist/components/nav-item.js +1 -1
  136. package/dist/components/nav-item.js.map +1 -1
  137. package/dist/components/progress-bar.js.map +1 -1
  138. package/dist/components/resize-observe.js +3 -3
  139. package/dist/components/resize-observe.js.map +1 -1
  140. package/dist/components/scroll.js +14 -7
  141. package/dist/components/scroll.js.map +1 -1
  142. package/dist/components/spinner.js.map +1 -1
  143. package/dist/components/transitions.js +2 -2
  144. package/dist/components/transitions.js.map +1 -1
  145. package/dist/esm/{algolia-data-e5e86f12.js → algolia-data-ef2829e0.js} +2 -2
  146. package/dist/esm/{algolia-data-e5e86f12.js.map → algolia-data-ef2829e0.js.map} +1 -1
  147. package/dist/esm/{component-store-2044c2c2.js → component-store-244a8431.js} +2 -2
  148. package/dist/esm/{component-store-2044c2c2.js.map → component-store-244a8431.js.map} +1 -1
  149. package/dist/esm/{form-control-4f3a88a1.js → form-control-269ba84f.js} +2 -2
  150. package/dist/esm/{form-control-4f3a88a1.js.map → form-control-269ba84f.js.map} +1 -1
  151. package/dist/esm/{index-728dda31.js → index-5d0f4704.js} +2 -2
  152. package/dist/esm/{index-728dda31.js.map → index-5d0f4704.js.map} +1 -1
  153. package/dist/esm/{index-52b0408e.js → index-dad5627b.js} +85 -42
  154. package/dist/esm/index-dad5627b.js.map +1 -0
  155. package/dist/esm/loader.js +4 -4
  156. package/dist/esm/loader.js.map +1 -1
  157. package/dist/esm/nano-accordion.entry.js +1 -1
  158. package/dist/esm/nano-alert.entry.js +2 -2
  159. package/dist/esm/nano-algolia-filter.entry.js +3 -3
  160. package/dist/esm/nano-algolia-input.entry.js +3 -3
  161. package/dist/esm/nano-algolia-pagination.entry.js +2 -2
  162. package/dist/esm/nano-algolia-results.entry.js +2 -2
  163. package/dist/esm/nano-algolia.entry.js +3 -3
  164. package/dist/esm/nano-aspect-ratio.entry.js +1 -1
  165. package/dist/esm/nano-checkbox-group.entry.js +1 -1
  166. package/dist/esm/nano-checkbox.entry.js +1 -1
  167. package/dist/esm/nano-checkbox.entry.js.map +1 -1
  168. package/dist/esm/nano-components.js +4 -4
  169. package/dist/esm/nano-components.js.map +1 -1
  170. package/dist/esm/nano-datalist_3.entry.js +1 -1
  171. package/dist/esm/nano-date-input.entry.js +1 -1
  172. package/dist/esm/nano-date-picker.entry.js +1 -1
  173. package/dist/esm/nano-demo.entry.js +1 -1
  174. package/dist/esm/nano-details.entry.js +2 -2
  175. package/dist/esm/nano-dialog.entry.js +3 -3
  176. package/dist/esm/nano-drawer.entry.js +2 -2
  177. package/dist/esm/nano-drawer.entry.js.map +1 -1
  178. package/dist/esm/nano-dropdown.entry.js +1 -1
  179. package/dist/esm/nano-field-validator.entry.js +2 -2
  180. package/dist/esm/nano-file-upload.entry.js +1 -1
  181. package/dist/esm/nano-global-nav-user-profile_3.entry.js +5 -5
  182. package/dist/esm/nano-global-nav-user-profile_3.entry.js.map +1 -1
  183. package/dist/esm/nano-global-nav.entry.js +61 -75
  184. package/dist/esm/nano-global-nav.entry.js.map +1 -1
  185. package/dist/esm/nano-global-search-results.entry.js +1 -1
  186. package/dist/esm/nano-grid_3.entry.js +2 -2
  187. package/dist/esm/nano-grid_3.entry.js.map +1 -1
  188. package/dist/esm/nano-hero.entry.js +2 -2
  189. package/dist/esm/nano-hero.entry.js.map +1 -1
  190. package/dist/esm/nano-icon-button.entry.js +1 -1
  191. package/dist/esm/nano-icon.entry.js +2 -2
  192. package/dist/esm/nano-icon.entry.js.map +1 -1
  193. package/dist/esm/nano-input.entry.js +2 -2
  194. package/dist/esm/nano-menu-drawer.entry.js +1 -1
  195. package/dist/esm/nano-overflow-nav.entry.js +278 -0
  196. package/dist/esm/nano-overflow-nav.entry.js.map +1 -0
  197. package/dist/esm/nano-progress-bar_2.entry.js +1 -1
  198. package/dist/esm/nano-progress-bar_2.entry.js.map +1 -1
  199. package/dist/esm/nano-range.entry.js +1 -1
  200. package/dist/esm/nano-range.entry.js.map +1 -1
  201. package/dist/esm/nano-rating.entry.js +1 -1
  202. package/dist/esm/nano-resize-observe_2.entry.js +4 -4
  203. package/dist/esm/nano-resize-observe_2.entry.js.map +1 -1
  204. package/dist/esm/nano-slide.entry.js +1 -1
  205. package/dist/esm/nano-slides.entry.js +11 -14
  206. package/dist/esm/nano-slides.entry.js.map +1 -1
  207. package/dist/esm/nano-spinner.entry.js +1 -1
  208. package/dist/esm/nano-spinner.entry.js.map +1 -1
  209. package/dist/esm/nano-split-pane.entry.js +1 -1
  210. package/dist/esm/nano-sticker.entry.js +1 -1
  211. package/dist/esm/nano-tab-content.entry.js +1 -1
  212. package/dist/esm/nano-tab-group.entry.js +4 -4
  213. package/dist/esm/nano-tab.entry.js +2 -2
  214. package/dist/esm/nano-tab.entry.js.map +1 -1
  215. package/dist/esm/{nano-table-e64af51e.js → nano-table-75d755ae.js} +4 -4
  216. package/dist/esm/{nano-table-e64af51e.js.map → nano-table-75d755ae.js.map} +1 -1
  217. package/dist/esm/nano-table.entry.js +3 -3
  218. package/dist/esm/{scroll-e5825d8d.js → scroll-952d292a.js} +15 -8
  219. package/dist/esm/scroll-952d292a.js.map +1 -0
  220. package/dist/esm/{table.worker-2f887b5f.js → table.worker-d60d6df4.js} +4 -4
  221. package/dist/esm/table.worker-d60d6df4.js.map +1 -0
  222. package/dist/esm/{transitions-71cca3ed.js → transitions-686c5fec.js} +3 -3
  223. package/dist/esm/transitions-686c5fec.js.map +1 -0
  224. package/dist/nano-components/nano-components.css +1 -1
  225. package/dist/nano-components/nano-components.esm.js +1 -1
  226. package/dist/nano-components/nano-components.esm.js.map +1 -1
  227. package/dist/nano-components/{p-f25d2e90.entry.js → p-053eb1df.entry.js} +2 -2
  228. package/dist/nano-components/{p-ad3ddbc8.entry.js → p-068bdd89.entry.js} +2 -2
  229. package/dist/nano-components/{p-e4505f00.entry.js → p-0d1ca590.entry.js} +2 -2
  230. package/dist/nano-components/{p-ece694af.entry.js → p-104b7e3a.entry.js} +2 -2
  231. package/dist/nano-components/p-104b7e3a.entry.js.map +1 -0
  232. package/dist/nano-components/p-107d4549.entry.js +5 -0
  233. package/dist/nano-components/p-107d4549.entry.js.map +1 -0
  234. package/dist/nano-components/p-15217442.entry.js +5 -0
  235. package/dist/nano-components/p-15217442.entry.js.map +1 -0
  236. package/dist/nano-components/p-1b7bad31.entry.js +5 -0
  237. package/dist/nano-components/{p-93bece01.entry.js → p-1c6c94cb.entry.js} +2 -2
  238. package/dist/nano-components/{p-a9beb006.entry.js → p-207a1fbc.entry.js} +2 -2
  239. package/dist/nano-components/{p-d32dafd9.entry.js → p-239d343a.entry.js} +2 -2
  240. package/dist/nano-components/{p-d32dafd9.entry.js.map → p-239d343a.entry.js.map} +1 -1
  241. package/dist/nano-components/{p-dab8526f.entry.js → p-288dbe6b.entry.js} +2 -2
  242. package/dist/nano-components/{p-7b21ec0b.entry.js → p-30d55046.entry.js} +2 -2
  243. package/dist/nano-components/{p-add3ac22.js → p-42e7f253.js} +2 -2
  244. package/dist/nano-components/{p-378fe272.entry.js → p-57085052.entry.js} +2 -2
  245. package/dist/nano-components/{p-8f888280.entry.js → p-578f5e8d.entry.js} +2 -2
  246. package/dist/nano-components/{p-17eebe94.entry.js → p-583d8d70.entry.js} +2 -2
  247. package/dist/nano-components/p-583d8d70.entry.js.map +1 -0
  248. package/dist/nano-components/{p-6bb4545b.entry.js → p-5984ae16.entry.js} +2 -2
  249. package/dist/nano-components/{p-76d8a8a8.js → p-5ac74848.js} +2 -2
  250. package/dist/nano-components/{p-ebb61a70.entry.js → p-5d466a58.entry.js} +2 -2
  251. package/dist/nano-components/p-60a8c896.js +5 -0
  252. package/dist/nano-components/{p-e113074e.entry.js → p-68928c59.entry.js} +2 -2
  253. package/dist/nano-components/p-68928c59.entry.js.map +1 -0
  254. package/dist/nano-components/{p-3667832c.entry.js → p-7304107c.entry.js} +2 -2
  255. package/dist/nano-components/{p-16e45583.entry.js → p-76a650b1.entry.js} +2 -2
  256. package/dist/nano-components/{p-09751447.entry.js → p-7d6065c6.entry.js} +2 -2
  257. package/dist/nano-components/{p-07b6af21.entry.js → p-935aef3d.entry.js} +2 -2
  258. package/dist/nano-components/{p-8065d85b.entry.js → p-93cfbdb6.entry.js} +2 -2
  259. package/dist/nano-components/p-9dfe2c55.entry.js +5 -0
  260. package/dist/nano-components/{p-f486c940.entry.js.map → p-9dfe2c55.entry.js.map} +1 -1
  261. package/dist/nano-components/{p-b65e0e63.js → p-9ebbb814.js} +2 -2
  262. package/dist/nano-components/{p-a26a7de3.entry.js → p-a1c0afb6.entry.js} +2 -2
  263. package/dist/nano-components/{p-76ab079e.entry.js → p-a5a560e7.entry.js} +2 -2
  264. package/dist/nano-components/{p-9d1432be.js → p-a6ff5ca6.js} +2 -2
  265. package/dist/nano-components/{p-4bbb04d3.entry.js → p-a761ac89.entry.js} +2 -2
  266. package/dist/nano-components/p-a761ac89.entry.js.map +1 -0
  267. package/dist/nano-components/{p-62e3646b.entry.js → p-ac0ac58f.entry.js} +2 -2
  268. package/dist/nano-components/p-b2655717.entry.js +5 -0
  269. package/dist/nano-components/p-b2655717.entry.js.map +1 -0
  270. package/dist/nano-components/{p-63f1e229.entry.js → p-b6306aff.entry.js} +2 -2
  271. package/dist/nano-components/p-b6306aff.entry.js.map +1 -0
  272. package/dist/nano-components/{p-3e7153c8.entry.js → p-cba50c3e.entry.js} +2 -2
  273. package/dist/nano-components/{p-ce07df57.entry.js → p-cd2f5e97.entry.js} +2 -2
  274. package/dist/nano-components/p-d0e15e46.entry.js +5 -0
  275. package/dist/nano-components/p-d0e15e46.entry.js.map +1 -0
  276. package/dist/nano-components/p-d4cebdef.entry.js +5 -0
  277. package/dist/nano-components/p-d4cebdef.entry.js.map +1 -0
  278. package/dist/nano-components/{p-dc88e52b.entry.js → p-d792f692.entry.js} +2 -2
  279. package/dist/nano-components/p-d792f692.entry.js.map +1 -0
  280. package/dist/nano-components/p-d7c34990.js +5 -0
  281. package/dist/nano-components/{p-45b7682a.js.map → p-d7c34990.js.map} +1 -1
  282. package/dist/nano-components/p-d98c6a62.js +5 -0
  283. package/dist/nano-components/{p-3d27d563.entry.js → p-db370094.entry.js} +4 -4
  284. package/dist/nano-components/{p-3d27d563.entry.js.map → p-db370094.entry.js.map} +1 -1
  285. package/dist/nano-components/{p-47866646.entry.js → p-e41baa11.entry.js} +2 -2
  286. package/dist/nano-components/{p-9be2cba5.entry.js → p-e43f76c8.entry.js} +2 -2
  287. package/dist/nano-components/{p-7f545755.entry.js → p-eab09335.entry.js} +2 -2
  288. package/dist/nano-components/p-f471a392.entry.js +5 -0
  289. package/dist/nano-components/p-f471a392.entry.js.map +1 -0
  290. package/dist/nano-components/p-f6a8467a.js +6 -0
  291. package/dist/nano-components/p-f6a8467a.js.map +1 -0
  292. package/dist/nano-components/p-f6de2d5d.js +5 -0
  293. package/dist/nano-components/p-f6de2d5d.js.map +1 -0
  294. package/dist/nano-components/{p-a20d2028.entry.js → p-f93bd976.entry.js} +2 -2
  295. package/dist/nano-components/{p-36a2f1c0.entry.js → p-fe7a0158.entry.js} +2 -2
  296. package/dist/nano-components/{p-6a5ae656.entry.js → p-fecb72b9.entry.js} +2 -2
  297. package/dist/themes/nanopore.cn.css +1 -0
  298. package/dist/themes/nanopore.cn.css.map +1 -0
  299. package/dist/types/components/global-nav/global-nav.d.ts +2 -1
  300. package/dist/types/components/overflow-nav/overflow-nav.d.ts +78 -0
  301. package/dist/types/components/resize-observe/resize-observe.d.ts +4 -2
  302. package/dist/types/components.d.ts +90 -1
  303. package/dist/types/utils/transitions.d.ts +1 -1
  304. package/docs-json.json +299 -23
  305. package/docs-vscode.json +26 -1
  306. package/hydrate/index.js +431 -116
  307. package/package.json +3 -3
  308. package/dist/cjs/index-46286eea.js.map +0 -1
  309. package/dist/cjs/scroll-a197d9c4.js.map +0 -1
  310. package/dist/cjs/table.worker-f902766e.js.map +0 -1
  311. package/dist/cjs/transitions-5cd8f697.js.map +0 -1
  312. package/dist/esm/index-52b0408e.js.map +0 -1
  313. package/dist/esm/scroll-e5825d8d.js.map +0 -1
  314. package/dist/esm/table.worker-2f887b5f.js.map +0 -1
  315. package/dist/esm/transitions-71cca3ed.js.map +0 -1
  316. package/dist/nano-components/p-0e2f0040.entry.js +0 -5
  317. package/dist/nano-components/p-0e2f0040.entry.js.map +0 -1
  318. package/dist/nano-components/p-167b9165.js +0 -5
  319. package/dist/nano-components/p-167b9165.js.map +0 -1
  320. package/dist/nano-components/p-17eebe94.entry.js.map +0 -1
  321. package/dist/nano-components/p-1aff5304.entry.js +0 -5
  322. package/dist/nano-components/p-1aff5304.entry.js.map +0 -1
  323. package/dist/nano-components/p-45b7682a.js +0 -5
  324. package/dist/nano-components/p-4bbb04d3.entry.js.map +0 -1
  325. package/dist/nano-components/p-63f1e229.entry.js.map +0 -1
  326. package/dist/nano-components/p-6ef53fa1.js +0 -6
  327. package/dist/nano-components/p-6ef53fa1.js.map +0 -1
  328. package/dist/nano-components/p-7733f1f8.entry.js +0 -5
  329. package/dist/nano-components/p-7733f1f8.entry.js.map +0 -1
  330. package/dist/nano-components/p-80ddfa30.entry.js +0 -5
  331. package/dist/nano-components/p-80ecc273.entry.js +0 -5
  332. package/dist/nano-components/p-80ecc273.entry.js.map +0 -1
  333. package/dist/nano-components/p-a145fbc1.js +0 -5
  334. package/dist/nano-components/p-b4b55f64.entry.js +0 -5
  335. package/dist/nano-components/p-b4b55f64.entry.js.map +0 -1
  336. package/dist/nano-components/p-d518b939.js +0 -5
  337. package/dist/nano-components/p-dc88e52b.entry.js.map +0 -1
  338. package/dist/nano-components/p-e113074e.entry.js.map +0 -1
  339. package/dist/nano-components/p-ece694af.entry.js.map +0 -1
  340. package/dist/nano-components/p-f486c940.entry.js +0 -5
  341. /package/dist/nano-components/{p-f25d2e90.entry.js.map → p-053eb1df.entry.js.map} +0 -0
  342. /package/dist/nano-components/{p-ad3ddbc8.entry.js.map → p-068bdd89.entry.js.map} +0 -0
  343. /package/dist/nano-components/{p-e4505f00.entry.js.map → p-0d1ca590.entry.js.map} +0 -0
  344. /package/dist/nano-components/{p-80ddfa30.entry.js.map → p-1b7bad31.entry.js.map} +0 -0
  345. /package/dist/nano-components/{p-93bece01.entry.js.map → p-1c6c94cb.entry.js.map} +0 -0
  346. /package/dist/nano-components/{p-a9beb006.entry.js.map → p-207a1fbc.entry.js.map} +0 -0
  347. /package/dist/nano-components/{p-dab8526f.entry.js.map → p-288dbe6b.entry.js.map} +0 -0
  348. /package/dist/nano-components/{p-7b21ec0b.entry.js.map → p-30d55046.entry.js.map} +0 -0
  349. /package/dist/nano-components/{p-add3ac22.js.map → p-42e7f253.js.map} +0 -0
  350. /package/dist/nano-components/{p-378fe272.entry.js.map → p-57085052.entry.js.map} +0 -0
  351. /package/dist/nano-components/{p-8f888280.entry.js.map → p-578f5e8d.entry.js.map} +0 -0
  352. /package/dist/nano-components/{p-6bb4545b.entry.js.map → p-5984ae16.entry.js.map} +0 -0
  353. /package/dist/nano-components/{p-76d8a8a8.js.map → p-5ac74848.js.map} +0 -0
  354. /package/dist/nano-components/{p-ebb61a70.entry.js.map → p-5d466a58.entry.js.map} +0 -0
  355. /package/dist/nano-components/{p-d518b939.js.map → p-60a8c896.js.map} +0 -0
  356. /package/dist/nano-components/{p-3667832c.entry.js.map → p-7304107c.entry.js.map} +0 -0
  357. /package/dist/nano-components/{p-16e45583.entry.js.map → p-76a650b1.entry.js.map} +0 -0
  358. /package/dist/nano-components/{p-09751447.entry.js.map → p-7d6065c6.entry.js.map} +0 -0
  359. /package/dist/nano-components/{p-07b6af21.entry.js.map → p-935aef3d.entry.js.map} +0 -0
  360. /package/dist/nano-components/{p-8065d85b.entry.js.map → p-93cfbdb6.entry.js.map} +0 -0
  361. /package/dist/nano-components/{p-b65e0e63.js.map → p-9ebbb814.js.map} +0 -0
  362. /package/dist/nano-components/{p-a26a7de3.entry.js.map → p-a1c0afb6.entry.js.map} +0 -0
  363. /package/dist/nano-components/{p-76ab079e.entry.js.map → p-a5a560e7.entry.js.map} +0 -0
  364. /package/dist/nano-components/{p-9d1432be.js.map → p-a6ff5ca6.js.map} +0 -0
  365. /package/dist/nano-components/{p-62e3646b.entry.js.map → p-ac0ac58f.entry.js.map} +0 -0
  366. /package/dist/nano-components/{p-3e7153c8.entry.js.map → p-cba50c3e.entry.js.map} +0 -0
  367. /package/dist/nano-components/{p-ce07df57.entry.js.map → p-cd2f5e97.entry.js.map} +0 -0
  368. /package/dist/nano-components/{p-a145fbc1.js.map → p-d98c6a62.js.map} +0 -0
  369. /package/dist/nano-components/{p-47866646.entry.js.map → p-e41baa11.entry.js.map} +0 -0
  370. /package/dist/nano-components/{p-9be2cba5.entry.js.map → p-e43f76c8.entry.js.map} +0 -0
  371. /package/dist/nano-components/{p-7f545755.entry.js.map → p-eab09335.entry.js.map} +0 -0
  372. /package/dist/nano-components/{p-a20d2028.entry.js.map → p-f93bd976.entry.js.map} +0 -0
  373. /package/dist/nano-components/{p-36a2f1c0.entry.js.map → p-fe7a0158.entry.js.map} +0 -0
  374. /package/dist/nano-components/{p-6a5ae656.entry.js.map → p-fecb72b9.entry.js.map} +0 -0
@@ -1 +0,0 @@
1
- {"file":"scroll-e5825d8d.js","mappings":";;;;;AAEA,MAAM,KAAK,GAAG,IAAI,GAAG,EAAE,CAAC;AAExB;;;;SAIgB,iBAAiB,CAAC,SAAsB;EACtD,KAAK,CAAC,GAAG,CAAC,SAAS,CAAC,CAAC;EACrB,QAAQ,CAAC,IAAI,CAAC,SAAS,CAAC,GAAG,CAAC,kBAAkB,CAAC,CAAC;AAClD,CAAC;AAED;;;SAGgB,mBAAmB,CAAC,SAAsB;EACxD,KAAK,CAAC,MAAM,CAAC,SAAS,CAAC,CAAC;EAExB,IAAI,KAAK,CAAC,IAAI,KAAK,CAAC,EAAE;IACpB,QAAQ,CAAC,IAAI,CAAC,SAAS,CAAC,MAAM,CAAC,kBAAkB,CAAC,CAAC;GACpD;AACH,CAAC;AAED,SAAS,QAAQ,CACf,OAAoB,EACpB,SAAiB,EACjB,WAAoB,KAAK;EAEzB,IAAI,CAAC,QAAQ,EAAE;IACb,IAAI;MACF,OAAO,CAAC,QAAQ,CAAC,EAAE,IAAI,EAAE,SAAS,EAAE,QAAQ,EAAE,QAAQ,EAAE,CAAC,CAAC;KAC3D;IAAC,OAAO,CAAC,EAAE;MACV,OAAO,CAAC,UAAU,GAAG,SAAS,CAAC;KAChC;IACD,OAAO;GACR;EACD,IAAI;IACF,OAAO,CAAC,QAAQ,CAAC,EAAE,GAAG,EAAE,SAAS,EAAE,QAAQ,EAAE,QAAQ,EAAE,CAAC,CAAC;GAC1D;EAAC,OAAO,CAAC,EAAE;IACV,OAAO,CAAC,SAAS,GAAG,SAAS,CAAC;GAC/B;AACH,CAAC;AAED;;;SAGgB,cAAc,CAC5B,OAAoB,EACpB,SAAsB,EACtB,YAAgD,UAAU,EAC1D,WAA+B,OAAO;EAEtC,MAAM,MAAM,GAAG,SAAS,CAAC,OAAO,EAAE,SAAS,CAAC,CAAC;EAC7C,MAAM,SAAS,GAAG,MAAM,CAAC,GAAG,GAAG,SAAS,CAAC,SAAS,CAAC;EACnD,MAAM,UAAU,GAAG,MAAM,CAAC,IAAI,GAAG,SAAS,CAAC,UAAU,CAAC;EACtD,MAAM,IAAI,GAAG,SAAS,CAAC,UAAU,CAAC;EAClC,MAAM,IAAI,GAAG,SAAS,CAAC,UAAU,GAAG,SAAS,CAAC,WAAW,CAAC;EAC1D,MAAM,IAAI,GAAG,SAAS,CAAC,SAAS,CAAC;EACjC,MAAM,IAAI,GAAG,SAAS,CAAC,SAAS,GAAG,SAAS,CAAC,YAAY,CAAC;EAE1D,IAAI,SAAS,KAAK,YAAY,IAAI,SAAS,KAAK,MAAM,EAAE;IACtD,IAAI,QAAQ,KAAK,OAAO,EAAE;MACxB,IAAI,UAAU,GAAG,IAAI;QAAE,QAAQ,CAAC,SAAS,EAAE,UAAU,CAAC,CAAC;WAClD,IAAI,UAAU,GAAG,OAAO,CAAC,WAAW,GAAG,IAAI;QAC9C,QAAQ,CACN,SAAS,EACT,UAAU,GAAG,SAAS,CAAC,WAAW,GAAG,OAAO,CAAC,WAAW,CACzD,CAAC;KACL;;MACC,QAAQ,CACN,SAAS,EACT,SAAS,CAAC,UAAU;QAClB,MAAM,CAAC,IAAI;QACX,SAAS,CAAC,WAAW,GAAG,CAAC;QACzB,OAAO,CAAC,WAAW,GAAG,CAAC,CAC1B,CAAC;GACL;EAED,IAAI,SAAS,KAAK,UAAU,IAAI,SAAS,KAAK,MAAM,EAAE;IACpD,IAAI,SAAS,GAAG,IAAI;MAAE,QAAQ,CAAC,SAAS,EAAE,SAAS,EAAE,IAAI,CAAC,CAAC;SACtD,IAAI,SAAS,GAAG,OAAO,CAAC,YAAY,GAAG,IAAI,EAAE;MAChD,QAAQ,CACN,SAAS,EACT,SAAS,GAAG,SAAS,CAAC,YAAY,GAAG,OAAO,CAAC,YAAY,EACzD,IAAI,CACL,CAAC;KACH;GACF;AACH;;;;","names":[],"sources":["./src/utils/scroll.ts"],"sourcesContent":["import { getOffset } from './dom';\n\nconst locks = new Set();\n\n/**\n * Prevents body scrolling. Keeps track of which elements requested a lock so multiple levels of locking are possible\n * without premature unlocking.\n */\nexport function lockBodyScrolling(lockingEl: HTMLElement) {\n locks.add(lockingEl);\n document.body.classList.add('nano-scroll-lock');\n}\n\n/**\n * Unlocks body scrolling. Scrolling will only be unlocked once all elements that requested a lock call this method.\n */\nexport function unlockBodyScrolling(lockingEl: HTMLElement) {\n locks.delete(lockingEl);\n\n if (locks.size === 0) {\n document.body.classList.remove('nano-scroll-lock');\n }\n}\n\nfunction scrollTo(\n element: HTMLElement,\n scrollAmt: number,\n vertical: boolean = false\n) {\n if (!vertical) {\n try {\n element.scrollTo({ left: scrollAmt, behavior: 'smooth' });\n } catch (e) {\n element.scrollLeft = scrollAmt;\n }\n return;\n }\n try {\n element.scrollTo({ top: scrollAmt, behavior: 'smooth' });\n } catch (e) {\n element.scrollTop = scrollAmt;\n }\n}\n\n/**\n * Scrolls an element into view of its container. If the element is already in view, nothing will happen.\n */\nexport function scrollIntoView(\n element: HTMLElement,\n container: HTMLElement,\n direction: 'horizontal' | 'vertical' | 'both' = 'vertical',\n position: 'center' | 'start' = 'start'\n) {\n const offset = getOffset(element, container);\n const offsetTop = offset.top + container.scrollTop;\n const offsetLeft = offset.left + container.scrollLeft;\n const minX = container.scrollLeft;\n const maxX = container.scrollLeft + container.offsetWidth;\n const minY = container.scrollTop;\n const maxY = container.scrollTop + container.offsetHeight;\n\n if (direction === 'horizontal' || direction === 'both') {\n if (position === 'start') {\n if (offsetLeft < minX) scrollTo(container, offsetLeft);\n else if (offsetLeft + element.clientWidth > maxX)\n scrollTo(\n container,\n offsetLeft - container.offsetWidth + element.clientWidth\n );\n } else\n scrollTo(\n container,\n container.scrollLeft +\n offset.left -\n container.offsetWidth / 2 +\n element.offsetWidth / 2\n );\n }\n\n if (direction === 'vertical' || direction === 'both') {\n if (offsetTop < minY) scrollTo(container, offsetTop, true);\n else if (offsetTop + element.clientHeight > maxY) {\n scrollTo(\n container,\n offsetTop - container.offsetHeight + element.clientHeight,\n true\n );\n }\n }\n}\n"],"version":3}
@@ -1 +0,0 @@
1
- {"file":"table.worker-2f887b5f.js","mappings":";;;;;;;;;;;;;;;;;;;","names":[],"sources":[],"sourcesContent":[],"version":3}
@@ -1 +0,0 @@
1
- {"file":"transitions-71cca3ed.js","mappings":";;;AAAA;;;;AAiBA;;;;;;;;;;MAUa,iBAAiB,GAAG,CAC/B,EAAe,EACf,SAAiB,EACjB,OAAgB,IAAI;EAEpB,OAAO,IAAI,OAAO,CAAC,CAAC,OAAO;IACzB,IAAI,IAAI,EAAE;MACR,EAAE,CAAC,gBAAgB,CACjB,eAAe,EACf,CAAC,CAAQ;QACP,IACE,CAAC,CAAC,MAAM,KAAK,EAAE;UACf,CAAC,CAAC,YAAY,EAAE,CAAC,IAAI,CAAC,CAAC,EAAE,KAAK,EAAE,KAAK,CAAC,CAAC,MAAM,CAAC,EAC9C;UACA,OAAO,CAAC,OAAO,CAAC,CAAC;SAClB;OACF,EACD,EAAE,IAAI,EAAE,IAAI,EAAE,CACf,CAAC;MACF,EAAE,CAAC,KAAK,CAAC,OAAO,GAAG,OAAO,CAAC;MAC3B,EAAE,CAAC,OAAO,CAAC,iBAAiB,GAAG,MAAM,CAAC;MACtC,UAAU,CAAC,MAAM,EAAE,CAAC,SAAS,CAAC,GAAG,CAAC,SAAS,CAAC,EAAE,EAAE,CAAC,CAAC;KACnD;SAAM;MACL,EAAE,CAAC,gBAAgB,CACjB,eAAe,EACf,CAAC,CAAQ;QACP,IACE,CAAC,CAAC,MAAM,KAAK,EAAE;UACf,CAAC,CAAC,YAAY,EAAE,CAAC,IAAI,CAAC,CAAC,EAAE,KAAK,EAAE,KAAK,CAAC,CAAC,MAAM,CAAC,EAC9C;UACA,EAAE,CAAC,KAAK,CAAC,OAAO,GAAG,MAAM,CAAC;UAC1B,OAAO,CAAC,QAAQ,CAAC,CAAC;SACnB;OACF,EACD,EAAE,IAAI,EAAE,IAAI,EAAE,CACf,CAAC;MACF,EAAE,CAAC,SAAS,CAAC,MAAM,CAAC,SAAS,CAAC,CAAC;KAChC;GACF,CAAC,CAAC;AACL;;;;","names":[],"sources":["./src/utils/transitions.ts"],"sourcesContent":["/**\n * Quality of life for transition handling.\n * Adds / removes transitionend events. Resolves on complete\n */\nexport const transitionDone = (\n el: HTMLElement\n): Promise<'shown' | 'hidden'> => {\n return new Promise((resolve) => {\n const callback = () => {\n el.removeEventListener('transitionend', callback);\n resolve;\n };\n el.addEventListener('transitionend', callback);\n // ??\n });\n};\n\n/**\n * handles hiding and showing elements properly (with display),\n * along with transitions, so they are no longer viewable in the dom.\n * - OnHide remove show class, listen for transition end, then display: none on finish\n * - OnShow, display block on start then add a show class\n * @param el\n * @param className\n * @param show\n * @returns a promise of resolving as either 'show' or 'hidden'\n */\nexport const displayTransition = (\n el: HTMLElement,\n className: string,\n show: boolean = true\n): Promise<'shown' | 'hidden'> => {\n return new Promise((resolve) => {\n if (show) {\n el.addEventListener(\n 'transitionend',\n (e: Event) => {\n if (\n e.target === el ||\n e.composedPath().some((el) => el === e.target)\n ) {\n resolve('shown');\n }\n },\n { once: true }\n );\n el.style.display = 'block';\n el.dataset.displayTransition = 'true';\n setTimeout(() => el.classList.add(className), 20);\n } else {\n el.addEventListener(\n 'transitionend',\n (e: Event) => {\n if (\n e.target === el ||\n e.composedPath().some((el) => el === e.target)\n ) {\n el.style.display = 'none';\n resolve('hidden');\n }\n },\n { once: true }\n );\n el.classList.remove(className);\n }\n });\n};\n"],"version":3}
@@ -1,5 +0,0 @@
1
- /*!
2
- * Web Components for Nanopore digital Web Apps
3
- */
4
- import{r as n,h as t,a as i,g as e}from"./p-6ef53fa1.js";const o=":host {\n box-sizing: border-box;\n}\n\n*,\n*::before,\n*::after {\n box-sizing: border-box;\n}\n[hidden] {\n display: none !important;\n}\n/**\nTODO - as soon as container queries hits everywhere, strip out reliance on nano-grid breakpoints\n**/\n:host {\n /**\n * @prop --nano-loader-base: Base colour of nano-skeleton. Default depends on theme;\n * @prop --nano-loader-tint: Tint colour of nano-skeleton. Default depends on theme;\n * @prop --theme-color: Text color. Default depends on theme;\n * @prop --theme-tint-color: Color used for bread crumbs and icons. Defaults to #90c6e7;\n * @prop --scrim-color: Color of the gradient covering the background. Default depends on theme;\n * @prop --scrim-direction: Direction of the gradient covering the background. Default what content slots are present;\n * @prop --scrim-opacity-from: Starting opactiy of the gradient covering the background. Default .25;\n * @prop --scrim-opacity-to: Final opactiy of the gradient covering the background. Default depends on `theme`;\n * @prop --quote-size: Font size of the quote. Defaults to 1.3em and grows to 3rem on the xl breakpoint;\n */\n display: block;\n --nano-loader-base: #4a4a4a;\n --nano-loader-tint: #7d7d7d;\n --theme-color: #fff;\n --theme-tint-color: #90c6e7;\n --scrim-color: 0, 0, 0;\n --scrim-direction: 90deg;\n --scrim-opacity-from: 0.25;\n --scrim-opacity-to: 0.7;\n --padding: 0;\n --quote-size: 1.3rem;\n color: var(--theme-color);\n}\n\n:host(.is-xl) {\n --quote-size: 3rem;\n}\n\n:host([theme=light]) {\n --nano-loader-base: #fff;\n --nano-loader-tint: white;\n --theme-color: #4a4a4a;\n --scrim-color: 255, 255, 255;\n --scrim-opacity-from: 0.25;\n --scrim-opacity-to: 1;\n --scrim-direction: 270deg;\n color: var(--theme-color);\n}\n:host([theme=light]) .hero__primary-content {\n --color: #4a4a4a;\n}\n\n.hero {\n position: relative;\n}\n.hero--rtl {\n --scrim-direction: 270deg;\n}\n.hero--secondary:not(.hero--iconbox) {\n --scrim-direction: 0deg;\n}\n.hero__bg-wrap {\n overflow: hidden;\n}\n.hero__bg-slot {\n position: absolute;\n inset: 0;\n}\n.hero__ctas {\n display: flex;\n justify-content: flex-end;\n padding-block: 32px 0;\n padding-inline: 32px;\n -webkit-margin-after: -64px;\n margin-block-end: -64px;\n position: relative;\n z-index: 1;\n}\n@media (max-width: 52em) {\n .hero__ctas {\n display: none;\n }\n}\n@media (max-width: 58em) {\n .hero__ctas {\n -webkit-margin-after: -48px;\n margin-block-end: -48px;\n }\n}\n.hero__ctas ::slotted(a.button[slot=secondary-ctas]) {\n padding-block: 0.25rem !important;\n padding-inline: 0.5rem !important;\n font-size: 0.875rem !important;\n margin-block: 0 !important;\n margin-inline: 0.25rem !important;\n}\n.hero__img {\n display: block;\n container-type: inline-size;\n --padding: inherit;\n}\n.hero__breadcrumbs {\n display: none;\n margin-block: 20px 0;\n margin-inline: 14px;\n line-height: 14px;\n}\n.hero--breadcrumb .hero__breadcrumbs {\n display: block;\n}\n.is-xl .hero__breadcrumbs {\n margin-block: 0;\n margin-inline: 50px;\n max-inline-size: 50%;\n}\n@container (min-width: 800px) {\n .hero__breadcrumbs {\n margin-block: 0;\n margin-inline: 50px;\n max-inline-size: 50%;\n }\n}\n.is-xxl .hero__breadcrumbs {\n margin-block: 0;\n margin-inline: 83px;\n}\n@container (min-width: 900px) {\n .hero__breadcrumbs {\n margin-block: 0;\n margin-inline: 83px;\n }\n}\n.hero__breadcrumbs ::slotted(*[slot=breadcrumb]) {\n font-size: 0.85rem;\n text-transform: uppercase;\n letter-spacing: 1.5px;\n font-weight: 600;\n font-stretch: 125%;\n display: inline-block;\n -webkit-margin-after: 16px;\n margin-block-end: 16px;\n position: relative;\n z-index: 2;\n}\n.hero--hasbg .hero__breadcrumbs ::slotted(*[slot=breadcrumb]) {\n text-shadow: 1px 1px rgba(0, 0, 0, 0.15);\n}\n.hero__breadcrumbs ::slotted(a[slot=breadcrumb]) {\n color: var(--theme-tint-color) !important;\n cursor: pointer;\n}\n.hero__breadcrumbs ::slotted(.slash[slot=breadcrumb]) {\n color: var(--theme-color);\n position: relative;\n margin-block: 0;\n margin-inline: 0.5rem;\n display: inline-block;\n}\n.hero__scrim {\n position: absolute;\n inset: 0;\n z-index: 0;\n background: linear-gradient(var(--scrim-direction), rgb(var(--scrim-color)/var(--scrim-opacity-from)) 0%, rgb(var(--scrim-color)/var(--scrim-opacity-to)) 100%);\n}\n.hero--scrim .hero__scrim {\n background: none;\n}\n.hero__content {\n max-inline-size: 1440px;\n display: block;\n --grid-row-gap: 0;\n margin-block: 0;\n margin-inline: auto;\n position: relative;\n}\n.hero__content.is-xl {\n -webkit-margin-before: 50px;\n margin-block-start: 50px;\n max-inline-size: 1540px;\n}\n@container (min-width: 800px) {\n .hero__content {\n margin-block: 50px 0 !important;\n max-inline-size: 1540px !important;\n }\n}\n.hero__content.is-xxl {\n -webkit-margin-before: 83px;\n margin-block-start: 83px;\n max-inline-size: 1606px;\n}\n@container (min-width: 900px) {\n .hero__content {\n margin-block: 83px 0 !important;\n max-inline-size: 1606px !important;\n }\n}\n.hero__primary {\n margin: 16px;\n}\n.hero--breadcrumb .hero__primary {\n margin-block: 0;\n margin-inline: 16px;\n}\n.hero--backbtn .hero__primary {\n -webkit-margin-start: 0;\n margin-inline-start: 0;\n}\n.hero__primary ::slotted(nano-icon-button[slot=back-btn]) {\n font-size: 2rem;\n}\n.is-xl .hero__primary {\n margin-block: 0 50px;\n margin-inline: 50px 0;\n}\n.is-xl .hero__primary ::slotted(nano-icon-button[slot=back-btn]) {\n margin-block: 0;\n margin-inline: -3rem 0;\n}\n@container (min-width: 800px) {\n .hero__primary {\n margin-block: 0 50px !important;\n margin-inline: 50px 0 !important;\n }\n .hero__primary ::slotted(nano-icon-button[slot=back-btn]) {\n margin-block: 0 !important;\n margin-inline: -3rem 0 !important;\n }\n}\n.is-xxl .hero__primary {\n margin-block: 0 83px !important;\n margin-inline: 83px 0 !important;\n}\n@container (min-width: 900px) {\n .hero__primary {\n margin-block: 0 83px !important;\n margin-inline: 83px 0 !important;\n }\n}\n.hero__primary-content {\n max-inline-size: 45rem;\n --color: #fff;\n display: flex;\n}\n.hero--backbtn .hero__primary-content > div {\n padding-block: 10px 0;\n padding-inline: 0;\n}\n.hero__primary-content ::slotted(h1[slot=primary-content]) {\n line-height: 26px !important;\n margin-block: 0 18px !important;\n font-size: 2rem !important;\n}\n.is-xl .hero__primary-content ::slotted(h1[slot=primary-content]) {\n line-height: 31px !important;\n -webkit-margin-after: 30px !important;\n margin-block-end: 30px !important;\n}\n.is-xl .hero__primary-content ::slotted(.button[slot=primary-content]) {\n -webkit-margin-before: 20px !important;\n margin-block-start: 20px !important;\n}\n@container (min-width: 800px) {\n .hero__primary-content ::slotted(h1[slot=primary-content]) {\n line-height: 31px !important;\n -webkit-margin-after: 30px !important;\n margin-block-end: 30px !important;\n }\n .hero__primary-content ::slotted(.button[slot=primary-content]) {\n -webkit-margin-before: 20px !important;\n margin-block-start: 20px !important;\n }\n}\n.hero__secondary {\n display: none;\n block-size: 100%;\n padding-block: 0 20px;\n padding-inline: 14px;\n}\n.hero--secondary .hero__secondary {\n display: flex;\n align-items: center;\n}\n.is-xl .hero__secondary {\n padding-block: 0 50px;\n padding-inline: 50px;\n justify-content: flex-end;\n}\n@container (min-width: 800px) {\n .hero__secondary {\n padding-block: 0 50px;\n padding-inline: 50px;\n justify-content: flex-end;\n }\n}\n.is-xxl .hero__secondary {\n padding-block: 0 83px;\n padding-inline: 83px;\n}\n@container (min-width: 900px) {\n .hero__secondary {\n padding-block: 0 83px;\n padding-inline: 83px;\n }\n}\n.hero__icon-box {\n background: rgba(0, 0, 0, 0.7);\n padding: 24px;\n inline-size: 100%;\n -webkit-margin-after: auto;\n margin-block-end: auto;\n display: flex;\n flex-direction: column;\n color: white;\n}\n.is-xl .hero__icon-box {\n max-inline-size: 410px;\n flex: 0 1 410px;\n}\n.hero__icon-box ::slotted([slot=icon-box-item]) {\n --nano-color-base: var(--theme-tint-color);\n --nano-icon-size: 32px;\n --nano-icon-margin-end: 20px;\n display: flex;\n align-items: center;\n font-size: 0.8125rem;\n -webkit-margin-after: 20px;\n margin-block-end: 20px;\n}\n.hero__icon-box ::slotted(.last[slot=icon-box-item]) {\n -webkit-margin-after: 0;\n margin-block-end: 0;\n}\n.hero__quote-content {\n -webkit-margin-before: auto;\n margin-block-start: auto;\n text-align: center;\n inline-size: 100%;\n}\n.is-xl .hero__quote-content {\n max-inline-size: 500px;\n flex: 0 1 500px;\n text-align: initial;\n}\n@container (min-width: 800px) {\n .hero__quote-content {\n max-inline-size: 500px;\n flex: 0 1 500px;\n text-align: initial;\n }\n}\n.hero__quote::before, .hero__quote::after {\n content: '\"';\n font-size: var(--quote-size);\n font-weight: 700;\n font-style: italic;\n line-height: 0;\n color: #abb6b8;\n display: inline;\n position: relative;\n}\n.hero__quote ::slotted([slot=quote]) {\n font-size: var(--quote-size);\n font-weight: 300;\n font-style: italic;\n display: inline;\n}\n.hero__quote-author {\n text-align: end;\n font-size: 1rem;\n opacity: 0.8;\n}\n.hero--sub .hero__content.is-xl {\n -webkit-margin-before: 40px;\n margin-block-start: 40px;\n}\n.hero--sub .hero__content.is-xl .hero__primary {\n margin-block: 0 40px;\n margin-inline: 50px 0;\n}\n.hero--sub .hero__content.is-xl .hero__secondary {\n padding-block: 0 50px;\n padding-inline: 40px 50px;\n}\n.hero--sub .hero__content.is-xl ::slotted(.button[slot=primary-content]) {\n -webkit-margin-before: 8px !important;\n margin-block-start: 8px !important;\n}\n.hero--sub .hero__content.is-xl ::slotted(h1[slot=primary-content]) {\n -webkit-margin-after: 18px !important;\n margin-block-end: 18px !important;\n}\n.hero--sub .hero__content.is-xxl .hero__primary {\n margin-block: 0 40px;\n margin-inline: 83px 0;\n}\n.hero--sub .hero__content.is-xxl .hero__secondary {\n padding-block: 0 83px;\n padding-inline: 40px 83px;\n}";const r=class{constructor(i){n(this,i);this.handleGridChange=n=>{this.gridSizes=n.detail};this.HeroContent=()=>[!this.hasIconBox&&this.hasCtas?t("div",{class:"hero__ctas"},t("slot",{name:"secondary-ctas"})):"",t("div",{class:"hero__scrim"},t("slot",{name:"scrim"})),t("nano-grid",{onNanoBpChange:this.handleGridChange,class:"hero__content",xlCols:2,xlSize:this.largeScreenBP},t("nano-grid-item",{gridStates:"xl-col-span-2"},t("div",{class:"hero__breadcrumbs"},t("slot",{name:"breadcrumb"}))),t("nano-grid-item",{gridStates:this.hasSecondaryContent?"xl-col-span-1 xl-col-start-1 xl-row-start-2":"xl-col-span-2 xl-col-start-1 xl-row-start-2"},t("div",{class:"hero__primary"},t("div",{class:"hero__primary-content"},t("slot",{name:"back-btn"}),t("div",null,t("slot",{name:"primary-content"}))))),this.hasSecondaryContent&&t("nano-grid-item",{gridStates:"xl-col-span-1 xl-col-start-2 xl-row-start-2"},t("div",{class:"hero__secondary"},t("slot",{name:"secondary-content"}),this.hasIconBox&&t("div",{class:"hero__icon-box"},t("slot",{name:"icon-box"}),t("slot",{name:"icon-box-item"})),this.hasQuote&&t("div",{class:"hero__quote-content"},t("span",{class:"hero__quote"},t("slot",{name:"quote"})),t("div",{class:"hero__quote-author"},t("slot",{name:"quote-author"}))))))];this.gridSizes=[];this.hasIconBox=undefined;this.hasScrim=undefined;this.hasSecondaryContent=undefined;this.hasQuote=undefined;this.hasBg=undefined;this.hasBackBtn=undefined;this.hasCtas=undefined;this.breadCrumbs=undefined;this.iconBoxItems=undefined;this.imgSrc=undefined;this.imgSrcSet=null;this.largeScreenBP=900;this.theme="dark";this.level="top"}breadCrumbChange(){this.breadCrumbs.filter((n=>n.tagName==="A"&&!n.nextElementSibling.classList.contains("slash"))).forEach((n=>{n.insertAdjacentHTML("afterend",'<span slot="breadcrumb" class="slash">/</span>')}))}iconBoxItemChange(){this.iconBoxItems.forEach((n=>n.classList.remove("last")));if(this.iconBoxItems[this.iconBoxItems.length-1]&&this.iconBoxItems[this.iconBoxItems.length-1].classList)this.iconBoxItems[this.iconBoxItems.length-1].classList.add("last")}slotChangeObserver(){if(!window["MutationObserver"])return;if(this.mo)this.mo.disconnect();const n=this.mo=new MutationObserver((()=>this.processSlottedContent()));n.observe(this.host,{childList:true})}processSlottedContent(){this.hasCtas=!!this.host.querySelector('[slot="secondary-ctas"]');this.iconBoxItems=Array.from(this.host.querySelectorAll('[slot="icon-box-item"]'));this.hasIconBox=!!this.host.querySelector('[slot="icon-box"]')||!!this.iconBoxItems.length;this.hasScrim=!!this.host.querySelector('[slot="scrim"]');this.breadCrumbs=Array.from(this.host.querySelectorAll('[slot="breadcrumb"]'));this.hasSecondaryContent=!!this.host.querySelector('[slot="icon-box"]')||!!this.host.querySelector('[slot="quote"]')||!!this.host.querySelector('[slot="icon-box-item"]')||!!this.host.querySelector('[slot="secondary-content"]');this.hasBg=!!this.host.querySelector('[slot="background"]')||!!this.imgSrc;this.hasBackBtn=!!this.host.querySelector('[slot="back-btn"]');this.hasQuote=!!this.host.querySelector('[slot="quote"]')}disconnectedCallback(){if(this.mo)this.mo.disconnect()}componentDidLoad(){this.slotChangeObserver()}componentWillLoad(){this.processSlottedContent()}render(){const n=this.host.dir==="rtl"||this.host.ownerDocument.dir==="rtl";return t(i,{class:{[this.gridSizes.join(" ")]:true}},t("div",{class:{hero:true,"hero--light":this.theme==="light","hero--secondary":this.hasSecondaryContent,"hero--iconbox":this.hasIconBox,"hero--rtl":n,"hero--scrim":this.hasScrim,"hero--breadcrumb":!!this.breadCrumbs.length,"hero--hasbg":this.hasBg,"hero--backbtn":this.hasBackBtn,"hero--sub":this.level==="sub"}},t("div",{class:"hero__bg-wrap"},!!this.imgSrc&&t("nano-img",{class:"hero__img",lazy:false,background:true,srcSet:this.imgSrcSet,src:this.imgSrc},t(this.HeroContent,null)),!this.imgSrc&&[t("div",{class:"hero__bg-slot"},t("slot",{name:"background"})),t(this.HeroContent,null)])))}get host(){return e(this)}static get watchers(){return{breadCrumbs:["breadCrumbChange"],iconBoxItems:["iconBoxItemChange"]}}};r.style=o;export{r as nano_hero};
5
- //# sourceMappingURL=p-0e2f0040.entry.js.map
@@ -1 +0,0 @@
1
- {"version":3,"names":["heroCss","Hero","this","handleGridChange","e","gridSizes","detail","HeroContent","hasIconBox","hasCtas","h","class","name","onNanoBpChange","xlCols","xlSize","largeScreenBP","gridStates","hasSecondaryContent","hasQuote","breadCrumbChange","breadCrumbs","filter","crumb","tagName","nextElementSibling","classList","contains","forEach","insertAdjacentHTML","iconBoxItemChange","iconBoxItems","item","remove","length","add","slotChangeObserver","window","mo","disconnect","MutationObserver","processSlottedContent","observe","host","childList","querySelector","Array","from","querySelectorAll","hasScrim","hasBg","imgSrc","hasBackBtn","disconnectedCallback","componentDidLoad","componentWillLoad","render","rtl","dir","ownerDocument","Host","join","hero","theme","level","lazy","background","srcSet","imgSrcSet","src"],"sources":["./src/components/hero/hero.scss?tag=nano-hero&encapsulation=shadow","./src/components/hero/hero.tsx"],"sourcesContent":["@use 'sass:map';\n@use 'sass:list';\n\n@import '../../global/style/utilities/globals';\n@import '../../global/style/nano-theme/colours';\n\n/**\nTODO - as soon as container queries hits everywhere, strip out reliance on nano-grid breakpoints\n**/\n\n:host {\n /**\n * @prop --nano-loader-base: Base colour of nano-skeleton. Default depends on theme;\n * @prop --nano-loader-tint: Tint colour of nano-skeleton. Default depends on theme;\n * @prop --theme-color: Text color. Default depends on theme;\n * @prop --theme-tint-color: Color used for bread crumbs and icons. Defaults to #{map.get($colors, lightblue)};\n * @prop --scrim-color: Color of the gradient covering the background. Default depends on theme;\n * @prop --scrim-direction: Direction of the gradient covering the background. Default what content slots are present;\n * @prop --scrim-opacity-from: Starting opactiy of the gradient covering the background. Default .25;\n * @prop --scrim-opacity-to: Final opactiy of the gradient covering the background. Default depends on `theme`;\n * @prop --quote-size: Font size of the quote. Defaults to 1.3em and grows to 3rem on the xl breakpoint;\n */\n\n display: block;\n\n --nano-loader-base: #{map.get($colors, black)};\n --nano-loader-tint: #{lighten(map.get($colors, black), 20%)};\n --theme-color: #{map.get($colors, white)};\n --theme-tint-color: #{map.get($colors, lightblue)};\n --scrim-color: 0, 0, 0;\n --scrim-direction: 90deg;\n --scrim-opacity-from: 0.25;\n --scrim-opacity-to: 0.7;\n --padding: 0;\n --quote-size: 1.3rem;\n\n color: var(--theme-color);\n}\n\n:host(.is-xl) {\n --quote-size: 3rem;\n}\n\n:host([theme='light']) {\n --nano-loader-base: #{map.get($colors, white)};\n --nano-loader-tint: #{lighten(map.get($colors, white), 20%)};\n --theme-color: #{map.get($colors, black)};\n --scrim-color: 255, 255, 255;\n --scrim-opacity-from: 0.25;\n --scrim-opacity-to: 1;\n --scrim-direction: 270deg;\n\n color: var(--theme-color);\n\n .hero__primary-content {\n --color: #{map.get($colors, black)};\n }\n}\n\n.hero {\n position: relative;\n\n &--rtl {\n --scrim-direction: 270deg;\n }\n\n &--secondary:not(.hero--iconbox) {\n --scrim-direction: 0deg;\n }\n\n &__bg-wrap {\n overflow: hidden;\n }\n\n &__bg-slot {\n position: absolute;\n inset: 0;\n }\n\n &__ctas {\n @media (max-width: 52em) {\n display: none;\n }\n\n @media (max-width: 58em) {\n margin-block-end: -48px;\n }\n\n display: flex;\n justify-content: flex-end;\n padding-block: 32px 0;\n padding-inline: 32px;\n margin-block-end: -64px;\n position: relative;\n z-index: 1;\n\n ::slotted(a.button[slot='secondary-ctas']) {\n padding-block: 0.25rem !important;\n padding-inline: 0.5rem !important;\n font-size: 0.875rem !important;\n margin-block: 0 !important;\n margin-inline: 0.25rem !important;\n }\n }\n\n &__img {\n display: block;\n container-type: inline-size;\n\n --padding: inherit;\n }\n\n &__breadcrumbs {\n display: none;\n margin-block: 20px 0;\n margin-inline: 14px;\n line-height: 14px;\n\n .hero--breadcrumb & {\n display: block;\n }\n\n .is-xl & {\n margin-block: 0;\n margin-inline: 50px;\n max-inline-size: 50%;\n }\n\n @container (min-width: 800px) {\n margin-block: 0;\n margin-inline: 50px;\n max-inline-size: 50%;\n }\n\n .is-xxl & {\n margin-block: 0;\n margin-inline: 83px;\n }\n\n @container (min-width: 900px) {\n margin-block: 0;\n margin-inline: 83px;\n }\n\n ::slotted(*[slot='breadcrumb']) {\n font-size: 0.85rem;\n text-transform: uppercase;\n letter-spacing: 1.5px;\n font-weight: 600;\n font-stretch: 125%;\n display: inline-block;\n margin-block-end: 16px;\n position: relative;\n z-index: 2;\n\n .hero--hasbg & {\n text-shadow: 1px 1px rgb(0 0 0 / 15%);\n }\n }\n\n ::slotted(a[slot='breadcrumb']) {\n color: var(--theme-tint-color) !important;\n cursor: pointer;\n }\n\n ::slotted(.slash[slot='breadcrumb']) {\n color: var(--theme-color);\n position: relative;\n margin-block: 0;\n margin-inline: 0.5rem;\n display: inline-block;\n }\n }\n\n &__scrim {\n position: absolute;\n inset: 0;\n z-index: 0;\n background:\n linear-gradient(\n var(--scrim-direction),\n rgb(var(--scrim-color) / var(--scrim-opacity-from)) 0%,\n rgb(var(--scrim-color) / var(--scrim-opacity-to)) 100%\n );\n\n .hero--scrim & {\n background: none;\n }\n }\n\n &__content {\n max-inline-size: 1440px;\n display: block;\n\n --grid-row-gap: 0;\n\n margin-block: 0;\n margin-inline: auto;\n position: relative;\n\n &.is-xl {\n margin-block-start: 50px;\n max-inline-size: 1540px;\n }\n\n @container (min-width: 800px) {\n margin-block: 50px 0 !important;\n max-inline-size: 1540px !important;\n }\n\n &.is-xxl {\n margin-block-start: 83px;\n max-inline-size: 1606px;\n }\n\n @container (min-width: 900px) {\n margin-block: 83px 0 !important;\n max-inline-size: 1606px !important;\n }\n }\n\n &__primary {\n margin: 16px;\n\n .hero--breadcrumb & {\n margin-block: 0;\n margin-inline: 16px;\n }\n\n .hero--backbtn & {\n margin-inline-start: 0;\n }\n\n ::slotted(nano-icon-button[slot='back-btn']) {\n font-size: 2rem;\n }\n\n .is-xl & {\n margin-block: 0 50px;\n margin-inline: 50px 0;\n\n ::slotted(nano-icon-button[slot='back-btn']) {\n margin-block: 0;\n margin-inline: -3rem 0;\n }\n }\n\n @container (min-width: 800px) {\n margin-block: 0 50px !important;\n margin-inline: 50px 0 !important;\n\n ::slotted(nano-icon-button[slot='back-btn']) {\n margin-block: 0 !important;\n margin-inline: -3rem 0 !important;\n }\n }\n\n .is-xxl & {\n margin-block: 0 83px !important;\n margin-inline: 83px 0 !important;\n }\n\n @container (min-width: 900px) {\n margin-block: 0 83px !important;\n margin-inline: 83px 0 !important;\n }\n }\n\n &__primary-content {\n max-inline-size: 45rem;\n\n --color: #fff;\n\n display: flex;\n\n .hero--backbtn & {\n > div {\n padding-block: 10px 0;\n padding-inline: 0;\n }\n }\n\n ::slotted(h1[slot='primary-content']) {\n line-height: 26px !important;\n margin-block: 0 18px !important;\n font-size: 2rem !important;\n }\n\n .is-xl & {\n ::slotted(h1[slot='primary-content']) {\n line-height: 31px !important;\n margin-block-end: 30px !important;\n }\n\n ::slotted(.button[slot='primary-content']) {\n margin-block-start: 20px !important;\n }\n }\n\n @container (min-width: 800px) {\n ::slotted(h1[slot='primary-content']) {\n line-height: 31px !important;\n margin-block-end: 30px !important;\n }\n\n ::slotted(.button[slot='primary-content']) {\n margin-block-start: 20px !important;\n }\n }\n }\n\n &__secondary {\n display: none;\n block-size: 100%;\n padding-block: 0 20px;\n padding-inline: 14px;\n\n .hero--secondary & {\n display: flex;\n align-items: center;\n }\n\n .is-xl & {\n padding-block: 0 50px;\n padding-inline: 50px;\n justify-content: flex-end;\n }\n\n @container (min-width: 800px) {\n padding-block: 0 50px;\n padding-inline: 50px;\n justify-content: flex-end;\n }\n\n .is-xxl & {\n padding-block: 0 83px;\n padding-inline: 83px;\n }\n\n @container (min-width: 900px) {\n padding-block: 0 83px;\n padding-inline: 83px;\n }\n }\n\n &__icon-box {\n background: rgb(0 0 0 / 70%);\n padding: 24px;\n inline-size: 100%;\n margin-block-end: auto;\n display: flex;\n flex-direction: column;\n color: white;\n\n .is-xl & {\n max-inline-size: 410px;\n flex: 0 1 410px;\n }\n\n ::slotted([slot='icon-box-item']) {\n --nano-color-base: var(--theme-tint-color);\n --nano-icon-size: 32px;\n --nano-icon-margin-end: 20px;\n\n display: flex;\n align-items: center;\n font-size: 0.8125rem;\n margin-block-end: 20px;\n }\n\n ::slotted(.last[slot='icon-box-item']) {\n margin-block-end: 0;\n }\n }\n\n &__quote-content {\n margin-block-start: auto;\n text-align: center;\n inline-size: 100%;\n\n .is-xl & {\n max-inline-size: 500px;\n flex: 0 1 500px;\n text-align: initial;\n }\n\n @container (min-width: 800px) {\n max-inline-size: 500px;\n flex: 0 1 500px;\n text-align: initial;\n }\n }\n\n &__quote {\n &::before,\n &::after {\n content: '\"';\n font-size: var(--quote-size);\n font-weight: 700;\n font-style: italic;\n line-height: 0;\n color: #abb6b8;\n display: inline;\n position: relative;\n }\n\n ::slotted([slot='quote']) {\n font-size: var(--quote-size);\n font-weight: 300;\n font-style: italic;\n display: inline;\n }\n }\n\n &__quote-author {\n text-align: end;\n font-size: 1rem;\n opacity: 0.8;\n }\n\n &--sub {\n .hero__content.is-xl {\n margin-block-start: 40px;\n\n .hero__primary {\n margin-block: 0 40px;\n margin-inline: 50px 0;\n }\n\n .hero__secondary {\n padding-block: 0 50px;\n padding-inline: 40px 50px;\n }\n\n ::slotted(.button[slot='primary-content']) {\n margin-block-start: 8px !important;\n }\n\n ::slotted(h1[slot='primary-content']) {\n margin-block-end: 18px !important;\n }\n }\n\n .hero__content.is-xxl {\n .hero__primary {\n margin-block: 0 40px;\n margin-inline: 83px 0;\n }\n\n .hero__secondary {\n padding-block: 0 83px;\n padding-inline: 40px 83px;\n }\n }\n }\n}\n","import {\n Component,\n Prop,\n h,\n ComponentInterface,\n VNode,\n State,\n Element,\n Watch,\n Host,\n} from '@stencil/core';\n/**\n * Hero components are designed to be used once per content page to add visual impact to the introductory section of a page.\n * @slot primary-content - title, leading paragraph and CTA\n * @slot breadcrumb - each individual bread crumb should be assigned seperately\n * @slot secondary-content - free form secondary content.\n * @slot icon-box - free form icon box container\n * @slot icon-box-item - seperate icon box items. Designed to contain 1 icon and 1 text element.\n * @slot secondary-ctas - CTAs. each individual button should be assigned seperately\n * @slot quote - quote content\n * @slot quote-author - quote author\n * @slot scrim - optional background overlay (e.g. faded colour or gradient)\n * @slot background - custom background. Only active when img-src is empty\n * @slot back-btn - a back button.\n */\n@Component({\n tag: 'nano-hero',\n styleUrl: 'hero.scss',\n shadow: true,\n})\nexport class Hero implements ComponentInterface {\n private mo?: MutationObserver;\n\n @Element() host: HTMLNanoHeroElement;\n\n @State() gridSizes: string[] = [];\n @State() hasIconBox: boolean;\n @State() hasScrim: boolean;\n @State() hasSecondaryContent: boolean;\n @State() hasQuote: boolean;\n @State() hasBg: boolean;\n @State() hasBackBtn: boolean;\n @State() hasCtas: boolean;\n @State() breadCrumbs: Element[];\n @Watch('breadCrumbs')\n breadCrumbChange() {\n // safari doesn't support ::slotted()::after ... so this :/\n this.breadCrumbs\n .filter(\n (crumb) =>\n crumb.tagName === 'A' &&\n !crumb.nextElementSibling.classList.contains('slash')\n )\n .forEach((crumb) => {\n crumb.insertAdjacentHTML(\n 'afterend',\n '<span slot=\"breadcrumb\" class=\"slash\">/</span>'\n );\n });\n }\n @State() iconBoxItems: Element[];\n @Watch('iconBoxItems')\n iconBoxItemChange() {\n this.iconBoxItems.forEach((item) => item.classList.remove('last'));\n if (\n this.iconBoxItems[this.iconBoxItems.length - 1] &&\n this.iconBoxItems[this.iconBoxItems.length - 1].classList\n )\n this.iconBoxItems[this.iconBoxItems.length - 1].classList.add('last');\n }\n\n /** src for backgronund image. For more control use the `background` slot instead. */\n @Prop() imgSrc?: string;\n\n /** Optional list string providing media sizes with corresponding image srcs.\n * i.e. show img-x at 300px wide. Format `srcSet=\"200w src/imgSmall.jpg, 500h src/imgMed.png\"` */\n @Prop() imgSrcSet?: string = null;\n\n /** The Break Point width that the hero component will change to the large view. Defaults to the XL grid size (900px) */\n @Prop() largeScreenBP: number = 900;\n\n /** Base style for the hero. Either 'light' (white bg / dark text), or 'dark' (dark bg / white text) */\n @Prop() theme: 'dark' | 'light' = 'dark';\n\n /** Set the content structure level of the hero. Defaults to 'top' */\n @Prop() level: 'top' | 'sub' = 'top';\n\n private slotChangeObserver() {\n if (!window['MutationObserver']) return;\n\n if (this.mo) this.mo.disconnect();\n const mo = (this.mo = new MutationObserver(() =>\n this.processSlottedContent()\n ));\n mo.observe(this.host, { childList: true });\n }\n\n // Event handlers\n\n private processSlottedContent() {\n this.hasCtas = !!this.host.querySelector('[slot=\"secondary-ctas\"]');\n this.iconBoxItems = Array.from(\n this.host.querySelectorAll('[slot=\"icon-box-item\"]')\n );\n this.hasIconBox =\n !!this.host.querySelector('[slot=\"icon-box\"]') ||\n !!this.iconBoxItems.length;\n this.hasScrim = !!this.host.querySelector('[slot=\"scrim\"]');\n this.breadCrumbs = Array.from(\n this.host.querySelectorAll('[slot=\"breadcrumb\"]')\n );\n this.hasSecondaryContent =\n !!this.host.querySelector('[slot=\"icon-box\"]') ||\n !!this.host.querySelector('[slot=\"quote\"]') ||\n !!this.host.querySelector('[slot=\"icon-box-item\"]') ||\n !!this.host.querySelector('[slot=\"secondary-content\"]');\n this.hasBg =\n !!this.host.querySelector('[slot=\"background\"]') || !!this.imgSrc;\n this.hasBackBtn = !!this.host.querySelector('[slot=\"back-btn\"]');\n this.hasQuote = !!this.host.querySelector('[slot=\"quote\"]');\n }\n\n private handleGridChange = (e: CustomEvent & { detail: string[] }) => {\n this.gridSizes = e.detail;\n };\n\n // Component lifecycle\n\n disconnectedCallback() {\n if (this.mo) this.mo.disconnect();\n }\n\n componentDidLoad() {\n this.slotChangeObserver();\n }\n\n componentWillLoad() {\n this.processSlottedContent();\n }\n\n private HeroContent = (): VNode[] => {\n return [\n !this.hasIconBox && this.hasCtas ? (\n <div class=\"hero__ctas\">\n <slot name=\"secondary-ctas\" />\n </div>\n ) : (\n ''\n ),\n <div class=\"hero__scrim\">\n <slot name=\"scrim\" />\n </div>,\n <nano-grid\n onNanoBpChange={this.handleGridChange}\n class=\"hero__content\"\n xlCols={2}\n xlSize={this.largeScreenBP}\n >\n <nano-grid-item gridStates=\"xl-col-span-2\">\n <div class=\"hero__breadcrumbs\">\n <slot name=\"breadcrumb\" />\n </div>\n </nano-grid-item>\n <nano-grid-item\n gridStates={\n this.hasSecondaryContent\n ? 'xl-col-span-1 xl-col-start-1 xl-row-start-2'\n : 'xl-col-span-2 xl-col-start-1 xl-row-start-2'\n }\n >\n <div class=\"hero__primary\">\n <div class=\"hero__primary-content\">\n <slot name=\"back-btn\" />\n <div>\n <slot name=\"primary-content\" />\n </div>\n </div>\n </div>\n </nano-grid-item>\n {this.hasSecondaryContent && (\n <nano-grid-item gridStates=\"xl-col-span-1 xl-col-start-2 xl-row-start-2\">\n <div class=\"hero__secondary\">\n <slot name=\"secondary-content\" />\n {this.hasIconBox && (\n <div class=\"hero__icon-box\">\n <slot name=\"icon-box\" />\n <slot name=\"icon-box-item\" />\n </div>\n )}\n {this.hasQuote && (\n <div class=\"hero__quote-content\">\n <span class=\"hero__quote\">\n <slot name=\"quote\" />\n </span>\n <div class=\"hero__quote-author\">\n <slot name=\"quote-author\" />\n </div>\n </div>\n )}\n </div>\n </nano-grid-item>\n )}\n </nano-grid>,\n ];\n };\n\n render() {\n const rtl =\n this.host.dir === 'rtl' ||\n (this.host.ownerDocument as Document).dir === 'rtl';\n\n return (\n <Host\n class={{\n [this.gridSizes.join(' ')]: true,\n }}\n >\n <div\n class={{\n hero: true,\n 'hero--light': this.theme === 'light',\n 'hero--secondary': this.hasSecondaryContent,\n 'hero--iconbox': this.hasIconBox,\n 'hero--rtl': rtl,\n 'hero--scrim': this.hasScrim,\n 'hero--breadcrumb': !!this.breadCrumbs.length,\n 'hero--hasbg': this.hasBg,\n 'hero--backbtn': this.hasBackBtn,\n 'hero--sub': this.level === 'sub',\n }}\n >\n <div class=\"hero__bg-wrap\">\n {!!this.imgSrc && (\n <nano-img\n class=\"hero__img\"\n lazy={false}\n background\n srcSet={this.imgSrcSet}\n src={this.imgSrc}\n >\n <this.HeroContent />\n </nano-img>\n )}\n {!this.imgSrc && [\n <div class=\"hero__bg-slot\">\n <slot name=\"background\" />\n </div>,\n <this.HeroContent />,\n ]}\n </div>\n </div>\n </Host>\n );\n }\n}\n"],"mappings":"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"}
@@ -1,5 +0,0 @@
1
- /*!
2
- * Web Components for Nanopore digital Web Apps
3
- */
4
- const e=(e,n,t=true)=>new Promise((o=>{if(t){e.addEventListener("transitionend",(n=>{if(n.target===e||n.composedPath().some((e=>e===n.target))){o("shown")}}),{once:true});e.style.display="block";e.dataset.displayTransition="true";setTimeout((()=>e.classList.add(n)),20)}else{e.addEventListener("transitionend",(n=>{if(n.target===e||n.composedPath().some((e=>e===n.target))){e.style.display="none";o("hidden")}}),{once:true});e.classList.remove(n)}}));export{e as d};
5
- //# sourceMappingURL=p-167b9165.js.map
@@ -1 +0,0 @@
1
- {"version":3,"names":["displayTransition","el","className","show","Promise","resolve","addEventListener","e","target","composedPath","some","once","style","display","dataset","setTimeout","classList","add","remove"],"sources":["./src/utils/transitions.ts"],"sourcesContent":["/**\n * Quality of life for transition handling.\n * Adds / removes transitionend events. Resolves on complete\n */\nexport const transitionDone = (\n el: HTMLElement\n): Promise<'shown' | 'hidden'> => {\n return new Promise((resolve) => {\n const callback = () => {\n el.removeEventListener('transitionend', callback);\n resolve;\n };\n el.addEventListener('transitionend', callback);\n // ??\n });\n};\n\n/**\n * handles hiding and showing elements properly (with display),\n * along with transitions, so they are no longer viewable in the dom.\n * - OnHide remove show class, listen for transition end, then display: none on finish\n * - OnShow, display block on start then add a show class\n * @param el\n * @param className\n * @param show\n * @returns a promise of resolving as either 'show' or 'hidden'\n */\nexport const displayTransition = (\n el: HTMLElement,\n className: string,\n show: boolean = true\n): Promise<'shown' | 'hidden'> => {\n return new Promise((resolve) => {\n if (show) {\n el.addEventListener(\n 'transitionend',\n (e: Event) => {\n if (\n e.target === el ||\n e.composedPath().some((el) => el === e.target)\n ) {\n resolve('shown');\n }\n },\n { once: true }\n );\n el.style.display = 'block';\n el.dataset.displayTransition = 'true';\n setTimeout(() => el.classList.add(className), 20);\n } else {\n el.addEventListener(\n 'transitionend',\n (e: Event) => {\n if (\n e.target === el ||\n e.composedPath().some((el) => el === e.target)\n ) {\n el.style.display = 'none';\n resolve('hidden');\n }\n },\n { once: true }\n );\n el.classList.remove(className);\n }\n });\n};\n"],"mappings":";;;MA2BaA,EAAoB,CAC/BC,EACAC,EACAC,EAAgB,OAET,IAAIC,SAASC,IAClB,GAAIF,EAAM,CACRF,EAAGK,iBACD,iBACCC,IACC,GACEA,EAAEC,SAAWP,GACbM,EAAEE,eAAeC,MAAMT,GAAOA,IAAOM,EAAEC,SACvC,CACAH,EAAQ,Q,IAGZ,CAAEM,KAAM,OAEVV,EAAGW,MAAMC,QAAU,QACnBZ,EAAGa,QAAQd,kBAAoB,OAC/Be,YAAW,IAAMd,EAAGe,UAAUC,IAAIf,IAAY,G,KACzC,CACLD,EAAGK,iBACD,iBACCC,IACC,GACEA,EAAEC,SAAWP,GACbM,EAAEE,eAAeC,MAAMT,GAAOA,IAAOM,EAAEC,SACvC,CACAP,EAAGW,MAAMC,QAAU,OACnBR,EAAQ,S,IAGZ,CAAEM,KAAM,OAEVV,EAAGe,UAAUE,OAAOhB,E"}
@@ -1 +0,0 @@
1
- {"version":3,"names":["checkboxCss","checkboxIds","Checkbox","this","inputId","handleInvalid","ev","_invalid","target","validity","valid","handleChange","checked","indeterminate","handleFocus","hasFocus","nanoFocus","emit","handleBlur","nanoBlur","async","input","inputType","name","form","host","closest","ctrls","Array","from","querySelectorAll","document","filter","radio","map","el","nanoChange","value","typeChange","type","handleIndeterminateChange","invalid","validityMessage","validationMessage","validateFirst","reportValidity","isValid","errorMessage","message","updateStatus","length","setCustomValidity","focus","focusVisible","force","blur","onReset","e","querySelector","isRadioChecked","requestAnimationFrame","componentWillLoad","componentDidLoad","observe","disconnectedCallback","unobserve","render","labelId","h","Host","class","Object","assign","createColorClasses","color","nanocb","disabled","htmlFor","required","onBlur","onFocus","onChange","ref","id","onInvalid","label","hidden"],"sources":["./src/components/checkbox/checkbox.scss?tag=nano-checkbox&encapsulation=scoped","./src/components/checkbox/checkbox.tsx"],"sourcesContent":["@use 'sass:map';\n@use 'sass:list';\n\n@import '../../global/style/utilities/globals';\n@import '../../global/style/nano-theme/form';\n@import '../../global/style/nano-theme/base';\n\n:host {\n /**\n * @prop --control-invalid-style: Control box-shadow when invalid. Defaults to to #{$control-invalid-style};\n * @prop --focus-shadow: Control focus box-shadow. Defaults to to #{$control-focus-style};\n * @prop --padding: padding around radio and checkbox controls. Defaults to initial;\n * @prop --control-padding: padding around tag and segmented controls text. Various defaults.\n\n * @prop --check-bg-color: Initial Bg color of radio / checkbox controls. Changes for [checked] and [disabled] states. Defaults to #{map.get($colors, white)};\n * @prop --check-border-style: Initial border style. Defaults to 1px solid #{map.get($colors, palegrey)};\n * @prop --check-checked-bg-color: Checked bg of controls (not tag). Defaults to #{map.get($colors, darkgrey)};\n * @prop --check-checked-border-color: Checked border color of radio / checkbox controls. Defaults to #{map.get($colors, darkgrey)};\n * @prop --check-checked-higlight-color: Checked forgrdound / icon color. Defaults to #{map.get($colors, white)};\n * @prop --check-base-size: Relative scaling size for check controls. Defaults to to inherit;\n\n * @prop --cb-border-radius: Checkbox border radius. Defaults to to 2px and 5px on [has-focus];\n * @prop --radio-border-radius: Radio border radius. Defaults to to 50%;\n * @prop --tagbox-rgb: an rba list for tags which can be used to generate --tagbox-border-color and --tagbox-bg-color. Defaults to #{color-to-rgb-list(map.get($colors, lightblue))};\n * @prop --tagbox-border-color: Defaults to rgba(var(--tagbox-rgb), .5);\n * @prop --tagbox-bg-color: Defaults to rgba(var(--tagbox-rgb), .1);\n * @prop --segment-color: Segment, unselected text color. (selected color is --check-checked-higlight-color). Defaults to #{map.get($colors, blue)};\n * @prop --segment-border-radius: Defaults to 3px;\n * @prop --segment-shadow: 0 1px 4px rgba(0,0,0,.2);\n */\n\n --focus-shadow: #{$control-focus-style};\n --invalid-shadow: #{$control-focus-size + ' ' map.get($colors, red)};\n --padding: initial;\n --check-bg-color: #{map.get($colors, white)};\n --check-border-style: 1px solid #{map.get($colors, palegrey)};\n --check-checked-bg-color: #{map.get($colors, darkgrey)};\n --check-checked-border-color: #{map.get($colors, darkgrey)};\n --check-checked-higlight-color: #{map.get($colors, white)};\n --check-base-size: inherit;\n\n // type specific\n\n --tagbox-rgb: #{color-to-rgb-list(map.get($colors, lightblue))};\n --tagbox-border-color: rgb(var(--tagbox-rgb) / 50%);\n --tagbox-bg-color: rgb(var(--tagbox-rgb) / 20%);\n --tagbox-border-radius: 0;\n --segment-color: #{map.get($colors, blue)};\n --segment-border-radius: 3px;\n --segment-shadow: 0 1px 4px rgb(0 0 0 / 20%);\n --cb-border-radius: 2px;\n --radio-border-radius: 50%;\n\n display: inline-block;\n max-width: 100%;\n\n * {\n box-sizing: inherit;\n }\n}\n\n:host([type='tag']) {\n text-transform: uppercase;\n\n --control-padding: 0.2rem 1rem;\n}\n\n:host([type='segment']) {\n --check-border-style: none;\n --control-padding: 0.7em 1em 0.7em 1em;\n}\n\n:host([type='segment-pill']) {\n --check-border-style: 1px solid #{rgba(map.get($colors, palegrey), 0.5)};\n --segment-border-radius: 5px;\n --control-padding: 0.7em 1em 0.7em 1em;\n}\n\n:host(.nano-color) {\n --tagbox-rgb: var(--nano-color-base-rgb);\n --focus-shadow: #{$control-focus-size} var(--nano-color-shade);\n}\n\n:host([checked]:not([checked='false'])) {\n --tagbox-border-color: rgb(var(--tagbox-rgb) / 80%);\n --tagbox-bg-color: rgb(var(--tagbox-rgb) / 50%);\n}\n\n:host([has-focus]:not([has-focus='false'])) {\n --cb-border-radius: 5px;\n}\n\n:host([disabled]:not([disabled='false'])) {\n opacity: 0.7;\n\n --tagbox-rgb: #{color-to-rgb-list(map.get($colors, mediumgrey))};\n --check-bg-color: #{rgba(map.get($colors, mediumgrey), 0.5)};\n --check-checked-bg-color: #{rgba(map.get($colors, mediumgrey), 0.5)};\n --segment-color: #{map.get($colors, darkgrey)};\n}\n\n.nanocb {\n padding: var(--padding);\n cursor: pointer;\n display: flex;\n align-items: center;\n line-height: 1.2;\n position: relative;\n\n &__input {\n border-radius: var(--cb-border-radius, 3px);\n font-size: var(--check-base-size);\n position: relative;\n height: 1.5em;\n width: 1.5em;\n min-width: 1.5em;\n border: var(--check-border-style);\n box-shadow: 0 1px 4px rgb(0 0 0 / 20%);\n\n &::before {\n border-radius: var(--cb-border-radius);\n position: absolute;\n content: '';\n inset-inline-start: 0.625em;\n inset-block-start: 0.625em;\n width: 0;\n height: 0;\n border: 2px solid var(--check-checked-higlight-color);\n transform: scale(0);\n }\n\n &--radio {\n border-radius: var(--radio-border-radius);\n background-color: var(--check-bg-color);\n }\n\n &--checkbox {\n background-color: var(--check-bg-color);\n\n &::after {\n border-radius: var(--cb-border-radius);\n position: absolute;\n content: '';\n inset-inline-start: 0.75em;\n inset-block-start: 0.75em;\n height: 0;\n width: 0;\n border: solid var(--check-checked-higlight-color);\n border-width: 0 0.1875em 0.1875em 0;\n transform: rotate(0deg) scale(0);\n opacity: 1;\n transition: all 0.15s ease-out;\n\n .nanocb--indeterminate & {\n border-width: 0 0 0.1875em;\n }\n }\n }\n\n &--segment,\n &--segment-pill {\n @include visually-hide();\n\n &::before {\n display: none;\n }\n }\n\n &--tag {\n @include visually-hide();\n\n &::before {\n display: none;\n }\n }\n }\n\n &--invalid:not(.nanocb--focused) {\n .nanocb__input {\n box-shadow: 0 0 15px rgb(0 0 0 / 20%), var(--invalid-shadow);\n\n &--tag + .nanocb__label,\n &--segment + .nanocb__label,\n &--segment-pill + .nanocb__label {\n box-shadow: var(--invalid-shadow);\n z-index: 1;\n }\n }\n }\n\n input {\n @include visually-hide();\n\n &:focus ~ .nanocb__input {\n box-shadow: 0 0 15px rgb(0 0 0 / 20%), var(--focus-shadow);\n }\n\n &.focus-visible:focus ~ .nanocb__input {\n &--tag + .nanocb__label,\n &--segment + .nanocb__label,\n &--segment-pill + .nanocb__label {\n box-shadow: var(--focus-shadow);\n z-index: 1;\n }\n }\n\n &:checked ~ .nanocb__input {\n border-radius: var(--cb-border-radius);\n background-color: var(--check-checked-bg-color);\n transform: rotate(0deg) scale(1);\n opacity: 1;\n border: 0.125em solid var(--check-checked-border-color);\n\n &--segment + .nanocb__label,\n &--segment-pill + .nanocb__label {\n color: var(--check-checked-higlight-color);\n background-color: var(--check-checked-bg-color);\n box-shadow: inset 0 3px 4px rgb(0 0 0 / 20%);\n }\n\n &--radio {\n border-radius: var(--radio-border-radius);\n border-width: 0.3125em;\n background-color: var(--check-checked-higlight-color);\n\n &::after {\n border: solid var(--check-checked-border-color);\n border-width: 0 0.125em 0.125em 0;\n opacity: 0;\n }\n\n &::before {\n border-radius: var(--radio-border-radius);\n }\n }\n\n &--checkbox {\n &::after {\n transform: rotate(45deg) scale(1);\n opacity: 1;\n inset-inline-start: 0.475em;\n inset-block-start: 0.1875em;\n width: 0.375em;\n height: 0.75em;\n border-radius: 0;\n }\n }\n\n &--tag + .nanocb__label::after {\n transform: rotate(45deg);\n }\n }\n\n &:indeterminate ~ .nanocb__input--checkbox {\n border-radius: var(--input-border-radius, 5px);\n background-color: var(--check-checked-bg-color);\n transform: rotate(0deg) scale(1);\n opacity: 1;\n border: 0.125em solid var(--check-checked-bg-color);\n\n &::after {\n transform: scale(1);\n opacity: 1;\n inset-inline-start: 0.3125em;\n inset-block-start: 0;\n width: 0.7em;\n height: 0.7em;\n border-radius: 0;\n }\n }\n }\n\n &__label {\n padding-inline: 10px 0;\n padding-block: 0;\n display: flex;\n align-items: center;\n font-stretch: condensed;\n line-height: 1;\n flex: 1;\n justify-content: space-between;\n\n &--segment,\n &--segment-pill {\n border: var(--check-border-style);\n border-radius: var(--segment-border-radius);\n box-shadow: var(--segment-shadow);\n display: inline-flex;\n padding: var(--control-padding);\n background: var(--check-bg-color);\n color: var(--segment-color);\n align-items: center;\n width: 100%;\n }\n\n &--segment-pill {\n // first\n :host(:first-of-type) & {\n border-start-start-radius: var(--segment-border-radius);\n border-start-end-radius: 0;\n border-end-end-radius: 0;\n border-end-start-radius: var(--segment-border-radius);\n border-inline-end: none;\n }\n\n // middle\n :host(:not(:last-of-type):not(:first-of-type)) & {\n border-radius: 0;\n border-inline-end: none;\n }\n\n // last\n :host(:last-of-type) & {\n border-start-start-radius: 0;\n border-start-end-radius: var(--segment-border-radius);\n border-end-end-radius: var(--segment-border-radius);\n border-end-start-radius: 0;\n }\n\n // single\n :host(:first-of-type:last-of-type) & {\n border-radius: var(--segment-border-radius);\n border: var(--check-border-style);\n }\n }\n\n &--tag {\n letter-spacing: 2px;\n font-weight: 500;\n font-size: 0.65em;\n line-height: 1.4;\n padding: var(--control-padding);\n border: 2px solid #b5aea7;\n border-color: var(--tagbox-border-color);\n background-color: var(--tagbox-bg-color);\n transition: all 0.2s;\n border-radius: var(--cb-border-radius);\n width: 100%;\n\n &::after {\n content: '+';\n margin-inline: 0.3125em 0;\n margin-block: 0;\n font-weight: 200;\n position: relative;\n font-family: inherit;\n font-size: 1.8em;\n display: inline-block;\n transform: rotate(0deg);\n transform-origin: center;\n }\n\n span {\n display: block;\n }\n }\n }\n}\n","import {\n Component,\n Prop,\n Event,\n EventEmitter,\n h,\n ComponentInterface,\n State,\n Watch,\n Method,\n Element,\n Host,\n Listen,\n} from '@stencil/core';\nimport { focusVisible } from '../../utils/focus-visible';\nimport { createColorClasses } from '../../utils/theme';\nimport type {\n CheckboxChangeEventDetail,\n ControlValidity,\n Color,\n} from '../../interface';\n\nlet checkboxIds = 0;\n\n/**\n * `nano-checkbox` is used to let a user choose one or more options from a limited number of options.\n * They appear as checked when activated.\n * They can be checked by mouse, keyboard, touch or programmatically by setting the checked property.\n *\n * @slot - if you do not set a label attribute, you can use this slot for more complex markup\n */\n@Component({\n tag: 'nano-checkbox',\n styleUrl: 'checkbox.scss',\n scoped: true,\n})\nexport class Checkbox implements ComponentInterface {\n private inputId = `nano-cb-${checkboxIds++}`;\n private input: HTMLInputElement;\n\n @Element() private host: HTMLNanoCheckboxElement;\n @State() inputType: 'checkbox' | 'radio' = 'checkbox';\n\n /** @internal */\n @Prop({ mutable: true, reflect: true }) hasFocus = false;\n\n /**\n * checked property that can be used to get/set the value. accepts only boolean values\n */\n @Prop({ mutable: true, reflect: true }) checked: boolean = false;\n\n @Watch('checked')\n async handleCheckedChange() {\n this.input.checked = this.checked;\n\n if (this.inputType === 'radio' && this.name && this.checked) {\n const form = this.host.closest('form');\n let ctrls: Element[];\n if (form) {\n ctrls = Array.from(\n form.querySelectorAll(`nano-checkbox[name=\"${this.name}\"]`)\n );\n } else {\n ctrls = Array.from(\n document.querySelectorAll(`nano-checkbox[name=\"${this.name}\"]`)\n ).filter((radio) => !radio.closest('form'));\n }\n ctrls.map((el: HTMLNanoCheckboxElement) => {\n if (el !== this.host) el.checked = false;\n });\n }\n this.nanoChange.emit({ value: this.value, checked: this.checked });\n }\n\n /**\n * If `true`, the user cannot interact with the checkbox.\n */\n @Prop({ reflect: true }) disabled: boolean = false;\n\n /**\n * The value of a checkbox is analogous to the value of an `<input type='checkbox'>`,\n * it's only present when `checked` is true.\n */\n @Prop({ reflect: true }) value: string = 'on';\n\n /**\n * The name of the control, which is submitted with the form data.\n */\n @Prop({ reflect: true }) name: string;\n\n /**\n * Set to true to make the field required.\n */\n @Prop({ reflect: true }) required: boolean = false;\n\n /**\n * Controls the underlying field type and style.\n */\n @Prop({ reflect: true }) type:\n | 'radio'\n | 'checkbox'\n | 'tag'\n | 'segment'\n | 'segment-pill' = 'checkbox';\n\n @Watch('type')\n typeChange() {\n if (this.type === 'checkbox' || this.type === 'tag')\n this.inputType = 'checkbox';\n else this.inputType = 'radio';\n }\n\n /**\n * label property that can be used to set the label text. Alternatively you may use a label slot.\n */\n @Prop() label?: string;\n\n /**\n * If `true`, the checkbox will visually appear as indeterminate (only relevant for type=\"checkbox\")\n */\n @Prop({ mutable: true, reflect: true }) indeterminate: boolean = false;\n\n @Watch('indeterminate')\n handleIndeterminateChange() {\n this.checked = false;\n this.input.indeterminate = this.indeterminate;\n }\n\n /**\n * This will be true when the control is in an invalid state.\n * Validity is determined by the `required` prop. Or if custom validity message is set. @readonly\n */\n @Prop({ reflect: true })\n get invalid() {\n return this._invalid;\n }\n @State() _invalid = false;\n\n /**\n * Current validation message - if any. @readonly\n */\n @Prop()\n get validityMessage() {\n if (!this.input) return '';\n return this.input.validationMessage;\n }\n\n /**\n * Color to use from your application's color palette.\n */\n @Prop() color?: Color;\n\n /**\n * The form element to associate the input with (its form owner). Must be the id of a form.\n */\n @Prop() form?: string | null;\n\n /**\n * Emited when the checkbox is toggled\n */\n @Event() nanoChange: EventEmitter<CheckboxChangeEventDetail>;\n\n /**\n * Emited when the checkbox is focused\n */\n @Event() nanoFocus: EventEmitter;\n\n /**\n * Emited when the checkbox is blurred\n */\n @Event() nanoBlur: EventEmitter;\n\n // public methods\n\n /**\n * Returns the native input control\n */\n @Method()\n async getInputElement() {\n if (this.input) return this.input;\n }\n\n /**\n * Get the current state of the control.\n * @param validateFirst - perform validation first before reporting\n * @returns `Promise<{ isValid: boolean, errorMessage: string }>`\n */\n @Method()\n async reportValidity(\n validateFirst: boolean = false\n ): Promise<ControlValidity> {\n if (validateFirst) this.input.reportValidity();\n this._invalid = !this.input.validity.valid;\n\n return {\n isValid: !this.invalid,\n errorMessage: this.input.validationMessage,\n };\n }\n\n /**\n * Sets a custom validation message.\n * If `message` is not empty, the field will be considered invalid. Use in conjunction with `nano-checkbox-group`\n */\n @Method()\n async setError(message: string, updateStatus = true) {\n if (!this.input) return;\n if (updateStatus) this._invalid = !!message.length;\n this.input.setCustomValidity(message);\n }\n\n /**\n * Sets focus on the checkbox.\n */\n @Method()\n async setFocus() {\n if (this.input) {\n this.input.focus();\n focusVisible.force(this.input);\n }\n }\n\n /**\n * Removes focus from the checkbox.\n */\n @Method()\n async removeFocus() {\n if (this.input) {\n this.input.blur();\n focusVisible.force(this.input, false);\n }\n }\n\n @Listen('reset', { target: 'body' })\n onReset(e) {\n const form = this.form\n ? document.querySelector('#' + this.form)\n : this.host.closest('form');\n if (!form || e.target !== this.host.closest('form')) return;\n\n this.checked = false;\n }\n\n // private handlers\n\n private handleInvalid = (ev: Event) => {\n this._invalid = !(ev.target as HTMLInputElement).validity.valid;\n };\n\n private handleChange = (ev: InputEvent) => {\n this.checked = (ev.target as HTMLInputElement).checked;\n this.indeterminate = false;\n };\n\n private handleFocus = () => {\n this.hasFocus = true;\n this.nanoFocus.emit();\n };\n\n private handleBlur = () => {\n this.hasFocus = false;\n this.nanoBlur.emit();\n };\n\n /* Although many radio components can be 'checked',\n the underlying control may not be. Check */\n private isRadioChecked() {\n requestAnimationFrame(() => (this.checked = this.input.checked));\n }\n\n // Stencil hooks\n\n componentWillLoad() {\n this.typeChange();\n }\n\n componentDidLoad() {\n this.input.indeterminate = this.indeterminate;\n this.isRadioChecked();\n focusVisible.observe(this.input);\n }\n\n disconnectedCallback() {\n focusVisible.unobserve(this.input);\n }\n\n render() {\n const labelId = this.inputId + '-lbl';\n\n return (\n <Host class={{ ...createColorClasses(this.color) }}>\n <label\n class={{\n nanocb: true,\n 'nanocb--checked': this.checked,\n 'nanocb--invalid': this.invalid,\n 'nanocb--disabled': this.disabled,\n 'nanocb--focused': this.hasFocus,\n 'nanocb--indeterminate': this.indeterminate,\n }}\n htmlFor={this.inputId}\n >\n <input\n type={this.inputType}\n name={this.name}\n form={this.form}\n required={this.required}\n checked={this.checked}\n disabled={this.disabled}\n value={this.value}\n aria-labelledby={labelId}\n onBlur={this.handleBlur}\n onFocus={this.handleFocus}\n onChange={this.handleChange}\n ref={(input) => (this.input = input)}\n id={this.inputId}\n onInvalid={this.handleInvalid}\n />\n <span class={'nanocb__input nanocb__input--' + this.type}></span>\n\n <div id={labelId} class={'nanocb__label nanocb__label--' + this.type}>\n {this.label && !!this.label.length && <span>{this.label}</span>}\n <span hidden={this.label && !!this.label.length}>\n <slot />\n </span>\n </div>\n </label>\n </Host>\n );\n }\n}\n"],"mappings":"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"}
@@ -1,5 +0,0 @@
1
- /*!
2
- * Web Components for Nanopore digital Web Apps
3
- */
4
- import{i as n,r as i,h as o,a as t,g as r}from"./p-6ef53fa1.js";import{c as s}from"./p-411bb8f1.js";let e;const a=()=>{if(!e){const n=window;n.Nanoicons=n.Nanoicons||{};e=n.Nanoicons.map=n.Nanoicons.map||new Map}return e};const c=n=>{let i=f(n.src);if(i){return i}i=h(n.name,n.icon);if(i){return l(i)}if(n.icon){i=f(n.icon);if(i){return i}}return null};const l=i=>{const o=a().get(i);if(o){return o}return n(`../nano-assets/fontawesome-pro/svgs/${i}.svg`)};const h=(n,i)=>{if(!n&&i&&!d(i)){n=i}if(u(n)){n=m(n)}if(!u(n)||n.trim()===""){return null}const o=n.replace(/[a-z]|-|\/|\d/gi,"");if(o!==""){console.warn("invalid characters in icon name "+n);return null}return n};const f=n=>{if(u(n)){n=n.trim();if(d(n)){return n}}return null};const d=n=>n.length>0&&/(\/|\.)/.test(n);const u=n=>typeof n==="string";const m=n=>n.toLowerCase();const p=n=>{if(n){const i=document.createElement("div");i.innerHTML=n;for(let n=i.childNodes.length-1;n>=0;n--){if(i.childNodes[n].nodeName.toLowerCase()!=="svg"){i.removeChild(i.childNodes[n])}}const o=i.firstElementChild;if(o&&o.nodeName.toLowerCase()==="svg"){const n=o.getAttribute("class")||"";o.setAttribute("class",(n+" sc-nano-icon s-nano-icon svg").trim());if(g(o)){return i.innerHTML}}}return""};const g=n=>{if(n.nodeType===1){if(n.nodeName.toLowerCase()==="script"){return false}for(let i=0;i<n.attributes.length;i++){const o=n.attributes[i].value;if(u(o)&&o.toLowerCase().indexOf("on")===0){return false}}for(let i=0;i<n.childNodes.length;i++){if(!g(n.childNodes[i])){return false}}}return true};const v=new Map;const b=new Map;const w=n=>{let i=b.get(n);if(!i){i=fetch(n).then((i=>{if(i.ok){return i.text().then((i=>{v.set(n,p(i))}))}v.set(n,"")}));b.set(n,i)}return i};const y=":host{box-sizing:border-box}*,*::before,*::after{box-sizing:border-box}[hidden]{display:none !important}:host{--color:var(--nano-color-base, currentcolor);--primary-color:var(--nano-color-tint, currentcolor);--secondary-color:var(--nano-color-shade, currentcolor);--stroke-width:32px;--primary-opacity:0.8;--secondary-opacity:1;--icon-size:var(--nano-icon-size, 1em);--icon-margin-top:var(--nano-icon-margin-top, 0);--icon-margin-end:var(--nano-icon-margin-end, 0);--icon-margin-bottom:var(--nano-icon-margin-bottom, 0);--icon-margin-start:var(--nano-icon-margin-start, 0);display:inline-block;width:var(--icon-size);height:var(--icon-size);min-width:var(--icon-size);min-height:var(--icon-size);contain:strict;fill:currentcolor;box-sizing:content-box !important;transition:opacity 0.3s ease;color:var(--color);margin-inline:var(--icon-margin-start) var(--icon-margin-end);margin-block:var(--icon-margin-top) var(--icon-margin-bottom)}:host .nanoicon{stroke:currentcolor}.nanoicon-fill-none{fill:none}.nanoicon-stroke-width{stroke-width:32px;stroke-width:var(--stroke-width)}.icon-inner,.nanoicon,svg,.svg{display:block;height:100%;width:100%;overflow:visible}:host(.loading){opacity:0}.fa-primary{color:var(--primary-color);opacity:var(--primary-opacity, 1)}.fa-secondary{color:var(--secondary-color);opacity:var(--secondary-opacity) !important}:host(.flip-rtl) .icon-inner{transform:scaleX(-1)}:host(.icon-small){font-size:18px !important}:host(.icon-large){font-size:32px !important}";const x=class{constructor(n){i(this,n);this.svgContent=undefined;this.isVisible=false;this.isLoading=true;this.color=undefined;this.ariaLabel=undefined;this.flipRtl=undefined;this.name=undefined;this.src=undefined;this.icon=undefined;this.size=undefined;this.lazy=true}setAriaLabel(){if(!this.ariaLabel){const n=h(this.name,this.icon);if(n){this.ariaLabel=n.split("/").slice(-1)[0].replace(/\-/g," ")}}}connectedCallback(){this.waitUntilVisible(this.el,"50px",(()=>{this.isVisible=true;this.loadIcon()}))}disconnectedCallback(){if(this.io){this.io.disconnect();this.io=undefined}}componentWillLoad(){this.setAriaLabel()}waitUntilVisible(n,i,o){if(this.lazy&&typeof window!=="undefined"&&window.IntersectionObserver){const t=this.io=new window.IntersectionObserver((n=>{if(n[0].isIntersecting||n[1]&&n[1].isIntersecting){t.disconnect();this.io=undefined;o()}}),{rootMargin:i});t.observe(n)}else{o()}}loadIcon(){if(this.isVisible){const n=c(this);if(n){if(v.has(n)){this.svgContent=v.get(n);requestAnimationFrame((()=>this.isLoading=false))}else{w(n).then((()=>{this.svgContent=v.get(n);requestAnimationFrame((()=>this.isLoading=false))}))}}}this.setAriaLabel()}render(){const n=this.flipRtl||this.name&&(this.name.indexOf("arrow")>-1||this.name.indexOf("chevron")>-1)&&this.el.ownerDocument.dir==="rtl"&&this.flipRtl!==false;return o(t,{role:"img",class:Object.assign(Object.assign({},s(this.color)),{loading:this.isLoading,[`icon-${this.size}`]:!!this.size,"flip-rtl":!!n})},this.svgContent?o("div",{class:"icon-inner",innerHTML:this.svgContent}):o("div",{class:"icon-inner"}))}get el(){return r(this)}static get watchers(){return{name:["loadIcon"],src:["loadIcon"],icon:["loadIcon"]}}};x.style=y;export{x as nano_icon};
5
- //# sourceMappingURL=p-1aff5304.entry.js.map
@@ -1 +0,0 @@
1
- {"version":3,"names":["CACHED_MAP","getIconMap","win","window","Nanoicons","map","Map","getUrl","i","url","getSrc","src","getName","name","icon","getNamedUrl","iconName","get","getAssetPath","isSrc","isStr","toLower","trim","invalidChars","replace","console","warn","str","length","test","val","toLowerCase","validateContent","svgContent","div","document","createElement","innerHTML","childNodes","nodeName","removeChild","svgElm","firstElementChild","svgClass","getAttribute","setAttribute","isValid","elm","nodeType","attributes","value","indexOf","iconContent","requests","getSvgContent","req","fetch","then","rsp","ok","text","set","iconCss","Icon","setAriaLabel","this","ariaLabel","label","split","slice","connectedCallback","waitUntilVisible","el","isVisible","loadIcon","disconnectedCallback","io","disconnect","undefined","componentWillLoad","rootMargin","cb","lazy","IntersectionObserver","data","isIntersecting","observe","has","requestAnimationFrame","isLoading","render","flipRtl","ownerDocument","dir","h","Host","role","class","Object","assign","createColorClasses","color","loading","size"],"sources":["./src/components/icon/utils.ts","./src/components/icon/validate.ts","./src/components/icon/request.ts","./src/components/icon/icon.scss?tag=nano-icon&encapsulation=shadow","./src/components/icon/icon.tsx"],"sourcesContent":["import { getAssetPath } from '@stencil/core';\nimport { Icon } from './icon';\n\nlet CACHED_MAP: Map<string, string>;\n\nexport const getIconMap = (): Map<string, string> => {\n if (!CACHED_MAP) {\n const win = window as any;\n win.Nanoicons = win.Nanoicons || {};\n CACHED_MAP = win.Nanoicons.map = win.Nanoicons.map || new Map();\n }\n return CACHED_MAP;\n};\n\nexport const addIcons = (icons: { [name: string]: string }) => {\n const map = getIconMap();\n Object.keys(icons).forEach((name) => map.set(name, icons[name]));\n};\n\nexport const getUrl = (i: Icon) => {\n let url = getSrc(i.src);\n if (url) {\n return url;\n }\n\n url = getName(i.name, i.icon);\n if (url) {\n return getNamedUrl(url);\n }\n\n if (i.icon) {\n url = getSrc(i.icon);\n if (url) {\n return url;\n }\n }\n return null;\n};\n\nconst getNamedUrl = (iconName: string) => {\n const url = getIconMap().get(iconName);\n if (url) {\n return url;\n }\n return getAssetPath(`../nano-assets/fontawesome-pro/svgs/${iconName}.svg`);\n};\n\nexport const getName = (\n iconName: string | undefined,\n icon: string | undefined\n) => {\n if (!iconName && icon && !isSrc(icon)) {\n iconName = icon;\n }\n if (isStr(iconName)) {\n iconName = toLower(iconName);\n }\n\n if (!isStr(iconName) || iconName.trim() === '') {\n return null;\n }\n\n // only allow alpha characters and dash\n const invalidChars = iconName.replace(/[a-z]|-|\\/|\\d/gi, '');\n if (invalidChars !== '') {\n console.warn('invalid characters in icon name ' + iconName);\n return null;\n }\n return iconName;\n};\n\nexport const getSrc = (src: string | undefined) => {\n if (isStr(src)) {\n src = src.trim();\n if (isSrc(src)) {\n return src;\n }\n }\n return null;\n};\n\nexport const isSrc = (str: string) => str.length > 0 && /(\\/|\\.)/.test(str);\nexport const isStr = (val: any): val is string => typeof val === 'string';\nexport const toLower = (val: string) => val.toLowerCase();\n","import { isStr } from './utils';\n\nexport const validateContent = (svgContent: string | null) => {\n if (svgContent) {\n const div = document.createElement('div');\n div.innerHTML = svgContent;\n\n // setup this way to ensure it works on our buddy IE\n for (let i = div.childNodes.length - 1; i >= 0; i--) {\n if (div.childNodes[i].nodeName.toLowerCase() !== 'svg') {\n div.removeChild(div.childNodes[i]);\n }\n }\n\n // must only have 1 root element\n const svgElm = div.firstElementChild;\n if (svgElm && svgElm.nodeName.toLowerCase() === 'svg') {\n const svgClass = svgElm.getAttribute('class') || '';\n svgElm.setAttribute(\n 'class',\n (svgClass + ' sc-nano-icon s-nano-icon svg').trim()\n );\n\n // root element must be an svg\n // lets double check we've got valid elements\n // do not allow scripts\n if (isValid(svgElm as any)) {\n return div.innerHTML;\n }\n }\n }\n return '';\n};\n\nexport const isValid = (elm: HTMLElement) => {\n if (elm.nodeType === 1) {\n if (elm.nodeName.toLowerCase() === 'script') {\n return false;\n }\n\n for (let i = 0; i < elm.attributes.length; i++) {\n const val = elm.attributes[i].value;\n if (isStr(val) && val.toLowerCase().indexOf('on') === 0) {\n return false;\n }\n }\n\n for (let i = 0; i < elm.childNodes.length; i++) {\n if (!isValid(elm.childNodes[i] as any)) {\n return false;\n }\n }\n }\n return true;\n};\n","import { validateContent } from './validate';\nexport const iconContent = new Map<string, string>();\nconst requests = new Map<string, Promise<any>>();\n\nexport const getSvgContent = (url: string) => {\n // see if we already have a request for this url\n let req = requests.get(url);\n if (!req) {\n // we don't already have a request\n req = fetch(url).then((rsp) => {\n if (rsp.ok) {\n return rsp.text().then((svgContent) => {\n iconContent.set(url, validateContent(svgContent));\n });\n }\n iconContent.set(url, '');\n });\n\n // cache for the same requests\n requests.set(url, req);\n }\n return req;\n};\n","@import '../../global/style/utilities/globals';\n\n:host {\n /**\n * @prop --color: defaults to current context color\n * @prop --primary-color: used for duotone icons to set the primary color\n * @prop --secondary-color: used for duotone icons to set the secondary color\n * @prop --primary-opacity: used for duotone icons to set the primary opacity\n * @prop --secondary-opacity: used for duotone icons to set the secondary opacity\n * @prop --stroke-width: 32px default stroke width\n */\n\n --color: var(--nano-color-base, currentcolor);\n --primary-color: var(--nano-color-tint, currentcolor);\n --secondary-color: var(--nano-color-shade, currentcolor);\n --stroke-width: 32px;\n --primary-opacity: 0.8;\n --secondary-opacity: 1;\n --icon-size: var(--nano-icon-size, 1em);\n --icon-margin-top: var(--nano-icon-margin-top, 0);\n --icon-margin-end: var(--nano-icon-margin-end, 0);\n --icon-margin-bottom: var(--nano-icon-margin-bottom, 0);\n --icon-margin-start: var(--nano-icon-margin-start, 0);\n\n display: inline-block;\n width: var(--icon-size);\n height: var(--icon-size);\n min-width: var(--icon-size);\n min-height: var(--icon-size);\n contain: strict;\n fill: currentcolor;\n box-sizing: content-box !important;\n transition: opacity 0.3s ease;\n color: var(--color);\n margin-inline: var(--icon-margin-start) var(--icon-margin-end);\n margin-block: var(--icon-margin-top) var(--icon-margin-bottom);\n}\n\n:host .nanoicon {\n stroke: currentcolor;\n}\n\n.nanoicon-fill-none {\n fill: none;\n}\n\n.nanoicon-stroke-width {\n stroke-width: 32px;\n stroke-width: var(--stroke-width);\n}\n\n.icon-inner,\n.nanoicon,\nsvg,\n.svg {\n display: block;\n height: 100%;\n width: 100%;\n overflow: visible;\n}\n\n:host(.loading) {\n opacity: 0;\n}\n\n.fa-primary {\n color: var(--primary-color);\n opacity: var(--primary-opacity, 1);\n}\n\n.fa-secondary {\n color: var(--secondary-color);\n opacity: var(--secondary-opacity) !important;\n}\n\n/* Icon RTL\n * -----------------------------------------------------------\n */\n:host(.flip-rtl) .icon-inner {\n transform: scaleX(-1);\n}\n\n/* Icon Sizes\n * -----------------------------------------------------------\n */\n:host(.icon-small) {\n font-size: 18px !important;\n}\n\n:host(.icon-large) {\n font-size: 32px !important;\n}\n","import {\n Build,\n Component,\n Element,\n Host,\n Prop,\n State,\n Watch,\n h,\n} from '@stencil/core';\nimport { createColorClasses } from '../../utils/theme';\nimport { getSvgContent, iconContent } from './request';\nimport { getName, getUrl } from './utils';\nimport type { Color } from '../../interface';\n\n/**\n * An SVG loader / helper. Comes bundled with all fontawesome pro icons by default but can use any custom SVG (with an correct path). Lazily loads SVG for each icon, so will only request the icons that you're using and that are visible.\n */\n@Component({\n tag: 'nano-icon',\n styleUrl: 'icon.scss',\n shadow: true,\n})\nexport class Icon {\n private io?: IntersectionObserver;\n\n @Element() el!: HTMLNanoIconElement;\n\n @State() svgContent?: string;\n @State() isVisible = false;\n @State() isLoading = true;\n\n /**\n * Color to use from your application's color palette.\n * Default options are: `\"primary\"`, `\"secondary\"`, `\"tertiary\"`, `\"success\"`, `\"warning\"`, `\"danger\"`, `\"light\"`, `\"medium\"`, and `\"dark\"`.\n */\n @Prop() color?: Color;\n\n /**\n * Specifies the label to use for accessibility. Defaults to the icon name.\n */\n @Prop({ mutable: true, reflect: true }) ariaLabel: string;\n\n /**\n * Specifies whether the icon should horizontally flip when `dir` is `\"rtl\"`.\n */\n @Prop() flipRtl?: boolean;\n\n /**\n * Specifies which icon to use from the built-in set of icons.\n */\n @Prop() name?: string;\n\n /**\n * Specifies the exact `src` of an SVG file to use.\n */\n @Prop() src?: string;\n\n /**\n * A combination of both `name` and `src`. If a `src` url is detected\n * it will set the `src` property. Otherwise it assumes it's a built-in named\n * SVG and set the `name` property.\n */\n @Prop() icon?: any;\n\n /**\n * The size of the icon.\n * Available options are: `\"small\"` and `\"large\"`.\n */\n @Prop() size?: 'small' | 'large';\n\n /**\n * If enabled, nano-icon will be loaded lazily when it's visible in the viewport.\n * Default, `true`.\n */\n @Prop() lazy = true;\n\n private setAriaLabel() {\n if (!this.ariaLabel) {\n const label = getName(this.name, this.icon);\n // user did not provide a label\n // come up with the label based on the icon name\n if (label) {\n this.ariaLabel = label.split('/').slice(-1)[0].replace(/\\-/g, ' ');\n }\n }\n }\n\n connectedCallback() {\n // purposely do not return the promise here because loading\n // the svg file should not hold up loading the app\n // only load the svg if it's visible\n this.waitUntilVisible(this.el, '50px', () => {\n this.isVisible = true;\n this.loadIcon();\n });\n }\n\n disconnectedCallback() {\n if (this.io) {\n this.io.disconnect();\n this.io = undefined;\n }\n }\n\n componentWillLoad() {\n this.setAriaLabel();\n }\n\n private waitUntilVisible(\n el: HTMLElement,\n rootMargin: string,\n cb: () => void\n ) {\n if (\n Build.isBrowser &&\n this.lazy &&\n typeof window !== 'undefined' &&\n (window as any).IntersectionObserver\n ) {\n const io = (this.io = new (window as any).IntersectionObserver(\n (data: IntersectionObserverEntry[]) => {\n if (data[0].isIntersecting || (data[1] && data[1].isIntersecting)) {\n io.disconnect();\n this.io = undefined;\n cb();\n }\n },\n { rootMargin }\n ));\n\n io.observe(el);\n } else {\n // browser doesn't support IntersectionObserver\n // so just fallback to always show it\n cb();\n }\n }\n\n @Watch('name')\n @Watch('src')\n @Watch('icon')\n loadIcon() {\n if (Build.isBrowser && this.isVisible) {\n const url = getUrl(this);\n if (url) {\n if (iconContent.has(url)) {\n // sync if it's already loaded\n this.svgContent = iconContent.get(url);\n requestAnimationFrame(() => (this.isLoading = false));\n } else {\n // async if it hasn't been loaded\n getSvgContent(url).then(() => {\n this.svgContent = iconContent.get(url);\n requestAnimationFrame(() => (this.isLoading = false));\n });\n }\n }\n }\n this.setAriaLabel();\n }\n\n render() {\n const flipRtl =\n this.flipRtl ||\n (this.name &&\n (this.name.indexOf('arrow') > -1 ||\n this.name.indexOf('chevron') > -1) &&\n (this.el.ownerDocument as Document).dir === 'rtl' &&\n this.flipRtl !== false);\n\n return (\n <Host\n role=\"img\"\n class={{\n ...createColorClasses(this.color),\n loading: this.isLoading,\n [`icon-${this.size}`]: !!this.size,\n 'flip-rtl': !!flipRtl,\n }}\n >\n {Build.isBrowser && this.svgContent ? (\n <div class=\"icon-inner\" innerHTML={this.svgContent}></div>\n ) : (\n <div class=\"icon-inner\"></div>\n )}\n </Host>\n );\n }\n}\n"],"mappings":"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"}
@@ -1,5 +0,0 @@
1
- /*!
2
- * Web Components for Nanopore digital Web Apps
3
- */
4
- import{a as t}from"./p-257432ff.js";const o=new Set;function n(t){o.add(t);document.body.classList.add("nano-scroll-lock")}function c(t){o.delete(t);if(o.size===0){document.body.classList.remove("nano-scroll-lock")}}function s(t,o,n=false){if(!n){try{t.scrollTo({left:o,behavior:"smooth"})}catch(n){t.scrollLeft=o}return}try{t.scrollTo({top:o,behavior:"smooth"})}catch(n){t.scrollTop=o}}function e(o,n,c="vertical",e="start"){const i=t(o,n);const f=i.top+n.scrollTop;const r=i.left+n.scrollLeft;const a=n.scrollLeft;const l=n.scrollLeft+n.offsetWidth;const u=n.scrollTop;const h=n.scrollTop+n.offsetHeight;if(c==="horizontal"||c==="both"){if(e==="start"){if(r<a)s(n,r);else if(r+o.clientWidth>l)s(n,r-n.offsetWidth+o.clientWidth)}else s(n,n.scrollLeft+i.left-n.offsetWidth/2+o.offsetWidth/2)}if(c==="vertical"||c==="both"){if(f<u)s(n,f,true);else if(f+o.clientHeight>h){s(n,f-n.offsetHeight+o.clientHeight,true)}}}export{n as l,e as s,c as u};
5
- //# sourceMappingURL=p-45b7682a.js.map
@@ -1 +0,0 @@
1
- {"version":3,"names":["tabCss","id","Tab","this","tabId","handleCloseClick","nanoTabClose","emit","handleCloseKeydown","e","key","async","tab","focus","preventScroll","blur","render","h","Host","host","part","ref","el","class","nanotab","active","disabled","closable","role","tabindex","label","iconName","onClick","onKeyDown","tabIndex"],"sources":["./src/components/tabs/tab.scss?tag=nano-tab&encapsulation=shadow","./src/components/tabs/tab.tsx"],"sourcesContent":["@use 'sass:map';\n@use 'sass:list';\n\n@import '../../global/style/utilities/globals';\n@import '../../global/style/nano-theme/form';\n@import '../../global/style/nano-theme/base';\n@import '../../global/style/nano-theme/layers';\n\n/**\n * @prop --focus-shadow: Defaults to #{$control-focus-style};\n\n * @prop --padding: Defaults to .75rem 1rem on placement 'top' and 1rem on placement 'start';\n\n * @prop --bg-rgb: Defaults to #{$layer-bg-color-rgb};\n * @prop --active-bg: Defaults to rgba(var(--bg-rgb), 1);\n * @prop --disabled-bg-rgb: Defaults to var(--bg-rgb);\n * @prop --inactive-bg: Defaults to rgba(var(--bg-rgb), 0.7);\n\n * @prop --text-color: Defaults to #{map.get($colors, blue)};\n * @prop --disabled-text-color: Defaults to #{map.get($colors, darkgrey)};\n * @prop --active-text-color: Defaults to #{map.get($colors, darkblue)};\n\n * @prop --h-font-size: Defaults to .93em;\n * @prop --v-font-size: Defaults to .875em;\n * @prop --tab-spacing: Gap between tabs. Defaults to 1rem;\n * @prop --tab-divider-size: Defaults to 0;\n * @prop --tab-divider-color: Defaults to #{map.get($colors, lightblue)};\n */\n\n:host {\n --focus-shadow: #{$control-focus-style};\n --padding: 0.75rem 1rem;\n --bg-rgb: #{$layer-bg-color-rgb};\n --active-bg: rgb(var(--bg-rgb) / 100%);\n --inactive-bg: rgb(var(--bg-rgb) / 70%);\n --disabled-bg-rgb: var(--bg-rgb);\n --text-color: #{map.get($colors, blue)};\n --disabled-text-color: #{map.get($colors, darkgrey)};\n --active-text-color: #{map.get($colors, darkblue)};\n --h-font-size: 0.93em;\n --v-font-size: 0.875em;\n --tab-spacing: 0.5rem;\n --tab-divider-size: 0;\n --tab-divider-color: #{map.get($colors, lightblue)};\n --tab-indicator-size: 5px;\n\n display: inline-block;\n}\n\n:host([direction='vertical']) {\n --padding: 1rem;\n\n .nanotab {\n font-size: var(--v-font-size);\n\n &.nanotab--active {\n font-weight: 600;\n color: var(--active-text-color);\n }\n }\n}\n\n:host([direction='horizontal']) {\n .nanotab {\n font-size: var(--h-font-size);\n margin-block-start: var(--tab-indicator-size);\n border-inline-end: solid var(--tab-divider-size) var(--tab-divider-color);\n\n &.nanotab--active {\n margin-block-start: 0;\n border-block-start:\n solid var(--tab-indicator-size)\n var(--tab-indicator-color);\n background: var(--active-bg);\n color: var(--active-text-color);\n }\n }\n}\n\n.nanotab {\n @include text-inherit();\n\n margin-inline-end: var(--tab-spacing);\n padding: var(--padding);\n display: flex;\n block-size: 100%;\n inline-size: auto;\n background: var(--inactive-bg);\n border-radius: var(--border-radius) var(--border-radius) 0 0;\n user-select: none;\n cursor: pointer;\n overflow: visible;\n white-space: nowrap;\n align-items: center;\n\n & ::slotted(*) {\n display: flex;\n align-items: center;\n }\n\n :host(:last-of-type) & {\n margin-inline-end: 0;\n }\n\n &:hover:not(.tab--disabled) {\n text-shadow: 0 0 0.01px var(--text-color);\n }\n\n &:focus {\n outline: none;\n outline-style: none;\n box-shadow: none;\n border-color: transparent;\n }\n\n &:focus:not(.nanotab--disabled) {\n box-shadow: var(--focus-shadow) inset;\n }\n\n &--disabled {\n background: rgb(var(--disabled-bg-rgb) / 100%);\n opacity: 0.5;\n cursor: not-allowed;\n color: var(--disabled-text-color);\n }\n\n &__close-button {\n margin-inline-start: #{$spacing-small};\n appearance: none !important;\n\n --padding: #{$spacing-xsmall} !important;\n }\n}\n","import {\n Component,\n Element,\n Host,\n ComponentInterface,\n Method,\n Prop,\n h,\n Event,\n EventEmitter,\n} from '@stencil/core';\n\nlet id = 0;\n\n/**\n * @slot - The tab's label.\n */\n\n@Component({\n tag: 'nano-tab',\n styleUrl: 'tab.scss',\n shadow: true,\n})\nexport class Tab implements ComponentInterface {\n private tabId = `nano-tab-${++id}`;\n private tab: HTMLElement;\n\n @Element() host: HTMLNanoTabElement;\n\n /** The name of the tab panel the tab will control. The panel must be located in the same tab group. */\n @Prop({ reflect: true }) panel = '';\n\n /** The active, selected tab. If none active, the first will automatically be selected. */\n @Prop({ reflect: true }) active = false;\n\n /** Set to true to draw the tab in an active state. */\n @Prop({ reflect: true }) disabled = false;\n\n /** When true, the tab will be rendered with a close icon. */\n @Prop() closable = false;\n\n /** Emitted when the tab is closable and the close button is activated. */\n @Event() nanoTabClose: EventEmitter;\n\n /** Sets focus to the tab. */\n @Method()\n async setFocus() {\n this.tab.focus({ preventScroll: true });\n }\n\n /** Removes focus from the tab. */\n @Method()\n async removeFocus() {\n this.tab.blur();\n }\n\n private handleCloseClick = () => {\n this.nanoTabClose.emit();\n };\n\n private handleCloseKeydown = (e: KeyboardEvent) => {\n if (e.key === ' ') this.handleCloseClick();\n };\n\n render() {\n return (\n <Host id={this.host.id || this.tabId}>\n <div\n part=\"base\"\n ref={(el) => (this.tab = el)}\n class={{\n nanotab: true,\n 'nanotab--active': this.active,\n 'nanotab--disabled': this.disabled,\n 'nanotab--closable': this.closable,\n }}\n role=\"tab\"\n aria-disabled={this.disabled ? 'true' : 'false'}\n aria-selected={this.active ? 'true' : 'false'}\n tabindex={this.disabled || !this.active ? '-1' : '0'}\n >\n <slot />\n {this.closable && (\n <nano-icon-button\n label=\"Close this tab\"\n iconName=\"light/times\"\n class=\"nanotab__close-button\"\n onClick={this.handleCloseClick}\n onKeyDown={this.handleCloseKeydown}\n tabIndex={-1}\n />\n )}\n </div>\n </Host>\n );\n }\n}\n"],"mappings":";;;gEAAA,MAAMA,EAAS,owFCYf,IAAIC,EAAK,E,MAWIC,EAAG,M,oEACNC,KAAAC,MAAQ,cAAcH,IAgCtBE,KAAAE,iBAAmB,KACzBF,KAAKG,aAAaC,MAAM,EAGlBJ,KAAAK,mBAAsBC,IAC5B,GAAIA,EAAEC,MAAQ,IAAKP,KAAKE,kBAAkB,E,WA/BX,G,YAGC,M,cAGE,M,cAGjB,K,CAOnBM,iBACER,KAAKS,IAAIC,MAAM,CAAEC,cAAe,M,CAKlCH,oBACER,KAAKS,IAAIG,M,CAWXC,SACE,OACEC,EAACC,EAAI,CAACjB,GAAIE,KAAKgB,KAAKlB,IAAME,KAAKC,OAC7Ba,EAAA,OACEG,KAAK,OACLC,IAAMC,GAAQnB,KAAKS,IAAMU,EACzBC,MAAO,CACLC,QAAS,KACT,kBAAmBrB,KAAKsB,OACxB,oBAAqBtB,KAAKuB,SAC1B,oBAAqBvB,KAAKwB,UAE5BC,KAAK,MAAK,gBACKzB,KAAKuB,SAAW,OAAS,QAAO,gBAChCvB,KAAKsB,OAAS,OAAS,QACtCI,SAAU1B,KAAKuB,WAAavB,KAAKsB,OAAS,KAAO,KAEjDR,EAAA,aACCd,KAAKwB,UACJV,EAAA,oBACEa,MAAM,iBACNC,SAAS,cACTR,MAAM,wBACNS,QAAS7B,KAAKE,iBACd4B,UAAW9B,KAAKK,mBAChB0B,UAAW,K"}
@@ -1 +0,0 @@
1
- {"version":3,"names":["drawerCss","id","Drawer","this","componentId","handleOpenChange","open","show","hide","handleTypeChange","type","contentEle","console","warn","handleContentSelector","contentSelector","host","ownerDocument","querySelector","connectedCallback","handleCloseClick","bind","handleTransitionEnd","handleKeyDown","handleOverlayClick","handleSlotChange","modal","Modal","componentWillLoad","disconnectedCallback","unlockBodyScrolling","async","isVisible","nanoShow","emit","defaultPrevented","contained","activate","lockBodyScrolling","style","right","transition","position","overflow","setTimeout","_","nanoHide","deactivate","event","key","slOverlayDismiss","nanoOverlayDismiss","hasFooter","target","propertyName","classList","contains","nanoAfterShow","nanoAfterHide","panel","focus","render","placementClass","placement","typeClass","h","Host","part","class","drawer","onKeyDown","onTransitionEnd","onClick","ref","el","role","noHeader","label","tabIndex","name","String","fromCharCode","onSlotchange"],"sources":["./src/components/drawer/drawer.scss?tag=nano-drawer&encapsulation=shadow","./src/components/drawer/drawer.tsx"],"sourcesContent":["@import '../../global/style/utilities/globals';\n@import '../../global/style/utilities/css-patterns/visually_hidden';\n\n:host {\n /**\n * @prop --size: The preferred size of the drawer; width or height depending on placement. Note that the drawer will shrink to accommodate smaller screens. Defaults to 25rem\n * @prop --panel-background-color: background color of panel. Default to 'white'\n * @prop --panel-shadow: Defaults to '0 4px 16px rgba(0, 0, 0, 0.1)';\n * @prop --overlay-color: Defaults to 'hsla(203, 10%, 20%, 0.5)';\n */\n\n position: relative;\n display: block;\n\n --size: 25rem;\n --panel-background-color: white;\n --panel-shadow: 0 4px 16px rgb(0 0 0 / 10%);\n --overlay-color: hsl(203deg 10% 20% / 50%);\n}\n\n.drawer {\n inset-block-start: 0;\n inset-inline-start: 0;\n width: 100%;\n height: 100%;\n pointer-events: none;\n overflow: hidden;\n\n &:not(.drawer--visible) {\n @include hidden;\n }\n}\n\n.drawer--contained {\n position: absolute;\n z-index: initial;\n}\n\n.drawer--fixed {\n position: fixed;\n z-index: 2000;\n}\n\n.drawer__panel {\n position: absolute;\n display: flex;\n flex-direction: column;\n z-index: 2;\n max-width: 100%;\n max-height: 100%;\n background-color: var(--panel-background-color);\n box-shadow: var(--panel-shadow);\n transition: 250ms transform;\n overflow: auto;\n pointer-events: all;\n\n &:focus {\n outline: none;\n }\n}\n\n.drawer--start .drawer__panel {\n @include transform(translate3d(-100%, 0, 0));\n\n inset-block: 0 auto;\n width: var(--size);\n height: 100%;\n}\n\n.drawer--end .drawer__panel {\n @include transform(translate3d(100%, 0, 0));\n\n inset-block: 0 auto;\n width: var(--size);\n height: 100%;\n}\n\n.drawer--top .drawer__panel {\n inset-inline: auto 0;\n inset-block: 0 auto;\n width: 100%;\n height: var(--size);\n transform: translate(0, -100%);\n}\n\n.drawer--bottom .drawer__panel {\n inset-inline: auto 0;\n inset-block: auto 0;\n width: 100%;\n height: var(--size);\n transform: translate(0, 100%);\n}\n\n.drawer--open .drawer__panel {\n transform: translate(0, 0);\n}\n\n.drawer__header {\n display: flex;\n}\n\n.drawer__title {\n flex: 1 1 auto;\n // font-size: var(--sl-font-size-large);\n // line-height: var(--sl-line-height-dense);\n padding: 20px;\n}\n\n.drawer__close {\n flex: 0 0 auto;\n display: flex;\n align-items: center;\n // font-size: var(--sl-font-size-x-large);\n // padding: 0 var(--sl-spacing-large);\n}\n\n.drawer__body {\n flex: 1 1 auto;\n // padding: var(--sl-spacing-large);\n overflow: auto;\n -webkit-overflow-scrolling: touch;\n}\n\n.drawer__footer {\n text-align: end;\n // padding: var(--sl-spacing-large);\n\n // ::slotted(sl-button:not(:last-of-type)) {\n // margin-right: var(--sl-spacing-x-small);\n // }\n}\n\n.drawer:not(.drawer--has-footer) .drawer__footer {\n display: none;\n}\n\n.drawer__overlay {\n display: block;\n position: fixed;\n inset: 0;\n background-color: var(--overlay-color);\n opacity: 0;\n transition: 250ms opacity;\n pointer-events: all;\n}\n\n.drawer--contained .drawer__overlay {\n position: absolute;\n}\n\n.drawer--open .drawer__overlay {\n opacity: 1;\n}\n","import {\n Component,\n Element,\n Event,\n EventEmitter,\n Method,\n Prop,\n State,\n Watch,\n h,\n Host,\n} from '@stencil/core';\nimport Modal from '../../utils/modal';\nimport { lockBodyScrolling, unlockBodyScrolling } from '../../utils/scroll';\n\nlet id = 0;\n\n/**\n * WIP / TODO. https://git.oxfordnanolabs.local/Digital/nano-components/-/issues/24\n * @slot - The drawer's content.\n * @slot label - The dialog's label. Alternatively, you can use the label prop.\n * @slot footer - The drawer's footer, usually one or more buttons representing various options.\n */\n@Component({\n tag: 'nano-drawer',\n styleUrl: 'drawer.scss',\n shadow: true,\n})\nexport class Drawer {\n private componentId = `drawer-${++id}`;\n private modal: Modal;\n private panel: HTMLElement;\n private contentEle: HTMLElement;\n\n @Element() host: HTMLNanoDrawerElement;\n\n @State() hasFooter = false;\n @State() isVisible = false;\n\n /**\n * Indicates whether or not the drawer is open. You can use this in lieu of the show/hide methods.\n */\n @Prop({ mutable: true, reflect: true }) open = false;\n\n /**\n * The drawer's label as displayed in the header. You should always include a relevant label even when using\n * `no-header`, as it is required for proper accessibility.\n */\n @Prop() label = '';\n\n /** The direction from which the drawer will open. */\n @Prop() placement: 'top' | 'end' | 'bottom' | 'start' = 'end';\n\n /**\n * By default, the drawer slides out of its containing block (usually the viewport). To make the drawer slide out of\n * its parent element, set this prop and add `position: relative` to the parent.\n */\n @Prop() contained = false;\n\n /**\n * Removes the header. This will also remove the default close button, so please ensure you provide an easy,\n * accessible way for users to dismiss the drawer.\n */\n @Prop() noHeader = false;\n\n /**\n * The display type of the drawer\n */\n @Prop() type: 'overlay' | 'reveal' | 'push' = 'overlay';\n\n /**\n * Required for 'reveal' and 'push' types\n * A valid DOM selector of the content element that this drawer will push or reveal underneath\n * Please remember - elements wrapping the content element must be 'overflow: hidden'\n * otherwise menus will be shown when closed\n */\n @Prop() contentSelector: string;\n\n @Watch('open')\n handleOpenChange() {\n this.open ? this.show() : this.hide();\n }\n\n @Watch('type')\n handleTypeChange() {\n if (this.type !== 'push' && this.type !== 'reveal') return;\n if (!this.contentEle) {\n this.type = 'overlay';\n console.warn('a valid contentSelector must be set');\n return;\n }\n }\n\n @Watch('contentSelector')\n handleContentSelector() {\n if (!this.contentSelector) this.contentEle = null;\n else\n this.contentEle = (this.host.ownerDocument as Document).querySelector(\n this.contentSelector\n );\n }\n\n /**\n * Emitted when the drawer opens. Calling `event.preventDefault()` will prevent it from being opened.\n */\n @Event() nanoShow: EventEmitter;\n\n /**\n * Emitted after the drawer opens and all transitions are complete.\n */\n @Event() nanoAfterShow: EventEmitter;\n\n /**\n * Emitted when the drawer closes. Calling `event.preventDefault()` will prevent it from being closed.\n */\n @Event() nanoHide: EventEmitter;\n\n /**\n * Emitted after the drawer closes and all transitions are complete.\n */\n @Event() nanoAfterHide: EventEmitter;\n\n /**\n * Emitted when the overlay is clicked. Calling `event.preventDefault()` will prevent the drawer from closing.\n */\n @Event() nanoOverlayDismiss: EventEmitter;\n\n connectedCallback() {\n this.handleCloseClick = this.handleCloseClick.bind(this);\n this.handleTransitionEnd = this.handleTransitionEnd.bind(this);\n this.handleKeyDown = this.handleKeyDown.bind(this);\n this.handleOverlayClick = this.handleOverlayClick.bind(this);\n this.handleSlotChange = this.handleSlotChange.bind(this);\n\n this.modal = new Modal(this.host);\n }\n\n componentWillLoad() {\n // Show on init if open\n if (this.open) {\n this.show();\n }\n this.handleContentSelector();\n }\n\n disconnectedCallback() {\n unlockBodyScrolling(this.host);\n }\n\n /** Shows the drawer */\n @Method()\n async show() {\n // Prevent subsequent calls to the method, whether manually or triggered by the `open` watcher\n if (this.isVisible) {\n return;\n }\n\n const nanoShow = this.nanoShow.emit();\n if (nanoShow.defaultPrevented) {\n this.open = false;\n return;\n }\n\n this.isVisible = true;\n this.open = true;\n\n // Lock body scrolling only if the drawer isn't contained\n if (!this.contained) {\n this.modal.activate();\n lockBodyScrolling(this.host);\n }\n\n if (!this.contentEle || (this.type !== 'push' && this.type !== 'reveal'))\n return;\n this.contentEle.style.right = '0';\n this.contentEle.style.transition = 'all ease 250ms';\n this.contentEle.style.position = 'relative';\n this.contentEle.style.overflow = 'hidden';\n setTimeout((_) => (this.contentEle.style.right = '25rem'), 0);\n }\n\n /** Hides the drawer */\n @Method()\n async hide() {\n // Prevent subsequent calls to the method, whether manually or triggered by the `open` watcher\n if (!this.isVisible) {\n return;\n }\n\n const nanoHide = this.nanoHide.emit();\n if (nanoHide.defaultPrevented) {\n this.open = true;\n return;\n }\n\n this.open = false;\n this.modal.deactivate();\n\n unlockBodyScrolling(this.host);\n\n if (!this.contentEle) return;\n this.contentEle.style.transition = '';\n this.contentEle.style.position = '';\n this.contentEle.style.overflow = '';\n this.contentEle.style.right = '';\n }\n\n private handleCloseClick() {\n this.hide();\n }\n\n private handleKeyDown(event: KeyboardEvent) {\n if (event.key === 'Escape') {\n this.hide();\n }\n }\n\n private handleOverlayClick() {\n const slOverlayDismiss = this.nanoOverlayDismiss.emit();\n\n if (!slOverlayDismiss.defaultPrevented) {\n this.hide();\n }\n }\n\n private handleSlotChange() {\n this.hasFooter = !!this.host.querySelector('[slot=\"footer\"]');\n }\n\n private handleTransitionEnd(event: TransitionEvent) {\n const target = event.target as HTMLElement;\n\n // Ensure we only emit one event when the target element is no longer visible\n if (\n event.propertyName === 'transform' &&\n target.classList.contains('drawer__panel')\n ) {\n this.isVisible = this.open;\n this.open ? this.nanoAfterShow.emit() : this.nanoAfterHide.emit();\n\n if (this.open) {\n this.panel.focus();\n }\n }\n }\n\n render() {\n const placementClass = 'drawer--' + this.placement;\n const typeClass = 'drawer--' + this.type;\n\n return (\n <Host>\n <div\n part=\"base\"\n class={{\n drawer: true,\n 'drawer--open': this.open,\n 'drawer--visible': this.isVisible,\n [typeClass]: true,\n [placementClass]: true,\n 'drawer--contained': this.contained,\n 'drawer--fixed': !this.contained,\n 'drawer--has-footer': this.hasFooter,\n }}\n onKeyDown={this.handleKeyDown}\n onTransitionEnd={this.handleTransitionEnd}\n >\n <div\n part=\"overlay\"\n class=\"drawer__overlay\"\n onClick={this.handleOverlayClick}\n />\n\n <div\n ref={(el) => (this.panel = el)}\n part=\"panel\"\n class=\"drawer__panel\"\n role=\"dialog\"\n aria-modal=\"true\"\n aria-hidden={this.open ? 'false' : 'true'}\n aria-label={this.noHeader ? this.label : null}\n aria-labelledby={\n !this.noHeader ? `${this.componentId}-title` : null\n }\n tabIndex={0}\n >\n {!this.noHeader && (\n <header part=\"header\" class=\"drawer__header\">\n <span\n part=\"title\"\n class=\"drawer__title\"\n id={`${this.componentId}-title`}\n >\n <slot name=\"label\">\n {/* If there's no label, use an invisible character to prevent the heading from collapsing */}\n {this.label || String.fromCharCode(65279)}\n </slot>\n </span>\n {/* <sl-icon-button part=\"close-button\" class=\"drawer__close\" name=\"x\" onClick={this.handleCloseClick} /> */}\n </header>\n )}\n\n <div part=\"body\" class=\"drawer__body\">\n <slot />\n </div>\n\n <footer part=\"footer\" class=\"drawer__footer\">\n <slot name=\"footer\" onSlotchange={this.handleSlotChange} />\n </footer>\n </div>\n </div>\n </Host>\n );\n }\n}\n"],"mappings":"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"}
@@ -1,6 +0,0 @@
1
- /*!
2
- * Web Components for Nanopore digital Web Apps
3
- */
4
- const t="nano-components";let e;let n;let s;let i=false;let o=false;let l=false;let f=false;let c=null;let r=false;const u={isDev:false,isBrowser:true,isServer:false,isTesting:false};const a=t=>{const e=new URL(t,ke.t);return e.origin!==_e.location.origin?e.href:e.pathname};const d=(t,e="")=>{{return()=>{}}};const h=(t,e)=>{{return()=>{}}};const b="r";const $="o";const m="s";const p="t";const g="s-id";const j="sty-id";const y="c-id";const v="{visibility:hidden}.hydrated{visibility:inherit}";const O="sf-id";const w="http://www.w3.org/1999/xlink";const S={};const x=t=>t!=null;const _=t=>{t=typeof t;return t==="object"||t==="function"};function E(t){var e,n,s;return(s=(n=(e=t.head)===null||e===void 0?void 0:e.querySelector('meta[name="csp-nonce"]'))===null||n===void 0?void 0:n.getAttribute("content"))!==null&&s!==void 0?s:undefined}const T=(t,e,...n)=>{let s=null;let i=null;let o=null;let l=false;let f=false;const c=[];const r=e=>{for(let n=0;n<e.length;n++){s=e[n];if(Array.isArray(s)){r(s)}else if(s!=null&&typeof s!=="boolean"){if(l=typeof t!=="function"&&!_(s)){s=String(s)}if(l&&f){c[c.length-1].i+=s}else{c.push(l?k(null,s):s)}f=l}}};r(n);if(e){if(e.key){i=e.key}if(e.name){o=e.name}{const t=e.className||e.class;if(t){e.class=typeof t!=="object"?t:Object.keys(t).filter((e=>t[e])).join(" ")}}}if(typeof t==="function"){return t(e===null?{}:e,c,N)}const u=k(t,null);u.o=e;if(c.length>0){u.l=c}{u.u=i}{u.h=o}return u};const k=(t,e)=>{const n={$:0,m:t,i:e,p:null,l:null};{n.o=null}{n.u=null}{n.h=null}return n};const C={};const M=t=>t&&t.m===C;const N={forEach:(t,e)=>t.map(L).forEach(e),map:(t,e)=>t.map(L).map(e).map(I)};const L=t=>({vattrs:t.o,vchildren:t.l,vkey:t.u,vname:t.h,vtag:t.m,vtext:t.i});const I=t=>{if(typeof t.vtag==="function"){const e=Object.assign({},t.vattrs);if(t.vkey){e.key=t.vkey}if(t.vname){e.name=t.vname}return T(t.vtag,e,...t.vchildren||[])}const e=k(t.vtag,t.vtext);e.o=t.vattrs;e.l=t.vchildren;e.u=t.vkey;e.h=t.vname;return e};const R=(t,e)=>{if(!t["s-hsf"]||!t.parentNode)return;let n=t.parentNode.__childNodes||t.parentNode.childNodes;let s;const i=n.length;let o=0;for(o;o<i;o++){s=n[o];if(s["s-sr"]&&e&&s["s-psn"]===t["s-sn"]){R(s,true);continue}if(s["s-sn"]!==t["s-sn"])continue;if(s.nodeType===1&&s["s-sf"]){s.hidden=e;s.style.display=e?"none":""}else if(!!s["s-sfc"]){if(e){s["s-sfc"]=s.textContent||undefined;s.textContent=""}else if(!s.textContent||s.textContent.trim()===""){s.textContent=s["s-sfc"]}}}};const H=t=>{if(!t)return;const e=t.__childNodes||t.childNodes;let n;let s;let i;let o;let l;let f;for(s=0,i=e.length;s<i;s++){if(e[s]["s-sr"]){l=e[s]["s-sn"];n=e[s];R(n,false);for(o=0;o<i;o++){f=e[o].nodeType;if(e[o]["s-sf"])continue;if(e[o]["s-hn"]!==n["s-hn"]||l!==""){if(f===1&&l===e[o]["s-sn"]){R(n,true);nt(e[o]);break}}else if(e[o]["s-sn"]===l){if(f===1||f===3&&e[o]&&e[o].textContent&&e[o].textContent.trim()!==""){R(n,true);nt(e[o]);break}}}}H(e[s])}};const U=t=>{P(t);B(t);q(t);z(t);V(t);J(t);K(t);Q(t);G(t);D(t);W(t);F(t)};const A=t=>{t.__cloneNode=t.cloneNode;t.cloneNode=function(e){const n=this;const s=t.__cloneNode.call(n,false);if(e){let t=0;let e,i;const o=["s-id","s-cr","s-lr","s-rc","s-sc","s-p","s-cn","s-sr","s-sn","s-hn","s-ol","s-nr","s-si","s-sf","s-sfc","s-hsf"];for(;t<n.__childNodes.length;t++){e=n.__childNodes[t]["s-nr"];i=o.every((e=>!n.__childNodes[t][e]));if(e){s.__appendChild(e.cloneNode(true))}if(i){s.__appendChild(n.__childNodes[t].cloneNode(true))}}}return s}};const P=t=>{if(!globalThis.Node)return;class e extends Array{item(t){return this[t]}}let n=Object.getOwnPropertyDescriptor(Node.prototype,"childNodes");if(!n){n=Object.getOwnPropertyDescriptor(Object.getPrototypeOf(Node.prototype),"childNodes")}if(n)Object.defineProperty(t,"__childNodes",n);let s=Object.getOwnPropertyDescriptor(Element.prototype,"children");if(s)Object.defineProperty(t,"__children",s);const i=Object.getOwnPropertyDescriptor(Element.prototype,"childElementCount");if(i)Object.defineProperty(t,"__childElementCount",i);Object.defineProperty(t,"children",{get(){return this.childNodes.map((t=>{if(t.nodeType===1)return t;else return null})).filter((t=>!!t))}});Object.defineProperty(t,"firstChild",{get(){return this.childNodes[0]}});Object.defineProperty(t,"lastChild",{get(){return this.childNodes[this.childNodes.length-1]}});Object.defineProperty(t,"childElementCount",{get(){return t.children.length}});if(!n)return;Object.defineProperty(t,"childNodes",{get(){const t=this.__childNodes;const n=new e;for(let e=0;e<t.length;e++){const s=t[e]["s-nr"];if(s&&(s.nodeType!==8||s.nodeValue.indexOf($+".")!==0)){n.push(s)}}return n}})};const D=t=>{if(!globalThis.Element)return;let e=Object.getOwnPropertyDescriptor(Element.prototype,"innerHTML");if(!e)e=Object.getOwnPropertyDescriptor(HTMLElement.prototype,"innerHTML");if(e)Object.defineProperty(t,"__innerHTML",e);Object.defineProperty(t,"innerHTML",{get:function(){let t="";this.childNodes.forEach((e=>t+=e.outerHTML||e.textContent));return t},set:function(t){this.childNodes.forEach((t=>{if(t["s-ol"])t["s-ol"].remove();t.remove()}));this.insertAdjacentHTML("beforeend",t)}})};const W=t=>{if(!globalThis.Element)return;let e=Object.getOwnPropertyDescriptor(Element.prototype,"innerText");if(!e)e=Object.getOwnPropertyDescriptor(HTMLElement.prototype,"innerText");if(e)Object.defineProperty(t,"__innerText",e);Object.defineProperty(t,"innerText",{get:function(){let t="";this.childNodes.forEach((e=>{if(e.innerText)t+=e.innerText;else if(e.textContent)t+=e.textContent.trimEnd()}));return t},set:function(t){this.childNodes.forEach((t=>{if(t["s-ol"])t["s-ol"].remove();t.remove()}));this.insertAdjacentHTML("beforeend",t)}})};const F=t=>{if(!globalThis.Node)return;const e=Object.getOwnPropertyDescriptor(Node.prototype,"textContent");if(e)Object.defineProperty(t,"__textContent",e);Object.defineProperty(t,"textContent",{get:function(){let t="";this.childNodes.forEach((e=>t+=e.textContent||""));return t},set:function(t){this.childNodes.forEach((t=>{if(t["s-ol"])t["s-ol"].remove();t.remove()}));this.insertAdjacentHTML("beforeend",t)}})};const B=t=>{if(t.__insertBefore)return;t.__insertBefore=t.insertBefore;t.insertBefore=function(t,e){const n=t["s-sn"]=ot(t);const s=lt(this.__childNodes,n);if(s){let i=false;this.childNodes.forEach((o=>{if(o===e||e===null){i=true;it(t,s);if(e===null){this.__append(t);return}if(n===e["s-sn"]){const n=e.parentNode.__insertBefore||e.parentNode.insertBefore;n.call(e.parentNode,t,e);nt(t)}else{this.__append(t)}return}}));if(i){return t}}return this.__insertBefore(t,e)}};const q=t=>{if(t.__appendChild)return;t.__appendChild=t.appendChild;t.appendChild=function(t){const e=t["s-sn"]=ot(t);const n=lt(this.__childNodes||this.childNodes,e);if(n){it(t,n);const e=ft(n);const s=e[e.length-1];if(s.parentNode){const e=s.parentNode;e.__insertBefore?e.__insertBefore(t,s.nextSibling):e.insertBefore(t,s.nextSibling);nt(t)}if(n["s-hsf"]){H(n.parentNode)}return t}if(t.nodeType===1&&!!t.getAttribute("slot")&&this.__childNodes)t.hidden=true;return this.__appendChild(t)}};const V=t=>{if(t.__prepend)return;t.__prepend=t.prepend;t.prepend=function(...t){t.forEach((t=>{if(typeof t==="string"){t=this.ownerDocument.createTextNode(t)}const e=t["s-sn"]=ot(t);const n=lt(this.__childNodes,e);if(n){it(t,n);const e=ft(n);const s=e[0];if(s.parentNode){s.parentNode.insertBefore(t,s.nextSibling);nt(t)}if(n["s-hsf"]){H(n.parentNode)}return}if(t.nodeType===1&&!!t.getAttribute("slot")&&this.__childNodes)t.hidden=true;return this.__prepend(t)}))}};const z=t=>{if(t.__append)return;t.__append=t.append;t.append=function(...t){t.forEach((t=>{if(typeof t==="string"){t=this.ownerDocument.createTextNode(t)}this.appendChild(t)}))}};const G=t=>{if(t.__replaceChildren)return;t.__replaceChildren=t.replaceChildren;t.replaceChildren=function(...t){const e=lt(this.__childNodes,"");if(e){const n=ft(e);n.forEach((t=>{if(!t["s-sr"]){t.remove()}}));this.append(...t)}}};const J=t=>{if(t.__insertAdjacentHTML)return;t.__insertAdjacentHTML=t.insertAdjacentHTML;t.insertAdjacentHTML=function(t,e){if(t!=="afterbegin"&&t!=="beforeend"){return this.__insertAdjacentHTML(t,e)}const n=this.ownerDocument.createElement("_");let s;n.innerHTML=e;if(t==="afterbegin"){while(s=n.firstChild){this.prepend(s)}}else if(t==="beforeend"){while(s=n.firstChild){this.append(s)}}}};const K=t=>{if(t.__insertAdjacentText)return;t.__insertAdjacentText=t.insertAdjacentText;t.insertAdjacentText=function(t,e){this.insertAdjacentHTML(t,e)}};const Q=t=>{if(t.__insertAdjacentElement)return;t.__insertAdjacentElement=t.insertAdjacentElement;t.insertAdjacentElement=function(t,e){if(t!=="afterbegin"&&t!=="beforeend"){return this.__insertAdjacentElement(t,e)}if(t==="afterbegin"){this.prepend(e)}else if(t==="beforeend"){this.append(e)}}};const X=t=>{if(!t||t.__nextSibling||!globalThis.Node)return;Y(t);tt(t);Z(t);et(t)};const Y=t=>{if(!t||t.__nextSibling)return;const e=Object.getOwnPropertyDescriptor(Node.prototype,"nextSibling");if(e)Object.defineProperty(t,"__nextSibling",e);else{t.__nextSibling=t.nextSibling||true}Object.defineProperty(t,"nextSibling",{get:function(){var t;const e=(t=this["s-ol"])===null||t===void 0?void 0:t.parentNode.childNodes;const n=e===null||e===void 0?void 0:e.indexOf(this);if(e&&n>-1){return e[n+1]}return this.__nextSibling}})};const Z=t=>{if(!t||t.__nextElementSibling||!t.nextSiblingElement)return;const e=Object.getOwnPropertyDescriptor(Element.prototype,"nextElementSibling");if(e)Object.defineProperty(t,"__nextElementSibling",e);else{t.__nextElementSibling=t.nextSiblingElement||true}Object.defineProperty(t,"nextElementSibling",{get:function(){var t;const e=(t=this["s-ol"])===null||t===void 0?void 0:t.parentNode.children;const n=e===null||e===void 0?void 0:e.indexOf(this);if(e&&n>-1){return e[n+1]}return this.__nextElementSibling}})};const tt=t=>{if(!t||t.__previousSibling)return;const e=Object.getOwnPropertyDescriptor(Node.prototype,"previousSibling");if(e)Object.defineProperty(t,"__previousSibling",e);else{t.__previousSibling=t.previousSibling||true}Object.defineProperty(t,"previousSibling",{get:function(){var t;const e=(t=this["s-ol"])===null||t===void 0?void 0:t.parentNode.childNodes;const n=e===null||e===void 0?void 0:e.indexOf(this);if(e&&n>-1){return e[n-1]}return this.__previousSibling}})};const et=t=>{if(!t||t.__previousElementSibling||!t.previousElementSibling)return;const e=Object.getOwnPropertyDescriptor(Element.prototype,"previousElementSibling");if(e)Object.defineProperty(t,"__previousElementSibling",e);else{t.__previousElementSibling=t.previousSiblingElement||true}Object.defineProperty(t,"previousElementSibling",{get:function(){var t;const e=(t=this["s-ol"])===null||t===void 0?void 0:t.parentNode.children;const n=e===null||e===void 0?void 0:e.indexOf(this);if(e&&n>-1){return e[n-1]}return this.__previousElementSibling}})};const nt=t=>{if(!t||t.__remove)return;t.__remove=t.remove||true;st(t.parentNode);t.remove=function(){if(this.parentNode){return this.parentNode.removeChild(this)}return this.__remove()}};const st=t=>{if(!t||t.__removeChild)return;t.__removeChild=t.removeChild;t.removeChild=function(t){if(t&&typeof t["s-sn"]!=="undefined"){const e=lt(this.__childNodes||this.childNodes,t["s-sn"]);t.parentElement.__removeChild(t);if(e&&e["s-hsf"]){H(e.parentElement)}return}return this.__removeChild(t)}};const it=(t,e)=>{if(t["s-ol"]&&t["s-ol"].isConnected)return;const n=document.createTextNode("");n["s-nr"]=t;if(e["s-cr"]&&e["s-cr"].parentNode){const t=e["s-cr"].parentNode.__appendChild||e["s-cr"].parentNode.appendChild;t.call(e["s-cr"].parentNode,n)}t["s-ol"]=n};const ot=t=>t["s-sn"]||t.nodeType===1&&t.getAttribute("slot")||t.slot||"";const lt=(t,e)=>{let n=0;let s;if(!t)return null;for(;n<t.length;n++){s=t[n];if(s["s-sr"]&&s["s-sn"]===e){return s}s=lt(s.childNodes,e);if(s){return s}}return null};const ft=t=>{const e=[t];const n=t["s-sn"]||"";while((t=t.nextSibling)&&t["s-sn"]===n){e.push(t)}return e};const ct=(t,e,n,s)=>{const i=d("hydrateClient",e);const o=t.shadowRoot;const l=[];const f=[];const c=[];const r=o?[]:null;let u=k(e,null);u.p=t;if(!ke.g){ut(Ee.body,ke.g=new Map)}t[g]=n;t.removeAttribute(g);s.j=rt(u,l,f,r,t,t,n,c);let a=0;const h=l.length;let b;for(a;a<h;a++){b=l[a];const n=b.v+"."+b.O;const s=ke.g.get(n);const i=b.p;if(!o){i["s-hn"]=e.toUpperCase();if(b.m==="slot"){i["s-cr"]=t["s-cr"]}}if(s&&s.isConnected){if(o&&s["s-en"]===""){s.parentNode.insertBefore(i,s.nextSibling)}s.parentNode.removeChild(s)}ke.g.delete(n)}const $=[];let m=0;const p=c.length;let j;let y;let v;let O;for(m;m<p;m++){j=c[m];if(!j||!j.length)continue;v=j.length;y=0;for(y;y<v;y++){O=j[y];if(!$[O.hostId]){$[O.hostId]=ke.g.get(O.hostId)}if(!$[O.hostId])continue;const t=$[O.hostId];if(!t.shadowRoot||!o){O.slot["s-cr"]=t["s-cr"];if(!O.slot["s-cr"]&&t.shadowRoot){O.slot["s-cr"]=t}else{const e=t.__childNodes||t.childNodes;O.slot["s-cr"]=e[0]}it(O.node,O.slot);X(O.node)}if(t.shadowRoot){t.appendChild(O.node)}}}if(o){let e=0;const n=r.length;for(e;e<n;e++){o.appendChild(r[e])}Array.from(t.childNodes).forEach((t=>{if(t.nodeType===8&&typeof t["s-sn"]!=="string"){t.parentNode.removeChild(t)}}))}s.S=t;i()};const rt=(t,e,n,s,i,o,l,f=[])=>{let c;let r;let u;let a;const d=i["s-sc"];if(o.nodeType===1){c=o.getAttribute(y);if(c){r=c.split(".");if(r[0]===l||r[0]==="0"){u=at({v:r[0],O:r[1],_:r[2],T:r[3],m:o.tagName.toLowerCase(),p:o,o:{class:o.className}});e.push(u);o.removeAttribute(y);if(!t.l){t.l=[]}const l=u.p.getAttribute("s-sn");if(typeof l==="string"){u.p["s-sn"]=l;u.p.removeAttribute("s-sn")}const f=u.p.getAttribute(O);if(f){u.p.removeAttribute(O);const t=n.find((t=>t.p["s-sn"]===u.p["s-sn"]||t.h===u.p["s-sn"]));if(t){u.p["s-sf"]=true;u.p["s-hn"]=i.tagName;t.l=t.l||[];t.l[u.T]=u;if(t.p.nodeType===1){t.p.appendChild(u.p)}}}else if(u.T!==undefined){t.l[u.T]=u}if(d)o["s-si"]=d;t=u;if(s&&u._==="0"&&!f){s[u.T]=u.p}}}const h=o.__childNodes||o.childNodes;for(a=h.length-1;a>=0;a--){rt(t,e,n,s,i,h[a],l,f)}if(o.shadowRoot){for(a=o.shadowRoot.childNodes.length-1;a>=0;a--){rt(t,e,n,s,i,o.shadowRoot.childNodes[a],l,f)}}}else if(o.nodeType===8){r=o.nodeValue.split(".");if(r[1]===l||r[1]==="0"){c=r[0];u=at({v:r[1],O:r[2],_:r[3],T:r[4]||"0",p:o});if(c===p){let f=u.p=o.nextSibling;if(u.p&&u.p.nodeType===3){u.i=u.p.textContent;e.push(u);o.remove();if(r[5]==="1"){f["s-sf"]=true;f["s-sn"]=r[6]||"";f["s-sfc"]=f.textContent;f["s-hn"]=i.tagName;const t=n.find((t=>t.p["s-sn"]===f["s-sn"]||t.h===f["s-sn"]));if(t){t.l=t.l||[];t.l[u.T]=u;if(t.p.nodeType===1){t.p.appendChild(f)}}}else{if(l===u.v){if(!t.l){t.l=[]}t.l[u.T]=u}if(s&&u._==="0"){s[u.T]=u.p}}}}else if(u.v===l){if(c===m){u.m="slot";t.o=undefined;const i=o["s-sn"]=u.h=r[5]||"";o["s-sr"]=true;if(r[6]==="1"){o["s-hsf"]=true}if(r[7]==="1"){let t=o.previousSibling;while(!!t&&t.nodeType!==8){t=t.previousSibling}o["s-sfc"]=t.nodeValue}const l=(t===null||t===void 0?void 0:t.p)?t.p["s-id"]||t.p.getAttribute("s-id"):"";if(s){const e=u.p=Ee.createElement(u.m);if(u.h){u.p.setAttribute("name",i)}if(l&&l!==u.v){t.p.insertBefore(e,t.p.children[0])}else{o.parentNode.insertBefore(u.p,o)}dt(f,r[2],i,o,u.v);o.remove();if(u._==="0"){s[u.T]=u.p}}else{const n=u.p;const s=l&&l!==u.v&&t.p.shadowRoot;dt(f,r[2],i,o,s?l:u.v);if(s){t.p.insertBefore(n,t.p.children[0])}e.push(u)}n.push(u);if(!t.l){t.l=[]}t.l[u.T]=u}else if(c===b){if(s){o.remove()}else{i["s-cr"]=o;o["s-cn"]=true}}}}}else if(t&&t.m==="style"){const e=k(null,o.textContent);e.p=o;e.T="0";t.l=[e]}return t};const ut=(t,e)=>{if(t.nodeType===1){const n=t[g]||t.getAttribute(g);if(n){e.set(n,t)}let s=0;const i=t.__childNodes||t.childNodes;for(;s<i.length;s++){ut(i[s],e)}if(t.shadowRoot){for(s=0;s<t.shadowRoot.childNodes.length;s++){ut(t.shadowRoot.childNodes[s],e)}}}else if(t.nodeType===8){const n=t.nodeValue.split(".");if(n[0]===$){e.set(n[1]+"."+n[2],t);t["s-en"]=n[3]}}};const at=t=>{const e={$:0,v:null,O:null,_:null,T:"0",p:null,o:null,l:null,u:null,h:null,m:null,i:null};return Object.assign(Object.assign({},e),t)};const dt=(t,e,n,s,i)=>{let o=s.nextSibling;t[e]=t[e]||[];while(o&&(o["s-sn"]===n||n===""&&!o["s-sn"]&&(o.nodeType===8&&o.nodeValue.indexOf(".")!==1||o.nodeType===3))&&!o["s-sf"]){o["s-sn"]=n;t[e].push({slot:s,node:o,hostId:i});o=o.nextSibling}};const ht=t=>xe.map((e=>e(t))).find((t=>!!t));const bt=(t,e)=>{if(t!=null&&!_(t)){if(e&4){return t==="false"?false:t===""||!!t}if(e&2){return parseFloat(t)}if(e&1){return String(t)}return t}return t};const $t=t=>pe(t).S;const mt=(t,e,n)=>{const s=$t(t);return{emit:t=>pt(s,e,{bubbles:!!(n&4),composed:!!(n&2),cancelable:!!(n&1),detail:t})}};const pt=(t,e,n)=>{const s=ke.ce(e,n);t.dispatchEvent(s);return s};const gt=new WeakMap;const jt=(t,e,n)=>{let s=Se.get(t);if(Me&&n){s=s||new CSSStyleSheet;if(typeof s==="string"){s=e}else{s.replaceSync(e)}}else{s=e}Se.set(t,s)};const yt=(t,e,n,s)=>{var i;let o=Ot(e);const l=Se.get(o);t=t.nodeType===11?t:Ee;if(l){if(typeof l==="string"){t=t.head||t;let e=gt.get(t);let n;if(!e){gt.set(t,e=new Set)}if(!e.has(o)){if(t.host&&(n=t.querySelector(`[${j}="${o}"]`))){n.innerHTML=l}else{{n=Ee.createElement("style");n.innerHTML=l}const e=(i=ke.k)!==null&&i!==void 0?i:E(Ee);if(e!=null){n.setAttribute("nonce",e)}t.insertBefore(n,t.querySelector("link"))}if(e){e.add(o)}}}else if(!t.adoptedStyleSheets.includes(l)){t.adoptedStyleSheets=[...t.adoptedStyleSheets,l]}}return o};const vt=t=>{const e=t.C;const n=t.S;const s=e.$;const i=d("attachStyles",e.M);const o=yt(n.shadowRoot?n.shadowRoot:n.getRootNode(),e);if(s&10){n["s-sc"]=o;n.classList.add(o+"-h");if(s&2){n.classList.add(o+"-s")}}i()};const Ot=(t,e)=>"sc-"+t.M;const wt=t=>t.replace(/\/\*!@([^\/]+)\*\/[^\{]+\{/g,"$1{");const St=(t,e,n,s,i,o)=>{if(n!==s){let l=ye(t,e);let f=e.toLowerCase();if(e==="class"){const e=t.classList;const i=_t(n);const o=_t(s);if(t["s-si"]&&o.indexOf(t["s-si"])<0){o.push(t["s-si"])}e.remove(...i.filter((t=>t&&!o.includes(t))));e.add(...o.filter((t=>t&&!i.includes(t))))}else if(e==="style"){{for(const e in n){if(!s||s[e]==null){if(e.includes("-")){t.style.removeProperty(e)}else{t.style[e]=""}}}}for(const e in s){if(!n||s[e]!==n[e]){if(e.includes("-")){t.style.setProperty(e,s[e])}else{t.style[e]=s[e]}}}}else if(e==="key");else if(e==="ref"){if(s){s(t)}}else if(!l&&e[0]==="o"&&e[1]==="n"){if(e[2]==="-"){e=e.slice(3)}else if(ye(_e,f)){e=f.slice(2)}else{e=f[2]+e.slice(3)}if(n){ke.rel(t,e,n,false)}if(s){ke.ael(t,e,s,false)}}else{const c=_(s);if((l||c&&s!==null)&&!i){try{if(!t.tagName.includes("-")){const i=s==null?"":s;if(e==="list"){l=false}else if(n==null||t[e]!=i){t[e]=i}}else{t[e]=s}}catch(t){}}let r=false;{if(f!==(f=f.replace(/^xlink\:?/,""))){e=f;r=true}}if(s==null||s===false){if(s!==false||t.getAttribute(e)===""){if(r){t.removeAttributeNS(w,e)}else{t.removeAttribute(e)}}}else if((!l||o&4||i)&&!c){s=s===true?"":s;if(r){t.setAttributeNS(w,e,s)}else{t.setAttribute(e,s)}}}}};const xt=/\s/;const _t=t=>!t?[]:t.split(xt);const Et=(t,e,n,s)=>{const i=e.p.nodeType===11&&e.p.host?e.p.host:e.p;const o=t&&t.o||S;const l=e.o||S;{for(s in o){if(!(s in l)){St(i,s,o[s],undefined,n,e.$)}}}for(s in l){St(i,s,o[s],l[s],n,e.$)}};const Tt=(t,o,c,r)=>{const u=o.l[c];let a=0;let d;let h;let b;if(!i){l=true;if(u.m==="slot"){if(e){r.classList.add(e+"-s")}u.$|=u.l?2:1}}if(u.i!==null){d=u.p=Ee.createTextNode(u.i)}else if(u.$&(1|2)){d=u.p=Ee.createTextNode("")}else{d=u.p=Ee.createElement(u.m);{Et(null,u,f)}if(x(e)&&d["s-si"]!==e){d.classList.add(d["s-si"]=e)}if(u.l){for(a=0;a<u.l.length;++a){h=Tt(t,u,a,d);if(h){d.__appendChild?d.__appendChild(h):d.appendChild(h)}}}}{d["s-hn"]=s;if(u.$&(2|1)){d["s-sr"]=true;d["s-cr"]=n;d["s-sn"]=u.h||"";if(o.h){d["s-psn"]=o.h}if(u.$&2){if(u.l){for(a=0;a<u.l.length;++a){let e=d.nodeType===1?d:r;while(e.nodeType!==1){e=e.parentNode}h=Tt(t,u,a,e);h["s-sf"]=d["s-hsf"]=true;if(typeof h["s-sn"]==="undefined"){h["s-sn"]=u.h||""}if(h.nodeType===3){h["s-sfc"]=h.textContent}if(h&&(!t||!t.l)){e.appendChild(h)}}}if(t&&t.l)Ut(t,u)}b=t&&t.l&&t.l[c];if(b&&b.m===u.m&&t.p){kt(t.p,false)}}}return d};const kt=(t,e)=>{ke.$|=1;const n=t.__childNodes||t.childNodes;for(let t=n.length-1;t>=0;t--){const i=n[t];if(i["s-hn"]!==s&&i["s-ol"]){Ht(i).insertBefore(i,Rt(i));i["s-ol"].remove();i["s-ol"]=undefined;l=true}if(e){kt(i,e)}}ke.$&=~1};const Ct=(t,e,n,i,o,l)=>{let f=t["s-cr"]&&t["s-cr"].parentNode||t;let c;if(f.shadowRoot&&f.tagName===s){f=f.shadowRoot}for(;o<=l;++o){if(i[o]){c=Tt(null,n,o,t);if(c){i[o].p=c;f.insertBefore(c,Rt(e))}}}};const Mt=t=>{const e=t.__childNodes||t.childNodes;let n;let s;let i;for(s=0,i=e.length;s<i;s++){n=e[s];if(n["s-ol"]){if(n["s-hn"])n["s-hn"]=undefined}else{Mt(n)}}};const Nt=(t,e,n,s,i)=>{for(;e<=n;++e){if(s=t[e]){i=s.p;Wt(s);{o=true;Mt(i);if(i["s-ol"]){i["s-ol"].remove()}else{kt(i,true)}}i.remove()}}};const Lt=(t,e,n,s)=>{const i=[];const l={};let f=0;let c=0;let r=0;let u=0;let a=0;let d=e.length-1;let h=e[0];let b=e[d];let $=s.length-1;let m=s[0];let p=s[$];let g;let j;let y;let v;let O;let w;let S;let x;let _;while(f<=d&&c<=$){if(h==null){h=e[++f]}else if(b==null){b=e[--d]}else if(m==null){m=s[++c]}else if(p==null){p=s[--$]}else if(It(h,m)){Ut(h,m);h=e[++f];m=s[++c]}else if(It(b,p)){Ut(b,p);b=e[--d];p=s[--$]}else if(It(h,p)){if(h.m==="slot"||p.m==="slot"){kt(h.p.parentNode,false)}Ut(h,p);t.insertBefore(h.p,b.p.nextSibling);h=e[++f];p=s[--$]}else if(It(b,m)){if(h.m==="slot"||p.m==="slot"){kt(b.p.parentNode,false)}Ut(b,m);t.insertBefore(b.p,h.p);b=e[--d];m=s[++c]}else{r=-1;{for(u=f;u<=d;++u){if(e[u]&&e[u].u!==null&&e[u].u===m.u){r=u;break}}}if(r>=0){j=e[r];if(j.m!==m.m){g=Tt(e&&e[c],n,r,t)}else{Ut(j,m);e[r]=undefined;g=j.p}m=s[++c]}else{g=Tt(e&&e[c],n,c,t);m=s[++c]}if(g){{Ht(h.p).insertBefore(g,Rt(h.p))}}}}if(f>d){Ct(t,s[$+1]==null?null:s[$+1].p,n,s,c,$)}else if(c>$){Nt(e,f,d)}if(t.parentNode&&n.p["s-hsf"]){y=t.parentNode.__childNodes||t.parentNode.childNodes;v=y.length-1;for(u=0;u<=v;++u){S=y[u];if(S["s-hsf"]){i.push(S);continue}if(S["s-sf"]){if(!l[S["s-sn"]])l[S["s-sn"]]=[];l[S["s-sn"]].push(S)}}O=i.length-1;for(u=0;u<=O;++u){x=i[u];if(typeof l[x["s-sn"]]==="undefined")continue;w=l[x["s-sn"]].length-1;for(a=0;a<=w;++a){_=l[x["s-sn"]][a];x.parentNode.insertBefore(_,x)}}o=true}};const It=(t,e)=>{if(t.m===e.m){if(t.m==="slot"){return t.h===e.h}{return t.u===e.u}}return false};const Rt=t=>t&&t["s-ol"]||t;const Ht=t=>(t["s-ol"]?t["s-ol"]:t).parentNode;const Ut=(t,e)=>{const n=e.p=t.p;const s=t.l;const i=e.l;const o=e.m;const l=e.i;let c;if(l===null){{if(o==="slot");else{Et(t,e,f)}}if(s!==null&&i!==null){Lt(n,s,e,i)}else if(i!==null){if(t.i!==null){n.textContent=""}Ct(n,null,e,i,0,i.length-1)}else if(s!==null){Nt(s,0,s.length-1)}}else if(c=n["s-cr"]){c.parentNode.textContent=l}else if(t.i!==l){n.textContent=l;if(n["s-sf"]){n["s-sfc"]=l}}};const At=[];const Pt=t=>{let e;let n;let s;let i;let l;let f;let c=0;const r=t.__childNodes||t.childNodes;const u=r.length;for(;c<u;c++){e=r[c];if(e["s-sr"]&&(n=e["s-cr"])&&n.parentNode){if(e["s-hsf"]){o=true}s=n.parentNode.__childNodes||n.parentNode.childNodes;i=e["s-sn"];for(f=s.length-1;f>=0;f--){n=s[f];if(!n["s-cn"]&&!n["s-nr"]&&n["s-hn"]!==e["s-hn"]){if(Dt(n,i)){l=At.find((t=>t.N===n));o=true;n["s-sn"]=n["s-sn"]||i;if(l){l.L=e}else{At.push({L:e,N:n})}if(n["s-sr"]){At.map((t=>{if(Dt(t.N,n["s-sn"])){l=At.find((t=>t.N===n));if(l&&!t.L){t.L=l.L}}}))}}else if(!At.some((t=>t.N===n))){At.push({N:n})}}}}if(e.nodeType===1){Pt(e)}}};const Dt=(t,e)=>{if(t.nodeType===1){if(t.getAttribute("slot")===null&&e===""){return true}if(t.getAttribute("slot")===e){return true}return false}if(t["s-sn"]===e){return true}return e===""};const Wt=t=>{{t.o&&t.o.ref&&t.o.ref(null);t.l&&t.l.map(Wt)}};const Ft=(t,f)=>{const c=t.S;const r=t.C;const u=t.j||k(null,null);const a=M(f)?f:T(null,null,f);s=c.tagName;if(r.I){a.o=a.o||{};r.I.map((([t,e])=>a.o[e]=c[t]))}a.m=null;a.$|=4;t.j=a;a.p=u.p=c.shadowRoot||c;{e=c["s-sc"]}{n=c["s-cr"];i=(r.$&1)!==0;o=false}Ut(u,a);{ke.$|=1;if(l){Pt(a.p);let t;let e;let n;let s;let i;let o;let l;let f=0;for(;f<At.length;f++){t=At[f];e=t.N;if(!e["s-ol"]){n=Ee.createTextNode("");n["s-nr"]=e;e.parentNode.insertBefore(e["s-ol"]=n,e)}}for(f=0;f<At.length;f++){t=At[f];e=t.N;if(t.L){s=t.L.parentNode;i=t.L.__nextSibling||t.L.nextSibling;n=e["s-ol"];l=i;while(n=n.__previousSibling||n.previousSibling){o=n["s-nr"];if(o&&o["s-sn"]===e["s-sn"]&&s===o.parentNode){o=o.__nextSibling||o.nextSibling;if(!o||!o["s-nr"]){i=o;break}}}if(!i&&s!==e.parentNode||(e.__nextSibling||e.nextSibling)!==i){if(e!==i){if(!e["s-hn"]&&e["s-ol"]){e["s-hn"]=e["s-ol"].parentNode.nodeName}s.insertBefore(e,i);e.hidden=false}else{s.insertBefore(e,l)}}}else{if(e.nodeType===1){e.hidden=true}}}}if(o){H(a.p)}ke.$&=~1;At.length=0}};const Bt=(t,e)=>{if(e&&!t.R&&e["s-p"]){e["s-p"].push(new Promise((e=>t.R=e)))}};const qt=(t,e)=>{{t.$|=16}if(t.$&4){t.$|=512;return}Bt(t,t.H);const n=()=>Vt(t,e);return Pe(n)};const Vt=(t,e)=>{const n=t.S;const s=d("scheduleUpdate",t.C.M);const i=t.U;let o;if(e){{t.$|=256;if(t.A){t.A.map((([t,e])=>Yt(i,t,e,n)));t.A=null}}{o=Yt(i,"componentWillLoad",undefined,n)}}{o=Zt(o,(()=>Yt(i,"componentWillRender",undefined,n)))}s();return Zt(o,(()=>zt(t,i,e)))};const zt=async(t,e,n)=>{const s=t.S;const i=d("update",t.C.M);const o=s["s-rc"];if(n){vt(t)}const l=d("render",t.C.M);{Gt(t,e)}if(o){o.map((t=>t()));s["s-rc"]=undefined}l();i();{const e=s["s-p"];const n=()=>Kt(t);if(e.length===0){n()}else{Promise.all(e).then(n);t.$|=4;e.length=0}}};const Gt=(t,e,n)=>{try{c=e;e=e.render();{t.$&=~16}{t.$|=2}{{{Ft(t,e)}}}}catch(e){ve(e,t.S)}c=null;return null};const Jt=()=>c;const Kt=t=>{const e=t.C.M;const n=t.S;const s=d("postUpdate",e);const i=t.U;const o=t.H;{Yt(i,"componentDidRender",undefined,n)}if(!(t.$&64)){t.$|=64;{te(n)}{Yt(i,"componentDidLoad",undefined,n)}s();{t.P(n);if(!o){Xt()}}}else{{Yt(i,"componentDidUpdate",undefined,n)}s()}{t.D(n)}{if(t.R){t.R();t.R=undefined}if(t.$&512){Ue((()=>qt(t,false)))}t.$&=~(4|512)}};const Qt=t=>{{const e=pe(t);const n=e.S.isConnected;if(n&&(e.$&(2|16))===2){qt(e,false)}return n}};const Xt=e=>{{te(Ee.documentElement)}Ue((()=>pt(_e,"appload",{detail:{namespace:t}})))};const Yt=(t,e,n,s)=>{if(t&&t[e]){try{return t[e](n)}catch(t){ve(t,s)}}return undefined};const Zt=(t,e)=>t&&t.then?t.then(e):e();const te=t=>t.classList.add("hydrated");const ee=(t,e)=>pe(t).W.get(e);const ne=(t,e,n,s,i=true)=>{const o=pe(t);const l=o.S;const f=o.W.get(e);const c=o.$;const r=o.U;n=bt(n,s.F[e][0]);const u=Number.isNaN(f)&&Number.isNaN(n);const a=n!==f&&!u;if((!(c&8)||f===undefined)&&a){o.W.set(e,n);if(r){if(s.B&&c&128&&i){const t=s.B[e];if(t){t.map((t=>{try{r[t](n,f,e)}catch(t){ve(t,l)}}))}}if((c&(2|16))===2){if(r.componentShouldUpdate){if(r.componentShouldUpdate(n,f,e)===false){return}}qt(o,false)}}}};const se=(t,e,n)=>{if(e.F){if(t.watchers){e.B=t.watchers}const s=Object.entries(e.F);const i=t.prototype;s.map((([t,[s]])=>{if(s&31||n&2&&s&32){if((s&2048)===0){Object.defineProperty(i,t,{get(){return ee(this,t)},set(n){ne(this,t,n,e)},configurable:true,enumerable:true})}else if(n&1&&s&2048){{Object.defineProperty(i,t,{get(){const e=pe(this);const n=e?e.U:i;if(!n)return;return n[t]},configurable:true,enumerable:true})}}if(s&4096){const n=Object.getOwnPropertyDescriptor(i,t).set;Object.defineProperty(i,t,{set(s){const i=pe(this);if(n){n.apply(this,[s]);ne(this,t,i.S[t],e);return}if(!i)return;const o=(n=false)=>{i.U[t]=s;ne(this,t,i.U[t],e,!n)};if(i.U){o()}else{i.q.then((()=>o(true)))}}})}}else if(n&1&&s&64){Object.defineProperty(i,t,{value(...e){const n=pe(this);return n.q.then((()=>n.U[t](...e)))}})}}));if(n&1){const n=new Map;i.attributeChangedCallback=function(t,e,s){ke.jmp((()=>{const e=n.get(t);if(this.hasOwnProperty(e)){s=this[e];delete this[e]}else if(i.hasOwnProperty(e)&&typeof this[e]==="number"&&this[e]==s){return}const o=Object.getOwnPropertyDescriptor(i,e);if(!o.get||!!o.set){this[e]=s===null&&typeof this[e]==="boolean"?false:s}}))};t.observedAttributes=s.filter((([t,e])=>e[0]&15)).map((([t,s])=>{const i=s[1]||t;n.set(i,t);if(s[0]&512){e.I.push([t,i])}return i}))}}return t};const ie=async(t,e,n,s,i)=>{if((e.$&32)===0){{e.$|=32;i=we(n,e);if(i.then){const t=h();i=await i;t()}if(!i.isProxied){{n.B=i.watchers}se(i,n,2);i.isProxied=true}const s=d("createInstance",n.M);{e.$|=8}try{new i(e)}catch(e){ve(e,t)}{e.$&=~8}{e.$|=128}s();oe(e.U,t)}if(i.style){let t=i.style;const e=Ot(n);if(!Se.has(e)){const s=d("registerStyles",n.M);jt(e,t,!!(n.$&1));s()}}}const o=e.H;const l=()=>qt(e,true);if(o&&o["s-rc"]){o["s-rc"].push(l)}else{l()}};const oe=(t,e)=>{{Yt(t,"connectedCallback",undefined,e)}};const le=t=>{if((ke.$&1)===0){const e=pe(t);const n=e.C;const s=d("connectedCallback",n.M);if(!(e.$&1)){e.$|=1;let s;{s=t.getAttribute(g);if(s){if(n.$&1){const e=yt(t.shadowRoot,n);t.classList.remove(e+"-h",e+"-s")}else if(n.$&2){let e=Ot(n);t["s-sc"]=e}ct(t,n.M,s,e)}}if(!s){if(n.$&(4|8)){fe(t)}}{let n=t;while(n=n.parentNode||n.host){if(n.nodeType===1&&n.hasAttribute("s-id")&&n["s-p"]||n["s-p"]){Bt(e,e.H=n);break}}}if(n.F){Object.entries(n.F).map((([e,[n]])=>{if(n&31&&t.hasOwnProperty(e)){const n=t[e];delete t[e];t[e]=n}}))}{ie(t,e,n)}}else if(e){ae(t,e,n.V);oe(e.U)}s()}};const fe=t=>{const e=t["s-cr"]=Ee.createComment("");e["s-cn"]=true;const n=t.__firstChild||t.firstChild;if(!!n){t.__insertBefore?t.__insertBefore(e,n):t.insertBefore(e,n)}else{t.__appendChild?t.__appendChild(e):t.appendChild(e)}};const ce=t=>{if((ke.$&1)===0){const e=pe(t);const n=e.U;{if(e.G){e.G.map((t=>t()));e.G=undefined}}{Yt(n,"disconnectedCallback",undefined,t)}}};const re=(t,e={})=>{var n;const s=d();const i=[];const o=e.exclude||[];const l=_e.customElements;const f=Ee.head;const c=f.querySelector("meta[charset]");const r=Ee.createElement("style");const u=[];const a=Ee.querySelectorAll(`[${j}]`);let h;let b=true;Object.assign(ke,e);ke.t=new URL(e.resourcesUrl||"./",Ee.baseURI).href;{ke.$|=2}t.map((t=>{t[1].map((n=>{const s={$:n[0],M:n[1],F:n[2],V:n[3]};{s.F=n[2]}{s.V=n[3]}{s.I=[]}{s.B={}}const f=e.transformTagName?e.transformTagName(s.M):s.M;const c=class extends HTMLElement{constructor(t){super(t);t=this;{const e=Ot(s,ht(t));const n=Array.from(a).find((t=>t.getAttribute(j)===e));if(n){if(s.$&1){jt(e,wt(n.innerHTML),true)}else{jt(e,n.innerHTML,false)}}}je(t,s);if(s.$&1){{{t.attachShadow({mode:"open"})}}}}connectedCallback(){if(h){clearTimeout(h);h=null}if(b){u.push(this)}else{ke.jmp((()=>le(this)))}}disconnectedCallback(){ke.jmp((()=>ce(this)))}componentOnReady(){return pe(this).J}};if(s.$&4||s.$&8){U(c.prototype);{A(c.prototype)}}s.K=t[0];if(!o.includes(f)&&!l.get(f)){i.push(f);l.define(f,se(c,s,1))}}))}));{r.innerHTML=i+v;r.setAttribute("data-styles","");const t=(n=ke.k)!==null&&n!==void 0?n:E(Ee);if(t!=null){r.setAttribute("nonce",t)}f.insertBefore(r,c?c.nextSibling:f.firstChild)}b=false;if(u.length){u.map((t=>t.connectedCallback()))}else{{ke.jmp((()=>h=setTimeout(Xt,30)))}}s()};const ue=(t,e)=>e;const ae=(t,e,n,s)=>{if(n){n.map((([n,s,i])=>{const o=he(t,n);const l=de(e,i);const f=be(n);ke.ael(o,s,l,f);(e.G=e.G||[]).push((()=>ke.rel(o,s,l,f)))}))}};const de=(t,e)=>n=>{try{{if(t.$&256){t.U[e](n)}else{(t.A=t.A||[]).push([e,n])}}}catch(e){ve(e,t.S||null)}};const he=(t,e)=>{if(e&8)return _e;if(e&16)return Ee.body;return t};const be=t=>(t&2)!==0;const $e=t=>ke.k=t;const me=new WeakMap;const pe=t=>me.get(t);const ge=(t,e)=>me.set(e.U=t,e);const je=(t,e)=>{const n={$:0,S:t,C:e,W:new Map};{n.q=new Promise((t=>n.D=t))}{n.J=new Promise((t=>n.P=t));t["s-p"]=[];t["s-rc"]=[]}ae(t,n,e.V);return me.set(t,n)};const ye=(t,e)=>e in t;const ve=(t,e)=>(0,console.error)(t,e);const Oe=new Map;const we=(t,e,n)=>{const s=t.M.replace(/-/g,"_");const i=t.K;const o=Oe.get(i);if(o){return o[s]}
5
- /*!__STENCIL_STATIC_IMPORT_SWITCH__*/return import(`./${i}.entry.js${""}`).then((t=>{if(i){Oe.set(i,t)}return t[s]}),(t=>{ve(t,e.S)}))};const Se=new Map;const xe=[];const _e=typeof window!=="undefined"?window:{};const Ee=_e.document||{head:{}};const Te=_e.HTMLElement||class{};const ke={$:0,t:"",jmp:t=>t(),raf:t=>requestAnimationFrame(t),ael:(t,e,n,s)=>t.addEventListener(e,n,s),rel:(t,e,n,s)=>t.removeEventListener(e,n,s),ce:(t,e)=>new CustomEvent(t,e)};const Ce=t=>Promise.resolve(t);const Me=(()=>{try{new CSSStyleSheet;return typeof(new CSSStyleSheet).replaceSync==="function"}catch(t){}return false})();const Ne=[];const Le=[];const Ie=(t,e)=>n=>{t.push(n);if(!r){r=true;if(e&&ke.$&4){Ue(He)}else{ke.raf(He)}}};const Re=t=>{for(let e=0;e<t.length;e++){try{t[e](performance.now())}catch(t){ve(t)}}t.length=0};const He=()=>{Re(Ne);{Re(Le);if(r=Ne.length>0){ke.raf(He)}}};const Ue=t=>Ce().then(t);const Ae=Ie(Ne,false);const Pe=Ie(Le,true);export{u as B,ue as F,Te as H,C as a,re as b,mt as c,Ae as d,Jt as e,Qt as f,$t as g,T as h,a as i,ve as j,Ce as p,ge as r,$e as s,Pe as w};
6
- //# sourceMappingURL=p-6ef53fa1.js.map