| /** |
| * @license |
| * Copyright Google LLC All Rights Reserved. |
| * |
| * Use of this source code is governed by an MIT-style license that can be |
| * found in the LICENSE file at https://angular.io/license |
| */ |
| (function (global, factory) { |
| typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('@angular/cdk/coercion'), require('@angular/cdk/keycodes'), require('@angular/cdk/platform'), require('@angular/core'), require('@angular/material/core'), require('rxjs'), require('rxjs/operators'), require('@angular/platform-browser/animations'), require('@angular/cdk/a11y'), require('@angular/cdk/bidi'), require('@angular/cdk/collections'), require('@angular/forms'), require('@angular/material/form-field')) : |
| typeof define === 'function' && define.amd ? define('@angular/material/chips', ['exports', '@angular/cdk/coercion', '@angular/cdk/keycodes', '@angular/cdk/platform', '@angular/core', '@angular/material/core', 'rxjs', 'rxjs/operators', '@angular/platform-browser/animations', '@angular/cdk/a11y', '@angular/cdk/bidi', '@angular/cdk/collections', '@angular/forms', '@angular/material/form-field'], factory) : |
| (factory((global.ng = global.ng || {}, global.ng.material = global.ng.material || {}, global.ng.material.chips = {}),global.ng.cdk.coercion,global.ng.cdk.keycodes,global.ng.cdk.platform,global.ng.core,global.ng.material.core,global.rxjs,global.rxjs.operators,global.ng.platformBrowser.animations,global.ng.cdk.a11y,global.ng.cdk.bidi,global.ng.cdk.collections,global.ng.forms,global.ng.material.formField)); |
| }(this, (function (exports,coercion,keycodes,platform,core,core$1,rxjs,operators,animations,a11y,bidi,collections,forms,formField) { 'use strict'; |
| |
| /*! *****************************************************************************
|
| Copyright (c) Microsoft Corporation. All rights reserved.
|
| Licensed under the Apache License, Version 2.0 (the "License"); you may not use
|
| this file except in compliance with the License. You may obtain a copy of the
|
| License at http://www.apache.org/licenses/LICENSE-2.0
|
|
|
| THIS CODE IS PROVIDED ON AN *AS IS* BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
|
| KIND, EITHER EXPRESS OR IMPLIED, INCLUDING WITHOUT LIMITATION ANY IMPLIED
|
| WARRANTIES OR CONDITIONS OF TITLE, FITNESS FOR A PARTICULAR PURPOSE,
|
| MERCHANTABLITY OR NON-INFRINGEMENT.
|
|
|
| See the Apache Version 2.0 License for specific language governing permissions
|
| and limitations under the License.
|
| ***************************************************************************** */
|
| /* global Reflect, Promise */
|
|
|
| var extendStatics = function(d, b) {
|
| extendStatics = Object.setPrototypeOf ||
|
| ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
|
| function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
|
| return extendStatics(d, b);
|
| };
|
|
|
| function __extends(d, b) {
|
| extendStatics(d, b);
|
| function __() { this.constructor = d; }
|
| d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
|
| } |
| |
| /** |
| * @fileoverview added by tsickle |
| * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc |
| */ |
| /** |
| * Event object emitted by MatChip when selected or deselected. |
| */ |
| var /** |
| * Event object emitted by MatChip when selected or deselected. |
| */ |
| MatChipSelectionChange = /** @class */ (function () { |
| function MatChipSelectionChange(source, selected, isUserInput) { |
| if (isUserInput === void 0) { isUserInput = false; } |
| this.source = source; |
| this.selected = selected; |
| this.isUserInput = isUserInput; |
| } |
| return MatChipSelectionChange; |
| }()); |
| // Boilerplate for applying mixins to MatChip. |
| /** |
| * \@docs-private |
| */ |
| var |
| // Boilerplate for applying mixins to MatChip. |
| /** |
| * \@docs-private |
| */ |
| MatChipBase = /** @class */ (function () { |
| function MatChipBase(_elementRef) { |
| this._elementRef = _elementRef; |
| } |
| return MatChipBase; |
| }()); |
| /** @type {?} */ |
| var _MatChipMixinBase = core$1.mixinColor(core$1.mixinDisableRipple(core$1.mixinDisabled(MatChipBase)), 'primary'); |
| /** |
| * Dummy directive to add CSS class to chip avatar. |
| * \@docs-private |
| */ |
| var MatChipAvatar = /** @class */ (function () { |
| function MatChipAvatar() { |
| } |
| MatChipAvatar.decorators = [ |
| { type: core.Directive, args: [{ |
| selector: 'mat-chip-avatar, [matChipAvatar]', |
| host: { 'class': 'mat-chip-avatar' } |
| },] }, |
| ]; |
| return MatChipAvatar; |
| }()); |
| /** |
| * Dummy directive to add CSS class to chip trailing icon. |
| * \@docs-private |
| */ |
| var MatChipTrailingIcon = /** @class */ (function () { |
| function MatChipTrailingIcon() { |
| } |
| MatChipTrailingIcon.decorators = [ |
| { type: core.Directive, args: [{ |
| selector: 'mat-chip-trailing-icon, [matChipTrailingIcon]', |
| host: { 'class': 'mat-chip-trailing-icon' } |
| },] }, |
| ]; |
| return MatChipTrailingIcon; |
| }()); |
| /** |
| * Material design styled Chip component. Used inside the MatChipList component. |
| */ |
| var MatChip = /** @class */ (function (_super) { |
| __extends(MatChip, _super); |
| function MatChip(_elementRef, _ngZone, platform$$1, globalRippleOptions, |
| // @breaking-change 8.0.0 `animationMode` parameter to become required. |
| animationMode) { |
| var _this = _super.call(this, _elementRef) || this; |
| _this._elementRef = _elementRef; |
| _this._ngZone = _ngZone; |
| /** |
| * Whether the chip has focus. |
| */ |
| _this._hasFocus = false; |
| /** |
| * Whether the chip list is selectable |
| */ |
| _this.chipListSelectable = true; |
| /** |
| * Whether the chip list is in multi-selection mode. |
| */ |
| _this._chipListMultiple = false; |
| _this._selected = false; |
| _this._selectable = true; |
| _this._removable = true; |
| /** |
| * Emits when the chip is focused. |
| */ |
| _this._onFocus = new rxjs.Subject(); |
| /** |
| * Emits when the chip is blured. |
| */ |
| _this._onBlur = new rxjs.Subject(); |
| /** |
| * Emitted when the chip is selected or deselected. |
| */ |
| _this.selectionChange = new core.EventEmitter(); |
| /** |
| * Emitted when the chip is destroyed. |
| */ |
| _this.destroyed = new core.EventEmitter(); |
| /** |
| * Emitted when a chip is to be removed. |
| */ |
| _this.removed = new core.EventEmitter(); |
| _this._addHostClassName(); |
| _this._chipRipple = new core$1.RippleRenderer(_this, _ngZone, _elementRef, platform$$1); |
| _this._chipRipple.setupTriggerEvents(_elementRef.nativeElement); |
| _this.rippleConfig = globalRippleOptions || {}; |
| _this._animationsDisabled = animationMode === 'NoopAnimations'; |
| return _this; |
| } |
| Object.defineProperty(MatChip.prototype, "rippleDisabled", { |
| /** |
| * Whether ripples are disabled on interaction |
| * @docs-private |
| */ |
| get: /** |
| * Whether ripples are disabled on interaction |
| * \@docs-private |
| * @return {?} |
| */ |
| function () { |
| return this.disabled || this.disableRipple || !!this.rippleConfig.disabled; |
| }, |
| enumerable: true, |
| configurable: true |
| }); |
| Object.defineProperty(MatChip.prototype, "selected", { |
| /** Whether the chip is selected. */ |
| get: /** |
| * Whether the chip is selected. |
| * @return {?} |
| */ |
| function () { return this._selected; }, |
| set: /** |
| * @param {?} value |
| * @return {?} |
| */ |
| function (value) { |
| /** @type {?} */ |
| var coercedValue = coercion.coerceBooleanProperty(value); |
| if (coercedValue !== this._selected) { |
| this._selected = coercedValue; |
| this._dispatchSelectionChange(); |
| } |
| }, |
| enumerable: true, |
| configurable: true |
| }); |
| Object.defineProperty(MatChip.prototype, "value", { |
| /** The value of the chip. Defaults to the content inside `<mat-chip>` tags. */ |
| get: /** |
| * The value of the chip. Defaults to the content inside `<mat-chip>` tags. |
| * @return {?} |
| */ |
| function () { |
| return this._value != undefined |
| ? this._value |
| : this._elementRef.nativeElement.textContent; |
| }, |
| set: /** |
| * @param {?} value |
| * @return {?} |
| */ |
| function (value) { this._value = value; }, |
| enumerable: true, |
| configurable: true |
| }); |
| Object.defineProperty(MatChip.prototype, "selectable", { |
| /** |
| * Whether or not the chip is selectable. When a chip is not selectable, |
| * changes to its selected state are always ignored. By default a chip is |
| * selectable, and it becomes non-selectable if its parent chip list is |
| * not selectable. |
| */ |
| get: /** |
| * Whether or not the chip is selectable. When a chip is not selectable, |
| * changes to its selected state are always ignored. By default a chip is |
| * selectable, and it becomes non-selectable if its parent chip list is |
| * not selectable. |
| * @return {?} |
| */ |
| function () { return this._selectable && this.chipListSelectable; }, |
| set: /** |
| * @param {?} value |
| * @return {?} |
| */ |
| function (value) { |
| this._selectable = coercion.coerceBooleanProperty(value); |
| }, |
| enumerable: true, |
| configurable: true |
| }); |
| Object.defineProperty(MatChip.prototype, "removable", { |
| /** |
| * Determines whether or not the chip displays the remove styling and emits (removed) events. |
| */ |
| get: /** |
| * Determines whether or not the chip displays the remove styling and emits (removed) events. |
| * @return {?} |
| */ |
| function () { return this._removable; }, |
| set: /** |
| * @param {?} value |
| * @return {?} |
| */ |
| function (value) { |
| this._removable = coercion.coerceBooleanProperty(value); |
| }, |
| enumerable: true, |
| configurable: true |
| }); |
| Object.defineProperty(MatChip.prototype, "ariaSelected", { |
| /** The ARIA selected applied to the chip. */ |
| get: /** |
| * The ARIA selected applied to the chip. |
| * @return {?} |
| */ |
| function () { |
| // Remove the `aria-selected` when the chip is deselected in single-selection mode, because |
| // it adds noise to NVDA users where "not selected" will be read out for each chip. |
| return this.selectable && (this._chipListMultiple || this.selected) ? |
| this.selected.toString() : null; |
| }, |
| enumerable: true, |
| configurable: true |
| }); |
| /** |
| * @return {?} |
| */ |
| MatChip.prototype._addHostClassName = /** |
| * @return {?} |
| */ |
| function () { |
| /** @type {?} */ |
| var basicChipAttrName = 'mat-basic-chip'; |
| /** @type {?} */ |
| var element = (/** @type {?} */ (this._elementRef.nativeElement)); |
| if (element.hasAttribute(basicChipAttrName) || |
| element.tagName.toLowerCase() === basicChipAttrName) { |
| element.classList.add(basicChipAttrName); |
| return; |
| } |
| else { |
| element.classList.add('mat-standard-chip'); |
| } |
| }; |
| /** |
| * @return {?} |
| */ |
| MatChip.prototype.ngOnDestroy = /** |
| * @return {?} |
| */ |
| function () { |
| this.destroyed.emit({ chip: this }); |
| this._chipRipple._removeTriggerEvents(); |
| }; |
| /** Selects the chip. */ |
| /** |
| * Selects the chip. |
| * @return {?} |
| */ |
| MatChip.prototype.select = /** |
| * Selects the chip. |
| * @return {?} |
| */ |
| function () { |
| if (!this._selected) { |
| this._selected = true; |
| this._dispatchSelectionChange(); |
| } |
| }; |
| /** Deselects the chip. */ |
| /** |
| * Deselects the chip. |
| * @return {?} |
| */ |
| MatChip.prototype.deselect = /** |
| * Deselects the chip. |
| * @return {?} |
| */ |
| function () { |
| if (this._selected) { |
| this._selected = false; |
| this._dispatchSelectionChange(); |
| } |
| }; |
| /** Select this chip and emit selected event */ |
| /** |
| * Select this chip and emit selected event |
| * @return {?} |
| */ |
| MatChip.prototype.selectViaInteraction = /** |
| * Select this chip and emit selected event |
| * @return {?} |
| */ |
| function () { |
| if (!this._selected) { |
| this._selected = true; |
| this._dispatchSelectionChange(true); |
| } |
| }; |
| /** Toggles the current selected state of this chip. */ |
| /** |
| * Toggles the current selected state of this chip. |
| * @param {?=} isUserInput |
| * @return {?} |
| */ |
| MatChip.prototype.toggleSelected = /** |
| * Toggles the current selected state of this chip. |
| * @param {?=} isUserInput |
| * @return {?} |
| */ |
| function (isUserInput) { |
| if (isUserInput === void 0) { isUserInput = false; } |
| this._selected = !this.selected; |
| this._dispatchSelectionChange(isUserInput); |
| return this.selected; |
| }; |
| /** Allows for programmatic focusing of the chip. */ |
| /** |
| * Allows for programmatic focusing of the chip. |
| * @return {?} |
| */ |
| MatChip.prototype.focus = /** |
| * Allows for programmatic focusing of the chip. |
| * @return {?} |
| */ |
| function () { |
| if (!this._hasFocus) { |
| this._elementRef.nativeElement.focus(); |
| this._onFocus.next({ chip: this }); |
| } |
| this._hasFocus = true; |
| }; |
| /** |
| * Allows for programmatic removal of the chip. Called by the MatChipList when the DELETE or |
| * BACKSPACE keys are pressed. |
| * |
| * Informs any listeners of the removal request. Does not remove the chip from the DOM. |
| */ |
| /** |
| * Allows for programmatic removal of the chip. Called by the MatChipList when the DELETE or |
| * BACKSPACE keys are pressed. |
| * |
| * Informs any listeners of the removal request. Does not remove the chip from the DOM. |
| * @return {?} |
| */ |
| MatChip.prototype.remove = /** |
| * Allows for programmatic removal of the chip. Called by the MatChipList when the DELETE or |
| * BACKSPACE keys are pressed. |
| * |
| * Informs any listeners of the removal request. Does not remove the chip from the DOM. |
| * @return {?} |
| */ |
| function () { |
| if (this.removable) { |
| this.removed.emit({ chip: this }); |
| } |
| }; |
| /** Handles click events on the chip. */ |
| /** |
| * Handles click events on the chip. |
| * @param {?} event |
| * @return {?} |
| */ |
| MatChip.prototype._handleClick = /** |
| * Handles click events on the chip. |
| * @param {?} event |
| * @return {?} |
| */ |
| function (event) { |
| if (this.disabled) { |
| event.preventDefault(); |
| } |
| else { |
| event.stopPropagation(); |
| } |
| }; |
| /** Handle custom key presses. */ |
| /** |
| * Handle custom key presses. |
| * @param {?} event |
| * @return {?} |
| */ |
| MatChip.prototype._handleKeydown = /** |
| * Handle custom key presses. |
| * @param {?} event |
| * @return {?} |
| */ |
| function (event) { |
| if (this.disabled) { |
| return; |
| } |
| switch (event.keyCode) { |
| case keycodes.DELETE: |
| case keycodes.BACKSPACE: |
| // If we are removable, remove the focused chip |
| this.remove(); |
| // Always prevent so page navigation does not occur |
| event.preventDefault(); |
| break; |
| case keycodes.SPACE: |
| // If we are selectable, toggle the focused chip |
| if (this.selectable) { |
| this.toggleSelected(true); |
| } |
| // Always prevent space from scrolling the page since the list has focus |
| event.preventDefault(); |
| break; |
| } |
| }; |
| /** |
| * @return {?} |
| */ |
| MatChip.prototype._blur = /** |
| * @return {?} |
| */ |
| function () { |
| var _this = this; |
| // When animations are enabled, Angular may end up removing the chip from the DOM a little |
| // earlier than usual, causing it to be blurred and throwing off the logic in the chip list |
| // that moves focus not the next item. To work around the issue, we defer marking the chip |
| // as not focused until the next time the zone stabilizes. |
| this._ngZone.onStable |
| .asObservable() |
| .pipe(operators.take(1)) |
| .subscribe((/** |
| * @return {?} |
| */ |
| function () { |
| _this._ngZone.run((/** |
| * @return {?} |
| */ |
| function () { |
| _this._hasFocus = false; |
| _this._onBlur.next({ chip: _this }); |
| })); |
| })); |
| }; |
| /** |
| * @private |
| * @param {?=} isUserInput |
| * @return {?} |
| */ |
| MatChip.prototype._dispatchSelectionChange = /** |
| * @private |
| * @param {?=} isUserInput |
| * @return {?} |
| */ |
| function (isUserInput) { |
| if (isUserInput === void 0) { isUserInput = false; } |
| this.selectionChange.emit({ |
| source: this, |
| isUserInput: isUserInput, |
| selected: this._selected |
| }); |
| }; |
| MatChip.decorators = [ |
| { type: core.Directive, args: [{ |
| selector: "mat-basic-chip, [mat-basic-chip], mat-chip, [mat-chip]", |
| inputs: ['color', 'disabled', 'disableRipple'], |
| exportAs: 'matChip', |
| host: { |
| 'class': 'mat-chip', |
| '[attr.tabindex]': 'disabled ? null : -1', |
| 'role': 'option', |
| '[class.mat-chip-selected]': 'selected', |
| '[class.mat-chip-with-avatar]': 'avatar', |
| '[class.mat-chip-with-trailing-icon]': 'trailingIcon || removeIcon', |
| '[class.mat-chip-disabled]': 'disabled', |
| '[class._mat-animation-noopable]': '_animationsDisabled', |
| '[attr.disabled]': 'disabled || null', |
| '[attr.aria-disabled]': 'disabled.toString()', |
| '[attr.aria-selected]': 'ariaSelected', |
| '(click)': '_handleClick($event)', |
| '(keydown)': '_handleKeydown($event)', |
| '(focus)': 'focus()', |
| '(blur)': '_blur()', |
| }, |
| },] }, |
| ]; |
| /** @nocollapse */ |
| MatChip.ctorParameters = function () { return [ |
| { type: core.ElementRef }, |
| { type: core.NgZone }, |
| { type: platform.Platform }, |
| { type: undefined, decorators: [{ type: core.Optional }, { type: core.Inject, args: [core$1.MAT_RIPPLE_GLOBAL_OPTIONS,] }] }, |
| { type: String, decorators: [{ type: core.Optional }, { type: core.Inject, args: [animations.ANIMATION_MODULE_TYPE,] }] } |
| ]; }; |
| MatChip.propDecorators = { |
| avatar: [{ type: core.ContentChild, args: [MatChipAvatar, { static: false },] }], |
| trailingIcon: [{ type: core.ContentChild, args: [MatChipTrailingIcon, { static: false },] }], |
| removeIcon: [{ type: core.ContentChild, args: [core.forwardRef((/** |
| * @return {?} |
| */ |
| function () { return MatChipRemove; })), { static: false },] }], |
| selected: [{ type: core.Input }], |
| value: [{ type: core.Input }], |
| selectable: [{ type: core.Input }], |
| removable: [{ type: core.Input }], |
| selectionChange: [{ type: core.Output }], |
| destroyed: [{ type: core.Output }], |
| removed: [{ type: core.Output }] |
| }; |
| return MatChip; |
| }(_MatChipMixinBase)); |
| /** |
| * Applies proper (click) support and adds styling for use with the Material Design "cancel" icon |
| * available at https://material.io/icons/#ic_cancel. |
| * |
| * Example: |
| * |
| * `<mat-chip> |
| * <mat-icon matChipRemove>cancel</mat-icon> |
| * </mat-chip>` |
| * |
| * You *may* use a custom icon, but you may need to override the `mat-chip-remove` positioning |
| * styles to properly center the icon within the chip. |
| */ |
| var MatChipRemove = /** @class */ (function () { |
| function MatChipRemove(_parentChip) { |
| this._parentChip = _parentChip; |
| } |
| /** Calls the parent chip's public `remove()` method if applicable. */ |
| /** |
| * Calls the parent chip's public `remove()` method if applicable. |
| * @param {?} event |
| * @return {?} |
| */ |
| MatChipRemove.prototype._handleClick = /** |
| * Calls the parent chip's public `remove()` method if applicable. |
| * @param {?} event |
| * @return {?} |
| */ |
| function (event) { |
| /** @type {?} */ |
| var parentChip = this._parentChip; |
| if (parentChip.removable && !parentChip.disabled) { |
| parentChip.remove(); |
| } |
| // We need to stop event propagation because otherwise the event will bubble up to the |
| // form field and cause the `onContainerClick` method to be invoked. This method would then |
| // reset the focused chip that has been focused after chip removal. Usually the parent |
| // the parent click listener of the `MatChip` would prevent propagation, but it can happen |
| // that the chip is being removed before the event bubbles up. |
| event.stopPropagation(); |
| }; |
| MatChipRemove.decorators = [ |
| { type: core.Directive, args: [{ |
| selector: '[matChipRemove]', |
| host: { |
| 'class': 'mat-chip-remove mat-chip-trailing-icon', |
| '(click)': '_handleClick($event)', |
| } |
| },] }, |
| ]; |
| /** @nocollapse */ |
| MatChipRemove.ctorParameters = function () { return [ |
| { type: MatChip } |
| ]; }; |
| return MatChipRemove; |
| }()); |
| |
| /** |
| * @fileoverview added by tsickle |
| * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc |
| */ |
| /** |
| * Injection token to be used to override the default options for the chips module. |
| * @type {?} |
| */ |
| var MAT_CHIPS_DEFAULT_OPTIONS = new core.InjectionToken('mat-chips-default-options'); |
| |
| /** |
| * @fileoverview added by tsickle |
| * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc |
| */ |
| // Boilerplate for applying mixins to MatChipList. |
| /** |
| * \@docs-private |
| */ |
| var |
| // Boilerplate for applying mixins to MatChipList. |
| /** |
| * \@docs-private |
| */ |
| MatChipListBase = /** @class */ (function () { |
| function MatChipListBase(_defaultErrorStateMatcher, _parentForm, _parentFormGroup, ngControl) { |
| this._defaultErrorStateMatcher = _defaultErrorStateMatcher; |
| this._parentForm = _parentForm; |
| this._parentFormGroup = _parentFormGroup; |
| this.ngControl = ngControl; |
| } |
| return MatChipListBase; |
| }()); |
| /** @type {?} */ |
| var _MatChipListMixinBase = core$1.mixinErrorState(MatChipListBase); |
| // Increasing integer for generating unique ids for chip-list components. |
| /** @type {?} */ |
| var nextUniqueId = 0; |
| /** |
| * Change event object that is emitted when the chip list value has changed. |
| */ |
| var /** |
| * Change event object that is emitted when the chip list value has changed. |
| */ |
| MatChipListChange = /** @class */ (function () { |
| function MatChipListChange(source, value) { |
| this.source = source; |
| this.value = value; |
| } |
| return MatChipListChange; |
| }()); |
| /** |
| * A material design chips component (named ChipList for its similarity to the List component). |
| */ |
| var MatChipList = /** @class */ (function (_super) { |
| __extends(MatChipList, _super); |
| function MatChipList(_elementRef, _changeDetectorRef, _dir, _parentForm, _parentFormGroup, _defaultErrorStateMatcher, ngControl) { |
| var _this = _super.call(this, _defaultErrorStateMatcher, _parentForm, _parentFormGroup, ngControl) || this; |
| _this._elementRef = _elementRef; |
| _this._changeDetectorRef = _changeDetectorRef; |
| _this._dir = _dir; |
| _this.ngControl = ngControl; |
| /** |
| * Implemented as part of MatFormFieldControl. |
| * \@docs-private |
| */ |
| _this.controlType = 'mat-chip-list'; |
| /** |
| * When a chip is destroyed, we store the index of the destroyed chip until the chips |
| * query list notifies about the update. This is necessary because we cannot determine an |
| * appropriate chip that should receive focus until the array of chips updated completely. |
| */ |
| _this._lastDestroyedChipIndex = null; |
| /** |
| * Subject that emits when the component has been destroyed. |
| */ |
| _this._destroyed = new rxjs.Subject(); |
| /** |
| * Uid of the chip list |
| */ |
| _this._uid = "mat-chip-list-" + nextUniqueId++; |
| /** |
| * Tab index for the chip list. |
| */ |
| _this._tabIndex = 0; |
| /** |
| * User defined tab index. |
| * When it is not null, use user defined tab index. Otherwise use _tabIndex |
| */ |
| _this._userTabIndex = null; |
| /** |
| * Function when touched |
| */ |
| _this._onTouched = (/** |
| * @return {?} |
| */ |
| function () { }); |
| /** |
| * Function when changed |
| */ |
| _this._onChange = (/** |
| * @return {?} |
| */ |
| function () { }); |
| _this._multiple = false; |
| _this._compareWith = (/** |
| * @param {?} o1 |
| * @param {?} o2 |
| * @return {?} |
| */ |
| function (o1, o2) { return o1 === o2; }); |
| _this._required = false; |
| _this._disabled = false; |
| /** |
| * Orientation of the chip list. |
| */ |
| _this.ariaOrientation = 'horizontal'; |
| _this._selectable = true; |
| /** |
| * Event emitted when the selected chip list value has been changed by the user. |
| */ |
| _this.change = new core.EventEmitter(); |
| /** |
| * Event that emits whenever the raw value of the chip-list changes. This is here primarily |
| * to facilitate the two-way binding for the `value` input. |
| * \@docs-private |
| */ |
| _this.valueChange = new core.EventEmitter(); |
| if (_this.ngControl) { |
| _this.ngControl.valueAccessor = _this; |
| } |
| return _this; |
| } |
| Object.defineProperty(MatChipList.prototype, "selected", { |
| /** The array of selected chips inside chip list. */ |
| get: /** |
| * The array of selected chips inside chip list. |
| * @return {?} |
| */ |
| function () { |
| return this.multiple ? this._selectionModel.selected : this._selectionModel.selected[0]; |
| }, |
| enumerable: true, |
| configurable: true |
| }); |
| Object.defineProperty(MatChipList.prototype, "role", { |
| /** The ARIA role applied to the chip list. */ |
| get: /** |
| * The ARIA role applied to the chip list. |
| * @return {?} |
| */ |
| function () { return this.empty ? null : 'listbox'; }, |
| enumerable: true, |
| configurable: true |
| }); |
| Object.defineProperty(MatChipList.prototype, "multiple", { |
| /** Whether the user should be allowed to select multiple chips. */ |
| get: /** |
| * Whether the user should be allowed to select multiple chips. |
| * @return {?} |
| */ |
| function () { return this._multiple; }, |
| set: /** |
| * @param {?} value |
| * @return {?} |
| */ |
| function (value) { |
| this._multiple = coercion.coerceBooleanProperty(value); |
| this._syncChipsState(); |
| }, |
| enumerable: true, |
| configurable: true |
| }); |
| Object.defineProperty(MatChipList.prototype, "compareWith", { |
| /** |
| * A function to compare the option values with the selected values. The first argument |
| * is a value from an option. The second is a value from the selection. A boolean |
| * should be returned. |
| */ |
| get: /** |
| * A function to compare the option values with the selected values. The first argument |
| * is a value from an option. The second is a value from the selection. A boolean |
| * should be returned. |
| * @return {?} |
| */ |
| function () { return this._compareWith; }, |
| set: /** |
| * @param {?} fn |
| * @return {?} |
| */ |
| function (fn) { |
| this._compareWith = fn; |
| if (this._selectionModel) { |
| // A different comparator means the selection could change. |
| this._initializeSelection(); |
| } |
| }, |
| enumerable: true, |
| configurable: true |
| }); |
| Object.defineProperty(MatChipList.prototype, "value", { |
| /** |
| * Implemented as part of MatFormFieldControl. |
| * @docs-private |
| */ |
| get: /** |
| * Implemented as part of MatFormFieldControl. |
| * \@docs-private |
| * @return {?} |
| */ |
| function () { return this._value; }, |
| set: /** |
| * @param {?} value |
| * @return {?} |
| */ |
| function (value) { |
| this.writeValue(value); |
| this._value = value; |
| }, |
| enumerable: true, |
| configurable: true |
| }); |
| Object.defineProperty(MatChipList.prototype, "id", { |
| /** |
| * Implemented as part of MatFormFieldControl. |
| * @docs-private |
| */ |
| get: /** |
| * Implemented as part of MatFormFieldControl. |
| * \@docs-private |
| * @return {?} |
| */ |
| function () { |
| return this._chipInput ? this._chipInput.id : this._uid; |
| }, |
| enumerable: true, |
| configurable: true |
| }); |
| Object.defineProperty(MatChipList.prototype, "required", { |
| /** |
| * Implemented as part of MatFormFieldControl. |
| * @docs-private |
| */ |
| get: /** |
| * Implemented as part of MatFormFieldControl. |
| * \@docs-private |
| * @return {?} |
| */ |
| function () { return this._required; }, |
| set: /** |
| * @param {?} value |
| * @return {?} |
| */ |
| function (value) { |
| this._required = coercion.coerceBooleanProperty(value); |
| this.stateChanges.next(); |
| }, |
| enumerable: true, |
| configurable: true |
| }); |
| Object.defineProperty(MatChipList.prototype, "placeholder", { |
| /** |
| * Implemented as part of MatFormFieldControl. |
| * @docs-private |
| */ |
| get: /** |
| * Implemented as part of MatFormFieldControl. |
| * \@docs-private |
| * @return {?} |
| */ |
| function () { |
| return this._chipInput ? this._chipInput.placeholder : this._placeholder; |
| }, |
| set: /** |
| * @param {?} value |
| * @return {?} |
| */ |
| function (value) { |
| this._placeholder = value; |
| this.stateChanges.next(); |
| }, |
| enumerable: true, |
| configurable: true |
| }); |
| Object.defineProperty(MatChipList.prototype, "focused", { |
| /** Whether any chips or the matChipInput inside of this chip-list has focus. */ |
| get: /** |
| * Whether any chips or the matChipInput inside of this chip-list has focus. |
| * @return {?} |
| */ |
| function () { |
| return (this._chipInput && this._chipInput.focused) || this._hasFocusedChip(); |
| }, |
| enumerable: true, |
| configurable: true |
| }); |
| Object.defineProperty(MatChipList.prototype, "empty", { |
| /** |
| * Implemented as part of MatFormFieldControl. |
| * @docs-private |
| */ |
| get: /** |
| * Implemented as part of MatFormFieldControl. |
| * \@docs-private |
| * @return {?} |
| */ |
| function () { |
| return (!this._chipInput || this._chipInput.empty) && this.chips.length === 0; |
| }, |
| enumerable: true, |
| configurable: true |
| }); |
| Object.defineProperty(MatChipList.prototype, "shouldLabelFloat", { |
| /** |
| * Implemented as part of MatFormFieldControl. |
| * @docs-private |
| */ |
| get: /** |
| * Implemented as part of MatFormFieldControl. |
| * \@docs-private |
| * @return {?} |
| */ |
| function () { return !this.empty || this.focused; }, |
| enumerable: true, |
| configurable: true |
| }); |
| Object.defineProperty(MatChipList.prototype, "disabled", { |
| /** |
| * Implemented as part of MatFormFieldControl. |
| * @docs-private |
| */ |
| get: /** |
| * Implemented as part of MatFormFieldControl. |
| * \@docs-private |
| * @return {?} |
| */ |
| function () { return this.ngControl ? !!this.ngControl.disabled : this._disabled; }, |
| set: /** |
| * @param {?} value |
| * @return {?} |
| */ |
| function (value) { |
| this._disabled = coercion.coerceBooleanProperty(value); |
| this._syncChipsState(); |
| }, |
| enumerable: true, |
| configurable: true |
| }); |
| Object.defineProperty(MatChipList.prototype, "selectable", { |
| /** |
| * Whether or not this chip list is selectable. When a chip list is not selectable, |
| * the selected states for all the chips inside the chip list are always ignored. |
| */ |
| get: /** |
| * Whether or not this chip list is selectable. When a chip list is not selectable, |
| * the selected states for all the chips inside the chip list are always ignored. |
| * @return {?} |
| */ |
| function () { return this._selectable; }, |
| set: /** |
| * @param {?} value |
| * @return {?} |
| */ |
| function (value) { |
| var _this = this; |
| this._selectable = coercion.coerceBooleanProperty(value); |
| if (this.chips) { |
| this.chips.forEach((/** |
| * @param {?} chip |
| * @return {?} |
| */ |
| function (chip) { return chip.chipListSelectable = _this._selectable; })); |
| } |
| }, |
| enumerable: true, |
| configurable: true |
| }); |
| Object.defineProperty(MatChipList.prototype, "tabIndex", { |
| set: /** |
| * @param {?} value |
| * @return {?} |
| */ |
| function (value) { |
| this._userTabIndex = value; |
| this._tabIndex = value; |
| }, |
| enumerable: true, |
| configurable: true |
| }); |
| Object.defineProperty(MatChipList.prototype, "chipSelectionChanges", { |
| /** Combined stream of all of the child chips' selection change events. */ |
| get: /** |
| * Combined stream of all of the child chips' selection change events. |
| * @return {?} |
| */ |
| function () { |
| return rxjs.merge.apply(void 0, this.chips.map((/** |
| * @param {?} chip |
| * @return {?} |
| */ |
| function (chip) { return chip.selectionChange; }))); |
| }, |
| enumerable: true, |
| configurable: true |
| }); |
| Object.defineProperty(MatChipList.prototype, "chipFocusChanges", { |
| /** Combined stream of all of the child chips' focus change events. */ |
| get: /** |
| * Combined stream of all of the child chips' focus change events. |
| * @return {?} |
| */ |
| function () { |
| return rxjs.merge.apply(void 0, this.chips.map((/** |
| * @param {?} chip |
| * @return {?} |
| */ |
| function (chip) { return chip._onFocus; }))); |
| }, |
| enumerable: true, |
| configurable: true |
| }); |
| Object.defineProperty(MatChipList.prototype, "chipBlurChanges", { |
| /** Combined stream of all of the child chips' blur change events. */ |
| get: /** |
| * Combined stream of all of the child chips' blur change events. |
| * @return {?} |
| */ |
| function () { |
| return rxjs.merge.apply(void 0, this.chips.map((/** |
| * @param {?} chip |
| * @return {?} |
| */ |
| function (chip) { return chip._onBlur; }))); |
| }, |
| enumerable: true, |
| configurable: true |
| }); |
| Object.defineProperty(MatChipList.prototype, "chipRemoveChanges", { |
| /** Combined stream of all of the child chips' remove change events. */ |
| get: /** |
| * Combined stream of all of the child chips' remove change events. |
| * @return {?} |
| */ |
| function () { |
| return rxjs.merge.apply(void 0, this.chips.map((/** |
| * @param {?} chip |
| * @return {?} |
| */ |
| function (chip) { return chip.destroyed; }))); |
| }, |
| enumerable: true, |
| configurable: true |
| }); |
| /** |
| * @return {?} |
| */ |
| MatChipList.prototype.ngAfterContentInit = /** |
| * @return {?} |
| */ |
| function () { |
| var _this = this; |
| this._keyManager = new a11y.FocusKeyManager(this.chips) |
| .withWrap() |
| .withVerticalOrientation() |
| .withHorizontalOrientation(this._dir ? this._dir.value : 'ltr'); |
| if (this._dir) { |
| this._dir.change |
| .pipe(operators.takeUntil(this._destroyed)) |
| .subscribe((/** |
| * @param {?} dir |
| * @return {?} |
| */ |
| function (dir) { return _this._keyManager.withHorizontalOrientation(dir); })); |
| } |
| this._keyManager.tabOut.pipe(operators.takeUntil(this._destroyed)).subscribe((/** |
| * @return {?} |
| */ |
| function () { |
| _this._allowFocusEscape(); |
| })); |
| // When the list changes, re-subscribe |
| this.chips.changes.pipe(operators.startWith(null), operators.takeUntil(this._destroyed)).subscribe((/** |
| * @return {?} |
| */ |
| function () { |
| if (_this.disabled) { |
| // Since this happens after the content has been |
| // checked, we need to defer it to the next tick. |
| Promise.resolve().then((/** |
| * @return {?} |
| */ |
| function () { |
| _this._syncChipsState(); |
| })); |
| } |
| _this._resetChips(); |
| // Reset chips selected/deselected status |
| _this._initializeSelection(); |
| // Check to see if we need to update our tab index |
| _this._updateTabIndex(); |
| // Check to see if we have a destroyed chip and need to refocus |
| _this._updateFocusForDestroyedChips(); |
| _this.stateChanges.next(); |
| })); |
| }; |
| /** |
| * @return {?} |
| */ |
| MatChipList.prototype.ngOnInit = /** |
| * @return {?} |
| */ |
| function () { |
| this._selectionModel = new collections.SelectionModel(this.multiple, undefined, false); |
| this.stateChanges.next(); |
| }; |
| /** |
| * @return {?} |
| */ |
| MatChipList.prototype.ngDoCheck = /** |
| * @return {?} |
| */ |
| function () { |
| if (this.ngControl) { |
| // We need to re-evaluate this on every change detection cycle, because there are some |
| // error triggers that we can't subscribe to (e.g. parent form submissions). This means |
| // that whatever logic is in here has to be super lean or we risk destroying the performance. |
| this.updateErrorState(); |
| } |
| }; |
| /** |
| * @return {?} |
| */ |
| MatChipList.prototype.ngOnDestroy = /** |
| * @return {?} |
| */ |
| function () { |
| this._destroyed.next(); |
| this._destroyed.complete(); |
| this.stateChanges.complete(); |
| this._dropSubscriptions(); |
| }; |
| /** Associates an HTML input element with this chip list. */ |
| /** |
| * Associates an HTML input element with this chip list. |
| * @param {?} inputElement |
| * @return {?} |
| */ |
| MatChipList.prototype.registerInput = /** |
| * Associates an HTML input element with this chip list. |
| * @param {?} inputElement |
| * @return {?} |
| */ |
| function (inputElement) { |
| this._chipInput = inputElement; |
| }; |
| /** |
| * Implemented as part of MatFormFieldControl. |
| * @docs-private |
| */ |
| /** |
| * Implemented as part of MatFormFieldControl. |
| * \@docs-private |
| * @param {?} ids |
| * @return {?} |
| */ |
| MatChipList.prototype.setDescribedByIds = /** |
| * Implemented as part of MatFormFieldControl. |
| * \@docs-private |
| * @param {?} ids |
| * @return {?} |
| */ |
| function (ids) { this._ariaDescribedby = ids.join(' '); }; |
| // Implemented as part of ControlValueAccessor. |
| // Implemented as part of ControlValueAccessor. |
| /** |
| * @param {?} value |
| * @return {?} |
| */ |
| MatChipList.prototype.writeValue = |
| // Implemented as part of ControlValueAccessor. |
| /** |
| * @param {?} value |
| * @return {?} |
| */ |
| function (value) { |
| if (this.chips) { |
| this._setSelectionByValue(value, false); |
| } |
| }; |
| // Implemented as part of ControlValueAccessor. |
| // Implemented as part of ControlValueAccessor. |
| /** |
| * @param {?} fn |
| * @return {?} |
| */ |
| MatChipList.prototype.registerOnChange = |
| // Implemented as part of ControlValueAccessor. |
| /** |
| * @param {?} fn |
| * @return {?} |
| */ |
| function (fn) { |
| this._onChange = fn; |
| }; |
| // Implemented as part of ControlValueAccessor. |
| // Implemented as part of ControlValueAccessor. |
| /** |
| * @param {?} fn |
| * @return {?} |
| */ |
| MatChipList.prototype.registerOnTouched = |
| // Implemented as part of ControlValueAccessor. |
| /** |
| * @param {?} fn |
| * @return {?} |
| */ |
| function (fn) { |
| this._onTouched = fn; |
| }; |
| // Implemented as part of ControlValueAccessor. |
| // Implemented as part of ControlValueAccessor. |
| /** |
| * @param {?} isDisabled |
| * @return {?} |
| */ |
| MatChipList.prototype.setDisabledState = |
| // Implemented as part of ControlValueAccessor. |
| /** |
| * @param {?} isDisabled |
| * @return {?} |
| */ |
| function (isDisabled) { |
| this.disabled = isDisabled; |
| this.stateChanges.next(); |
| }; |
| /** |
| * Implemented as part of MatFormFieldControl. |
| * @docs-private |
| */ |
| /** |
| * Implemented as part of MatFormFieldControl. |
| * \@docs-private |
| * @param {?} event |
| * @return {?} |
| */ |
| MatChipList.prototype.onContainerClick = /** |
| * Implemented as part of MatFormFieldControl. |
| * \@docs-private |
| * @param {?} event |
| * @return {?} |
| */ |
| function (event) { |
| if (!this._originatesFromChip(event)) { |
| this.focus(); |
| } |
| }; |
| /** |
| * Focuses the first non-disabled chip in this chip list, or the associated input when there |
| * are no eligible chips. |
| */ |
| /** |
| * Focuses the first non-disabled chip in this chip list, or the associated input when there |
| * are no eligible chips. |
| * @return {?} |
| */ |
| MatChipList.prototype.focus = /** |
| * Focuses the first non-disabled chip in this chip list, or the associated input when there |
| * are no eligible chips. |
| * @return {?} |
| */ |
| function () { |
| if (this.disabled) { |
| return; |
| } |
| // TODO: ARIA says this should focus the first `selected` chip if any are selected. |
| // Focus on first element if there's no chipInput inside chip-list |
| if (this._chipInput && this._chipInput.focused) { |
| // do nothing |
| } |
| else if (this.chips.length > 0) { |
| this._keyManager.setFirstItemActive(); |
| this.stateChanges.next(); |
| } |
| else { |
| this._focusInput(); |
| this.stateChanges.next(); |
| } |
| }; |
| /** Attempt to focus an input if we have one. */ |
| /** |
| * Attempt to focus an input if we have one. |
| * @return {?} |
| */ |
| MatChipList.prototype._focusInput = /** |
| * Attempt to focus an input if we have one. |
| * @return {?} |
| */ |
| function () { |
| if (this._chipInput) { |
| this._chipInput.focus(); |
| } |
| }; |
| /** |
| * Pass events to the keyboard manager. Available here for tests. |
| */ |
| /** |
| * Pass events to the keyboard manager. Available here for tests. |
| * @param {?} event |
| * @return {?} |
| */ |
| MatChipList.prototype._keydown = /** |
| * Pass events to the keyboard manager. Available here for tests. |
| * @param {?} event |
| * @return {?} |
| */ |
| function (event) { |
| /** @type {?} */ |
| var target = (/** @type {?} */ (event.target)); |
| // If they are on an empty input and hit backspace, focus the last chip |
| if (event.keyCode === keycodes.BACKSPACE && this._isInputEmpty(target)) { |
| this._keyManager.setLastItemActive(); |
| event.preventDefault(); |
| } |
| else if (target && target.classList.contains('mat-chip')) { |
| if (event.keyCode === keycodes.HOME) { |
| this._keyManager.setFirstItemActive(); |
| event.preventDefault(); |
| } |
| else if (event.keyCode === keycodes.END) { |
| this._keyManager.setLastItemActive(); |
| event.preventDefault(); |
| } |
| else { |
| this._keyManager.onKeydown(event); |
| } |
| this.stateChanges.next(); |
| } |
| }; |
| /** |
| * Check the tab index as you should not be allowed to focus an empty list. |
| */ |
| /** |
| * Check the tab index as you should not be allowed to focus an empty list. |
| * @protected |
| * @return {?} |
| */ |
| MatChipList.prototype._updateTabIndex = /** |
| * Check the tab index as you should not be allowed to focus an empty list. |
| * @protected |
| * @return {?} |
| */ |
| function () { |
| // If we have 0 chips, we should not allow keyboard focus |
| this._tabIndex = this._userTabIndex || (this.chips.length === 0 ? -1 : 0); |
| }; |
| /** |
| * If the amount of chips changed, we need to update the |
| * key manager state and focus the next closest chip. |
| */ |
| /** |
| * If the amount of chips changed, we need to update the |
| * key manager state and focus the next closest chip. |
| * @protected |
| * @return {?} |
| */ |
| MatChipList.prototype._updateFocusForDestroyedChips = /** |
| * If the amount of chips changed, we need to update the |
| * key manager state and focus the next closest chip. |
| * @protected |
| * @return {?} |
| */ |
| function () { |
| // Move focus to the closest chip. If no other chips remain, focus the chip-list itself. |
| if (this._lastDestroyedChipIndex != null) { |
| if (this.chips.length) { |
| /** @type {?} */ |
| var newChipIndex = Math.min(this._lastDestroyedChipIndex, this.chips.length - 1); |
| this._keyManager.setActiveItem(newChipIndex); |
| } |
| else { |
| this.focus(); |
| } |
| } |
| this._lastDestroyedChipIndex = null; |
| }; |
| /** |
| * Utility to ensure all indexes are valid. |
| * |
| * @param index The index to be checked. |
| * @returns True if the index is valid for our list of chips. |
| */ |
| /** |
| * Utility to ensure all indexes are valid. |
| * |
| * @private |
| * @param {?} index The index to be checked. |
| * @return {?} True if the index is valid for our list of chips. |
| */ |
| MatChipList.prototype._isValidIndex = /** |
| * Utility to ensure all indexes are valid. |
| * |
| * @private |
| * @param {?} index The index to be checked. |
| * @return {?} True if the index is valid for our list of chips. |
| */ |
| function (index) { |
| return index >= 0 && index < this.chips.length; |
| }; |
| /** |
| * @private |
| * @param {?} element |
| * @return {?} |
| */ |
| MatChipList.prototype._isInputEmpty = /** |
| * @private |
| * @param {?} element |
| * @return {?} |
| */ |
| function (element) { |
| if (element && element.nodeName.toLowerCase() === 'input') { |
| /** @type {?} */ |
| var input = (/** @type {?} */ (element)); |
| return !input.value; |
| } |
| return false; |
| }; |
| /** |
| * @param {?} value |
| * @param {?=} isUserInput |
| * @return {?} |
| */ |
| MatChipList.prototype._setSelectionByValue = /** |
| * @param {?} value |
| * @param {?=} isUserInput |
| * @return {?} |
| */ |
| function (value, isUserInput) { |
| var _this = this; |
| if (isUserInput === void 0) { isUserInput = true; } |
| this._clearSelection(); |
| this.chips.forEach((/** |
| * @param {?} chip |
| * @return {?} |
| */ |
| function (chip) { return chip.deselect(); })); |
| if (Array.isArray(value)) { |
| value.forEach((/** |
| * @param {?} currentValue |
| * @return {?} |
| */ |
| function (currentValue) { return _this._selectValue(currentValue, isUserInput); })); |
| this._sortValues(); |
| } |
| else { |
| /** @type {?} */ |
| var correspondingChip = this._selectValue(value, isUserInput); |
| // Shift focus to the active item. Note that we shouldn't do this in multiple |
| // mode, because we don't know what chip the user interacted with last. |
| if (correspondingChip) { |
| if (isUserInput) { |
| this._keyManager.setActiveItem(correspondingChip); |
| } |
| } |
| } |
| }; |
| /** |
| * Finds and selects the chip based on its value. |
| * @returns Chip that has the corresponding value. |
| */ |
| /** |
| * Finds and selects the chip based on its value. |
| * @private |
| * @param {?} value |
| * @param {?=} isUserInput |
| * @return {?} Chip that has the corresponding value. |
| */ |
| MatChipList.prototype._selectValue = /** |
| * Finds and selects the chip based on its value. |
| * @private |
| * @param {?} value |
| * @param {?=} isUserInput |
| * @return {?} Chip that has the corresponding value. |
| */ |
| function (value, isUserInput) { |
| var _this = this; |
| if (isUserInput === void 0) { isUserInput = true; } |
| /** @type {?} */ |
| var correspondingChip = this.chips.find((/** |
| * @param {?} chip |
| * @return {?} |
| */ |
| function (chip) { |
| return chip.value != null && _this._compareWith(chip.value, value); |
| })); |
| if (correspondingChip) { |
| isUserInput ? correspondingChip.selectViaInteraction() : correspondingChip.select(); |
| this._selectionModel.select(correspondingChip); |
| } |
| return correspondingChip; |
| }; |
| /** |
| * @private |
| * @return {?} |
| */ |
| MatChipList.prototype._initializeSelection = /** |
| * @private |
| * @return {?} |
| */ |
| function () { |
| var _this = this; |
| // Defer setting the value in order to avoid the "Expression |
| // has changed after it was checked" errors from Angular. |
| Promise.resolve().then((/** |
| * @return {?} |
| */ |
| function () { |
| if (_this.ngControl || _this._value) { |
| _this._setSelectionByValue(_this.ngControl ? _this.ngControl.value : _this._value, false); |
| _this.stateChanges.next(); |
| } |
| })); |
| }; |
| /** |
| * Deselects every chip in the list. |
| * @param skip Chip that should not be deselected. |
| */ |
| /** |
| * Deselects every chip in the list. |
| * @private |
| * @param {?=} skip Chip that should not be deselected. |
| * @return {?} |
| */ |
| MatChipList.prototype._clearSelection = /** |
| * Deselects every chip in the list. |
| * @private |
| * @param {?=} skip Chip that should not be deselected. |
| * @return {?} |
| */ |
| function (skip) { |
| this._selectionModel.clear(); |
| this.chips.forEach((/** |
| * @param {?} chip |
| * @return {?} |
| */ |
| function (chip) { |
| if (chip !== skip) { |
| chip.deselect(); |
| } |
| })); |
| this.stateChanges.next(); |
| }; |
| /** |
| * Sorts the model values, ensuring that they keep the same |
| * order that they have in the panel. |
| */ |
| /** |
| * Sorts the model values, ensuring that they keep the same |
| * order that they have in the panel. |
| * @private |
| * @return {?} |
| */ |
| MatChipList.prototype._sortValues = /** |
| * Sorts the model values, ensuring that they keep the same |
| * order that they have in the panel. |
| * @private |
| * @return {?} |
| */ |
| function () { |
| var _this = this; |
| if (this._multiple) { |
| this._selectionModel.clear(); |
| this.chips.forEach((/** |
| * @param {?} chip |
| * @return {?} |
| */ |
| function (chip) { |
| if (chip.selected) { |
| _this._selectionModel.select(chip); |
| } |
| })); |
| this.stateChanges.next(); |
| } |
| }; |
| /** Emits change event to set the model value. */ |
| /** |
| * Emits change event to set the model value. |
| * @private |
| * @param {?=} fallbackValue |
| * @return {?} |
| */ |
| MatChipList.prototype._propagateChanges = /** |
| * Emits change event to set the model value. |
| * @private |
| * @param {?=} fallbackValue |
| * @return {?} |
| */ |
| function (fallbackValue) { |
| /** @type {?} */ |
| var valueToEmit = null; |
| if (Array.isArray(this.selected)) { |
| valueToEmit = this.selected.map((/** |
| * @param {?} chip |
| * @return {?} |
| */ |
| function (chip) { return chip.value; })); |
| } |
| else { |
| valueToEmit = this.selected ? this.selected.value : fallbackValue; |
| } |
| this._value = valueToEmit; |
| this.change.emit(new MatChipListChange(this, valueToEmit)); |
| this.valueChange.emit(valueToEmit); |
| this._onChange(valueToEmit); |
| this._changeDetectorRef.markForCheck(); |
| }; |
| /** When blurred, mark the field as touched when focus moved outside the chip list. */ |
| /** |
| * When blurred, mark the field as touched when focus moved outside the chip list. |
| * @return {?} |
| */ |
| MatChipList.prototype._blur = /** |
| * When blurred, mark the field as touched when focus moved outside the chip list. |
| * @return {?} |
| */ |
| function () { |
| var _this = this; |
| if (!this._hasFocusedChip()) { |
| this._keyManager.setActiveItem(-1); |
| } |
| if (!this.disabled) { |
| if (this._chipInput) { |
| // If there's a chip input, we should check whether the focus moved to chip input. |
| // If the focus is not moved to chip input, mark the field as touched. If the focus moved |
| // to chip input, do nothing. |
| // Timeout is needed to wait for the focus() event trigger on chip input. |
| setTimeout((/** |
| * @return {?} |
| */ |
| function () { |
| if (!_this.focused) { |
| _this._markAsTouched(); |
| } |
| })); |
| } |
| else { |
| // If there's no chip input, then mark the field as touched. |
| this._markAsTouched(); |
| } |
| } |
| }; |
| /** Mark the field as touched */ |
| /** |
| * Mark the field as touched |
| * @return {?} |
| */ |
| MatChipList.prototype._markAsTouched = /** |
| * Mark the field as touched |
| * @return {?} |
| */ |
| function () { |
| this._onTouched(); |
| this._changeDetectorRef.markForCheck(); |
| this.stateChanges.next(); |
| }; |
| /** |
| * Removes the `tabindex` from the chip list and resets it back afterwards, allowing the |
| * user to tab out of it. This prevents the list from capturing focus and redirecting |
| * it back to the first chip, creating a focus trap, if it user tries to tab away. |
| */ |
| /** |
| * Removes the `tabindex` from the chip list and resets it back afterwards, allowing the |
| * user to tab out of it. This prevents the list from capturing focus and redirecting |
| * it back to the first chip, creating a focus trap, if it user tries to tab away. |
| * @return {?} |
| */ |
| MatChipList.prototype._allowFocusEscape = /** |
| * Removes the `tabindex` from the chip list and resets it back afterwards, allowing the |
| * user to tab out of it. This prevents the list from capturing focus and redirecting |
| * it back to the first chip, creating a focus trap, if it user tries to tab away. |
| * @return {?} |
| */ |
| function () { |
| var _this = this; |
| if (this._tabIndex !== -1) { |
| this._tabIndex = -1; |
| setTimeout((/** |
| * @return {?} |
| */ |
| function () { |
| _this._tabIndex = _this._userTabIndex || 0; |
| _this._changeDetectorRef.markForCheck(); |
| })); |
| } |
| }; |
| /** |
| * @private |
| * @return {?} |
| */ |
| MatChipList.prototype._resetChips = /** |
| * @private |
| * @return {?} |
| */ |
| function () { |
| this._dropSubscriptions(); |
| this._listenToChipsFocus(); |
| this._listenToChipsSelection(); |
| this._listenToChipsRemoved(); |
| }; |
| /** |
| * @private |
| * @return {?} |
| */ |
| MatChipList.prototype._dropSubscriptions = /** |
| * @private |
| * @return {?} |
| */ |
| function () { |
| if (this._chipFocusSubscription) { |
| this._chipFocusSubscription.unsubscribe(); |
| this._chipFocusSubscription = null; |
| } |
| if (this._chipBlurSubscription) { |
| this._chipBlurSubscription.unsubscribe(); |
| this._chipBlurSubscription = null; |
| } |
| if (this._chipSelectionSubscription) { |
| this._chipSelectionSubscription.unsubscribe(); |
| this._chipSelectionSubscription = null; |
| } |
| if (this._chipRemoveSubscription) { |
| this._chipRemoveSubscription.unsubscribe(); |
| this._chipRemoveSubscription = null; |
| } |
| }; |
| /** Listens to user-generated selection events on each chip. */ |
| /** |
| * Listens to user-generated selection events on each chip. |
| * @private |
| * @return {?} |
| */ |
| MatChipList.prototype._listenToChipsSelection = /** |
| * Listens to user-generated selection events on each chip. |
| * @private |
| * @return {?} |
| */ |
| function () { |
| var _this = this; |
| this._chipSelectionSubscription = this.chipSelectionChanges.subscribe((/** |
| * @param {?} event |
| * @return {?} |
| */ |
| function (event) { |
| event.source.selected |
| ? _this._selectionModel.select(event.source) |
| : _this._selectionModel.deselect(event.source); |
| // For single selection chip list, make sure the deselected value is unselected. |
| if (!_this.multiple) { |
| _this.chips.forEach((/** |
| * @param {?} chip |
| * @return {?} |
| */ |
| function (chip) { |
| if (!_this._selectionModel.isSelected(chip) && chip.selected) { |
| chip.deselect(); |
| } |
| })); |
| } |
| if (event.isUserInput) { |
| _this._propagateChanges(); |
| } |
| })); |
| }; |
| /** Listens to user-generated selection events on each chip. */ |
| /** |
| * Listens to user-generated selection events on each chip. |
| * @private |
| * @return {?} |
| */ |
| MatChipList.prototype._listenToChipsFocus = /** |
| * Listens to user-generated selection events on each chip. |
| * @private |
| * @return {?} |
| */ |
| function () { |
| var _this = this; |
| this._chipFocusSubscription = this.chipFocusChanges.subscribe((/** |
| * @param {?} event |
| * @return {?} |
| */ |
| function (event) { |
| /** @type {?} */ |
| var chipIndex = _this.chips.toArray().indexOf(event.chip); |
| if (_this._isValidIndex(chipIndex)) { |
| _this._keyManager.updateActiveItemIndex(chipIndex); |
| } |
| _this.stateChanges.next(); |
| })); |
| this._chipBlurSubscription = this.chipBlurChanges.subscribe((/** |
| * @return {?} |
| */ |
| function () { |
| _this._blur(); |
| _this.stateChanges.next(); |
| })); |
| }; |
| /** |
| * @private |
| * @return {?} |
| */ |
| MatChipList.prototype._listenToChipsRemoved = /** |
| * @private |
| * @return {?} |
| */ |
| function () { |
| var _this = this; |
| this._chipRemoveSubscription = this.chipRemoveChanges.subscribe((/** |
| * @param {?} event |
| * @return {?} |
| */ |
| function (event) { |
| /** @type {?} */ |
| var chip = event.chip; |
| /** @type {?} */ |
| var chipIndex = _this.chips.toArray().indexOf(event.chip); |
| // In case the chip that will be removed is currently focused, we temporarily store |
| // the index in order to be able to determine an appropriate sibling chip that will |
| // receive focus. |
| if (_this._isValidIndex(chipIndex) && chip._hasFocus) { |
| _this._lastDestroyedChipIndex = chipIndex; |
| } |
| })); |
| }; |
| /** Checks whether an event comes from inside a chip element. */ |
| /** |
| * Checks whether an event comes from inside a chip element. |
| * @private |
| * @param {?} event |
| * @return {?} |
| */ |
| MatChipList.prototype._originatesFromChip = /** |
| * Checks whether an event comes from inside a chip element. |
| * @private |
| * @param {?} event |
| * @return {?} |
| */ |
| function (event) { |
| /** @type {?} */ |
| var currentElement = (/** @type {?} */ (event.target)); |
| while (currentElement && currentElement !== this._elementRef.nativeElement) { |
| if (currentElement.classList.contains('mat-chip')) { |
| return true; |
| } |
| currentElement = currentElement.parentElement; |
| } |
| return false; |
| }; |
| /** Checks whether any of the chips is focused. */ |
| /** |
| * Checks whether any of the chips is focused. |
| * @private |
| * @return {?} |
| */ |
| MatChipList.prototype._hasFocusedChip = /** |
| * Checks whether any of the chips is focused. |
| * @private |
| * @return {?} |
| */ |
| function () { |
| return this.chips.some((/** |
| * @param {?} chip |
| * @return {?} |
| */ |
| function (chip) { return chip._hasFocus; })); |
| }; |
| /** Syncs the list's state with the individual chips. */ |
| /** |
| * Syncs the list's state with the individual chips. |
| * @private |
| * @return {?} |
| */ |
| MatChipList.prototype._syncChipsState = /** |
| * Syncs the list's state with the individual chips. |
| * @private |
| * @return {?} |
| */ |
| function () { |
| var _this = this; |
| if (this.chips) { |
| this.chips.forEach((/** |
| * @param {?} chip |
| * @return {?} |
| */ |
| function (chip) { |
| chip.disabled = _this._disabled; |
| chip._chipListMultiple = _this.multiple; |
| })); |
| } |
| }; |
| MatChipList.decorators = [ |
| { type: core.Component, args: [{selector: 'mat-chip-list', |
| template: "<div class=\"mat-chip-list-wrapper\"><ng-content></ng-content></div>", |
| exportAs: 'matChipList', |
| host: { |
| '[attr.tabindex]': 'disabled ? null : _tabIndex', |
| '[attr.aria-describedby]': '_ariaDescribedby || null', |
| '[attr.aria-required]': 'required.toString()', |
| '[attr.aria-disabled]': 'disabled.toString()', |
| '[attr.aria-invalid]': 'errorState', |
| '[attr.aria-multiselectable]': 'multiple', |
| '[attr.role]': 'role', |
| '[class.mat-chip-list-disabled]': 'disabled', |
| '[class.mat-chip-list-invalid]': 'errorState', |
| '[class.mat-chip-list-required]': 'required', |
| '[attr.aria-orientation]': 'ariaOrientation', |
| 'class': 'mat-chip-list', |
| '(focus)': 'focus()', |
| '(blur)': '_blur()', |
| '(keydown)': '_keydown($event)', |
| '[id]': '_uid', |
| }, |
| providers: [{ provide: formField.MatFormFieldControl, useExisting: MatChipList }], |
| styles: [".mat-chip{position:relative;overflow:hidden;box-sizing:border-box;-webkit-tap-highlight-color:transparent;transform:translateZ(0)}.mat-standard-chip{transition:box-shadow 280ms cubic-bezier(.4,0,.2,1);display:inline-flex;padding:7px 12px;border-radius:16px;align-items:center;cursor:default;min-height:32px;height:1px}._mat-animation-noopable.mat-standard-chip{transition:none;animation:none}.mat-standard-chip .mat-chip-remove.mat-icon{width:18px;height:18px}.mat-standard-chip::after{top:0;left:0;right:0;bottom:0;position:absolute;border-radius:inherit;opacity:0;content:'';pointer-events:none;transition:opacity .2s cubic-bezier(.35,0,.25,1)}.mat-standard-chip:hover::after{opacity:.12}.mat-standard-chip:focus{outline:0}.mat-standard-chip:focus::after{opacity:.16}@media (-ms-high-contrast:active){.mat-standard-chip{outline:solid 1px}.mat-standard-chip:focus{outline:dotted 2px}}.mat-standard-chip.mat-chip-disabled::after{opacity:0}.mat-standard-chip.mat-chip-disabled .mat-chip-remove,.mat-standard-chip.mat-chip-disabled .mat-chip-trailing-icon{cursor:default}.mat-standard-chip.mat-chip-with-avatar,.mat-standard-chip.mat-chip-with-trailing-icon.mat-chip-with-avatar{padding-top:0;padding-bottom:0}.mat-standard-chip.mat-chip-with-trailing-icon.mat-chip-with-avatar{padding-right:8px;padding-left:0}[dir=rtl] .mat-standard-chip.mat-chip-with-trailing-icon.mat-chip-with-avatar{padding-left:8px;padding-right:0}.mat-standard-chip.mat-chip-with-trailing-icon{padding-top:7px;padding-bottom:7px;padding-right:8px;padding-left:12px}[dir=rtl] .mat-standard-chip.mat-chip-with-trailing-icon{padding-left:8px;padding-right:12px}.mat-standard-chip.mat-chip-with-avatar{padding-left:0;padding-right:12px}[dir=rtl] .mat-standard-chip.mat-chip-with-avatar{padding-right:0;padding-left:12px}.mat-standard-chip .mat-chip-avatar{width:24px;height:24px;margin-right:8px;margin-left:4px}[dir=rtl] .mat-standard-chip .mat-chip-avatar{margin-left:8px;margin-right:4px}.mat-standard-chip .mat-chip-remove,.mat-standard-chip .mat-chip-trailing-icon{width:18px;height:18px;cursor:pointer}.mat-standard-chip .mat-chip-remove,.mat-standard-chip .mat-chip-trailing-icon{margin-left:8px;margin-right:0}[dir=rtl] .mat-standard-chip .mat-chip-remove,[dir=rtl] .mat-standard-chip .mat-chip-trailing-icon{margin-right:8px;margin-left:0}.mat-chip-list-wrapper{display:flex;flex-direction:row;flex-wrap:wrap;align-items:center;margin:-4px}.mat-chip-list-wrapper .mat-standard-chip,.mat-chip-list-wrapper input.mat-input-element{margin:4px}.mat-chip-list-stacked .mat-chip-list-wrapper{flex-direction:column;align-items:flex-start}.mat-chip-list-stacked .mat-chip-list-wrapper .mat-standard-chip{width:100%}.mat-chip-avatar{border-radius:50%;justify-content:center;align-items:center;display:flex;overflow:hidden;object-fit:cover}input.mat-chip-input{width:150px;margin:4px;flex:1 0 150px}"], |
| encapsulation: core.ViewEncapsulation.None, |
| changeDetection: core.ChangeDetectionStrategy.OnPush |
| },] }, |
| ]; |
| /** @nocollapse */ |
| MatChipList.ctorParameters = function () { return [ |
| { type: core.ElementRef }, |
| { type: core.ChangeDetectorRef }, |
| { type: bidi.Directionality, decorators: [{ type: core.Optional }] }, |
| { type: forms.NgForm, decorators: [{ type: core.Optional }] }, |
| { type: forms.FormGroupDirective, decorators: [{ type: core.Optional }] }, |
| { type: core$1.ErrorStateMatcher }, |
| { type: forms.NgControl, decorators: [{ type: core.Optional }, { type: core.Self }] } |
| ]; }; |
| MatChipList.propDecorators = { |
| errorStateMatcher: [{ type: core.Input }], |
| multiple: [{ type: core.Input }], |
| compareWith: [{ type: core.Input }], |
| value: [{ type: core.Input }], |
| required: [{ type: core.Input }], |
| placeholder: [{ type: core.Input }], |
| disabled: [{ type: core.Input }], |
| ariaOrientation: [{ type: core.Input, args: ['aria-orientation',] }], |
| selectable: [{ type: core.Input }], |
| tabIndex: [{ type: core.Input }], |
| change: [{ type: core.Output }], |
| valueChange: [{ type: core.Output }], |
| chips: [{ type: core.ContentChildren, args: [MatChip, { |
| // We need to use `descendants: true`, because Ivy will no longer match |
| // indirect descendants if it's left as false. |
| descendants: true |
| },] }] |
| }; |
| return MatChipList; |
| }(_MatChipListMixinBase)); |
| |
| /** |
| * @fileoverview added by tsickle |
| * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc |
| */ |
| // Increasing integer for generating unique ids. |
| /** @type {?} */ |
| var nextUniqueId$1 = 0; |
| /** |
| * Directive that adds chip-specific behaviors to an input element inside `<mat-form-field>`. |
| * May be placed inside or outside of an `<mat-chip-list>`. |
| */ |
| var MatChipInput = /** @class */ (function () { |
| function MatChipInput(_elementRef, _defaultOptions) { |
| this._elementRef = _elementRef; |
| this._defaultOptions = _defaultOptions; |
| /** |
| * Whether the control is focused. |
| */ |
| this.focused = false; |
| this._addOnBlur = false; |
| /** |
| * The list of key codes that will trigger a chipEnd event. |
| * |
| * Defaults to `[ENTER]`. |
| */ |
| this.separatorKeyCodes = this._defaultOptions.separatorKeyCodes; |
| /** |
| * Emitted when a chip is to be added. |
| */ |
| this.chipEnd = new core.EventEmitter(); |
| /** |
| * The input's placeholder text. |
| */ |
| this.placeholder = ''; |
| /** |
| * Unique id for the input. |
| */ |
| this.id = "mat-chip-list-input-" + nextUniqueId$1++; |
| this._disabled = false; |
| this._inputElement = (/** @type {?} */ (this._elementRef.nativeElement)); |
| } |
| Object.defineProperty(MatChipInput.prototype, "chipList", { |
| /** Register input for chip list */ |
| set: /** |
| * Register input for chip list |
| * @param {?} value |
| * @return {?} |
| */ |
| function (value) { |
| if (value) { |
| this._chipList = value; |
| this._chipList.registerInput(this); |
| } |
| }, |
| enumerable: true, |
| configurable: true |
| }); |
| Object.defineProperty(MatChipInput.prototype, "addOnBlur", { |
| /** |
| * Whether or not the chipEnd event will be emitted when the input is blurred. |
| */ |
| get: /** |
| * Whether or not the chipEnd event will be emitted when the input is blurred. |
| * @return {?} |
| */ |
| function () { return this._addOnBlur; }, |
| set: /** |
| * @param {?} value |
| * @return {?} |
| */ |
| function (value) { this._addOnBlur = coercion.coerceBooleanProperty(value); }, |
| enumerable: true, |
| configurable: true |
| }); |
| Object.defineProperty(MatChipInput.prototype, "disabled", { |
| /** Whether the input is disabled. */ |
| get: /** |
| * Whether the input is disabled. |
| * @return {?} |
| */ |
| function () { return this._disabled || (this._chipList && this._chipList.disabled); }, |
| set: /** |
| * @param {?} value |
| * @return {?} |
| */ |
| function (value) { this._disabled = coercion.coerceBooleanProperty(value); }, |
| enumerable: true, |
| configurable: true |
| }); |
| Object.defineProperty(MatChipInput.prototype, "empty", { |
| /** Whether the input is empty. */ |
| get: /** |
| * Whether the input is empty. |
| * @return {?} |
| */ |
| function () { return !this._inputElement.value; }, |
| enumerable: true, |
| configurable: true |
| }); |
| /** |
| * @return {?} |
| */ |
| MatChipInput.prototype.ngOnChanges = /** |
| * @return {?} |
| */ |
| function () { |
| this._chipList.stateChanges.next(); |
| }; |
| /** Utility method to make host definition/tests more clear. */ |
| /** |
| * Utility method to make host definition/tests more clear. |
| * @param {?=} event |
| * @return {?} |
| */ |
| MatChipInput.prototype._keydown = /** |
| * Utility method to make host definition/tests more clear. |
| * @param {?=} event |
| * @return {?} |
| */ |
| function (event) { |
| // Allow the user's focus to escape when they're tabbing forward. Note that we don't |
| // want to do this when going backwards, because focus should go back to the first chip. |
| if (event && event.keyCode === keycodes.TAB && !keycodes.hasModifierKey(event, 'shiftKey')) { |
| this._chipList._allowFocusEscape(); |
| } |
| this._emitChipEnd(event); |
| }; |
| /** Checks to see if the blur should emit the (chipEnd) event. */ |
| /** |
| * Checks to see if the blur should emit the (chipEnd) event. |
| * @return {?} |
| */ |
| MatChipInput.prototype._blur = /** |
| * Checks to see if the blur should emit the (chipEnd) event. |
| * @return {?} |
| */ |
| function () { |
| if (this.addOnBlur) { |
| this._emitChipEnd(); |
| } |
| this.focused = false; |
| // Blur the chip list if it is not focused |
| if (!this._chipList.focused) { |
| this._chipList._blur(); |
| } |
| this._chipList.stateChanges.next(); |
| }; |
| /** |
| * @return {?} |
| */ |
| MatChipInput.prototype._focus = /** |
| * @return {?} |
| */ |
| function () { |
| this.focused = true; |
| this._chipList.stateChanges.next(); |
| }; |
| /** Checks to see if the (chipEnd) event needs to be emitted. */ |
| /** |
| * Checks to see if the (chipEnd) event needs to be emitted. |
| * @param {?=} event |
| * @return {?} |
| */ |
| MatChipInput.prototype._emitChipEnd = /** |
| * Checks to see if the (chipEnd) event needs to be emitted. |
| * @param {?=} event |
| * @return {?} |
| */ |
| function (event) { |
| if (!this._inputElement.value && !!event) { |
| this._chipList._keydown(event); |
| } |
| if (!event || this._isSeparatorKey(event)) { |
| this.chipEnd.emit({ input: this._inputElement, value: this._inputElement.value }); |
| if (event) { |
| event.preventDefault(); |
| } |
| } |
| }; |
| /** |
| * @return {?} |
| */ |
| MatChipInput.prototype._onInput = /** |
| * @return {?} |
| */ |
| function () { |
| // Let chip list know whenever the value changes. |
| this._chipList.stateChanges.next(); |
| }; |
| /** Focuses the input. */ |
| /** |
| * Focuses the input. |
| * @return {?} |
| */ |
| MatChipInput.prototype.focus = /** |
| * Focuses the input. |
| * @return {?} |
| */ |
| function () { |
| this._inputElement.focus(); |
| }; |
| /** Checks whether a keycode is one of the configured separators. */ |
| /** |
| * Checks whether a keycode is one of the configured separators. |
| * @private |
| * @param {?} event |
| * @return {?} |
| */ |
| MatChipInput.prototype._isSeparatorKey = /** |
| * Checks whether a keycode is one of the configured separators. |
| * @private |
| * @param {?} event |
| * @return {?} |
| */ |
| function (event) { |
| if (keycodes.hasModifierKey(event)) { |
| return false; |
| } |
| /** @type {?} */ |
| var separators = this.separatorKeyCodes; |
| /** @type {?} */ |
| var keyCode = event.keyCode; |
| return Array.isArray(separators) ? separators.indexOf(keyCode) > -1 : separators.has(keyCode); |
| }; |
| MatChipInput.decorators = [ |
| { type: core.Directive, args: [{ |
| selector: 'input[matChipInputFor]', |
| exportAs: 'matChipInput, matChipInputFor', |
| host: { |
| 'class': 'mat-chip-input mat-input-element', |
| '(keydown)': '_keydown($event)', |
| '(blur)': '_blur()', |
| '(focus)': '_focus()', |
| '(input)': '_onInput()', |
| '[id]': 'id', |
| '[attr.disabled]': 'disabled || null', |
| '[attr.placeholder]': 'placeholder || null', |
| '[attr.aria-invalid]': '_chipList && _chipList.ngControl ? _chipList.ngControl.invalid : null', |
| } |
| },] }, |
| ]; |
| /** @nocollapse */ |
| MatChipInput.ctorParameters = function () { return [ |
| { type: core.ElementRef }, |
| { type: undefined, decorators: [{ type: core.Inject, args: [MAT_CHIPS_DEFAULT_OPTIONS,] }] } |
| ]; }; |
| MatChipInput.propDecorators = { |
| chipList: [{ type: core.Input, args: ['matChipInputFor',] }], |
| addOnBlur: [{ type: core.Input, args: ['matChipInputAddOnBlur',] }], |
| separatorKeyCodes: [{ type: core.Input, args: ['matChipInputSeparatorKeyCodes',] }], |
| chipEnd: [{ type: core.Output, args: ['matChipInputTokenEnd',] }], |
| placeholder: [{ type: core.Input }], |
| id: [{ type: core.Input }], |
| disabled: [{ type: core.Input }] |
| }; |
| return MatChipInput; |
| }()); |
| |
| /** |
| * @fileoverview added by tsickle |
| * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc |
| */ |
| /** @type {?} */ |
| var CHIP_DECLARATIONS = [ |
| MatChipList, |
| MatChip, |
| MatChipInput, |
| MatChipRemove, |
| MatChipAvatar, |
| MatChipTrailingIcon, |
| ]; |
| var ɵ0 = ({ |
| separatorKeyCodes: [keycodes.ENTER] |
| }); |
| var MatChipsModule = /** @class */ (function () { |
| function MatChipsModule() { |
| } |
| MatChipsModule.decorators = [ |
| { type: core.NgModule, args: [{ |
| exports: CHIP_DECLARATIONS, |
| declarations: CHIP_DECLARATIONS, |
| providers: [ |
| core$1.ErrorStateMatcher, |
| { |
| provide: MAT_CHIPS_DEFAULT_OPTIONS, |
| useValue: (/** @type {?} */ (ɵ0)) |
| } |
| ] |
| },] }, |
| ]; |
| return MatChipsModule; |
| }()); |
| |
| exports.MatChipsModule = MatChipsModule; |
| exports.MatChipListChange = MatChipListChange; |
| exports.MatChipList = MatChipList; |
| exports.MatChipSelectionChange = MatChipSelectionChange; |
| exports.MatChipAvatar = MatChipAvatar; |
| exports.MatChipTrailingIcon = MatChipTrailingIcon; |
| exports.MatChip = MatChip; |
| exports.MatChipRemove = MatChipRemove; |
| exports.MatChipInput = MatChipInput; |
| exports.MAT_CHIPS_DEFAULT_OPTIONS = MAT_CHIPS_DEFAULT_OPTIONS; |
| |
| Object.defineProperty(exports, '__esModule', { value: true }); |
| |
| }))); |
| //# sourceMappingURL=material-chips.umd.js.map |
