@nanoporetech-digital/components 8.10.0 → 8.10.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (146) hide show
  1. package/dist/cjs/{fade-BUa4h2hW.js → fade-CPjR03EH.js} +1 -1
  2. package/dist/cjs/{fullscreen-Dro71U7W.js → fullscreen-Bzjv2HGI.js} +1 -1
  3. package/dist/cjs/{lazyload-CTZM4xbV.js → lazyload-BNO_n6W8.js} +1 -1
  4. package/dist/cjs/nano-alert.cjs.entry.js +1 -1
  5. package/dist/cjs/nano-avatar_5.cjs.entry.js +8 -8
  6. package/dist/cjs/nano-details.cjs.entry.js +1 -1
  7. package/dist/cjs/nano-dialog.cjs.entry.js +1 -1
  8. package/dist/cjs/nano-dropdown_2.cjs.entry.js +1 -1
  9. package/dist/cjs/nano-icon-button_2.cjs.entry.js +2 -2
  10. package/dist/cjs/nano-in-page-nav.cjs.entry.js +1 -1
  11. package/dist/cjs/nano-input-otp.cjs.entry.js +8 -10
  12. package/dist/cjs/nano-intersection-observe.cjs.entry.js +1 -1
  13. package/dist/cjs/nano-masked-overflow.cjs.entry.js +3 -3
  14. package/dist/cjs/nano-menu-drawer.cjs.entry.js +3 -3
  15. package/dist/cjs/nano-more-less.cjs.entry.js +2 -2
  16. package/dist/cjs/nano-nav-item.cjs.entry.js +1 -1
  17. package/dist/cjs/nano-rating.cjs.entry.js +4 -4
  18. package/dist/cjs/nano-resize-observe.cjs.entry.js +2 -2
  19. package/dist/cjs/nano-slide.cjs.entry.js +1 -1
  20. package/dist/cjs/{nano-slides-Dg9sFuVO.js → nano-slides-C2K7j1yc.js} +7 -7
  21. package/dist/cjs/nano-slides.cjs.entry.js +1 -1
  22. package/dist/cjs/nano-sortable.cjs.entry.js +1 -1
  23. package/dist/cjs/nano-step-accordion.cjs.entry.js +1 -1
  24. package/dist/cjs/nano-step-breadcrumb.cjs.entry.js +2 -2
  25. package/dist/cjs/nano-sticker.cjs.entry.js +2 -2
  26. package/dist/cjs/nano-tab-content.cjs.entry.js +2 -2
  27. package/dist/cjs/nano-tab.cjs.entry.js +2 -2
  28. package/dist/cjs/nano-table.cjs.entry.js +2 -2
  29. package/dist/cjs/{page-dots-CaQhBKfq.js → page-dots-Db7Ce8kX.js} +1 -1
  30. package/dist/cjs/{slot-CJgcluNw.js → slot-BUMYLmup.js} +19 -3
  31. package/dist/collection/components/breadcrumb/breadcrumb.js +1 -1
  32. package/dist/collection/components/input-otp/input-otp.css +24 -23
  33. package/dist/collection/components/input-otp/input-otp.js +8 -9
  34. package/dist/collection/components/intersection-observe/intersection-observe.js +1 -1
  35. package/dist/collection/components/masked-overflow/masked-overflow.js +3 -3
  36. package/dist/collection/components/menu-drawer/menu-drawer.js +2 -2
  37. package/dist/collection/components/more-less/more-less.js +2 -2
  38. package/dist/collection/components/rating/rating.js +4 -4
  39. package/dist/collection/components/resize-observe/resize-observe.js +2 -2
  40. package/dist/collection/components/select/select.js +7 -7
  41. package/dist/collection/components/slides/slide.js +1 -1
  42. package/dist/collection/components/slides/slides.js +3 -3
  43. package/dist/collection/components/sortable/sortable.js +1 -1
  44. package/dist/collection/components/step-accordion/step-accordion.js +1 -1
  45. package/dist/collection/components/step-breadcrumb/step-breadcrumb.js +2 -2
  46. package/dist/collection/components/sticker/sticker.js +2 -2
  47. package/dist/collection/components/table/table.js +2 -2
  48. package/dist/collection/components/tabs/tab-content.js +2 -2
  49. package/dist/collection/components/tabs/tab.js +2 -2
  50. package/dist/collection/components/tooltip/tooltip.js +2 -2
  51. package/dist/collection/utils/slot.js +19 -3
  52. package/dist/components/masked-overflow.js +3 -3
  53. package/dist/components/nano-input-otp.js +7 -10
  54. package/dist/components/nano-intersection-observe.js +1 -1
  55. package/dist/components/nano-menu-drawer.js +2 -2
  56. package/dist/components/nano-more-less.js +2 -2
  57. package/dist/components/nano-rating.js +4 -4
  58. package/dist/components/nano-slide.js +1 -1
  59. package/dist/components/nano-sortable.js +1 -1
  60. package/dist/components/nano-step-accordion.js +1 -1
  61. package/dist/components/nano-step-breadcrumb.js +2 -2
  62. package/dist/components/nano-tab-content.js +2 -2
  63. package/dist/components/nano-tab.js +2 -2
  64. package/dist/components/nano-table.js +2 -2
  65. package/dist/components/resize-observe.js +2 -2
  66. package/dist/components/select.js +7 -7
  67. package/dist/components/slides.js +3 -3
  68. package/dist/components/slot.js +19 -3
  69. package/dist/components/sticker.js +2 -2
  70. package/dist/components/tooltip.js +2 -2
  71. package/dist/esm/{fade-bCJIX80t.js → fade-DWf-ekic.js} +1 -1
  72. package/dist/esm/{fullscreen-DOYo_j8C.js → fullscreen-DWET5K4U.js} +1 -1
  73. package/dist/esm/{lazyload-D2MQBzOR.js → lazyload-BSH0U2zW.js} +1 -1
  74. package/dist/esm/nano-alert.entry.js +1 -1
  75. package/dist/esm/nano-avatar_5.entry.js +8 -8
  76. package/dist/esm/nano-details.entry.js +1 -1
  77. package/dist/esm/nano-dialog.entry.js +1 -1
  78. package/dist/esm/nano-dropdown_2.entry.js +1 -1
  79. package/dist/esm/nano-icon-button_2.entry.js +2 -2
  80. package/dist/esm/nano-in-page-nav.entry.js +1 -1
  81. package/dist/esm/nano-input-otp.entry.js +8 -10
  82. package/dist/esm/nano-intersection-observe.entry.js +1 -1
  83. package/dist/esm/nano-masked-overflow.entry.js +3 -3
  84. package/dist/esm/nano-menu-drawer.entry.js +3 -3
  85. package/dist/esm/nano-more-less.entry.js +2 -2
  86. package/dist/esm/nano-nav-item.entry.js +1 -1
  87. package/dist/esm/nano-rating.entry.js +4 -4
  88. package/dist/esm/nano-resize-observe.entry.js +2 -2
  89. package/dist/esm/nano-slide.entry.js +1 -1
  90. package/dist/esm/{nano-slides-CuEgW0Us.js → nano-slides-BU8CjO-X.js} +7 -7
  91. package/dist/esm/nano-slides.entry.js +1 -1
  92. package/dist/esm/nano-sortable.entry.js +1 -1
  93. package/dist/esm/nano-step-accordion.entry.js +1 -1
  94. package/dist/esm/nano-step-breadcrumb.entry.js +2 -2
  95. package/dist/esm/nano-sticker.entry.js +2 -2
  96. package/dist/esm/nano-tab-content.entry.js +2 -2
  97. package/dist/esm/nano-tab.entry.js +2 -2
  98. package/dist/esm/nano-table.entry.js +2 -2
  99. package/dist/esm/{page-dots-D6hhv2PU.js → page-dots-Ckyic5vY.js} +1 -1
  100. package/dist/esm/{slot-CFTP7C_Z.js → slot-D31cEKyt.js} +19 -3
  101. package/dist/nano-components/{fade-bCJIX80t.js → fade-DWf-ekic.js} +1 -1
  102. package/dist/nano-components/{fullscreen-DOYo_j8C.js → fullscreen-DWET5K4U.js} +1 -1
  103. package/dist/nano-components/{lazyload-D2MQBzOR.js → lazyload-BSH0U2zW.js} +1 -1
  104. package/dist/nano-components/nano-alert.entry.js +1 -1
  105. package/dist/nano-components/nano-avatar_5.entry.js +1 -1
  106. package/dist/nano-components/nano-details.entry.js +1 -1
  107. package/dist/nano-components/nano-dialog.entry.js +1 -1
  108. package/dist/nano-components/nano-dropdown_2.entry.js +1 -1
  109. package/dist/nano-components/nano-icon-button_2.entry.js +1 -1
  110. package/dist/nano-components/nano-in-page-nav.entry.js +1 -1
  111. package/dist/nano-components/nano-input-otp.entry.js +1 -1
  112. package/dist/nano-components/nano-intersection-observe.entry.js +1 -1
  113. package/dist/nano-components/nano-masked-overflow.entry.js +1 -1
  114. package/dist/nano-components/nano-menu-drawer.entry.js +1 -1
  115. package/dist/nano-components/nano-more-less.entry.js +1 -1
  116. package/dist/nano-components/nano-nav-item.entry.js +1 -1
  117. package/dist/nano-components/nano-rating.entry.js +1 -1
  118. package/dist/nano-components/nano-resize-observe.entry.js +1 -1
  119. package/dist/nano-components/nano-slide.entry.js +1 -1
  120. package/dist/nano-components/{nano-slides-CuEgW0Us.js → nano-slides-BU8CjO-X.js} +2 -2
  121. package/dist/nano-components/nano-slides.entry.js +1 -1
  122. package/dist/nano-components/nano-sortable.entry.js +1 -1
  123. package/dist/nano-components/nano-step-accordion.entry.js +1 -1
  124. package/dist/nano-components/nano-step-breadcrumb.entry.js +1 -1
  125. package/dist/nano-components/nano-sticker.entry.js +1 -1
  126. package/dist/nano-components/nano-tab-content.entry.js +1 -1
  127. package/dist/nano-components/nano-tab.entry.js +1 -1
  128. package/dist/nano-components/nano-table.entry.js +1 -1
  129. package/dist/nano-components/{page-dots-D6hhv2PU.js → page-dots-Ckyic5vY.js} +1 -1
  130. package/dist/nano-components/slot-D31cEKyt.js +4 -0
  131. package/dist/types/components/input-otp/input-otp.d.ts +3 -0
  132. package/docs-json.json +21 -37
  133. package/hydrate/index.js +62 -50
  134. package/hydrate/index.mjs +62 -50
  135. package/package.json +2 -2
  136. package/dist/nano-components/slot-CFTP7C_Z.js +0 -4
  137. /package/dist/types/builds/{z1_PBzhd → bsFinusk}/0/Digital/nano-components/packages/components/.stencil/plugins/stencil/vue-output/generate-vue-component.d.ts +0 -0
  138. /package/dist/types/builds/{z1_PBzhd → bsFinusk}/0/Digital/nano-components/packages/components/.stencil/plugins/stencil/vue-output/index.d.ts +0 -0
  139. /package/dist/types/builds/{z1_PBzhd → bsFinusk}/0/Digital/nano-components/packages/components/.stencil/plugins/stencil/vue-output/output-vue.d.ts +0 -0
  140. /package/dist/types/builds/{z1_PBzhd → bsFinusk}/0/Digital/nano-components/packages/components/.stencil/plugins/stencil/vue-output/plugin.d.ts +0 -0
  141. /package/dist/types/builds/{z1_PBzhd → bsFinusk}/0/Digital/nano-components/packages/components/.stencil/plugins/stencil/vue-output/types.d.ts +0 -0
  142. /package/dist/types/builds/{z1_PBzhd → bsFinusk}/0/Digital/nano-components/packages/components/.stencil/plugins/stencil/vue-output/utils.d.ts +0 -0
  143. /package/dist/types/builds/{z1_PBzhd → bsFinusk}/0/Digital/nano-components/packages/components/.stencil/stencil.config.d.ts +0 -0
  144. /package/dist/types/builds/{z1_PBzhd → bsFinusk}/0/Digital/nano-components/packages/components/.stencil/stencil.config.prod.d.ts +0 -0
  145. /package/dist/types/builds/{z1_PBzhd → bsFinusk}/0/Digital/nano-components/packages/components/.stencil/testing/mocks/intersection-observer.d.ts +0 -0
  146. /package/dist/types/builds/{z1_PBzhd → bsFinusk}/0/Digital/nano-components/packages/components/.stencil/wdio.conf.d.ts +0 -0
