@ng-matero/extensions 19.4.1 → 20.0.1

package/select/_m2-select.scss

@@ -0,0 +1,79 @@
+@use 'sass:map';
+@use 'sass:math';
+@use '@angular/material' as mat;
+@use '../core/tokens/m2-utils';
+@use '../core/style/elevation';
+
+// Generates the tokens used to theme the option based on a palette.
+@function private-get-color-palette-color-tokens($theme, $palette-name) {
+  @return (
+    select-option-selected-state-text-color: mat.get-theme-color($theme, $palette-name),
+  );
+}
+
+// Tokens that can't be configured through Angular Material's current theming API,
+// but may be in a future version of the theming API.
+@function get-unthemable-tokens() {
+  @return (
+    select-container-shape: 4px,
+    select-container-elevation-shadow: elevation.get-box-shadow(8),
+  );
+}
+
+// Tokens that can be configured through Angular Material's color theming API.
+@function get-color-tokens($theme) {
+  $text-color: mat.get-theme-color($theme, foreground, text);
+  $hint-text-color: mat.get-theme-color($theme, foreground, hint-text);
+  $secondary-text-color: mat.get-theme-color($theme, foreground, secondary-text);
+  $disabled-text-color: mat.get-theme-color($theme, foreground, disabled-text);
+  $divider-color: mat.get-theme-color($theme, foreground, divider);
+  $hover-color: mat.get-theme-color($theme, background, hover);
+  $palette-tokens: private-get-color-palette-color-tokens($theme, primary);
+
+  @return map.merge($palette-tokens, (
+    select-container-text-color: $text-color,
+    select-placeholder-text-color: $hint-text-color,
+    select-disabled-text-color: $hint-text-color,
+
+    select-multiple-value-background-color: mat.get-theme-color($theme, background, unselected-chip),
+    select-multiple-value-outline-color: $divider-color,
+    select-multiple-value-disabled-outline-color: mat.get-theme-color($theme, foreground, divider, 0.06),
+    select-multiple-value-icon-hover-background-color: $divider-color,
+
+    select-clear-icon-color: $secondary-text-color,
+    select-clear-icon-hover-color: mat.get-theme-color($theme, warn),
+
+    select-enabled-arrow-color: $secondary-text-color,
+    select-disabled-arrow-color: $disabled-text-color,
+    select-invalid-arrow-color: mat.get-theme-color($theme, warn),
+
+    select-panel-background-color: mat.get-theme-color($theme, background, card),
+    select-panel-divider-color: $divider-color,
+    select-optgroup-label-text-color: $secondary-text-color,
+    select-option-label-text-color: $text-color,
+    select-option-selected-state-background-color: $hover-color,
+    select-option-hover-state-background-color: $hover-color,
+    select-option-disabled-state-text-color: $hint-text-color,
+  ));
+}
+
+// Tokens that can be configured through Angular Material's typography theming API.
+@function get-typography-tokens($theme) {
+  @return ();
+}
+
+// Tokens that can be configured through Angular Material's density theming API.
+@function get-density-tokens($theme) {
+  @return ();
+}
+
+// Combines the tokens generated by the above functions into a single map with placeholder values.
+// This is used to create token slots.
+@function get-token-slots() {
+  @return mat.private-deep-merge-all(
+    get-unthemable-tokens(),
+    get-color-tokens(m2-utils.$placeholder-color-config),
+    get-typography-tokens(m2-utils.$placeholder-typography-config),
+    get-density-tokens(m2-utils.$placeholder-density-config)
+  );
+}

package/select/_m3-select.scss

