@ni/fast-foundation 10.2.1 → 10.2.2

package/dist/esm/toolbar/toolbar.js

@@ -61,6 +61,12 @@ export class Toolbar extends FoundationElement {
          * @internal
          */
         this.direction = Direction.ltr;
+        /**
+         * The collection of focusable toolbar controls.
+         *
+         * @internal
+         */
+        this.focusableElements = [];
         /**
          * The orientation of the toolbar.
          *
@@ -81,7 +87,7 @@ export class Toolbar extends FoundationElement {
     }
     set activeIndex(value) {
         if (this.$fastController.isConnected) {
-            this._activeIndex = limit(0, this.focusableElements.length - 1, value);
+            this._activeIndex = limit(0, this.focusableElements.length > 0 ? this.focusableElements.length - 1 : 0, value);
             Observable.notify(this, "activeIndex");
         }
     }
@@ -96,7 +102,7 @@ export class Toolbar extends FoundationElement {
      * @internal
      */
     mouseDownHandler(e) {
-        const activeIndex = this.focusableElements?.findIndex(x => x.contains(e.target));
+        const activeIndex = this.focusableElements.findIndex(x => x.contains(e.target));
         if (activeIndex > -1 && this.activeIndex !== activeIndex) {
             this.setFocusedElement(activeIndex);
         }
@@ -153,7 +159,7 @@ export class Toolbar extends FoundationElement {
             return !e.target.closest("[role=radiogroup]");
         }
         const nextIndex = this.activeIndex + incrementer;
-        if (this.focusableElements[nextIndex]) {
+        if (this.focusableElements.length > 0 && this.focusableElements[nextIndex]) {
             e.preventDefault();
         }
         this.setFocusedElement(nextIndex);
@@ -176,7 +182,7 @@ export class Toolbar extends FoundationElement {
      * @internal
      */
     reduceFocusableElements() {
-        const previousFocusedElement = this.focusableElements?.[this.activeIndex];
+        const previousFocusedElement = this.focusableElements[this.activeIndex];
         this.focusableElements = this.allSlottedItems.reduce(Toolbar.reduceFocusableItems, []);
         // If the previously active item is still focusable, adjust the active index to the
         // index of that item.
@@ -193,7 +199,8 @@ export class Toolbar extends FoundationElement {
     setFocusedElement(activeIndex = this.activeIndex) {
         this.activeIndex = activeIndex;
         this.setFocusableElements();
-        if (this.focusableElements[this.activeIndex] &&
+        if (this.focusableElements.length > 0 &&
+            this.focusableElements[this.activeIndex] &&
             // Don't focus the toolbar element if some event handlers moved
             // the focus on another element in the page.
             this.contains(getRootActiveElement(this))) {

package/dist/fast-foundation.js

@@ -20029,6 +20029,12 @@ class Toolbar extends FoundationElement {
          * @internal
          */
         this.direction = Direction.ltr;
+        /**
+         * The collection of focusable toolbar controls.
+         *
+         * @internal
+         */
+        this.focusableElements = [];
         /**
          * The orientation of the toolbar.
          *
@@ -20049,7 +20055,7 @@ class Toolbar extends FoundationElement {
     }
     set activeIndex(value) {
         if (this.$fastController.isConnected) {
-            this._activeIndex = limit(0, this.focusableElements.length - 1, value);
+            this._activeIndex = limit(0, this.focusableElements.length > 0 ? this.focusableElements.length - 1 : 0, value);
             Observable.notify(this, "activeIndex");
         }
     }
@@ -20064,7 +20070,7 @@ class Toolbar extends FoundationElement {
      * @internal
      */
     mouseDownHandler(e) {
-        const activeIndex = this.focusableElements?.findIndex(x => x.contains(e.target));
+        const activeIndex = this.focusableElements.findIndex(x => x.contains(e.target));
         if (activeIndex > -1 && this.activeIndex !== activeIndex) {
             this.setFocusedElement(activeIndex);
         }
@@ -20121,7 +20127,7 @@ class Toolbar extends FoundationElement {
             return !e.target.closest("[role=radiogroup]");
         }
         const nextIndex = this.activeIndex + incrementer;
-        if (this.focusableElements[nextIndex]) {
+        if (this.focusableElements.length > 0 && this.focusableElements[nextIndex]) {
             e.preventDefault();
         }
         this.setFocusedElement(nextIndex);
@@ -20144,7 +20150,7 @@ class Toolbar extends FoundationElement {
      * @internal
      */
     reduceFocusableElements() {
-        const previousFocusedElement = this.focusableElements?.[this.activeIndex];
+        const previousFocusedElement = this.focusableElements[this.activeIndex];
         this.focusableElements = this.allSlottedItems.reduce(Toolbar.reduceFocusableItems, []);
         // If the previously active item is still focusable, adjust the active index to the
         // index of that item.
@@ -20161,7 +20167,8 @@ class Toolbar extends FoundationElement {
     setFocusedElement(activeIndex = this.activeIndex) {
         this.activeIndex = activeIndex;
         this.setFocusableElements();
-        if (this.focusableElements[this.activeIndex] &&
+        if (this.focusableElements.length > 0 &&
+            this.focusableElements[this.activeIndex] &&
             // Don't focus the toolbar element if some event handlers moved
             // the focus on another element in the page.
             this.contains(getRootActiveElement(this))) {

package/dist/fast-foundation.min.js

@@ -1390,7 +1390,7 @@ const t=function(){if("undefined"!=typeof globalThis)return globalThis;if("undef
             ${Jt(0,e)}
         </div>
     </template>
-`;const Pr=Object.freeze({[Oi.ArrowUp]:{[li]:-1},[Oi.ArrowDown]:{[li]:1},[Oi.ArrowLeft]:{[ai]:{[Si.ltr]:-1,[Si.rtl]:1}},[Oi.ArrowRight]:{[ai]:{[Si.ltr]:1,[Si.rtl]:-1}}});class Mr extends ei{constructor(){super(...arguments),this._activeIndex=0,this.direction=Si.ltr,this.orientation=ai}get activeIndex(){return m.track(this,"activeIndex"),this._activeIndex}set activeIndex(t){this.$fastController.isConnected&&(this._activeIndex=Ri(0,this.focusableElements.length-1,t),m.notify(this,"activeIndex"))}slottedItemsChanged(){this.$fastController.isConnected&&this.reduceFocusableElements()}mouseDownHandler(t){const e=this.focusableElements?.findIndex((e=>e.contains(t.target)));return e>-1&&this.activeIndex!==e&&this.setFocusedElement(e),!0}childItemsChanged(t,e){this.$fastController.isConnected&&this.reduceFocusableElements()}connectedCallback(){super.connectedCallback(),this.direction=Bi(this)}focusinHandler(t){const e=t.relatedTarget;e&&!this.contains(e)&&this.setFocusedElement()}getDirectionalIncrementer(t){return Pr[t]?.[this.orientation]?.[this.direction]??Pr[t]?.[this.orientation]??0}keydownHandler(t){const e=t.key;if(!(e in Oi)||t.defaultPrevented||t.shiftKey)return!0;const i=this.getDirectionalIncrementer(e);if(!i)return!t.target.closest("[role=radiogroup]");const s=this.activeIndex+i;return this.focusableElements[s]&&t.preventDefault(),this.setFocusedElement(s),!0}get allSlottedItems(){return[...this.start.assignedElements(),...this.slottedItems,...this.end.assignedElements()]}reduceFocusableElements(){const t=this.focusableElements?.[this.activeIndex];this.focusableElements=this.allSlottedItems.reduce(Mr.reduceFocusableItems,[]);const e=this.focusableElements.indexOf(t);this.activeIndex=Math.max(0,e),this.setFocusableElements()}setFocusedElement(t=this.activeIndex){this.activeIndex=t,this.setFocusableElements(),this.focusableElements[this.activeIndex]&&this.contains(function(t){const e=t.getRootNode();return e instanceof ShadowRoot?e.activeElement:document.activeElement}(this))&&this.focusableElements[this.activeIndex].focus()}static reduceFocusableItems(t,e){const i="radio"===e.getAttribute("role"),s=e.$fastController?.definition.shadowOptions?.delegatesFocus,o=Array.from(e.shadowRoot?.querySelectorAll("*")??[]).some((t=>_o(t)));return e.hasAttribute("disabled")||e.hasAttribute("hidden")||!(_o(e)||i||s||o)?e.childElementCount?t.concat(Array.from(e.children).reduce(Mr.reduceFocusableItems,[])):t:(t.push(e),t)}setFocusableElements(){this.$fastController.isConnected&&this.focusableElements.length>0&&this.focusableElements.forEach(((t,e)=>{t.tabIndex=this.activeIndex===e?0:-1}))}}oe([f],Mr.prototype,"direction",void 0),oe([lt],Mr.prototype,"orientation",void 0),oe([f],Mr.prototype,"slottedItems",void 0),oe([f],Mr.prototype,"slottedLabel",void 0),oe([f],Mr.prototype,"childItems",void 0);class Vr{}oe([lt({attribute:"aria-labelledby"})],Vr.prototype,"ariaLabelledby",void 0),oe([lt({attribute:"aria-label"})],Vr.prototype,"ariaLabel",void 0),oi(Vr,Vi),oi(Mr,Zt,Vr);const Hr=(t,e)=>K`
+`;const Pr=Object.freeze({[Oi.ArrowUp]:{[li]:-1},[Oi.ArrowDown]:{[li]:1},[Oi.ArrowLeft]:{[ai]:{[Si.ltr]:-1,[Si.rtl]:1}},[Oi.ArrowRight]:{[ai]:{[Si.ltr]:1,[Si.rtl]:-1}}});class Mr extends ei{constructor(){super(...arguments),this._activeIndex=0,this.direction=Si.ltr,this.focusableElements=[],this.orientation=ai}get activeIndex(){return m.track(this,"activeIndex"),this._activeIndex}set activeIndex(t){this.$fastController.isConnected&&(this._activeIndex=Ri(0,this.focusableElements.length>0?this.focusableElements.length-1:0,t),m.notify(this,"activeIndex"))}slottedItemsChanged(){this.$fastController.isConnected&&this.reduceFocusableElements()}mouseDownHandler(t){const e=this.focusableElements.findIndex((e=>e.contains(t.target)));return e>-1&&this.activeIndex!==e&&this.setFocusedElement(e),!0}childItemsChanged(t,e){this.$fastController.isConnected&&this.reduceFocusableElements()}connectedCallback(){super.connectedCallback(),this.direction=Bi(this)}focusinHandler(t){const e=t.relatedTarget;e&&!this.contains(e)&&this.setFocusedElement()}getDirectionalIncrementer(t){return Pr[t]?.[this.orientation]?.[this.direction]??Pr[t]?.[this.orientation]??0}keydownHandler(t){const e=t.key;if(!(e in Oi)||t.defaultPrevented||t.shiftKey)return!0;const i=this.getDirectionalIncrementer(e);if(!i)return!t.target.closest("[role=radiogroup]");const s=this.activeIndex+i;return this.focusableElements.length>0&&this.focusableElements[s]&&t.preventDefault(),this.setFocusedElement(s),!0}get allSlottedItems(){return[...this.start.assignedElements(),...this.slottedItems,...this.end.assignedElements()]}reduceFocusableElements(){const t=this.focusableElements[this.activeIndex];this.focusableElements=this.allSlottedItems.reduce(Mr.reduceFocusableItems,[]);const e=this.focusableElements.indexOf(t);this.activeIndex=Math.max(0,e),this.setFocusableElements()}setFocusedElement(t=this.activeIndex){this.activeIndex=t,this.setFocusableElements(),this.focusableElements.length>0&&this.focusableElements[this.activeIndex]&&this.contains(function(t){const e=t.getRootNode();return e instanceof ShadowRoot?e.activeElement:document.activeElement}(this))&&this.focusableElements[this.activeIndex].focus()}static reduceFocusableItems(t,e){const i="radio"===e.getAttribute("role"),s=e.$fastController?.definition.shadowOptions?.delegatesFocus,o=Array.from(e.shadowRoot?.querySelectorAll("*")??[]).some((t=>_o(t)));return e.hasAttribute("disabled")||e.hasAttribute("hidden")||!(_o(e)||i||s||o)?e.childElementCount?t.concat(Array.from(e.children).reduce(Mr.reduceFocusableItems,[])):t:(t.push(e),t)}setFocusableElements(){this.$fastController.isConnected&&this.focusableElements.length>0&&this.focusableElements.forEach(((t,e)=>{t.tabIndex=this.activeIndex===e?0:-1}))}}oe([f],Mr.prototype,"direction",void 0),oe([lt],Mr.prototype,"orientation",void 0),oe([f],Mr.prototype,"slottedItems",void 0),oe([f],Mr.prototype,"slottedLabel",void 0),oe([f],Mr.prototype,"childItems",void 0);class Vr{}oe([lt({attribute:"aria-labelledby"})],Vr.prototype,"ariaLabelledby",void 0),oe([lt({attribute:"aria-label"})],Vr.prototype,"ariaLabel",void 0),oi(Vr,Vi),oi(Mr,Zt,Vr);const Hr=(t,e)=>K`
         ${zt((t=>t.tooltipVisible),K`
             <${t.tagFor(Ui)}
                 fixed-placement="true"

package/package.json

@@ -2,7 +2,7 @@
   "name": "@ni/fast-foundation",
   "description": "A library of Web Component building blocks",
   "sideEffects": false,
-  "version": "10.2.1",
+  "version": "10.2.2",
   "author": {
     "name": "National Instruments"
   },