@nanoporetech-digital/components 4.10.0 → 5.0.0

package/dist/components/select.js

@@ -13,7 +13,7 @@ import { d as defineCustomElement$3 } from './icon.js';
 import { d as defineCustomElement$2 } from './menu.js';
 import { d as defineCustomElement$1 } from './option.js';
 
-const selectCss = ".sc-nano-select-h{box-sizing:border-box}*.sc-nano-select,*.sc-nano-select::before,*.sc-nano-select::after{box-sizing:border-box}[hidden].sc-nano-select{display:none !important}[disabled].sc-nano-select-h:not([disabled=false]){opacity:0.5}.form-ctrl.sc-nano-select{min-inline-size:100%;display:block}.form-ctrl.has-helper-end.sc-nano-select{display:flex;gap:1rem;opacity:0}.form-ctrl.has-helper-end.is-ready.sc-nano-select{opacity:1}.form-ctrl.has-helper-end.sc-nano-select .form-ctrl__wrapper.sc-nano-select{flex:1 1 100%}.form-ctrl.has-helper-end.sc-nano-select .form-ctrl__helper-end.sc-nano-select{display:none}.form-ctrl.has-helper-end.has-enough-width.sc-nano-select .form-ctrl__helper-end.sc-nano-select{display:block}.form-ctrl.has-helper-end.has-enough-width.sc-nano-select .form-ctrl__helper.sc-nano-select{display:none}.form-ctrl__wrapper.sc-nano-select{display:block}label.sc-nano-select,.form-ctrl__more.sc-nano-select,.form-ctrl__error.sc-nano-select,.form-ctrl__helper.sc-nano-select{display:block;inline-size:100%;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}label.visually-hide.sc-nano-select,.form-ctrl__more.visually-hide.sc-nano-select,.form-ctrl__error.visually-hide.sc-nano-select,.form-ctrl__helper.visually-hide.sc-nano-select{clip:rect(1px, 1px, 1px, 1px);-webkit-clip-path:inset(50%);clip-path:inset(50%);block-size:1px;inline-size:1px;margin:-1px;overflow:hidden;padding:0;position:absolute}.form-ctrl__float-label.sc-nano-select{padding-block:0;-webkit-padding-end:0;padding-inline-end:0;-webkit-padding-start:var(--padding-start);padding-inline-start:var(--padding-start);color:var(--label-color);position:absolute;font-size:1.15em;transform:translateY(-50%);transform-origin:top left;inset-block-start:50%;transition:all 0.125s ease-in;opacity:1}.has-focus.sc-nano-select-h .form-ctrl__float-label.sc-nano-select,.has-value.sc-nano-select-h .form-ctrl__float-label.sc-nano-select{transform:translateY(-110%);font-size:0.8em;opacity:0.7}.form-ctrl__float-label.sc-nano-select .form-ctrl__label-charcount.sc-nano-select{opacity:0;transition:opacity 0.125s ease-in}.has-focus.sc-nano-select-h .form-ctrl__float-label.sc-nano-select .form-ctrl__label-charcount.sc-nano-select,.has-value.sc-nano-select-h .form-ctrl__float-label.sc-nano-select .form-ctrl__label-charcount.sc-nano-select{opacity:1}.form-ctrl__textarea.sc-nano-select .form-ctrl__float-label.sc-nano-select{inset-block-start:50%}.has-focus.sc-nano-select-h .form-ctrl__textarea.sc-nano-select .form-ctrl__float-label.sc-nano-select{inset-block-start:0;transform:translateY(38%)}.has-value.sc-nano-select-h .form-ctrl__textarea.sc-nano-select .form-ctrl__float-label.sc-nano-select{inset-block-start:0;transform:translateY(38%)}.form-ctrl__label.sc-nano-select{color:var(--label-color);font-size:var(--label-font-size);-webkit-padding-after:var(--padding-bottom);padding-block-end:var(--padding-bottom);line-height:1;display:flex}.form-ctrl__label.sc-nano-select .form-ctrl__label-wrap.sc-nano-select{flex:1;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.form-ctrl__label.sc-nano-select .form-ctrl__label-placeholder.sc-nano-select{margin-block:unset;-webkit-margin-end:5px;margin-inline-end:5px;-webkit-margin-start:0;margin-inline-start:0;opacity:0;-webkit-appearance:none;appearance:none;transition:0.3s ease opacity;font-size:0.9em}.form-ctrl__label.sc-nano-select .form-ctrl__label-charcount.sc-nano-select{margin-block:unset;-webkit-margin-end:0;margin-inline-end:0;-webkit-margin-start:auto;margin-inline-start:auto;font-size:0.9em;opacity:0.5}.has-value.sc-nano-select-h .form-ctrl__label.sc-nano-select .form-ctrl__label-placeholder.sc-nano-select{opacity:0.5}.has-focus.sc-nano-select-h .form-ctrl__label.sc-nano-select{color:var(--label-color--focus)}.is-invalid.sc-nano-select-h:not([disabled]) .form-ctrl__label.sc-nano-select{color:var(--label-color--invalid)}.has-float-label.sc-nano-select .select__multi-input.sc-nano-select,.has-float-label.sc-nano-select .select__native-input.sc-nano-select,.has-float-label.sc-nano-select .input__native-ctrl.sc-nano-select{opacity:0;transition:opacity 0.125s ease-in}.has-focus.sc-nano-select-h .has-float-label.sc-nano-select .select__multi-input.sc-nano-select,.has-value.sc-nano-select-h .has-float-label.sc-nano-select .select__multi-input.sc-nano-select,.has-focus.sc-nano-select-h .has-float-label.sc-nano-select .select__native-input.sc-nano-select,.has-value.sc-nano-select-h .has-float-label.sc-nano-select .select__native-input.sc-nano-select,.has-focus.sc-nano-select-h .has-float-label.sc-nano-select .input__native-ctrl.sc-nano-select,.has-value.sc-nano-select-h .has-float-label.sc-nano-select .input__native-ctrl.sc-nano-select{opacity:1}.form-ctrl__more.sc-nano-select{block-size:1em;position:relative;margin-block:4px var(--padding-bottom);margin-inline:3px 0}.form-ctrl__helper.sc-nano-select,.form-ctrl__error.sc-nano-select{inset-block-start:0;inset-inline-start:0;position:absolute;font-size:var(--invalid-msg-font-size);line-height:1.2;transition:0.3s ease-out opacity}.form-ctrl__helper.sc-nano-select{font-style:italic;color:var(--help-msg-color)}[show-inline-error].sc-nano-select-h:not([show-inline-error=false]):not([disabled]).is-invalid .form-ctrl__helper.sc-nano-select{opacity:0}.form-ctrl__helper-end.sc-nano-select{flex:1 1 30%;min-inline-size:150px;font-size:var(--invalid-msg-font-size);color:var(--help-msg-color);font-style:italic}.form-ctrl__error.sc-nano-select{opacity:0;color:var(--invalid-msg-color);font-stretch:condensed}.is-invalid.sc-nano-select-h:not([disabled]) .form-ctrl__error.sc-nano-select{opacity:1}.form-ctrl__input.sc-nano-select{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;border-radius:var(--input-border-radius);inline-size:100%;padding:0 !important;position:relative;flex:1 0 auto;display:flex;background:var(--input-bg-color);border:var(--input-border-style);border-width:var(--input-border-width);font-size:var(--input-font-size);-webkit-padding-start:calc(var(--input-border-hint-width) - var(--input-border-width)) !important;padding-inline-start:calc(var(--input-border-hint-width) - var(--input-border-width)) !important}.has-focus.sc-nano-select-h .form-ctrl__input.sc-nano-select{background:var(--input-bg-color--focus);border:var(--input-border-style--focus);border-width:var(--input-border-width);-webkit-padding-start:calc(var(--input-border-hint-width) - var(--input-border-width)) !important;padding-inline-start:calc(var(--input-border-hint-width) - var(--input-border-width)) !important}.is-invalid.sc-nano-select-h:not([disabled]) .form-ctrl__input.sc-nano-select{background:var(--input-bg-color--invalid);border:var(--input-border-style--invalid);border-width:var(--input-border-width);-webkit-border-start:var(--input-border-style--invalid-focus) var(--input-border-hint-width);border-inline-start:var(--input-border-style--invalid-focus) var(--input-border-hint-width);-webkit-padding-start:0 !important;padding-inline-start:0 !important}.is-invalid.has-focus.sc-nano-select-h:not([disabled]) .form-ctrl__input.sc-nano-select{background:var(--input-bg-color--invalid);border:var(--input-border-style--invalid-focus);border-width:var(--input-border-width);-webkit-border-start:var(--input-border-style--invalid-focus) var(--input-border-hint-width);border-inline-start:var(--input-border-style--invalid-focus) var(--input-border-hint-width);-webkit-padding-start:0 !important;padding-inline-start:0 !important}.form-ctrl__input-wrap.sc-nano-select{display:flex;align-items:stretch;flex:1;max-inline-size:100%}.form-ctrl__clear-btn.sc-nano-select,.form-ctrl__slot-end.sc-nano-select,.form-ctrl__slot-start.sc-nano-select,.form-ctrl__slot-value-end.sc-nano-select{--nano-icon-size:1.4em;margin-block:0;margin-inline:0;font-size:1em;border:0;outline:none;background-color:transparent;background-repeat:no-repeat;display:flex;align-items:stretch;inline-size:auto}.has-float-label.sc-nano-select .form-ctrl__slot-start.sc-nano-select{display:none}.form-ctrl__slot-start.sc-nano-select-s>*,.form-ctrl__slot-start .sc-nano-select-s>*,.form-ctrl__slot-end.sc-nano-select-s>*,.form-ctrl__slot-end .sc-nano-select-s>*,.form-ctrl__slot-value-end.sc-nano-select-s>*,.form-ctrl__slot-value-end .sc-nano-select-s>*,.form-ctrl__slot-value-end.sc-nano-select *.sc-nano-select{--nano-icon-size:1.4em;padding-inline:unset;-webkit-padding-start:var(--padding-start);padding-inline-start:var(--padding-start);-webkit-padding-end:var(--padding-end);padding-inline-end:var(--padding-end);font-size:1em;align-items:center;display:flex;block-size:100%;z-index:1}.sc-nano-select-h[disabled]:not([disabled=false]) .form-ctrl__slot-start.sc-nano-select-s>*,.sc-nano-select-h[disabled]:not([disabled=false]) .form-ctrl__slot-start .sc-nano-select-s>*,.sc-nano-select-h[disabled]:not([disabled=false]) .form-ctrl__slot-end.sc-nano-select-s>*,.sc-nano-select-h[disabled]:not([disabled=false]) .form-ctrl__slot-end .sc-nano-select-s>*,.sc-nano-select-h[disabled]:not([disabled=false]) .form-ctrl__slot-value-end.sc-nano-select-s>*,.sc-nano-select-h[disabled]:not([disabled=false]) .form-ctrl__slot-value-end .sc-nano-select-s>*,[disabled].sc-nano-select-h:not([disabled=false]) .form-ctrl__slot-value-end.sc-nano-select *.sc-nano-select{pointer-events:none}.form-ctrl__slot-value-end.sc-nano-select-s>*,.form-ctrl__slot-value-end .sc-nano-select-s>*,.form-ctrl__slot-value-end.sc-nano-select *.sc-nano-select{pointer-events:none}.form-ctrl__clear-btn.sc-nano-select{color:var(--clear-btn-color);padding:0;opacity:0;inline-size:0;-webkit-appearance:none;appearance:none;align-items:center;overflow:hidden}.is-invalid.sc-nano-select-h .form-ctrl__clear-btn.sc-nano-select{color:var(--clear-btn-color--invalid)}.has-value.sc-nano-select-h .form-ctrl__clear-btn.sc-nano-select{padding-block:0;padding-inline:var(--padding-start) var(--padding-end);opacity:1;inline-size:auto}.form-ctrl__clear-btn.sc-nano-select:hover{color:var(--clear-btn-color--hover)}.sc-nano-select-h{--placeholder-color:var(--nano-input-placeholder-color, initial);--placeholder-font-style:var(--nano-input-placeholder-style, initial);--placeholder-font-weight:var(--nano-input-placeholder-weight, initial);--placeholder-opacity:var(--nano-input-placeholder-opacity, 0.5);--padding-top:var(--nano-input-padding-top, var(--nano-input-padding, 8px));--padding-end:var(--nano-input-padding-end, var(--nano-input-padding, 8px));--padding-bottom:var(--nano-input-padding-bottom, var(--nano-input-padding, 6px));--padding-start:var(--nano-input-padding-start, var(--nano-input-padding, 8px));--color-invalid:var(--nano-color-danger-rgb, 239 65 53);--color--focus-rgb:var(\n      --nano-color-base-rgb,\n      var(--nano-color-primary-rgb, 0 116 149)\n    );--input-font-size:var(--nano-input-font-size, 0.87em);--input-text-color:var(--nano-input-text-color, #4a4a4a);--input-border-width:var(--nano-input-border-width, 1px);--input-border-hint-width:3px;--input-border-color:var(--nano-input-border-color, #e4e6e8);--input-border-radius:var(--nano-input-border-radius, 0);--input-border-style:var(--nano-input-border-style, solid) var(--nano-input-border-color, #e4e6e8);--input-border-style--focus:var(--nano-input-border-style, solid) var(--nano-input-border-color--focus, #90c6e7);--input-border-style--invalid:var(--nano-input-border-style, solid) var(--nano-input-border-color--invalid, #e4e6e8);--input-border-style--invalid-focus:var(--nano-input-border-style, solid) var(--nano-input-border-color--invalid, #ef4135);--input-bg-color:var(--nano-input-background-color, #fff);--input-bg-color--focus:var(--input-bg-color);--input-bg-color--invalid:var(--nano-input-background-color, white);--invalid-msg-color:rgb(var(--color-invalid) / 100%);--invalid-msg-font-size:var(--nano-input-help-font-size, 0.75em);--help-msg-color:var(--nano-input-help-color, #616d6e);--clear-btn-color:var(--nano-clear-btn-color, rgba(0, 0, 0, 0.3));--clear-btn-color--hover:rgb(var(--color--focus-rgb) / 100%);--clear-btn-color--invalid:rgb(var(--color-invalid) / 100%);--label-color:var(--nano-input-label-color, \"currentcolor\");--label-color--focus:var(--label-color);--label-color--invalid:var(--nano-input-label-color-invalid, \"currentcolor\");--label-font-size:var(--nano-input-label-color, 1em);--multi-input-value-bg:var(--nano-input-tag-bg, 186 220 240);--multi-input-value-text-color:var(--nano-input-tag-color, #455556);--multi-input-value-border:var(--nano-input-tag-color, #badcf0);position:relative;width:100%;padding:0 !important;font-family:var(--nano-font-family, inherit);display:block}.nano-color.sc-nano-select-h{--input-border-style--focus:var(--nano-input-border-style, solid) var(\n      --nano-color-tint,\n      var(--nano-color-primary-tint, #2689a5)\n    );--multi-input-value-bg:var(--nano-color-tint-rgb);--multi-input-value-border:var(--nano-color-shade);--multi-input-value-text-color:var(--nano-color-contrast);color:var(--nano-color-base)}nano-item.sc-nano-select-h:not(.item-label),nano-item:not(.item-label) .sc-nano-select-h{--padding-start:0}[disabled].sc-nano-select-h:not([disabled=false]) *.sc-nano-select{pointer-events:none !important}select.sc-nano-select{display:none}.select__native-input.sc-nano-select{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:unset;padding-inline:var(--padding-start) var(--padding-end);padding-block:0;border-radius:var(--input-border-radius);text-overflow:ellipsis;color:var(--input-text-color);display:inline-block;flex:1;width:100%;max-width:100%;max-height:100%;border:0;outline:none;background:transparent;-webkit-appearance:none;appearance:none;margin:0;box-sizing:border-box;resize:none;overflow:hidden;cursor:default;line-height:2.5em}.has-float-label.sc-nano-select .select__native-input.sc-nano-select{line-height:2.1em;min-height:2.1em;-webkit-padding-before:1.4em;padding-block-start:1.4em}.select__native-input.sc-nano-select::selection{background:transparent}.select__native-input.sc-nano-select::-moz-selection{background:transparent}.select__native-input.sc-nano-select::placeholder{color:var(--placeholder-color);font-family:inherit;font-style:var(--placeholder-font-style);font-weight:var(--placeholder-font-weight);opacity:var(--placeholder-opacity);line-height:inherit;min-height:initial}.select__native-input.sc-nano-select::-moz-placeholder{line-height:2.8em;text-overflow:ellipsis}.select__native-input.sc-nano-select:-webkit-autofill{background-color:transparent}.select__native-input.sc-nano-select::-webkit-search-decoration,.select__native-input.sc-nano-select::-webkit-search-cancel-button,.select__native-input.sc-nano-select::-webkit-search-results-button,.select__native-input.sc-nano-select::-webkit-search-results-decoration{-webkit-appearance:none;appearance:none}.select__native-input.sc-nano-select:invalid{box-shadow:none}.select__native-input.sc-nano-select::-ms-clear,.select__native-input.sc-nano-select::-ms-reveal{display:none}.select__native-input.resizable.sc-nano-select{resize:vertical;overflow:auto}.form-ctrl__textarea.sc-nano-select .select__native-input.sc-nano-select{line-height:1.5em;padding-block:var(--padding-top) var(--padding-bottom);white-space:pre-wrap}.form-ctrl__textarea.sc-nano-select .select__native-input.sc-nano-select::placeholder{line-height:1.5em}.has-float-label.textarea.sc-nano-select .select__native-input.sc-nano-select{-webkit-padding-before:1.8em;padding-block-start:1.8em}.masked.sc-nano-select-h .select__native-input.sc-nano-select{opacity:0;position:absolute;inset-inline-start:0;inset-block-start:0}.select__mask.sc-nano-select{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-inline:var(--padding-start) var(--padding-end);padding-block:0;border-radius:var(--input-border-radius);pointer-events:none;line-height:2.5em;min-height:2.5em}.select__multi-wrap.sc-nano-select{padding-block:0 var(--padding-bottom);padding-inline:0 0;display:flex;flex:1;flex-wrap:wrap;overflow:hidden;align-items:flex-start}.has-float-label.sc-nano-select-h .select__multi-wrap.sc-nano-select{-webkit-padding-before:1em;padding-block-start:1em}.select__multi-input.sc-nano-select{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-inline:var(--padding-start) var(--padding-end);padding-block:var(--padding-bottom) 0;min-width:50px;width:100%;max-height:100%;-webkit-appearance:none;appearance:none;border:0;outline:none;display:inline-block;background:transparent;flex:0;position:relative;box-sizing:border-box;line-height:calc(2.5em - var(--padding-bottom));height:calc(2.5em - var(--padding-bottom))}.select__multi-input.sc-nano-select:last-child{flex:1}.select__multi-value.sc-nano-select{margin-block:var(--padding-bottom) 0;margin-inline:var(--padding-start) -3px;background:rgb(var(--multi-input-value-bg)/80%);color:var(--multi-input-value-text-color);border:1px solid;border-color:var(--multi-input-value-border);padding:0.35em 0.5em;max-width:100%;display:flex;align-items:center;font-size:var(--input-font-size);letter-spacing:1px;max-height:calc(2.5em - 8px)}.select__multi-value.sc-nano-select span.sc-nano-select{text-overflow:ellipsis;white-space:nowrap;max-width:100%;overflow:hidden;line-height:1}.select__multi-value-remove.sc-nano-select{background-position:center;-webkit-padding-start:0.5em;padding-inline-start:0.5em;margin:0;color:inherit;border:0;outline:none;background-color:transparent;background-repeat:no-repeat;-webkit-appearance:none;appearance:none;display:flex;align-items:center;inset-block-start:0;font-size:1em}.select__multi-value-remove.sc-nano-select nano-icon.sc-nano-select{--color:var(--multi-input-value-text-color)}.form-ctrl__float-label.sc-nano-select{width:calc(100% - (1em + var(--padding-start) * 2))}.has-focus.has-multiple.sc-nano-select-h .form-ctrl__float-label.sc-nano-select{transform:translateY(-110%);font-size:0.8em}.has-value.has-multiple.sc-nano-select-h .form-ctrl__float-label.sc-nano-select{transform:translateY(21%);inset-block-start:0}.has-focus.sc-nano-select-h select.sc-nano-select,.has-focus.sc-nano-select-h a.sc-nano-select,.has-focus.sc-nano-select-h button.sc-nano-select{pointer-events:auto}";
+const selectCss = ".sc-nano-select-h {\n  box-sizing: border-box;\n}\n\n*.sc-nano-select, *.sc-nano-select::before, *.sc-nano-select::after {\n  box-sizing: border-box;\n}\n[hidden].sc-nano-select {\n  display: none !important;\n}\n[disabled].sc-nano-select-h:not([disabled=false]) {\n  opacity: 0.5;\n}\n\n.form-ctrl.sc-nano-select {\n  container-type: inline-size;\n  min-inline-size: 100%;\n  display: block;\n}\n.form-ctrl.has-helper-end.sc-nano-select {\n  display: flex;\n  gap: 1rem;\n}\n.form-ctrl.has-helper-end.sc-nano-select .form-ctrl__wrapper.sc-nano-select {\n  flex: 1 1 100%;\n}\n.form-ctrl.has-helper-end.sc-nano-select .form-ctrl__helper-end.sc-nano-select {\n  display: none;\n}\n@container (min-width: 350px) {\n  .form-ctrl.has-helper-end .form-ctrl__helper-end {\n    display: block !important;\n  }\n  .form-ctrl.has-helper-end .form-ctrl__helper {\n    display: none !important;\n  }\n}\n\n.form-ctrl__wrapper.sc-nano-select {\n  display: block;\n}\n\nlabel.sc-nano-select, .form-ctrl__more.sc-nano-select, .form-ctrl__error.sc-nano-select, .form-ctrl__helper.sc-nano-select {\n  display: block;\n  inline-size: 100%;\n  overflow: hidden;\n  white-space: nowrap;\n  text-overflow: ellipsis;\n}\nlabel.visually-hide.sc-nano-select, .form-ctrl__more.visually-hide.sc-nano-select, .form-ctrl__error.visually-hide.sc-nano-select, .form-ctrl__helper.visually-hide.sc-nano-select {\n  clip: rect(1px, 1px, 1px, 1px);\n  -webkit-clip-path: inset(50%);\n          clip-path: inset(50%);\n  block-size: 1px;\n  inline-size: 1px;\n  margin: -1px;\n  overflow: hidden;\n  padding: 0;\n  position: absolute;\n}\n\n.form-ctrl__float-label.sc-nano-select {\n  padding-block: 0;\n  -webkit-padding-end: 0;\n          padding-inline-end: 0;\n  -webkit-padding-start: var(--padding-start);\n          padding-inline-start: var(--padding-start);\n  color: var(--label-color);\n  position: absolute;\n  font-size: 1.15em;\n  transform: translateY(-50%);\n  transform-origin: top left;\n  inset-block-start: 50%;\n  transition: all 0.125s ease-in;\n  opacity: 1;\n}\n.has-focus.sc-nano-select-h .form-ctrl__float-label.sc-nano-select, .has-value.sc-nano-select-h .form-ctrl__float-label.sc-nano-select {\n  transform: translateY(-110%);\n  font-size: 0.8em;\n  opacity: 0.7;\n}\n.form-ctrl__float-label.sc-nano-select .form-ctrl__label-charcount.sc-nano-select {\n  opacity: 0;\n  transition: opacity 0.125s ease-in;\n}\n.has-focus.sc-nano-select-h .form-ctrl__float-label.sc-nano-select .form-ctrl__label-charcount.sc-nano-select, .has-value.sc-nano-select-h .form-ctrl__float-label.sc-nano-select .form-ctrl__label-charcount.sc-nano-select {\n  opacity: 1;\n}\n.form-ctrl__textarea.sc-nano-select .form-ctrl__float-label.sc-nano-select {\n  inset-block-start: 50%;\n}\n.has-focus.sc-nano-select-h .form-ctrl__textarea.sc-nano-select .form-ctrl__float-label.sc-nano-select {\n  inset-block-start: 0;\n  transform: translateY(38%);\n}\n.has-value.sc-nano-select-h .form-ctrl__textarea.sc-nano-select .form-ctrl__float-label.sc-nano-select {\n  inset-block-start: 0;\n  transform: translateY(38%);\n}\n\n.form-ctrl__label.sc-nano-select {\n  color: var(--label-color);\n  font-size: var(--label-font-size);\n  -webkit-padding-after: var(--padding-bottom);\n          padding-block-end: var(--padding-bottom);\n  line-height: 1;\n  display: flex;\n}\n.form-ctrl__label.sc-nano-select .form-ctrl__label-wrap.sc-nano-select {\n  flex: 1;\n  overflow: hidden;\n  white-space: nowrap;\n  text-overflow: ellipsis;\n}\n.form-ctrl__label.sc-nano-select .form-ctrl__label-placeholder.sc-nano-select {\n  margin-block: unset;\n  -webkit-margin-end: 5px;\n          margin-inline-end: 5px;\n  -webkit-margin-start: 0;\n          margin-inline-start: 0;\n  opacity: 0;\n  -webkit-appearance: none;\n          appearance: none;\n  transition: 0.3s ease opacity;\n  font-size: 0.9em;\n}\n.form-ctrl__label.sc-nano-select .form-ctrl__label-charcount.sc-nano-select {\n  margin-block: unset;\n  -webkit-margin-end: 0;\n          margin-inline-end: 0;\n  -webkit-margin-start: auto;\n          margin-inline-start: auto;\n  font-size: 0.9em;\n  opacity: 0.5;\n}\n.has-value.sc-nano-select-h .form-ctrl__label.sc-nano-select .form-ctrl__label-placeholder.sc-nano-select {\n  opacity: 0.5;\n}\n.has-focus.sc-nano-select-h .form-ctrl__label.sc-nano-select {\n  color: var(--label-color--focus);\n}\n.is-invalid.sc-nano-select-h:not([disabled]) .form-ctrl__label.sc-nano-select {\n  color: var(--label-color--invalid);\n}\n\n.has-float-label.sc-nano-select .select__multi-input.sc-nano-select, .has-float-label.sc-nano-select .select__native-input.sc-nano-select, .has-float-label.sc-nano-select .input__native-ctrl.sc-nano-select {\n  opacity: 0;\n  transition: opacity 0.125s ease-in;\n}\n.has-focus.sc-nano-select-h .has-float-label.sc-nano-select .select__multi-input.sc-nano-select, .has-value.sc-nano-select-h .has-float-label.sc-nano-select .select__multi-input.sc-nano-select, .has-focus.sc-nano-select-h .has-float-label.sc-nano-select .select__native-input.sc-nano-select, .has-value.sc-nano-select-h .has-float-label.sc-nano-select .select__native-input.sc-nano-select, .has-focus.sc-nano-select-h .has-float-label.sc-nano-select .input__native-ctrl.sc-nano-select, .has-value.sc-nano-select-h .has-float-label.sc-nano-select .input__native-ctrl.sc-nano-select {\n  opacity: 1;\n}\n\n.form-ctrl__more.sc-nano-select {\n  block-size: 1em;\n  position: relative;\n  margin-block: 4px var(--padding-bottom);\n  margin-inline: 3px 0;\n}\n\n.form-ctrl__helper.sc-nano-select, .form-ctrl__error.sc-nano-select {\n  inset-block-start: 0;\n  inset-inline-start: 0;\n  position: absolute;\n  font-size: var(--invalid-msg-font-size);\n  line-height: 1.2;\n  transition: 0.3s ease-out opacity;\n}\n\n.form-ctrl__helper.sc-nano-select {\n  font-style: italic;\n  color: var(--help-msg-color);\n}\n[show-inline-error].sc-nano-select-h:not([show-inline-error=false]):not([disabled]).is-invalid .form-ctrl__helper.sc-nano-select {\n  opacity: 0;\n}\n\n.form-ctrl__helper-end.sc-nano-select {\n  flex: 1 1 30%;\n  min-inline-size: 150px;\n  font-size: var(--invalid-msg-font-size);\n  color: var(--help-msg-color);\n  font-style: italic;\n}\n\n.form-ctrl__error.sc-nano-select {\n  opacity: 0;\n  color: var(--invalid-msg-color);\n  font-stretch: condensed;\n}\n.is-invalid.sc-nano-select-h:not([disabled]) .form-ctrl__error.sc-nano-select {\n  opacity: 1;\n}\n\n.form-ctrl__input.sc-nano-select {\n  font-family: inherit;\n  font-size: inherit;\n  font-stretch: inherit;\n  font-style: inherit;\n  font-weight: inherit;\n  letter-spacing: inherit;\n  text-decoration: inherit;\n  text-overflow: inherit;\n  text-transform: inherit;\n  text-align: inherit;\n  white-space: inherit;\n  color: inherit;\n  border-radius: var(--input-border-radius);\n  inline-size: 100%;\n  padding: 0 !important;\n  position: relative;\n  flex: 1 0 auto;\n  display: flex;\n  background: var(--input-bg-color);\n  border: var(--input-border-style);\n  border-width: var(--input-border-width);\n  font-size: var(--input-font-size);\n  -webkit-padding-start: calc(var(--input-border-hint-width) - var(--input-border-width)) !important;\n          padding-inline-start: calc(var(--input-border-hint-width) - var(--input-border-width)) !important;\n}\n.has-focus.sc-nano-select-h .form-ctrl__input.sc-nano-select {\n  background: var(--input-bg-color--focus);\n  border: var(--input-border-style--focus);\n  border-width: var(--input-border-width);\n  -webkit-padding-start: calc(var(--input-border-hint-width) - var(--input-border-width)) !important;\n          padding-inline-start: calc(var(--input-border-hint-width) - var(--input-border-width)) !important;\n}\n.is-invalid.sc-nano-select-h:not([disabled]) .form-ctrl__input.sc-nano-select {\n  background: var(--input-bg-color--invalid);\n  border: var(--input-border-style--invalid);\n  border-width: var(--input-border-width);\n  -webkit-border-start: var(--input-border-style--invalid-focus) var(--input-border-hint-width);\n          border-inline-start: var(--input-border-style--invalid-focus) var(--input-border-hint-width);\n  -webkit-padding-start: 0 !important;\n          padding-inline-start: 0 !important;\n}\n.is-invalid.has-focus.sc-nano-select-h:not([disabled]) .form-ctrl__input.sc-nano-select {\n  background: var(--input-bg-color--invalid);\n  border: var(--input-border-style--invalid-focus);\n  border-width: var(--input-border-width);\n  -webkit-border-start: var(--input-border-style--invalid-focus) var(--input-border-hint-width);\n          border-inline-start: var(--input-border-style--invalid-focus) var(--input-border-hint-width);\n  -webkit-padding-start: 0 !important;\n          padding-inline-start: 0 !important;\n}\n\n.form-ctrl__input-wrap.sc-nano-select {\n  display: flex;\n  align-items: stretch;\n  flex: 1;\n  max-inline-size: 100%;\n}\n\n.form-ctrl__clear-btn.sc-nano-select, .form-ctrl__slot-end.sc-nano-select, .form-ctrl__slot-start.sc-nano-select, .form-ctrl__slot-value-end.sc-nano-select {\n  --nano-icon-size: 1.4em;\n  margin-block: 0;\n  margin-inline: 0;\n  font-size: 1em;\n  border: 0;\n  outline: none;\n  background-color: transparent;\n  background-repeat: no-repeat;\n  display: flex;\n  align-items: stretch;\n  inline-size: auto;\n}\n\n.has-float-label.sc-nano-select .form-ctrl__slot-start.sc-nano-select {\n  display: none;\n}\n\n.form-ctrl__slot-start.sc-nano-select-s > *, .form-ctrl__slot-start .sc-nano-select-s > *, .form-ctrl__slot-end.sc-nano-select-s > *, .form-ctrl__slot-end .sc-nano-select-s > *, .form-ctrl__slot-value-end.sc-nano-select-s > *, .form-ctrl__slot-value-end .sc-nano-select-s > *, .form-ctrl__slot-value-end.sc-nano-select *.sc-nano-select {\n  --nano-icon-size: 1.4em;\n  padding-inline: unset;\n  -webkit-padding-start: var(--padding-start);\n          padding-inline-start: var(--padding-start);\n  -webkit-padding-end: var(--padding-end);\n          padding-inline-end: var(--padding-end);\n  font-size: 1em;\n  align-items: center;\n  display: flex;\n  block-size: 100%;\n  z-index: 1;\n}\n.sc-nano-select-h[disabled]:not([disabled=false]) .form-ctrl__slot-start.sc-nano-select-s > *, .sc-nano-select-h[disabled]:not([disabled=false]) .form-ctrl__slot-start .sc-nano-select-s > *, .sc-nano-select-h[disabled]:not([disabled=false]) .form-ctrl__slot-end.sc-nano-select-s > *, .sc-nano-select-h[disabled]:not([disabled=false]) .form-ctrl__slot-end .sc-nano-select-s > *, .sc-nano-select-h[disabled]:not([disabled=false]) .form-ctrl__slot-value-end.sc-nano-select-s > *, .sc-nano-select-h[disabled]:not([disabled=false]) .form-ctrl__slot-value-end .sc-nano-select-s > *, [disabled].sc-nano-select-h:not([disabled=false]) .form-ctrl__slot-value-end.sc-nano-select *.sc-nano-select {\n  pointer-events: none;\n}\n\n.form-ctrl__slot-value-end.sc-nano-select-s > *, .form-ctrl__slot-value-end .sc-nano-select-s > *, .form-ctrl__slot-value-end.sc-nano-select *.sc-nano-select {\n  pointer-events: none;\n}\n\n.form-ctrl__clear-btn.sc-nano-select {\n  color: var(--clear-btn-color);\n  padding: 0;\n  opacity: 0;\n  inline-size: 0;\n  -webkit-appearance: none;\n          appearance: none;\n  align-items: center;\n  overflow: hidden;\n}\n.is-invalid.sc-nano-select-h .form-ctrl__clear-btn.sc-nano-select {\n  color: var(--clear-btn-color--invalid);\n}\n.has-value.sc-nano-select-h .form-ctrl__clear-btn.sc-nano-select {\n  padding-block: 0;\n  padding-inline: var(--padding-start) var(--padding-end);\n  opacity: 1;\n  inline-size: auto;\n}\n.form-ctrl__clear-btn.sc-nano-select:hover {\n  color: var(--clear-btn-color--hover);\n}\n\n.sc-nano-select-h {\n  \n  --placeholder-color: var(--nano-input-placeholder-color, initial);\n  --placeholder-font-style: var(--nano-input-placeholder-style, initial);\n  --placeholder-font-weight: var(--nano-input-placeholder-weight, initial);\n  --placeholder-opacity: var(--nano-input-placeholder-opacity, 0.5);\n  --padding-top: var(--nano-input-padding-top, var(--nano-input-padding, 8px));\n  --padding-end: var(--nano-input-padding-end, var(--nano-input-padding, 8px));\n  --padding-bottom: var(--nano-input-padding-bottom, var(--nano-input-padding, 6px));\n  --padding-start: var(--nano-input-padding-start, var(--nano-input-padding, 8px));\n  --color-invalid: var(--nano-color-danger-rgb, 239 65 53);\n  --color--focus-rgb:\n    var(\n      --nano-color-base-rgb,\n      var(--nano-color-primary-rgb, 0 116 149)\n    );\n  --input-font-size: var(--nano-input-font-size, 0.87em);\n  --input-text-color: var(--nano-input-text-color, #4a4a4a);\n  --input-border-width: var(--nano-input-border-width, 1px);\n  --input-border-hint-width: 3px;\n  --input-border-color: var(--nano-input-border-color, #e4e6e8);\n  --input-border-radius: var(--nano-input-border-radius, 0);\n  --input-border-style: var(--nano-input-border-style, solid) var(--nano-input-border-color, #e4e6e8);\n  --input-border-style--focus: var(--nano-input-border-style, solid) var(--nano-input-border-color--focus, #90c6e7);\n  --input-border-style--invalid: var(--nano-input-border-style, solid) var(--nano-input-border-color--invalid, #e4e6e8);\n  --input-border-style--invalid-focus: var(--nano-input-border-style, solid) var(--nano-input-border-color--invalid, #ef4135);\n  --input-bg-color: var(--nano-input-background-color, #fff);\n  --input-bg-color--focus: var(--input-bg-color);\n  --input-bg-color--invalid: var(--nano-input-background-color, white);\n  --invalid-msg-color: rgb(var(--color-invalid) / 100%);\n  --invalid-msg-font-size: var(--nano-input-help-font-size, 0.75em);\n  --help-msg-color: var(--nano-input-help-color, #616d6e);\n  --clear-btn-color: var(--nano-clear-btn-color, rgba(0, 0, 0, 0.3));\n  --clear-btn-color--hover: rgb(var(--color--focus-rgb) / 100%);\n  --clear-btn-color--invalid: rgb(var(--color-invalid) / 100%);\n  --label-color: var(--nano-input-label-color, \"currentcolor\");\n  --label-color--focus: var(--label-color);\n  --label-color--invalid: var(--nano-input-label-color-invalid, \"currentcolor\");\n  --label-font-size: var(--nano-input-label-color, 1em);\n  --multi-input-value-bg: var(--nano-input-tag-bg, 186 220 240);\n  --multi-input-value-text-color: var(--nano-input-tag-color, #455556);\n  --multi-input-value-border: var(--nano-input-tag-color, #badcf0);\n  \n  position: relative;\n  width: 100%;\n  padding: 0 !important;\n  font-family: var(--nano-font-family, inherit);\n  display: block;\n}\n\n.nano-color.sc-nano-select-h {\n  --input-border-style--focus:\n    var(--nano-input-border-style, solid) var(\n      --nano-color-tint,\n      var(--nano-color-primary-tint, #2689a5)\n    );\n  --multi-input-value-bg: var(--nano-color-tint-rgb);\n  --multi-input-value-border: var(--nano-color-shade);\n  --multi-input-value-text-color: var(--nano-color-contrast);\n  color: var(--nano-color-base);\n}\n\nnano-item.sc-nano-select-h:not(.item-label), nano-item:not(.item-label) .sc-nano-select-h {\n  --padding-start: 0;\n}\n\n[disabled].sc-nano-select-h:not([disabled=false]) *.sc-nano-select {\n  pointer-events: none !important;\n}\n\nselect.sc-nano-select {\n  display: none;\n}\n\n.select__native-input.sc-nano-select {\n  font-family: inherit;\n  font-size: inherit;\n  font-stretch: inherit;\n  font-style: inherit;\n  font-weight: inherit;\n  letter-spacing: inherit;\n  text-decoration: inherit;\n  text-overflow: inherit;\n  text-transform: inherit;\n  text-align: inherit;\n  white-space: inherit;\n  color: inherit;\n  padding: unset;\n  padding-inline: var(--padding-start) var(--padding-end);\n  padding-block: 0;\n  border-radius: var(--input-border-radius);\n  text-overflow: ellipsis;\n  color: var(--input-text-color);\n  display: inline-block;\n  flex: 1;\n  width: 100%;\n  max-width: 100%;\n  max-height: 100%;\n  border: 0;\n  outline: none;\n  background: transparent;\n  -webkit-appearance: none;\n          appearance: none;\n  margin: 0;\n  box-sizing: border-box;\n  resize: none;\n  overflow: hidden;\n  cursor: default;\n  line-height: 2.5em;\n  \n  \n}\n.has-float-label.sc-nano-select .select__native-input.sc-nano-select {\n  line-height: 2.1em;\n  min-height: 2.1em;\n  -webkit-padding-before: 1.4em;\n          padding-block-start: 1.4em;\n}\n.select__native-input.sc-nano-select::selection {\n  background: transparent;\n}\n.select__native-input.sc-nano-select::-moz-selection {\n  background: transparent;\n}\n.select__native-input.sc-nano-select::placeholder {\n  color: var(--placeholder-color);\n  font-family: inherit;\n  font-style: var(--placeholder-font-style);\n  font-weight: var(--placeholder-font-weight);\n  opacity: var(--placeholder-opacity);\n  line-height: inherit;\n  min-height: initial;\n}\n.select__native-input.sc-nano-select::-moz-placeholder {\n  line-height: 2.8em;\n  text-overflow: ellipsis;\n}\n.select__native-input.sc-nano-select:-webkit-autofill {\n  background-color: transparent;\n}\n.select__native-input.sc-nano-select::-webkit-search-decoration, .select__native-input.sc-nano-select::-webkit-search-cancel-button, .select__native-input.sc-nano-select::-webkit-search-results-button, .select__native-input.sc-nano-select::-webkit-search-results-decoration {\n  -webkit-appearance: none;\n          appearance: none;\n}\n.select__native-input.sc-nano-select:invalid {\n  box-shadow: none;\n}\n.select__native-input.sc-nano-select::-ms-clear, .select__native-input.sc-nano-select::-ms-reveal {\n  display: none;\n}\n.select__native-input.resizable.sc-nano-select {\n  resize: vertical;\n  overflow: auto;\n}\n.form-ctrl__textarea.sc-nano-select .select__native-input.sc-nano-select {\n  line-height: 1.5em;\n  padding-block: var(--padding-top) var(--padding-bottom);\n  white-space: pre-wrap;\n}\n.form-ctrl__textarea.sc-nano-select .select__native-input.sc-nano-select::placeholder {\n  line-height: 1.5em;\n}\n.has-float-label.textarea.sc-nano-select .select__native-input.sc-nano-select {\n  -webkit-padding-before: 1.8em;\n          padding-block-start: 1.8em;\n}\n.masked.sc-nano-select-h .select__native-input.sc-nano-select {\n  opacity: 0;\n  position: absolute;\n  inset-inline-start: 0;\n  inset-block-start: 0;\n}\n\n.select__mask.sc-nano-select {\n  font-family: inherit;\n  font-size: inherit;\n  font-stretch: inherit;\n  font-style: inherit;\n  font-weight: inherit;\n  letter-spacing: inherit;\n  text-decoration: inherit;\n  text-overflow: inherit;\n  text-transform: inherit;\n  text-align: inherit;\n  white-space: inherit;\n  color: inherit;\n  padding-inline: var(--padding-start) var(--padding-end);\n  padding-block: 0;\n  border-radius: var(--input-border-radius);\n  pointer-events: none;\n  line-height: 2.5em;\n  min-height: 2.5em;\n}\n\n.select__multi-wrap.sc-nano-select {\n  padding-block: 0 var(--padding-bottom);\n  padding-inline: 0 0;\n  display: flex;\n  flex: 1;\n  flex-wrap: wrap;\n  overflow: hidden;\n  align-items: flex-start;\n}\n.has-float-label.sc-nano-select-h .select__multi-wrap.sc-nano-select {\n  -webkit-padding-before: 1em;\n          padding-block-start: 1em;\n}\n.select__multi-input.sc-nano-select {\n  font-family: inherit;\n  font-size: inherit;\n  font-stretch: inherit;\n  font-style: inherit;\n  font-weight: inherit;\n  letter-spacing: inherit;\n  text-decoration: inherit;\n  text-overflow: inherit;\n  text-transform: inherit;\n  text-align: inherit;\n  white-space: inherit;\n  color: inherit;\n  padding-inline: var(--padding-start) var(--padding-end);\n  padding-block: var(--padding-bottom) 0;\n  min-width: 50px;\n  width: 100%;\n  max-height: 100%;\n  -webkit-appearance: none;\n          appearance: none;\n  border: 0;\n  outline: none;\n  display: inline-block;\n  background: transparent;\n  flex: 0;\n  position: relative;\n  box-sizing: border-box;\n  line-height: calc(2.5em - var(--padding-bottom));\n  height: calc(2.5em - var(--padding-bottom));\n}\n.select__multi-input.sc-nano-select:last-child {\n  flex: 1;\n}\n.select__multi-value.sc-nano-select {\n  margin-block: var(--padding-bottom) 0;\n  margin-inline: var(--padding-start) -3px;\n  background: rgb(var(--multi-input-value-bg)/80%);\n  color: var(--multi-input-value-text-color);\n  border: 1px solid;\n  border-color: var(--multi-input-value-border);\n  padding: 0.35em 0.5em;\n  max-width: 100%;\n  display: flex;\n  align-items: center;\n  font-size: var(--input-font-size);\n  letter-spacing: 1px;\n  max-height: calc(2.5em - 8px);\n}\n.select__multi-value.sc-nano-select span.sc-nano-select {\n  text-overflow: ellipsis;\n  white-space: nowrap;\n  max-width: 100%;\n  overflow: hidden;\n  line-height: 1;\n}\n.select__multi-value-remove.sc-nano-select {\n  background-position: center;\n  -webkit-padding-start: 0.5em;\n          padding-inline-start: 0.5em;\n  margin: 0;\n  color: inherit;\n  border: 0;\n  outline: none;\n  background-color: transparent;\n  background-repeat: no-repeat;\n  -webkit-appearance: none;\n          appearance: none;\n  display: flex;\n  align-items: center;\n  inset-block-start: 0;\n  font-size: 1em;\n}\n.select__multi-value-remove.sc-nano-select nano-icon.sc-nano-select {\n  --color: var(--multi-input-value-text-color);\n}\n\n.form-ctrl__float-label.sc-nano-select {\n  width: calc(100% - (1em + var(--padding-start) * 2));\n}\n.has-focus.has-multiple.sc-nano-select-h .form-ctrl__float-label.sc-nano-select {\n  transform: translateY(-110%);\n  font-size: 0.8em;\n}\n.has-value.has-multiple.sc-nano-select-h .form-ctrl__float-label.sc-nano-select {\n  transform: translateY(21%);\n  inset-block-start: 0;\n}\n\n.has-focus.sc-nano-select-h select.sc-nano-select, .has-focus.sc-nano-select-h a.sc-nano-select, .has-focus.sc-nano-select-h button.sc-nano-select {\n  pointer-events: auto;\n}";
 
 let selectIds = 0;
 const Select = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {

package/dist/components/select.js.map

@@ -1 +1 @@
-{"file":"select.js","mappings":"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","names":[],"sources":["./src/components/select/select.scss?tag=nano-select&encapsulation=scoped","./src/components/select/select.tsx"],"sourcesContent":["@import '../../global/style/utilities/globals';\n@import '../../global/style/nano-theme/form';\n@import '../../global/style/nano-theme/layers';\n@import '../form-control/form-control';\n@import '../form-control/form-control-vars';\n\n:host {\n  @include formControlVars;\n\n  /**\n   * @prop --max-menu-height: the maximum of the dropdown menu. Defaults to 50vw.\n   */\n\n  position: relative;\n  width: 100%;\n  padding: 0 !important;\n  font-family: $font-family-base;\n  display: block;\n}\n\n:host(.nano-color) {\n  --input-border-style--focus:\n    #{$input-border-style} var(\n      --nano-color-tint,\n      #{nano-color(\n        primary,\n        tint\n      )}\n    );\n  --multi-input-value-bg: var(--nano-color-tint-rgb);\n  --multi-input-value-border: var(--nano-color-shade);\n  --multi-input-value-text-color: var(--nano-color-contrast);\n\n  color: current-color(base);\n}\n\n:host-context(nano-item:not(.item-label)) {\n  --padding-start: 0;\n}\n\n:host([disabled]:not([disabled='false'])) {\n  * {\n    pointer-events: none !important;\n  }\n}\n\nselect {\n  display: none;\n}\n\n.select__native-input {\n  @include text-inherit();\n\n  padding: unset;\n  padding-inline: var(--padding-start) var(--padding-end);\n  padding-block: 0;\n  border-radius: var(--input-border-radius);\n  text-overflow: ellipsis;\n  color: var(--input-text-color);\n  display: inline-block;\n  flex: 1;\n  width: 100%;\n  max-width: 100%;\n  max-height: 100%;\n  border: 0;\n  outline: none;\n  background: transparent;\n  appearance: none;\n  margin: 0;\n  box-sizing: border-box;\n  resize: none;\n  overflow: hidden;\n  cursor: default;\n  line-height: 2.5em;\n\n  .has-float-label & {\n    line-height: 2.1em;\n    min-height: 2.1em;\n    padding-block-start: 1.4em;\n  }\n\n  &::selection {\n    background: transparent;\n  }\n\n  /* stylelint-disable-next-line selector-no-vendor-prefix */\n  &::-moz-selection {\n    background: transparent;\n  }\n\n  &::placeholder {\n    color: var(--placeholder-color);\n    font-family: inherit;\n    font-style: var(--placeholder-font-style);\n    font-weight: var(--placeholder-font-weight);\n    opacity: var(--placeholder-opacity);\n    line-height: inherit;\n    min-height: initial;\n  }\n\n  /* stylelint-disable-next-line selector-no-vendor-prefix */\n  &::-moz-placeholder {\n    line-height: 2.8em;\n    text-overflow: ellipsis;\n  }\n\n  &:-webkit-autofill {\n    background-color: transparent;\n  }\n\n  &::-webkit-search-decoration,\n  &::-webkit-search-cancel-button,\n  &::-webkit-search-results-button,\n  &::-webkit-search-results-decoration {\n    appearance: none;\n  }\n\n  &:invalid {\n    box-shadow: none;\n  }\n\n  &::-ms-clear,\n  &::-ms-reveal {\n    display: none;\n  }\n\n  &.resizable {\n    resize: vertical;\n    overflow: auto;\n  }\n\n  .form-ctrl__textarea & {\n    line-height: 1.5em;\n    padding-block: var(--padding-top) var(--padding-bottom);\n    white-space: pre-wrap;\n\n    &::placeholder {\n      line-height: 1.5em;\n    }\n  }\n\n  .has-float-label.textarea & {\n    padding-block-start: 1.8em;\n  }\n\n  :host(.masked) & {\n    opacity: 0;\n    position: absolute;\n    inset-inline-start: 0;\n    inset-block-start: 0;\n  }\n}\n\n.select__mask {\n  @include text-inherit();\n\n  padding-inline: var(--padding-start) var(--padding-end);\n  padding-block: 0;\n  border-radius: var(--input-border-radius);\n  pointer-events: none;\n  line-height: 2.5em;\n  min-height: 2.5em;\n}\n\n// multi stuff\n\n.select__multi {\n  &-wrap {\n    padding-block: 0 var(--padding-bottom);\n    padding-inline: 0 0;\n    display: flex;\n    flex: 1;\n    flex-wrap: wrap;\n    overflow: hidden;\n    align-items: flex-start;\n\n    :host(.has-float-label) & {\n      padding-block-start: 1em;\n    }\n  }\n\n  &-input {\n    @include text-inherit();\n\n    padding-inline: var(--padding-start) var(--padding-end);\n    padding-block: var(--padding-bottom) 0;\n    min-width: 50px;\n    width: 100%;\n    max-height: 100%;\n    appearance: none;\n    border: 0;\n    outline: none;\n    display: inline-block;\n    background: transparent;\n    flex: 0;\n    position: relative;\n    box-sizing: border-box;\n    line-height: calc(2.5em - var(--padding-bottom));\n    height: calc(2.5em - var(--padding-bottom));\n\n    &:last-child {\n      flex: 1;\n    }\n  }\n\n  &-value {\n    margin-block: var(--padding-bottom) 0;\n    margin-inline: var(--padding-start) -3px;\n    background: rgb(var(--multi-input-value-bg) / 80%);\n    color: var(--multi-input-value-text-color);\n    border: 1px solid;\n    border-color: var(--multi-input-value-border);\n    padding: 0.35em 0.5em;\n    max-width: 100%;\n    display: flex;\n    align-items: center;\n    font-size: var(--input-font-size);\n    letter-spacing: 1px;\n    max-height: calc(2.5em - 8px);\n\n    span {\n      text-overflow: ellipsis;\n      white-space: nowrap;\n      max-width: 100%;\n      overflow: hidden;\n      line-height: 1;\n    }\n  }\n\n  &-value-remove {\n    @include background-position(center);\n\n    padding-inline-start: 0.5em;\n    margin: 0;\n    color: inherit;\n    border: 0;\n    outline: none;\n    background-color: transparent;\n    background-repeat: no-repeat;\n    appearance: none;\n    display: flex;\n    align-items: center;\n    inset-block-start: 0;\n    font-size: 1em;\n\n    nano-icon {\n      --color: var(--multi-input-value-text-color);\n    }\n  }\n}\n\n.form-ctrl__float-label {\n  width: calc(100% - (1em + (var(--padding-start) * 2)));\n\n  :host(.has-focus.has-multiple) & {\n    transform: translateY(-110%);\n    font-size: 0.8em;\n  }\n\n  :host(.has-value.has-multiple) & {\n    transform: translateY(21%);\n    inset-block-start: 0;\n  }\n}\n\n:host(.has-focus) select,\n:host(.has-focus) a,\n:host(.has-focus) button {\n  pointer-events: auto;\n}\n","import {\n  Build,\n  Component,\n  ComponentInterface,\n  Element,\n  Event,\n  EventEmitter,\n  Host,\n  Method,\n  Prop,\n  State,\n  Watch,\n  h,\n  VNode,\n  Listen,\n} from '@stencil/core';\n\nimport { getActiveElement } from '../../utils/active-element';\nimport { closestElement } from '../../utils/dom';\nimport { createColorClasses } from '../../utils/theme';\nimport { debounce, debounceEvent } from '../../utils/throttle';\nimport { FormControl, FormControlWrap } from '../form-control/form-control';\nimport { OptionInterface } from '../option/option-interface';\nimport type { Dropdown } from '../dropdown/dropdown';\nimport type {\n  Color,\n  SelectChangeEventDetail,\n  InputChangeEventDetail,\n  ControlValidityEventDetail,\n  ControlValidity,\n} from '../../interface';\n\nlet selectIds = 0;\n\n/**\n * The select component is a wrapper to the HTML select element with custom styling and additional functionality.\n * It accepts most of the same properties as the HTML [select](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/select).\n * It's multi selection functionality is vastly improved from the native solution. It allows for the control of\n * value order through drag and drop or changing the insertion point with arrow keys. It also can allow for user defined values.\n *\n * @slot start - suitable for inline action buttons or icons that may add extra contextual information\n * @slot end - suitable for inline action buttons or icons that may add extra contextual information\n * @slot value-start - similar to 'start', however clicking elements using this slot will activate the input control. This would be suitable to show a secodary 'value' for context or to show a dropdown arrow if using a datalist\n * @slot value-end - similar to 'end', however clicking elements using this slot will activate the input control. This would be suitable to show a secodary 'value' for context or to show a dropdown arrow if using a datalist\n * @slot label - if you do not set a label attribute, you can use this slot for more complex markup\n * @slot helper - helper text to accompany the form field underneath.\n * @slot helper-end - helper text to accompany the form field on the side.\n * @slot down-arrow - use this to replace the default down arrow\n * @slot - default slot; nest `nano-option` elements\n */\n@Component({\n  tag: 'nano-select',\n  styleUrl: 'select.scss',\n  scoped: true,\n})\nexport class Select implements ComponentInterface {\n  private nativeSelect?: HTMLSelectElement;\n  private valueItems: Array<HTMLSpanElement> = [];\n  private dragVal: string;\n  private mo?: MutationObserver;\n  private selectId = `nano-select-${selectIds++}`;\n  private rtl: boolean = false;\n  private onInit: boolean = true;\n  private customError: string = '';\n\n  private get inputCtrl() {\n    return this._inputCtrl;\n  }\n  private set inputCtrl(input) {\n    if (input === this._inputCtrl) return;\n    this._inputCtrl = input;\n    this.setDataListOpts();\n  }\n  private _inputCtrl?: HTMLInputElement;\n\n  // we don't want these rendered eles decorated with @State\n  // because that will cause re-renders. Use get/set to set datalist options\n  private _selectWrap: HTMLElement;\n  private get selectWrap() {\n    return this._selectWrap;\n  }\n  private set selectWrap(ele: HTMLElement) {\n    if (this._selectWrap === ele) return;\n    this._selectWrap = ele;\n    this.setDataListOpts();\n  }\n\n  private _datalist: HTMLNanoDatalistElement;\n  private get datalist() {\n    return this._datalist;\n  }\n  private set datalist(ele: HTMLNanoDatalistElement) {\n    if (this._datalist === ele) return;\n    this._datalist = ele;\n    this.setDataListOpts();\n  }\n\n  constructor() {\n    this.showInlineValidation = debounce(this.showInlineValidation, 50);\n  }\n\n  @State() currInsertIndex: number = -1;\n  @State() showErrorMsg = false;\n  @State() errorMessage: string = '';\n  @State() hasFocus = false;\n  @State() hasLabelSlot: boolean = false;\n  @State() hasHelperSlot: boolean = false;\n  @State() hasHelperEndSlot = false;\n  @State() inputSearchVal: string = '';\n\n  @Element() el!: HTMLNanoSelectElement;\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.\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.nativeSelect) return '';\n    return this.nativeSelect.validationMessage;\n  }\n\n  /**\n   * The 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   * This Boolean attribute lets you specify that a form control should have select focus when the page loads.\n   */\n  @Prop() autofocus = false;\n\n  /**\n   * If `true`, the user cannot interact with the select.\n   */\n  @Prop({ reflect: true }) disabled = false;\n\n  /**\n   * When should the field perform validation\n   */\n  @Prop({ mutable: true }) validateOn?: 'dirty' | 'submit' | 'submitThenDirty' =\n    'submitThenDirty';\n\n  /**\n   * Whether to show validation errors underneath input\n   */\n  @Prop({ reflect: true }) showInlineError = true;\n\n  /**\n   * String to place within a label element. Alternatively use the 'label' slot\n   */\n  @Prop() label!: string;\n\n  /**\n   * Visually hide the label - but make it accessible.\n   */\n  @Prop() hideLabel?: boolean = false;\n\n  /**\n   * Enable floating label behaviour. Will disable placeholder if set.\n   */\n  @Prop() floatLabel: boolean = false;\n\n  /**\n   * If `true`, the user can enter more than one value. This attribute applies when the type attribute is set to `\"email\"` or `\"file\"`, otherwise it is ignored.\n   */\n  @Prop() multiple?: boolean = false;\n\n  /**\n   * The name of the control, which is submitted with the form data.\n   */\n  @Prop() name: string = this.selectId + '-name';\n\n  /**\n   * Instructional text that shows before the select has a value. Text set here will be placed inside the label when a value is set. If you don't want this behaviour just set the first option to have no value.\n   */\n  @Prop() placeholder?: string | null;\n\n  /**\n   * If `true`, the user cannot modify the value.\n   */\n  @Prop({ reflect: true }) readonly = false;\n\n  /**\n   * If `true`, the user must fill in a value before submitting a form.\n   */\n  @Prop() required = false;\n\n  /**\n   * The initial size of the control.\n   */\n  @Prop() size?: number;\n\n  /**\n   * Maximum number of options that can be selected when multiple is true\n   */\n  @Prop() max?: number;\n\n  /**\n   * Minimum number of options that can be selected when multiple is true\n   */\n  @Prop() min?: number;\n\n  /**\n   * The form element to associate the select with (its form owner). Must be the id of a form.\n   */\n  @Prop() form?: string | null;\n\n  /**\n   * in multiple mode, allow users to enter their own values\n   */\n  @Prop() allowCustomValues: boolean = false;\n\n  /**\n   * The value of the select.\n   */\n  @Prop()\n  get value() {\n    return this._value;\n  }\n  set value(val: string | string[]) {\n    if (typeof val === 'string') {\n      if (this.multiple) this._value = val.split(',');\n      else this._value = val;\n    } else if (Array.isArray(val)) {\n      if (this.multiple) this._value = val;\n      else this._value = val[0];\n    }\n  }\n  private _value: Array<string> | string = this.multiple ? [] : '';\n\n  /**\n   * You can set options via js as an array of strings: `domElement.options = ['option 1', 'option 2']` or\n   * objects `domElement.options = [{label: 'option 1', value: 'opt-1'}]`. See `nano-option` docs for all available properties.\n   * Alternatively, you can nest `<nano-option>` elements within a `<nano-select>`\n   * Regardless - reading `options` will return the current component options - slotted or otherwise\n   */\n  @Prop()\n  get options(): Array<OptionInterface | string> {\n    if (this._options.length) return this._options;\n\n    if (!this.datalist || !this.datalist.activeOptions) return [];\n\n    return this._eOptions.map((ao) => {\n      const { value, selected, label, filterMeta } = ao;\n      return { value, selected, label, filterMeta };\n    });\n  }\n  set options(opts: Array<OptionInterface | string>) {\n    this._options = opts.map((opt) => {\n      if (typeof opt === 'string') return { value: opt, label: opt };\n      else return opt;\n    });\n  }\n  private _options: OptionInterface[] = [];\n  @State() _eOptions: OptionInterface[] = [];\n\n  /**\n   * If `true`, a clear icon will appear in the select when there is a value. Clicking it clears the select.\n   */\n  @Prop() clearSelect = false;\n\n  /**\n   * Hide the native select element and cover with a value 'mask'.\n   * Enables a fluid nano-select width upon value change (if required). Doesn't work with multiple=\"true\".\n   */\n  @Prop() mask = false;\n\n  /**\n   * Set the amount of time, in milliseconds, to wait to trigger the `nanoSearchChange` event after each keystroke.\n   */\n  @Prop() debounce = 0;\n\n  @Watch('debounce')\n  protected debounceChanged() {\n    this.nanoSearchChange = debounceEvent(this.nanoSearchChange, this.debounce);\n  }\n\n  @Watch('required')\n  @Watch('disabled')\n  @Watch('min')\n  @Watch('max')\n  @Watch('readonly')\n  protected shouldValidate() {\n    if (this.onInit) return;\n    if (this.invalid) this.showErrorMsg = this._invalid = false;\n\n    this.customValidate();\n    if (this.validateOn !== 'dirty') return;\n    this.showInlineValidation();\n  }\n\n  /**\n   * Update the native select element when the value changes\n   */\n  // eslint-disable-next-line @stencil-community/no-unused-watch\n  @Watch('value')\n  valueChanged() {\n    this.customValidate();\n\n    if (this.onInit) {\n      if (this.multiple) this.currInsertIndex = this.value.length - 1;\n      return;\n    }\n    requestAnimationFrame(() => {\n      this.shouldValidate();\n      this.nanoChange.emit({ value: this.value });\n    });\n  }\n\n  /** nano-dropdown config options you can pass to the nested dropdown component */\n  @Prop({ mutable: true }) dropDownConfig?: Partial<Dropdown> = {};\n\n  @Watch('dropDownConfig')\n  setDataListOpts() {\n    if (!this.datalist || !this.selectWrap) return;\n\n    this.datalist.input = this.inputCtrl;\n\n    const currDWConfig = this.datalist.dropDownConfig || {};\n    this.datalist.dropDownConfig = {\n      ...currDWConfig,\n      ...this.dropDownConfig,\n      tetherTo: this.selectWrap,\n    };\n  }\n\n  // Custom Events\n\n  /**\n   * Emitted when the value has changed.\n   */\n  @Event() nanoChange!: EventEmitter<SelectChangeEventDetail>;\n\n  /**\n   * Emitted when the select loses focus.\n   */\n  @Event() nanoBlur!: EventEmitter<void>;\n\n  /**\n   * Emitted when the select has focus.\n   */\n  @Event() nanoFocus!: EventEmitter<void>;\n\n  /**\n   * Emitted when the select has been created.\n   * @internal\n   */\n  @Event() nanoDidLoad!: EventEmitter<void>;\n\n  /**\n   * Emitted when the select has been removed.\n   * @internal\n   */\n  @Event() nanoDidUnload!: EventEmitter<void>;\n\n  /**\n   * Emitted when a keyboard input occurred on a multiple=\"true\" input\n   */\n  @Event() nanoSearchChange!: EventEmitter<InputChangeEventDetail>;\n\n  /**\n   * Called when validation is performed (which depends on `validateOn`).\n   * @returns event.detail: `{ isValid: boolean, errorMessage: string, originalEvent: Event }`.\n   */\n  @Event() nanoValidate: EventEmitter<ControlValidityEventDetail>;\n\n  // Public Methods\n\n  /**\n   * Get the current state of the control.\n   * @param validateFirst - perform validation first before reporting\n   * @returns `{ isValid: boolean, errorMessage: string }`\n   */\n  @Method()\n  async reportValidity(validateFirst: boolean): Promise<ControlValidity> {\n    return new Promise((resolve) => {\n      if (validateFirst) {\n        this.customValidate();\n        this.showInlineValidation();\n      }\n      setTimeout(() => {\n        resolve({\n          isValid: !this._invalid,\n          errorMessage: this.nativeSelect.validationMessage,\n        });\n      }, 50);\n    });\n  }\n\n  /**\n   * Sets focus on the specified `nano-select`. Use this method instead of the global\n   * `select.focus()`.\n   */\n  @Method()\n  async setFocus() {\n    if (!this.inputCtrl) return;\n    this.inputCtrl.focus();\n    setTimeout(() => this.inputCtrl.click(), 50);\n  }\n\n  /**\n   * @returns the native `<select>` element used under the hood.\n   */\n  @Method()\n  getSelectElement(): Promise<HTMLSelectElement> {\n    return Promise.resolve(this.nativeSelect!);\n  }\n\n  /**\n   * Invalidate the field and show a custom error message.\n   * To clear the error you will need to re-call this method with an empty string.\n   */\n  @Method()\n  async showError(message: string) {\n    if (this.nativeSelect) {\n      this.customError = message;\n      this.nativeSelect.setCustomValidity(message);\n      this.showInlineValidation();\n    }\n  }\n\n  /* Logic */\n\n  private get valArray() {\n    return typeof this.value === 'string'\n      ? this.value.length\n        ? [this.value]\n        : []\n      : this.value;\n  }\n\n  private isValidValues() {\n    return this.valArray.find((val) =>\n      (this.options as OptionInterface[]).find((opt) => opt.value === val)\n    );\n  }\n\n  private customValidate = () => {\n    if (\n      !this.nativeSelect ||\n      !!this.customError ||\n      !this.nativeSelect['setCustomValidity']\n    )\n      return;\n\n    this.nativeSelect.setCustomValidity('');\n    // add custom validations 'cos html5 validations are a bit rubbish on selects\n    if (this.required && !this.valArray.length) {\n      this.nativeSelect.setCustomValidity('Please fill in this field.');\n      return true;\n    }\n    if (\n      this.valArray.length &&\n      !this.allowCustomValues &&\n      !this.isValidValues()\n    ) {\n      this.nativeSelect.setCustomValidity(\n        'Please choose an item from this field.'\n      );\n      return true;\n    }\n    if (this.max && this.valArray.length > this.max) {\n      this.nativeSelect.setCustomValidity(\n        `Only up to ${this.max} values are allowed.`\n      );\n      return true;\n    }\n    if (this.min && this.valArray.length < this.min) {\n      this.nativeSelect.setCustomValidity(\n        `You must select a minimum of ${this.min} values.`\n      );\n      return true;\n    }\n    return false;\n  };\n\n  private showInlineValidation = (ev?: Event) => {\n    if (this.validateOn === 'submitThenDirty') this.validateOn = 'dirty';\n\n    this._invalid = false;\n    this.showErrorMsg = false;\n    this.errorMessage = '';\n\n    if (!this.nativeSelect.validity.valid) {\n      this.errorMessage = this.nativeSelect.validationMessage;\n      this._invalid = true;\n      this.showErrorMsg = true;\n    }\n    this.nanoValidate.emit({\n      isValid: !this.invalid,\n      errorMessage: this.errorMessage,\n      originalEvent: ev,\n    });\n  };\n\n  private handleInvalid = (ev: Event) => {\n    this._invalid = true;\n\n    if (this.validateOn === 'submit') {\n      this._invalid = this.showErrorMsg = this.customValidate();\n    }\n    if (this.showInlineError) ev.preventDefault();\n\n    requestAnimationFrame(() => this.showInlineValidation(ev));\n  };\n\n  private setValue = (e: CustomEvent<HTMLNanoOptionElement>) => {\n    e.preventDefault();\n\n    if (!this.multiple) {\n      this.value = e.detail.value;\n      return;\n    }\n    if (this.value && this.value.length && this.value.includes(e.detail.value))\n      return;\n    if (this.max && this.value.length === this.max) return;\n\n    this.currInsertIndex++;\n    this.value = [\n      ...this.value.slice(0, this.currInsertIndex),\n      e.detail.value,\n      ...this.value.slice(this.currInsertIndex),\n    ];\n    this.inputSearchVal = '';\n    // this.selectWrap.clientWidth; // force reflow\n  };\n\n  private removeValue = (toFind?: string) => {\n    if (!this.multiple || !this.value.length) return;\n\n    if (!toFind) toFind = this.value[this.value.length - 1];\n    this.value = (this.value as Array<string>).filter((val) => val !== toFind);\n\n    this.currInsertIndex--;\n    // this.selectWrap.clientWidth; // force reflow\n    this.setFocus();\n  };\n\n  private slotChangeObserver() {\n    if (!window['MutationObserver']) return;\n\n    const mo = (this.mo = new MutationObserver(() =>\n      this.processSlottedContent()\n    ));\n    mo.observe(this.el, { childList: true, subtree: true });\n  }\n\n  private processSlottedContent() {\n    // see if we have label / helper content\n    this.hasLabelSlot = !!this.el.querySelectorAll('[slot=\"label\"]').length;\n    this.hasHelperSlot = !!this.el.querySelector('[slot=\"helper\"]');\n    this.hasHelperEndSlot = !!this.el.querySelector('[slot=\"helper-end\"]');\n  }\n\n  private getLabel(toFind: string) {\n    const label = (this.options as OptionInterface[]).find((opt) => {\n      return !opt.disabled && opt.value?.length && opt.value === toFind;\n    });\n    return label && label.label ? label.label : toFind;\n  }\n\n  /* Event handling */\n\n  @Listen('reset', { target: 'body' })\n  onReset(e) {\n    const form = this.form\n      ? document.querySelector('#' + this.form)\n      : this.el.closest('form');\n    if (!form || e.target !== this.el.closest('form')) return;\n\n    this.clearSelectValue();\n  }\n\n  @Listen('mousedown', { target: 'body' })\n  @Listen('keydown')\n  handleBlur(e: KeyboardEvent | MouseEvent) {\n    if (!this.hasFocus) return;\n\n    const kev = e as KeyboardEvent;\n    let target: Element;\n\n    requestAnimationFrame(() => {\n      if (kev.key) {\n        if (kev.key !== 'Tab') return;\n        target = getActiveElement();\n      } else target = e.target as Element;\n\n      if (closestElement(this.el.tagName.toLowerCase(), target) !== this.el) {\n        this.onBlur();\n      }\n    });\n  }\n\n  private setOptions = () => {\n    if (\n      !this.datalist ||\n      !this.datalist.activeOptions ||\n      !this.datalist.activeOptions.length\n    )\n      return;\n\n    this._eOptions = this.datalist.activeOptions.map((ao) => {\n      const { value, selected, label, filterMeta } = ao;\n      return { value, selected, label, filterMeta };\n    });\n    this.customValidate();\n  };\n\n  private handleDocumentKeyDown = (ev: KeyboardEvent) => {\n    if (!this.multiple || !this.hasFocus) return;\n\n    if (!this.inputSearchVal) {\n      let rm: HTMLSpanElement;\n\n      switch (ev.key) {\n        case 'Backspace':\n          if (this.inputCtrl.previousElementSibling)\n            rm = this.inputCtrl.previousElementSibling as HTMLSpanElement;\n          else break;\n\n          this.removeValue(rm.dataset.value || null);\n          break;\n\n        case 'Delete':\n          if (this.inputCtrl.nextElementSibling)\n            rm = this.inputCtrl.nextElementSibling as HTMLSpanElement;\n          else break;\n\n          this.removeValue(rm.dataset.value || null);\n          break;\n\n        case 'ArrowLeft':\n        case 'ArrowRight':\n          if (!this.value.length) break;\n\n          if (ev.key === 'ArrowLeft' && this.inputCtrl.previousSibling)\n            this.currInsertIndex--;\n          if (ev.key === 'ArrowRight' && this.inputCtrl.nextSibling)\n            this.currInsertIndex++;\n\n          setTimeout(() => {\n            this.inputCtrl.focus();\n          }, 20);\n          ev.preventDefault();\n          break;\n      }\n    }\n  };\n\n  private onBlur = () => {\n    this.hasFocus = false;\n\n    requestAnimationFrame(() => {\n      if (this.validateOn === 'dirty' && !this.hasFocus)\n        this.showInlineValidation();\n    });\n    this.nanoBlur.emit();\n\n    if (!this.allowCustomValues && this.multiple) {\n      this.inputSearchVal = '';\n      const event = new window.Event('change');\n      this.inputCtrl.dispatchEvent(event);\n    }\n  };\n\n  private onFocus = () => {\n    this.hasFocus = true;\n    this.nanoFocus.emit();\n  };\n\n  private clearSelectValue = (ev?: Event) => {\n    if (this.clearSelect && !this.readonly && !this.disabled && ev) {\n      ev.preventDefault();\n      ev.stopPropagation();\n    }\n\n    if (this.multiple) {\n      this.value = [];\n      this.currInsertIndex = -1;\n    } else this.value = '';\n\n    this.inputCtrl.value = '';\n    const event = new window.Event('change');\n    this.inputCtrl.dispatchEvent(event);\n  };\n\n  private onClick = () => {\n    this.setFocus();\n  };\n\n  /* Multi event handlers */\n\n  private onDragStart = (ev: MouseEvent) => {\n    const ele = ev.target as HTMLSpanElement;\n    this.dragVal = ele.dataset.value;\n  };\n\n  private onDragEnd = (ev) => {\n    this.dragVal = null;\n    ev.preventDefault();\n  };\n\n  private onDragLeave = (ev: MouseEvent) => {\n    const ele = ev.target as HTMLSpanElement;\n    const spanVal: string =\n      ele.dataset && ele.dataset.value ? ele.dataset.value : null;\n\n    if (\n      !spanVal ||\n      this.dragVal === spanVal ||\n      !this.value.includes(this.dragVal)\n    ) {\n      ev.preventDefault();\n      return;\n    }\n\n    const to = this.value.indexOf(spanVal);\n    const from = this.value.indexOf(this.dragVal);\n    const tmpArr = this.value as Array<string>;\n    const tmpVal = tmpArr[to];\n\n    tmpArr[to] = tmpArr[from];\n    tmpArr[from] = tmpVal;\n    this.value = [...tmpArr];\n  };\n\n  private onMultiInput = (ev) => {\n    this.inputSearchVal = ev.target.value.trim();\n    this.nanoSearchChange.emit({ value: ev.target.value.trim() });\n  };\n\n  /* Stencil Component lifecycle hooks */\n\n  connectedCallback() {\n    this.debounceChanged();\n\n    if (!Build.isBrowser) return;\n\n    this.el.dispatchEvent(\n      new CustomEvent('nanoDidLoad', {\n        detail: this.el,\n      })\n    );\n  }\n\n  disconnectedCallback() {\n    document.dispatchEvent(\n      new CustomEvent('nanoDidUnload', {\n        detail: this.el,\n      })\n    );\n\n    if (!Build.isBrowser) return;\n    if (this.mo) this.mo.disconnect();\n  }\n\n  componentDidLoad() {\n    this.slotChangeObserver();\n    this.customValidate();\n    this.setDataListOpts();\n    requestAnimationFrame(() => (this.onInit = false));\n  }\n\n  componentWillLoad() {\n    this.processSlottedContent();\n  }\n\n  render() {\n    const labelId = this.selectId + '-lbl';\n    const moreId =\n      this.showInlineError || this.hasHelperSlot\n        ? this.selectId + '-moreId'\n        : '';\n    const helperEndId = this.hasHelperEndSlot ? this.selectId + '-helper' : '';\n\n    this.rtl = (this.el.ownerDocument as Document).dir === 'rtl';\n    this.valueItems = [];\n\n    const compWrapOptions = (({\n      el,\n      floatLabel,\n      label,\n      errorMessage,\n      showInlineError,\n      hasHelperSlot,\n      hasHelperEndSlot,\n      hasLabelSlot,\n      hideLabel,\n      placeholder,\n      rtl,\n    }) => ({\n      el,\n      floatLabel,\n      label,\n      errorMessage,\n      showInlineError,\n      hasHelperSlot,\n      hasHelperEndSlot,\n      hasLabelSlot,\n      hideLabel,\n      placeholder,\n      rtl,\n    }))(this);\n    const wrapOptions = {\n      ...compWrapOptions,\n      labelId,\n      moreId,\n      helperEndId,\n      hasValue: !!this.value.length || !!this.inputSearchVal.length,\n      controlId: this.selectId,\n    };\n\n    const controlOptions = (({ readonly, disabled }) => ({\n      readonly,\n      disabled,\n      clearControl: this.clearSelect,\n    }))(this);\n\n    return (\n      <Host\n        type={this.multiple ? 'select-multiple' : 'select-one'}\n        aria-disabled={this.disabled ? 'true' : null}\n        class={{\n          ...createColorClasses(this.color),\n          'has-value': !!this.value.length || !!this.inputSearchVal.length,\n          'has-focus': this.hasFocus,\n          'is-invalid': this.invalid,\n          'has-label': this.label !== null && !this.floatLabel,\n          'has-float-label': this.label !== null && this.floatLabel,\n          rtl: this.rtl,\n          'has-multiple': this.multiple,\n          'has-clr-btn': this.clearSelect,\n          masked: this.mask,\n        }}\n      >\n        <FormControlWrap {...wrapOptions}>\n          <FormControl\n            {...controlOptions}\n            onClearText={this.clearSelectValue}\n            control={this.el}\n            ref={(el) => (this.selectWrap = el)}\n            endValueSlot={\n              <slot name=\"down-arrow\">\n                <nano-icon slot=\"value-end\" name=\"light/chevron-down\" />\n              </slot>\n            }\n          >\n            {this.multiple && (\n              <div class=\"select__multi-wrap select\">\n                {this.multipleValues(labelId, moreId, helperEndId)}\n              </div>\n            )}\n            {!this.multiple && [\n              this.mask && (\n                <div class=\"select__mask\">\n                  {this.getLabel(this.value as string)}\n                </div>\n              ),\n              <input\n                id={this.selectId}\n                class=\"select__native-input\"\n                ref={(input) => (this.inputCtrl = input)}\n                aria-labelledby={labelId + ' ' + moreId + ' ' + helperEndId}\n                disabled={this.disabled}\n                form={this.form}\n                placeholder={this.placeholder}\n                readOnly={true}\n                required={this.required}\n                value={this.getLabel(this.value as string)}\n                onFocus={this.onFocus}\n              />,\n            ]}\n          </FormControl>\n        </FormControlWrap>\n        {!this.readonly && !this.disabled && (\n          <nano-datalist\n            onNanoOptionsUpdated={this.setOptions}\n            ref={(el) => (this.datalist = el)}\n            selected={this.valArray}\n            type={this.multiple ? 'selctMulti' : 'select'}\n            onNanoSelect={this.setValue}\n            onNanoDeselect={(e) => {\n              e.preventDefault();\n              this.removeValue(e.detail.value);\n            }}\n            options={this._options.length ? this._options : undefined}\n          >\n            {this.allowCustomValues &&\n              this.multiple &&\n              !!this.inputSearchVal && (\n                <nano-option\n                  slot=\"list-top\"\n                  value={this.inputSearchVal}\n                  selected={false}\n                  label={this.inputSearchVal}\n                  onNanoSelect={() => this.inputCtrl.focus()}\n                >\n                  <span slot=\"check-icon\"></span>\n                  Add '{this.inputSearchVal}'\n                </nano-option>\n              )}\n            <slot />\n          </nano-datalist>\n        )}\n\n        <select\n          id={this.selectId + '-hidden'}\n          class=\"select__native-ctrl\"\n          ref={(select) => (this.nativeSelect = select)}\n          aria-labelledby={labelId + ' ' + moreId + ' ' + helperEndId}\n          disabled={this.disabled}\n          form={this.form}\n          multiple={this.multiple}\n          name={this.name}\n          required={this.required}\n          onInvalid={this.handleInvalid}\n        >\n          {this.allowCustomValues &&\n            this.valArray.map((val) => {\n              return (\n                <option value={val} selected={true}>\n                  {val}\n                </option>\n              );\n            })}\n          {!this.allowCustomValues &&\n            this.options.map((opt: OptionInterface) => {\n              return (\n                <option\n                  value={opt.value}\n                  selected={this.valArray.includes(opt.value)}\n                  disabled={opt.disabled}\n                  label={opt.label}\n                >\n                  {this.valArray.includes(opt.value)}\n                </option>\n              );\n            })}\n        </select>\n      </Host>\n    );\n  }\n\n  private multipleValues(\n    labelId: string,\n    moreId: string,\n    helperEndId: string\n  ): VNode | (VNode | VNode[])[] {\n    const input: VNode = (\n      <input\n        class=\"select__multi-input\"\n        id={this.selectId}\n        ref={(input) => (this.inputCtrl = input)}\n        readOnly={this.readonly}\n        disabled={this.disabled}\n        autoFocus={this.autofocus}\n        autocomplete=\"off\"\n        onKeyDown={this.handleDocumentKeyDown}\n        onInput={this.onMultiInput}\n        value={this.inputSearchVal}\n        onTouchStart={this.onClick}\n        onMouseDown={this.onClick}\n        onFocus={this.onFocus}\n        placeholder={\n          this.placeholder && !this.value.length ? this.placeholder : ''\n        }\n        aria-labelledby={labelId + ' ' + moreId + ' ' + helperEndId}\n      />\n    );\n    if (!this.value.length) return input;\n\n    return (this.value as Array<string>).map((val, i) => {\n      let toReturn: VNode | VNode[] = (\n        <span\n          onDragStart={this.onDragStart}\n          onDragLeave={this.onDragLeave}\n          onDragEnd={this.onDragEnd}\n          onDragOver={(e) => e.preventDefault()}\n          draggable\n          data-value={val}\n          ref={(span) => this.valueItems.push(span)}\n          class=\"select__multi-value\"\n        >\n          <span>{this.getLabel(val)}</span>\n          <button\n            class=\"select__multi-value-remove\"\n            type=\"button\"\n            tabindex=\"-1\"\n            onTouchEnd={() => {\n              this.removeValue(val);\n            }}\n            onMouseUp={() => {\n              this.removeValue(val);\n            }}\n          >\n            <nano-icon name=\"light/times\"></nano-icon>\n          </button>\n        </span>\n      );\n      if (i === 0 && this.currInsertIndex < 0)\n        toReturn = [input, toReturn as VNode];\n      else if (i === this.currInsertIndex)\n        toReturn = [toReturn as VNode, input];\n      return toReturn;\n    });\n  }\n}\n"],"version":3}
+{"file":"select.js","mappings":"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","names":[],"sources":["./src/components/select/select.scss?tag=nano-select&encapsulation=scoped","./src/components/select/select.tsx"],"sourcesContent":["@import '../../global/style/utilities/globals';\n@import '../../global/style/nano-theme/form';\n@import '../../global/style/nano-theme/layers';\n@import '../form-control/form-control';\n@import '../form-control/form-control-vars';\n\n:host {\n  @include formControlVars;\n\n  /**\n   * @prop --max-menu-height: the maximum of the dropdown menu. Defaults to 50vw.\n   */\n\n  position: relative;\n  width: 100%;\n  padding: 0 !important;\n  font-family: $font-family-base;\n  display: block;\n}\n\n:host(.nano-color) {\n  --input-border-style--focus:\n    #{$input-border-style} var(\n      --nano-color-tint,\n      #{nano-color(\n        primary,\n        tint\n      )}\n    );\n  --multi-input-value-bg: var(--nano-color-tint-rgb);\n  --multi-input-value-border: var(--nano-color-shade);\n  --multi-input-value-text-color: var(--nano-color-contrast);\n\n  color: current-color(base);\n}\n\n:host-context(nano-item:not(.item-label)) {\n  --padding-start: 0;\n}\n\n:host([disabled]:not([disabled='false'])) {\n  * {\n    pointer-events: none !important;\n  }\n}\n\nselect {\n  display: none;\n}\n\n.select__native-input {\n  @include text-inherit();\n\n  padding: unset;\n  padding-inline: var(--padding-start) var(--padding-end);\n  padding-block: 0;\n  border-radius: var(--input-border-radius);\n  text-overflow: ellipsis;\n  color: var(--input-text-color);\n  display: inline-block;\n  flex: 1;\n  width: 100%;\n  max-width: 100%;\n  max-height: 100%;\n  border: 0;\n  outline: none;\n  background: transparent;\n  appearance: none;\n  margin: 0;\n  box-sizing: border-box;\n  resize: none;\n  overflow: hidden;\n  cursor: default;\n  line-height: 2.5em;\n\n  .has-float-label & {\n    line-height: 2.1em;\n    min-height: 2.1em;\n    padding-block-start: 1.4em;\n  }\n\n  &::selection {\n    background: transparent;\n  }\n\n  /* stylelint-disable-next-line selector-no-vendor-prefix */\n  &::-moz-selection {\n    background: transparent;\n  }\n\n  &::placeholder {\n    color: var(--placeholder-color);\n    font-family: inherit;\n    font-style: var(--placeholder-font-style);\n    font-weight: var(--placeholder-font-weight);\n    opacity: var(--placeholder-opacity);\n    line-height: inherit;\n    min-height: initial;\n  }\n\n  /* stylelint-disable-next-line selector-no-vendor-prefix */\n  &::-moz-placeholder {\n    line-height: 2.8em;\n    text-overflow: ellipsis;\n  }\n\n  &:-webkit-autofill {\n    background-color: transparent;\n  }\n\n  &::-webkit-search-decoration,\n  &::-webkit-search-cancel-button,\n  &::-webkit-search-results-button,\n  &::-webkit-search-results-decoration {\n    appearance: none;\n  }\n\n  &:invalid {\n    box-shadow: none;\n  }\n\n  &::-ms-clear,\n  &::-ms-reveal {\n    display: none;\n  }\n\n  &.resizable {\n    resize: vertical;\n    overflow: auto;\n  }\n\n  .form-ctrl__textarea & {\n    line-height: 1.5em;\n    padding-block: var(--padding-top) var(--padding-bottom);\n    white-space: pre-wrap;\n\n    &::placeholder {\n      line-height: 1.5em;\n    }\n  }\n\n  .has-float-label.textarea & {\n    padding-block-start: 1.8em;\n  }\n\n  :host(.masked) & {\n    opacity: 0;\n    position: absolute;\n    inset-inline-start: 0;\n    inset-block-start: 0;\n  }\n}\n\n.select__mask {\n  @include text-inherit();\n\n  padding-inline: var(--padding-start) var(--padding-end);\n  padding-block: 0;\n  border-radius: var(--input-border-radius);\n  pointer-events: none;\n  line-height: 2.5em;\n  min-height: 2.5em;\n}\n\n// multi stuff\n\n.select__multi {\n  &-wrap {\n    padding-block: 0 var(--padding-bottom);\n    padding-inline: 0 0;\n    display: flex;\n    flex: 1;\n    flex-wrap: wrap;\n    overflow: hidden;\n    align-items: flex-start;\n\n    :host(.has-float-label) & {\n      padding-block-start: 1em;\n    }\n  }\n\n  &-input {\n    @include text-inherit();\n\n    padding-inline: var(--padding-start) var(--padding-end);\n    padding-block: var(--padding-bottom) 0;\n    min-width: 50px;\n    width: 100%;\n    max-height: 100%;\n    appearance: none;\n    border: 0;\n    outline: none;\n    display: inline-block;\n    background: transparent;\n    flex: 0;\n    position: relative;\n    box-sizing: border-box;\n    line-height: calc(2.5em - var(--padding-bottom));\n    height: calc(2.5em - var(--padding-bottom));\n\n    &:last-child {\n      flex: 1;\n    }\n  }\n\n  &-value {\n    margin-block: var(--padding-bottom) 0;\n    margin-inline: var(--padding-start) -3px;\n    background: rgb(var(--multi-input-value-bg) / 80%);\n    color: var(--multi-input-value-text-color);\n    border: 1px solid;\n    border-color: var(--multi-input-value-border);\n    padding: 0.35em 0.5em;\n    max-width: 100%;\n    display: flex;\n    align-items: center;\n    font-size: var(--input-font-size);\n    letter-spacing: 1px;\n    max-height: calc(2.5em - 8px);\n\n    span {\n      text-overflow: ellipsis;\n      white-space: nowrap;\n      max-width: 100%;\n      overflow: hidden;\n      line-height: 1;\n    }\n  }\n\n  &-value-remove {\n    @include background-position(center);\n\n    padding-inline-start: 0.5em;\n    margin: 0;\n    color: inherit;\n    border: 0;\n    outline: none;\n    background-color: transparent;\n    background-repeat: no-repeat;\n    appearance: none;\n    display: flex;\n    align-items: center;\n    inset-block-start: 0;\n    font-size: 1em;\n\n    nano-icon {\n      --color: var(--multi-input-value-text-color);\n    }\n  }\n}\n\n.form-ctrl__float-label {\n  width: calc(100% - (1em + (var(--padding-start) * 2)));\n\n  :host(.has-focus.has-multiple) & {\n    transform: translateY(-110%);\n    font-size: 0.8em;\n  }\n\n  :host(.has-value.has-multiple) & {\n    transform: translateY(21%);\n    inset-block-start: 0;\n  }\n}\n\n:host(.has-focus) select,\n:host(.has-focus) a,\n:host(.has-focus) button {\n  pointer-events: auto;\n}\n","import {\n  Build,\n  Component,\n  ComponentInterface,\n  Element,\n  Event,\n  EventEmitter,\n  Host,\n  Method,\n  Prop,\n  State,\n  Watch,\n  h,\n  VNode,\n  Listen,\n} from '@stencil/core';\n\nimport { getActiveElement } from '../../utils/active-element';\nimport { closestElement } from '../../utils/dom';\nimport { createColorClasses } from '../../utils/theme';\nimport { debounce, debounceEvent } from '../../utils/throttle';\nimport { FormControl, FormControlWrap } from '../form-control/form-control';\nimport { OptionInterface } from '../option/option-interface';\nimport type { Dropdown } from '../dropdown/dropdown';\nimport type {\n  Color,\n  SelectChangeEventDetail,\n  InputChangeEventDetail,\n  ControlValidityEventDetail,\n  ControlValidity,\n} from '../../interface';\n\nlet selectIds = 0;\n\n/**\n * The select component is a wrapper to the HTML select element with custom styling and additional functionality.\n * It accepts most of the same properties as the HTML [select](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/select).\n * It's multi selection functionality is vastly improved from the native solution. It allows for the control of\n * value order through drag and drop or changing the insertion point with arrow keys. It also can allow for user defined values.\n *\n * @slot start - suitable for inline action buttons or icons that may add extra contextual information\n * @slot end - suitable for inline action buttons or icons that may add extra contextual information\n * @slot value-start - similar to 'start', however clicking elements using this slot will activate the input control. This would be suitable to show a secodary 'value' for context or to show a dropdown arrow if using a datalist\n * @slot value-end - similar to 'end', however clicking elements using this slot will activate the input control. This would be suitable to show a secodary 'value' for context or to show a dropdown arrow if using a datalist\n * @slot label - if you do not set a label attribute, you can use this slot for more complex markup\n * @slot helper - helper text to accompany the form field underneath.\n * @slot helper-end - helper text to accompany the form field on the side.\n * @slot down-arrow - use this to replace the default down arrow\n * @slot - default slot; nest `nano-option` elements\n */\n@Component({\n  tag: 'nano-select',\n  styleUrl: 'select.scss',\n  scoped: true,\n})\nexport class Select implements ComponentInterface {\n  private nativeSelect?: HTMLSelectElement;\n  private valueItems: Array<HTMLSpanElement> = [];\n  private dragVal: string;\n  private mo?: MutationObserver;\n  private selectId = `nano-select-${selectIds++}`;\n  private rtl: boolean = false;\n  private onInit: boolean = true;\n  private customError: string = '';\n\n  private get inputCtrl() {\n    return this._inputCtrl;\n  }\n  private set inputCtrl(input) {\n    if (input === this._inputCtrl) return;\n    this._inputCtrl = input;\n    this.setDataListOpts();\n  }\n  private _inputCtrl?: HTMLInputElement;\n\n  // we don't want these rendered eles decorated with @State\n  // because that will cause re-renders. Use get/set to set datalist options\n  private _selectWrap: HTMLElement;\n  private get selectWrap() {\n    return this._selectWrap;\n  }\n  private set selectWrap(ele: HTMLElement) {\n    if (this._selectWrap === ele) return;\n    this._selectWrap = ele;\n    this.setDataListOpts();\n  }\n\n  private _datalist: HTMLNanoDatalistElement;\n  private get datalist() {\n    return this._datalist;\n  }\n  private set datalist(ele: HTMLNanoDatalistElement) {\n    if (this._datalist === ele) return;\n    this._datalist = ele;\n    this.setDataListOpts();\n  }\n\n  constructor() {\n    this.showInlineValidation = debounce(this.showInlineValidation, 50);\n  }\n\n  @State() currInsertIndex: number = -1;\n  @State() showErrorMsg = false;\n  @State() errorMessage: string = '';\n  @State() hasFocus = false;\n  @State() hasLabelSlot: boolean = false;\n  @State() hasHelperSlot: boolean = false;\n  @State() hasHelperEndSlot = false;\n  @State() inputSearchVal: string = '';\n\n  @Element() el!: HTMLNanoSelectElement;\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.\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.nativeSelect) return '';\n    return this.nativeSelect.validationMessage;\n  }\n\n  /**\n   * The 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   * This Boolean attribute lets you specify that a form control should have select focus when the page loads.\n   */\n  @Prop() autofocus = false;\n\n  /**\n   * If `true`, the user cannot interact with the select.\n   */\n  @Prop({ reflect: true }) disabled = false;\n\n  /**\n   * When should the field perform validation\n   */\n  @Prop({ mutable: true }) validateOn?: 'dirty' | 'submit' | 'submitThenDirty' =\n    'submitThenDirty';\n\n  /**\n   * Whether to show validation errors underneath input\n   */\n  @Prop({ reflect: true }) showInlineError = true;\n\n  /**\n   * String to place within a label element. Alternatively use the 'label' slot\n   */\n  @Prop() label!: string;\n\n  /**\n   * Visually hide the label - but make it accessible.\n   */\n  @Prop() hideLabel?: boolean = false;\n\n  /**\n   * Enable floating label behaviour. Will disable placeholder if set.\n   */\n  @Prop() floatLabel: boolean = false;\n\n  /**\n   * If `true`, the user can enter more than one value. This attribute applies when the type attribute is set to `\"email\"` or `\"file\"`, otherwise it is ignored.\n   */\n  @Prop() multiple?: boolean = false;\n\n  /**\n   * The name of the control, which is submitted with the form data.\n   */\n  @Prop() name: string = this.selectId + '-name';\n\n  /**\n   * Instructional text that shows before the select has a value. Text set here will be placed inside the label when a value is set. If you don't want this behaviour just set the first option to have no value.\n   */\n  @Prop() placeholder?: string | null;\n\n  /**\n   * If `true`, the user cannot modify the value.\n   */\n  @Prop({ reflect: true }) readonly = false;\n\n  /**\n   * If `true`, the user must fill in a value before submitting a form.\n   */\n  @Prop() required = false;\n\n  /**\n   * The initial size of the control.\n   */\n  @Prop() size?: number;\n\n  /**\n   * Maximum number of options that can be selected when multiple is true\n   */\n  @Prop() max?: number;\n\n  /**\n   * Minimum number of options that can be selected when multiple is true\n   */\n  @Prop() min?: number;\n\n  /**\n   * The form element to associate the select with (its form owner). Must be the id of a form.\n   */\n  @Prop() form?: string | null;\n\n  /**\n   * in multiple mode, allow users to enter their own values\n   */\n  @Prop() allowCustomValues: boolean = false;\n\n  /**\n   * The value of the select.\n   */\n  @Prop()\n  get value() {\n    return this._value;\n  }\n  set value(val: string | string[]) {\n    if (typeof val === 'string') {\n      if (this.multiple) this._value = val.split(',');\n      else this._value = val;\n    } else if (Array.isArray(val)) {\n      if (this.multiple) this._value = val;\n      else this._value = val[0];\n    }\n  }\n  private _value: Array<string> | string = this.multiple ? [] : '';\n\n  /**\n   * You can set options via js as an array of strings: `domElement.options = ['option 1', 'option 2']` or\n   * objects `domElement.options = [{label: 'option 1', value: 'opt-1'}]`. See `nano-option` docs for all available properties.\n   * Alternatively, you can nest `<nano-option>` elements within a `<nano-select>`\n   * Regardless - reading `options` will return the current component options - slotted or otherwise\n   */\n  @Prop()\n  get options(): Array<OptionInterface | string> {\n    if (this._options.length) return this._options;\n\n    if (!this.datalist || !this.datalist.activeOptions) return [];\n\n    return this._eOptions.map((ao) => {\n      const { value, selected, label, filterMeta } = ao;\n      return { value, selected, label, filterMeta };\n    });\n  }\n  set options(opts: Array<OptionInterface | string>) {\n    this._options = opts.map((opt) => {\n      if (typeof opt === 'string') return { value: opt, label: opt };\n      else return opt;\n    });\n  }\n  private _options: OptionInterface[] = [];\n  @State() _eOptions: OptionInterface[] = [];\n\n  /**\n   * If `true`, a clear icon will appear in the select when there is a value. Clicking it clears the select.\n   */\n  @Prop() clearSelect = false;\n\n  /**\n   * Hide the native select element and cover with a value 'mask'.\n   * Enables a fluid nano-select width upon value change (if required). Doesn't work with multiple=\"true\".\n   */\n  @Prop() mask = false;\n\n  /**\n   * Set the amount of time, in milliseconds, to wait to trigger the `nanoSearchChange` event after each keystroke.\n   */\n  @Prop() debounce = 0;\n\n  @Watch('debounce')\n  protected debounceChanged() {\n    this.nanoSearchChange = debounceEvent(this.nanoSearchChange, this.debounce);\n  }\n\n  @Watch('required')\n  @Watch('disabled')\n  @Watch('min')\n  @Watch('max')\n  @Watch('readonly')\n  protected shouldValidate() {\n    if (this.onInit) return;\n    if (this.invalid) this.showErrorMsg = this._invalid = false;\n\n    this.customValidate();\n    if (this.validateOn !== 'dirty') return;\n    this.showInlineValidation();\n  }\n\n  /**\n   * Update the native select element when the value changes\n   */\n  // eslint-disable-next-line @stencil-community/no-unused-watch\n  @Watch('value')\n  valueChanged() {\n    this.customValidate();\n\n    if (this.onInit) {\n      if (this.multiple) this.currInsertIndex = this.value.length - 1;\n      return;\n    }\n    requestAnimationFrame(() => {\n      this.shouldValidate();\n      this.nanoChange.emit({ value: this.value });\n    });\n  }\n\n  /** nano-dropdown config options you can pass to the nested dropdown component */\n  @Prop({ mutable: true }) dropDownConfig?: Partial<Dropdown> = {};\n\n  @Watch('dropDownConfig')\n  setDataListOpts() {\n    if (!this.datalist || !this.selectWrap) return;\n\n    this.datalist.input = this.inputCtrl;\n\n    const currDWConfig = this.datalist.dropDownConfig || {};\n    this.datalist.dropDownConfig = {\n      ...currDWConfig,\n      ...this.dropDownConfig,\n      tetherTo: this.selectWrap,\n    };\n  }\n\n  // Custom Events\n\n  /**\n   * Emitted when the value has changed.\n   */\n  @Event() nanoChange!: EventEmitter<SelectChangeEventDetail>;\n\n  /**\n   * Emitted when the select loses focus.\n   */\n  @Event() nanoBlur!: EventEmitter<void>;\n\n  /**\n   * Emitted when the select has focus.\n   */\n  @Event() nanoFocus!: EventEmitter<void>;\n\n  /**\n   * Emitted when the select has been created.\n   * @internal\n   */\n  @Event() nanoDidLoad!: EventEmitter<void>;\n\n  /**\n   * Emitted when the select has been removed.\n   * @internal\n   */\n  @Event() nanoDidUnload!: EventEmitter<void>;\n\n  /**\n   * Emitted when a keyboard input occurred on a multiple=\"true\" input\n   */\n  @Event() nanoSearchChange!: EventEmitter<InputChangeEventDetail>;\n\n  /**\n   * Called when validation is performed (which depends on `validateOn`).\n   * @returns event.detail: `{ isValid: boolean, errorMessage: string, originalEvent: Event }`.\n   */\n  @Event() nanoValidate: EventEmitter<ControlValidityEventDetail>;\n\n  // Public Methods\n\n  /**\n   * Get the current state of the control.\n   * @param validateFirst - perform validation first before reporting\n   * @returns `{ isValid: boolean, errorMessage: string }`\n   */\n  @Method()\n  async reportValidity(validateFirst: boolean): Promise<ControlValidity> {\n    return new Promise((resolve) => {\n      if (validateFirst) {\n        this.customValidate();\n        this.showInlineValidation();\n      }\n      setTimeout(() => {\n        resolve({\n          isValid: !this._invalid,\n          errorMessage: this.nativeSelect.validationMessage,\n        });\n      }, 50);\n    });\n  }\n\n  /**\n   * Sets focus on the specified `nano-select`. Use this method instead of the global\n   * `select.focus()`.\n   */\n  @Method()\n  async setFocus() {\n    if (!this.inputCtrl) return;\n    this.inputCtrl.focus();\n    setTimeout(() => this.inputCtrl.click(), 50);\n  }\n\n  /**\n   * @returns the native `<select>` element used under the hood.\n   */\n  @Method()\n  getSelectElement(): Promise<HTMLSelectElement> {\n    return Promise.resolve(this.nativeSelect!);\n  }\n\n  /**\n   * Invalidate the field and show a custom error message.\n   * To clear the error you will need to re-call this method with an empty string.\n   */\n  @Method()\n  async showError(message: string) {\n    if (this.nativeSelect) {\n      this.customError = message;\n      this.nativeSelect.setCustomValidity(message);\n      this.showInlineValidation();\n    }\n  }\n\n  /* Logic */\n\n  private get valArray() {\n    return typeof this.value === 'string'\n      ? this.value.length\n        ? [this.value]\n        : []\n      : this.value;\n  }\n\n  private isValidValues() {\n    return this.valArray.find((val) =>\n      (this.options as OptionInterface[]).find((opt) => opt.value === val)\n    );\n  }\n\n  private customValidate = () => {\n    if (\n      !this.nativeSelect ||\n      !!this.customError ||\n      !this.nativeSelect['setCustomValidity']\n    )\n      return;\n\n    this.nativeSelect.setCustomValidity('');\n    // add custom validations 'cos html5 validations are a bit rubbish on selects\n    if (this.required && !this.valArray.length) {\n      this.nativeSelect.setCustomValidity('Please fill in this field.');\n      return true;\n    }\n    if (\n      this.valArray.length &&\n      !this.allowCustomValues &&\n      !this.isValidValues()\n    ) {\n      this.nativeSelect.setCustomValidity(\n        'Please choose an item from this field.'\n      );\n      return true;\n    }\n    if (this.max && this.valArray.length > this.max) {\n      this.nativeSelect.setCustomValidity(\n        `Only up to ${this.max} values are allowed.`\n      );\n      return true;\n    }\n    if (this.min && this.valArray.length < this.min) {\n      this.nativeSelect.setCustomValidity(\n        `You must select a minimum of ${this.min} values.`\n      );\n      return true;\n    }\n    return false;\n  };\n\n  private showInlineValidation = (ev?: Event) => {\n    if (this.validateOn === 'submitThenDirty') this.validateOn = 'dirty';\n\n    this._invalid = false;\n    this.showErrorMsg = false;\n    this.errorMessage = '';\n\n    if (!this.nativeSelect.validity.valid) {\n      this.errorMessage = this.nativeSelect.validationMessage;\n      this._invalid = true;\n      this.showErrorMsg = true;\n    }\n    this.nanoValidate.emit({\n      isValid: !this.invalid,\n      errorMessage: this.errorMessage,\n      originalEvent: ev,\n    });\n  };\n\n  private handleInvalid = (ev: Event) => {\n    this._invalid = true;\n\n    if (this.validateOn === 'submit') {\n      this._invalid = this.showErrorMsg = this.customValidate();\n    }\n    if (this.showInlineError) ev.preventDefault();\n\n    requestAnimationFrame(() => this.showInlineValidation(ev));\n  };\n\n  private setValue = (e: CustomEvent<HTMLNanoOptionElement>) => {\n    e.preventDefault();\n\n    if (!this.multiple) {\n      this.value = e.detail.value;\n      return;\n    }\n    if (this.value && this.value.length && this.value.includes(e.detail.value))\n      return;\n    if (this.max && this.value.length === this.max) return;\n\n    this.currInsertIndex++;\n    this.value = [\n      ...this.value.slice(0, this.currInsertIndex),\n      e.detail.value,\n      ...this.value.slice(this.currInsertIndex),\n    ];\n    this.inputSearchVal = '';\n    // this.selectWrap.clientWidth; // force reflow\n  };\n\n  private removeValue = (toFind?: string) => {\n    if (!this.multiple || !this.value.length) return;\n\n    if (!toFind) toFind = this.value[this.value.length - 1];\n    this.value = (this.value as Array<string>).filter((val) => val !== toFind);\n\n    this.currInsertIndex--;\n    // this.selectWrap.clientWidth; // force reflow\n    this.setFocus();\n  };\n\n  private slotChangeObserver() {\n    if (!window['MutationObserver']) return;\n\n    const mo = (this.mo = new MutationObserver(() =>\n      this.processSlottedContent()\n    ));\n    mo.observe(this.el, { childList: true, subtree: true });\n  }\n\n  private processSlottedContent() {\n    // see if we have label / helper content\n    this.hasLabelSlot = !!this.el.querySelectorAll('[slot=\"label\"]').length;\n    this.hasHelperSlot = !!this.el.querySelector('[slot=\"helper\"]');\n    this.hasHelperEndSlot = !!this.el.querySelector('[slot=\"helper-end\"]');\n  }\n\n  private getLabel(toFind: string) {\n    const label = (this.options as OptionInterface[]).find((opt) => {\n      return !opt.disabled && opt.value?.length && opt.value === toFind;\n    });\n    return label && label.label ? label.label : toFind;\n  }\n\n  /* Event handling */\n\n  @Listen('reset', { target: 'body' })\n  onReset(e) {\n    const form = this.form\n      ? document.querySelector('#' + this.form)\n      : this.el.closest('form');\n    if (!form || e.target !== this.el.closest('form')) return;\n\n    this.clearSelectValue();\n  }\n\n  @Listen('mousedown', { target: 'body' })\n  @Listen('keydown')\n  handleBlur(e: KeyboardEvent | MouseEvent) {\n    if (!this.hasFocus) return;\n\n    const kev = e as KeyboardEvent;\n    let target: Element;\n\n    requestAnimationFrame(() => {\n      if (kev.key) {\n        if (kev.key !== 'Tab') return;\n        target = getActiveElement();\n      } else target = e.target as Element;\n\n      if (closestElement(this.el.tagName.toLowerCase(), target) !== this.el) {\n        this.onBlur();\n      }\n    });\n  }\n\n  private setOptions = () => {\n    if (\n      !this.datalist ||\n      !this.datalist.activeOptions ||\n      !this.datalist.activeOptions.length\n    )\n      return;\n\n    this._eOptions = this.datalist.activeOptions.map((ao) => {\n      const { value, selected, label, filterMeta } = ao;\n      return { value, selected, label, filterMeta };\n    });\n    this.customValidate();\n  };\n\n  private handleDocumentKeyDown = (ev: KeyboardEvent) => {\n    if (!this.multiple || !this.hasFocus) return;\n\n    if (!this.inputSearchVal) {\n      let rm: HTMLSpanElement;\n\n      switch (ev.key) {\n        case 'Backspace':\n          if (this.inputCtrl.previousElementSibling)\n            rm = this.inputCtrl.previousElementSibling as HTMLSpanElement;\n          else break;\n\n          this.removeValue(rm.dataset.value || null);\n          break;\n\n        case 'Delete':\n          if (this.inputCtrl.nextElementSibling)\n            rm = this.inputCtrl.nextElementSibling as HTMLSpanElement;\n          else break;\n\n          this.removeValue(rm.dataset.value || null);\n          break;\n\n        case 'ArrowLeft':\n        case 'ArrowRight':\n          if (!this.value.length) break;\n\n          if (ev.key === 'ArrowLeft' && this.inputCtrl.previousSibling)\n            this.currInsertIndex--;\n          if (ev.key === 'ArrowRight' && this.inputCtrl.nextSibling)\n            this.currInsertIndex++;\n\n          setTimeout(() => {\n            this.inputCtrl.focus();\n          }, 20);\n          ev.preventDefault();\n          break;\n      }\n    }\n  };\n\n  private onBlur = () => {\n    this.hasFocus = false;\n\n    requestAnimationFrame(() => {\n      if (this.validateOn === 'dirty' && !this.hasFocus)\n        this.showInlineValidation();\n    });\n    this.nanoBlur.emit();\n\n    if (!this.allowCustomValues && this.multiple) {\n      this.inputSearchVal = '';\n      const event = new window.Event('change');\n      this.inputCtrl.dispatchEvent(event);\n    }\n  };\n\n  private onFocus = () => {\n    this.hasFocus = true;\n    this.nanoFocus.emit();\n  };\n\n  private clearSelectValue = (ev?: Event) => {\n    if (this.clearSelect && !this.readonly && !this.disabled && ev) {\n      ev.preventDefault();\n      ev.stopPropagation();\n    }\n\n    if (this.multiple) {\n      this.value = [];\n      this.currInsertIndex = -1;\n    } else this.value = '';\n\n    this.inputCtrl.value = '';\n    const event = new window.Event('change');\n    this.inputCtrl.dispatchEvent(event);\n  };\n\n  private onClick = () => {\n    this.setFocus();\n  };\n\n  /* Multi event handlers */\n\n  private onDragStart = (ev: MouseEvent) => {\n    const ele = ev.target as HTMLSpanElement;\n    this.dragVal = ele.dataset.value;\n  };\n\n  private onDragEnd = (ev) => {\n    this.dragVal = null;\n    ev.preventDefault();\n  };\n\n  private onDragLeave = (ev: MouseEvent) => {\n    const ele = ev.target as HTMLSpanElement;\n    const spanVal: string =\n      ele.dataset && ele.dataset.value ? ele.dataset.value : null;\n\n    if (\n      !spanVal ||\n      this.dragVal === spanVal ||\n      !this.value.includes(this.dragVal)\n    ) {\n      ev.preventDefault();\n      return;\n    }\n\n    const to = this.value.indexOf(spanVal);\n    const from = this.value.indexOf(this.dragVal);\n    const tmpArr = this.value as Array<string>;\n    const tmpVal = tmpArr[to];\n\n    tmpArr[to] = tmpArr[from];\n    tmpArr[from] = tmpVal;\n    this.value = [...tmpArr];\n  };\n\n  private onMultiInput = (ev) => {\n    this.inputSearchVal = ev.target.value.trim();\n    this.nanoSearchChange.emit({ value: ev.target.value.trim() });\n  };\n\n  /* Stencil Component lifecycle hooks */\n\n  connectedCallback() {\n    this.debounceChanged();\n\n    if (!Build.isBrowser) return;\n\n    this.el.dispatchEvent(\n      new CustomEvent('nanoDidLoad', {\n        detail: this.el,\n      })\n    );\n  }\n\n  disconnectedCallback() {\n    document.dispatchEvent(\n      new CustomEvent('nanoDidUnload', {\n        detail: this.el,\n      })\n    );\n\n    if (!Build.isBrowser) return;\n    if (this.mo) this.mo.disconnect();\n  }\n\n  componentDidLoad() {\n    this.slotChangeObserver();\n    this.customValidate();\n    this.setDataListOpts();\n    requestAnimationFrame(() => (this.onInit = false));\n  }\n\n  componentWillLoad() {\n    this.processSlottedContent();\n  }\n\n  render() {\n    const labelId = this.selectId + '-lbl';\n    const moreId =\n      this.showInlineError || this.hasHelperSlot\n        ? this.selectId + '-moreId'\n        : '';\n    const helperEndId = this.hasHelperEndSlot ? this.selectId + '-helper' : '';\n\n    this.rtl = (this.el.ownerDocument as Document).dir === 'rtl';\n    this.valueItems = [];\n\n    const compWrapOptions = (({\n      el,\n      floatLabel,\n      label,\n      errorMessage,\n      showInlineError,\n      hasHelperSlot,\n      hasHelperEndSlot,\n      hasLabelSlot,\n      hideLabel,\n      placeholder,\n      rtl,\n    }) => ({\n      el,\n      floatLabel,\n      label,\n      errorMessage,\n      showInlineError,\n      hasHelperSlot,\n      hasHelperEndSlot,\n      hasLabelSlot,\n      hideLabel,\n      placeholder,\n      rtl,\n    }))(this);\n    const wrapOptions = {\n      ...compWrapOptions,\n      labelId,\n      moreId,\n      helperEndId,\n      hasValue: !!this.value.length || !!this.inputSearchVal.length,\n      controlId: this.selectId,\n    };\n\n    const controlOptions = (({ readonly, disabled }) => ({\n      readonly,\n      disabled,\n      clearControl: this.clearSelect,\n    }))(this);\n\n    return (\n      <Host\n        type={this.multiple ? 'select-multiple' : 'select-one'}\n        aria-disabled={this.disabled ? 'true' : null}\n        class={{\n          ...createColorClasses(this.color),\n          'has-value': !!this.value.length || !!this.inputSearchVal.length,\n          'has-focus': this.hasFocus,\n          'is-invalid': this.invalid,\n          'has-label': this.label !== null && !this.floatLabel,\n          'has-float-label': this.label !== null && this.floatLabel,\n          rtl: this.rtl,\n          'has-multiple': this.multiple,\n          'has-clr-btn': this.clearSelect,\n          masked: this.mask,\n        }}\n      >\n        <FormControlWrap {...wrapOptions}>\n          <FormControl\n            {...controlOptions}\n            onClearText={this.clearSelectValue}\n            control={this.el}\n            ref={(el) => (this.selectWrap = el)}\n            endValueSlot={\n              <slot name=\"down-arrow\">\n                <nano-icon slot=\"value-end\" name=\"light/chevron-down\" />\n              </slot>\n            }\n          >\n            {this.multiple && (\n              <div class=\"select__multi-wrap select\">\n                {this.multipleValues(labelId, moreId, helperEndId)}\n              </div>\n            )}\n            {!this.multiple && [\n              this.mask && (\n                <div class=\"select__mask\">\n                  {this.getLabel(this.value as string)}\n                </div>\n              ),\n              <input\n                id={this.selectId}\n                class=\"select__native-input\"\n                ref={(input) => (this.inputCtrl = input)}\n                aria-labelledby={labelId + ' ' + moreId + ' ' + helperEndId}\n                disabled={this.disabled}\n                form={this.form}\n                placeholder={this.placeholder}\n                readOnly={true}\n                required={this.required}\n                value={this.getLabel(this.value as string)}\n                onFocus={this.onFocus}\n              />,\n            ]}\n          </FormControl>\n        </FormControlWrap>\n        {!this.readonly && !this.disabled && (\n          <nano-datalist\n            onNanoOptionsUpdated={this.setOptions}\n            ref={(el) => (this.datalist = el)}\n            selected={this.valArray}\n            type={this.multiple ? 'selctMulti' : 'select'}\n            onNanoSelect={this.setValue}\n            onNanoDeselect={(e) => {\n              e.preventDefault();\n              this.removeValue(e.detail.value);\n            }}\n            options={this._options.length ? this._options : undefined}\n          >\n            {this.allowCustomValues &&\n              this.multiple &&\n              !!this.inputSearchVal && (\n                <nano-option\n                  slot=\"list-top\"\n                  value={this.inputSearchVal}\n                  selected={false}\n                  label={this.inputSearchVal}\n                  onNanoSelect={() => this.inputCtrl.focus()}\n                >\n                  <span slot=\"check-icon\"></span>\n                  Add '{this.inputSearchVal}'\n                </nano-option>\n              )}\n            <slot />\n          </nano-datalist>\n        )}\n\n        <select\n          id={this.selectId + '-hidden'}\n          class=\"select__native-ctrl\"\n          ref={(select) => (this.nativeSelect = select)}\n          aria-labelledby={labelId + ' ' + moreId + ' ' + helperEndId}\n          disabled={this.disabled}\n          form={this.form}\n          multiple={this.multiple}\n          name={this.name}\n          required={this.required}\n          onInvalid={this.handleInvalid}\n        >\n          {this.allowCustomValues &&\n            this.valArray.map((val) => {\n              return (\n                <option value={val} selected={true}>\n                  {val}\n                </option>\n              );\n            })}\n          {!this.allowCustomValues &&\n            this.options.map((opt: OptionInterface) => {\n              return (\n                <option\n                  value={opt.value}\n                  selected={this.valArray.includes(opt.value)}\n                  disabled={opt.disabled}\n                  label={opt.label}\n                >\n                  {this.valArray.includes(opt.value)}\n                </option>\n              );\n            })}\n        </select>\n      </Host>\n    );\n  }\n\n  private multipleValues(\n    labelId: string,\n    moreId: string,\n    helperEndId: string\n  ): VNode | (VNode | VNode[])[] {\n    const input: VNode = (\n      <input\n        class=\"select__multi-input\"\n        id={this.selectId}\n        ref={(input) => (this.inputCtrl = input)}\n        readOnly={this.readonly}\n        disabled={this.disabled}\n        autoFocus={this.autofocus}\n        autocomplete=\"off\"\n        onKeyDown={this.handleDocumentKeyDown}\n        onInput={this.onMultiInput}\n        value={this.inputSearchVal}\n        onTouchStart={this.onClick}\n        onMouseDown={this.onClick}\n        onFocus={this.onFocus}\n        placeholder={\n          this.placeholder && !this.value.length ? this.placeholder : ''\n        }\n        aria-labelledby={labelId + ' ' + moreId + ' ' + helperEndId}\n      />\n    );\n    if (!this.value.length) return input;\n\n    return (this.value as Array<string>).map((val, i) => {\n      let toReturn: VNode | VNode[] = (\n        <span\n          onDragStart={this.onDragStart}\n          onDragLeave={this.onDragLeave}\n          onDragEnd={this.onDragEnd}\n          onDragOver={(e) => e.preventDefault()}\n          draggable\n          data-value={val}\n          ref={(span) => this.valueItems.push(span)}\n          class=\"select__multi-value\"\n        >\n          <span>{this.getLabel(val)}</span>\n          <button\n            class=\"select__multi-value-remove\"\n            type=\"button\"\n            tabindex=\"-1\"\n            onTouchEnd={() => {\n              this.removeValue(val);\n            }}\n            onMouseUp={() => {\n              this.removeValue(val);\n            }}\n          >\n            <nano-icon name=\"light/times\"></nano-icon>\n          </button>\n        </span>\n      );\n      if (i === 0 && this.currInsertIndex < 0)\n        toReturn = [input, toReturn as VNode];\n      else if (i === this.currInsertIndex)\n        toReturn = [toReturn as VNode, input];\n      return toReturn;\n    });\n  }\n}\n"],"version":3}

package/dist/components/table.js

@@ -621,7 +621,7 @@ const baseCellClasses = (colIndex, toString = false) => {
     return classListToStr(classes);
   return classes;
 };
-const TableCell = ({ rowIndex, colIndex, nestedContent, }) => {
+const TableCell$1 = ({ rowIndex, colIndex, nestedContent, }) => {
   const Content = () => nestedContent
     ? nestedContent()
     : cellRender(rowIndex, colIndex) || (h("span", { class: "placeholder" }, "\u00A0"));
@@ -652,15 +652,15 @@ const TableCell = ({ rowIndex, colIndex, nestedContent, }) => {
         h(Content, null))))) : (h(ContentWrap, null))));
 };
 