@@ -0,0 +1,46 @@
+@use 'sass:map';
+@use '@angular/material' as mat;
+@use '../core/tokens/m3-utils';
+@use '../core/tokens/m3';
+@use '../core/style/elevation';
+
+/// Generates custom tokens for the mtx-select.
+@function get-tokens($theme: m3.$sys-theme, $color-variant: null) {
+  $system: m3-utils.get-system($theme);
+  @if $color-variant {
+    $system: m3-utils.replace-colors-with-variant($system, secondary, $color-variant);
+  }
+
+  $tokens: (
+    base: (
+      select-container-shape: map.get($system, corner-extra-small),
+      select-container-elevation-shadow: elevation.get-box-shadow(2),
+    ),
+    color: (
+      select-container-text-color: map.get($system, on-surface),
+      select-placeholder-text-color: m3-utils.color-with-opacity(map.get($system, on-surface), 38%),
+      select-disabled-text-color: m3-utils.color-with-opacity(map.get($system, on-surface), 38%),
+      select-multiple-value-background-color: transparent,
+      select-multiple-value-outline-color: map.get($system, outline),
+      select-multiple-value-disabled-outline-color: m3-utils.color-with-opacity(map.get($system, outline), 38%),
+      select-multiple-value-icon-hover-background-color: map.get($system, outline-variant),
+      select-clear-icon-color: map.get($system, on-surface),
+      select-clear-icon-hover-color: map.get($system, error),
+      select-enabled-arrow-color: map.get($system, on-surface),
+      select-disabled-arrow-color: m3-utils.color-with-opacity(map.get($system, on-surface), 38%),
+      select-invalid-arrow-color: map.get($system, error),
+      select-panel-background-color: map.get($system, surface-container),
+      select-panel-divider-color: map.get($system, outline),
+      select-optgroup-label-text-color: map.get($system, on-surface),
+      select-option-label-text-color: map.get($system, on-surface),
+      select-option-selected-state-background-color: map.get($system, secondary-container),
+      select-option-selected-state-text-color: map.get($system, on-surface),
+      select-option-hover-state-background-color: m3-utils.color-with-opacity(map.get($system, on-surface), map.get($system,hover-state-layer-opacity)),
+      select-option-disabled-state-text-color: m3-utils.color-with-opacity(map.get($system, on-surface), 38%),
+    ),
+    typography: (),
+    density: (),
+  );
+
+  @return $tokens;
+}

package/select/_select-theme.scss

@@ -1,45 +1,38 @@
 @use 'sass:map';
 @use '@angular/material' as mat;
-@use '../core/theming/inspection';
-@use '../core/theming/validation';
 @use '../core/tokens/token-utils';
-@use '../core/tokens/m2/mtx/select' as tokens-mtx-select;
+@use './m2-select';
+@use './m3-select';
 
 @mixin base($theme) {
   @if mat.get-theme-version($theme) == 1 {
-    @include _theme-from-tokens(inspection.get-theme-tokens($theme, base));
+    @include token-utils.create-token-values(map.get(m3-select.get-tokens($theme), base));
   }
   @else {
     @include mat.private-current-selector-or-root() {
-      @include token-utils.create-token-values(
-        tokens-mtx-select.$prefix,
-        tokens-mtx-select.get-unthemable-tokens()
-      );
+      @include token-utils.create-token-values-mixed(m2-select.get-unthemable-tokens());
     }
   }
 }
 
