@ni/fast-foundation 10.1.4 → 10.1.5

package/dist/esm/horizontal-scroll/horizontal-scroll.template.js

@@ -3,9 +3,7 @@ import { endSlotTemplate, startSlotTemplate } from "../patterns/start-end.js";
 /**
  * @public
  */
-export const horizontalScrollTemplate = (context, definition) => {
-    var _a, _b;
-    return html `
+export const horizontalScrollTemplate = (context, definition) => html `
     <template
         class="horizontal-scroll"
         @keyup="${(x, c) => x.keyupHandler(c.event)}"
@@ -21,9 +19,9 @@ export const horizontalScrollTemplate = (context, definition) => {
                 <div class="content-container" part="content-container" ${ref("content")}>
                     <slot
                         ${slotted({
-        property: "scrollItems",
-        filter: elements(),
-    })}
+    property: "scrollItems",
+    filter: elements(),
+})}
                     ></slot>
                 </div>
             </div>
@@ -36,8 +34,8 @@ export const horizontalScrollTemplate = (context, definition) => {
                         <div class="scroll-action" part="scroll-action-previous">
                             <slot name="previous-flipper">
                                 ${definition.previousFlipper instanceof Function
-        ? definition.previousFlipper(context, definition)
-        : (_a = definition.previousFlipper) !== null && _a !== void 0 ? _a : ""}
+    ? definition.previousFlipper(context, definition)
+    : definition.previousFlipper ?? ""}
                             </slot>
                         </div>
                     </div>
@@ -49,8 +47,8 @@ export const horizontalScrollTemplate = (context, definition) => {
                         <div class="scroll-action" part="scroll-action-next">
                             <slot name="next-flipper">
                                 ${definition.nextFlipper instanceof Function
-        ? definition.nextFlipper(context, definition)
-        : (_b = definition.nextFlipper) !== null && _b !== void 0 ? _b : ""}
+    ? definition.nextFlipper(context, definition)
+    : definition.nextFlipper ?? ""}
                             </slot>
                         </div>
                     </div>
