@ni/spright-components 2.0.11 → 2.0.13

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -3403,19 +3403,17 @@ const xg="nimble-icon-arrow-expander-down",Cg="above",kg="underline",Sg="outline
3403
3403
  `))
3404
3404
  class Dg{constructor(t,e){this.target=t,this.propertyName=e}bind(t){this.source=t,this.setSourceValue(!1),this.mouseOverHandler=()=>{const t=this.target.offsetWidth<this.target.scrollWidth
3405
3405
  this.setSourceValue(t)},this.mouseOutHandler=()=>{this.setSourceValue(!1)},this.target.addEventListener("mouseover",this.mouseOverHandler),this.target.addEventListener("mouseout",this.mouseOutHandler)}unbind(){this.source=void 0,this.target.removeEventListener("mouseover",this.mouseOverHandler),this.target.removeEventListener("mouseout",this.mouseOutHandler)}setSourceValue(t){this.source[this.propertyName]=t}}function Ag(t){return new E("nimble-overflow",Dg,t)}let Tg=class extends Fi{}
3406
- class Og extends(An(Tg)){constructor(){super(...arguments),this.proxy=document.createElement("input")}}class Rg extends Og{constructor(){super(...arguments),this.appearance=kg,this.errorVisible=!1,this.open=!1,this.filteredOptions=[],this.hasOverflow=!1,this.listboxId=Va("listbox-"),this.availableViewportHeight=0,this.valueUpdatedByInput=!1,this._value="",this.filter="",this.forcedPosition=!1}get value(){return x.track(this,"value"),this._value}set value(t){const e=`${this._value}`
3406
+ class Og extends(An(Tg)){constructor(){super(...arguments),this.proxy=document.createElement("input")}}class Rg extends Og{constructor(){super(...arguments),this.appearance=kg,this.errorVisible=!1,this.open=!1,this.filteredOptions=[],this.hasOverflow=!1,this.listboxId=Va("listbox-"),this.availableViewportHeight=0,this.valueUpdatedByInput=!1,this._value="",this.filter="",this.forcedPosition=!1}get value(){return x.track(this,"value"),this._value}set value(t){const e=this._value
3407
3407
  let n=t
3408
- if(this.$fastController.isConnected&&this.options){const e=this.options.findIndex((e=>e.text.toLowerCase()===t.toLowerCase())),i=this.options[this.selectedIndex]?.text,s=this.options[e]?.text
3409
- this.selectedIndex=i!==s?e:this.selectedIndex,n=this.firstSelectedOption?.text||t}e!==n&&(this._value=n,super.valueChanged(e,n),x.notify(this,"value")),this.filter=t,this.filterOptions(),this.selectedIndex=this.options.map((t=>t.text)).indexOf(this.value)}get options(){return x.track(this,"options"),this.filteredOptions?.length?this.filteredOptions:this._options}set options(t){this._options=t,x.notify(this,"options")}get isAutocompleteInline(){return this.autocomplete===Yn||this.isAutocompleteBoth}get isAutocompleteList(){return this.autocomplete===Xn||this.isAutocompleteBoth}get isAutocompleteBoth(){return this.autocomplete===Jn}slottedOptionsChanged(t,e){const n=this.value
3408
+ if(this.$fastController.isConnected&&this.options){const e=this.findIndexOfValidOption(t),i=this.options[this.selectedIndex]?.text,s=this.options[e]?.text
3409
+ i!==s&&(this.selectedIndex=e),n=this.firstSelectedOption?.text||n}e!==n&&(this._value=n,super.valueChanged(e,n),x.notify(this,"value")),this.filter=t,this.filterOptions(),this.selectedIndex=this.findIndexOfValidOption(this.value)}get options(){return x.track(this,"options"),this.filteredOptions&&this.filter?this.filteredOptions:this._options}set options(t){this._options=t,x.notify(this,"options")}get isAutocompleteInline(){return this.autocomplete===Yn||this.isAutocompleteBoth}get isAutocompleteList(){return this.autocomplete===Xn||this.isAutocompleteBoth}get isAutocompleteBoth(){return this.autocomplete===Jn}slottedOptionsChanged(t,e){const n=this.value
3410
3410
  super.slottedOptionsChanged(t,e),this.updateValue(),n&&(this.value=n)}connectedCallback(){super.connectedCallback(),this.forcedPosition=!!this.positionAttribute,this.value&&(this.initialValue=this.value),this.setPositioning(),this.updateInputAriaLabel()}clickHandler(t){if(this.disabled)return!1
3411
3411
  if(this.open){const e=t.target.closest("option,[role=option]")
3412
3412
  if(!e||e.disabled)return!1
3413
3413
  this.selectedOptions=[e],this.control.value=e.text,this.clearSelectionRange(),this.updateValue(!0)}return this.open=!this.open,this.open&&this.control.focus(),!0}toggleButtonClickHandler(t){t.stopImmediatePropagation()}toggleButtonChangeHandler(t){this.open=this.dropdownButton.checked,t.stopImmediatePropagation()}toggleButtonKeyDownHandler(t){switch(t.key){case Da:case Ma:case La:case Ta:return this.open=!0,this.stopPropagation(t),!1
3414
3414
  default:return!0}}filterOptions(){this.autocomplete&&this.autocomplete!==Qn||(this.filter="")
3415
3415
  const t=this.filter.toLowerCase()
3416
- this.filteredOptions=this._options.filter((e=>e.text.toLowerCase().startsWith(t)&&!e.hidden)),this.isAutocompleteList&&this._options.forEach((t=>{t.visuallyHidden=!this.filteredOptions.includes(t)}))
3417
- const e=this.filteredOptions.filter((t=>!t.disabled))
3418
- this.filteredOptions=e}inputHandler(t){return this.filter=this.control.value,this.filterOptions(),this.isAutocompleteInline||(this.selectedIndex=this.options.map((t=>t.text)).indexOf(this.control.value)),!t.inputType.includes("deleteContent")&&this.filter.length&&(this.isAutocompleteList&&!this.open&&(this.open=!0),this.isAutocompleteInline&&(this.filteredOptions.length?(this.selectedOptions=[this.filteredOptions[0]],this.selectedIndex=this.options.indexOf(this.firstSelectedOption),this.setInlineSelection()):this.selectedIndex=-1)),this.valueUpdatedByInput||(this.valueBeforeTextUpdate=this.value),this.valueUpdatedByInput=!0,this.value!==this.control.value&&this.focusAndScrollOptionIntoView(),this.value=this.control.value,!0}keydownHandler(t){if(t.ctrlKey||t.altKey)return!0
3416
+ this.filteredOptions=this._options.filter((e=>e.text.toLowerCase().startsWith(t)&&!e.hidden)),this.isAutocompleteList&&this._options.forEach((t=>{t.visuallyHidden=!this.filteredOptions.includes(t)}))}inputHandler(t){return this.filter=this.control.value,this.filterOptions(),this.isAutocompleteInline||(this.selectedIndex=this.findIndexOfValidOption(this.control.value)),!t.inputType.includes("deleteContent")&&this.filter.length&&(this.isAutocompleteList&&!this.open&&(this.open=!0),this.isAutocompleteInline&&(this.filteredOptions.length?(this.selectedOptions=[this.filteredOptions[0]],this.selectedIndex=this.options.indexOf(this.firstSelectedOption),this.setInlineSelection()):this.selectedIndex=-1)),this.valueUpdatedByInput||(this.valueBeforeTextUpdate=this.value),this.valueUpdatedByInput=!0,this.value!==this.control.value&&this.focusAndScrollOptionIntoView(),this.value=this.control.value,!0}keydownHandler(t){if(t.ctrlKey||t.altKey)return!0
3419
3417
  switch(t.key){case Ta:this.syncValue(),this.isAutocompleteInline&&(this.filter=this.value),this.open=!1,this.clearSelectionRange(),this.emitChangeIfValueUpdated()
3420
3418
  break
3421
3419
  case Oa:if(this.isAutocompleteInline||(this.selectedIndex=-1),this.open){this.open=!1
@@ -3428,15 +3426,20 @@ case Ma:case Da:if(this.filterOptions(),!this.open){this.open=!0
3428
3426
  break}this.filteredOptions.length>0&&super.keydownHandler(t),this.isAutocompleteInline&&this.setInlineSelection(),this.open&&this.valueUpdatedByInput&&(this.valueUpdatedByInput=!1)
3429
3427
  break
3430
3428
  default:return!0}return!0}keyupHandler(t){switch(t.key){case"ArrowLeft":case"ArrowRight":case"Backspace":case"Delete":case"Home":case"End":this.filter=this.control.value,this.selectedIndex=-1,this.filterOptions()}return!0}focusoutHandler(t){if(this.syncValue(),this.open){const e=t.relatedTarget
3431
- this.isSameNode(e)&&this.focus()}return this.open=!1,this.emitChangeIfValueUpdated(),!0}formResetCallback(){super.formResetCallback(),this.setDefaultSelectedOption(),this.updateValue()}validate(){super.validate(this.control)}setDefaultSelectedOption(){if(this.$fastController.isConnected&&this.options){const t=this.options.findIndex((t=>null!==t.getAttribute("selected")||t.selected))
3432
- this.selectedIndex=t,!this.dirtyValue&&this.firstSelectedOption&&(this.value=this.firstSelectedOption.text),this.setSelectedOptions()}}selectedIndexChanged(t,e){if(this.$fastController.isConnected){const n=function(t,e,n){return Math.min(Math.max(n,t),e)}(-1,this.options.length-1,e)
3433
- if(n!==this.selectedIndex)return void(this.selectedIndex=n)
3434
- super.selectedIndexChanged(t,n)}}disabledChanged(t,e){super.disabledChanged&&super.disabledChanged(t,e),this.ariaDisabled=this.disabled?"true":"false"}selectPreviousOption(){!this.disabled&&this.selectedIndex>=0&&(this.selectedIndex-=1)}setPositioning(){if(!this.$fastController.isConnected)return
3429
+ this.isSameNode(e)&&this.focus()}return this.open=!1,this.emitChangeIfValueUpdated(),!0}formResetCallback(){super.formResetCallback(),this.setDefaultSelectedOption(),this.updateValue()}validate(){super.validate(this.control)}setDefaultSelectedOption(){if(this.$fastController.isConnected&&this.options){const t=this.options.findIndex((t=>!t.disabled&&(null!==t.getAttribute("selected")||t.selected)))
3430
+ this.selectedIndex=t,!this.dirtyValue&&this.firstSelectedOption&&(this.value=this.firstSelectedOption.text),this.setSelectedOptions()}}selectedIndexChanged(t,e){if(this.$fastController.isConnected){let n=function(t,e,n){return Math.min(Math.max(n,t),e)}(-1,this.options.length-1,e)
3431
+ if(this.options[n]?.disabled&&(n=-1),n!==this.selectedIndex)return void(this.selectedIndex=n)
3432
+ super.selectedIndexChanged(t,n),this.setSelectedOptions()}}disabledChanged(t,e){super.disabledChanged&&super.disabledChanged(t,e),this.ariaDisabled=this.disabled?"true":"false"}selectNextOption(){if(!this.disabled){let t=this.selectedIndex
3433
+ do{if(t+1>=this.options.length)return
3434
+ t+=1}while(this.options[t].disabled)
3435
+ this.selectedIndex=t}}selectPreviousOption(){if(!this.disabled){let t=this.selectedIndex
3436
+ do{if(t-=1,t<0)break}while(this.options[t].disabled)
3437
+ this.selectedIndex=t}}setPositioning(){if(!this.$fastController.isConnected)return
3435
3438
  const t=this.getBoundingClientRect(),e=window.innerHeight-t.bottom
3436
- this.forcedPosition?this.position=this.positionAttribute:t.top>e?this.position=Wn:this.position=Gn,this.positionAttribute=this.forcedPosition?this.positionAttribute:this.position,this.availableViewportHeight=this.position===Wn?Math.trunc(t.top):Math.trunc(e)}focusAndScrollOptionIntoView(){this.open&&this.contains(document.activeElement)&&(this.control.focus(),this.firstSelectedOption&&requestAnimationFrame((()=>{this.firstSelectedOption?.scrollIntoView({block:"nearest"})})))}openChanged(){this.open?(this.ariaControls=this.listboxId,this.ariaExpanded="true",this.setPositioning(),this.focusAndScrollOptionIntoView(),b.queueUpdate((()=>this.focus()))):(this.ariaControls="",this.ariaExpanded="false"),this.dropdownButton&&(this.dropdownButton.checked=this.open)}placeholderChanged(){this.proxy instanceof HTMLInputElement&&(this.proxy.placeholder=this.placeholder??"")}selectedOptionsChanged(t,e){this.$fastController.isConnected&&this._options.forEach((t=>{t.selected=e.includes(t)}))}positionChanged(t,e){this.positionAttribute=e,this.setPositioning()}regionChanged(t,e){this.region&&this.controlWrapper&&(this.region.anchorElement=this.controlWrapper)}controlWrapperChanged(t,e){this.region&&this.controlWrapper&&(this.region.anchorElement=this.controlWrapper)}ariaLabelChanged(t,e){this.updateInputAriaLabel()}updateValue(t){this.$fastController.isConnected&&(this.value=this.firstSelectedOption?.text||this.control.value,this.control.value=this.value),t&&this.$emit("change")}setInputToSelection(){this.firstSelectedOption&&(this.control.value=this.firstSelectedOption.text,this.control.focus())}setInlineSelection(){this.firstSelectedOption&&(this.setInputToSelection(),this.control.setSelectionRange(this.filter.length,this.control.value.length,"backward"))}clearSelectionRange(){const t=this.control.value.length
3439
+ this.forcedPosition?this.position=this.positionAttribute:t.top>e?this.position=Wn:this.position=Gn,this.positionAttribute=this.forcedPosition?this.positionAttribute:this.position,this.availableViewportHeight=this.position===Wn?Math.trunc(t.top):Math.trunc(e)}focusAndScrollOptionIntoView(){this.open&&this.contains(document.activeElement)&&(this.control.focus(),this.firstSelectedOption&&requestAnimationFrame((()=>{this.firstSelectedOption?.scrollIntoView({block:"nearest"})})))}openChanged(){this.open?(this.ariaControls=this.listboxId,this.ariaExpanded="true",this.setPositioning(),this.focusAndScrollOptionIntoView(),b.queueUpdate((()=>this.focus()))):(this.ariaControls="",this.ariaExpanded="false"),this.dropdownButton&&(this.dropdownButton.checked=this.open)}placeholderChanged(){this.proxy instanceof HTMLInputElement&&(this.proxy.placeholder=this.placeholder??"")}setSelectedOptions(){this.selectedOptions=this.selectedIndex>-1?[this.options[this.selectedIndex]]:[],this.ariaActiveDescendant=this.firstSelectedOption?.id??"",this.focusAndScrollOptionIntoView()}selectedOptionsChanged(t,e){this.$fastController.isConnected&&this._options.forEach((t=>{t.selected=e.includes(t)}))}positionChanged(t,e){this.positionAttribute=e,this.setPositioning()}regionChanged(t,e){this.region&&this.controlWrapper&&(this.region.anchorElement=this.controlWrapper)}controlWrapperChanged(t,e){this.region&&this.controlWrapper&&(this.region.anchorElement=this.controlWrapper)}ariaLabelChanged(t,e){this.updateInputAriaLabel()}updateValue(t){this.$fastController.isConnected&&(this.value=this.firstSelectedOption?.text||this.control.value,this.control.value=this.value),t&&this.$emit("change")}setInputToSelection(){this.firstSelectedOption&&(this.control.value=this.firstSelectedOption.text,this.control.focus())}setInlineSelection(){this.firstSelectedOption&&(this.setInputToSelection(),this.control.setSelectionRange(this.filter.length,this.control.value.length,"backward"))}clearSelectionRange(){const t=this.control.value.length
3437
3440
  this.control.setSelectionRange(t,t)}syncValue(){const t=this.selectedIndex>-1?this.firstSelectedOption?.text:this.control.value
3438
3441
  this.updateValue(this.value!==t)}updateInputAriaLabel(){const t=this.shadowRoot?.querySelector(".selected-value")
3439
- this.ariaLabel?t?.setAttribute("aria-label",this.ariaLabel):t?.removeAttribute("aria-label")}emitChangeIfValueUpdated(){this.valueUpdatedByInput&&(this.value!==this.valueBeforeTextUpdate&&this.$emit("change"),this.valueUpdatedByInput=!1)}}t([ft],Rg.prototype,"appearance",void 0),t([ft({attribute:"error-text"})],Rg.prototype,"errorText",void 0),t([ft({attribute:"error-visible",mode:"boolean"})],Rg.prototype,"errorVisible",void 0),t([ft({attribute:"autocomplete",mode:"fromView"})],Rg.prototype,"autocomplete",void 0),t([ft({attribute:"position"})],Rg.prototype,"positionAttribute",void 0),t([ft({attribute:"open",mode:"boolean"})],Rg.prototype,"open",void 0),t([ft],Rg.prototype,"placeholder",void 0),t([C],Rg.prototype,"position",void 0),t([C],Rg.prototype,"region",void 0),t([C],Rg.prototype,"controlWrapper",void 0),t([C],Rg.prototype,"control",void 0),t([C],Rg.prototype,"listbox",void 0),t([C],Rg.prototype,"dropdownButton",void 0),t([C],Rg.prototype,"filteredOptions",void 0),t([C],Rg.prototype,"hasOverflow",void 0),t([C],Rg.prototype,"availableViewportHeight",void 0)
3442
+ this.ariaLabel?t?.setAttribute("aria-label",this.ariaLabel):t?.removeAttribute("aria-label")}emitChangeIfValueUpdated(){this.valueUpdatedByInput&&(this.value!==this.valueBeforeTextUpdate&&this.$emit("change"),this.valueUpdatedByInput=!1)}findIndexOfValidOption(t){return this.options.findIndex((e=>!e.disabled&&e.text===t))}}t([ft],Rg.prototype,"appearance",void 0),t([ft({attribute:"error-text"})],Rg.prototype,"errorText",void 0),t([ft({attribute:"error-visible",mode:"boolean"})],Rg.prototype,"errorVisible",void 0),t([ft({attribute:"autocomplete",mode:"fromView"})],Rg.prototype,"autocomplete",void 0),t([ft({attribute:"position"})],Rg.prototype,"positionAttribute",void 0),t([ft({attribute:"open",mode:"boolean"})],Rg.prototype,"open",void 0),t([ft],Rg.prototype,"placeholder",void 0),t([C],Rg.prototype,"position",void 0),t([C],Rg.prototype,"region",void 0),t([C],Rg.prototype,"controlWrapper",void 0),t([C],Rg.prototype,"control",void 0),t([C],Rg.prototype,"listbox",void 0),t([C],Rg.prototype,"dropdownButton",void 0),t([C],Rg.prototype,"filteredOptions",void 0),t([C],Rg.prototype,"hasOverflow",void 0),t([C],Rg.prototype,"availableViewportHeight",void 0)
3440
3443
  const Fg=Rg.compose({baseName:"combobox",baseClass:Og,template:(t,e)=>Q`
3441
3444
  <template
3442
3445
  aria-disabled="${t=>t.ariaDisabled}"