accordion.es5.js 12 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387
  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 { coerceBooleanProperty } from '@angular/cdk/coercion';
  9. import { Directive, Input, Output, EventEmitter, Optional, ChangeDetectorRef, SkipSelf, NgModule } from '@angular/core';
  10. import { Subject, Subscription } from 'rxjs';
  11. import { UniqueSelectionDispatcher } from '@angular/cdk/collections';
  12. /**
  13. * @fileoverview added by tsickle
  14. * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
  15. */
  16. /**
  17. * Used to generate unique ID for each accordion.
  18. * @type {?}
  19. */
  20. var nextId = 0;
  21. /**
  22. * Directive whose purpose is to manage the expanded state of CdkAccordionItem children.
  23. */
  24. var CdkAccordion = /** @class */ (function () {
  25. function CdkAccordion() {
  26. /**
  27. * Emits when the state of the accordion changes
  28. */
  29. this._stateChanges = new Subject();
  30. /**
  31. * Stream that emits true/false when openAll/closeAll is triggered.
  32. */
  33. this._openCloseAllActions = new Subject();
  34. /**
  35. * A readonly id value to use for unique selection coordination.
  36. */
  37. this.id = "cdk-accordion-" + nextId++;
  38. this._multi = false;
  39. }
  40. Object.defineProperty(CdkAccordion.prototype, "multi", {
  41. /** Whether the accordion should allow multiple expanded accordion items simultaneously. */
  42. get: /**
  43. * Whether the accordion should allow multiple expanded accordion items simultaneously.
  44. * @return {?}
  45. */
  46. function () { return this._multi; },
  47. set: /**
  48. * @param {?} multi
  49. * @return {?}
  50. */
  51. function (multi) { this._multi = coerceBooleanProperty(multi); },
  52. enumerable: true,
  53. configurable: true
  54. });
  55. /** Opens all enabled accordion items in an accordion where multi is enabled. */
  56. /**
  57. * Opens all enabled accordion items in an accordion where multi is enabled.
  58. * @return {?}
  59. */
  60. CdkAccordion.prototype.openAll = /**
  61. * Opens all enabled accordion items in an accordion where multi is enabled.
  62. * @return {?}
  63. */
  64. function () {
  65. this._openCloseAll(true);
  66. };
  67. /** Closes all enabled accordion items in an accordion where multi is enabled. */
  68. /**
  69. * Closes all enabled accordion items in an accordion where multi is enabled.
  70. * @return {?}
  71. */
  72. CdkAccordion.prototype.closeAll = /**
  73. * Closes all enabled accordion items in an accordion where multi is enabled.
  74. * @return {?}
  75. */
  76. function () {
  77. this._openCloseAll(false);
  78. };
  79. /**
  80. * @param {?} changes
  81. * @return {?}
  82. */
  83. CdkAccordion.prototype.ngOnChanges = /**
  84. * @param {?} changes
  85. * @return {?}
  86. */
  87. function (changes) {
  88. this._stateChanges.next(changes);
  89. };
  90. /**
  91. * @return {?}
  92. */
  93. CdkAccordion.prototype.ngOnDestroy = /**
  94. * @return {?}
  95. */
  96. function () {
  97. this._stateChanges.complete();
  98. };
  99. /**
  100. * @private
  101. * @param {?} expanded
  102. * @return {?}
  103. */
  104. CdkAccordion.prototype._openCloseAll = /**
  105. * @private
  106. * @param {?} expanded
  107. * @return {?}
  108. */
  109. function (expanded) {
  110. if (this.multi) {
  111. this._openCloseAllActions.next(expanded);
  112. }
  113. };
  114. CdkAccordion.decorators = [
  115. { type: Directive, args: [{
  116. selector: 'cdk-accordion, [cdkAccordion]',
  117. exportAs: 'cdkAccordion',
  118. },] },
  119. ];
  120. CdkAccordion.propDecorators = {
  121. multi: [{ type: Input }]
  122. };
  123. return CdkAccordion;
  124. }());
  125. /**
  126. * @fileoverview added by tsickle
  127. * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
  128. */
  129. /**
  130. * Used to generate unique ID for each accordion item.
  131. * @type {?}
  132. */
  133. var nextId$1 = 0;
  134. var ɵ0 = undefined;
  135. /**
  136. * An basic directive expected to be extended and decorated as a component. Sets up all
  137. * events and attributes needed to be managed by a CdkAccordion parent.
  138. */
  139. var CdkAccordionItem = /** @class */ (function () {
  140. function CdkAccordionItem(accordion, _changeDetectorRef, _expansionDispatcher) {
  141. var _this = this;
  142. this.accordion = accordion;
  143. this._changeDetectorRef = _changeDetectorRef;
  144. this._expansionDispatcher = _expansionDispatcher;
  145. /**
  146. * Subscription to openAll/closeAll events.
  147. */
  148. this._openCloseAllSubscription = Subscription.EMPTY;
  149. /**
  150. * Event emitted every time the AccordionItem is closed.
  151. */
  152. this.closed = new EventEmitter();
  153. /**
  154. * Event emitted every time the AccordionItem is opened.
  155. */
  156. this.opened = new EventEmitter();
  157. /**
  158. * Event emitted when the AccordionItem is destroyed.
  159. */
  160. this.destroyed = new EventEmitter();
  161. /**
  162. * Emits whenever the expanded state of the accordion changes.
  163. * Primarily used to facilitate two-way binding.
  164. * \@docs-private
  165. */
  166. this.expandedChange = new EventEmitter();
  167. /**
  168. * The unique AccordionItem id.
  169. */
  170. this.id = "cdk-accordion-child-" + nextId$1++;
  171. this._expanded = false;
  172. this._disabled = false;
  173. /**
  174. * Unregister function for _expansionDispatcher.
  175. */
  176. this._removeUniqueSelectionListener = (/**
  177. * @return {?}
  178. */
  179. function () { });
  180. this._removeUniqueSelectionListener =
  181. _expansionDispatcher.listen((/**
  182. * @param {?} id
  183. * @param {?} accordionId
  184. * @return {?}
  185. */
  186. function (id, accordionId) {
  187. if (_this.accordion && !_this.accordion.multi &&
  188. _this.accordion.id === accordionId && _this.id !== id) {
  189. _this.expanded = false;
  190. }
  191. }));
  192. // When an accordion item is hosted in an accordion, subscribe to open/close events.
  193. if (this.accordion) {
  194. this._openCloseAllSubscription = this._subscribeToOpenCloseAllActions();
  195. }
  196. }
  197. Object.defineProperty(CdkAccordionItem.prototype, "expanded", {
  198. /** Whether the AccordionItem is expanded. */
  199. get: /**
  200. * Whether the AccordionItem is expanded.
  201. * @return {?}
  202. */
  203. function () { return this._expanded; },
  204. set: /**
  205. * @param {?} expanded
  206. * @return {?}
  207. */
  208. function (expanded) {
  209. expanded = coerceBooleanProperty(expanded);
  210. // Only emit events and update the internal value if the value changes.
  211. if (this._expanded !== expanded) {
  212. this._expanded = expanded;
  213. this.expandedChange.emit(expanded);
  214. if (expanded) {
  215. this.opened.emit();
  216. /**
  217. * In the unique selection dispatcher, the id parameter is the id of the CdkAccordionItem,
  218. * the name value is the id of the accordion.
  219. * @type {?}
  220. */
  221. var accordionId = this.accordion ? this.accordion.id : this.id;
  222. this._expansionDispatcher.notify(this.id, accordionId);
  223. }
  224. else {
  225. this.closed.emit();
  226. }
  227. // Ensures that the animation will run when the value is set outside of an `@Input`.
  228. // This includes cases like the open, close and toggle methods.
  229. this._changeDetectorRef.markForCheck();
  230. }
  231. },
  232. enumerable: true,
  233. configurable: true
  234. });
  235. Object.defineProperty(CdkAccordionItem.prototype, "disabled", {
  236. /** Whether the AccordionItem is disabled. */
  237. get: /**
  238. * Whether the AccordionItem is disabled.
  239. * @return {?}
  240. */
  241. function () { return this._disabled; },
  242. set: /**
  243. * @param {?} disabled
  244. * @return {?}
  245. */
  246. function (disabled) { this._disabled = coerceBooleanProperty(disabled); },
  247. enumerable: true,
  248. configurable: true
  249. });
  250. /** Emits an event for the accordion item being destroyed. */
  251. /**
  252. * Emits an event for the accordion item being destroyed.
  253. * @return {?}
  254. */
  255. CdkAccordionItem.prototype.ngOnDestroy = /**
  256. * Emits an event for the accordion item being destroyed.
  257. * @return {?}
  258. */
  259. function () {
  260. this.opened.complete();
  261. this.closed.complete();
  262. this.destroyed.emit();
  263. this.destroyed.complete();
  264. this._removeUniqueSelectionListener();
  265. this._openCloseAllSubscription.unsubscribe();
  266. };
  267. /** Toggles the expanded state of the accordion item. */
  268. /**
  269. * Toggles the expanded state of the accordion item.
  270. * @return {?}
  271. */
  272. CdkAccordionItem.prototype.toggle = /**
  273. * Toggles the expanded state of the accordion item.
  274. * @return {?}
  275. */
  276. function () {
  277. if (!this.disabled) {
  278. this.expanded = !this.expanded;
  279. }
  280. };
  281. /** Sets the expanded state of the accordion item to false. */
  282. /**
  283. * Sets the expanded state of the accordion item to false.
  284. * @return {?}
  285. */
  286. CdkAccordionItem.prototype.close = /**
  287. * Sets the expanded state of the accordion item to false.
  288. * @return {?}
  289. */
  290. function () {
  291. if (!this.disabled) {
  292. this.expanded = false;
  293. }
  294. };
  295. /** Sets the expanded state of the accordion item to true. */
  296. /**
  297. * Sets the expanded state of the accordion item to true.
  298. * @return {?}
  299. */
  300. CdkAccordionItem.prototype.open = /**
  301. * Sets the expanded state of the accordion item to true.
  302. * @return {?}
  303. */
  304. function () {
  305. if (!this.disabled) {
  306. this.expanded = true;
  307. }
  308. };
  309. /**
  310. * @private
  311. * @return {?}
  312. */
  313. CdkAccordionItem.prototype._subscribeToOpenCloseAllActions = /**
  314. * @private
  315. * @return {?}
  316. */
  317. function () {
  318. var _this = this;
  319. return this.accordion._openCloseAllActions.subscribe((/**
  320. * @param {?} expanded
  321. * @return {?}
  322. */
  323. function (expanded) {
  324. // Only change expanded state if item is enabled
  325. if (!_this.disabled) {
  326. _this.expanded = expanded;
  327. }
  328. }));
  329. };
  330. CdkAccordionItem.decorators = [
  331. { type: Directive, args: [{
  332. selector: 'cdk-accordion-item, [cdkAccordionItem]',
  333. exportAs: 'cdkAccordionItem',
  334. providers: [
  335. // Provide CdkAccordion as undefined to prevent nested accordion items from registering
  336. // to the same accordion.
  337. { provide: CdkAccordion, useValue: ɵ0 },
  338. ],
  339. },] },
  340. ];
  341. /** @nocollapse */
  342. CdkAccordionItem.ctorParameters = function () { return [
  343. { type: CdkAccordion, decorators: [{ type: Optional }, { type: SkipSelf }] },
  344. { type: ChangeDetectorRef },
  345. { type: UniqueSelectionDispatcher }
  346. ]; };
  347. CdkAccordionItem.propDecorators = {
  348. closed: [{ type: Output }],
  349. opened: [{ type: Output }],
  350. destroyed: [{ type: Output }],
  351. expandedChange: [{ type: Output }],
  352. expanded: [{ type: Input }],
  353. disabled: [{ type: Input }]
  354. };
  355. return CdkAccordionItem;
  356. }());
  357. /**
  358. * @fileoverview added by tsickle
  359. * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
  360. */
  361. var CdkAccordionModule = /** @class */ (function () {
  362. function CdkAccordionModule() {
  363. }
  364. CdkAccordionModule.decorators = [
  365. { type: NgModule, args: [{
  366. exports: [CdkAccordion, CdkAccordionItem],
  367. declarations: [CdkAccordion, CdkAccordionItem],
  368. },] },
  369. ];
  370. return CdkAccordionModule;
  371. }());
  372. /**
  373. * @fileoverview added by tsickle
  374. * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
  375. */
  376. /**
  377. * @fileoverview added by tsickle
  378. * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
  379. */
  380. export { CdkAccordionItem, CdkAccordion, CdkAccordionModule };
  381. //# sourceMappingURL=accordion.es5.js.map