npm - @ni/nimble-components - Versions diffs - 29.7.0 → 29.7.2 - Mend

@ni/nimble-components 29.7.0 → 29.7.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (20) hide show

package/dist/all-components-bundle.js +33 -28
package/dist/all-components-bundle.js.map +1 -1
package/dist/all-components-bundle.min.js +31 -9
package/dist/all-components-bundle.min.js.map +1 -1
package/dist/esm/combobox/index.d.ts +3 -6
package/dist/esm/combobox/index.js +4 -12
package/dist/esm/combobox/index.js.map +1 -1
package/dist/esm/combobox/template.js +1 -0
package/dist/esm/combobox/template.js.map +1 -1
package/dist/esm/patterns/dropdown/styles.js +22 -2
package/dist/esm/patterns/dropdown/styles.js.map +1 -1
package/dist/esm/select/index.d.ts +2 -4
package/dist/esm/select/index.js +4 -13
package/dist/esm/select/index.js.map +1 -1
package/dist/esm/select/template.js +1 -0
package/dist/esm/select/template.js.map +1 -1
package/dist/esm/select/testing/select.pageobject.d.ts +12 -0
package/dist/esm/select/testing/select.pageobject.js +20 -4
package/dist/esm/select/testing/select.pageobject.js.map +1 -1
package/package.json +2 -2

package/dist/esm/combobox/index.d.ts CHANGED Viewed

@@ -1,8 +1,7 @@
 import { ComboboxAutocomplete, SelectPosition, ListboxOption, DelegatesARIACombobox, StartEnd } from '@microsoft/fast-foundation';
 import { ToggleButton } from '../toggle-button';
 import type { ErrorPattern } from '../patterns/error/types';