+const TableCell = ({ header, wrap }, children) => {
+  const cell = (h("div", { class: {
+      [`${CSSNAMESPACE}__cell-content`]: true,
+      [`${CSSNAMESPACE}__cell-content--wrap`]: wrap,
+    } }, children));
+  return header ? h("th", { scope: "row" }, cell) : h("td", null, cell);
+};
 const TableRow = ({ rowRenderer, rowIndex, rowModel, onColumnPinned }, children, utils) => {
   let extraProps = {};
-  const TableCell = ({ header, wrap }, children) => {
-    const cell = (h("div", { class: {
-        [`${CSSNAMESPACE}__cell-content`]: true,
-        [`${CSSNAMESPACE}__cell-content--wrap`]: wrap,
-      } }, children));
-    return header ? h("th", { scope: "row" }, cell) : h("td", null, cell);
-  };
   if (!rowModel) {
     const model = rowDataModel(rowIndex);
     rowModel = model.rowModel;
@@ -765,7 +765,7 @@ const TableHeadFootRow = ({ rowRenderer, onColumnPinned }, children, utils) => {
   return h("tr", Object.assign({}, props), children);
 };
 
-const tableCss = ":host{box-sizing:border-box}*,*::before,*::after{box-sizing:border-box}[hidden]{display:none !important}nano-table{display:block;width:100%;--max-col-width:clamp(200px, 500px, 50vw);--color:var(--nano-color-mediumgrey, #68767e);--font-size:0.87rem;--cell-line-height:1.5;--thead-font-size:0.95rem;--thead-color:#455560;--tfoot-color:#455560;--border-color:#dddbda;--border-style:thin solid var(--border-color);--border-tint-color:#0084a9;--border-tint-style:3px solid var(--border-tint-color);--cell-bg-rgb:var(--nano-color-white-rgb, 255 255 255);--head-bg-rgb:250 250 249;--foot-bg-rgb:var(--head-bg-rgb);--th-row-bg-rgb:var(--cell-bg-rgb);--ordered-bg-rgb:var(--nano-color-offwhite-rgb, 249 249 251);--td-padding-start:0.625rem;--td-padding-end:0.625rem;--td-padding-top:0.5rem;--td-padding-bottom:0.4125rem;--th-padding-start:0.625rem;--th-padding-end:0.625rem;--th-padding-top:0.875rem;--th-padding-bottom:0.6875rem;--td-padding-v:var(--td-padding-top) var(--td-padding-bottom);--td-padding-h:var(--td-padding-start) var(--td-padding-end);--th-padding-v:var(--th-padding-top) var(--th-padding-bottom);--th-padding-h:var(--th-padding-start) var(--th-padding-end);--foot-th-padding-v:var(--td-padding-top) var(--td-padding-bottom);--foot-th-padding-h:var(--td-padding-start) var(--td-padding-end);--head-th-padding-v:var(--th-padding-top) var(--th-padding-bottom);--head-th-padding-h:var(--th-padding-start) var(--th-padding-end);--bookend-col-padding:2rem}.nano-tbl{color:var(--color);text-align:start;width:100%;font-size:var(--font-size);border-spacing:0 0;border-collapse:separate;background:rgb(var(--cell-bg-rgb));-webkit-border-end:1px solid transparent;border-inline-end:1px solid transparent;-webkit-border-before:1px solid transparent;border-block-start:1px solid transparent;position:relative;z-index:1}.nano-tbl__wrap{display:table;min-width:100%}.nano-tbl__top-anchor{clip:rect(1px, 1px, 1px, 1px);-webkit-clip-path:inset(50%);clip-path:inset(50%);block-size:1px;inline-size:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;position:relative}.nano-tbl__ordered{background-color:var(--ordered-bg);-webkit-border-start:var(--border-style);border-inline-start:var(--border-style);-webkit-border-end:var(--border-style);border-inline-end:var(--border-style)}.nano-tbl__order-btn{padding:0;border:none;outline:none;font:inherit;background:none;-webkit-appearance:none;appearance:none;color:inherit;display:flex;gap:10px;align-items:center;width:100%}.nano-tbl__order-btn:focus-visible{outline:none;box-shadow:var(--nano-control-focus-shadow, 0 0 0 0.1875rem  var(--nano-control-focus-color, rgba(144, 198, 231, 0.8))) inset}.nano-tbl__status-icons{margin-inline:auto 10px;display:flex;gap:10px}.nano-tbl__progress-bar{font-size:0.2rem;position:sticky;inset-block-start:0;inset-inline:0;z-index:10;transition:scale 0.25s;transform:scale(0);width:100%;height:0}.nano-tbl__progress-bar--show{transform:scale(1);height:auto}.nano-tbl__caption--hide{clip:rect(1px, 1px, 1px, 1px);-webkit-clip-path:inset(50%);clip-path:inset(50%);block-size:1px;inline-size:1px;margin:-1px;overflow:hidden;padding:0;position:absolute}.nano-tbl__td,.nano-tbl__th{line-height:var(--cell-line-height);text-align:start;-webkit-border-before:var(--border-style);border-block-start:var(--border-style);max-width:var(--max-col-width);background-color:rgb(var(--cell-bg-rgb))}tbody:first-of-type tr:first-child .nano-tbl__td,tbody:first-of-type tr:first-child .nano-tbl__th{-webkit-border-before:none;border-block-start:none}tbody:last-of-type tr:last-child .nano-tbl__td,tbody:last-of-type tr:last-child .nano-tbl__th{-webkit-border-after:var(--border-style);border-block-end:var(--border-style)}.md .nano-tbl__td:first-child .nano-tbl__cell-content,.md .nano-tbl__th:first-child .nano-tbl__cell-content{-webkit-padding-start:var(--bookend-col-padding);padding-inline-start:var(--bookend-col-padding)}.md .nano-tbl__td:last-child .nano-tbl__cell-content,.md .nano-tbl__th:last-child .nano-tbl__cell-content{-webkit-padding-end:var(--bookend-col-padding);padding-inline-end:var(--bookend-col-padding)}@media (max-width: 768px){.nano-tbl__td:first-child .nano-tbl__cell-content,.nano-tbl__th:first-child .nano-tbl__cell-content{-webkit-padding-start:var(--td-padding-start) !important;padding-inline-start:var(--td-padding-start) !important}.nano-tbl__td:last-child .nano-tbl__cell-content,.nano-tbl__th:last-child .nano-tbl__cell-content{-webkit-padding-end:var(--td-padding-end) !important;padding-inline-end:var(--td-padding-end) !important}}thead .nano-tbl__td,thead .nano-tbl__th{color:var(--thead-color);font-weight:800;background:rgb(var(--head-bg-rgb)/90%);font-size:var(--thead-font-size);-webkit-border-before:none !important;border-block-start:none !important}thead .nano-tbl__td .nano-tbl__cell-content,thead .nano-tbl__th .nano-tbl__cell-content{padding-block:var(--head-th-padding-v);padding-inline:var(--head-th-padding-h)}thead .nano-tbl__td .nano-sortable__keyboard-handle,thead .nano-tbl__th .nano-sortable__keyboard-handle{position:absolute;inset-inline-end:5px;inset-block-start:50%;transform:translateY(-50%);background:white;z-index:10}tfoot .nano-tbl__td,tfoot .nano-tbl__th{color:var(--tfoot-color);font-weight:800;-webkit-border-before:none;border-block-start:none;background:rgb(var(--foot-bg-rgb)/90%);font-size:var(--thead-font-size)}tfoot .nano-tbl__td .nano-tbl__cell-content,tfoot .nano-tbl__th .nano-tbl__cell-content{padding-block:var(--foot-th-padding-v);padding-inline:var(--foot-th-padding-h)}.nano-tbl__td.nano-tbl__ordered,.nano-tbl__th.nano-tbl__ordered{background-color:rgb(var(--ordered-bg-rgb)/80%) !important}.nano-tbl__cell-content{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;padding-block:var(--td-padding-v);padding-inline:var(--td-padding-h)}.nano-tbl__cell-content--no-result{padding-block:2rem}.nano-tbl__cell-content--wrap{white-space:normal;overflow:visible}.nano-tbl tbody{will-change:scroll-position;opacity:1;transition:0.1s ease opacity;transform:translateZ(0)}.nano-tbl tbody.nano-tbl__inactive{opacity:0}.nano-tbl th[scope=row]{font-weight:800;margin:0}.nano-tbl__pin{position:sticky;transform:translateZ(0)}.nano-tbl__pin--start{inset-inline:-1px auto;transition:max-width 0.25s ease}.nano-tbl__pin--start::after{content:\"\";position:absolute;inset:0;box-shadow:5px 1px 4px 0 rgba(0, 0, 0, 0.2);opacity:0;z-index:-1}.nano-tbl__pinned--start .nano-tbl__pin--start{z-index:2;max-width:125px !important}.sm .nano-tbl__pinned--start .nano-tbl__pin--start{max-width:var(--max-col-width) !important}.nano-tbl__pinned--start .nano-tbl__pin--start::after{opacity:1}.nano-tbl__pin--end{}.nano-tbl__pin--start+.nano-tbl__pin--end{inset-inline:auto auto}.nano-tbl__pin--start+.nano-tbl__pin--end::after{display:none}.sm .nano-tbl__pin--end{inset-inline:auto -1px !important;max-width:min(50vw, 200px)}.sm .nano-tbl__pin--end::after{display:block !important;content:\"\";position:absolute;inset:0;box-shadow:-5px 1px 4px 0 rgba(0, 0, 0, 0.2);opacity:0;z-index:-1}.sm .nano-tbl__pinned--end .nano-tbl__pin--end::after{opacity:1}.nano-tbl__pin--top{inset-block:-1px auto}.nano-tbl__pinned--top .nano-tbl__pin--top{z-index:4 !important}.nano-tbl__pin--bottom{inset-block:auto -1px}.nano-tbl__pinned--bottom .nano-tbl__pin--bottom{z-index:5 !important}.nano-tbl__pinned--start .nano-tbl__pin--top.nano-tbl__pin--start{z-index:5 !important}.nano-tbl__pinned--top.nano-tbl__pinned--start .nano-tbl__pin--top.nano-tbl__pin--start{z-index:6 !important}.nano-tbl__pinned--end .nano-tbl__pin--top.nano-tbl__pin--end{z-index:5 !important}.nano-tbl__pinned--top.nano-tbl__pinned--end .nano-tbl__pin--top.nano-tbl__pin--end{z-index:6 !important}.nano-tbl__pinned--start .nano-tbl__pin--bottom.nano-tbl__pin--start{z-index:5 !important}.nano-tbl__pinned--bottom.nano-tbl__pinned--start .nano-tbl__pin--bottom.nano-tbl__pin--start{z-index:6 !important}.nano-tbl__pinned--end .nano-tbl__pin--bottom.nano-tbl__pin--end{z-index:5 !important}.nano-tbl__pinned--bottom.nano-tbl__pinned--end .nano-tbl__pin--bottom.nano-tbl__pin--end{z-index:6 !important}.nano-tbl thead tr:last-of-type td,.nano-tbl thead tr:last-of-type th{-webkit-border-after:var(--border-tint-style);border-block-end:var(--border-tint-style)}.nano-tbl tfoot tr:first-of-type td,.nano-tbl tfoot tr:first-of-type th{-webkit-border-before:none;border-block-start:none}.nano-tbl tfoot tr:last-of-type td,.nano-tbl tfoot tr:last-of-type th{-webkit-border-after:var(--border-tint-style);border-block-end:var(--border-tint-style)}.nano-tbl__pinned--bottom .nano-tbl tfoot tr.nano-tbl__pin--bottom:first-of-type td,.nano-tbl__pinned--bottom .nano-tbl tfoot tr.nano-tbl__pin--bottom:first-of-type th{-webkit-border-before:var(--border-tint-style) !important;border-block-start:var(--border-tint-style) !important}.nano-tbl__pinned--bottom .nano-tbl tfoot tr.nano-tbl__pin--bottom:last-of-type td,.nano-tbl__pinned--bottom .nano-tbl tfoot tr.nano-tbl__pin--bottom:last-of-type th{-webkit-border-after:none !important;border-block-end:none !important}.nano-tbl .unlimited-width{max-width:none}.nano-tbl__spinner{font-size:1.5rem;transition:scale 0.25s;scale:0;padding:0.5rem;position:absolute;inset-block-end:0;inset-inline-start:calc(50% - 0.75rem);z-index:0}.nano-tbl__spinner--show{scale:1;position:sticky}.nano-tbl nano-skeleton{line-height:var(--cell-line-height)}";
+const tableCss = ":host{box-sizing:border-box}*,*::before,*::after{box-sizing:border-box}[hidden]{display:none !important}nano-table{display:block;width:100%;--max-col-width:clamp(200px, 500px, 50vw);--color:var(--nano-color-mediumgrey, #68767e);--font-size:0.87rem;--cell-line-height:1.5;--thead-font-size:0.95rem;--thead-color:#455560;--tfoot-color:#455560;--border-color:#dddbda;--border-style:thin solid var(--border-color);--border-tint-color:#0084a9;--border-tint-style:3px solid var(--border-tint-color);--cell-bg-rgb:var(--nano-color-white-rgb, 255 255 255);--head-bg-rgb:250 250 249;--foot-bg-rgb:var(--head-bg-rgb);--th-row-bg-rgb:var(--cell-bg-rgb);--ordered-bg-rgb:var(--nano-color-offwhite-rgb, 249 249 251);--td-padding-start:0.625rem;--td-padding-end:0.625rem;--td-padding-top:0.5rem;--td-padding-bottom:0.4125rem;--th-padding-start:0.625rem;--th-padding-end:0.625rem;--th-padding-top:0.875rem;--th-padding-bottom:0.6875rem;--td-padding-v:var(--td-padding-top) var(--td-padding-bottom);--td-padding-h:var(--td-padding-start) var(--td-padding-end);--th-padding-v:var(--th-padding-top) var(--th-padding-bottom);--th-padding-h:var(--th-padding-start) var(--th-padding-end);--foot-th-padding-v:var(--td-padding-top) var(--td-padding-bottom);--foot-th-padding-h:var(--td-padding-start) var(--td-padding-end);--head-th-padding-v:var(--th-padding-top) var(--th-padding-bottom);--head-th-padding-h:var(--th-padding-start) var(--th-padding-end);--bookend-col-padding:2rem}.nano-tbl{color:var(--color);text-align:start;width:100%;font-size:var(--font-size);border-spacing:0 0;border-collapse:separate;background:rgb(var(--cell-bg-rgb));-webkit-border-end:1px solid transparent;border-inline-end:1px solid transparent;-webkit-border-before:1px solid transparent;border-block-start:1px solid transparent;position:relative;z-index:1}.nano-tbl__wrap{display:table;min-width:100%}.nano-tbl__top-anchor{clip:rect(1px, 1px, 1px, 1px);-webkit-clip-path:inset(50%);clip-path:inset(50%);block-size:1px;inline-size:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;position:relative}.nano-tbl__ordered{background-color:var(--ordered-bg);-webkit-border-start:var(--border-style);border-inline-start:var(--border-style);-webkit-border-end:var(--border-style);border-inline-end:var(--border-style)}.nano-tbl__order-btn{padding:0;border:none;outline:none;font:inherit;background:none;-webkit-appearance:none;appearance:none;color:inherit;display:flex;gap:10px;align-items:center;width:100%}.nano-tbl__order-btn:focus-visible{outline:none;box-shadow:var(--nano-control-focus-shadow, 0 0 0 0.1875rem  var(--nano-control-focus-color, rgba(144, 198, 231, 0.8))) inset}.nano-tbl__status-icons{margin-inline:auto 10px;display:flex;gap:10px}.nano-tbl__progress-bar{font-size:0.2rem;position:sticky;inset-block-start:0;inset-inline:0;z-index:10;transition:scale 0.25s;transform:scale(0);width:100%;height:0}.nano-tbl__progress-bar--show{transform:scale(1);height:auto}.nano-tbl__caption--hide{clip:rect(1px, 1px, 1px, 1px);-webkit-clip-path:inset(50%);clip-path:inset(50%);block-size:1px;inline-size:1px;margin:-1px;overflow:hidden;padding:0;position:absolute}.nano-tbl__td,.nano-tbl__th{line-height:var(--cell-line-height);text-align:start;-webkit-border-before:var(--border-style);border-block-start:var(--border-style);max-width:var(--max-col-width);background-color:rgb(var(--cell-bg-rgb))}tbody:first-of-type tr:first-child .nano-tbl__td,tbody:first-of-type tr:first-child .nano-tbl__th{-webkit-border-before:none;border-block-start:none}tbody:last-of-type tr:last-child .nano-tbl__td,tbody:last-of-type tr:last-child .nano-tbl__th{-webkit-border-after:var(--border-style);border-block-end:var(--border-style)}.md .nano-tbl__td:first-child .nano-tbl__cell-content,.md .nano-tbl__th:first-child .nano-tbl__cell-content{-webkit-padding-start:var(--bookend-col-padding);padding-inline-start:var(--bookend-col-padding)}.md .nano-tbl__td:last-child .nano-tbl__cell-content,.md .nano-tbl__th:last-child .nano-tbl__cell-content{-webkit-padding-end:var(--bookend-col-padding);padding-inline-end:var(--bookend-col-padding)}@media (max-width: 768px){.nano-tbl__td:first-child .nano-tbl__cell-content,.nano-tbl__th:first-child .nano-tbl__cell-content{-webkit-padding-start:var(--td-padding-start) !important;padding-inline-start:var(--td-padding-start) !important}.nano-tbl__td:last-child .nano-tbl__cell-content,.nano-tbl__th:last-child .nano-tbl__cell-content{-webkit-padding-end:var(--td-padding-end) !important;padding-inline-end:var(--td-padding-end) !important}}thead .nano-tbl__td,thead .nano-tbl__th{color:var(--thead-color);font-weight:800;background:rgb(var(--head-bg-rgb)/90%);font-size:var(--thead-font-size);-webkit-border-before:none !important;border-block-start:none !important}thead .nano-tbl__td .nano-tbl__cell-content,thead .nano-tbl__th .nano-tbl__cell-content{padding-block:var(--head-th-padding-v);padding-inline:var(--head-th-padding-h)}thead .nano-tbl__td .nano-sortable__keyboard-handle,thead .nano-tbl__th .nano-sortable__keyboard-handle{position:absolute;inset-inline-end:5px;inset-block-start:50%;transform:translateY(-50%);background:white;z-index:10}tfoot .nano-tbl__td,tfoot .nano-tbl__th{color:var(--tfoot-color);font-weight:800;-webkit-border-before:none;border-block-start:none;background:rgb(var(--foot-bg-rgb)/90%);font-size:var(--thead-font-size)}tfoot .nano-tbl__td .nano-tbl__cell-content,tfoot .nano-tbl__th .nano-tbl__cell-content{padding-block:var(--foot-th-padding-v);padding-inline:var(--foot-th-padding-h)}.nano-tbl__td.nano-tbl__ordered,.nano-tbl__th.nano-tbl__ordered{background-color:rgb(var(--ordered-bg-rgb)/80%) !important}.nano-tbl__cell-content{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;padding-block:var(--td-padding-v);padding-inline:var(--td-padding-h)}.nano-tbl__cell-content--no-result{padding-block:2rem}.nano-tbl__cell-content--wrap{white-space:normal;overflow:visible}.nano-tbl tbody{will-change:scroll-position;opacity:1;transition:0.1s ease opacity;transform:translateZ(0)}.nano-tbl tbody.nano-tbl__inactive{opacity:0}.nano-tbl tbody .nano-tbl__tr:has(~.nano-tbl__tr--placeholder){display:none}.nano-tbl tbody .nano-tbl__tr--placeholder~.nano-tbl__tr{display:none}.nano-tbl th[scope=row]{font-weight:800;margin:0}.nano-tbl__pin{position:sticky;transform:translateZ(0)}.nano-tbl__pin--start{inset-inline:-1px auto;transition:max-width 0.25s ease}.nano-tbl__pin--start::after{content:\"\";position:absolute;inset:0;box-shadow:5px 1px 4px 0 rgba(0, 0, 0, 0.2);opacity:0;z-index:-1}.nano-tbl__pinned--start .nano-tbl__pin--start{z-index:2;max-width:125px !important}.sm .nano-tbl__pinned--start .nano-tbl__pin--start{max-width:var(--max-col-width) !important}.nano-tbl__pinned--start .nano-tbl__pin--start::after{opacity:1}.nano-tbl__pin--end{}.nano-tbl__pin--start+.nano-tbl__pin--end{inset-inline:auto auto}.nano-tbl__pin--start+.nano-tbl__pin--end::after{display:none}.sm .nano-tbl__pin--end{inset-inline:auto -1px !important;max-width:min(50vw, 200px)}.sm .nano-tbl__pin--end::after{display:block !important;content:\"\";position:absolute;inset:0;box-shadow:-5px 1px 4px 0 rgba(0, 0, 0, 0.2);opacity:0;z-index:-1}.sm .nano-tbl__pinned--end .nano-tbl__pin--end::after{opacity:1}.nano-tbl__pin--top{inset-block:-1px auto}.nano-tbl__pinned--top .nano-tbl__pin--top{z-index:4 !important}.nano-tbl__pin--bottom{inset-block:auto -1px}.nano-tbl__pinned--bottom .nano-tbl__pin--bottom{z-index:5 !important}.nano-tbl__pinned--start .nano-tbl__pin--top.nano-tbl__pin--start{z-index:5 !important}.nano-tbl__pinned--top.nano-tbl__pinned--start .nano-tbl__pin--top.nano-tbl__pin--start{z-index:6 !important}.nano-tbl__pinned--end .nano-tbl__pin--top.nano-tbl__pin--end{z-index:5 !important}.nano-tbl__pinned--top.nano-tbl__pinned--end .nano-tbl__pin--top.nano-tbl__pin--end{z-index:6 !important}.nano-tbl__pinned--start .nano-tbl__pin--bottom.nano-tbl__pin--start{z-index:5 !important}.nano-tbl__pinned--bottom.nano-tbl__pinned--start .nano-tbl__pin--bottom.nano-tbl__pin--start{z-index:6 !important}.nano-tbl__pinned--end .nano-tbl__pin--bottom.nano-tbl__pin--end{z-index:5 !important}.nano-tbl__pinned--bottom.nano-tbl__pinned--end .nano-tbl__pin--bottom.nano-tbl__pin--end{z-index:6 !important}.nano-tbl thead tr:last-of-type td,.nano-tbl thead tr:last-of-type th{-webkit-border-after:var(--border-tint-style);border-block-end:var(--border-tint-style)}.nano-tbl tfoot tr:first-of-type td,.nano-tbl tfoot tr:first-of-type th{-webkit-border-before:none;border-block-start:none}.nano-tbl tfoot tr:last-of-type td,.nano-tbl tfoot tr:last-of-type th{-webkit-border-after:var(--border-tint-style);border-block-end:var(--border-tint-style)}.nano-tbl__pinned--bottom .nano-tbl tfoot tr.nano-tbl__pin--bottom:first-of-type td,.nano-tbl__pinned--bottom .nano-tbl tfoot tr.nano-tbl__pin--bottom:first-of-type th{-webkit-border-before:var(--border-tint-style) !important;border-block-start:var(--border-tint-style) !important}.nano-tbl__pinned--bottom .nano-tbl tfoot tr.nano-tbl__pin--bottom:last-of-type td,.nano-tbl__pinned--bottom .nano-tbl tfoot tr.nano-tbl__pin--bottom:last-of-type th{-webkit-border-after:none !important;border-block-end:none !important}.nano-tbl .unlimited-width{max-width:none}.nano-tbl__spinner{font-size:1.5rem;transition:scale 0.25s;scale:0;padding:0.5rem;position:absolute;inset-block-end:0;inset-inline-start:calc(50% - 0.75rem);z-index:0}.nano-tbl__spinner--show{scale:1;position:sticky}.nano-tbl nano-skeleton{line-height:var(--cell-line-height)}";
 
 const measurePerf = false;
 function perMark(name, end = false) {
@@ -856,12 +856,18 @@ const Table = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
           this._loading = false;
       }
     };
+    /**
+     * On scroll, loop through all blocks' heights and cumulatively, add them together.
+     * When we find that the scroll position is less than this cumulative block height -
+     * stop loop - it's on the current active block.
+     */
     this.scrollHandler = () => {
+      // don't listen if this table isn't in the viewport
       if (!this.store.general.state.isActive)
         return;
-      this.cacheScrollPosition = this.scrollParent.scrollTop || window.scrollY;
-      requestAnimationFrame(() => {
-        let cumulativeHeight = 0;
+      readTask(() => {
+        this.cacheScrollPosition = this.scrollParent.scrollTop || window.scrollY;
+        let cumulativeHeight = this.host.offsetTop;
         let blockIndex = 0;
         const blockLen = this.blocks.length;
         while (blockIndex < blockLen &&
@@ -1035,9 +1041,8 @@ const Table = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
         ? document
         : this._scrollParent).removeEventListener('scroll', this.scrollHandler);
     }
-    (ele === document.documentElement ? document : ele).addEventListener('scroll', this.scrollHandler, { passive: true });
+    (ele === document.documentElement ? document : ele).addEventListener('scroll', this.scrollHandler);
     this._scrollParent = ele;
-    this.setupActiveWatcher();
   }
   // used to fire `nanoTblBlockRendered` on block render change
   get primaryBlockIndex() {
@@ -1325,9 +1330,9 @@ const Table = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
         const height = el.getBoundingClientRect().height;
         // cache height to our block heights array
         // for subsequent renders
-        const fBhI = this.blockHeights.findIndex((bh) => bh.blockIndex === blockIndex);
-        if (fBhI > 0) {
-          this.blockHeights[fBhI] = { height, blockIndex };
+        const fBhIdx = this.blockHeights.findIndex((bh) => bh.blockIndex === blockIndex);
+        if (fBhIdx > -1) {
+          this.blockHeights[fBhIdx] = { height, blockIndex };
         }
         else
           this.blockHeights.push({ height, blockIndex });
@@ -1344,35 +1349,37 @@ const Table = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
   /** Adds an IO. Makes sure our scroll listener is only active when
    * the table is in viewport */
   setupActiveWatcher() {
-    if (!this.host || !this.scrollParent)
+    if (!this.host || !this.scrollParent || !this.store)
       return;
     if (this.activeWatcherIo) {
       this.activeWatcherIo.disconnect();
       this.activeWatcherIo = undefined;
     }
     const io = (this.activeWatcherIo = new IntersectionObserver(async ([e]) => {
-      if (!this.store)
-        return;
       if (e.isIntersecting)
         this.store.general.state.isActive = true;
       else
         this.store.general.state.isActive = false;
-    }, { root: this.scrollParent }));
+    }, { root: this.scrollParent, threshold: 0 }));
     io.observe(this.host);
   }
   // Component lifecycle
   async componentWillLoad() {
     perMark('init');
-    this.scrollParent = findScrollParent(this.host);
+    // setup stores
     this.store = await generateStore(this.host, this.columns, this.scrollParent, this.isReady);
-    this.store.general.onChange('isActive', this.scrollHandler);
     await this.handleRowsChange();
-    this.processSlots();
+    this.store.general.onChange('isActive', this.scrollHandler);
     this.store.data.onChange('rows', () => this.setBlocks());
+    // setup dom and attach listeners
+    this.processSlots();
     this.setBlocks();
+    this.scrollParent = findScrollParent(this.host);
+    this.setupActiveWatcher();
   }
   connectedCallback() {
     this.scrollParent = findScrollParent(this.host);
+    this.setupActiveWatcher();
   }
   componentDidLoad() {
     this.setInitialBlockDimension();
@@ -1383,7 +1390,7 @@ const Table = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
     // but we don't want it to cause renders
     if (['rows', 'columns'].includes(stateName))
       return false;
-    if (Build.isDev && !Build.isTesting)
+    if (Build.isDev && !Build.isTesting && measurePerf)
       console.log(stateName, _newVal, _oldVal);
   }
   componentWillRender() {
@@ -1401,24 +1408,24 @@ const Table = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
   }
   render() {
     this.blockElements = [];
-    return (h(Host, null, h("div", { class: `${CSSNAMESPACE}__top-anchor`, ref: (a) => (this.topAnchorEle = a) }, "\u00A0"), h("nano-resize-observe", { "aria-labelledby": 'table-caption-' + this.renderId, tabindex: this.type === 'grid' ? '0' : undefined, states: "576w sm, 768w md", class: "sm md", onNanoResizeStateChange: this.handleResizeChange }), h("div", { class: `${CSSNAMESPACE}__wrap sm md`, ref: (div) => (this.tableWrapperEle = div) }, h("nano-progress-bar", { indeterminate: true, class: {
+    return (h(Host, null, h("div", { class: `${CSSNAMESPACE}__top-anchor`, ref: (a) => (this.topAnchorEle = a) }, "\u00A0"), h("nano-resize-observe", { states: "576w sm, 768w md", class: "sm md", onNanoResizeStateChange: this.handleResizeChange }), h("div", { class: `${CSSNAMESPACE}__wrap sm md`, ref: (div) => (this.tableWrapperEle = div), "aria-labelledby": 'table-caption-' + this.renderId, tabindex: this.type === 'grid' ? '0' : undefined }, h("nano-progress-bar", { indeterminate: true, class: {
         [`${CSSNAMESPACE}__progress-bar`]: true,
         [`${CSSNAMESPACE}__progress-bar--show`]: this._loading,
-      } }), h("table", { role: this.type === 'grid' ? 'grid' : undefined, "aria-readonly": this.type === 'table' ? 'true' : undefined, "aria-rowcount": this.store.data.state.rows.length, "aria-colcount": this.store.config.state.columns.length, class: `${CSSNAMESPACE}`, ref: (tbl) => (this.tableEle = tbl) }, h("caption", { class: {
+      } }), h("table", { role: this.type === 'grid' ? 'grid' : undefined, "aria-rowcount": this.store.data.state.rows.length, "aria-colcount": this.store.config.state.columns.length, class: `${CSSNAMESPACE}`, ref: (tbl) => (this.tableEle = tbl) }, h("caption", { class: {
         [`${CSSNAMESPACE}__caption`]: true,
         [`${CSSNAMESPACE}__caption--hide`]: !this.showCaption,
       }, id: 'table-caption-' + this.renderId }, h("slot", { name: "caption" }, this.caption)), h("thead", null, h(TableHeadFootRow, { rowRenderer: this.headRender, onColumnPinned: this.handleColumnPinned }, this.store.config.state.columns.map((colModel) => [
       h(TableColHead, { column: colModel, headRenderer: this.headRender, onColumnSortClick: this.sortStart, onColumnPinned: this.handleColumnPinned, defaults: {
           sortable: this.defaultSort,
         } }),
-    ]))), this._loading && !this.blocks.length && (h("tbody", { class: `${CSSNAMESPACE}__active` }, [...Array(10).keys()].map((rowIndex) => (h("tr", null, this.store.config.state.columns.map((_colModel, colIndex) => (h(TableCell, { rowIndex: rowIndex, colIndex: colIndex, nestedContent: () => h("nano-skeleton", null) })))))))), h("tr", { hidden: !!this._loading || !!this.blocks.length }, h("th", { class: `${CSSNAMESPACE}__th`, colSpan: this.store.config.state.columns.length }, h("div", { class: "nano-tbl__cell-content nano-tbl__cell-content--no-result" }, h("slot", { name: "no-results" }, "No results found")))), this.blocks.map((block, blockIndex) => (h("tbody", { key: block.__uuid, id: `tbody-${this.renderId}-${blockIndex}`, ref: (tb) => {
+    ]))), this._loading && !this.blocks.length && (h("tbody", { class: `${CSSNAMESPACE}__active` }, [...Array(10).keys()].map((rowIndex) => (h("tr", null, this.store.config.state.columns.map((_colModel, colIndex) => (h(TableCell$1, { rowIndex: rowIndex, colIndex: colIndex, nestedContent: () => h("nano-skeleton", null) })))))))), h("tr", { hidden: !!this._loading || !!this.blocks.length }, h("th", { class: `${CSSNAMESPACE}__th`, colSpan: this.store.config.state.columns.length }, h("div", { class: "nano-tbl__cell-content nano-tbl__cell-content--no-result" }, h("slot", { name: "no-results" }, "No results found")))), this.blocks.map((block, blockIndex) => (h("tbody", { key: block.__uuid, id: `tbody-${this.renderId}-${blockIndex}`, ref: (tb) => {
         this.blockElements.push(tb);
       }, class: {
         [`${CSSNAMESPACE}__inactive`]: !this.activeBlocks.includes(blockIndex),
         [`${CSSNAMESPACE}__active`]: this.activeBlocks.includes(blockIndex),
       } }, this.activeBlocks.includes(blockIndex) ? (block.rows.map((row, i) => {
       const rowIndex = blockIndex > 0 ? blockIndex * this.perBlock + i : i;
-      return (h(TableRow, { rowRenderer: this.rowRender, rowModel: row, rowIndex: rowIndex }, this.store.config.state.columns.map((_colModel, colIndex) => (h(TableCell, { rowIndex: rowIndex, colIndex: colIndex })))));
+      return (h(TableRow, { rowRenderer: this.rowRender, rowModel: row, rowIndex: rowIndex }, this.store.config.state.columns.map((_colModel, colIndex) => (h(TableCell$1, { rowIndex: rowIndex, colIndex: colIndex })))));
     })) : (h("tr", null, h("td", { colSpan: this.store.config.state.columns.length, style: {
         height: this.getBlockHeight(blockIndex) + 'px',
       } })))))), this.showFooter && (h("tfoot", null, h(TableHeadFootRow, { rowRenderer: this.footRender, onColumnPinned: this.handleColumnPinned }, this.store.config.state.columns.map((colModel) => [