@@ -59,4 +57,3 @@ export const horizontalScrollTemplate = (context, definition) => {
         ${endSlotTemplate(context, definition)}
     </template>
 `;
-};

package/dist/esm/listbox/listbox.element.js

@@ -40,8 +40,7 @@ export class ListboxElement extends Listbox {
      * @internal
      */
     get checkedOptions() {
-        var _a;
-        return (_a = this.options) === null || _a === void 0 ? void 0 : _a.filter(o => o.checked);
+        return this.options?.filter(o => o.checked);
     }
     /**
      * Returns the index of the first selected option.
@@ -60,8 +59,7 @@ export class ListboxElement extends Listbox {
      * @internal
      */
     activeIndexChanged(prev, next) {
-        var _a, _b;
-        this.ariaActiveDescendant = (_b = (_a = this.options[next]) === null || _a === void 0 ? void 0 : _a.id) !== null && _b !== void 0 ? _b : "";
+        this.ariaActiveDescendant = this.options[next]?.id ?? "";
         this.focusAndScrollOptionIntoView();
     }
     /**
@@ -209,11 +207,10 @@ export class ListboxElement extends Listbox {
      * @internal
      */
     clickHandler(e) {
-        var _a;
         if (!this.multiple) {
             return super.clickHandler(e);
         }
-        const captured = (_a = e.target) === null || _a === void 0 ? void 0 : _a.closest(`[role=option]`);
+        const captured = e.target?.closest(`[role=option]`);
         if (!captured || captured.disabled) {
             return;
         }
@@ -346,9 +343,8 @@ export class ListboxElement extends Listbox {
      * @internal
      */
     multipleChanged(prev, next) {
-        var _a;
         this.ariaMultiSelectable = next ? "true" : null;
-        (_a = this.options) === null || _a === void 0 ? void 0 : _a.forEach(o => {
+        this.options?.forEach(o => {
             o.checked = next ? false : undefined;
         });
         this.setSelectedOptions();
@@ -378,8 +374,7 @@ export class ListboxElement extends Listbox {
      * @internal
      */
     sizeChanged(prev, next) {
-        var _a;
-        const size = Math.max(0, parseInt((_a = next === null || next === void 0 ? void 0 : next.toFixed()) !== null && _a !== void 0 ? _a : "", 10));
+        const size = Math.max(0, parseInt(next?.toFixed() ?? "", 10));
         if (size !== next) {
             DOM.queueUpdate(() => {
                 this.size = size;

package/dist/esm/listbox/listbox.js

@@ -66,8 +66,7 @@ export class Listbox extends FoundationElement {
      * @internal
      */
     get firstSelectedOption() {
-        var _a;
-        return (_a = this.selectedOptions[0]) !== null && _a !== void 0 ? _a : null;
+        return this.selectedOptions[0] ?? null;
     }
     /**
      * Returns true if there is one or more selectable option.
@@ -83,8 +82,7 @@ export class Listbox extends FoundationElement {
      * @public
      */
     get length() {
-        var _a, _b;
-        return (_b = (_a = this.options) === null || _a === void 0 ? void 0 : _a.length) !== null && _b !== void 0 ? _b : 0;
+        return this.options?.length ?? 0;
     }
     /**
      * The list of options.
@@ -111,6 +109,19 @@ export class Listbox extends FoundationElement {
     set typeAheadExpired(value) {
         this.typeaheadExpired = value;
     }
+    /**
+     * A static filter to include only selectable options.
+     *
+     * @param n - element to filter
+     * @public
+     */
+    static { this.slottedOptionFilter = (n) => isListboxOption(n) && !n.hidden; }
+    /**
+     * Typeahead timeout in milliseconds.
+     *
+     * @internal
+     */
+    static { this.TYPE_AHEAD_TIMEOUT_MS = 1000; }
     /**
      * Handle click events for listbox options.
      *
@@ -331,12 +342,11 @@ export class Listbox extends FoundationElement {
      * @internal
      */
     selectedIndexChanged(prev, next) {
-        var _a;
         if (!this.hasSelectableOptions) {
             this.selectedIndex = -1;
             return;
         }
-        if (((_a = this.options[this.selectedIndex]) === null || _a === void 0 ? void 0 : _a.disabled) && typeof prev === "number") {
+        if (this.options[this.selectedIndex]?.disabled && typeof prev === "number") {
             const selectableIndex = this.getSelectableIndex(prev, next);
             const newNext = selectableIndex > -1 ? selectableIndex : prev;
             this.selectedIndex = newNext;
@@ -356,9 +366,8 @@ export class Listbox extends FoundationElement {
      * @internal
      */
     selectedOptionsChanged(prev, next) {
-        var _a;
         const filteredNext = next.filter(Listbox.slottedOptionFilter);
-        (_a = this.options) === null || _a === void 0 ? void 0 : _a.forEach(o => {
+        this.options?.forEach(o => {
             const notifier = Observable.getNotifier(o);
             notifier.unsubscribe(this, "selected");
             o.selected = filteredNext.includes(o);
@@ -371,9 +380,8 @@ export class Listbox extends FoundationElement {
      * @public
      */
     selectFirstOption() {
-        var _a, _b;
         if (!this.disabled) {
-            this.selectedIndex = (_b = (_a = this.options) === null || _a === void 0 ? void 0 : _a.findIndex(o => !o.disabled)) !== null && _b !== void 0 ? _b : -1;
+            this.selectedIndex = this.options?.findIndex(o => !o.disabled) ?? -1;
         }
     }
     /**
@@ -412,8 +420,7 @@ export class Listbox extends FoundationElement {
      * @internal
      */
     setDefaultSelectedOption() {
-        var _a, _b;
-        this.selectedIndex = (_b = (_a = this.options) === null || _a === void 0 ? void 0 : _a.findIndex(el => el.defaultSelected)) !== null && _b !== void 0 ? _b : -1;
+        this.selectedIndex = this.options?.findIndex(el => el.defaultSelected) ?? -1;
     }
     /**
      * Sets an option as selected and gives it focus.
@@ -421,10 +428,9 @@ export class Listbox extends FoundationElement {
      * @public
      */
     setSelectedOptions() {
-        var _a, _b, _c;
-        if ((_a = this.options) === null || _a === void 0 ? void 0 : _a.length) {
+        if (this.options?.length) {
             this.selectedOptions = [this.options[this.selectedIndex]];
-            this.ariaActiveDescendant = (_c = (_b = this.firstSelectedOption) === null || _b === void 0 ? void 0 : _b.id) !== null && _c !== void 0 ? _c : "";
+            this.ariaActiveDescendant = this.firstSelectedOption?.id ?? "";
             this.focusAndScrollOptionIntoView();
         }
     }
@@ -477,19 +483,6 @@ export class Listbox extends FoundationElement {
         }
     }
 }
-/**
- * A static filter to include only selectable options.
- *
- * @param n - element to filter
- * @public
- */
-Listbox.slottedOptionFilter = (n) => isListboxOption(n) && !n.hidden;
-/**
- * Typeahead timeout in milliseconds.
- *
- * @internal
- */
-Listbox.TYPE_AHEAD_TIMEOUT_MS = 1000;
 __decorate([
     attr({ mode: "boolean" })
 ], Listbox.prototype, "disabled", void 0);

package/dist/esm/listbox-option/listbox-option.js

@@ -94,15 +94,13 @@ export class ListboxOption extends FoundationElement {
         }
     }
     get label() {
-        var _a;
-        return (_a = this.value) !== null && _a !== void 0 ? _a : this.text;
+        return this.value ?? this.text;
     }
     get text() {
-        var _a, _b;
-        return (_b = (_a = this.textContent) === null || _a === void 0 ? void 0 : _a.replace(/\s+/g, " ").trim()) !== null && _b !== void 0 ? _b : "";
+        return this.textContent?.replace(/\s+/g, " ").trim() ?? "";
     }
     set value(next) {
-        const newValue = `${next !== null && next !== void 0 ? next : ""}`;
+        const newValue = `${next ?? ""}`;
         this._value = newValue;
         this.dirtyValue = true;
         if (this.proxy instanceof HTMLOptionElement) {
@@ -111,9 +109,8 @@ export class ListboxOption extends FoundationElement {
         Observable.notify(this, "value");
     }
     get value() {
-        var _a;
         Observable.track(this, "value");
-        return (_a = this._value) !== null && _a !== void 0 ? _a : this.text;
+        return this._value ?? this.text;
     }
     get form() {
         return this.proxy ? this.proxy.form : null;

package/dist/esm/menu/menu.js

@@ -185,6 +185,7 @@ export class Menu extends FoundationElement {
             this.setItems();
         }
     }
+    static { this.focusableElementRoles = roleForMenuItem; }
     /**
      * @internal
      */
@@ -284,7 +285,6 @@ export class Menu extends FoundationElement {
         }
     }
 }
-Menu.focusableElementRoles = roleForMenuItem;
 __decorate([
     observable
 ], Menu.prototype, "items", void 0);

package/dist/esm/number-field/number-field.js

@@ -57,8 +57,7 @@ export class NumberField extends FormAssociatedNumberField {
      * @internal
      */
     maxChanged(previous, next) {
-        var _a;
-        this.max = Math.max(next, (_a = this.min) !== null && _a !== void 0 ? _a : next);
+        this.max = Math.max(next, this.min ?? next);
         const min = Math.min(this.min, this.max);
         if (this.min !== undefined && this.min !== min) {
             this.min = min;
@@ -74,8 +73,7 @@ export class NumberField extends FormAssociatedNumberField {
      * @internal
      */
     minChanged(previous, next) {
-        var _a;
-        this.min = Math.min(next, (_a = this.max) !== null && _a !== void 0 ? _a : next);
+        this.min = Math.min(next, this.max ?? next);
         const max = Math.max(this.min, this.max);
         if (this.max !== undefined && this.max !== max) {
             this.max = max;

package/dist/esm/picker/picker-list-item.js

@@ -52,14 +52,13 @@ export class PickerListItem extends FoundationElement {
         this.$emit("pickeriteminvoked");
     }
     updateView() {
-        var _a, _b;
         this.disconnectView();
         this.customView =
-            (_b = (_a = this.contentsTemplate) === null || _a === void 0 ? void 0 : _a.render(this, this)) !== null && _b !== void 0 ? _b : defaultContentsTemplate.render(this, this);
+            this.contentsTemplate?.render(this, this) ??
+                defaultContentsTemplate.render(this, this);
     }
     disconnectView() {
-        var _a;
-        (_a = this.customView) === null || _a === void 0 ? void 0 : _a.dispose();
+        this.customView?.dispose();
         this.customView = undefined;
     }
 }

package/dist/esm/picker/picker-menu-option.js

@@ -42,14 +42,13 @@ export class PickerMenuOption extends FoundationElement {
         this.$emit("pickeroptioninvoked");
     }
     updateView() {
-        var _a, _b;
         this.disconnectView();
         this.customView =
-            (_b = (_a = this.contentsTemplate) === null || _a === void 0 ? void 0 : _a.render(this, this)) !== null && _b !== void 0 ? _b : defaultContentsTemplate.render(this, this);
+            this.contentsTemplate?.render(this, this) ??
+                defaultContentsTemplate.render(this, this);
     }
     disconnectView() {
-        var _a;
-        (_a = this.customView) === null || _a === void 0 ? void 0 : _a.dispose();
+        this.customView?.dispose();
         this.customView = undefined;
     }
 }

package/dist/esm/picker/picker.js

@@ -583,12 +583,11 @@ export class Picker extends FormAssociatedPicker {
      * Disables the menu. Note that the menu can be open, just doens't have any valid options on display.
      */
     disableMenu() {
-        var _a, _b, _c;
         this.menuFocusIndex = -1;
         this.menuFocusOptionId = undefined;
-        (_a = this.inputElement) === null || _a === void 0 ? void 0 : _a.removeAttribute("aria-activedescendant");
-        (_b = this.inputElement) === null || _b === void 0 ? void 0 : _b.removeAttribute("aria-owns");
-        (_c = this.inputElement) === null || _c === void 0 ? void 0 : _c.removeAttribute("aria-expanded");
+        this.inputElement?.removeAttribute("aria-activedescendant");
+        this.inputElement?.removeAttribute("aria-owns");
+        this.inputElement?.removeAttribute("aria-expanded");
     }
     /**
      * Sets the currently focused menu option by index
@@ -623,17 +622,15 @@ export class Picker extends FormAssociatedPicker {
      * Updates the template used for the list item repeat behavior
      */
     updateListItemTemplate() {
-        var _a;
         this.activeListItemTemplate =
-            (_a = this.listItemTemplate) !== null && _a !== void 0 ? _a : this.defaultListItemTemplate;
+            this.listItemTemplate ?? this.defaultListItemTemplate;
     }
     /**
      * Updates the template used for the menu option repeat behavior
      */
     updateOptionTemplate() {
-        var _a;
         this.activeMenuOptionTemplate =
-            (_a = this.menuOptionTemplate) !== null && _a !== void 0 ? _a : this.defaultMenuOptionTemplate;
+            this.menuOptionTemplate ?? this.defaultMenuOptionTemplate;
     }
     /**
      * Updates the filtered options array
@@ -655,7 +652,13 @@ export class Picker extends FormAssociatedPicker {
         if (newConfig === null) {
             newConfig = FlyoutPosBottomFill;
         }
-        this.menuConfig = Object.assign(Object.assign({}, newConfig), { autoUpdateMode: "auto", fixedPlacement: true, horizontalViewportLock: false, verticalViewportLock: false });
+        this.menuConfig = {
+            ...newConfig,
+            autoUpdateMode: "auto",
+            fixedPlacement: true,
+            horizontalViewportLock: false,
+            verticalViewportLock: false,
+        };
     }
 }
 __decorate([

package/dist/esm/radio/radio.js

@@ -24,13 +24,12 @@ export class Radio extends FormAssociatedRadio {
      * @internal
      */
     defaultCheckedChanged() {
-        var _a;
         if (this.$fastController.isConnected && !this.dirtyChecked) {
             // Setting this.checked will cause us to enter a dirty state,
             // but if we are clean when defaultChecked is changed, we want to stay
             // in a clean state, so reset this.dirtyChecked
             if (!this.isInsideRadioGroup()) {
-                this.checked = (_a = this.defaultChecked) !== null && _a !== void 0 ? _a : false;
+                this.checked = this.defaultChecked ?? false;
                 this.dirtyChecked = false;
             }
         }
@@ -63,10 +62,9 @@ export class Radio extends FormAssociatedRadio {
      * @internal
      */
     connectedCallback() {
-        var _a, _b;
         super.connectedCallback();
         this.validate();
-        if (((_a = this.parentElement) === null || _a === void 0 ? void 0 : _a.getAttribute("role")) !== "radiogroup" &&
+        if (this.parentElement?.getAttribute("role") !== "radiogroup" &&
             this.getAttribute("tabindex") === null) {
             if (!this.disabled) {
                 this.setAttribute("tabindex", "0");
@@ -78,7 +76,7 @@ export class Radio extends FormAssociatedRadio {
                 // but if we are clean when defaultChecked is changed, we want to stay
                 // in a clean state, so reset this.dirtyChecked
                 if (!this.isInsideRadioGroup()) {
-                    this.checked = (_b = this.defaultChecked) !== null && _b !== void 0 ? _b : false;
+                    this.checked = this.defaultChecked ?? false;
                     this.dirtyChecked = false;
                 }
             }

package/dist/esm/radio-group/radio-group.js

@@ -63,12 +63,10 @@ export class RadioGroup extends FoundationElement {
             radio.focus();
         };
         this.moveRightOffGroup = () => {
-            var _a;
-            (_a = this.nextElementSibling) === null || _a === void 0 ? void 0 : _a.focus();
+            this.nextElementSibling?.focus();
         };
         this.moveLeftOffGroup = () => {
-            var _a;
-            (_a = this.previousElementSibling) === null || _a === void 0 ? void 0 : _a.focus();
+            this.previousElementSibling?.focus();
         };
         /**
          * @internal
@@ -294,12 +292,10 @@ export class RadioGroup extends FoundationElement {
         return this.closest('[role="toolbar"]');
     }
     get isInsideToolbar() {
-        var _a;
-        return ((_a = this.parentToolbar) !== null && _a !== void 0 ? _a : false);
+        return (this.parentToolbar ?? false);
     }
     get isInsideFoundationToolbar() {
-        var _a;
-        return !!((_a = this.parentToolbar) === null || _a === void 0 ? void 0 : _a["$fastController"]);
+        return !!this.parentToolbar?.["$fastController"];
     }
     /**
      * @internal

package/dist/esm/select/select.js

@@ -98,17 +98,16 @@ export class Select extends FormAssociatedSelect {
         return this._value;
     }
     set value(next) {
-        var _a, _b, _c, _d, _e, _f, _g;
         const prev = `${this._value}`;
-        if ((_a = this._options) === null || _a === void 0 ? void 0 : _a.length) {
+        if (this._options?.length) {
             const selectedIndex = this._options.findIndex(el => el.value === next);
-            const prevSelectedValue = (_c = (_b = this._options[this.selectedIndex]) === null || _b === void 0 ? void 0 : _b.value) !== null && _c !== void 0 ? _c : null;
-            const nextSelectedValue = (_e = (_d = this._options[selectedIndex]) === null || _d === void 0 ? void 0 : _d.value) !== null && _e !== void 0 ? _e : null;
+            const prevSelectedValue = this._options[this.selectedIndex]?.value ?? null;
+            const nextSelectedValue = this._options[selectedIndex]?.value ?? null;
             if (selectedIndex === -1 || prevSelectedValue !== nextSelectedValue) {
                 next = "";
                 this.selectedIndex = selectedIndex;
             }
-            next = (_g = (_f = this.firstSelectedOption) === null || _f === void 0 ? void 0 : _f.value) !== null && _g !== void 0 ? _g : next;
+            next = this.firstSelectedOption?.value ?? next;
         }
         if (prev !== next) {
             this._value = next;
@@ -125,9 +124,8 @@ export class Select extends FormAssociatedSelect {
      * @internal
      */
     updateValue(shouldEmit) {
-        var _a, _b;
         if (this.$fastController.isConnected) {
-            this.value = (_b = (_a = this.firstSelectedOption) === null || _a === void 0 ? void 0 : _a.value) !== null && _b !== void 0 ? _b : "";
+            this.value = this.firstSelectedOption?.value ?? "";
         }
         if (shouldEmit) {
             this.$emit("input");
@@ -179,9 +177,8 @@ export class Select extends FormAssociatedSelect {
      * @public
      */
     get displayValue() {
-        var _a, _b;
         Observable.track(this, "displayValue");
-        return (_b = (_a = this.firstSelectedOption) === null || _a === void 0 ? void 0 : _a.text) !== null && _b !== void 0 ? _b : "";
+        return this.firstSelectedOption?.text ?? "";
     }
     /**
      * Synchronize the `aria-disabled` property when the `disabled` property changes.
@@ -242,7 +239,6 @@ export class Select extends FormAssociatedSelect {
      * @internal
      */
     focusoutHandler(e) {
-        var _a;
         super.focusoutHandler(e);
         if (!this.open) {
             return true;
@@ -252,7 +248,7 @@ export class Select extends FormAssociatedSelect {
             this.focus();
             return;
         }
-        if (!((_a = this.options) === null || _a === void 0 ? void 0 : _a.includes(focusTarget))) {
+        if (!this.options?.includes(focusTarget)) {
             this.open = false;
             if (this.indexWhenOpened !== this.selectedIndex) {
                 this.updateValue(true);
@@ -304,8 +300,7 @@ export class Select extends FormAssociatedSelect {
      * @internal
      */
     mousedownHandler(e) {
-        var _a;
-        if (e.offsetX >= 0 && e.offsetX <= ((_a = this.listbox) === null || _a === void 0 ? void 0 : _a.scrollWidth)) {
+        if (e.offsetX >= 0 && e.offsetX <= this.listbox?.scrollWidth) {
             return super.mousedownHandler(e);
         }
         return this.collapsible;
@@ -332,11 +327,9 @@ export class Select extends FormAssociatedSelect {
      * @internal
      */
     selectedOptionsChanged(prev, next) {
-        var _a;
         super.selectedOptionsChanged(prev, next);
-        (_a = this.options) === null || _a === void 0 ? void 0 : _a.forEach((o, i) => {
-            var _a;
-            const proxyOption = (_a = this.proxy) === null || _a === void 0 ? void 0 : _a.options.item(i);
+        this.options?.forEach((o, i) => {
+            const proxyOption = this.proxy?.options.item(i);
             if (proxyOption) {
                 proxyOption.selected = o.selected;
             }
@@ -350,9 +343,8 @@ export class Select extends FormAssociatedSelect {
      * @internal
      */
     setDefaultSelectedOption() {
-        var _a;
-        const options = (_a = this.options) !== null && _a !== void 0 ? _a : Array.from(this.children).filter(Listbox.slottedOptionFilter);
-        const selectedIndex = options === null || options === void 0 ? void 0 : options.findIndex(el => el.hasAttribute("selected") || el.selected || el.value === this.value);
+        const options = this.options ?? Array.from(this.children).filter(Listbox.slottedOptionFilter);
+        const selectedIndex = options?.findIndex(el => el.hasAttribute("selected") || el.selected || el.value === this.value);
         if (selectedIndex !== -1) {
             this.selectedIndex = selectedIndex;
             return;

package/dist/esm/tabs/tabs.js

@@ -273,14 +273,12 @@ export class Tabs extends FoundationElement {
     }
     getTabIds() {
         return this.tabs.map((tab) => {
-            var _a;
-            return (_a = tab.getAttribute("id")) !== null && _a !== void 0 ? _a : `tab-${uniqueId()}`;
+            return tab.getAttribute("id") ?? `tab-${uniqueId()}`;
         });
     }
     getTabPanelIds() {
         return this.tabpanels.map((tabPanel) => {
-            var _a;
-            return (_a = tabPanel.getAttribute("id")) !== null && _a !== void 0 ? _a : `panel-${uniqueId()}`;
+            return tabPanel.getAttribute("id") ?? `panel-${uniqueId()}`;
         });
     }
     setComponent() {