@@ -320,7 +320,7 @@ const MaskedOverflow = /*@__PURE__*/ proxyCustomElement(class MaskedOverflow ext
320
320
  }
321
321
  }
322
322
  render() {
323
- return (h(Host, { key: 'cace0ef58ad901ea08d057420906d95ffa2600dd', dir: this.isRtl ? 'rtl' : null, class: "nano-masked-overflow", "has-scroll-controls": this.hasScrollControls }, h("div", { key: '6133235c4eb2be34c93cb681cd612ae7d227e8eb', part: "base", class: {
323
+ return (h(Host, { key: 'f09154c9daef9d42d1ac6bf1ae1cab43b25fc759', dir: this.isRtl ? 'rtl' : null, class: "nano-masked-overflow", "has-scroll-controls": this.hasScrollControls }, h("div", { key: 'c08a301b623b69a8a8936e846fb4d61c3d7a5d42', part: "base", class: {
324
324
  onav: true,
325
325
  [`onav--${this.orientation}`]: true,
326
326
  'onav--has-scroll-controls': this.hasScrollControls,
@@ -329,12 +329,12 @@ const MaskedOverflow = /*@__PURE__*/ proxyCustomElement(class MaskedOverflow ext
329
329
  'onav--no-transitions': this.instantReCalc,
330
330
  'onnav--has-indicator': this.showIndicator,
331
331
  'onnav--hide-scrollbars': this.hideScrollbars && this.hideScrollbars !== 'false',
332
- }, onClick: this.handleClick, onKeyDown: this.handleKeyDown }, h("div", { key: '56f5264594f6963dddbdbad7ecd6c25ae4c0732a', class: "onav__nav" }, this.scrollControls && (h("nano-icon-button", { key: 'be07616305b1753d843f346420149055b59f8023', part: "scroll-button scroll-button-prev", class: {
332
+ }, onClick: this.handleClick, onKeyDown: this.handleKeyDown }, h("div", { key: '4430bfab6920f77fe64885eb12c7a1f2ebfdbf31', class: "onav__nav" }, this.scrollControls && (h("nano-icon-button", { key: '800ac8de65485ebaa4060c26a7f0b3432348c8d1', part: "scroll-button scroll-button-prev", class: {
333
333
  'onav__scroll-button': true,
334
334
  'onav__scroll-button--start': true,
335
335
  }, ref: (btn) => (this.startBtn = btn), onClick: () => this.handleBtnClick(false), label: "Click to scroll", iconName: this.orientation === 'horizontal'
336
336
  ? 'light/chevron-left'
337
- : 'light/chevron-up' })), h("div", { key: '33c5125be511e2ed550ea4a4130ada309d6d4884', part: "scroller", ref: (el) => (this.nav = el), class: "onav__scroller", onScroll: this.handleScroll, tabindex: this.hasScrollControls ? 0 : undefined, role: "region", "aria-label": this.label || undefined }, h("div", { key: 'c7e3fa9f1272bcd57694aa7dd433f2da1ca4d4cb', part: "items", ref: (el) => (this.itemContainer = el), class: "onav__items" }, this.showIndicator && (h("div", { key: '5029cad9fb763501e8e670f3347e55e7eafbcb87', part: "indicator", ref: (el) => (this.activeIndicator = el), class: "onav__active-indicator" })), h("slot", { key: '1438ac0d40a0ec2952cf9b66bc2f854d5b96c690', onSlotchange: this.slotChangeHandler }))), this.scrollControls && (h("nano-icon-button", { key: '05dea3796c9d9e758c229f76fcb4dde2bd90fa65', part: "scroll-button scroll-button-next", class: {
337
+ : 'light/chevron-up' })), h("div", { key: '48fff7814d1c8a864ca9f29c0b4bc2196c7b4a98', part: "scroller", ref: (el) => (this.nav = el), class: "onav__scroller", onScroll: this.handleScroll, tabindex: this.hasScrollControls ? 0 : undefined, role: "region", "aria-label": this.label || undefined }, h("div", { key: '376a6e0007b1e9e35d3226e6575d0ca840b1f75a', part: "items", ref: (el) => (this.itemContainer = el), class: "onav__items" }, this.showIndicator && (h("div", { key: 'c0b933b6b29071de0f5b3d3b97497de231b45801', part: "indicator", ref: (el) => (this.activeIndicator = el), class: "onav__active-indicator" })), h("slot", { key: '2bff315c99ce804c26240ef5e134c1f08fed0547', onSlotchange: this.slotChangeHandler }))), this.scrollControls && (h("nano-icon-button", { key: 'd568e4adaf25dbf10127e433220fa6900298e31f', part: "scroll-button scroll-button-next", class: {
338
338
  'onav__scroll-button': true,
339
339
  'onav__scroll-button--end': true,
340
340
  }, ref: (btn) => (this.endBtn = btn), onClick: () => this.handleBtnClick(true), label: "Click to scroll", iconName: this.orientation === 'horizontal'
@@ -2,9 +2,10 @@
2
2
  * Custom elements for Nanopore-Digital Web applications
3
3
  */
4
4
  import { proxyCustomElement, HTMLElement, createEvent, h, Host, Fragment } from '@stencil/core/internal/client';
5
+ import { H as HasSlotController } from './slot.js';
5
6
  import { d as defineCustomElement$2 } from './icon.js';
6
7
 
7
- const inputOtpCss = ".sc-nano-input-otp-h,*.sc-nano-input-otp,*.sc-nano-input-otp::before,*.sc-nano-input-otp::after{box-sizing:border-box}[hidden].sc-nano-input-otp{display:none !important}@media (prefers-reduced-motion: reduce){.sc-nano-input-otp-h,*.sc-nano-input-otp,*.sc-nano-input-otp::before,*.sc-nano-input-otp::after{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important;scroll-behavior:auto !important}}.sc-nano-input-otp-h,*.sc-nano-input-otp,*.sc-nano-input-otp::before,*.sc-nano-input-otp::after{box-sizing:border-box}[hidden].sc-nano-input-otp{display:none !important}@media (prefers-reduced-motion: reduce){.sc-nano-input-otp-h,*.sc-nano-input-otp,*.sc-nano-input-otp::before,*.sc-nano-input-otp::after{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important;scroll-behavior:auto !important}}.sc-nano-input-otp-h{--margin-top:0;--margin-end:0;--margin-bottom:0;--margin-start:0;--padding-top:var(--nano-spacing-md);--padding-end:0;--padding-bottom:var(--nano-spacing-xl);--padding-start:0;--color:initial;--min-width:40px;--width:40px;--height:50px;--gap:8px;--separator-width:7px;--separator-height:1px;--separator-border-radius:0;--separator-color:var(--nano-color-primary-1000);--highlight-color-valid:var(--nano-color-success-1100);--highlight-color-invalid:var(--nano-color-warning-1100);--border-radius:8px;--border-color:var(--nano-color-neutral-700);--border-width:1px;display:block;position:relative}.input-otp-group.sc-nano-input-otp{margin:var(--margin-top) var(--margin-end) var(--margin-bottom) var(--margin-start);padding:var(--padding-top) var(--padding-end) var(--padding-bottom) var(--padding-start);display:flex;align-items:center;justify-content:center;gap:var(--gap)}.native-wrapper.sc-nano-input-otp{display:flex;align-items:center;justify-content:center;min-inline-size:var(--min-width)}.native-input.sc-nano-input-otp{border-radius:var(--border-radius);inline-size:var(--width);min-inline-size:inherit;block-size:var(--height);border-width:var(--border-width);border-style:solid;border-color:var(--border-color);background:var(--background);color:var(--color);font-size:inherit;text-align:center;appearance:none}.input-otp-description.sc-nano-input-otp{color:currentcolor;font-size:var(--nano-font-size-xs);line-height:var(--nano-line-height-normal);text-align:center;position:relative;inset-inline-start:-24px}.input-otp-description-hidden.sc-nano-input-otp{display:none}.input-otp-separator.sc-nano-input-otp{border-radius:var(--separator-border-radius);flex-shrink:0;inline-size:var(--separator-width);block-size:var(--separator-height);background:var(--separator-color)}.input-otp-disabled.sc-nano-input-otp-h{--color:var(--nano-color-neutral-700);opacity:0.5}.input-otp-disabled.sc-nano-input-otp-h,.input-otp-disabled.sc-nano-input-otp-h .native-input.sc-nano-input-otp:disabled{cursor:not-allowed}.has-focus.sc-nano-input-otp-h .native-input.sc-nano-input-otp:focus{outline:var(--nano-focus-ring)}.nano-invalid.sc-nano-input-otp-h .native-input.sc-nano-input-otp{border-color:var(--highlight-color-invalid)}.nano-valid.sc-nano-input-otp-h .native-input.sc-nano-input-otp{border-color:var(--highlight-color-valid)}.input-otp-icon.sc-nano-input-otp{inline-size:24px;block-size:24px;display:flex;align-items:center}.input-otp-icon--valid.sc-nano-input-otp{color:var(--nano-color-success-1100)}.input-otp-icon--invalid.sc-nano-input-otp{color:var(--nano-color-warning-1100)}";
8
+ const inputOtpCss = ".sc-nano-input-otp-h,*.sc-nano-input-otp,*.sc-nano-input-otp::before,*.sc-nano-input-otp::after{box-sizing:border-box}[hidden].sc-nano-input-otp{display:none !important}@media (prefers-reduced-motion: reduce){.sc-nano-input-otp-h,*.sc-nano-input-otp,*.sc-nano-input-otp::before,*.sc-nano-input-otp::after{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important;scroll-behavior:auto !important}}.sc-nano-input-otp-h,*.sc-nano-input-otp,*.sc-nano-input-otp::before,*.sc-nano-input-otp::after{box-sizing:border-box}[hidden].sc-nano-input-otp{display:none !important}@media (prefers-reduced-motion: reduce){.sc-nano-input-otp-h,*.sc-nano-input-otp,*.sc-nano-input-otp::before,*.sc-nano-input-otp::after{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important;scroll-behavior:auto !important}}.sc-nano-input-otp-h{--color:initial;--min-width:40px;--width:40px;--height:50px;--gap:8px;--icon-size:var(--nano-pictogram-size-small);--inline-padding:calc(var(--icon-size) + var(--gap));--spacing:var(--nano-spacing-xl);--separator-width:7px;--separator-height:1px;--separator-border-radius:0;--separator-color:var(--nano-color-primary-1000);--highlight-color-valid:var(--nano-color-success-1100);--highlight-color-invalid:var(--nano-color-warning-1100);--border-radius:8px;--border-color:var(--nano-color-neutral-700);--border-width:1px;display:block;position:relative;margin-inline:var(--inline-padding)}.input-otp-container.sc-nano-input-otp{position:relative;inline-size:fit-content;block-size:fit-content;margin:0 auto}.input-otp-group.sc-nano-input-otp{display:flex;align-items:center;justify-content:center;gap:var(--gap)}.native-wrapper.sc-nano-input-otp{display:flex;align-items:center;justify-content:center;min-inline-size:var(--min-width)}.native-input.sc-nano-input-otp{border-radius:var(--border-radius);inline-size:var(--width);min-inline-size:inherit;block-size:var(--height);border-width:var(--border-width);border-style:solid;border-color:var(--border-color);background:var(--background);color:var(--color);font-size:inherit;text-align:center;appearance:none}.input-otp-description.sc-nano-input-otp{color:currentcolor;font-size:var(--nano-font-size-xs);line-height:var(--nano-line-height-normal);text-align:center;position:relative;margin-inline-start:var(--spacing)}.input-otp-description-hidden.sc-nano-input-otp{display:none}.input-otp-separator.sc-nano-input-otp{border-radius:var(--separator-border-radius);flex-shrink:0;inline-size:var(--separator-width);block-size:var(--separator-height);background:var(--separator-color)}.input-otp-disabled.sc-nano-input-otp-h{--color:var(--nano-color-neutral-700);opacity:0.5}.input-otp-disabled.sc-nano-input-otp-h,.input-otp-disabled.sc-nano-input-otp-h .native-input.sc-nano-input-otp:disabled{cursor:not-allowed}.has-focus.sc-nano-input-otp-h .native-input.sc-nano-input-otp:focus{outline:var(--nano-focus-ring)}.nano-invalid.sc-nano-input-otp-h .native-input.sc-nano-input-otp{border-color:var(--highlight-color-invalid)}.nano-valid.sc-nano-input-otp-h .native-input.sc-nano-input-otp{border-color:var(--highlight-color-valid)}.input-otp-icon.sc-nano-input-otp{position:absolute;inset-block-start:50%;transform:translateY(-43%);inset-inline-end:calc((var(--gap) + var(--icon-size)) * -1);inline-size:var(--icon-size);block-size:var(--icon-size);display:flex;align-items:center}.input-otp-icon--valid.sc-nano-input-otp{color:var(--nano-color-success-1100)}.input-otp-icon--invalid.sc-nano-input-otp{color:var(--nano-color-warning-1100)}";
8
9
 
9
10
  const InputOTP = /*@__PURE__*/ proxyCustomElement(class InputOTP extends HTMLElement {
10
11
  constructor() {
@@ -18,6 +19,7 @@ const InputOTP = /*@__PURE__*/ proxyCustomElement(class InputOTP extends HTMLEle
18
19
  }
19
20
  inputRefs = [];
20
21
  inputId = `nano-input-otp-${inputIds++}`;
22
+ slotCtrl = new HasSlotController(this, '[default]');
21
23
  /**
22
24
  * Stores the initial value of the input when it receives focus.
23
25
  * Used to determine if the value changed during the focus session
@@ -679,26 +681,21 @@ const InputOTP = /*@__PURE__*/ proxyCustomElement(class InputOTP extends HTMLEle
679
681
  inputValues.some((v) => v !== '' && !this.validKeyPattern.test(v));
680
682
  }
681
683
  render() {
682
- const { disabled, el, hasFocus, inputId, inputRefs, inputValues, length, readonly, invalid, valid, } = this;
684
+ const { disabled, hasFocus, inputId, inputRefs, inputValues, length, readonly, invalid, valid, } = this;
683
685
  const inputmode = this.getInputmode();
684
686
  const tabbableIndex = this.getTabbableIndex();
685
687
  const pattern = this.getPattern();
686
- const hasDescription = el.querySelector('.input-otp-description')?.textContent?.trim() !== '';
687
- return (h(Host, { key: 'f397a0775d2d961ccc9013206fae72a8d0ad90ae', class: {
688
+ return (h(Host, { key: 'fb427bd3cb9bda29ec05c851e23a522c6966f4c0', class: {
688
689
  'has-focus': hasFocus,
689
690
  'input-otp-disabled': disabled,
690
691
  'input-otp-readonly': readonly,
691
692
  'nano-invalid': invalid,
692
693
  'nano-valid': valid,
693
- } }, h("div", { key: 'add5fe905af87f4c9b87d29c66134ede52ff2b6b', role: "group", "aria-label": "One-time password input", class: "input-otp-group" }, Array.from({ length }).map((_, index) => (h(Fragment, null, h("div", { class: "native-wrapper" }, h("input", { class: "native-input", id: `${inputId}-${index}`, "aria-label": `Input ${index + 1} of ${length}`, type: "text", inputmode: inputmode, pattern: pattern, disabled: disabled, readOnly: readonly, tabIndex: index === tabbableIndex ? 0 : -1, value: inputValues[index] || '', autocomplete: "one-time-code", ref: (el) => (inputRefs[index] = el), onInput: this.onInput(index), onBlur: this.onBlur, onFocus: this.onFocus(index), onKeyDown: this.onKeyDown(index), onPaste: this.onPaste })), this.showSeparator(index) && h("div", { class: "input-otp-separator" })))), this.showValidity && (h("div", { key: '71d38d8f343be559d187f1c5710a64733cf7ceaa', class: {
694
+ } }, h("div", { key: '7b5067c8e3f91b71d9110c26e7ec6a91c560de8c', class: "input-otp-container" }, h("div", { key: 'a2420e14e2392429eca041ed0ce70e2b387d4922', class: "input-otp-group", role: "group", "aria-label": "One-time password input" }, Array.from({ length }).map((_, index) => (h(Fragment, null, h("div", { class: "native-wrapper" }, h("input", { class: "native-input", id: `${inputId}-${index}`, "aria-label": `Input ${index + 1} of ${length}`, type: "text", inputmode: inputmode, pattern: pattern, disabled: disabled, readOnly: readonly, tabIndex: index === tabbableIndex ? 0 : -1, value: inputValues[index] || '', autocomplete: "one-time-code", ref: (el) => (inputRefs[index] = el), onInput: this.onInput(index), onBlur: this.onBlur, onFocus: this.onFocus(index), onKeyDown: this.onKeyDown(index), onPaste: this.onPaste })), this.showSeparator(index) && (h("div", { class: "input-otp-separator" })))))), this.showValidity && (h("div", { key: '345be96b0c208d367804822eef00fbfdee3ecbfe', class: {
694
695
  'input-otp-icon': true,
695
696
  'input-otp-icon--valid': valid,
696
697
  'input-otp-icon--invalid': invalid,
697
- } }, h("slot", { key: '14529ecc57a6268932bc1485f0a425bb6cb45c51', name: "validity-icon" }, h("nano-icon", { key: '65669a6b4ca76011b721e76fb68b7f9bfeb87092', hidden: !valid, name: "light/circle-check", class: "input-otp-valid-icon", "aria-label": "Valid input" }))))), h("div", { key: '3e677ab8517765759a0cc4a0aa6f0fec58767c90', class: {
698
- 'input-otp-description': true,
699
- 'input-otp-description-hidden': !hasDescription,
700
- 'input-otp-description-inset': this.showValidity,
701
- } }, h("slot", { key: 'e875d5c5d7ed8f804b9866618b7ed5e5211dd7b1' }))));
698
+ }, part: "validity-icon" }, h("slot", { key: '7d4a86988e4097f3422aaa2f0ee5df4518da1d41', name: "validity-icon" }, h("nano-icon", { key: '6b81e7a0430e36c0381b7787558509f525f7eed5', hidden: !valid, name: "light/circle-check", class: "input-otp-valid-icon", "aria-label": "Valid input" }))))), this.slotCtrl.has('[default]') && (h("div", { key: '6d97b65cc7fad0f1828608887773081312f3bf92', class: "input-otp-description" }, h("slot", { key: '459b7f12a59fec36ff465126c79083f14dce4a8a' })))));
702
699
  }
703
700
  static get watchers() { return {
704
701
  "value": ["valueChanged"]
@@ -144,7 +144,7 @@ const IntersectionObserve = /*@__PURE__*/ proxyCustomElement(class IntersectionO
144
144
  this.removeIO();
145
145
  }
146
146
  render() {
147
- return (h(Host, { key: 'c837369d760b533f7bbed5ade5994206923e6ffa', class: "nano-intersection-observe" }, h("slot", { key: 'c12806aaf721afbd10a14a3f6c23bd08217128b6', ref: (slot) => (this.defaultSlot = slot), onSlotchange: this.handleSlotChange })));
147
+ return (h(Host, { key: '6ed0913499a9caede509c0394a2be337ddbcfc7c', class: "nano-intersection-observe" }, h("slot", { key: 'a55eeb8c1527dd62aba761b60b6a0764cbd5bfa4', ref: (slot) => (this.defaultSlot = slot), onSlotchange: this.handleSlotChange })));
148
148
  }
149
149
  static get watchers() { return {
150
150
  "root": ["handleRootChange"],
@@ -146,14 +146,14 @@ const MenuDrawer = /*@__PURE__*/ proxyCustomElement(class MenuDrawer extends HTM
146
146
  }
147
147
  }
148
148
  render() {
149
- return (h(Host, { key: '48267091ca0646f3a1717e2dc3ab21ab3d4b9b28', class: {
149
+ return (h(Host, { key: 'bed821db8e5a30f26c3c9bad45b01321bdf4ca77', class: {
150
150
  open: this.open,
151
151
  'secondary-open': this.secondaryOpen,
152
152
  hide: this.hide,
153
153
  loading: this.isLoading,
154
154
  'has-global-nav': !!this.globalNav,
155
155
  'nano-menu-drawer': true,
156
- }, dir: this.el.ownerDocument.dir === 'rtl' ? 'rtl' : null }, h("div", { key: 'f73a9c15c9760493b38ac5b199f2d374eb99ffd0', ref: (div) => (this.containerDiv = div), class: "container" }, h("div", { key: 'a2a254a08025a5d4f33ecd10fb25ee2bedddc657', class: `content-wrap ${this.secondaryOpen ? 'secondary-open' : ''}` }, h("nav", { key: '4c93989684795be81b332aa12638424493eda51f', ref: (div) => (this.contentDiv = div), class: "content" }, h("div", { key: 'fb7fdba72b7e211dd99020b9a78dde35c11f0c7e', class: "head" }, h("button", { key: '1829973a4d5bb9c4053bd5a5b8d7d24befc02599', onClick: this.toggle, class: "collapse-btn" }, h("nano-icon", { key: '614bca81c5086ed499a62d38540f6c107f5c779e', name: "light/arrow-right-to-line" }), h("span", { key: 'da6cbb5a0c0f0a908afac83b01322bc5bfede0b5', class: "visually-hidden" }, "collapse / expand menu"))), h("slot", { key: 'd3ddb04ad19784a71575ff50c2cbd4410b70dcb6' }), this.slotCtrl.has('foot') && (h("div", { key: '5282ecb332f91aaedf7996f1a86165656187f12a', class: "foot" }, h("slot", { key: 'c0c227384d0ec749a03c1fdfe5764923f08c2405', name: "foot" }))))))));
156
+ }, dir: this.el.ownerDocument.dir === 'rtl' ? 'rtl' : null }, h("div", { key: 'e80fe18a73873359fc1d86ca93a06b8c6d3173c1', ref: (div) => (this.containerDiv = div), class: "container" }, h("div", { key: 'fe83b1858bacd94f3e0540ee3933d1018f7bfb9d', class: `content-wrap ${this.secondaryOpen ? 'secondary-open' : ''}` }, h("nav", { key: 'bed3b6c253cf16f8a796393be71c2c1b9aebd266', ref: (div) => (this.contentDiv = div), class: "content" }, h("div", { key: 'a8ea363c51345c83fcbf8723a32627bd99c5a9cf', class: "head" }, h("button", { key: 'fa9765354704685582e64771ded73c30c88e0374', onClick: this.toggle, class: "collapse-btn" }, h("nano-icon", { key: '0489c46c0c76a72720daf6656e26c2946433bccc', name: "light/arrow-right-to-line" }), h("span", { key: '81b00aaf09a528d6137351df20e23149a5325bf0', class: "visually-hidden" }, "collapse / expand menu"))), h("slot", { key: 'ab5f6ed3b81b2d5f741a1d102a12db5b0f68bae7' }), this.slotCtrl.has('foot') && (h("div", { key: 'dbb8345173ee78b9685cc46c6dcde5c2d617a868', class: "foot" }, h("slot", { key: '93bfeb1493a1d5e9a420803a09e64dced877591b', name: "foot" }))))))));
157
157
  }
158
158
  static get watchers() { return {
159
159
  "open": ["openChange"]
@@ -54,8 +54,8 @@ const Rating = /*@__PURE__*/ proxyCustomElement(class Rating extends HTMLElement
54
54
  this.handleShowHideElements();
55
55
  }
56
56
  render() {
57
- return (h(Host, { key: '85aea064a37e2a66a31e8bab208eba423aa32a4e', class: "nano-more-less" }, h("slot", { key: 'c7288c755fa9cb24abb335158fe9ae1e116a012e', onSlotchange: () => this.handleShowHideElements() }), this.children?.length > this.maxToShow && [
58
- h("div", { key: 'ff18caab62f14cdff9cc5953cda9d4980e6e4b6a', style: { display: this.show ? 'none' : 'contents' }, class: "button-wrapper", part: "button-wrapper button-wrapper--less", onClick: (e) => this.handleClick(e) }, h("slot", { key: '8a7a856af8fca1221c308c2a0982e09b9c9da74f', name: "less" }, h("button", { key: '33578129514a86169e642f32fb9a66d257412719', part: "button button--less" }, "Show more (+", this.children.length - this.maxToShow, ")"))),
57
+ return (h(Host, { key: 'b129148afdc959f912a16d1e2642c3e920a0a381', class: "nano-more-less" }, h("slot", { key: '92aa96b6301d14f7b4d9aee9cc4cafbf0ff75431', onSlotchange: () => this.handleShowHideElements() }), this.children?.length > this.maxToShow && [
58
+ h("div", { key: '73a5c457e8243cd8cf8e8ec1e681aa2c62244936', style: { display: this.show ? 'none' : 'contents' }, class: "button-wrapper", part: "button-wrapper button-wrapper--less", onClick: (e) => this.handleClick(e) }, h("slot", { key: '48802275120ff78676a19b25f792806dd03db2c1', name: "less" }, h("button", { key: '703d054e4560cf22d571a29838dfbd649062f7ca', part: "button button--less" }, "Show more (+", this.children.length - this.maxToShow, ")"))),
59
59
  !this.noHideBtn ? (h("div", { style: { display: this.show ? 'contents' : 'none' }, class: "button-wrapper", part: "button-wrapper button-wrapper--more", onClick: (e) => this.handleClick(e) }, h("slot", { name: "more" }, h("button", { part: "button button--more" }, "Show less (-", this.children.length - this.maxToShow, ")")))) : (''),
60
60
  ]));
61
61
  }
@@ -194,20 +194,20 @@ const Rating = /*@__PURE__*/ proxyCustomElement(class Rating extends HTMLElement
194
194
  else {
195
195
  displayValue = this.isHovering ? this.hoverValue : this.value;
196
196
  }
197
- return (h(Host, { key: 'b28d1a7ff7743338ff5ae18c386e49ee20f8df8e', class: "nano-rating" }, h("label", { key: '6fda8cf5da0b9ed38776ec3a9b93ec4fc02598b0', class: `rating-label${this.hideLabel ? ' visually-hidden' : ''}`, part: "label", htmlFor: this.name }, h("slot", { key: 'e92e2482a6aefd90bd27b5831ec75f0fb12fcd8b', name: "label" }, this.label)), h("input", { key: 'ef40cee201942dc8f0851f2ee4d785d3b1d27936', class: "range-input visually-hidden", name: this.name, id: this.name, disabled: this.disabled || this.readonly, required: this.required, value: this.value, onFocus: () => {
197
+ return (h(Host, { key: '3011ba88cafed0ec3c79d823a3abac433f68b5d1', class: "nano-rating" }, h("label", { key: 'ea6a01bc5a7f8e7fecbb16a905c472b5e1c62328', class: `rating-label${this.hideLabel ? ' visually-hidden' : ''}`, part: "label", htmlFor: this.name }, h("slot", { key: '22e31eeaed0aca337a71c1bbb39c238413f1c00c', name: "label" }, this.label)), h("input", { key: '265bd0055cbd05911611e0a5e45828d4dab7ac8c', class: "range-input visually-hidden", name: this.name, id: this.name, disabled: this.disabled || this.readonly, required: this.required, value: this.value, onFocus: () => {
198
198
  this.setFocus();
199
- } }), h("div", { key: '46c610322bc3b802d822cd22bfdcf3ad32f7e4d2', class: "rating-wrap" }, h("div", { key: 'fd509ff1f80a8172c00f2b320e6f5dbfd1252676', dir: this.isRtl ? 'rtl' : null, ref: (el) => (this.rating = el), part: "base", class: {
199
+ } }), h("div", { key: '4c0af619c68c230a5994871efdf5608870fb83e0', class: "rating-wrap" }, h("div", { key: 'e6f94c258bc04b6a4a6aad66c9364c1c811f859a', dir: this.isRtl ? 'rtl' : null, ref: (el) => (this.rating = el), part: "base", class: {
200
200
  rating: true,
201
201
  'rating--readonly': this.readonly,
202
202
  'rating--disabled': this.disabled,
203
- }, "aria-disabled": this.disabled ? 'true' : 'false', "aria-readonly": this.readonly ? 'true' : 'false', "aria-valuenow": this.value, "aria-valuemin": 0, "aria-valuemax": this.max, tabIndex: this.disabled ? -1 : 0, onClick: this.handleClick, onKeyDown: this.handleKeyDown, onMouseEnter: this.handleMouseEnter, onMouseLeave: this.handleMouseLeave, onMouseMove: this.handleMouseMove, onFocus: this.handleFocus, onBlur: this.handleBlur }, h("span", { key: 'd03101004803060722fd234f3500a5f7ac6e0603', class: "rating__symbols rating__symbols--inactive" }, counter.map((index) => (h("span", { class: {
203
+ }, "aria-disabled": this.disabled ? 'true' : 'false', "aria-readonly": this.readonly ? 'true' : 'false', "aria-valuenow": this.value, "aria-valuemin": 0, "aria-valuemax": this.max, tabIndex: this.disabled ? -1 : 0, onClick: this.handleClick, onKeyDown: this.handleKeyDown, onMouseEnter: this.handleMouseEnter, onMouseLeave: this.handleMouseLeave, onMouseMove: this.handleMouseMove, onFocus: this.handleFocus, onBlur: this.handleBlur }, h("span", { key: 'd514ae0f85be4d59ab6a2ae4496357c5d6601ba9', class: "rating__symbols rating__symbols--inactive" }, counter.map((index) => (h("span", { class: {
204
204
  rating__symbol: true,
205
205
  'rating__symbol--hover': this.isHovering && Math.ceil(displayValue) === index + 1,
206
206
  },
207
207
  // Users can click the current value to clear the rating. When this happens, we set this.isHovering to
208
208
  // false to prevent the hover state from confusing them as they move the mouse out of the control. This
209
209
  // extra mouseenter will reinstate it if they happen to mouse over an adjacent symbol.
210
- onMouseEnter: this.handleMouseEnter, innerHTML: this.symbol(index + 1) })))), h("span", { key: '2e5b35988ef0b699c515fd86a5ab14b3a98f9215', ref: (span) => (this.indicator = span), class: "rating__symbols rating__symbols--indicator", style: {
210
+ onMouseEnter: this.handleMouseEnter, innerHTML: this.symbol(index + 1) })))), h("span", { key: '0caf2f0561d3b74e6891e6c2a4b970fef53298f3', ref: (span) => (this.indicator = span), class: "rating__symbols rating__symbols--indicator", style: {
211
211
  clip: this.clip(displayValue),
212
212
  } }, counter.map((index) => (h("span", { class: {
213
213
  rating__symbol: true,
@@ -39,7 +39,7 @@ const Slide = /*@__PURE__*/ proxyCustomElement(class Slide extends HTMLElement {
39
39
  });
40
40
  }
41
41
  render() {
42
- return (h(Host, { key: '599510bff6daf72dca9b1de41767aea575eae98a', class: "nano-slide" }, h("slot", { key: '911f54eb0ad7ee91d7ea358f2e581d55793416ee' })));
42
+ return (h(Host, { key: '3de94ff45cb6dddcca7f0097f3376361c2666f7e', class: "nano-slide" }, h("slot", { key: '9998d9102bdc69eecd28752b4a2c130497b34d06' })));
43
43
  }
44
44
  static get watchers() { return {
45
45
  "ready": ["readyChange"]
@@ -730,7 +730,7 @@ const Sortable = /*@__PURE__*/ proxyCustomElement(class Sortable extends HTMLEle
730
730
  }
731
731
  }
732
732
  render() {
733
- return (h(Host, { key: 'db8dbc8b62755164c30650a9485205f8ea2c6107', class: "nano-sortable" }, h("div", { key: '0c4646d0cf095e9970787ae4a5101765f0f5fe4f', class: "sortable__live-region", "aria-live": "polite", "aria-relevant": "additions", "aria-atomic": "true", role: "log", part: "announcements" }, this.ariaTextList.map((str) => (h("div", null, str)))), h("slot", { key: '41e538783cb246a7ada58353374228a833b4fc4a' })));
733
+ return (h(Host, { key: '290c407551a2742f1aea13b69bf6e76783ac04cf', class: "nano-sortable" }, h("div", { key: '85d9c75f73d2c010bf8a8944855ef4b9af8ca24e', class: "sortable__live-region", "aria-live": "polite", "aria-relevant": "additions", "aria-atomic": "true", role: "log", part: "announcements" }, this.ariaTextList.map((str) => (h("div", null, str)))), h("slot", { key: '9c7984602c800c36731218593811876aac6ed948' })));
734
734
  }
735
735
  static get watchers() { return {
736
736
  "itemSelector": ["handleItemSelectorChange"],
@@ -86,7 +86,7 @@ const NanoStepAccordion$1 = /*@__PURE__*/ proxyCustomElement(class NanoStepAccor
86
86
  }
87
87
  }
88
88
  render() {
89
- return (h("nano-accordion", { key: '1edc585b390f5dd6c1fe6edaf103e096b8d02d06', alwaysOpen: true, onNanoToggle: (event) => this.handleToggle(event) }, this.steps.map((step, index) => (h("nano-details", { open: index === this.activeStep, disabled: !step.enabled, class: {
89
+ return (h("nano-accordion", { key: '3676ae38e897988059d679e2f3b3291641a4a2b0', alwaysOpen: true, onNanoToggle: (event) => this.handleToggle(event) }, this.steps.map((step, index) => (h("nano-details", { open: index === this.activeStep, disabled: !step.enabled, class: {
90
90
  step: true,
91
91
  'step--active': index === this.activeStep,
92
92
  'step--complete': step.complete,
@@ -111,10 +111,10 @@ const NanoStepBreadcrumb$1 = /*@__PURE__*/ proxyCustomElement(class NanoStepBrea
111
111
  };
112
112
  render() {
113
113
  const Wrapper = this.steps.filter((step) => step.href).length > 0 ? 'nav' : 'div';
114
- return (h(Host, { key: 'e54c227339a1e973cad1889abb1828cef81061a1' }, h(Wrapper, { key: '9a9ef044e63d1cebb713c0e9184ed58ed7865a32', class: "step-wrapper" }, h("ul", { key: 'cf3ef2fa474ae023be0059434fc03f1bfeade40c', class: `step-list desktop ${this.cacheKey}` }, this.steps.map((step, index) => (h("li", { class: "step-item-wrapper", key: index }, h(this.ControlTag, { step: step, index: index }))))), h("div", { key: '18a9e9e00597e8ef15df7134a29dabb5f51fad93', class: `step-list mobile ${this.cacheKey}` }, h("nano-dropdown", { key: '0e174964823bc2c6e1cc0bcd4e1d320bc3e74e11', dialogTitle: "Steps", class: "step-dropdown" }, h("button", { key: '75863494b5e948c53b91f15e083270ac142abe61', slot: "trigger", class: "step-trigger" }, h("div", { key: '093819821dc278086f12d5f8cb008649b43b3230', class: "step-progress-circle", role: "progressbar", "aria-valuenow": "2", "aria-valuemin": "0", "aria-valuemax": "5", style: {
114
+ return (h(Host, { key: 'c1b1866d4889830fa70d570df0bea118561df7bf' }, h(Wrapper, { key: '630fc450433bd177410e4e69730781cec88b0ea5', class: "step-wrapper" }, h("ul", { key: 'd8b35166bbb9b01df388387997f4b2a4dc612f55', class: `step-list desktop ${this.cacheKey}` }, this.steps.map((step, index) => (h("li", { class: "step-item-wrapper", key: index }, h(this.ControlTag, { step: step, index: index }))))), h("div", { key: 'aa8e3119c641c02f4ac960d4e415c7c327249c8e', class: `step-list mobile ${this.cacheKey}` }, h("nano-dropdown", { key: '61172362d21ec93527e431ab96d9f66075aa52dc', dialogTitle: "Steps", class: "step-dropdown" }, h("button", { key: '8edb7e0ddac43cff9b001ba504f003d6df64895f', slot: "trigger", class: "step-trigger" }, h("div", { key: 'a7ba7d9b0c6724ce19bd556cbfef2fdd9dc36f2b', class: "step-progress-circle", role: "progressbar", "aria-valuenow": "2", "aria-valuemin": "0", "aria-valuemax": "5", style: {
115
115
  '--value': '' + (this.activeStep + 1),
116
116
  '--max': '' + this.steps.length,
117
- } }, h("span", { key: 'da12da205c5e4942dc6b158ab4366a87b3d600c0', class: "step-progress-text" }, h("strong", { key: '15298a28fd78508485b54ed24df255087560e627' }, this.activeStep + 1), " of", ' ', this.steps.length)), h("div", { key: 'a67108bd294391381e5e9fa17e6132844eb510c4', class: "step-trigger-text" }, h("div", { key: '46906878f501008c8ceab76276d4f5b47469d9e3', class: "step-trigger-now" }, this.steps[this.activeStep | 0]?.title || 'Select a step'), h("div", { key: '898e4abb1800652352efe446e45c48d3673a656c', class: "step-trigger-next" }, this.steps[this.activeStep + 1]?.title || 'Next step')), h("nano-icon", { key: 'f972d82aaed693d49536862f45c268646dd8742b', class: "step-trigger-icon", name: "light/chevron-down" })), h("nano-menu", { key: '2b6555a0ef2743486e940d75cb3486110f88cad1' }, this.steps.map((step, index) => (h("nano-nav-item", { class: {
117
+ } }, h("span", { key: 'd84750e092190edd64cd3cecc7a36e2b8b400fbe', class: "step-progress-text" }, h("strong", { key: '6b2f3cd970a2e64299c0d9f85ee59cd93a041858' }, this.activeStep + 1), " of", ' ', this.steps.length)), h("div", { key: '53ebc1b869804b2bae5dc6e9a8cdb2e78027c0c2', class: "step-trigger-text" }, h("div", { key: 'b419abee3f2fa764f19f9f3910347dac89f7b278', class: "step-trigger-now" }, this.steps[this.activeStep | 0]?.title || 'Select a step'), h("div", { key: '6c307ffcd845df90950811e0e88e624ebec495a4', class: "step-trigger-next" }, this.steps[this.activeStep + 1]?.title || 'Next step')), h("nano-icon", { key: '1c012c4bf4e264a328dad23317f73451148176fc', class: "step-trigger-icon", name: "light/chevron-down" })), h("nano-menu", { key: 'ef2bac97f59de0f9b63837cb5c0d67958b32d3ce' }, this.steps.map((step, index) => (h("nano-nav-item", { class: {
118
118
  'step-item-mobile': true,
119
119
  'step-item-mobile step-item--active': index === this.activeStep,
120
120
  'step-item-mobile step-item--complete': step.complete,
@@ -24,10 +24,10 @@ const NanoTabContent$1 = /*@__PURE__*/ proxyCustomElement(class NanoTabContent e
24
24
  requestAnimationFrame(() => (this.ready = true));
25
25
  }
26
26
  render() {
27
- return (h(Host, { key: '3118031c009c947f2a7882a8dd65556b686d1c9d', id: this.host.id || this.tabContentId, style: { display: this.active ? 'block' : 'none' }, role: "tabpanel", "aria-hidden": this.active ? 'false' : 'true', class: {
27
+ return (h(Host, { key: '7899878aa521145bc4fe77a7e81ddbd2d48b739e', id: this.host.id || this.tabContentId, style: { display: this.active ? 'block' : 'none' }, role: "tabpanel", "aria-hidden": this.active ? 'false' : 'true', class: {
28
28
  ready: this.ready,
29
29
  'nano-tab-content': true,
30
- } }, h("div", { key: 'cab097ece6d3473e5fc425dbde951fcaf399c5ba', part: "base", class: "nano-tab-content" }, h("slot", { key: 'b4ce04af8ea780022c5a9e63a16f1d087432a931' }))));
30
+ } }, h("div", { key: '68d1c780cf1f6d4d0ef77b1dafa7766aa08ba52b', part: "base", class: "nano-tab-content" }, h("slot", { key: 'd8be1c667173f69f74fbead600d79bf96da42cbe' }))));
31
31
  }
32
32
  static get style() { return tabContentCss; }
33
33
  }, [257, "nano-tab-content", {
@@ -49,12 +49,12 @@ const NanoTab$1 = /*@__PURE__*/ proxyCustomElement(class NanoTab extends HTMLEle
49
49
  }
50
50
  };
51
51
  render() {
52
- return (h(Host, { key: 'ad80886d87f28ad3a2ae019f361662f21c6617b3', id: this.host.id || this.tabId, role: "tab", "aria-disabled": this.disabled ? 'true' : 'false', "aria-selected": this.active ? 'true' : 'false', class: "nano-tab" }, h("div", { key: '445b8acdf4a87b4541f8bc1b9354c91bad6d77a4', part: `base${this.active ? ' base--active' : ''}${this.disabled ? ' base--disabled' : ''}${this.closable ? ' base--closable' : ''}`, class: {
52
+ return (h(Host, { key: '735b30efba4aecf7bfa515f1fc33d9c507d8ded0', id: this.host.id || this.tabId, role: "tab", "aria-disabled": this.disabled ? 'true' : 'false', "aria-selected": this.active ? 'true' : 'false', class: "nano-tab" }, h("div", { key: '400e6997781a7499613f0b04cf559ee8598801e2', part: `base${this.active ? ' base--active' : ''}${this.disabled ? ' base--disabled' : ''}${this.closable ? ' base--closable' : ''}`, class: {
53
53
  tab: true,
54
54
  'tab--active': this.active,
55
55
  'tab--disabled': this.disabled,
56
56
  'tab--closable': this.closable,
57
- } }, h("slot", { key: 'a72a156f0792fb7943c46d7edc6da51d222f4285', name: "start" }), h("div", { key: 'e7c654c4efe7bafaa41fdbafaae96976f4089f67', part: "label", ref: (el) => (this.tab = el), tabindex: this.disabled || !this.active ? '-1' : '0', class: "tab__label" }, h("slot", { key: '65f9a3b5342dfca0a8e6ec9be289f3ad4bb5da4e' })), h("slot", { key: 'e044937dc98a2650b58f7a792e0e190de80e2d00', name: "end" }), this.closable && !this.disabled && (h("nano-icon-button", { key: 'c7809dea53cb6ca1660f58f06f3a861f18950cba', label: "Close this tab", iconName: "light/xmark", class: "tab__close-button", onClick: this.handleCloseClick, onKeyDown: this.handleCloseKeydown, part: "close-button" })))));
57
+ } }, h("slot", { key: '059131aa192ceac9ca9b61db2daf7029c0153d66', name: "start" }), h("div", { key: '76fba07c2ded5f4a2d93f9540fd222655c507517', part: "label", ref: (el) => (this.tab = el), tabindex: this.disabled || !this.active ? '-1' : '0', class: "tab__label" }, h("slot", { key: '2ac34a7e63e38ed4821d39e35b276b1155e2edd3' })), h("slot", { key: '7d1b2f561c64e3be7a464d9e24ea7fd5d2a56b66', name: "end" }), this.closable && !this.disabled && (h("nano-icon-button", { key: '72497156f9858f16c0d4521cbc6d559cd2266be8', label: "Close this tab", iconName: "light/xmark", class: "tab__close-button", onClick: this.handleCloseClick, onKeyDown: this.handleCloseKeydown, part: "close-button" })))));
58
58
  }
59
59
  static get style() { return tabCss; }
60
60
  }, [257, "nano-tab", {
@@ -233,10 +233,10 @@ const NanoTable$1 = /*@__PURE__*/ proxyCustomElement(class NanoTable extends HTM
233
233
  this.cleanUpObservers();
234
234
  }
235
235
  render() {
236
- return (h(Host, { key: '75c4089a6d670a16eea3fca8d079ac9a827c4cfa', class: {
236
+ return (h(Host, { key: 'e2ee468673f70252fc559a82e48b74f12273e416', class: {
237
237
  'nano-table': true,
238
238
  'nano-table--props-ready': this.propsReady,
239
- } }, this.scrollable && (h("nano-masked-overflow", { key: '90a1e07d2daa97047c3be1381717a8ae3b53b5e1', hideScrollbars: false, scrollControls: false, label: this.caption?.textContent || undefined, class: "nano-table__overflow-container" }, h("div", { key: 'badc595c9931fb6198ab38b4e09cdf4201fcc064', class: "nano-table__overflow" }))), h("slot", { key: 'd3fd5902fccc42b3412e9cb1950b054b5a69a525' })));
239
+ } }, this.scrollable && (h("nano-masked-overflow", { key: '63091df4a07695276d762d2a5ad5f535c9ed67dd', hideScrollbars: false, scrollControls: false, label: this.caption?.textContent || undefined, class: "nano-table__overflow-container" }, h("div", { key: '2defbb73d6077d95351c50685c70e6c32f05fd87', class: "nano-table__overflow" }))), h("slot", { key: '71a9d57114363f976eb139d494a8383795a67a8b' })));
240
240
  }
241
241
  static get watchers() { return {
242
242
  "compact": ["handleCompactChange"],
@@ -228,13 +228,13 @@ const ResizeObserve = /*@__PURE__*/ proxyCustomElement(class ResizeObserve exten
228
228
  }
229
229
  }
230
230
  render() {
231
- return (h(Host, { key: '5db8e84066e7fd3d903f19e2256844331580947a', class: {
231
+ return (h(Host, { key: 'a2c57218f65a9af2297e6662c29d3a7c853092df', class: {
232
232
  'nano-resize-observe': true,
233
233
  'content-fit-x': this.contentFitX,
234
234
  'content-fit-y': this.contentFitY,
235
235
  'content-nofit-x': this.contentFitX === false,
236
236
  'content-nofit-y': this.contentFitY === false,
237
- } }, h("slot", { key: 'ee5842c110b25f82eacbb4ba618d33dad345e732' }), !!this.notifyContentFit &&
237
+ } }, h("slot", { key: 'cf0faa31f7c1daa08238555a46699c1b731e13b8' }), !!this.notifyContentFit &&
238
238
  (this.contentFitX !== null || this.contentFitY !== null) && [
239
239
  this.contentFitX ? (h("slot", { name: "content-fit-x" })) : (h("slot", { name: "content-nofit-x" })),
240
240
  this.contentFitY ? (h("slot", { name: "content-fit-y" })) : (h("slot", { name: "content-nofit-y" })),
@@ -711,30 +711,30 @@ const Select = /*@__PURE__*/ proxyCustomElement(class Select extends HTMLElement
711
711
  disabled,
712
712
  clearControl: this.clearable,
713
713
  }))(this);
714
- return (h(Host, { key: 'fff4c3c510b9c343af91cd44cd31a437bbd15a78', type: this.multiple ? 'select-multiple' : 'select-one', "aria-disabled": this.disabled ? 'true' : null, class: {
714
+ return (h(Host, { key: 'a2c56f43fef750f8e336a1612644761293b19bd4', type: this.multiple ? 'select-multiple' : 'select-one', "aria-disabled": this.disabled ? 'true' : null, class: {
715
715
  'has-value': !!this.value.length || !!this.inputSearchVal.length,
716
716
  'has-focus': this.hasFocus,
717
717
  'is-invalid': this._invalid === true,
718
718
  'is-valid': this._invalid === false,
719
719
  'nano-select': true,
720
- } }, h(FormControlWrap, { key: '57e3eca97027e9195328c5da6e10c46000ffe67e', ...wrapOptions, class: {
720
+ } }, h(FormControlWrap, { key: '632d901cdff60d36ae1a410f6c252c671eac8e63', ...wrapOptions, class: {
721
721
  'has-error': !!this.errorMessage &&
722
722
  this.showInlineError &&
723
723
  this._invalid === true,
724
724
  'has-helper': this.hasHelperSlot,
725
725
  'is-open': this.hasOpened,
726
726
  masked: this.mask,
727
- } }, h(FormControl, { key: 'be1a38b3b662d7cd40ce738ef9185d18dae22318', ...controlOptions, ref: (el) => (this.selectWrap = el), onClearText: this.clearSelectValue, control: this.el, endValueSlot: h("slot", { name: "down-arrow" }, h("nano-icon", { class: "select__down-arrow", name: "light/chevron-down" })), showInlineError: this.showInlineError }, this.multiple && (h("div", { key: '89b7b5b75ef67513c228f230c11122333448408f', class: "select__multi-wrap select" }, this.multipleValues(labelId, moreId, helperEndId))), !this.multiple && [
728
- this.mask && (h("div", { key: 'efd35e47435a363be382ceae43d4348479cd50b5', class: "select__mask" }, this.getLabel(this.value))),
729
- h("input", { key: '236a63937ee3c981bbc2e4d77d72516f4d614326', ref: (input) => (this.inputCtrl = input), id: this.selectId, class: "select__native-input", "aria-labelledby": labelId + ' ' + moreId + ' ' + helperEndId, disabled: this.disabled, form: this.form, placeholder: this.placeholder, readonly: true, required: this.required, value: this.getLabel(this.value), onFocus: this.onFocus }),
730
- ])), !this.readonly && !this.disabled && (h("nano-datalist", { key: 'c0e2707266e76ed2714cbd91727c828e4e0e9861', ref: (el) => (this.datalist = el), selected: this.valArray, type: this.multiple ? 'selectMulti' : 'select', options: this._options.length ? this._options : undefined, onNanoDeselect: (e) => {
727
+ } }, h(FormControl, { key: '387a55518ed1c74ea944008c750a0ca42a6bbbe8', ...controlOptions, ref: (el) => (this.selectWrap = el), onClearText: this.clearSelectValue, control: this.el, endValueSlot: h("slot", { name: "down-arrow" }, h("nano-icon", { class: "select__down-arrow", name: "light/chevron-down" })), showInlineError: this.showInlineError }, this.multiple && (h("div", { key: '660b70b098520471d4f7653af5cc50388625cd1c', class: "select__multi-wrap select" }, this.multipleValues(labelId, moreId, helperEndId))), !this.multiple && [
728
+ this.mask && (h("div", { key: '44f53317d26f2f8b85b5c8b397ccfd68a26eebb5', class: "select__mask" }, this.getLabel(this.value))),
729
+ h("input", { key: '04f3935c7f759e3767f32faecb9e6ef81a36c777', ref: (input) => (this.inputCtrl = input), id: this.selectId, class: "select__native-input", "aria-labelledby": labelId + ' ' + moreId + ' ' + helperEndId, disabled: this.disabled, form: this.form, placeholder: this.placeholder, readonly: true, required: this.required, value: this.getLabel(this.value), onFocus: this.onFocus }),
730
+ ])), !this.readonly && !this.disabled && (h("nano-datalist", { key: 'aae86b85c3bd2c2c562468f2a33e52c7036ad69b', ref: (el) => (this.datalist = el), selected: this.valArray, type: this.multiple ? 'selectMulti' : 'select', options: this._options.length ? this._options : undefined, onNanoDeselect: (e) => {
731
731
  e.preventDefault();
732
732
  this.removeValue(e.detail.value);
733
733
  }, onNanoOptionsUpdated: this.setOptions, onNanoSelect: this.setValue,
734
734
  // @ts-expect-error - this bubbles from the nano-dropdown
735
735
  onNanoShow: () => (this.hasOpened = true), onNanoHide: () => (this.hasOpened = false) }, this.allowCustomValues &&
736
736
  this.multiple &&
737
- !!this.inputSearchVal && (h("nano-option", { key: 'bfc7c0f31d962d89369ff173236bebbca134885d', slot: "list-top", value: this.inputSearchVal, selected: false, label: this.inputSearchVal, onNanoSelect: () => this.inputCtrl.focus() }, h("span", { key: '2f2f299440d4aca0c718308ad819873cf5f71163', slot: "check-icon" }), "Add '", this.inputSearchVal, "'")), h("slot", { key: '5c41abf1e6e6c7b897538beb6b4509ae5f845ce6' }))), h("select", { key: '3443483daf9d524e98cb3614f67a630b349b033f', id: this.selectId + '-hidden', class: "select__native-ctrl", ref: (select) => (this.nativeSelect = select), "aria-labelledby": labelId + ' ' + moreId + ' ' + helperEndId, disabled: this.disabled, form: this.form, multiple: this.multiple, name: this.name, required: this.required, onInvalid: this.handleInvalid }, this.allowCustomValues &&
737
+ !!this.inputSearchVal && (h("nano-option", { key: 'cf744eb6bbad3ce2d8d05354d5edaf3eab07a207', slot: "list-top", value: this.inputSearchVal, selected: false, label: this.inputSearchVal, onNanoSelect: () => this.inputCtrl.focus() }, h("span", { key: '990e00208c403d92d1586fb0b2c4618768f5fda5', slot: "check-icon" }), "Add '", this.inputSearchVal, "'")), h("slot", { key: '54fce41f95c01e0b2ff1619209ebb15a28383677' }))), h("select", { key: '1c5ff40ac84be25c6b7075ef031b29f2b6f9b007', id: this.selectId + '-hidden', class: "select__native-ctrl", ref: (select) => (this.nativeSelect = select), "aria-labelledby": labelId + ' ' + moreId + ' ' + helperEndId, disabled: this.disabled, form: this.form, multiple: this.multiple, name: this.name, required: this.required, onInvalid: this.handleInvalid }, this.allowCustomValues &&
738
738
  this.valArray.map((val) => {
739
739
  return (h("option", { value: val, selected: true }, val));
740
740
  }), !this.allowCustomValues &&
@@ -2961,15 +2961,15 @@ const Slides = /*@__PURE__*/ proxyCustomElement(class Slides extends HTMLElement
2961
2961
  this.destroyflickity();
2962
2962
  }
2963
2963
  render() {
2964
- return (h(Host, { key: 'e259a3a5de2c5dc025ab6dc61c3a41e1f812f077', class: "nano-slides" }, h("div", { key: '74abbe2dd44755ae5e5c5c766e6833c74c152aa8', class: {
2964
+ return (h(Host, { key: '3a10721073af3ef6658047ba47aef766698df2c1', class: "nano-slides" }, h("div", { key: '2603091b764a61836422c2b1edacfa99f2275533', class: {
2965
2965
  slideshow: true,
2966
2966
  ready: this.ready,
2967
2967
  'not-ready': !this.ready,
2968
- }, part: "base" }, h("div", { key: '1a0a00d3ad6651a06fe46f1beff537f9cd483fc7', ref: (div) => (this.flickityEl = div), class: {
2968
+ }, part: "base" }, h("div", { key: 'a7c997143a864dd9d458deed4ea8034701c4e270', ref: (div) => (this.flickityEl = div), class: {
2969
2969
  'flickity-container': true,
2970
2970
  'slides-ready': this.slidesReady,
2971
2971
  'slides-not-ready': !this.slidesReady,
2972
- }, part: "slide-container" }, h("slot", { key: '7a0edeee40901099cc455337acad6e798041f4f1' })), h("div", { key: 'bef46a7658a4ff89d02a2feb6dbcdd64d8e965f2', class: "ui-extras" }, h("slot", { key: '2f0603645945a8e77de9252036363e770e8e424d', name: "ui" })))));
2972
+ }, part: "slide-container" }, h("slot", { key: '366fbe336c1f7a77781327d4b887da201a59c732' })), h("div", { key: 'e2d9004f2e5e4e95d98275f80d63073d7ea2518b', class: "ui-extras" }, h("slot", { key: '0e88f115692ab91d33040f4ee03422f99ac10771', name: "ui" })))));
2973
2973
  }
2974
2974
  static get watchers() { return {
2975
2975
  "options": ["optionsChanged"],
@@ -61,7 +61,21 @@ class HasSlotController {
61
61
  hasDefaultSlot() {
62
62
  if (!this.host)
63
63
  return false;
64
- return [...this.host.childNodes].some((node) => {
64
+ let childNodes;
65
+ if (this.host.shadowRoot) {
66
+ // * Regular shadow DOM component *
67
+ childNodes = [...this.host.shadowRoot.childNodes];
68
+ }
69
+ else if (!this.host.classList.contains('hydrated')) {
70
+ // * Non-shadow, polyfilled component *
71
+ // Component has not done initial render. Return component internals
72
+ childNodes = [...(this.host?.__childNodes ?? [])];
73
+ }
74
+ else {
75
+ // Component is ready, return 'light DOM' children
76
+ childNodes = [...this.host.childNodes];
77
+ }
78
+ return childNodes.some((node) => {
65
79
  if (node.nodeType === Node.TEXT_NODE && node.textContent.trim() !== '') {
66
80
  return true;
67
81
  }
@@ -88,12 +102,14 @@ class HasSlotController {
88
102
  hostConnected() {
89
103
  if (Build.isServer)
90
104
  return;
91
- this.host.shadowRoot.addEventListener('slotchange', this.handleSlotChange);
105
+ const listenTarget = this.host.shadowRoot ?? this.host;
106
+ listenTarget.addEventListener('slotchange', this.handleSlotChange);
92
107
  }
93
108
  hostDisconnected() {
94
109
  if (Build.isServer || !this.host)
95
110
  return;
96
- this.host.shadowRoot.removeEventListener('slotchange', this.handleSlotChange);
111
+ const listenTarget = this.host.shadowRoot ?? this.host;
112
+ listenTarget.removeEventListener('slotchange', this.handleSlotChange);
97
113
  }
98
114
  handleSlotChange = (event) => {
99
115
  const slot = event.target;
@@ -607,12 +607,12 @@ const Sticker = /*@__PURE__*/ proxyCustomElement(class Sticker extends HTMLEleme
607
607
  this.hasBootstrapped = false;
608
608
  }
609
609
  render() {
610
- return (h(Host, { key: '6626d945b580e7e23d940db522958250e89261ad', sticky: !this.isRootSticker && !this.stickToEle && this.isSticky, hide: this.hide && this.isStuck, siblings: this.stuckCounter, index: this.stickerIndex, stuck: this.isStuck && this.isSticky, "placed-bottom": this.positions.includes('bottom'), "placed-top": this.positions.includes('top'), "placed-end": this.positions.includes('end'), "placed-start": this.positions.includes('start'), class: "nano-sticker" }, h("div", { key: '1e4b7f859218a5ed2256f7f860dcffa4b1b8f5be', class: {
610
+ return (h(Host, { key: 'f339585bb8f9d509f374404a6462b482ee7f7001', sticky: !this.isRootSticker && !this.stickToEle && this.isSticky, hide: this.hide && this.isStuck, siblings: this.stuckCounter, index: this.stickerIndex, stuck: this.isStuck && this.isSticky, "placed-bottom": this.positions.includes('bottom'), "placed-top": this.positions.includes('top'), "placed-end": this.positions.includes('end'), "placed-start": this.positions.includes('start'), class: "nano-sticker" }, h("div", { key: 'a0825842c7fb6fd7ab7e15a6775547693e38c1cb', class: {
611
611
  sticker: true,
612
612
  sticky: this.isRootSticker && this.isSticky,
613
613
  stuck: this.isStuck && this.isRootSticker && this.isSticky,
614
614
  hide: this.isRootSticker && this.hide && this.isStuck,
615
- }, ref: (div) => (this.sticker = div) }, h("div", { key: '4f7cd61f38b78433296a9708ddbd702d97cf2435', class: "sticker-content", ref: (div) => (this.content = div) }, h("slot", { key: 'a88a8500ee1ea99324f9b1b7390675486035496c' })))));
615
+ }, ref: (div) => (this.sticker = div) }, h("div", { key: '3693b4a7c4daf5b5208b36a158b0d0b1f3ced9b0', class: "sticker-content", ref: (div) => (this.content = div) }, h("slot", { key: '526f2d5e88882133ec67866d90cdf18b95ce86cc' })))));
616
616
  }
617
617
  static get watchers() { return {
618
618
  "trigger": ["updateTriggerOffset"],
@@ -230,10 +230,10 @@ const Tooltip = /*@__PURE__*/ proxyCustomElement(class Tooltip extends HTMLEleme
230
230
  this.popover.destroy();
231
231
  }
232
232
  render() {
233
- return (h(Host, { key: '30c71d884cf8fc1c2e97092dad0fb5d6695c77a8', onKeyDown: this.handleKeyDown, onMouseOver: this.handleMouseOver, onMouseOut: this.handleMouseOut, onBlur: this.handleBlur, onFocus: this.handleFocus, onClick: this.handleClick, class: "nano-tooltip" }, h("slot", { key: 'b7e7893c178d99abeb0f1e5a35892fddc8ab302a', onSlotchange: this.handleSlotChange }), h("div", { key: '83aae47d9745dcce88f6119ffa63b3bea809dc17', ref: (el) => (this.tooltipPositioner = el), class: "tooltip-positioner", popover: "manual" }, h("div", { key: 'f5cd2aa11ef281358d11057c866b298202398fc2', part: "base", ref: (el) => (this.tooltip = el), class: {
233
+ return (h(Host, { key: '4e1a851a25fb3b85f17ce51e6d3ca6c4ef88096b', onKeyDown: this.handleKeyDown, onMouseOver: this.handleMouseOver, onMouseOut: this.handleMouseOut, onBlur: this.handleBlur, onFocus: this.handleFocus, onClick: this.handleClick, class: "nano-tooltip" }, h("slot", { key: '040fd84cf165db44447013c4f830c127f9c3cffa', onSlotchange: this.handleSlotChange }), h("div", { key: 'ce342385aa99cb783ee5438812eba7eb6d52993a', ref: (el) => (this.tooltipPositioner = el), class: "tooltip-positioner", popover: "manual" }, h("div", { key: '37c9a935a2e9b9d1970a1bf4269aea5fd959176b', part: "base", ref: (el) => (this.tooltip = el), class: {
234
234
  tooltip: true,
235
235
  'tooltip--open': this.open,
236
- }, role: "tooltip", "aria-hidden": this.open ? 'false' : 'true' }, h("slot", { key: '0dc5a5f28b439406f2d19dc4822b221bbb65a9e8', name: "content", onSlotchange: () => this.setLabel() }, this.content), h("div", { key: 'd196bcffcfd4b26cf085ec21cc7965a369dd55ab', class: "tooltip-arrow", "data-popper-arrow": true })))));
236
+ }, role: "tooltip", "aria-hidden": this.open ? 'false' : 'true' }, h("slot", { key: '2131e35600ffcf0bf1531f84a2dbc0d954083ab8', name: "content", onSlotchange: () => this.setLabel() }, this.content), h("div", { key: '98953a383fbc4f68c96015e1e44a5618fb6efb97', class: "tooltip-arrow", "data-popper-arrow": true })))));
237
237
  }
238
238
  static get watchers() { return {
239
239
  "content": ["setLabel"],
@@ -1,7 +1,7 @@
1
1
  /*!
2
2
  * Custom elements for Nanopore-Digital Web applications
3
3
  */
4
- import { F as Flickity, u as utils } from './nano-slides-CuEgW0Us.js';
4
+ import { F as Flickity, u as utils } from './nano-slides-BU8CjO-X.js';
5
5
  import './index-BM3Om9WE.js';
6
6
  import './renderer-DpNDfhNy.js';
7
7
 
@@ -1,7 +1,7 @@
1
1
  /*!
2
2
  * Custom elements for Nanopore-Digital Web applications
3
3
  */
4
- import { F as Flickity } from './nano-slides-CuEgW0Us.js';
4
+ import { F as Flickity } from './nano-slides-BU8CjO-X.js';
5
5
  import './index-BM3Om9WE.js';
6
6
  import './renderer-DpNDfhNy.js';
7
7
 
@@ -1,7 +1,7 @@
1
1
  /*!
2
2
  * Custom elements for Nanopore-Digital Web applications
3
3
  */
4
- import { F as Flickity, u as utils } from './nano-slides-CuEgW0Us.js';
4
+ import { F as Flickity, u as utils } from './nano-slides-BU8CjO-X.js';
5
5
  import './index-BM3Om9WE.js';
6
6
  import './renderer-DpNDfhNy.js';
7
7
 
@@ -6,7 +6,7 @@ import { M as Modal } from './modal-CY_3_LJ7.js';
6
6
  import { l as lockBodyScrolling, u as unlockBodyScrolling } from './scroll-1nFw8CNk.js';
7
7
  import { h, t as transformTag } from './renderer-DpNDfhNy.js';
8
8
  import { b as blurActiveElement } from './active-element-CKJIkX0R.js';
9
- import { H as HasSlotController } from './slot-CFTP7C_Z.js';
9
+ import { H as HasSlotController } from './slot-D31cEKyt.js';
10
10
  import './tabbable-BgopY-vd.js';
11
11
  import './dom-dlicJTEJ.js';
12
12
 
@@ -5,7 +5,7 @@ import { r as registerInstance, c as createEvent, g as getElement, a as Host } f
5
5
  import { h, t as transformTag } from './renderer-DpNDfhNy.js';
6
6
  import { M as Modal } from './modal-CY_3_LJ7.js';
7
7
  import { l as lockBodyScrolling, u as unlockBodyScrolling } from './scroll-1nFw8CNk.js';
8
- import { H as HasSlotController } from './slot-CFTP7C_Z.js';
8
+ import { H as HasSlotController } from './slot-D31cEKyt.js';
9
9
  import { w as waitForEvent } from './events-ClRFmcmJ.js';
10
10
  import { C as ComponentStore } from './component-store-JYVuxwvK.js';
11
11
  import { g as getActiveElement } from './active-element-CKJIkX0R.js';
@@ -1717,30 +1717,30 @@ const Select = class {
1717
1717
  disabled,
1718
1718
  clearControl: this.clearable,
1719
1719
  }))(this);
1720
- return (h(Host, { key: 'fff4c3c510b9c343af91cd44cd31a437bbd15a78', type: this.multiple ? 'select-multiple' : 'select-one', "aria-disabled": this.disabled ? 'true' : null, class: {
1720
+ return (h(Host, { key: 'a2c56f43fef750f8e336a1612644761293b19bd4', type: this.multiple ? 'select-multiple' : 'select-one', "aria-disabled": this.disabled ? 'true' : null, class: {
1721
1721
  'has-value': !!this.value.length || !!this.inputSearchVal.length,
1722
1722
  'has-focus': this.hasFocus,
1723
1723
  'is-invalid': this._invalid === true,
1724
1724
  'is-valid': this._invalid === false,
1725
1725
  'nano-select': true,
1726
- } }, h(FormControlWrap, { key: '57e3eca97027e9195328c5da6e10c46000ffe67e', ...wrapOptions, class: {
1726
+ } }, h(FormControlWrap, { key: '632d901cdff60d36ae1a410f6c252c671eac8e63', ...wrapOptions, class: {
1727
1727
  'has-error': !!this.errorMessage &&
1728
1728
  this.showInlineError &&
1729
1729
  this._invalid === true,
1730
1730
  'has-helper': this.hasHelperSlot,
1731
1731
  'is-open': this.hasOpened,
1732
1732
  masked: this.mask,
1733
- } }, h(FormControl, { key: 'be1a38b3b662d7cd40ce738ef9185d18dae22318', ...controlOptions, ref: (el) => (this.selectWrap = el), onClearText: this.clearSelectValue, control: this.el, endValueSlot: h("slot", { name: "down-arrow" }, h("nano-icon", { class: "select__down-arrow", name: "light/chevron-down" })), showInlineError: this.showInlineError }, this.multiple && (h("div", { key: '89b7b5b75ef67513c228f230c11122333448408f', class: "select__multi-wrap select" }, this.multipleValues(labelId, moreId, helperEndId))), !this.multiple && [
1734
- this.mask && (h("div", { key: 'efd35e47435a363be382ceae43d4348479cd50b5', class: "select__mask" }, this.getLabel(this.value))),
1735
- h("input", { key: '236a63937ee3c981bbc2e4d77d72516f4d614326', ref: (input) => (this.inputCtrl = input), id: this.selectId, class: "select__native-input", "aria-labelledby": labelId + ' ' + moreId + ' ' + helperEndId, disabled: this.disabled, form: this.form, placeholder: this.placeholder, readonly: true, required: this.required, value: this.getLabel(this.value), onFocus: this.onFocus }),
1736
- ])), !this.readonly && !this.disabled && (h("nano-datalist", { key: 'c0e2707266e76ed2714cbd91727c828e4e0e9861', ref: (el) => (this.datalist = el), selected: this.valArray, type: this.multiple ? 'selectMulti' : 'select', options: this._options.length ? this._options : undefined, onNanoDeselect: (e) => {
1733
+ } }, h(FormControl, { key: '387a55518ed1c74ea944008c750a0ca42a6bbbe8', ...controlOptions, ref: (el) => (this.selectWrap = el), onClearText: this.clearSelectValue, control: this.el, endValueSlot: h("slot", { name: "down-arrow" }, h("nano-icon", { class: "select__down-arrow", name: "light/chevron-down" })), showInlineError: this.showInlineError }, this.multiple && (h("div", { key: '660b70b098520471d4f7653af5cc50388625cd1c', class: "select__multi-wrap select" }, this.multipleValues(labelId, moreId, helperEndId))), !this.multiple && [
1734
+ this.mask && (h("div", { key: '44f53317d26f2f8b85b5c8b397ccfd68a26eebb5', class: "select__mask" }, this.getLabel(this.value))),
1735
+ h("input", { key: '04f3935c7f759e3767f32faecb9e6ef81a36c777', ref: (input) => (this.inputCtrl = input), id: this.selectId, class: "select__native-input", "aria-labelledby": labelId + ' ' + moreId + ' ' + helperEndId, disabled: this.disabled, form: this.form, placeholder: this.placeholder, readonly: true, required: this.required, value: this.getLabel(this.value), onFocus: this.onFocus }),
1736
+ ])), !this.readonly && !this.disabled && (h("nano-datalist", { key: 'aae86b85c3bd2c2c562468f2a33e52c7036ad69b', ref: (el) => (this.datalist = el), selected: this.valArray, type: this.multiple ? 'selectMulti' : 'select', options: this._options.length ? this._options : undefined, onNanoDeselect: (e) => {
1737
1737
  e.preventDefault();
1738
1738
  this.removeValue(e.detail.value);
1739
1739
  }, onNanoOptionsUpdated: this.setOptions, onNanoSelect: this.setValue,
1740
1740
  // @ts-expect-error - this bubbles from the nano-dropdown
1741
1741
  onNanoShow: () => (this.hasOpened = true), onNanoHide: () => (this.hasOpened = false) }, this.allowCustomValues &&
1742
1742
  this.multiple &&
1743
- !!this.inputSearchVal && (h("nano-option", { key: 'bfc7c0f31d962d89369ff173236bebbca134885d', slot: "list-top", value: this.inputSearchVal, selected: false, label: this.inputSearchVal, onNanoSelect: () => this.inputCtrl.focus() }, h("span", { key: '2f2f299440d4aca0c718308ad819873cf5f71163', slot: "check-icon" }), "Add '", this.inputSearchVal, "'")), h("slot", { key: '5c41abf1e6e6c7b897538beb6b4509ae5f845ce6' }))), h("select", { key: '3443483daf9d524e98cb3614f67a630b349b033f', id: this.selectId + '-hidden', class: "select__native-ctrl", ref: (select) => (this.nativeSelect = select), "aria-labelledby": labelId + ' ' + moreId + ' ' + helperEndId, disabled: this.disabled, form: this.form, multiple: this.multiple, name: this.name, required: this.required, onInvalid: this.handleInvalid }, this.allowCustomValues &&
1743
+ !!this.inputSearchVal && (h("nano-option", { key: 'cf744eb6bbad3ce2d8d05354d5edaf3eab07a207', slot: "list-top", value: this.inputSearchVal, selected: false, label: this.inputSearchVal, onNanoSelect: () => this.inputCtrl.focus() }, h("span", { key: '990e00208c403d92d1586fb0b2c4618768f5fda5', slot: "check-icon" }), "Add '", this.inputSearchVal, "'")), h("slot", { key: '54fce41f95c01e0b2ff1619209ebb15a28383677' }))), h("select", { key: '1c5ff40ac84be25c6b7075ef031b29f2b6f9b007', id: this.selectId + '-hidden', class: "select__native-ctrl", ref: (select) => (this.nativeSelect = select), "aria-labelledby": labelId + ' ' + moreId + ' ' + helperEndId, disabled: this.disabled, form: this.form, multiple: this.multiple, name: this.name, required: this.required, onInvalid: this.handleInvalid }, this.allowCustomValues &&
1744
1744
  this.valArray.map((val) => {
1745
1745
  return (h("option", { value: val, selected: true }, val));
1746
1746
  }), !this.allowCustomValues &&
@@ -3,7 +3,7 @@
3
3
  */
4
4
  import { r as registerInstance, c as createEvent, a as Host } from './index-BM3Om9WE.js';
5
5
  import { h } from './renderer-DpNDfhNy.js';
6
- import { H as HasSlotController } from './slot-CFTP7C_Z.js';
6
+ import { H as HasSlotController } from './slot-D31cEKyt.js';
7
7
  import './dom-dlicJTEJ.js';
8
8
 
9
9
  const detailsCss = ":host,*,*::before,*::after{box-sizing:border-box}[hidden]{display:none !important}@media (prefers-reduced-motion: reduce){:host,*,*::before,*::after{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important;scroll-behavior:auto !important}}:host,*,*::before,*::after{box-sizing:border-box}[hidden]{display:none !important}@media (prefers-reduced-motion: reduce){:host,*,*::before,*::after{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important;scroll-behavior:auto !important}}:host{font-family:inherit;font-size:inherit;font-stretch:inherit;font-style:inherit;font-weight:inherit;letter-spacing:inherit;text-decoration:inherit;text-overflow:inherit;text-transform:inherit;text-align:inherit;white-space:inherit;color:inherit;--padding:var(--nano-spacing-md);--btn-padding:var(--padding);--btn-bg-color:transparent;--btn-bg-color--hover:var(--nano-color-primary-100);--btn-bg-color--active:var(--nano-color-primary-300);--content-padding:var(--padding);display:block;border:1px solid var(--nano-color-neutral-300);color:var(--nano-color-neutral-1400)}:host([size=small]){--padding:var(--nano-spacing-sm) 0.9375rem}:host([size=large]){--padding:var(--nano-spacing-l)}:host([size=large]) .header{font-weight:var(--nano-font-weight-normal);font-size:var(--nano-font-size-lg);line-height:var(--nano-line-height-dense);text-wrap:balance}:host([disabled]){opacity:0.5}.header{all:unset;cursor:pointer;padding:var(--btn-padding);position:relative;display:flex;flex-wrap:wrap;align-items:center;background:var(--btn-bg-color);color:inherit;font-weight:var(--nano-font-weight-normal);font-size:var(--nano-font-size-md);line-height:var(--nano-line-height-dense);text-wrap:balance}.header::-webkit-details-marker{display:none}.header:focus{outline:none}.header:not([aria-disabled=true]):focus-visible{outline:var(--nano-focus-ring);outline-offset:var(--nano-focus-ring-offset)}.header:not([aria-disabled=true]):hover{background:var(--btn-bg-color--hover)}.header:not([aria-disabled=true]):active{background:var(--btn-bg-color--active)}.disabled .header{cursor:not-allowed}.header .label{inline-size:100%;max-inline-size:100%;max-block-size:100%;flex:1;display:inline-block}.header .icon{line-height:0;flex-direction:column;justify-content:center;display:inline-block;color:var(--nano-color-primary-1200)}.header .icon .default-icon{rotate:0deg;transform-origin:center;transition:var(--nano-transition-x-fast) ease rotate}:host([open]) .header .icon .default-icon{rotate:180deg}.header .icon--start{margin-inline:0 var(--btn-padding);margin-block:0}.header .icon--end{margin-inline:var(--btn-padding) 0;margin-block:0}.header .icon ::slotted(.nano-icon),.header .icon::slotted(.nano-icon){color:currentcolor;transition:var(--nano-transition-x-fast) ease rotate;transform-origin:center}.body{display:grid;grid-template-rows:0fr;transition:all var(--nano-transition-fast) ease-out;opacity:0}:host([open]) .body{grid-template-rows:1fr;opacity:1}.content-wrapper{overflow:hidden}.content{padding:var(--content-padding)}";
@@ -5,7 +5,7 @@ import { r as registerInstance, c as createEvent, g as getElement, a as Host } f
5
5
  import { h } from './renderer-DpNDfhNy.js';
6
6
  import { M as Modal } from './modal-CY_3_LJ7.js';
7
7
  import { l as lockBodyScrolling, u as unlockBodyScrolling } from './scroll-1nFw8CNk.js';
8
- import { H as HasSlotController } from './slot-CFTP7C_Z.js';
8
+ import { H as HasSlotController } from './slot-D31cEKyt.js';
9
9
  import { C as ComponentStore } from './component-store-JYVuxwvK.js';
10
10
  import { g as getTabbableElements } from './tabbable-BgopY-vd.js';
11
11
  import './dom-dlicJTEJ.js';