-import type { DropdownPattern } from '../patterns/dropdown/types';
-import { DropdownAppearance } from '../patterns/dropdown/types';
+import { DropdownAppearance, type DropdownPattern } from '../patterns/dropdown/types';
 import type { AnchoredRegion } from '../anchored-region';
 import { FormAssociatedCombobox } from './models/combobox-form-associated';
 declare global {
@@ -87,11 +86,11 @@ export declare class Combobox extends FormAssociatedCombobox implements Dropdown
      */
     listboxId: string;
     /**
-     * The max height for the listbox when opened.
+     * The space available in the viewport for the listbox when opened.
      *
      * @internal
      */
-    maxHeight: number;
+    availableViewportHeight: number;
     private valueUpdatedByInput;
     private valueBeforeTextUpdate?;
     private _value;
@@ -197,7 +196,6 @@ export declare class Combobox extends FormAssociatedCombobox implements Dropdown
     private regionChanged;
     private controlWrapperChanged;
     private ariaLabelChanged;
-    private maxHeightChanged;
     /**
      * Sets the value and to match the first selected option.
      */
@@ -215,7 +213,6 @@ export declare class Combobox extends FormAssociatedCombobox implements Dropdown
      * Determines if a value update should involve emitting a change event, then updates the value.
      */
     private syncValue;
-    private updateListboxMaxHeightCssVariable;
     private updateInputAriaLabel;
     /**
      * This will only emit a `change` event after text entry where the text in the input prior to

package/dist/esm/combobox/index.js CHANGED Viewed

@@ -35,11 +35,11 @@ export class Combobox extends FormAssociatedCombobox {
          */
         this.listboxId = uniqueId('listbox-');
         /**
-         * The max height for the listbox when opened.
+         * The space available in the viewport for the listbox when opened.
          *
          * @internal
          */
-        this.maxHeight = 0;
+        this.availableViewportHeight = 0;
         this.valueUpdatedByInput = false;
         this._value = '';
         this.filter = '';
@@ -422,7 +422,7 @@ export class Combobox extends FormAssociatedCombobox {
         this.positionAttribute = this.forcedPosition
             ? this.positionAttribute
             : this.position;
-        this.maxHeight = this.position === SelectPosition.above
+        this.availableViewportHeight = this.position === SelectPosition.above
             ? Math.trunc(currentBox.top)
             : Math.trunc(availableBottom);
     }
@@ -500,9 +500,6 @@ export class Combobox extends FormAssociatedCombobox {
     ariaLabelChanged(_oldValue, _newValue) {
         this.updateInputAriaLabel();
     }
-    maxHeightChanged() {
-        this.updateListboxMaxHeightCssVariable();
-    }
     /**
      * Sets the value and to match the first selected option.
      */
@@ -546,11 +543,6 @@ export class Combobox extends FormAssociatedCombobox {
             : this.control.value;
         this.updateValue(this.value !== newValue);
     }
-    updateListboxMaxHeightCssVariable() {
-        if (this.listbox) {
-            this.listbox.style.setProperty('--ni-private-select-max-height', `${this.maxHeight}px`);
-        }
-    }
     updateInputAriaLabel() {
         const inputElement = this.shadowRoot?.querySelector('.selected-value');
         if (this.ariaLabel) {
@@ -623,7 +615,7 @@ __decorate([
 ], Combobox.prototype, "hasOverflow", void 0);
 __decorate([
     observable
-], Combobox.prototype, "maxHeight", void 0);
+], Combobox.prototype, "availableViewportHeight", void 0);
 const nimbleCombobox = Combobox.compose({
     baseName: 'combobox',
     baseClass: FormAssociatedCombobox,

package/dist/esm/combobox/index.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/combobox/index.ts"],"names":[],"mappings":"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","sourcesContent":["import {\n DOM,\n Observable,\n attr,\n html,\n observable,\n ref\n} from '@microsoft/fast-element';\nimport {\n DesignSystem,\n ComboboxOptions,\n ComboboxAutocomplete,\n SelectPosition,\n ListboxOption,\n DelegatesARIACombobox,\n applyMixins,\n StartEnd\n} from '@microsoft/fast-foundation';\nimport {\n keyArrowDown,\n keyArrowUp,\n keyEnter,\n keyEscape,\n keySpace,\n keyTab,\n limit,\n uniqueId\n} from '@microsoft/fast-web-utilities';\nimport { ToggleButton, toggleButtonTag } from '../toggle-button';\nimport { errorTextTemplate } from '../patterns/error/template';\nimport { iconArrowExpanderDownTag } from '../icons/arrow-expander-down';\nimport { iconExclamationMarkTag } from '../icons/exclamation-mark';\n\nimport { styles } from './styles';\nimport type { ErrorPattern } from '../patterns/error/types';\nimport type { DropdownPattern } from '../patterns/dropdown/types';\nimport { DropdownAppearance } from '../patterns/dropdown/types';\nimport type { AnchoredRegion } from '../anchored-region';\nimport { template } from './template';\nimport { FormAssociatedCombobox } from './models/combobox-form-associated';\nimport type { ListOption } from '../list-option';\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'nimble-combobox': Combobox;\n }\n}\n\n/*\n A nimble-styed HTML combobox\n /\nexport class Combobox\n extends FormAssociatedCombobox\n implements DropdownPattern, ErrorPattern {\n @attr\n public appearance: DropdownAppearance = DropdownAppearance.underline;\n\n /\n A message explaining why the value is invalid.\n /\n @attr({ attribute: 'error-text' })\n public errorText?: string;\n\n @attr({ attribute: 'error-visible', mode: 'boolean' })\n public errorVisible = false;\n\n /\n The autocomplete attribute.\n /\n @attr({ attribute: 'autocomplete', mode: 'fromView' })\n public autocomplete?: ComboboxAutocomplete;\n\n /\n The placement for the listbox when the combobox is open.\n /\n @attr({ attribute: 'position' })\n public positionAttribute?: SelectPosition;\n\n /\n The open attribute.\n /\n @attr({ attribute: 'open', mode: 'boolean' })\n public open = false;\n\n /\n Sets the placeholder value of the element, generally used to provide a hint to the user.\n * @remarks Using a non-null assertion to mimic FAST's original improper typing of an\n * uninitialized property:\n * https://github.com/microsoft/fast/blob/0c27d027ff6e8616ad4fddc17f4432aa7f6cbad0/packages/web-components/fast-foundation/src/combobox/combobox.ts#L199\n /\n @attr\n public placeholder!: string;\n\n /\n The current state of the calculated position of the listbox.\n \n @public\n /\n @observable\n public position?: SelectPosition;\n\n /\n @internal\n /\n @observable\n public region?: AnchoredRegion;\n\n /\n @internal\n /\n @observable\n public controlWrapper!: HTMLElement;\n\n /\n @internal\n /\n @observable\n public control!: HTMLInputElement;\n\n /\n @internal\n /\n @observable\n public listbox!: HTMLDivElement;\n\n /\n @internal\n /\n @observable\n public readonly dropdownButton?: ToggleButton;\n\n /\n The collection of currently filtered options.\n /\n public filteredOptions: ListboxOption[] = [];\n\n /* @internal /\n @observable\n public hasOverflow = false;\n\n public override get value(): string {\n Observable.track(this, 'value');\n return this._value;\n }\n\n public override set value(next: string) {\n const prev = `${this._value}`;\n let updatedValue = next;\n\n if (this.$fastController.isConnected && this.options) {\n const selectedIndex = this.options.findIndex(\n el => el.text.toLowerCase() === next.toLowerCase()\n );\n\n const prevSelectedValue = this.options[this.selectedIndex]?.text;\n const nextSelectedValue = this.options[selectedIndex]?.text;\n\n this.selectedIndex = prevSelectedValue !== nextSelectedValue\n ? selectedIndex\n : this.selectedIndex;\n\n updatedValue = this.firstSelectedOption?.text \|\| next;\n }\n\n if (prev !== updatedValue) {\n this._value = updatedValue;\n super.valueChanged(prev, updatedValue);\n Observable.notify(this, 'value');\n }\n\n // Can remove when following resolved: https://github.com/microsoft/fast/issues/6749\n this.filter = next;\n this.filterOptions();\n this.selectedIndex = this.options\n .map(option => option.text)\n .indexOf(this.value);\n }\n\n /\n The list of options.\n \n Overrides `Listbox.options`.\n /\n public override get options(): ListboxOption[] {\n Observable.track(this, 'options');\n return this.filteredOptions?.length\n ? this.filteredOptions\n : this._options;\n }\n\n public override set options(value: ListboxOption[]) {\n this._options = value;\n Observable.notify(this, 'options');\n }\n\n /\n The unique id for the internal listbox element.\n \n @internal\n /\n public listboxId: string = uniqueId('listbox-');\n\n /\n The max height for the listbox when opened.\n \n @internal\n /\n @observable\n public maxHeight = 0;\n\n private valueUpdatedByInput = false;\n private valueBeforeTextUpdate?: string;\n private _value = '';\n private filter = '';\n\n /\n The initial state of the position attribute.\n /\n private forcedPosition = false;\n\n private get isAutocompleteInline(): boolean {\n return (\n this.autocomplete === ComboboxAutocomplete.inline\n \|\| this.isAutocompleteBoth\n );\n }\n\n private get isAutocompleteList(): boolean {\n return (\n this.autocomplete === ComboboxAutocomplete.list\n \|\| this.isAutocompleteBoth\n );\n }\n\n private get isAutocompleteBoth(): boolean {\n return this.autocomplete === ComboboxAutocomplete.both;\n }\n\n public override slottedOptionsChanged(\n prev: HTMLElement[],\n next: HTMLElement[]\n ): void {\n // Workaround for https://github.com/microsoft/fast/issues/5773\n const value = this.value;\n super.slottedOptionsChanged(prev, next);\n this.updateValue();\n if (value) {\n this.value = value;\n }\n }\n\n public override connectedCallback(): void {\n super.connectedCallback();\n this.forcedPosition = !!this.positionAttribute;\n if (this.value) {\n this.initialValue = this.value;\n }\n this.setPositioning();\n this.updateInputAriaLabel();\n }\n\n /\n @internal\n /\n public override clickHandler(e: MouseEvent): boolean {\n if (this.disabled) {\n return false;\n }\n\n if (this.open) {\n const captured = (e.target as HTMLElement).closest<ListOption>(\n 'option,[role=option]'\n );\n\n if (!captured \|\| captured.disabled) {\n return false;\n }\n\n this.selectedOptions = [captured];\n this.control.value = captured.text;\n this.clearSelectionRange();\n this.updateValue(true);\n }\n\n this.open = !this.open;\n\n if (this.open) {\n this.control.focus();\n }\n\n return true;\n }\n\n /\n @internal\n /\n public toggleButtonClickHandler(e: Event): void {\n e.stopImmediatePropagation();\n }\n\n /\n @internal\n /\n public toggleButtonChangeHandler(e: Event): void {\n this.open = this.dropdownButton!.checked;\n e.stopImmediatePropagation();\n }\n\n /\n @internal\n /\n public toggleButtonKeyDownHandler(e: KeyboardEvent): boolean {\n switch (e.key) {\n case keyArrowUp:\n case keyArrowDown:\n case keySpace:\n case keyEnter:\n this.open = true;\n this.stopPropagation(e);\n return false;\n default:\n return true;\n }\n }\n\n /\n @internal\n /\n public filterOptions(): void {\n if (\n !this.autocomplete\n \|\| this.autocomplete === ComboboxAutocomplete.none\n ) {\n this.filter = '';\n }\n\n const filter = this.filter.toLowerCase();\n\n this.filteredOptions = this._options.filter(o => o.text.toLowerCase().startsWith(filter));\n\n if (this.isAutocompleteList) {\n if (!this.filteredOptions.length && !filter) {\n this.filteredOptions = this._options;\n }\n\n this._options.forEach(o => {\n (o as ListOption).visuallyHidden = !this.filteredOptions.includes(o);\n });\n }\n\n const enabledOptions = this.filteredOptions.filter(o => !o.disabled);\n this.filteredOptions = enabledOptions;\n }\n\n /\n @internal\n /\n public inputHandler(e: InputEvent): boolean {\n this.filter = this.control.value;\n this.filterOptions();\n\n if (!this.isAutocompleteInline) {\n this.selectedIndex = this.options\n .map(option => option.text)\n .indexOf(this.control.value);\n }\n\n if (!(e.inputType.includes('deleteContent') \|\| !this.filter.length)) {\n if (this.isAutocompleteList && !this.open) {\n this.open = true;\n }\n\n if (this.isAutocompleteInline) {\n if (this.filteredOptions.length) {\n this.selectedOptions = [this.filteredOptions[0]!];\n this.selectedIndex = this.options.indexOf(\n this.firstSelectedOption\n );\n this.setInlineSelection();\n } else {\n this.selectedIndex = -1;\n }\n }\n }\n\n // This is a workaround for the issue described here: https://github.com/microsoft/fast/issues/6267\n // For now, we will update the value ourselves while a user types in text. Note that there is other\n // implementation related to this (like the 'keydownEventHandler') needed to create the complete set\n // of desired behavior described in the issue noted above.\n if (!this.valueUpdatedByInput) {\n this.valueBeforeTextUpdate = this.value;\n }\n this.valueUpdatedByInput = true;\n\n // This is a workaround for this FAST issue: https://github.com/microsoft/fast/issues/6776\n if (this.value !== this.control.value) {\n this.focusAndScrollOptionIntoView();\n }\n\n this.value = this.control.value;\n return true;\n }\n\n public override keydownHandler(e: KeyboardEvent): boolean {\n if (e.ctrlKey \|\| e.altKey) {\n return true;\n }\n\n switch (e.key) {\n case keyEnter:\n this.syncValue();\n if (this.isAutocompleteInline) {\n this.filter = this.value;\n }\n\n this.open = false;\n this.clearSelectionRange();\n this.emitChangeIfValueUpdated();\n break;\n case keyEscape:\n if (!this.isAutocompleteInline) {\n this.selectedIndex = -1;\n }\n\n if (this.open) {\n this.open = false;\n break;\n }\n\n this.value = '';\n this.control.value = '';\n this.filter = '';\n this.filterOptions();\n break;\n case keyTab:\n this.setInputToSelection();\n\n if (!this.open) {\n return true;\n }\n\n e.preventDefault();\n this.open = false;\n break;\n case keyArrowDown:\n case keyArrowUp:\n this.filterOptions();\n\n if (!this.open) {\n this.open = true;\n break;\n }\n\n if (this.filteredOptions.length > 0) {\n super.keydownHandler(e);\n }\n\n if (this.isAutocompleteInline) {\n this.setInlineSelection();\n }\n\n if (this.open && this.valueUpdatedByInput) {\n this.valueUpdatedByInput = false;\n }\n break;\n default:\n return true;\n }\n return true;\n }\n\n /\n @internal\n /\n public keyupHandler(e: KeyboardEvent): boolean {\n const key = e.key;\n\n switch (key) {\n case 'ArrowLeft':\n case 'ArrowRight':\n case 'Backspace':\n case 'Delete':\n case 'Home':\n case 'End': {\n this.filter = this.control.value;\n this.selectedIndex = -1;\n this.filterOptions();\n break;\n }\n default: {\n break;\n }\n }\n\n return true;\n }\n\n /\n @internal\n /\n public override focusoutHandler(e: FocusEvent): boolean {\n this.syncValue();\n\n if (this.open) {\n const focusTarget = e.relatedTarget as HTMLElement;\n if (this.isSameNode(focusTarget)) {\n this.focus();\n }\n }\n\n this.open = false;\n this.emitChangeIfValueUpdated();\n return true;\n }\n\n /\n Reset the element to its first selectable option when its parent form is reset.\n \n @internal\n /\n public override formResetCallback(): void {\n super.formResetCallback();\n this.setDefaultSelectedOption();\n this.updateValue();\n }\n\n /* {@inheritDoc (FormAssociated:interface).validate} /\n public override validate(): void {\n super.validate(this.control);\n }\n\n /\n Set the default selected options at initialization or reset.\n \n @internal\n * @remarks\n * Overrides `Listbox.setDefaultSelectedOption`\n /\n public override setDefaultSelectedOption(): void {\n if (this.$fastController.isConnected && this.options) {\n const selectedIndex = this.options.findIndex(\n el => el.getAttribute('selected') !== null \|\| el.selected\n );\n\n this.selectedIndex = selectedIndex;\n if (!this.dirtyValue && this.firstSelectedOption) {\n this.value = this.firstSelectedOption.text;\n }\n this.setSelectedOptions();\n }\n }\n\n /\n @internal\n /\n public override selectedIndexChanged(\n prev: number \| undefined,\n next: number\n ): void {\n if (this.$fastController.isConnected) {\n const pinnedSelectedIndex = limit(\n -1,\n this.options.length - 1,\n next\n );\n\n // we only want to call the super method when the selectedIndex is in range\n if (pinnedSelectedIndex !== this.selectedIndex) {\n this.selectedIndex = pinnedSelectedIndex;\n return;\n }\n\n super.selectedIndexChanged(prev, pinnedSelectedIndex);\n }\n }\n\n /\n Synchronize the `aria-disabled` property when the `disabled` property changes.\n \n @internal\n /\n public override disabledChanged(prev: boolean, next: boolean): void {\n if (super.disabledChanged) {\n super.disabledChanged(prev, next);\n }\n this.ariaDisabled = this.disabled ? 'true' : 'false';\n }\n\n /\n Move focus to the previous selectable option.\n \n @internal\n * @remarks\n * Overrides `Listbox.selectPreviousOption`\n /\n public override selectPreviousOption(): void {\n if (!this.disabled && this.selectedIndex >= 0) {\n this.selectedIndex -= 1;\n }\n }\n\n /\n @internal\n /\n public setPositioning(): void {\n // Workaround for https://github.com/microsoft/fast/issues/5123\n if (!this.$fastController.isConnected) {\n // Don't call setPositioning() until we're connected,\n // since this.forcedPosition isn't initialized yet.\n return;\n }\n const currentBox = this.getBoundingClientRect();\n const viewportHeight = window.innerHeight;\n const availableBottom = viewportHeight - currentBox.bottom;\n\n if (this.forcedPosition) {\n this.position = this.positionAttribute;\n } else if (currentBox.top > availableBottom) {\n this.position = SelectPosition.above;\n } else {\n this.position = SelectPosition.below;\n }\n\n this.positionAttribute = this.forcedPosition\n ? this.positionAttribute\n : this.position;\n\n this.maxHeight = this.position === SelectPosition.above\n ? Math.trunc(currentBox.top)\n : Math.trunc(availableBottom);\n }\n\n /\n Focus the control and scroll the first selected option into view.\n \n @internal\n * @remarks\n * Overrides: `Listbox.focusAndScrollOptionIntoView`\n /\n protected override focusAndScrollOptionIntoView(): void {\n if (this.open) {\n if (this.contains(document.activeElement)) {\n this.control.focus();\n if (this.firstSelectedOption) {\n requestAnimationFrame(() => {\n this.firstSelectedOption?.scrollIntoView({\n block: 'nearest'\n });\n });\n }\n }\n }\n }\n\n protected openChanged(): void {\n if (this.open) {\n this.ariaControls = this.listboxId;\n this.ariaExpanded = 'true';\n\n this.setPositioning();\n this.focusAndScrollOptionIntoView();\n\n // focus is directed to the element when `open` is changed programmatically\n DOM.queueUpdate(() => this.focus());\n } else {\n this.ariaControls = '';\n this.ariaExpanded = 'false';\n }\n\n if (this.dropdownButton) {\n this.dropdownButton.checked = this.open;\n }\n }\n\n protected placeholderChanged(): void {\n if (this.proxy instanceof HTMLInputElement) {\n this.proxy.placeholder = this.placeholder ?? '';\n }\n }\n\n /\n Ensure that the entire list of options is used when setting the selected property.\n * @internal\n * @remarks\n * Overrides: `Listbox.selectedOptionsChanged`\n /\n protected override selectedOptionsChanged(\n _: ListboxOption[] \| undefined,\n next: ListboxOption[]\n ): void {\n if (this.$fastController.isConnected) {\n this._options.forEach(o => {\n o.selected = next.includes(o);\n });\n }\n }\n\n protected positionChanged(\n _: SelectPosition \| undefined,\n next: SelectPosition \| undefined\n ): void {\n this.positionAttribute = next;\n this.setPositioning();\n }\n\n private regionChanged(\n _prev: AnchoredRegion \| undefined,\n _next: AnchoredRegion \| undefined\n ): void {\n if (this.region && this.controlWrapper) {\n this.region.anchorElement = this.controlWrapper;\n }\n }\n\n private controlWrapperChanged(\n _prev: HTMLElement \| undefined,\n _next: HTMLElement \| undefined\n ): void {\n if (this.region && this.controlWrapper) {\n this.region.anchorElement = this.controlWrapper;\n }\n }\n\n // Workaround for https://github.com/microsoft/fast/issues/6041.\n private ariaLabelChanged(_oldValue: string, _newValue: string): void {\n this.updateInputAriaLabel();\n }\n\n private maxHeightChanged(): void {\n this.updateListboxMaxHeightCssVariable();\n }\n\n /\n Sets the value and to match the first selected option.\n /\n private updateValue(shouldEmit?: boolean): void {\n if (this.$fastController.isConnected) {\n this.value = this.firstSelectedOption?.text \|\| this.control.value;\n this.control.value = this.value;\n }\n\n if (shouldEmit) {\n this.$emit('change');\n }\n }\n\n /\n Focus and set the content of the control based on the first selected option.\n /\n private setInputToSelection(): void {\n if (this.firstSelectedOption) {\n this.control.value = this.firstSelectedOption.text;\n this.control.focus();\n }\n }\n\n /\n Focus, set and select the content of the control based on the first selected option.\n /\n private setInlineSelection(): void {\n if (this.firstSelectedOption) {\n this.setInputToSelection();\n this.control.setSelectionRange(\n this.filter.length,\n this.control.value.length,\n 'backward'\n );\n }\n }\n\n private clearSelectionRange(): void {\n const controlValueLength = this.control.value.length;\n this.control.setSelectionRange(controlValueLength, controlValueLength);\n }\n\n /\n Determines if a value update should involve emitting a change event, then updates the value.\n /\n private syncValue(): void {\n const newValue = this.selectedIndex > -1\n ? this.firstSelectedOption?.text\n : this.control.value;\n this.updateValue(this.value !== newValue);\n }\n\n private updateListboxMaxHeightCssVariable(): void {\n if (this.listbox) {\n this.listbox.style.setProperty(\n '--ni-private-select-max-height',\n `${this.maxHeight}px`\n );\n }\n }\n\n private updateInputAriaLabel(): void {\n const inputElement = this.shadowRoot?.querySelector('.selected-value');\n if (this.ariaLabel) {\n inputElement?.setAttribute('aria-label', this.ariaLabel);\n } else {\n inputElement?.removeAttribute('aria-label');\n }\n }\n\n /\n This will only emit a `change` event after text entry where the text in the input prior to\n * typing is different than the text present upon an attempt to commit (e.g. pressing <Enter>).\n * So, for a concrete example:\n * 1) User types 'Sue' (when Combobox input was blank).\n * 2) User presses <Enter> -> 'change' event fires\n * 3) User deletes 'Sue'\n * 4) User re-types 'Sue'\n * 5) User presses <Enter> -> NO 'change' event is fired\n */\n private emitChangeIfValueUpdated(): void {\n if (this.valueUpdatedByInput) {\n if (this.value !== this.valueBeforeTextUpdate) {\n this.$emit('change');\n }\n\n this.valueUpdatedByInput = false;\n }\n }\n}\n\nconst nimbleCombobox = Combobox.compose<ComboboxOptions>({\n baseName: 'combobox',\n baseClass: FormAssociatedCombobox,\n template,\n styles,\n shadowOptions: {\n delegatesFocus: true\n },\n end: html<Combobox>`\n <div class=\"end-slot-container\">\n <${iconExclamationMarkTag}\n severity=\"error\"\n class=\"error-icon\"\n ></${iconExclamationMarkTag}>\n <div class=\"separator\"></div>\n <${toggleButtonTag}\n ${ref('dropdownButton')}\n appearance=\"ghost\"\n ?checked=\"${x => x.open}\"\n ?disabled=\"${x => x.disabled}\"\n content-hidden=\"true\"\n @click=\"${(x, c) => x.toggleButtonClickHandler(c.event)}\"\n @change=\"${(x, c) => x.toggleButtonChangeHandler(c.event)}\"\n @keydown=\"${(x, c) => x.toggleButtonKeyDownHandler(c.event as KeyboardEvent)}\"\n class=\"dropdown-button\"\n part=\"button\"\n aria-haspopup=\"true\"\n aria-expanded=\"${x => x.open}\"\n tabindex=\"-1\"\n >\n <${iconArrowExpanderDownTag}\n slot=\"start\"\n class=\"dropdown-icon\"\n >\n </${iconArrowExpanderDownTag}>\n </${toggleButtonTag}>\n </div>\n ${errorTextTemplate}\n `\n});\n\nexport interface Combobox extends StartEnd, DelegatesARIACombobox {}\napplyMixins(Combobox, StartEnd, DelegatesARIACombobox);\n\nDesignSystem.getOrCreate().withPrefix('nimble').register(nimbleCombobox());\nexport const comboboxTag = 'nimble-combobox';\n"]}
1	+ {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/combobox/index.ts"],"names":[],"mappings":"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","sourcesContent":["import {\n DOM,\n Observable,\n attr,\n html,\n observable,\n ref\n} from '@microsoft/fast-element';\nimport {\n DesignSystem,\n ComboboxOptions,\n ComboboxAutocomplete,\n SelectPosition,\n ListboxOption,\n DelegatesARIACombobox,\n applyMixins,\n StartEnd\n} from '@microsoft/fast-foundation';\nimport {\n keyArrowDown,\n keyArrowUp,\n keyEnter,\n keyEscape,\n keySpace,\n keyTab,\n limit,\n uniqueId\n} from '@microsoft/fast-web-utilities';\nimport { ToggleButton, toggleButtonTag } from '../toggle-button';\nimport { errorTextTemplate } from '../patterns/error/template';\nimport { iconArrowExpanderDownTag } from '../icons/arrow-expander-down';\nimport { iconExclamationMarkTag } from '../icons/exclamation-mark';\n\nimport { styles } from './styles';\nimport type { ErrorPattern } from '../patterns/error/types';\nimport {\n DropdownAppearance,\n type DropdownPattern\n} from '../patterns/dropdown/types';\nimport type { AnchoredRegion } from '../anchored-region';\nimport { template } from './template';\nimport { FormAssociatedCombobox } from './models/combobox-form-associated';\nimport type { ListOption } from '../list-option';\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'nimble-combobox': Combobox;\n }\n}\n\n/*\n A nimble-styed HTML combobox\n /\nexport class Combobox\n extends FormAssociatedCombobox\n implements DropdownPattern, ErrorPattern {\n @attr\n public appearance: DropdownAppearance = DropdownAppearance.underline;\n\n /\n A message explaining why the value is invalid.\n /\n @attr({ attribute: 'error-text' })\n public errorText?: string;\n\n @attr({ attribute: 'error-visible', mode: 'boolean' })\n public errorVisible = false;\n\n /\n The autocomplete attribute.\n /\n @attr({ attribute: 'autocomplete', mode: 'fromView' })\n public autocomplete?: ComboboxAutocomplete;\n\n /\n The placement for the listbox when the combobox is open.\n /\n @attr({ attribute: 'position' })\n public positionAttribute?: SelectPosition;\n\n /\n The open attribute.\n /\n @attr({ attribute: 'open', mode: 'boolean' })\n public open = false;\n\n /\n Sets the placeholder value of the element, generally used to provide a hint to the user.\n * @remarks Using a non-null assertion to mimic FAST's original improper typing of an\n * uninitialized property:\n * https://github.com/microsoft/fast/blob/0c27d027ff6e8616ad4fddc17f4432aa7f6cbad0/packages/web-components/fast-foundation/src/combobox/combobox.ts#L199\n /\n @attr\n public placeholder!: string;\n\n /\n The current state of the calculated position of the listbox.\n \n @public\n /\n @observable\n public position?: SelectPosition;\n\n /\n @internal\n /\n @observable\n public region?: AnchoredRegion;\n\n /\n @internal\n /\n @observable\n public controlWrapper!: HTMLElement;\n\n /\n @internal\n /\n @observable\n public control!: HTMLInputElement;\n\n /\n @internal\n /\n @observable\n public listbox!: HTMLDivElement;\n\n /\n @internal\n /\n @observable\n public readonly dropdownButton?: ToggleButton;\n\n /\n The collection of currently filtered options.\n /\n public filteredOptions: ListboxOption[] = [];\n\n /* @internal /\n @observable\n public hasOverflow = false;\n\n public override get value(): string {\n Observable.track(this, 'value');\n return this._value;\n }\n\n public override set value(next: string) {\n const prev = `${this._value}`;\n let updatedValue = next;\n\n if (this.$fastController.isConnected && this.options) {\n const selectedIndex = this.options.findIndex(\n el => el.text.toLowerCase() === next.toLowerCase()\n );\n\n const prevSelectedValue = this.options[this.selectedIndex]?.text;\n const nextSelectedValue = this.options[selectedIndex]?.text;\n\n this.selectedIndex = prevSelectedValue !== nextSelectedValue\n ? selectedIndex\n : this.selectedIndex;\n\n updatedValue = this.firstSelectedOption?.text \|\| next;\n }\n\n if (prev !== updatedValue) {\n this._value = updatedValue;\n super.valueChanged(prev, updatedValue);\n Observable.notify(this, 'value');\n }\n\n // Can remove when following resolved: https://github.com/microsoft/fast/issues/6749\n this.filter = next;\n this.filterOptions();\n this.selectedIndex = this.options\n .map(option => option.text)\n .indexOf(this.value);\n }\n\n /\n The list of options.\n \n Overrides `Listbox.options`.\n /\n public override get options(): ListboxOption[] {\n Observable.track(this, 'options');\n return this.filteredOptions?.length\n ? this.filteredOptions\n : this._options;\n }\n\n public override set options(value: ListboxOption[]) {\n this._options = value;\n Observable.notify(this, 'options');\n }\n\n /\n The unique id for the internal listbox element.\n \n @internal\n /\n public listboxId: string = uniqueId('listbox-');\n\n /\n The space available in the viewport for the listbox when opened.\n \n @internal\n /\n @observable\n public availableViewportHeight = 0;\n\n private valueUpdatedByInput = false;\n private valueBeforeTextUpdate?: string;\n private _value = '';\n private filter = '';\n\n /\n The initial state of the position attribute.\n /\n private forcedPosition = false;\n\n private get isAutocompleteInline(): boolean {\n return (\n this.autocomplete === ComboboxAutocomplete.inline\n \|\| this.isAutocompleteBoth\n );\n }\n\n private get isAutocompleteList(): boolean {\n return (\n this.autocomplete === ComboboxAutocomplete.list\n \|\| this.isAutocompleteBoth\n );\n }\n\n private get isAutocompleteBoth(): boolean {\n return this.autocomplete === ComboboxAutocomplete.both;\n }\n\n public override slottedOptionsChanged(\n prev: HTMLElement[],\n next: HTMLElement[]\n ): void {\n // Workaround for https://github.com/microsoft/fast/issues/5773\n const value = this.value;\n super.slottedOptionsChanged(prev, next);\n this.updateValue();\n if (value) {\n this.value = value;\n }\n }\n\n public override connectedCallback(): void {\n super.connectedCallback();\n this.forcedPosition = !!this.positionAttribute;\n if (this.value) {\n this.initialValue = this.value;\n }\n this.setPositioning();\n this.updateInputAriaLabel();\n }\n\n /\n @internal\n /\n public override clickHandler(e: MouseEvent): boolean {\n if (this.disabled) {\n return false;\n }\n\n if (this.open) {\n const captured = (e.target as HTMLElement).closest<ListOption>(\n 'option,[role=option]'\n );\n\n if (!captured \|\| captured.disabled) {\n return false;\n }\n\n this.selectedOptions = [captured];\n this.control.value = captured.text;\n this.clearSelectionRange();\n this.updateValue(true);\n }\n\n this.open = !this.open;\n\n if (this.open) {\n this.control.focus();\n }\n\n return true;\n }\n\n /\n @internal\n /\n public toggleButtonClickHandler(e: Event): void {\n e.stopImmediatePropagation();\n }\n\n /\n @internal\n /\n public toggleButtonChangeHandler(e: Event): void {\n this.open = this.dropdownButton!.checked;\n e.stopImmediatePropagation();\n }\n\n /\n @internal\n /\n public toggleButtonKeyDownHandler(e: KeyboardEvent): boolean {\n switch (e.key) {\n case keyArrowUp:\n case keyArrowDown:\n case keySpace:\n case keyEnter:\n this.open = true;\n this.stopPropagation(e);\n return false;\n default:\n return true;\n }\n }\n\n /\n @internal\n /\n public filterOptions(): void {\n if (\n !this.autocomplete\n \|\| this.autocomplete === ComboboxAutocomplete.none\n ) {\n this.filter = '';\n }\n\n const filter = this.filter.toLowerCase();\n\n this.filteredOptions = this._options.filter(o => o.text.toLowerCase().startsWith(filter));\n\n if (this.isAutocompleteList) {\n if (!this.filteredOptions.length && !filter) {\n this.filteredOptions = this._options;\n }\n\n this._options.forEach(o => {\n (o as ListOption).visuallyHidden = !this.filteredOptions.includes(o);\n });\n }\n\n const enabledOptions = this.filteredOptions.filter(o => !o.disabled);\n this.filteredOptions = enabledOptions;\n }\n\n /\n @internal\n /\n public inputHandler(e: InputEvent): boolean {\n this.filter = this.control.value;\n this.filterOptions();\n\n if (!this.isAutocompleteInline) {\n this.selectedIndex = this.options\n .map(option => option.text)\n .indexOf(this.control.value);\n }\n\n if (!(e.inputType.includes('deleteContent') \|\| !this.filter.length)) {\n if (this.isAutocompleteList && !this.open) {\n this.open = true;\n }\n\n if (this.isAutocompleteInline) {\n if (this.filteredOptions.length) {\n this.selectedOptions = [this.filteredOptions[0]!];\n this.selectedIndex = this.options.indexOf(\n this.firstSelectedOption\n );\n this.setInlineSelection();\n } else {\n this.selectedIndex = -1;\n }\n }\n }\n\n // This is a workaround for the issue described here: https://github.com/microsoft/fast/issues/6267\n // For now, we will update the value ourselves while a user types in text. Note that there is other\n // implementation related to this (like the 'keydownEventHandler') needed to create the complete set\n // of desired behavior described in the issue noted above.\n if (!this.valueUpdatedByInput) {\n this.valueBeforeTextUpdate = this.value;\n }\n this.valueUpdatedByInput = true;\n\n // This is a workaround for this FAST issue: https://github.com/microsoft/fast/issues/6776\n if (this.value !== this.control.value) {\n this.focusAndScrollOptionIntoView();\n }\n\n this.value = this.control.value;\n return true;\n }\n\n public override keydownHandler(e: KeyboardEvent): boolean {\n if (e.ctrlKey \|\| e.altKey) {\n return true;\n }\n\n switch (e.key) {\n case keyEnter:\n this.syncValue();\n if (this.isAutocompleteInline) {\n this.filter = this.value;\n }\n\n this.open = false;\n this.clearSelectionRange();\n this.emitChangeIfValueUpdated();\n break;\n case keyEscape:\n if (!this.isAutocompleteInline) {\n this.selectedIndex = -1;\n }\n\n if (this.open) {\n this.open = false;\n break;\n }\n\n this.value = '';\n this.control.value = '';\n this.filter = '';\n this.filterOptions();\n break;\n case keyTab:\n this.setInputToSelection();\n\n if (!this.open) {\n return true;\n }\n\n e.preventDefault();\n this.open = false;\n break;\n case keyArrowDown:\n case keyArrowUp:\n this.filterOptions();\n\n if (!this.open) {\n this.open = true;\n break;\n }\n\n if (this.filteredOptions.length > 0) {\n super.keydownHandler(e);\n }\n\n if (this.isAutocompleteInline) {\n this.setInlineSelection();\n }\n\n if (this.open && this.valueUpdatedByInput) {\n this.valueUpdatedByInput = false;\n }\n break;\n default:\n return true;\n }\n return true;\n }\n\n /\n @internal\n /\n public keyupHandler(e: KeyboardEvent): boolean {\n const key = e.key;\n\n switch (key) {\n case 'ArrowLeft':\n case 'ArrowRight':\n case 'Backspace':\n case 'Delete':\n case 'Home':\n case 'End': {\n this.filter = this.control.value;\n this.selectedIndex = -1;\n this.filterOptions();\n break;\n }\n default: {\n break;\n }\n }\n\n return true;\n }\n\n /\n @internal\n /\n public override focusoutHandler(e: FocusEvent): boolean {\n this.syncValue();\n\n if (this.open) {\n const focusTarget = e.relatedTarget as HTMLElement;\n if (this.isSameNode(focusTarget)) {\n this.focus();\n }\n }\n\n this.open = false;\n this.emitChangeIfValueUpdated();\n return true;\n }\n\n /\n Reset the element to its first selectable option when its parent form is reset.\n \n @internal\n /\n public override formResetCallback(): void {\n super.formResetCallback();\n this.setDefaultSelectedOption();\n this.updateValue();\n }\n\n /* {@inheritDoc (FormAssociated:interface).validate} /\n public override validate(): void {\n super.validate(this.control);\n }\n\n /\n Set the default selected options at initialization or reset.\n \n @internal\n * @remarks\n * Overrides `Listbox.setDefaultSelectedOption`\n /\n public override setDefaultSelectedOption(): void {\n if (this.$fastController.isConnected && this.options) {\n const selectedIndex = this.options.findIndex(\n el => el.getAttribute('selected') !== null \|\| el.selected\n );\n\n this.selectedIndex = selectedIndex;\n if (!this.dirtyValue && this.firstSelectedOption) {\n this.value = this.firstSelectedOption.text;\n }\n this.setSelectedOptions();\n }\n }\n\n /\n @internal\n /\n public override selectedIndexChanged(\n prev: number \| undefined,\n next: number\n ): void {\n if (this.$fastController.isConnected) {\n const pinnedSelectedIndex = limit(\n -1,\n this.options.length - 1,\n next\n );\n\n // we only want to call the super method when the selectedIndex is in range\n if (pinnedSelectedIndex !== this.selectedIndex) {\n this.selectedIndex = pinnedSelectedIndex;\n return;\n }\n\n super.selectedIndexChanged(prev, pinnedSelectedIndex);\n }\n }\n\n /\n Synchronize the `aria-disabled` property when the `disabled` property changes.\n \n @internal\n /\n public override disabledChanged(prev: boolean, next: boolean): void {\n if (super.disabledChanged) {\n super.disabledChanged(prev, next);\n }\n this.ariaDisabled = this.disabled ? 'true' : 'false';\n }\n\n /\n Move focus to the previous selectable option.\n \n @internal\n * @remarks\n * Overrides `Listbox.selectPreviousOption`\n /\n public override selectPreviousOption(): void {\n if (!this.disabled && this.selectedIndex >= 0) {\n this.selectedIndex -= 1;\n }\n }\n\n /\n @internal\n /\n public setPositioning(): void {\n // Workaround for https://github.com/microsoft/fast/issues/5123\n if (!this.$fastController.isConnected) {\n // Don't call setPositioning() until we're connected,\n // since this.forcedPosition isn't initialized yet.\n return;\n }\n const currentBox = this.getBoundingClientRect();\n const viewportHeight = window.innerHeight;\n const availableBottom = viewportHeight - currentBox.bottom;\n\n if (this.forcedPosition) {\n this.position = this.positionAttribute;\n } else if (currentBox.top > availableBottom) {\n this.position = SelectPosition.above;\n } else {\n this.position = SelectPosition.below;\n }\n\n this.positionAttribute = this.forcedPosition\n ? this.positionAttribute\n : this.position;\n\n this.availableViewportHeight = this.position === SelectPosition.above\n ? Math.trunc(currentBox.top)\n : Math.trunc(availableBottom);\n }\n\n /\n Focus the control and scroll the first selected option into view.\n \n @internal\n * @remarks\n * Overrides: `Listbox.focusAndScrollOptionIntoView`\n /\n protected override focusAndScrollOptionIntoView(): void {\n if (this.open) {\n if (this.contains(document.activeElement)) {\n this.control.focus();\n if (this.firstSelectedOption) {\n requestAnimationFrame(() => {\n this.firstSelectedOption?.scrollIntoView({\n block: 'nearest'\n });\n });\n }\n }\n }\n }\n\n protected openChanged(): void {\n if (this.open) {\n this.ariaControls = this.listboxId;\n this.ariaExpanded = 'true';\n\n this.setPositioning();\n this.focusAndScrollOptionIntoView();\n\n // focus is directed to the element when `open` is changed programmatically\n DOM.queueUpdate(() => this.focus());\n } else {\n this.ariaControls = '';\n this.ariaExpanded = 'false';\n }\n\n if (this.dropdownButton) {\n this.dropdownButton.checked = this.open;\n }\n }\n\n protected placeholderChanged(): void {\n if (this.proxy instanceof HTMLInputElement) {\n this.proxy.placeholder = this.placeholder ?? '';\n }\n }\n\n /\n Ensure that the entire list of options is used when setting the selected property.\n * @internal\n * @remarks\n * Overrides: `Listbox.selectedOptionsChanged`\n /\n protected override selectedOptionsChanged(\n _: ListboxOption[] \| undefined,\n next: ListboxOption[]\n ): void {\n if (this.$fastController.isConnected) {\n this._options.forEach(o => {\n o.selected = next.includes(o);\n });\n }\n }\n\n protected positionChanged(\n _: SelectPosition \| undefined,\n next: SelectPosition \| undefined\n ): void {\n this.positionAttribute = next;\n this.setPositioning();\n }\n\n private regionChanged(\n _prev: AnchoredRegion \| undefined,\n _next: AnchoredRegion \| undefined\n ): void {\n if (this.region && this.controlWrapper) {\n this.region.anchorElement = this.controlWrapper;\n }\n }\n\n private controlWrapperChanged(\n _prev: HTMLElement \| undefined,\n _next: HTMLElement \| undefined\n ): void {\n if (this.region && this.controlWrapper) {\n this.region.anchorElement = this.controlWrapper;\n }\n }\n\n // Workaround for https://github.com/microsoft/fast/issues/6041.\n private ariaLabelChanged(_oldValue: string, _newValue: string): void {\n this.updateInputAriaLabel();\n }\n\n /\n Sets the value and to match the first selected option.\n /\n private updateValue(shouldEmit?: boolean): void {\n if (this.$fastController.isConnected) {\n this.value = this.firstSelectedOption?.text \|\| this.control.value;\n this.control.value = this.value;\n }\n\n if (shouldEmit) {\n this.$emit('change');\n }\n }\n\n /\n Focus and set the content of the control based on the first selected option.\n /\n private setInputToSelection(): void {\n if (this.firstSelectedOption) {\n this.control.value = this.firstSelectedOption.text;\n this.control.focus();\n }\n }\n\n /\n Focus, set and select the content of the control based on the first selected option.\n /\n private setInlineSelection(): void {\n if (this.firstSelectedOption) {\n this.setInputToSelection();\n this.control.setSelectionRange(\n this.filter.length,\n this.control.value.length,\n 'backward'\n );\n }\n }\n\n private clearSelectionRange(): void {\n const controlValueLength = this.control.value.length;\n this.control.setSelectionRange(controlValueLength, controlValueLength);\n }\n\n /\n Determines if a value update should involve emitting a change event, then updates the value.\n /\n private syncValue(): void {\n const newValue = this.selectedIndex > -1\n ? this.firstSelectedOption?.text\n : this.control.value;\n this.updateValue(this.value !== newValue);\n }\n\n private updateInputAriaLabel(): void {\n const inputElement = this.shadowRoot?.querySelector('.selected-value');\n if (this.ariaLabel) {\n inputElement?.setAttribute('aria-label', this.ariaLabel);\n } else {\n inputElement?.removeAttribute('aria-label');\n }\n }\n\n /\n This will only emit a `change` event after text entry where the text in the input prior to\n * typing is different than the text present upon an attempt to commit (e.g. pressing <Enter>).\n * So, for a concrete example:\n * 1) User types 'Sue' (when Combobox input was blank).\n * 2) User presses <Enter> -> 'change' event fires\n * 3) User deletes 'Sue'\n * 4) User re-types 'Sue'\n * 5) User presses <Enter> -> NO 'change' event is fired\n */\n private emitChangeIfValueUpdated(): void {\n if (this.valueUpdatedByInput) {\n if (this.value !== this.valueBeforeTextUpdate) {\n this.$emit('change');\n }\n\n this.valueUpdatedByInput = false;\n }\n }\n}\n\nconst nimbleCombobox = Combobox.compose<ComboboxOptions>({\n baseName: 'combobox',\n baseClass: FormAssociatedCombobox,\n template,\n styles,\n shadowOptions: {\n delegatesFocus: true\n },\n end: html<Combobox>`\n <div class=\"end-slot-container\">\n <${iconExclamationMarkTag}\n severity=\"error\"\n class=\"error-icon\"\n ></${iconExclamationMarkTag}>\n <div class=\"separator\"></div>\n <${toggleButtonTag}\n ${ref('dropdownButton')}\n appearance=\"ghost\"\n ?checked=\"${x => x.open}\"\n ?disabled=\"${x => x.disabled}\"\n content-hidden=\"true\"\n @click=\"${(x, c) => x.toggleButtonClickHandler(c.event)}\"\n @change=\"${(x, c) => x.toggleButtonChangeHandler(c.event)}\"\n @keydown=\"${(x, c) => x.toggleButtonKeyDownHandler(c.event as KeyboardEvent)}\"\n class=\"dropdown-button\"\n part=\"button\"\n aria-haspopup=\"true\"\n aria-expanded=\"${x => x.open}\"\n tabindex=\"-1\"\n >\n <${iconArrowExpanderDownTag}\n slot=\"start\"\n class=\"dropdown-icon\"\n >\n </${iconArrowExpanderDownTag}>\n </${toggleButtonTag}>\n </div>\n ${errorTextTemplate}\n `\n});\n\nexport interface Combobox extends StartEnd, DelegatesARIACombobox {}\napplyMixins(Combobox, StartEnd, DelegatesARIACombobox);\n\nDesignSystem.getOrCreate().withPrefix('nimble').register(nimbleCombobox());\nexport const comboboxTag = 'nimble-combobox';\n"]}

