chip.d.ts 6.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163
  1. /**
  2. * @license
  3. * Copyright Google LLC All Rights Reserved.
  4. *
  5. * Use of this source code is governed by an MIT-style license that can be
  6. * found in the LICENSE file at https://angular.io/license
  7. */
  8. import { FocusableOption } from '@angular/cdk/a11y';
  9. import { Platform } from '@angular/cdk/platform';
  10. import { ElementRef, EventEmitter, NgZone, OnDestroy } from '@angular/core';
  11. import { CanColor, CanColorCtor, CanDisable, CanDisableCtor, CanDisableRipple, CanDisableRippleCtor, RippleConfig, RippleGlobalOptions, RippleTarget } from '@angular/material/core';
  12. import { Subject } from 'rxjs';
  13. /** Represents an event fired on an individual `mat-chip`. */
  14. export interface MatChipEvent {
  15. /** The chip the event was fired on. */
  16. chip: MatChip;
  17. }
  18. /** Event object emitted by MatChip when selected or deselected. */
  19. export declare class MatChipSelectionChange {
  20. /** Reference to the chip that emitted the event. */
  21. source: MatChip;
  22. /** Whether the chip that emitted the event is selected. */
  23. selected: boolean;
  24. /** Whether the selection change was a result of a user interaction. */
  25. isUserInput: boolean;
  26. constructor(
  27. /** Reference to the chip that emitted the event. */
  28. source: MatChip,
  29. /** Whether the chip that emitted the event is selected. */
  30. selected: boolean,
  31. /** Whether the selection change was a result of a user interaction. */
  32. isUserInput?: boolean);
  33. }
  34. /** @docs-private */
  35. declare class MatChipBase {
  36. _elementRef: ElementRef;
  37. constructor(_elementRef: ElementRef);
  38. }
  39. declare const _MatChipMixinBase: CanColorCtor & CanDisableRippleCtor & CanDisableCtor & typeof MatChipBase;
  40. /**
  41. * Dummy directive to add CSS class to chip avatar.
  42. * @docs-private
  43. */
  44. export declare class MatChipAvatar {
  45. }
  46. /**
  47. * Dummy directive to add CSS class to chip trailing icon.
  48. * @docs-private
  49. */
  50. export declare class MatChipTrailingIcon {
  51. }
  52. /**
  53. * Material design styled Chip component. Used inside the MatChipList component.
  54. */
  55. export declare class MatChip extends _MatChipMixinBase implements FocusableOption, OnDestroy, CanColor, CanDisable, CanDisableRipple, RippleTarget {
  56. _elementRef: ElementRef<HTMLElement>;
  57. private _ngZone;
  58. /** Reference to the RippleRenderer for the chip. */
  59. private _chipRipple;
  60. /**
  61. * Ripple configuration for ripples that are launched on pointer down. The ripple config
  62. * is set to the global ripple options since we don't have any configurable options for
  63. * the chip ripples.
  64. * @docs-private
  65. */
  66. rippleConfig: RippleConfig & RippleGlobalOptions;
  67. /**
  68. * Whether ripples are disabled on interaction
  69. * @docs-private
  70. */
  71. readonly rippleDisabled: boolean;
  72. /** Whether the chip has focus. */
  73. _hasFocus: boolean;
  74. /** Whether animations for the chip are enabled. */
  75. _animationsDisabled: boolean;
  76. /** Whether the chip list is selectable */
  77. chipListSelectable: boolean;
  78. /** Whether the chip list is in multi-selection mode. */
  79. _chipListMultiple: boolean;
  80. /** The chip avatar */
  81. avatar: MatChipAvatar;
  82. /** The chip's trailing icon. */
  83. trailingIcon: MatChipTrailingIcon;
  84. /** The chip's remove toggler. */
  85. removeIcon: MatChipRemove;
  86. /** Whether the chip is selected. */
  87. selected: boolean;
  88. protected _selected: boolean;
  89. /** The value of the chip. Defaults to the content inside `<mat-chip>` tags. */
  90. value: any;
  91. protected _value: any;
  92. /**
  93. * Whether or not the chip is selectable. When a chip is not selectable,
  94. * changes to its selected state are always ignored. By default a chip is
  95. * selectable, and it becomes non-selectable if its parent chip list is
  96. * not selectable.
  97. */
  98. selectable: boolean;
  99. protected _selectable: boolean;
  100. /**
  101. * Determines whether or not the chip displays the remove styling and emits (removed) events.
  102. */
  103. removable: boolean;
  104. protected _removable: boolean;
  105. /** Emits when the chip is focused. */
  106. readonly _onFocus: Subject<MatChipEvent>;
  107. /** Emits when the chip is blured. */
  108. readonly _onBlur: Subject<MatChipEvent>;
  109. /** Emitted when the chip is selected or deselected. */
  110. readonly selectionChange: EventEmitter<MatChipSelectionChange>;
  111. /** Emitted when the chip is destroyed. */
  112. readonly destroyed: EventEmitter<MatChipEvent>;
  113. /** Emitted when a chip is to be removed. */
  114. readonly removed: EventEmitter<MatChipEvent>;
  115. /** The ARIA selected applied to the chip. */
  116. readonly ariaSelected: string | null;
  117. constructor(_elementRef: ElementRef<HTMLElement>, _ngZone: NgZone, platform: Platform, globalRippleOptions: RippleGlobalOptions | null, animationMode?: string);
  118. _addHostClassName(): void;
  119. ngOnDestroy(): void;
  120. /** Selects the chip. */
  121. select(): void;
  122. /** Deselects the chip. */
  123. deselect(): void;
  124. /** Select this chip and emit selected event */
  125. selectViaInteraction(): void;
  126. /** Toggles the current selected state of this chip. */
  127. toggleSelected(isUserInput?: boolean): boolean;
  128. /** Allows for programmatic focusing of the chip. */
  129. focus(): void;
  130. /**
  131. * Allows for programmatic removal of the chip. Called by the MatChipList when the DELETE or
  132. * BACKSPACE keys are pressed.
  133. *
  134. * Informs any listeners of the removal request. Does not remove the chip from the DOM.
  135. */
  136. remove(): void;
  137. /** Handles click events on the chip. */
  138. _handleClick(event: Event): void;
  139. /** Handle custom key presses. */
  140. _handleKeydown(event: KeyboardEvent): void;
  141. _blur(): void;
  142. private _dispatchSelectionChange;
  143. }
  144. /**
  145. * Applies proper (click) support and adds styling for use with the Material Design "cancel" icon
  146. * available at https://material.io/icons/#ic_cancel.
  147. *
  148. * Example:
  149. *
  150. * `<mat-chip>
  151. * <mat-icon matChipRemove>cancel</mat-icon>
  152. * </mat-chip>`
  153. *
  154. * You *may* use a custom icon, but you may need to override the `mat-chip-remove` positioning
  155. * styles to properly center the icon within the chip.
  156. */
  157. export declare class MatChipRemove {
  158. protected _parentChip: MatChip;
  159. constructor(_parentChip: MatChip);
  160. /** Calls the parent chip's public `remove()` method if applicable. */
  161. _handleClick(event: Event): void;
  162. }
  163. export {};