-@mixin color($theme, $options...) {
+@mixin color($theme, $color-variant: null) {
   @if mat.get-theme-version($theme) == 1 {
-    @include _theme-from-tokens(inspection.get-theme-tokens($theme, color), $options...);
+    @include token-utils.create-token-values(map.get(m3-select.get-tokens($theme, $color-variant), color));
   }
   @else {
     @include mat.private-current-selector-or-root() {
-      @include token-utils.create-token-values(
-        tokens-mtx-select.$prefix,
-        tokens-mtx-select.get-color-tokens($theme)
-      );
+      @include token-utils.create-token-values-mixed(m2-select.get-color-tokens($theme));
     }
 
     .ng-dropdown-panel {
       &.mat-accent {
-        $accent-tokens: tokens-mtx-select.private-get-color-palette-color-tokens($theme, accent);
-        @include token-utils.create-token-values(tokens-mtx-select.$prefix, $accent-tokens);
+        $accent-tokens: m2-select.private-get-color-palette-color-tokens($theme, accent);
+        @include token-utils.create-token-values-mixed($accent-tokens);
       }
 
       &.mat-warn {
-        $warn-tokens: tokens-mtx-select.private-get-color-palette-color-tokens($theme, warn);
-        @include token-utils.create-token-values(tokens-mtx-select.$prefix, $warn-tokens);
+        $warn-tokens: m2-select.private-get-color-palette-color-tokens($theme, warn);
+        @include token-utils.create-token-values-mixed($warn-tokens);
       }
     }
   }
@@ -47,21 +40,22 @@
 
 @mixin typography($theme) {
   @if mat.get-theme-version($theme) == 1 {
-    @include _theme-from-tokens(inspection.get-theme-tokens($theme, typography));
+    @include token-utils.create-token-values(map.get(m3-select.get-tokens($theme), typography));
+  }
+  @else {
+    @include mat.private-current-selector-or-root() {
+      @include token-utils.create-token-values-mixed(m2-select.get-typography-tokens($theme));
+    }
   }
-  @else {}
 }
 
 @mixin density($theme) {
   @if mat.get-theme-version($theme) == 1 {
-    @include _theme-from-tokens(inspection.get-theme-tokens($theme, density));
+    @include token-utils.create-token-values(map.get(m3-select.get-tokens($theme), density));
   }
   @else {
     @include mat.private-current-selector-or-root() {
-      @include token-utils.create-token-values(
-        tokens-mtx-select.$prefix,
-        tokens-mtx-select.get-density-tokens($theme)
-      );
+      @include token-utils.create-token-values-mixed(m2-select.get-density-tokens($theme));
     }
   }
 }
@@ -70,20 +64,23 @@
 @function _define-overrides() {
   @return (
     (
-      namespace: tokens-mtx-select.$prefix,
-      tokens: tokens-mtx-select.get-token-slots(),
+      namespace: select,
+      tokens: token-utils.get-overrides(m3-select.get-tokens(), select),
     ),
   );
 }
 
 @mixin overrides($tokens: ()) {
-  @include token-utils.batch-create-token-values($tokens, _define-overrides()...);
+  @include token-utils.batch-create-token-values($tokens, _define-overrides());
 }
 
-@mixin theme($theme, $options...) {
+@mixin theme($theme, $color-variant: null) {
   @include mat.private-check-duplicate-theme-styles($theme, 'mtx-select') {
     @if mat.get-theme-version($theme) == 1 {
-      @include _theme-from-tokens(inspection.get-theme-tokens($theme), $options...);
+      @include base($theme);
+      @include color($theme, $color-variant);
+      @include density($theme);
+      @include typography($theme);
     }
     @else {
       @include base($theme);
@@ -99,10 +96,3 @@
     }
   }
 }
-
-@mixin _theme-from-tokens($tokens, $options...) {
-  @include validation.selector-defined(
-    'Calls to Angular Material theme mixins with an M3 theme must be wrapped in a selector');
-  $mtx-select-tokens: token-utils.get-tokens-for($tokens, tokens-mtx-select.$prefix, $options...);
-  @include token-utils.create-token-values(tokens-mtx-select.$prefix, $mtx-select-tokens);
-}

package/select/index.d.ts

@@ -1,5 +1,383 @@
+import * as i0 from '@angular/core';
+import { OnChanges, AfterViewChecked, OnDestroy, ElementRef, SimpleChanges, InjectionToken, OnInit, DoCheck, AfterViewInit, ChangeDetectorRef, TemplateRef, QueryList, EventEmitter } from '@angular/core';
+import * as i1 from '@angular/common';
+import * as i2 from '@angular/forms';
+import { ControlValueAccessor, NgControl } from '@angular/forms';
+import * as i3 from '@ng-select/ng-select';
+import { NgSelectComponent } from '@ng-select/ng-select';
+import { FocusMonitor } from '@angular/cdk/a11y';
+import { ErrorStateMatcher } from '@angular/material/core';
+import { MatFormFieldControl, MatFormField } from '@angular/material/form-field';
+import { Subject } from 'rxjs';
+
+declare class MtxOption implements OnChanges, AfterViewChecked, OnDestroy {
+    elementRef: ElementRef<HTMLElement>;
+    value: any;
+    disabled: boolean;
+    get label(): string;
+    private _previousLabel?;
+    readonly stateChange$: Subject<{
+        value: any;
+        disabled: boolean;
+        label?: string;
+    }>;
+    ngOnChanges(changes: SimpleChanges): void;
+    ngAfterViewChecked(): void;
+    ngOnDestroy(): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<MtxOption, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<MtxOption, "mtx-option", ["mtxOption"], { "value": { "alias": "value"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; }, {}, never, ["*"], true, never>;
+    static ngAcceptInputType_disabled: unknown;
+}
+
+declare class MtxSelectIntl {
+    private _defaultOptions;
+    /**
+     * Stream to emit from when labels are changed. Use this to notify components when the labels have
+     * changed after initialization.
+     */
+    readonly changes: Subject<void>;
+    placeholder: string | undefined;
+    notFoundText: string;
+    typeToSearchText: string;
+    addTagText: string;
+    loadingText: string;
+    clearAllText: string;
+    static ɵfac: i0.ɵɵFactoryDeclaration<MtxSelectIntl, never>;
+    static ɵprov: i0.ɵɵInjectableDeclaration<MtxSelectIntl>;
+}
+
+type DropdownPosition = 'bottom' | 'top' | 'auto';
+type AddTagFn = (term: string) => any;
+type CompareWithFn = (a: any, b: any) => boolean;
+type GroupValueFn = (key: string | Record<string, any>, children: any[]) => string | Record<string, any>;
+type SearchFn = (term: string, item: any) => boolean;
+type TrackByFn = (item: any) => any;
 /**
- * Generated bundle index. Do not edit.
+ * Represents the default options for the select that can be configured
+ * using the `MTX_SELECT_DEFAULT_OPTIONS` injection token.
  */
-/// <amd-module name="@ng-matero/extensions/select" />
-export * from './public-api';
+interface MtxSelectDefaultOptions {
+    placeholder?: string;
+    notFoundText?: string;
+    typeToSearchText?: string;
+    addTagText?: string;
+    loadingText?: string;
+    clearAllText?: string;
+    appendTo?: string;
+    bindValue?: string;
+    bindLabel?: string;
+    openOnEnter?: boolean;
+    clearSearchOnAdd?: boolean;
+    virtualScroll?: boolean;
+    fixedPlaceholder?: boolean;
+    deselectOnClick?: boolean;
+}
+/** Injection token that can be used to specify default select options. */
+declare const MTX_SELECT_DEFAULT_OPTIONS: InjectionToken<MtxSelectDefaultOptions>;
+declare class MtxSelect implements OnInit, OnDestroy, DoCheck, AfterViewInit, ControlValueAccessor, MatFormFieldControl<any> {
+    protected _intl: MtxSelectIntl;
+    protected _changeDetectorRef: ChangeDetectorRef;
+    protected _elementRef: ElementRef<any>;
+    protected _focusMonitor: FocusMonitor;
+    ngControl: NgControl | null;
+    protected _parentFormField?: MatFormField | null | undefined;
+    protected _defaultOptions?: MtxSelectDefaultOptions | null | undefined;
+    private _document;
+    ngSelect: NgSelectComponent;
+    optionTemplate: TemplateRef<any>;
+    optgroupTemplate: TemplateRef<any>;
+    labelTemplate: TemplateRef<any>;
+    multiLabelTemplate: TemplateRef<any>;
+    headerTemplate: TemplateRef<any>;
+    footerTemplate: TemplateRef<any>;
+    notFoundTemplate: TemplateRef<any>;
+    typeToSearchTemplate: TemplateRef<any>;
+    loadingTextTemplate: TemplateRef<any>;
+    tagTemplate: TemplateRef<any>;
+    loadingSpinnerTemplate: TemplateRef<any>;
+    placeholderTemplate: TemplateRef<any>;
+    clearbuttonTemplate: TemplateRef<any>;
+    mtxOptions: QueryList<MtxOption>;
+    addTag: boolean | AddTagFn;
+    addTagText?: string;
+    appearance: string;
+    appendTo: string;
+    bindLabel: string | undefined;
+    bindValue: string | undefined;
+    closeOnSelect: boolean;
+    clearAllText?: string;
+    clearable: boolean;
+    clearOnBackspace: boolean;
+    compareWith: CompareWithFn;
+    dropdownPosition: DropdownPosition;
+    groupBy: string | ((value: any) => any);
+    groupValue: GroupValueFn;
+    bufferAmount: number;
+    selectableGroup: boolean;
+    selectableGroupAsModel: boolean;
+    hideSelected: boolean;
+    loading: boolean;
+    loadingText?: string;
+    labelForId: string | null;
+    markFirst: boolean;
+    maxSelectedItems: number;
+    multiple: boolean;
+    notFoundText?: string;
+    searchable: boolean;
+    readonly: boolean;
+    searchFn: SearchFn | null;
+    searchWhileComposing: boolean;
+    selectOnTab: boolean;
+    trackByFn: TrackByFn | null;
+    inputAttrs: {
+        [key: string]: string;
+    };
+    tabIndex: number;
+    openOnEnter: boolean;
+    minTermLength: number;
+    editableSearchTerm: boolean;
+    keyDownFn: (_: KeyboardEvent) => boolean;
+    virtualScroll: boolean;
+    typeToSearchText?: string;
+    typeahead: Subject<string>;
+    isOpen?: boolean;
+    fixedPlaceholder: boolean;
+    deselectOnClick: boolean;
+    blurEvent: EventEmitter<any>;
+    focusEvent: EventEmitter<any>;
+    changeEvent: EventEmitter<any>;
+    openEvent: EventEmitter<any>;
+    closeEvent: EventEmitter<any>;
+    searchEvent: EventEmitter<{
+        term: string;
+        items: any[];
+    }>;
+    clearEvent: EventEmitter<any>;
+    addEvent: EventEmitter<any>;
+    removeEvent: EventEmitter<any>;
+    scroll: EventEmitter<{
+        start: number;
+        end: number;
+    }>;
+    scrollToEnd: EventEmitter<any>;
+    get clearSearchOnAdd(): boolean;
+    set clearSearchOnAdd(value: boolean);
+    private _clearSearchOnAdd;
+    get items(): any[];
+    set items(value: any[]);
+    private _items;
+    private _itemsAreUsed;
+    /** Emits whenever the component is destroyed. */
+    private readonly _destroy$;
+    /** Value of the select control. */
+    get value(): any;
+    set value(newValue: any);
+    private _value;
+    /** Implemented as part of MatFormFieldControl. */
+    readonly stateChanges: Subject<void>;
+    /** Unique id of the element. */
+    get id(): string;
+    set id(value: string);
+    private _id;
+    /** Unique id for this select. */
+    private _uid;
+    /** Placeholder to be shown if value is empty. */
+    get placeholder(): string;
+    set placeholder(value: string);
+    private _placeholder;
+    /** Whether the select is focused. */
+    get focused(): boolean;
+    private _focused;
+    /** Whether the select has a value. */
+    get empty(): boolean;
+    /**
+     * Implemented as part of MatFormFieldControl.
+     * @docs-private
+     */
+    get shouldLabelFloat(): boolean;
+    /** Whether the select is disabled. */
+    disabled: boolean;
+    /** Whether the component is required. */
+    get required(): boolean;
+    set required(value: boolean);
+    private _required;
+    /** Object used to control when error messages are shown. */
+    get errorStateMatcher(): ErrorStateMatcher;
+    set errorStateMatcher(value: ErrorStateMatcher);
+    /** Aria label of the select. */
+    ariaLabel: string;
+    /** Input that can be used to specify the `aria-labelledby` attribute. */
+    ariaLabelledby: string | null;
+    /** The aria-describedby attribute on the select for improved a11y. */
+    _ariaDescribedby: string | null;
+    /** A name for this control that can be used by `mat-form-field`. */
+    controlType: string;
+    /** `View -> model callback called when value changes` */
+    _onChange: (value: any) => void;
+    /** `View -> model callback called when select has been touched` */
+    _onTouched: () => void;
+    /** ID for the DOM node containing the select's value. */
+    _valueId: string;
+    /** Whether or not the overlay panel is open. */
+    get panelOpen(): boolean;
+    /**
+     * Keeps track of the previous form control assigned to the select.
+     * Used to detect if it has changed.
+     */
+    private _previousControl;
+    /** Tracks the error state of the select. */
+    private _errorStateTracker;
+    /** Whether the select is in an error state. */
+    get errorState(): boolean;
+    set errorState(value: boolean);
+    private _intlChangesSubscription;
+    constructor();
+    ngOnInit(): void;
+    ngAfterViewInit(): void;
+    ngDoCheck(): void;
+    ngOnDestroy(): void;
+    /** Gets the value for the `aria-labelledby` attribute of the inputs. */
+    _getAriaLabelledby(): string | null;
+    /** Implemented as part of MatFormFieldControl. */
+    setDescribedByIds(ids: string[]): void;
+    /**
+     * Disables the select. Part of the ControlValueAccessor interface required
+     * to integrate with Angular's core forms API.
+     *
+     * @param isDisabled Sets whether the component is disabled.
+     */
+    setDisabledState(isDisabled: boolean): void;
+    /** Implemented as part of MatFormFieldControl. */
+    onContainerClick(event: MouseEvent): void;
+    /**
+     * Sets the select's value. Part of the ControlValueAccessor interface
+     * required to integrate with Angular's core forms API.
+     *
+     * @param value New value to be written to the model.
+     */
+    writeValue(value: any): void;
+    /**
+     * Saves a callback function to be invoked when the select's value
+     * changes from user input. Part of the ControlValueAccessor interface
+     * required to integrate with Angular's core forms API.
+     *
+     * @param fn Callback to be triggered when the value changes.
+     */
+    registerOnChange(fn: any): void;
+    /**
+     * Saves a callback function to be invoked when the select is blurred
+     * by the user. Part of the ControlValueAccessor interface required
+     * to integrate with Angular's core forms API.
+     *
+     * @param fn Callback to be triggered when the component has been touched.
+     */
+    registerOnTouched(fn: any): void;
+    /** Refreshes the error state of the select. */
+    updateErrorState(): void;
+    /** Assigns a specific value to the select. Returns whether the value has changed. */
+    private _assignValue;
+    /** NgSelect's `_setItemsFromNgOptions` */
+    private _setItemsFromMtxOptions;
+    open(): void;
+    close(): void;
+    focus(): void;
+    blur(): void;
+    openChange(): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<MtxSelect, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<MtxSelect, "mtx-select", ["mtxSelect"], { "addTag": { "alias": "addTag"; "required": false; }; "addTagText": { "alias": "addTagText"; "required": false; }; "appearance": { "alias": "appearance"; "required": false; }; "appendTo": { "alias": "appendTo"; "required": false; }; "bindLabel": { "alias": "bindLabel"; "required": false; }; "bindValue": { "alias": "bindValue"; "required": false; }; "closeOnSelect": { "alias": "closeOnSelect"; "required": false; }; "clearAllText": { "alias": "clearAllText"; "required": false; }; "clearable": { "alias": "clearable"; "required": false; }; "clearOnBackspace": { "alias": "clearOnBackspace"; "required": false; }; "compareWith": { "alias": "compareWith"; "required": false; }; "dropdownPosition": { "alias": "dropdownPosition"; "required": false; }; "groupBy": { "alias": "groupBy"; "required": false; }; "groupValue": { "alias": "groupValue"; "required": false; }; "bufferAmount": { "alias": "bufferAmount"; "required": false; }; "selectableGroup": { "alias": "selectableGroup"; "required": false; }; "selectableGroupAsModel": { "alias": "selectableGroupAsModel"; "required": false; }; "hideSelected": { "alias": "hideSelected"; "required": false; }; "loading": { "alias": "loading"; "required": false; }; "loadingText": { "alias": "loadingText"; "required": false; }; "labelForId": { "alias": "labelForId"; "required": false; }; "markFirst": { "alias": "markFirst"; "required": false; }; "maxSelectedItems": { "alias": "maxSelectedItems"; "required": false; }; "multiple": { "alias": "multiple"; "required": false; }; "notFoundText": { "alias": "notFoundText"; "required": false; }; "searchable": { "alias": "searchable"; "required": false; }; "readonly": { "alias": "readonly"; "required": false; }; "searchFn": { "alias": "searchFn"; "required": false; }; "searchWhileComposing": { "alias": "searchWhileComposing"; "required": false; }; "selectOnTab": { "alias": "selectOnTab"; "required": false; }; "trackByFn": { "alias": "trackByFn"; "required": false; }; "inputAttrs": { "alias": "inputAttrs"; "required": false; }; "tabIndex": { "alias": "tabIndex"; "required": false; }; "openOnEnter": { "alias": "openOnEnter"; "required": false; }; "minTermLength": { "alias": "minTermLength"; "required": false; }; "editableSearchTerm": { "alias": "editableSearchTerm"; "required": false; }; "keyDownFn": { "alias": "keyDownFn"; "required": false; }; "virtualScroll": { "alias": "virtualScroll"; "required": false; }; "typeToSearchText": { "alias": "typeToSearchText"; "required": false; }; "typeahead": { "alias": "typeahead"; "required": false; }; "isOpen": { "alias": "isOpen"; "required": false; }; "fixedPlaceholder": { "alias": "fixedPlaceholder"; "required": false; }; "deselectOnClick": { "alias": "deselectOnClick"; "required": false; }; "clearSearchOnAdd": { "alias": "clearSearchOnAdd"; "required": false; }; "items": { "alias": "items"; "required": false; }; "value": { "alias": "value"; "required": false; }; "id": { "alias": "id"; "required": false; }; "placeholder": { "alias": "placeholder"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; "required": { "alias": "required"; "required": false; }; "errorStateMatcher": { "alias": "errorStateMatcher"; "required": false; }; "ariaLabel": { "alias": "aria-label"; "required": false; }; "ariaLabelledby": { "alias": "aria-labelledby"; "required": false; }; }, { "blurEvent": "blur"; "focusEvent": "focus"; "changeEvent": "change"; "openEvent": "open"; "closeEvent": "close"; "searchEvent": "search"; "clearEvent": "clear"; "addEvent": "add"; "removeEvent": "remove"; "scroll": "scroll"; "scrollToEnd": "scrollToEnd"; }, ["optionTemplate", "optgroupTemplate", "labelTemplate", "multiLabelTemplate", "headerTemplate", "footerTemplate", "notFoundTemplate", "typeToSearchTemplate", "loadingTextTemplate", "tagTemplate", "loadingSpinnerTemplate", "placeholderTemplate", "clearbuttonTemplate", "mtxOptions"], never, true, never>;
+    static ngAcceptInputType_closeOnSelect: unknown;
+    static ngAcceptInputType_clearable: unknown;
+    static ngAcceptInputType_clearOnBackspace: unknown;
+    static ngAcceptInputType_selectableGroup: unknown;
+    static ngAcceptInputType_selectableGroupAsModel: unknown;
+    static ngAcceptInputType_hideSelected: unknown;
+    static ngAcceptInputType_loading: unknown;
+    static ngAcceptInputType_markFirst: unknown;
+    static ngAcceptInputType_multiple: unknown;
+    static ngAcceptInputType_searchable: unknown;
+    static ngAcceptInputType_readonly: unknown;
+    static ngAcceptInputType_searchWhileComposing: unknown;
+    static ngAcceptInputType_selectOnTab: unknown;
+    static ngAcceptInputType_openOnEnter: unknown;
+    static ngAcceptInputType_editableSearchTerm: unknown;
+    static ngAcceptInputType_virtualScroll: unknown;
+    static ngAcceptInputType_fixedPlaceholder: unknown;
+    static ngAcceptInputType_deselectOnClick: unknown;
+    static ngAcceptInputType_disabled: unknown;
+    static ngAcceptInputType_required: unknown;
+}
+
+declare class MtxSelectOptionTemplate {
+    template: TemplateRef<any>;
+    static ɵfac: i0.ɵɵFactoryDeclaration<MtxSelectOptionTemplate, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<MtxSelectOptionTemplate, "[ng-option-tmp]", never, {}, {}, never, never, true, never>;
+}
+declare class MtxSelectOptgroupTemplate {
+    template: TemplateRef<any>;
+    static ɵfac: i0.ɵɵFactoryDeclaration<MtxSelectOptgroupTemplate, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<MtxSelectOptgroupTemplate, "[ng-optgroup-tmp]", never, {}, {}, never, never, true, never>;
+}
+declare class MtxSelectLabelTemplate {
+    template: TemplateRef<any>;
+    static ɵfac: i0.ɵɵFactoryDeclaration<MtxSelectLabelTemplate, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<MtxSelectLabelTemplate, "[ng-label-tmp]", never, {}, {}, never, never, true, never>;
+}
+declare class MtxSelectMultiLabelTemplate {
+    template: TemplateRef<any>;
+    static ɵfac: i0.ɵɵFactoryDeclaration<MtxSelectMultiLabelTemplate, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<MtxSelectMultiLabelTemplate, "[ng-multi-label-tmp]", never, {}, {}, never, never, true, never>;
+}
+declare class MtxSelectHeaderTemplate {
+    template: TemplateRef<any>;
+    static ɵfac: i0.ɵɵFactoryDeclaration<MtxSelectHeaderTemplate, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<MtxSelectHeaderTemplate, "[ng-header-tmp]", never, {}, {}, never, never, true, never>;
+}
+declare class MtxSelectFooterTemplate {
+    template: TemplateRef<any>;
+    static ɵfac: i0.ɵɵFactoryDeclaration<MtxSelectFooterTemplate, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<MtxSelectFooterTemplate, "[ng-footer-tmp]", never, {}, {}, never, never, true, never>;
+}
+declare class MtxSelectNotFoundTemplate {
+    template: TemplateRef<any>;
+    static ɵfac: i0.ɵɵFactoryDeclaration<MtxSelectNotFoundTemplate, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<MtxSelectNotFoundTemplate, "[ng-notfound-tmp]", never, {}, {}, never, never, true, never>;
+}
+declare class MtxSelectTypeToSearchTemplate {
+    template: TemplateRef<any>;
+    static ɵfac: i0.ɵɵFactoryDeclaration<MtxSelectTypeToSearchTemplate, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<MtxSelectTypeToSearchTemplate, "[ng-typetosearch-tmp]", never, {}, {}, never, never, true, never>;
+}
+declare class MtxSelectLoadingTextTemplate {
+    template: TemplateRef<any>;
+    static ɵfac: i0.ɵɵFactoryDeclaration<MtxSelectLoadingTextTemplate, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<MtxSelectLoadingTextTemplate, "[ng-loadingtext-tmp]", never, {}, {}, never, never, true, never>;
+}
+declare class MtxSelectTagTemplate {
+    template: TemplateRef<any>;
+    static ɵfac: i0.ɵɵFactoryDeclaration<MtxSelectTagTemplate, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<MtxSelectTagTemplate, "[ng-tag-tmp]", never, {}, {}, never, never, true, never>;
+}
+declare class MtxSelectLoadingSpinnerTemplate {
+    template: TemplateRef<any>;
+    static ɵfac: i0.ɵɵFactoryDeclaration<MtxSelectLoadingSpinnerTemplate, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<MtxSelectLoadingSpinnerTemplate, "[ng-loadingspinner-tmp]", never, {}, {}, never, never, true, never>;
+}
+declare class MtxSelectPlaceholderTemplate {
+    template: TemplateRef<any>;
+    static ɵfac: i0.ɵɵFactoryDeclaration<MtxSelectPlaceholderTemplate, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<MtxSelectPlaceholderTemplate, "[ng-placeholder-tmp]", never, {}, {}, never, never, true, never>;
+}
+declare class MtxSelectClearbuttonTemplate {
+    template: TemplateRef<any>;
+    static ɵfac: i0.ɵɵFactoryDeclaration<MtxSelectClearbuttonTemplate, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<MtxSelectClearbuttonTemplate, "[ng-clearbutton-tmp]", never, {}, {}, never, never, true, never>;
+}
+
+declare class MtxSelectModule {
+    static ɵfac: i0.ɵɵFactoryDeclaration<MtxSelectModule, never>;
+    static ɵmod: i0.ɵɵNgModuleDeclaration<MtxSelectModule, never, [typeof i1.CommonModule, typeof i2.FormsModule, typeof i2.ReactiveFormsModule, typeof i3.NgSelectModule, typeof MtxSelect, typeof MtxOption, typeof MtxSelectOptgroupTemplate, typeof MtxSelectOptionTemplate, typeof MtxSelectLabelTemplate, typeof MtxSelectMultiLabelTemplate, typeof MtxSelectHeaderTemplate, typeof MtxSelectFooterTemplate, typeof MtxSelectNotFoundTemplate, typeof MtxSelectTypeToSearchTemplate, typeof MtxSelectLoadingTextTemplate, typeof MtxSelectTagTemplate, typeof MtxSelectLoadingSpinnerTemplate, typeof MtxSelectPlaceholderTemplate, typeof MtxSelectClearbuttonTemplate], [typeof MtxSelect, typeof MtxOption, typeof MtxSelectOptgroupTemplate, typeof MtxSelectOptionTemplate, typeof MtxSelectLabelTemplate, typeof MtxSelectMultiLabelTemplate, typeof MtxSelectHeaderTemplate, typeof MtxSelectFooterTemplate, typeof MtxSelectNotFoundTemplate, typeof MtxSelectTypeToSearchTemplate, typeof MtxSelectLoadingTextTemplate, typeof MtxSelectTagTemplate, typeof MtxSelectLoadingSpinnerTemplate, typeof MtxSelectPlaceholderTemplate, typeof MtxSelectClearbuttonTemplate]>;
+    static ɵinj: i0.ɵɵInjectorDeclaration<MtxSelectModule>;
+}
+
+export { MTX_SELECT_DEFAULT_OPTIONS, MtxOption, MtxSelect, MtxSelectClearbuttonTemplate, MtxSelectFooterTemplate, MtxSelectHeaderTemplate, MtxSelectIntl, MtxSelectLabelTemplate, MtxSelectLoadingSpinnerTemplate, MtxSelectLoadingTextTemplate, MtxSelectModule, MtxSelectMultiLabelTemplate, MtxSelectNotFoundTemplate, MtxSelectOptgroupTemplate, MtxSelectOptionTemplate, MtxSelectPlaceholderTemplate, MtxSelectTagTemplate, MtxSelectTypeToSearchTemplate };
+export type { AddTagFn, CompareWithFn, DropdownPosition, GroupValueFn, MtxSelectDefaultOptions, SearchFn, TrackByFn };