package/dist/esm/combobox/template.js CHANGED Viewed

@@ -63,6 +63,7 @@ export const template = (context, definition) => html `
                 part="listbox"
                 role="listbox"
                 ?disabled="${x => x.disabled}"
+                style="--ni-private-listbox-available-viewport-height: ${x => x.availableViewportHeight}px;"
                 ${ref('listbox')}
             >
                 <slot name="option"

package/dist/esm/combobox/template.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"template.js","sourceRoot":"","sources":["../../../src/combobox/template.ts"],"names":[],"mappings":"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~~kBAC1B~~,GAAG,CAAC,SAAS,CAAC;;;sBAGV,OAAO,CAAC;IACtB,MAAM,EAAE,CAAC,CAAO,EAAE,EAAE,CAAC,CAAC,YAAY,WAAW,IAAI,OAAO,CAAC,mBAAmB,CAAC,CAAC,CAAC;IAC/E,OAAO,EAAE,IAAI;IACb,QAAQ,EAAE,gBAAgB;CAC7B,CAAC;;;YAGM,iBAAiB;;CAE5B,CAAC","sourcesContent":["import { type ViewTemplate, html, ref, slotted } from '@microsoft/fast-element';\nimport {\n type FoundationElementTemplate,\n type ComboboxOptions,\n startSlotTemplate,\n endSlotTemplate,\n Listbox\n} from '@microsoft/fast-foundation';\nimport type { Combobox } from '.';\nimport { anchoredRegionTag } from '../anchored-region';\nimport { DropdownPosition } from '../patterns/dropdown/types';\nimport { overflow } from '../utilities/directive/overflow';\n\n// prettier-ignore\nexport const template: FoundationElementTemplate<\nViewTemplate<Combobox>,\nComboboxOptions\n> = (context, definition) => html`\n <template\n aria-disabled=\"${x => x.ariaDisabled}\"\n autocomplete=\"${x => x.autocomplete}\"\n class=\"${x => (x.open ? 'open' : '')} ${x => (x.disabled ? 'disabled' : '')} ${x => x.position}\"\n ?open=\"${x => x.open}\"\n tabindex=\"${x => (!x.disabled ? '0' : null)}\"\n @click=\"${(x, c) => x.clickHandler(c.event as MouseEvent)}\"\n @focusout=\"${(x, c) => x.focusoutHandler(c.event as FocusEvent)}\"\n @keydown=\"${(x, c) => x.keydownHandler(c.event as KeyboardEvent)}\"\n >\n <div class=\"control\" part=\"control\" ${ref('controlWrapper')}>\n ${startSlotTemplate(context, definition)}\n <slot name=\"control\">\n <input\n aria-activedescendant=\"${x => (x.open ? x.ariaActiveDescendant : null)}\"\n aria-autocomplete=\"${x => x.ariaAutoComplete}\"\n aria-controls=\"${x => x.ariaControls}\"\n aria-disabled=\"${x => x.ariaDisabled}\"\n aria-expanded=\"${x => x.ariaExpanded}\"\n aria-haspopup=\"listbox\"\n class=\"selected-value\"\n part=\"selected-value\"\n placeholder=\"${x => x.placeholder}\"\n role=\"combobox\"\n type=\"text\"\n ?disabled=\"${x => x.disabled}\"\n :value=\"${x => x.value}\"\n @input=\"${(x, c) => x.inputHandler(c.event as InputEvent)}\"\n @keyup=\"${(x, c) => x.keyupHandler(c.event as KeyboardEvent)}\"\n ${ref('control')}\n ${overflow('hasOverflow')}\n title=${x => (x.hasOverflow && x.value ? x.value : null)}\n />\n <div class=\"indicator\" part=\"indicator\" aria-hidden=\"true\">\n <slot name=\"indicator\">\n ${definition.indicator \|\| ''}\n </slot>\n </div>\n </slot>\n ${endSlotTemplate(context, definition)}\n </div>\n <${anchoredRegionTag}\n ${ref('region')}\n class=\"anchored-region\"\n fixed-placement\n auto-update-mode=\"auto\"\n vertical-default-position=\"${x => (x.positionAttribute === DropdownPosition.above ? 'top' : 'bottom')}\"\n vertical-positioning-mode=\"${x => (!x.positionAttribute ? 'dynamic' : 'locktodefault')}\"\n horizontal-default-position=\"center\"\n horizontal-positioning-mode=\"locktodefault\"\n horizontal-scaling=\"anchor\"\n ?hidden=\"${x => !x.open}\">\n <div\n class=\"listbox\"\n id=\"${x => x.listboxId}\"\n part=\"listbox\"\n role=\"listbox\"\n ?disabled=\"${x => x.disabled}\"\n ${ref('listbox')}\n >\n <slot name=\"option\"\n ${slotted({\n filter: (n: Node) => n instanceof HTMLElement && Listbox.slottedOptionFilter(n),\n flatten: true,\n property: 'slottedOptions',\n })}\n ></slot>\n </div>\n </${anchoredRegionTag}>\n </template>\n`;\n"]}
1	+ {"version":3,"file":"template.js","sourceRoot":"","sources":["../../../src/combobox/template.ts"],"names":[],"mappings":"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","sourcesContent":["import { type ViewTemplate, html, ref, slotted } from '@microsoft/fast-element';\nimport {\n type FoundationElementTemplate,\n type ComboboxOptions,\n startSlotTemplate,\n endSlotTemplate,\n Listbox\n} from '@microsoft/fast-foundation';\nimport type { Combobox } from '.';\nimport { anchoredRegionTag } from '../anchored-region';\nimport { DropdownPosition } from '../patterns/dropdown/types';\nimport { overflow } from '../utilities/directive/overflow';\n\n// prettier-ignore\nexport const template: FoundationElementTemplate<\nViewTemplate<Combobox>,\nComboboxOptions\n> = (context, definition) => html`\n <template\n aria-disabled=\"${x => x.ariaDisabled}\"\n autocomplete=\"${x => x.autocomplete}\"\n class=\"${x => (x.open ? 'open' : '')} ${x => (x.disabled ? 'disabled' : '')} ${x => x.position}\"\n ?open=\"${x => x.open}\"\n tabindex=\"${x => (!x.disabled ? '0' : null)}\"\n @click=\"${(x, c) => x.clickHandler(c.event as MouseEvent)}\"\n @focusout=\"${(x, c) => x.focusoutHandler(c.event as FocusEvent)}\"\n @keydown=\"${(x, c) => x.keydownHandler(c.event as KeyboardEvent)}\"\n >\n <div class=\"control\" part=\"control\" ${ref('controlWrapper')}>\n ${startSlotTemplate(context, definition)}\n <slot name=\"control\">\n <input\n aria-activedescendant=\"${x => (x.open ? x.ariaActiveDescendant : null)}\"\n aria-autocomplete=\"${x => x.ariaAutoComplete}\"\n aria-controls=\"${x => x.ariaControls}\"\n aria-disabled=\"${x => x.ariaDisabled}\"\n aria-expanded=\"${x => x.ariaExpanded}\"\n aria-haspopup=\"listbox\"\n class=\"selected-value\"\n part=\"selected-value\"\n placeholder=\"${x => x.placeholder}\"\n role=\"combobox\"\n type=\"text\"\n ?disabled=\"${x => x.disabled}\"\n :value=\"${x => x.value}\"\n @input=\"${(x, c) => x.inputHandler(c.event as InputEvent)}\"\n @keyup=\"${(x, c) => x.keyupHandler(c.event as KeyboardEvent)}\"\n ${ref('control')}\n ${overflow('hasOverflow')}\n title=${x => (x.hasOverflow && x.value ? x.value : null)}\n />\n <div class=\"indicator\" part=\"indicator\" aria-hidden=\"true\">\n <slot name=\"indicator\">\n ${definition.indicator \|\| ''}\n </slot>\n </div>\n </slot>\n ${endSlotTemplate(context, definition)}\n </div>\n <${anchoredRegionTag}\n ${ref('region')}\n class=\"anchored-region\"\n fixed-placement\n auto-update-mode=\"auto\"\n vertical-default-position=\"${x => (x.positionAttribute === DropdownPosition.above ? 'top' : 'bottom')}\"\n vertical-positioning-mode=\"${x => (!x.positionAttribute ? 'dynamic' : 'locktodefault')}\"\n horizontal-default-position=\"center\"\n horizontal-positioning-mode=\"locktodefault\"\n horizontal-scaling=\"anchor\"\n ?hidden=\"${x => !x.open}\">\n <div\n class=\"listbox\"\n id=\"${x => x.listboxId}\"\n part=\"listbox\"\n role=\"listbox\"\n ?disabled=\"${x => x.disabled}\"\n style=\"--ni-private-listbox-available-viewport-height: ${x => x.availableViewportHeight}px;\"\n ${ref('listbox')}\n >\n <slot name=\"option\"\n ${slotted({\n filter: (n: Node) => n instanceof HTMLElement && Listbox.slottedOptionFilter(n),\n flatten: true,\n property: 'slottedOptions',\n })}\n ></slot>\n </div>\n </${anchoredRegionTag}>\n </template>\n`;\n"]}

package/dist/esm/patterns/dropdown/styles.js CHANGED Viewed

@@ -121,12 +121,32 @@ export const styles = css `
         overflow-y: auto;
         width: 100%;
         --ni-private-listbox-padding: ${smallPadding};
-        max-height: calc(var(--ni-private-select-max-height) - ${smallPadding});
+        --ni-private-listbox-filter-height: 0px;
+        --ni-private-listbox-loading-indicator-height: 0px;
+        max-height: min(
+            calc(
+                ${smallPadding} + 2 * ${borderWidth} + ${controlHeight} * 10.5 +
+                    var(--ni-private-listbox-filter-height) +
+                    var(--ni-private-listbox-loading-indicator-height)
+            ),
+            calc(
+                var(--ni-private-listbox-available-viewport-height) -
+                    ${smallPadding}
+            )
+        );
         box-shadow: ${elevation2BoxShadow};
-        border: 1px solid ${popupBorderColor};
+        border: ${borderWidth} solid ${popupBorderColor};
         background-color: ${applicationBackgroundColor};
     }
+    .listbox:has(.filter-field) {
+        --ni-private-listbox-filter-height: ${controlHeight};
+    }
+    .listbox:has(.loading-container) {
+        --ni-private-listbox-loading-indicator-height: ${controlHeight};
+    }
     .listbox slot {
         display: block;
         background: transparent;

package/dist/esm/patterns/dropdown/styles.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"styles.js","sourceRoot":"","sources":["../../../../src/patterns/dropdown/styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,yBAAyB,CAAC;AAC9C,OAAO,EAAE,KAAK,EAAE,MAAM,kDAAkD,CAAC;AACzE,OAAO,EAAE,OAAO,EAAE,MAAM,+BAA+B,CAAC;AACxD,OAAO,EACH,0BAA0B,EAC1B,QAAQ,EACR,aAAa,EACb,qBAAqB,EACrB,gBAAgB,EAChB,WAAW,EACX,aAAa,EACb,QAAQ,EACR,YAAY,EACZ,gBAAgB,EAChB,UAAU,EACV,YAAY,EACZ,qBAAqB,EACrB,aAAa,EACb,SAAS,EACT,mBAAmB,EACtB,MAAM,oCAAoC,CAAC;AAC5C,OAAO,EAAE,KAAK,EAAE,MAAM,4BAA4B,CAAC;AACnD,OAAO,EAAE,kBAAkB,EAAE,MAAM,kCAAkC,CAAC;AACtE,OAAO,EAAE,iBAAiB,EAAE,MAAM,8BAA8B,CAAC;AACjE,OAAO,EAAE,YAAY,EAAE,MAAM,6BAA6B,CAAC;AAC3D,OAAO,EAAE,aAAa,EAAE,MAAM,6BAA6B,CAAC;AAC5D,OAAO,EAAE,kBAAkB,EAAE,MAAM,SAAS,CAAC;AAC7C,OAAO,EAAE,cAAc,EAAE,MAAM,mCAAmC,CAAC;AAEnE,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;MACnB,OAAO,CAAC,aAAa,CAAC;;;iBAGX,aAAa;gBACd,QAAQ;kBACN,aAAa;;;UAGrB,cAAc;qBACH,YAAY;;;mDAGkB,WAAW;;;;;;;;uBAQvC,WAAW;;;;yBAIT,gBAAgB;;4BAEb,UAAU;;;;;;;;;YAS1B,YAAY;;;;;+BAKO,SAAS;;;;;;4BAMZ,WAAW;;;;yBAId,gBAAgB;;4BAEb,UAAU;;;;;;;;;;YAU1B,YAAY;;;;;+BAKO,SAAS;;;;;;;;;;;;;;;;;iCAiBP,qBAAqB;;mBAEnC,WAAW;;;;+BAIC,gBAAgB;;;;;iBAK9B,qBAAqB;6BACT,qBAAqB;;;;;;+BAMnB,SAAS;;;;;;;;wCAQA,YAAY~~;iEACa~~,YAAY~~;sBACvD~~,mBAAmB;~~4BACb~~,gBAAgB;~~4BAChB~~,0BAA0B;;;;;;;;;;;;;;;;;;;;~~0BAoB5B~~,YAAY;;;;uBAIf,YAAY;;;;;;;;;;;wBAWX,aAAa;;;;iBAIpB,qBAAqB;;;;;uBAKf,YAAY;;;;;;;;iBAQlB,QAAQ;kBACP,QAAQ;gBACV,aAAa;;;;gBAIb,qBAAqB;;;;;;;;;;;CAWpC,CAAC,aAAa,CACX,kBAAkB,CACd,kBAAkB,CAAC,SAAS,EAC5B,GAAG,CAAA;;uCAE4B,WAAW;;;;;qCAKb,qBAAqB;;SAEjD,CACJ,EACD,kBAAkB,CACd,kBAAkB,CAAC,OAAO,EAC1B,GAAG,CAAA;;gCAEqB,WAAW;;;SAGlC,CACJ,EACD,kBAAkB,CACd,kBAAkB,CAAC,KAAK,EACxB,GAAG,CAAA;;yCAE8B,qBAAqB;;;;uCAIvB,WAAW;;;;;yCAKT,qBAAqB;;SAErD,CACJ,EACD,aAAa,CACT,KAAK,CAAC,KAAK,EACX,GAAG,CAAA;;8BAEmB,iBAAiB,CAAC,KAAK,EAAE,IAAI,CAAC;;SAEnD,CACJ,CACJ,CAAC","sourcesContent":["import { css } from '@microsoft/fast-element';\nimport { White } from '@ni/nimble-tokens/dist/styledictionary/js/tokens';\nimport { display } from '../../utilities/style/display';\nimport {\n applicationBackgroundColor,\n bodyFont,\n bodyFontColor,\n bodyDisabledFontColor,\n borderHoverColor,\n borderWidth,\n controlHeight,\n iconSize,\n menuMinWidth,\n popupBorderColor,\n smallDelay,\n smallPadding,\n borderRgbPartialColor,\n mediumPadding,\n failColor,\n elevation2BoxShadow\n} from '../../theme-provider/design-tokens';\nimport { Theme } from '../../theme-provider/types';\nimport { appearanceBehavior } from '../../utilities/style/appearance';\nimport { hexToRgbaCssColor } from '../../utilities/style/colors';\nimport { focusVisible } from '../../utilities/style/focus';\nimport { themeBehavior } from '../../utilities/style/theme';\nimport { DropdownAppearance } from './types';\nimport { userSelectNone } from '../../utilities/style/user-select';\n\nexport const styles = css`\n ${display('inline-flex')}\n\n :host {\n color: ${bodyFontColor};\n font: ${bodyFont};\n height: ${controlHeight};\n position: relative;\n justify-content: center;\n ${userSelectNone}\n min-width: ${menuMinWidth};\n outline: none;\n vertical-align: top;\n --ni-private-hover-indicator-width: calc(${borderWidth} + 1px);\n --ni-private-focus-indicator-width: 1px;\n --ni-private-indicator-lines-gap: 1px;\n }\n\n :host::before {\n content: '';\n position: absolute;\n bottom: calc(${borderWidth} + var(--ni-private-indicator-lines-gap));\n width: 0px;\n height: 0px;\n justify-self: center;\n border-bottom: ${borderHoverColor}\n var(--ni-private-focus-indicator-width) solid;\n transition: width ${smallDelay} ease-in;\n }\n\n @media (prefers-reduced-motion) {\n :host::before {\n transition-duration: 0s;\n }\n }\n\n :host(${focusVisible})::before {\n width: calc(100% - 8px);\n }\n\n :host([error-visible]):before {\n border-bottom-color: ${failColor};\n }\n\n :host::after {\n content: '';\n position: absolute;\n bottom: calc(-1 * ${borderWidth});\n width: 0px;\n height: 0px;\n justify-self: center;\n border-bottom: ${borderHoverColor}\n var(--ni-private-hover-indicator-width) solid;\n transition: width ${smallDelay} ease-in;\n }\n\n @media (prefers-reduced-motion) {\n :host::after {\n transition-duration: 0s;\n }\n }\n\n :host(:hover)::after,\n :host(${focusVisible})::after {\n width: 100%;\n }\n\n :host([error-visible]):after {\n border-bottom-color: ${failColor};\n }\n\n :host([disabled]:hover)::after {\n width: 0px;\n }\n\n [part='start'] {\n display: none;\n }\n\n .control {\n align-items: center;\n cursor: pointer;\n display: flex;\n min-height: 100%;\n width: 100%;\n border: 0px solid rgba(${borderRgbPartialColor}, 0.3);\n background-color: transparent;\n padding: ${borderWidth};\n }\n\n :host([open]:not(:hover)) .control {\n border-bottom-color: ${borderHoverColor};\n }\n\n :host([disabled]) .control {\n cursor: default;\n color: ${bodyDisabledFontColor};\n border-color: rgba(${borderRgbPartialColor}, 0.1);\n }\n\n :host([error-visible]) .control,\n :host([error-visible][open]) .control,\n :host([error-visible][disabled]) .control {\n border-bottom-color: ${failColor};\n }\n\n .listbox {\n display: inline-flex;\n flex-direction: column;\n overflow-y: auto;\n width: 100%;\n --ni-private-listbox-padding: ${smallPadding};\n max-height: calc(var(--ni-private-~~select~~-~~max~~-height) - ${smallPadding});\n box-shadow: ${elevation2BoxShadow};\n border: ~~1px~~ solid ${popupBorderColor};\n background-color: ${applicationBackgroundColor};\n }\n\n .listbox slot {\n display: block;\n background: transparent;\n padding: var(--ni-private-listbox-padding);\n }\n\n :host([open][position='above']) .listbox {\n border-bottom-left-radius: 0;\n border-bottom-right-radius: 0;\n }\n\n :host([open][position='below']) .listbox {\n border-top-left-radius: 0;\n border-top-right-radius: 0;\n }\n\n :host([open][position='above']) .anchored-region {\n padding-bottom: ${smallPadding};\n }\n\n :host([open][position='below']) .anchored-region {\n padding-top: ${smallPadding};\n }\n\n .selected-value {\n flex: auto;\n font-family: inherit;\n text-align: start;\n white-space: nowrap;\n text-overflow: ellipsis;\n overflow: hidden;\n padding: 0px;\n padding-left: ${mediumPadding};\n }\n\n .selected-value[disabled]::placeholder {\n color: ${bodyDisabledFontColor};\n }\n\n .indicator {\n flex: none;\n margin-left: ${smallPadding};\n padding-right: 8px;\n display: flex;\n justify-content: center;\n align-items: center;\n }\n\n .indicator slot[name='indicator'] svg {\n width: ${iconSize};\n height: ${iconSize};\n fill: ${bodyFontColor};\n }\n\n :host([disabled]) .indicator slot[name='indicator'] svg {\n fill: ${bodyDisabledFontColor};\n }\n\n [part='end'] {\n margin-inline-start: auto;\n }\n\n ::slotted([role='option']),\n ::slotted(option) {\n flex: none;\n }\n`.withBehaviors(\n appearanceBehavior(\n DropdownAppearance.underline,\n css`\n .control {\n border-bottom-width: ${borderWidth};\n padding-bottom: 0;\n }\n\n :host([disabled]) .control {\n border-color: rgba(${borderRgbPartialColor}, 0.1);\n }\n `\n ),\n appearanceBehavior(\n DropdownAppearance.outline,\n css`\n .control {\n border-width: ${borderWidth};\n padding: 0;\n }\n `\n ),\n appearanceBehavior(\n DropdownAppearance.block,\n css`\n .control {\n background-color: rgba(${borderRgbPartialColor}, 0.1);\n }\n\n .control:focus-within {\n border-bottom-width: ${borderWidth};\n padding-bottom: 0;\n }\n\n :host([disabled]) .control {\n background-color: rgba(${borderRgbPartialColor}, 0.07);\n }\n `\n ),\n themeBehavior(\n Theme.color,\n css`\n .listbox slot {\n background: ${hexToRgbaCssColor(White, 0.15)};\n }\n `\n )\n);\n"]}
1	+ {"version":3,"file":"styles.js","sourceRoot":"","sources":["../../../../src/patterns/dropdown/styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,yBAAyB,CAAC;AAC9C,OAAO,EAAE,KAAK,EAAE,MAAM,kDAAkD,CAAC;AACzE,OAAO,EAAE,OAAO,EAAE,MAAM,+BAA+B,CAAC;AACxD,OAAO,EACH,0BAA0B,EAC1B,QAAQ,EACR,aAAa,EACb,qBAAqB,EACrB,gBAAgB,EAChB,WAAW,EACX,aAAa,EACb,QAAQ,EACR,YAAY,EACZ,gBAAgB,EAChB,UAAU,EACV,YAAY,EACZ,qBAAqB,EACrB,aAAa,EACb,SAAS,EACT,mBAAmB,EACtB,MAAM,oCAAoC,CAAC;AAC5C,OAAO,EAAE,KAAK,EAAE,MAAM,4BAA4B,CAAC;AACnD,OAAO,EAAE,kBAAkB,EAAE,MAAM,kCAAkC,CAAC;AACtE,OAAO,EAAE,iBAAiB,EAAE,MAAM,8BAA8B,CAAC;AACjE,OAAO,EAAE,YAAY,EAAE,MAAM,6BAA6B,CAAC;AAC3D,OAAO,EAAE,aAAa,EAAE,MAAM,6BAA6B,CAAC;AAC5D,OAAO,EAAE,kBAAkB,EAAE,MAAM,SAAS,CAAC;AAC7C,OAAO,EAAE,cAAc,EAAE,MAAM,mCAAmC,CAAC;AAEnE,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;MACnB,OAAO,CAAC,aAAa,CAAC;;;iBAGX,aAAa;gBACd,QAAQ;kBACN,aAAa;;;UAGrB,cAAc;qBACH,YAAY;;;mDAGkB,WAAW;;;;;;;;uBAQvC,WAAW;;;;yBAIT,gBAAgB;;4BAEb,UAAU;;;;;;;;;YAS1B,YAAY;;;;;+BAKO,SAAS;;;;;;4BAMZ,WAAW;;;;yBAId,gBAAgB;;4BAEb,UAAU;;;;;;;;;;YAU1B,YAAY;;;;;+BAKO,SAAS;;;;;;;;;;;;;;;;;iCAiBP,qBAAqB;;mBAEnC,WAAW;;;;+BAIC,gBAAgB;;;;;iBAK9B,qBAAqB;6BACT,qBAAqB;;;;;;+BAMnB,SAAS;;;;;;;;wCAQA,YAAY;;;;;kBAKlC,YAAY,UAAU,WAAW,MAAM,aAAa;;;;;;sBAMhD,YAAY;;;sBAGZ,mBAAmB;kBACvB,WAAW,UAAU,gBAAgB;4BAC3B,0BAA0B;;;;8CAIR,aAAa;;;;yDAIF,aAAa;;;;;;;;;;;;;;;;;;;;0BAoB5C,YAAY;;;;uBAIf,YAAY;;;;;;;;;;;wBAWX,aAAa;;;;iBAIpB,qBAAqB;;;;;uBAKf,YAAY;;;;;;;;iBAQlB,QAAQ;kBACP,QAAQ;gBACV,aAAa;;;;gBAIb,qBAAqB;;;;;;;;;;;CAWpC,CAAC,aAAa,CACX,kBAAkB,CACd,kBAAkB,CAAC,SAAS,EAC5B,GAAG,CAAA;;uCAE4B,WAAW;;;;;qCAKb,qBAAqB;;SAEjD,CACJ,EACD,kBAAkB,CACd,kBAAkB,CAAC,OAAO,EAC1B,GAAG,CAAA;;gCAEqB,WAAW;;;SAGlC,CACJ,EACD,kBAAkB,CACd,kBAAkB,CAAC,KAAK,EACxB,GAAG,CAAA;;yCAE8B,qBAAqB;;;;uCAIvB,WAAW;;;;;yCAKT,qBAAqB;;SAErD,CACJ,EACD,aAAa,CACT,KAAK,CAAC,KAAK,EACX,GAAG,CAAA;;8BAEmB,iBAAiB,CAAC,KAAK,EAAE,IAAI,CAAC;;SAEnD,CACJ,CACJ,CAAC","sourcesContent":["import { css } from '@microsoft/fast-element';\nimport { White } from '@ni/nimble-tokens/dist/styledictionary/js/tokens';\nimport { display } from '../../utilities/style/display';\nimport {\n applicationBackgroundColor,\n bodyFont,\n bodyFontColor,\n bodyDisabledFontColor,\n borderHoverColor,\n borderWidth,\n controlHeight,\n iconSize,\n menuMinWidth,\n popupBorderColor,\n smallDelay,\n smallPadding,\n borderRgbPartialColor,\n mediumPadding,\n failColor,\n elevation2BoxShadow\n} from '../../theme-provider/design-tokens';\nimport { Theme } from '../../theme-provider/types';\nimport { appearanceBehavior } from '../../utilities/style/appearance';\nimport { hexToRgbaCssColor } from '../../utilities/style/colors';\nimport { focusVisible } from '../../utilities/style/focus';\nimport { themeBehavior } from '../../utilities/style/theme';\nimport { DropdownAppearance } from './types';\nimport { userSelectNone } from '../../utilities/style/user-select';\n\nexport const styles = css`\n ${display('inline-flex')}\n\n :host {\n color: ${bodyFontColor};\n font: ${bodyFont};\n height: ${controlHeight};\n position: relative;\n justify-content: center;\n ${userSelectNone}\n min-width: ${menuMinWidth};\n outline: none;\n vertical-align: top;\n --ni-private-hover-indicator-width: calc(${borderWidth} + 1px);\n --ni-private-focus-indicator-width: 1px;\n --ni-private-indicator-lines-gap: 1px;\n }\n\n :host::before {\n content: '';\n position: absolute;\n bottom: calc(${borderWidth} + var(--ni-private-indicator-lines-gap));\n width: 0px;\n height: 0px;\n justify-self: center;\n border-bottom: ${borderHoverColor}\n var(--ni-private-focus-indicator-width) solid;\n transition: width ${smallDelay} ease-in;\n }\n\n @media (prefers-reduced-motion) {\n :host::before {\n transition-duration: 0s;\n }\n }\n\n :host(${focusVisible})::before {\n width: calc(100% - 8px);\n }\n\n :host([error-visible]):before {\n border-bottom-color: ${failColor};\n }\n\n :host::after {\n content: '';\n position: absolute;\n bottom: calc(-1 * ${borderWidth});\n width: 0px;\n height: 0px;\n justify-self: center;\n border-bottom: ${borderHoverColor}\n var(--ni-private-hover-indicator-width) solid;\n transition: width ${smallDelay} ease-in;\n }\n\n @media (prefers-reduced-motion) {\n :host::after {\n transition-duration: 0s;\n }\n }\n\n :host(:hover)::after,\n :host(${focusVisible})::after {\n width: 100%;\n }\n\n :host([error-visible]):after {\n border-bottom-color: ${failColor};\n }\n\n :host([disabled]:hover)::after {\n width: 0px;\n }\n\n [part='start'] {\n display: none;\n }\n\n .control {\n align-items: center;\n cursor: pointer;\n display: flex;\n min-height: 100%;\n width: 100%;\n border: 0px solid rgba(${borderRgbPartialColor}, 0.3);\n background-color: transparent;\n padding: ${borderWidth};\n }\n\n :host([open]:not(:hover)) .control {\n border-bottom-color: ${borderHoverColor};\n }\n\n :host([disabled]) .control {\n cursor: default;\n color: ${bodyDisabledFontColor};\n border-color: rgba(${borderRgbPartialColor}, 0.1);\n }\n\n :host([error-visible]) .control,\n :host([error-visible][open]) .control,\n :host([error-visible][disabled]) .control {\n border-bottom-color: ${failColor};\n }\n\n .listbox {\n display: inline-flex;\n flex-direction: column;\n overflow-y: auto;\n width: 100%;\n --ni-private-listbox-padding: ${smallPadding};\n --ni-private-listbox-filter-height: 0px;\n --ni-private-listbox-loading-indicator-height: 0px;\n max-height: min(\n calc(\n ${smallPadding} + 2 * ${borderWidth} + ${controlHeight} * 10.5 +\n var(--ni-private-listbox-filter-height) +\n var(--ni-private-listbox-loading-indicator-height)\n ),\n calc(\n var(--ni-private-listbox-available-viewport-height) -\n ${smallPadding}\n )\n );\n box-shadow: ${elevation2BoxShadow};\n border: ${borderWidth} solid ${popupBorderColor};\n background-color: ${applicationBackgroundColor};\n }\n\n .listbox:has(.filter-field) {\n --ni-private-listbox-filter-height: ${controlHeight};\n }\n\n .listbox:has(.loading-container) {\n --ni-private-listbox-loading-indicator-height: ${controlHeight};\n }\n\n .listbox slot {\n display: block;\n background: transparent;\n padding: var(--ni-private-listbox-padding);\n }\n\n :host([open][position='above']) .listbox {\n border-bottom-left-radius: 0;\n border-bottom-right-radius: 0;\n }\n\n :host([open][position='below']) .listbox {\n border-top-left-radius: 0;\n border-top-right-radius: 0;\n }\n\n :host([open][position='above']) .anchored-region {\n padding-bottom: ${smallPadding};\n }\n\n :host([open][position='below']) .anchored-region {\n padding-top: ${smallPadding};\n }\n\n .selected-value {\n flex: auto;\n font-family: inherit;\n text-align: start;\n white-space: nowrap;\n text-overflow: ellipsis;\n overflow: hidden;\n padding: 0px;\n padding-left: ${mediumPadding};\n }\n\n .selected-value[disabled]::placeholder {\n color: ${bodyDisabledFontColor};\n }\n\n .indicator {\n flex: none;\n margin-left: ${smallPadding};\n padding-right: 8px;\n display: flex;\n justify-content: center;\n align-items: center;\n }\n\n .indicator slot[name='indicator'] svg {\n width: ${iconSize};\n height: ${iconSize};\n fill: ${bodyFontColor};\n }\n\n :host([disabled]) .indicator slot[name='indicator'] svg {\n fill: ${bodyDisabledFontColor};\n }\n\n [part='end'] {\n margin-inline-start: auto;\n }\n\n ::slotted([role='option']),\n ::slotted(option) {\n flex: none;\n }\n`.withBehaviors(\n appearanceBehavior(\n DropdownAppearance.underline,\n css`\n .control {\n border-bottom-width: ${borderWidth};\n padding-bottom: 0;\n }\n\n :host([disabled]) .control {\n border-color: rgba(${borderRgbPartialColor}, 0.1);\n }\n `\n ),\n appearanceBehavior(\n DropdownAppearance.outline,\n css`\n .control {\n border-width: ${borderWidth};\n padding: 0;\n }\n `\n ),\n appearanceBehavior(\n DropdownAppearance.block,\n css`\n .control {\n background-color: rgba(${borderRgbPartialColor}, 0.1);\n }\n\n .control:focus-within {\n border-bottom-width: ${borderWidth};\n padding-bottom: 0;\n }\n\n :host([disabled]) .control {\n background-color: rgba(${borderRgbPartialColor}, 0.07);\n }\n `\n ),\n themeBehavior(\n Theme.color,\n css`\n .listbox slot {\n background: ${hexToRgbaCssColor(White, 0.15)};\n }\n `\n )\n);\n"]}

package/dist/esm/select/index.d.ts CHANGED Viewed

@@ -88,11 +88,11 @@ export declare class Select extends FormAssociatedSelect implements ErrorPattern
      */
     filter: string;
     /**
-     * The max height for the listbox when opened.
+     * The space available in the viewport for the listbox when opened.
      *
      * @internal
      */
-    maxHeight: number;
+    availableViewportHeight: number;
     /**
      * The component is collapsible when in single-selection mode with no size attribute.
      *
@@ -304,9 +304,7 @@ export declare class Select extends FormAssociatedSelect implements ErrorPattern
     private setProxyOptions;
     private filterChanged;
     private emitFilterInputEvent;
-    private maxHeightChanged;
     private initializeOpenState;
-    private updateListboxMaxHeightCssVariable;
 }
 export declare const selectTag = "nimble-select";
 export {};

package/dist/esm/select/index.js CHANGED Viewed

@@ -57,11 +57,11 @@ export class Select extends FormAssociatedSelect {
          */
         this.filter = '';
         /**
-         * The max height for the listbox when opened.
+         * The space available in the viewport for the listbox when opened.
          *
          * @internal
          */
-        this.maxHeight = 0;
+        this.availableViewportHeight = 0;
         this._value = '';
         this.forcedPosition = false;
     }
@@ -762,10 +762,9 @@ export class Select extends FormAssociatedSelect {
         this.positionAttribute = this.forcedPosition
             ? this.positionAttribute
             : this.position;
-        this.maxHeight = this.position === SelectPosition.above
+        this.availableViewportHeight = this.position === SelectPosition.above
             ? Math.trunc(currentBox.top)
             : Math.trunc(availableBottom);
-        this.updateListboxMaxHeightCssVariable();
     }
     updateAdjacentSeparatorState(element) {
         const previousElement = this.getPreviousVisibleOptionOrGroup(element);
@@ -928,9 +927,6 @@ export class Select extends FormAssociatedSelect {
         };
         this.$emit('filter-input', eventDetail, { bubbles: true });
     }
-    maxHeightChanged() {
-        this.updateListboxMaxHeightCssVariable();
-    }
     initializeOpenState() {
         this.setActiveOption(this.selectedIndex);
         this.ariaControls = this.listboxId;
@@ -938,11 +934,6 @@ export class Select extends FormAssociatedSelect {
         this.setPositioning();
         this.focusAndScrollOptionIntoView();
     }
-    updateListboxMaxHeightCssVariable() {
-        if (this.listbox) {
-            this.listbox.style.setProperty('--ni-private-select-max-height', `${this.maxHeight}px`);
-        }
-    }
 }
 __decorate([
     attr
@@ -997,7 +988,7 @@ __decorate([
 ], Select.prototype, "filter", void 0);
 __decorate([
     observable
-], Select.prototype, "maxHeight", void 0);
+], Select.prototype, "availableViewportHeight", void 0);
 __decorate([
     volatile
 ], Select.prototype, "collapsible", null);