cdk-tree.umd.js 54 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910911912913914915916917918919920921922923924925926927928929930931932933934935936937938939940941942943944945946947948949950951952953954955956957958959960961962963964965966967968969970971972973974975976977978979980981982983984985986987988989990991992993994995996997998999100010011002100310041005100610071008100910101011101210131014101510161017101810191020102110221023102410251026102710281029103010311032103310341035103610371038103910401041104210431044104510461047104810491050105110521053105410551056105710581059106010611062106310641065106610671068106910701071107210731074107510761077107810791080108110821083108410851086108710881089109010911092109310941095109610971098109911001101110211031104110511061107110811091110111111121113111411151116111711181119112011211122112311241125112611271128112911301131113211331134113511361137113811391140114111421143114411451146114711481149115011511152115311541155115611571158115911601161116211631164116511661167116811691170117111721173117411751176117711781179118011811182118311841185118611871188118911901191119211931194119511961197119811991200120112021203120412051206120712081209121012111212121312141215121612171218121912201221122212231224122512261227122812291230123112321233123412351236123712381239124012411242124312441245124612471248124912501251125212531254125512561257125812591260126112621263126412651266126712681269127012711272127312741275127612771278127912801281128212831284128512861287128812891290129112921293129412951296129712981299130013011302130313041305130613071308130913101311131213131314131513161317131813191320132113221323132413251326132713281329133013311332133313341335133613371338133913401341134213431344134513461347134813491350135113521353135413551356135713581359136013611362136313641365136613671368136913701371137213731374137513761377137813791380138113821383138413851386138713881389139013911392139313941395139613971398139914001401140214031404140514061407140814091410141114121413141414151416141714181419142014211422142314241425142614271428142914301431143214331434143514361437143814391440144114421443144414451446144714481449145014511452145314541455145614571458145914601461146214631464146514661467146814691470147114721473147414751476147714781479148014811482148314841485148614871488148914901491149214931494149514961497149814991500150115021503150415051506150715081509151015111512
  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. (function (global, factory) {
  9. typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('@angular/cdk/collections'), require('rxjs'), require('rxjs/operators'), require('@angular/core'), require('@angular/cdk/bidi'), require('@angular/cdk/coercion'), require('@angular/cdk/a11y'), require('@angular/common')) :
  10. typeof define === 'function' && define.amd ? define('@angular/cdk/tree', ['exports', '@angular/cdk/collections', 'rxjs', 'rxjs/operators', '@angular/core', '@angular/cdk/bidi', '@angular/cdk/coercion', '@angular/cdk/a11y', '@angular/common'], factory) :
  11. (factory((global.ng = global.ng || {}, global.ng.cdk = global.ng.cdk || {}, global.ng.cdk.tree = {}),global.ng.cdk.collections,global.rxjs,global.rxjs.operators,global.ng.core,global.ng.cdk.bidi,global.ng.cdk.coercion,global.ng.cdk.a11y,global.ng.common));
  12. }(this, (function (exports,collections,rxjs,operators,core,bidi,coercion,a11y,common) { 'use strict';
  13. /*! *****************************************************************************
  14. Copyright (c) Microsoft Corporation. All rights reserved.
  15. Licensed under the Apache License, Version 2.0 (the "License"); you may not use
  16. this file except in compliance with the License. You may obtain a copy of the
  17. License at http://www.apache.org/licenses/LICENSE-2.0
  18. THIS CODE IS PROVIDED ON AN *AS IS* BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
  19. KIND, EITHER EXPRESS OR IMPLIED, INCLUDING WITHOUT LIMITATION ANY IMPLIED
  20. WARRANTIES OR CONDITIONS OF TITLE, FITNESS FOR A PARTICULAR PURPOSE,
  21. MERCHANTABLITY OR NON-INFRINGEMENT.
  22. See the Apache Version 2.0 License for specific language governing permissions
  23. and limitations under the License.
  24. ***************************************************************************** */
  25. /* global Reflect, Promise */
  26. var extendStatics = function(d, b) {
  27. extendStatics = Object.setPrototypeOf ||
  28. ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
  29. function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
  30. return extendStatics(d, b);
  31. };
  32. function __extends(d, b) {
  33. extendStatics(d, b);
  34. function __() { this.constructor = d; }
  35. d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
  36. }
  37. /**
  38. * @fileoverview added by tsickle
  39. * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
  40. */
  41. /**
  42. * Base tree control. It has basic toggle/expand/collapse operations on a single data node.
  43. * @abstract
  44. * @template T
  45. */
  46. var /**
  47. * Base tree control. It has basic toggle/expand/collapse operations on a single data node.
  48. * @abstract
  49. * @template T
  50. */
  51. BaseTreeControl = /** @class */ (function () {
  52. function BaseTreeControl() {
  53. /**
  54. * A selection model with multi-selection to track expansion status.
  55. */
  56. this.expansionModel = new collections.SelectionModel(true);
  57. }
  58. /** Toggles one single data node's expanded/collapsed state. */
  59. /**
  60. * Toggles one single data node's expanded/collapsed state.
  61. * @param {?} dataNode
  62. * @return {?}
  63. */
  64. BaseTreeControl.prototype.toggle = /**
  65. * Toggles one single data node's expanded/collapsed state.
  66. * @param {?} dataNode
  67. * @return {?}
  68. */
  69. function (dataNode) {
  70. this.expansionModel.toggle(dataNode);
  71. };
  72. /** Expands one single data node. */
  73. /**
  74. * Expands one single data node.
  75. * @param {?} dataNode
  76. * @return {?}
  77. */
  78. BaseTreeControl.prototype.expand = /**
  79. * Expands one single data node.
  80. * @param {?} dataNode
  81. * @return {?}
  82. */
  83. function (dataNode) {
  84. this.expansionModel.select(dataNode);
  85. };
  86. /** Collapses one single data node. */
  87. /**
  88. * Collapses one single data node.
  89. * @param {?} dataNode
  90. * @return {?}
  91. */
  92. BaseTreeControl.prototype.collapse = /**
  93. * Collapses one single data node.
  94. * @param {?} dataNode
  95. * @return {?}
  96. */
  97. function (dataNode) {
  98. this.expansionModel.deselect(dataNode);
  99. };
  100. /** Whether a given data node is expanded or not. Returns true if the data node is expanded. */
  101. /**
  102. * Whether a given data node is expanded or not. Returns true if the data node is expanded.
  103. * @param {?} dataNode
  104. * @return {?}
  105. */
  106. BaseTreeControl.prototype.isExpanded = /**
  107. * Whether a given data node is expanded or not. Returns true if the data node is expanded.
  108. * @param {?} dataNode
  109. * @return {?}
  110. */
  111. function (dataNode) {
  112. return this.expansionModel.isSelected(dataNode);
  113. };
  114. /** Toggles a subtree rooted at `node` recursively. */
  115. /**
  116. * Toggles a subtree rooted at `node` recursively.
  117. * @param {?} dataNode
  118. * @return {?}
  119. */
  120. BaseTreeControl.prototype.toggleDescendants = /**
  121. * Toggles a subtree rooted at `node` recursively.
  122. * @param {?} dataNode
  123. * @return {?}
  124. */
  125. function (dataNode) {
  126. this.expansionModel.isSelected(dataNode)
  127. ? this.collapseDescendants(dataNode)
  128. : this.expandDescendants(dataNode);
  129. };
  130. /** Collapse all dataNodes in the tree. */
  131. /**
  132. * Collapse all dataNodes in the tree.
  133. * @return {?}
  134. */
  135. BaseTreeControl.prototype.collapseAll = /**
  136. * Collapse all dataNodes in the tree.
  137. * @return {?}
  138. */
  139. function () {
  140. this.expansionModel.clear();
  141. };
  142. /** Expands a subtree rooted at given data node recursively. */
  143. /**
  144. * Expands a subtree rooted at given data node recursively.
  145. * @param {?} dataNode
  146. * @return {?}
  147. */
  148. BaseTreeControl.prototype.expandDescendants = /**
  149. * Expands a subtree rooted at given data node recursively.
  150. * @param {?} dataNode
  151. * @return {?}
  152. */
  153. function (dataNode) {
  154. var _a;
  155. /** @type {?} */
  156. var toBeProcessed = [dataNode];
  157. toBeProcessed.push.apply(toBeProcessed, this.getDescendants(dataNode));
  158. (_a = this.expansionModel).select.apply(_a, toBeProcessed);
  159. };
  160. /** Collapses a subtree rooted at given data node recursively. */
  161. /**
  162. * Collapses a subtree rooted at given data node recursively.
  163. * @param {?} dataNode
  164. * @return {?}
  165. */
  166. BaseTreeControl.prototype.collapseDescendants = /**
  167. * Collapses a subtree rooted at given data node recursively.
  168. * @param {?} dataNode
  169. * @return {?}
  170. */
  171. function (dataNode) {
  172. var _a;
  173. /** @type {?} */
  174. var toBeProcessed = [dataNode];
  175. toBeProcessed.push.apply(toBeProcessed, this.getDescendants(dataNode));
  176. (_a = this.expansionModel).deselect.apply(_a, toBeProcessed);
  177. };
  178. return BaseTreeControl;
  179. }());
  180. /**
  181. * @fileoverview added by tsickle
  182. * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
  183. */
  184. /**
  185. * Flat tree control. Able to expand/collapse a subtree recursively for flattened tree.
  186. * @template T
  187. */
  188. var /**
  189. * Flat tree control. Able to expand/collapse a subtree recursively for flattened tree.
  190. * @template T
  191. */
  192. FlatTreeControl = /** @class */ (function (_super) {
  193. __extends(FlatTreeControl, _super);
  194. /** Construct with flat tree data node functions getLevel and isExpandable. */
  195. function FlatTreeControl(getLevel, isExpandable) {
  196. var _this = _super.call(this) || this;
  197. _this.getLevel = getLevel;
  198. _this.isExpandable = isExpandable;
  199. return _this;
  200. }
  201. /**
  202. * Gets a list of the data node's subtree of descendent data nodes.
  203. *
  204. * To make this working, the `dataNodes` of the TreeControl must be flattened tree nodes
  205. * with correct levels.
  206. */
  207. /**
  208. * Gets a list of the data node's subtree of descendent data nodes.
  209. *
  210. * To make this working, the `dataNodes` of the TreeControl must be flattened tree nodes
  211. * with correct levels.
  212. * @param {?} dataNode
  213. * @return {?}
  214. */
  215. FlatTreeControl.prototype.getDescendants = /**
  216. * Gets a list of the data node's subtree of descendent data nodes.
  217. *
  218. * To make this working, the `dataNodes` of the TreeControl must be flattened tree nodes
  219. * with correct levels.
  220. * @param {?} dataNode
  221. * @return {?}
  222. */
  223. function (dataNode) {
  224. /** @type {?} */
  225. var startIndex = this.dataNodes.indexOf(dataNode);
  226. /** @type {?} */
  227. var results = [];
  228. // Goes through flattened tree nodes in the `dataNodes` array, and get all descendants.
  229. // The level of descendants of a tree node must be greater than the level of the given
  230. // tree node.
  231. // If we reach a node whose level is equal to the level of the tree node, we hit a sibling.
  232. // If we reach a node whose level is greater than the level of the tree node, we hit a
  233. // sibling of an ancestor.
  234. for (var i = startIndex + 1; i < this.dataNodes.length && this.getLevel(dataNode) < this.getLevel(this.dataNodes[i]); i++) {
  235. results.push(this.dataNodes[i]);
  236. }
  237. return results;
  238. };
  239. /**
  240. * Expands all data nodes in the tree.
  241. *
  242. * To make this working, the `dataNodes` variable of the TreeControl must be set to all flattened
  243. * data nodes of the tree.
  244. */
  245. /**
  246. * Expands all data nodes in the tree.
  247. *
  248. * To make this working, the `dataNodes` variable of the TreeControl must be set to all flattened
  249. * data nodes of the tree.
  250. * @return {?}
  251. */
  252. FlatTreeControl.prototype.expandAll = /**
  253. * Expands all data nodes in the tree.
  254. *
  255. * To make this working, the `dataNodes` variable of the TreeControl must be set to all flattened
  256. * data nodes of the tree.
  257. * @return {?}
  258. */
  259. function () {
  260. var _a;
  261. (_a = this.expansionModel).select.apply(_a, this.dataNodes);
  262. };
  263. return FlatTreeControl;
  264. }(BaseTreeControl));
  265. /**
  266. * @fileoverview added by tsickle
  267. * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
  268. */
  269. /**
  270. * Nested tree control. Able to expand/collapse a subtree recursively for NestedNode type.
  271. * @template T
  272. */
  273. var /**
  274. * Nested tree control. Able to expand/collapse a subtree recursively for NestedNode type.
  275. * @template T
  276. */
  277. NestedTreeControl = /** @class */ (function (_super) {
  278. __extends(NestedTreeControl, _super);
  279. /** Construct with nested tree function getChildren. */
  280. function NestedTreeControl(getChildren) {
  281. var _this = _super.call(this) || this;
  282. _this.getChildren = getChildren;
  283. return _this;
  284. }
  285. /**
  286. * Expands all dataNodes in the tree.
  287. *
  288. * To make this working, the `dataNodes` variable of the TreeControl must be set to all root level
  289. * data nodes of the tree.
  290. */
  291. /**
  292. * Expands all dataNodes in the tree.
  293. *
  294. * To make this working, the `dataNodes` variable of the TreeControl must be set to all root level
  295. * data nodes of the tree.
  296. * @return {?}
  297. */
  298. NestedTreeControl.prototype.expandAll = /**
  299. * Expands all dataNodes in the tree.
  300. *
  301. * To make this working, the `dataNodes` variable of the TreeControl must be set to all root level
  302. * data nodes of the tree.
  303. * @return {?}
  304. */
  305. function () {
  306. var _a;
  307. var _this = this;
  308. this.expansionModel.clear();
  309. /** @type {?} */
  310. var allNodes = this.dataNodes.reduce((/**
  311. * @param {?} accumulator
  312. * @param {?} dataNode
  313. * @return {?}
  314. */
  315. function (accumulator, dataNode) {
  316. return accumulator.concat(_this.getDescendants(dataNode), [dataNode]);
  317. }), []);
  318. (_a = this.expansionModel).select.apply(_a, allNodes);
  319. };
  320. /** Gets a list of descendant dataNodes of a subtree rooted at given data node recursively. */
  321. /**
  322. * Gets a list of descendant dataNodes of a subtree rooted at given data node recursively.
  323. * @param {?} dataNode
  324. * @return {?}
  325. */
  326. NestedTreeControl.prototype.getDescendants = /**
  327. * Gets a list of descendant dataNodes of a subtree rooted at given data node recursively.
  328. * @param {?} dataNode
  329. * @return {?}
  330. */
  331. function (dataNode) {
  332. /** @type {?} */
  333. var descendants = [];
  334. this._getDescendants(descendants, dataNode);
  335. // Remove the node itself
  336. return descendants.splice(1);
  337. };
  338. /** A helper function to get descendants recursively. */
  339. /**
  340. * A helper function to get descendants recursively.
  341. * @protected
  342. * @param {?} descendants
  343. * @param {?} dataNode
  344. * @return {?}
  345. */
  346. NestedTreeControl.prototype._getDescendants = /**
  347. * A helper function to get descendants recursively.
  348. * @protected
  349. * @param {?} descendants
  350. * @param {?} dataNode
  351. * @return {?}
  352. */
  353. function (descendants, dataNode) {
  354. var _this = this;
  355. descendants.push(dataNode);
  356. /** @type {?} */
  357. var childrenNodes = this.getChildren(dataNode);
  358. if (Array.isArray(childrenNodes)) {
  359. childrenNodes.forEach((/**
  360. * @param {?} child
  361. * @return {?}
  362. */
  363. function (child) { return _this._getDescendants(descendants, child); }));
  364. }
  365. else if (childrenNodes instanceof rxjs.Observable) {
  366. // TypeScript as of version 3.5 doesn't seem to treat `Boolean` like a function that
  367. // returns a `boolean` specifically in the context of `filter`, so we manually clarify that.
  368. childrenNodes.pipe(operators.take(1), operators.filter((/** @type {?} */ (Boolean))))
  369. .subscribe((/**
  370. * @param {?} children
  371. * @return {?}
  372. */
  373. function (children) {
  374. for (var _i = 0, children_1 = children; _i < children_1.length; _i++) {
  375. var child = children_1[_i];
  376. _this._getDescendants(descendants, child);
  377. }
  378. }));
  379. }
  380. };
  381. return NestedTreeControl;
  382. }(BaseTreeControl));
  383. /**
  384. * @fileoverview added by tsickle
  385. * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
  386. */
  387. /**
  388. * @fileoverview added by tsickle
  389. * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
  390. */
  391. /**
  392. * Injection token used to provide a `CdkTreeNode` to its outlet.
  393. * Used primarily to avoid circular imports.
  394. * \@docs-private
  395. * @type {?}
  396. */
  397. var CDK_TREE_NODE_OUTLET_NODE = new core.InjectionToken('CDK_TREE_NODE_OUTLET_NODE');
  398. /**
  399. * Outlet for nested CdkNode. Put `[cdkTreeNodeOutlet]` on a tag to place children dataNodes
  400. * inside the outlet.
  401. */
  402. var CdkTreeNodeOutlet = /** @class */ (function () {
  403. function CdkTreeNodeOutlet(viewContainer, _node) {
  404. this.viewContainer = viewContainer;
  405. this._node = _node;
  406. }
  407. CdkTreeNodeOutlet.decorators = [
  408. { type: core.Directive, args: [{
  409. selector: '[cdkTreeNodeOutlet]'
  410. },] },
  411. ];
  412. /** @nocollapse */
  413. CdkTreeNodeOutlet.ctorParameters = function () { return [
  414. { type: core.ViewContainerRef },
  415. { type: undefined, decorators: [{ type: core.Inject, args: [CDK_TREE_NODE_OUTLET_NODE,] }, { type: core.Optional }] }
  416. ]; };
  417. return CdkTreeNodeOutlet;
  418. }());
  419. /**
  420. * @fileoverview added by tsickle
  421. * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
  422. */
  423. /**
  424. * Context provided to the tree node component.
  425. * @template T
  426. */
  427. var /**
  428. * Context provided to the tree node component.
  429. * @template T
  430. */
  431. CdkTreeNodeOutletContext = /** @class */ (function () {
  432. function CdkTreeNodeOutletContext(data) {
  433. this.$implicit = data;
  434. }
  435. return CdkTreeNodeOutletContext;
  436. }());
  437. /**
  438. * Data node definition for the CdkTree.
  439. * Captures the node's template and a when predicate that describes when this node should be used.
  440. * @template T
  441. */
  442. var CdkTreeNodeDef = /** @class */ (function () {
  443. /** @docs-private */
  444. function CdkTreeNodeDef(template) {
  445. this.template = template;
  446. }
  447. CdkTreeNodeDef.decorators = [
  448. { type: core.Directive, args: [{
  449. selector: '[cdkTreeNodeDef]',
  450. inputs: [
  451. 'when: cdkTreeNodeDefWhen'
  452. ],
  453. },] },
  454. ];
  455. /** @nocollapse */
  456. CdkTreeNodeDef.ctorParameters = function () { return [
  457. { type: core.TemplateRef }
  458. ]; };
  459. return CdkTreeNodeDef;
  460. }());
  461. /**
  462. * @fileoverview added by tsickle
  463. * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
  464. */
  465. /**
  466. * Returns an error to be thrown when there is no usable data.
  467. * \@docs-private
  468. * @return {?}
  469. */
  470. function getTreeNoValidDataSourceError() {
  471. return Error("A valid data source must be provided.");
  472. }
  473. /**
  474. * Returns an error to be thrown when there are multiple nodes that are missing a when function.
  475. * \@docs-private
  476. * @return {?}
  477. */
  478. function getTreeMultipleDefaultNodeDefsError() {
  479. return Error("There can only be one default row without a when predicate function.");
  480. }
  481. /**
  482. * Returns an error to be thrown when there are no matching node defs for a particular set of data.
  483. * \@docs-private
  484. * @return {?}
  485. */
  486. function getTreeMissingMatchingNodeDefError() {
  487. return Error("Could not find a matching node definition for the provided node data.");
  488. }
  489. /**
  490. * Returns an error to be thrown when there are tree control.
  491. * \@docs-private
  492. * @return {?}
  493. */
  494. function getTreeControlMissingError() {
  495. return Error("Could not find a tree control for the tree.");
  496. }
  497. /**
  498. * Returns an error to be thrown when tree control did not implement functions for flat/nested node.
  499. * \@docs-private
  500. * @return {?}
  501. */
  502. function getTreeControlFunctionsMissingError() {
  503. return Error("Could not find functions for nested/flat tree in tree control.");
  504. }
  505. /**
  506. * @fileoverview added by tsickle
  507. * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
  508. */
  509. /**
  510. * CDK tree component that connects with a data source to retrieve data of type `T` and renders
  511. * dataNodes with hierarchy. Updates the dataNodes when new data is provided by the data source.
  512. * @template T
  513. */
  514. var CdkTree = /** @class */ (function () {
  515. function CdkTree(_differs, _changeDetectorRef) {
  516. this._differs = _differs;
  517. this._changeDetectorRef = _changeDetectorRef;
  518. /**
  519. * Subject that emits when the component has been destroyed.
  520. */
  521. this._onDestroy = new rxjs.Subject();
  522. /**
  523. * Level of nodes
  524. */
  525. this._levels = new Map();
  526. // TODO(tinayuangao): Setup a listener for scrolling, emit the calculated view to viewChange.
  527. // Remove the MAX_VALUE in viewChange
  528. /**
  529. * Stream containing the latest information on what rows are being displayed on screen.
  530. * Can be used by the data source to as a heuristic of what data should be provided.
  531. */
  532. this.viewChange = new rxjs.BehaviorSubject({ start: 0, end: Number.MAX_VALUE });
  533. }
  534. Object.defineProperty(CdkTree.prototype, "dataSource", {
  535. /**
  536. * Provides a stream containing the latest data array to render. Influenced by the tree's
  537. * stream of view window (what dataNodes are currently on screen).
  538. * Data source can be an observable of data array, or a data array to render.
  539. */
  540. get: /**
  541. * Provides a stream containing the latest data array to render. Influenced by the tree's
  542. * stream of view window (what dataNodes are currently on screen).
  543. * Data source can be an observable of data array, or a data array to render.
  544. * @return {?}
  545. */
  546. function () { return this._dataSource; },
  547. set: /**
  548. * @param {?} dataSource
  549. * @return {?}
  550. */
  551. function (dataSource) {
  552. if (this._dataSource !== dataSource) {
  553. this._switchDataSource(dataSource);
  554. }
  555. },
  556. enumerable: true,
  557. configurable: true
  558. });
  559. /**
  560. * @return {?}
  561. */
  562. CdkTree.prototype.ngOnInit = /**
  563. * @return {?}
  564. */
  565. function () {
  566. this._dataDiffer = this._differs.find([]).create(this.trackBy);
  567. if (!this.treeControl) {
  568. throw getTreeControlMissingError();
  569. }
  570. };
  571. /**
  572. * @return {?}
  573. */
  574. CdkTree.prototype.ngOnDestroy = /**
  575. * @return {?}
  576. */
  577. function () {
  578. this._nodeOutlet.viewContainer.clear();
  579. this._onDestroy.next();
  580. this._onDestroy.complete();
  581. if (this._dataSource && typeof ((/** @type {?} */ (this._dataSource))).disconnect === 'function') {
  582. ((/** @type {?} */ (this.dataSource))).disconnect(this);
  583. }
  584. if (this._dataSubscription) {
  585. this._dataSubscription.unsubscribe();
  586. this._dataSubscription = null;
  587. }
  588. };
  589. /**
  590. * @return {?}
  591. */
  592. CdkTree.prototype.ngAfterContentChecked = /**
  593. * @return {?}
  594. */
  595. function () {
  596. /** @type {?} */
  597. var defaultNodeDefs = this._nodeDefs.filter((/**
  598. * @param {?} def
  599. * @return {?}
  600. */
  601. function (def) { return !def.when; }));
  602. if (defaultNodeDefs.length > 1) {
  603. throw getTreeMultipleDefaultNodeDefsError();
  604. }
  605. this._defaultNodeDef = defaultNodeDefs[0];
  606. if (this.dataSource && this._nodeDefs && !this._dataSubscription) {
  607. this._observeRenderChanges();
  608. }
  609. };
  610. // TODO(tinayuangao): Work on keyboard traversal and actions, make sure it's working for RTL
  611. // and nested trees.
  612. /**
  613. * Switch to the provided data source by resetting the data and unsubscribing from the current
  614. * render change subscription if one exists. If the data source is null, interpret this by
  615. * clearing the node outlet. Otherwise start listening for new data.
  616. */
  617. // TODO(tinayuangao): Work on keyboard traversal and actions, make sure it's working for RTL
  618. // and nested trees.
  619. /**
  620. * Switch to the provided data source by resetting the data and unsubscribing from the current
  621. * render change subscription if one exists. If the data source is null, interpret this by
  622. * clearing the node outlet. Otherwise start listening for new data.
  623. * @private
  624. * @param {?} dataSource
  625. * @return {?}
  626. */
  627. CdkTree.prototype._switchDataSource =
  628. // TODO(tinayuangao): Work on keyboard traversal and actions, make sure it's working for RTL
  629. // and nested trees.
  630. /**
  631. * Switch to the provided data source by resetting the data and unsubscribing from the current
  632. * render change subscription if one exists. If the data source is null, interpret this by
  633. * clearing the node outlet. Otherwise start listening for new data.
  634. * @private
  635. * @param {?} dataSource
  636. * @return {?}
  637. */
  638. function (dataSource) {
  639. if (this._dataSource && typeof ((/** @type {?} */ (this._dataSource))).disconnect === 'function') {
  640. ((/** @type {?} */ (this.dataSource))).disconnect(this);
  641. }
  642. if (this._dataSubscription) {
  643. this._dataSubscription.unsubscribe();
  644. this._dataSubscription = null;
  645. }
  646. // Remove the all dataNodes if there is now no data source
  647. if (!dataSource) {
  648. this._nodeOutlet.viewContainer.clear();
  649. }
  650. this._dataSource = dataSource;
  651. if (this._nodeDefs) {
  652. this._observeRenderChanges();
  653. }
  654. };
  655. /** Set up a subscription for the data provided by the data source. */
  656. /**
  657. * Set up a subscription for the data provided by the data source.
  658. * @private
  659. * @return {?}
  660. */
  661. CdkTree.prototype._observeRenderChanges = /**
  662. * Set up a subscription for the data provided by the data source.
  663. * @private
  664. * @return {?}
  665. */
  666. function () {
  667. var _this = this;
  668. /** @type {?} */
  669. var dataStream;
  670. if (collections.isDataSource(this._dataSource)) {
  671. dataStream = this._dataSource.connect(this);
  672. }
  673. else if (this._dataSource instanceof rxjs.Observable) {
  674. dataStream = this._dataSource;
  675. }
  676. else if (Array.isArray(this._dataSource)) {
  677. dataStream = rxjs.of(this._dataSource);
  678. }
  679. if (dataStream) {
  680. this._dataSubscription = dataStream.pipe(operators.takeUntil(this._onDestroy))
  681. .subscribe((/**
  682. * @param {?} data
  683. * @return {?}
  684. */
  685. function (data) { return _this.renderNodeChanges(data); }));
  686. }
  687. else {
  688. throw getTreeNoValidDataSourceError();
  689. }
  690. };
  691. /** Check for changes made in the data and render each change (node added/removed/moved). */
  692. /**
  693. * Check for changes made in the data and render each change (node added/removed/moved).
  694. * @param {?} data
  695. * @param {?=} dataDiffer
  696. * @param {?=} viewContainer
  697. * @param {?=} parentData
  698. * @return {?}
  699. */
  700. CdkTree.prototype.renderNodeChanges = /**
  701. * Check for changes made in the data and render each change (node added/removed/moved).
  702. * @param {?} data
  703. * @param {?=} dataDiffer
  704. * @param {?=} viewContainer
  705. * @param {?=} parentData
  706. * @return {?}
  707. */
  708. function (data, dataDiffer, viewContainer, parentData) {
  709. var _this = this;
  710. if (dataDiffer === void 0) { dataDiffer = this._dataDiffer; }
  711. if (viewContainer === void 0) { viewContainer = this._nodeOutlet.viewContainer; }
  712. /** @type {?} */
  713. var changes = dataDiffer.diff(data);
  714. if (!changes) {
  715. return;
  716. }
  717. changes.forEachOperation((/**
  718. * @param {?} item
  719. * @param {?} adjustedPreviousIndex
  720. * @param {?} currentIndex
  721. * @return {?}
  722. */
  723. function (item, adjustedPreviousIndex, currentIndex) {
  724. if (item.previousIndex == null) {
  725. _this.insertNode(data[(/** @type {?} */ (currentIndex))], (/** @type {?} */ (currentIndex)), viewContainer, parentData);
  726. }
  727. else if (currentIndex == null) {
  728. viewContainer.remove((/** @type {?} */ (adjustedPreviousIndex)));
  729. _this._levels.delete(item.item);
  730. }
  731. else {
  732. /** @type {?} */
  733. var view = viewContainer.get((/** @type {?} */ (adjustedPreviousIndex)));
  734. viewContainer.move((/** @type {?} */ (view)), currentIndex);
  735. }
  736. }));
  737. this._changeDetectorRef.detectChanges();
  738. };
  739. /**
  740. * Finds the matching node definition that should be used for this node data. If there is only
  741. * one node definition, it is returned. Otherwise, find the node definition that has a when
  742. * predicate that returns true with the data. If none return true, return the default node
  743. * definition.
  744. */
  745. /**
  746. * Finds the matching node definition that should be used for this node data. If there is only
  747. * one node definition, it is returned. Otherwise, find the node definition that has a when
  748. * predicate that returns true with the data. If none return true, return the default node
  749. * definition.
  750. * @param {?} data
  751. * @param {?} i
  752. * @return {?}
  753. */
  754. CdkTree.prototype._getNodeDef = /**
  755. * Finds the matching node definition that should be used for this node data. If there is only
  756. * one node definition, it is returned. Otherwise, find the node definition that has a when
  757. * predicate that returns true with the data. If none return true, return the default node
  758. * definition.
  759. * @param {?} data
  760. * @param {?} i
  761. * @return {?}
  762. */
  763. function (data, i) {
  764. if (this._nodeDefs.length === 1) {
  765. return this._nodeDefs.first;
  766. }
  767. /** @type {?} */
  768. var nodeDef = this._nodeDefs.find((/**
  769. * @param {?} def
  770. * @return {?}
  771. */
  772. function (def) { return def.when && def.when(i, data); })) || this._defaultNodeDef;
  773. if (!nodeDef) {
  774. throw getTreeMissingMatchingNodeDefError();
  775. }
  776. return nodeDef;
  777. };
  778. /**
  779. * Create the embedded view for the data node template and place it in the correct index location
  780. * within the data node view container.
  781. */
  782. /**
  783. * Create the embedded view for the data node template and place it in the correct index location
  784. * within the data node view container.
  785. * @param {?} nodeData
  786. * @param {?} index
  787. * @param {?=} viewContainer
  788. * @param {?=} parentData
  789. * @return {?}
  790. */
  791. CdkTree.prototype.insertNode = /**
  792. * Create the embedded view for the data node template and place it in the correct index location
  793. * within the data node view container.
  794. * @param {?} nodeData
  795. * @param {?} index
  796. * @param {?=} viewContainer
  797. * @param {?=} parentData
  798. * @return {?}
  799. */
  800. function (nodeData, index, viewContainer, parentData) {
  801. /** @type {?} */
  802. var node = this._getNodeDef(nodeData, index);
  803. // Node context that will be provided to created embedded view
  804. /** @type {?} */
  805. var context = new CdkTreeNodeOutletContext(nodeData);
  806. // If the tree is flat tree, then use the `getLevel` function in flat tree control
  807. // Otherwise, use the level of parent node.
  808. if (this.treeControl.getLevel) {
  809. context.level = this.treeControl.getLevel(nodeData);
  810. }
  811. else if (typeof parentData !== 'undefined' && this._levels.has(parentData)) {
  812. context.level = (/** @type {?} */ (this._levels.get(parentData))) + 1;
  813. }
  814. else {
  815. context.level = 0;
  816. }
  817. this._levels.set(nodeData, context.level);
  818. // Use default tree nodeOutlet, or nested node's nodeOutlet
  819. /** @type {?} */
  820. var container = viewContainer ? viewContainer : this._nodeOutlet.viewContainer;
  821. container.createEmbeddedView(node.template, context, index);
  822. // Set the data to just created `CdkTreeNode`.
  823. // The `CdkTreeNode` created from `createEmbeddedView` will be saved in static variable
  824. // `mostRecentTreeNode`. We get it from static variable and pass the node data to it.
  825. if (CdkTreeNode.mostRecentTreeNode) {
  826. CdkTreeNode.mostRecentTreeNode.data = nodeData;
  827. }
  828. };
  829. CdkTree.decorators = [
  830. { type: core.Component, args: [{selector: 'cdk-tree',
  831. exportAs: 'cdkTree',
  832. template: "<ng-container cdkTreeNodeOutlet></ng-container>",
  833. host: {
  834. 'class': 'cdk-tree',
  835. 'role': 'tree',
  836. },
  837. encapsulation: core.ViewEncapsulation.None,
  838. // The "OnPush" status for the `CdkTree` component is effectively a noop, so we are removing it.
  839. // The view for `CdkTree` consists entirely of templates declared in other views. As they are
  840. // declared elsewhere, they are checked when their declaration points are checked.
  841. // tslint:disable-next-line:validate-decorators
  842. changeDetection: core.ChangeDetectionStrategy.Default
  843. },] },
  844. ];
  845. /** @nocollapse */
  846. CdkTree.ctorParameters = function () { return [
  847. { type: core.IterableDiffers },
  848. { type: core.ChangeDetectorRef }
  849. ]; };
  850. CdkTree.propDecorators = {
  851. dataSource: [{ type: core.Input }],
  852. treeControl: [{ type: core.Input }],
  853. trackBy: [{ type: core.Input }],
  854. _nodeOutlet: [{ type: core.ViewChild, args: [CdkTreeNodeOutlet, { static: true },] }],
  855. _nodeDefs: [{ type: core.ContentChildren, args: [CdkTreeNodeDef,] }]
  856. };
  857. return CdkTree;
  858. }());
  859. /**
  860. * Tree node for CdkTree. It contains the data in the tree node.
  861. * @template T
  862. */
  863. var CdkTreeNode = /** @class */ (function () {
  864. function CdkTreeNode(_elementRef, _tree) {
  865. this._elementRef = _elementRef;
  866. this._tree = _tree;
  867. /**
  868. * Subject that emits when the component has been destroyed.
  869. */
  870. this._destroyed = new rxjs.Subject();
  871. /**
  872. * Emits when the node's data has changed.
  873. */
  874. this._dataChanges = new rxjs.Subject();
  875. /**
  876. * The role of the node should be 'group' if it's an internal node,
  877. * and 'treeitem' if it's a leaf node.
  878. */
  879. this.role = 'treeitem';
  880. CdkTreeNode.mostRecentTreeNode = (/** @type {?} */ (this));
  881. }
  882. Object.defineProperty(CdkTreeNode.prototype, "data", {
  883. /** The tree node's data. */
  884. get: /**
  885. * The tree node's data.
  886. * @return {?}
  887. */
  888. function () { return this._data; },
  889. set: /**
  890. * @param {?} value
  891. * @return {?}
  892. */
  893. function (value) {
  894. if (value !== this._data) {
  895. this._data = value;
  896. this._setRoleFromData();
  897. this._dataChanges.next();
  898. }
  899. },
  900. enumerable: true,
  901. configurable: true
  902. });
  903. Object.defineProperty(CdkTreeNode.prototype, "isExpanded", {
  904. get: /**
  905. * @return {?}
  906. */
  907. function () {
  908. return this._tree.treeControl.isExpanded(this._data);
  909. },
  910. enumerable: true,
  911. configurable: true
  912. });
  913. Object.defineProperty(CdkTreeNode.prototype, "level", {
  914. get: /**
  915. * @return {?}
  916. */
  917. function () {
  918. return this._tree.treeControl.getLevel ? this._tree.treeControl.getLevel(this._data) : 0;
  919. },
  920. enumerable: true,
  921. configurable: true
  922. });
  923. /**
  924. * @return {?}
  925. */
  926. CdkTreeNode.prototype.ngOnDestroy = /**
  927. * @return {?}
  928. */
  929. function () {
  930. // If this is the last tree node being destroyed,
  931. // clear out the reference to avoid leaking memory.
  932. if (CdkTreeNode.mostRecentTreeNode === this) {
  933. CdkTreeNode.mostRecentTreeNode = null;
  934. }
  935. this._dataChanges.complete();
  936. this._destroyed.next();
  937. this._destroyed.complete();
  938. };
  939. /** Focuses the menu item. Implements for FocusableOption. */
  940. /**
  941. * Focuses the menu item. Implements for FocusableOption.
  942. * @return {?}
  943. */
  944. CdkTreeNode.prototype.focus = /**
  945. * Focuses the menu item. Implements for FocusableOption.
  946. * @return {?}
  947. */
  948. function () {
  949. this._elementRef.nativeElement.focus();
  950. };
  951. /**
  952. * @protected
  953. * @return {?}
  954. */
  955. CdkTreeNode.prototype._setRoleFromData = /**
  956. * @protected
  957. * @return {?}
  958. */
  959. function () {
  960. var _this = this;
  961. if (this._tree.treeControl.isExpandable) {
  962. this.role = this._tree.treeControl.isExpandable(this._data) ? 'group' : 'treeitem';
  963. }
  964. else {
  965. if (!this._tree.treeControl.getChildren) {
  966. throw getTreeControlFunctionsMissingError();
  967. }
  968. /** @type {?} */
  969. var childrenNodes = this._tree.treeControl.getChildren(this._data);
  970. if (Array.isArray(childrenNodes)) {
  971. this._setRoleFromChildren((/** @type {?} */ (childrenNodes)));
  972. }
  973. else if (childrenNodes instanceof rxjs.Observable) {
  974. childrenNodes.pipe(operators.takeUntil(this._destroyed))
  975. .subscribe((/**
  976. * @param {?} children
  977. * @return {?}
  978. */
  979. function (children) { return _this._setRoleFromChildren(children); }));
  980. }
  981. }
  982. };
  983. /**
  984. * @protected
  985. * @param {?} children
  986. * @return {?}
  987. */
  988. CdkTreeNode.prototype._setRoleFromChildren = /**
  989. * @protected
  990. * @param {?} children
  991. * @return {?}
  992. */
  993. function (children) {
  994. this.role = children && children.length ? 'group' : 'treeitem';
  995. };
  996. /**
  997. * The most recently created `CdkTreeNode`. We save it in static variable so we can retrieve it
  998. * in `CdkTree` and set the data to it.
  999. */
  1000. CdkTreeNode.mostRecentTreeNode = null;
  1001. CdkTreeNode.decorators = [
  1002. { type: core.Directive, args: [{
  1003. selector: 'cdk-tree-node',
  1004. exportAs: 'cdkTreeNode',
  1005. host: {
  1006. '[attr.aria-expanded]': 'isExpanded',
  1007. '[attr.aria-level]': 'role === "treeitem" ? level : null',
  1008. '[attr.role]': 'role',
  1009. 'class': 'cdk-tree-node',
  1010. },
  1011. },] },
  1012. ];
  1013. /** @nocollapse */
  1014. CdkTreeNode.ctorParameters = function () { return [
  1015. { type: core.ElementRef },
  1016. { type: CdkTree }
  1017. ]; };
  1018. CdkTreeNode.propDecorators = {
  1019. role: [{ type: core.Input }]
  1020. };
  1021. return CdkTreeNode;
  1022. }());
  1023. /**
  1024. * @fileoverview added by tsickle
  1025. * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
  1026. */
  1027. /**
  1028. * Nested node is a child of `<cdk-tree>`. It works with nested tree.
  1029. * By using `cdk-nested-tree-node` component in tree node template, children of the parent node will
  1030. * be added in the `cdkTreeNodeOutlet` in tree node template.
  1031. * For example:
  1032. * ```html
  1033. * <cdk-nested-tree-node>
  1034. * {{node.name}}
  1035. * <ng-template cdkTreeNodeOutlet></ng-template>
  1036. * </cdk-nested-tree-node>
  1037. * ```
  1038. * The children of node will be automatically added to `cdkTreeNodeOutlet`, the result dom will be
  1039. * like this:
  1040. * ```html
  1041. * <cdk-nested-tree-node>
  1042. * {{node.name}}
  1043. * <cdk-nested-tree-node>{{child1.name}}</cdk-nested-tree-node>
  1044. * <cdk-nested-tree-node>{{child2.name}}</cdk-nested-tree-node>
  1045. * </cdk-nested-tree-node>
  1046. * ```
  1047. * @template T
  1048. */
  1049. var CdkNestedTreeNode = /** @class */ (function (_super) {
  1050. __extends(CdkNestedTreeNode, _super);
  1051. function CdkNestedTreeNode(_elementRef, _tree, _differs) {
  1052. var _this = _super.call(this, _elementRef, _tree) || this;
  1053. _this._elementRef = _elementRef;
  1054. _this._tree = _tree;
  1055. _this._differs = _differs;
  1056. return _this;
  1057. }
  1058. /**
  1059. * @return {?}
  1060. */
  1061. CdkNestedTreeNode.prototype.ngAfterContentInit = /**
  1062. * @return {?}
  1063. */
  1064. function () {
  1065. var _this = this;
  1066. this._dataDiffer = this._differs.find([]).create(this._tree.trackBy);
  1067. if (!this._tree.treeControl.getChildren) {
  1068. throw getTreeControlFunctionsMissingError();
  1069. }
  1070. /** @type {?} */
  1071. var childrenNodes = this._tree.treeControl.getChildren(this.data);
  1072. if (Array.isArray(childrenNodes)) {
  1073. this.updateChildrenNodes((/** @type {?} */ (childrenNodes)));
  1074. }
  1075. else if (childrenNodes instanceof rxjs.Observable) {
  1076. childrenNodes.pipe(operators.takeUntil(this._destroyed))
  1077. .subscribe((/**
  1078. * @param {?} result
  1079. * @return {?}
  1080. */
  1081. function (result) { return _this.updateChildrenNodes(result); }));
  1082. }
  1083. this.nodeOutlet.changes.pipe(operators.takeUntil(this._destroyed))
  1084. .subscribe((/**
  1085. * @return {?}
  1086. */
  1087. function () { return _this.updateChildrenNodes(); }));
  1088. };
  1089. /**
  1090. * @return {?}
  1091. */
  1092. CdkNestedTreeNode.prototype.ngOnDestroy = /**
  1093. * @return {?}
  1094. */
  1095. function () {
  1096. this._clear();
  1097. _super.prototype.ngOnDestroy.call(this);
  1098. };
  1099. /** Add children dataNodes to the NodeOutlet */
  1100. /**
  1101. * Add children dataNodes to the NodeOutlet
  1102. * @protected
  1103. * @param {?=} children
  1104. * @return {?}
  1105. */
  1106. CdkNestedTreeNode.prototype.updateChildrenNodes = /**
  1107. * Add children dataNodes to the NodeOutlet
  1108. * @protected
  1109. * @param {?=} children
  1110. * @return {?}
  1111. */
  1112. function (children) {
  1113. /** @type {?} */
  1114. var outlet = this._getNodeOutlet();
  1115. if (children) {
  1116. this._children = children;
  1117. }
  1118. if (outlet && this._children) {
  1119. /** @type {?} */
  1120. var viewContainer = outlet.viewContainer;
  1121. this._tree.renderNodeChanges(this._children, this._dataDiffer, viewContainer, this._data);
  1122. }
  1123. else {
  1124. // Reset the data differ if there's no children nodes displayed
  1125. this._dataDiffer.diff([]);
  1126. }
  1127. };
  1128. /** Clear the children dataNodes. */
  1129. /**
  1130. * Clear the children dataNodes.
  1131. * @protected
  1132. * @return {?}
  1133. */
  1134. CdkNestedTreeNode.prototype._clear = /**
  1135. * Clear the children dataNodes.
  1136. * @protected
  1137. * @return {?}
  1138. */
  1139. function () {
  1140. /** @type {?} */
  1141. var outlet = this._getNodeOutlet();
  1142. if (outlet) {
  1143. outlet.viewContainer.clear();
  1144. this._dataDiffer.diff([]);
  1145. }
  1146. };
  1147. /** Gets the outlet for the current node. */
  1148. /**
  1149. * Gets the outlet for the current node.
  1150. * @private
  1151. * @return {?}
  1152. */
  1153. CdkNestedTreeNode.prototype._getNodeOutlet = /**
  1154. * Gets the outlet for the current node.
  1155. * @private
  1156. * @return {?}
  1157. */
  1158. function () {
  1159. var _this = this;
  1160. /** @type {?} */
  1161. var outlets = this.nodeOutlet;
  1162. // Note that since we use `descendants: true` on the query, we have to ensure
  1163. // that we don't pick up the outlet of a child node by accident.
  1164. return outlets && outlets.find((/**
  1165. * @param {?} outlet
  1166. * @return {?}
  1167. */
  1168. function (outlet) { return !outlet._node || outlet._node === _this; }));
  1169. };
  1170. CdkNestedTreeNode.decorators = [
  1171. { type: core.Directive, args: [{
  1172. selector: 'cdk-nested-tree-node',
  1173. exportAs: 'cdkNestedTreeNode',
  1174. host: {
  1175. '[attr.aria-expanded]': 'isExpanded',
  1176. '[attr.role]': 'role',
  1177. 'class': 'cdk-tree-node cdk-nested-tree-node',
  1178. },
  1179. providers: [
  1180. { provide: CdkTreeNode, useExisting: CdkNestedTreeNode },
  1181. { provide: CDK_TREE_NODE_OUTLET_NODE, useExisting: CdkNestedTreeNode }
  1182. ]
  1183. },] },
  1184. ];
  1185. /** @nocollapse */
  1186. CdkNestedTreeNode.ctorParameters = function () { return [
  1187. { type: core.ElementRef },
  1188. { type: CdkTree },
  1189. { type: core.IterableDiffers }
  1190. ]; };
  1191. CdkNestedTreeNode.propDecorators = {
  1192. nodeOutlet: [{ type: core.ContentChildren, args: [CdkTreeNodeOutlet, {
  1193. // We need to use `descendants: true`, because Ivy will no longer match
  1194. // indirect descendants if it's left as false.
  1195. descendants: true
  1196. },] }]
  1197. };
  1198. return CdkNestedTreeNode;
  1199. }(CdkTreeNode));
  1200. /**
  1201. * @fileoverview added by tsickle
  1202. * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
  1203. */
  1204. /**
  1205. * Regex used to split a string on its CSS units.
  1206. * @type {?}
  1207. */
  1208. var cssUnitPattern = /([A-Za-z%]+)$/;
  1209. /**
  1210. * Indent for the children tree dataNodes.
  1211. * This directive will add left-padding to the node to show hierarchy.
  1212. * @template T
  1213. */
  1214. var CdkTreeNodePadding = /** @class */ (function () {
  1215. function CdkTreeNodePadding(_treeNode, _tree, _renderer, _element, _dir) {
  1216. var _this = this;
  1217. this._treeNode = _treeNode;
  1218. this._tree = _tree;
  1219. this._renderer = _renderer;
  1220. this._element = _element;
  1221. this._dir = _dir;
  1222. /**
  1223. * Subject that emits when the component has been destroyed.
  1224. */
  1225. this._destroyed = new rxjs.Subject();
  1226. /**
  1227. * CSS units used for the indentation value.
  1228. */
  1229. this.indentUnits = 'px';
  1230. this._indent = 40;
  1231. this._setPadding();
  1232. if (_dir) {
  1233. _dir.change.pipe(operators.takeUntil(this._destroyed)).subscribe((/**
  1234. * @return {?}
  1235. */
  1236. function () { return _this._setPadding(true); }));
  1237. }
  1238. // In Ivy the indentation binding might be set before the tree node's data has been added,
  1239. // which means that we'll miss the first render. We have to subscribe to changes in the
  1240. // data to ensure that everything is up to date.
  1241. _treeNode._dataChanges.subscribe((/**
  1242. * @return {?}
  1243. */
  1244. function () { return _this._setPadding(); }));
  1245. }
  1246. Object.defineProperty(CdkTreeNodePadding.prototype, "level", {
  1247. /** The level of depth of the tree node. The padding will be `level * indent` pixels. */
  1248. get: /**
  1249. * The level of depth of the tree node. The padding will be `level * indent` pixels.
  1250. * @return {?}
  1251. */
  1252. function () { return this._level; },
  1253. set: /**
  1254. * @param {?} value
  1255. * @return {?}
  1256. */
  1257. function (value) {
  1258. // Set to null as the fallback value so that _setPadding can fall back to the node level if the
  1259. // consumer set the directive as `cdkTreeNodePadding=""`. We still want to take this value if
  1260. // they set 0 explicitly.
  1261. this._level = (/** @type {?} */ (coercion.coerceNumberProperty(value, null)));
  1262. this._setPadding();
  1263. },
  1264. enumerable: true,
  1265. configurable: true
  1266. });
  1267. Object.defineProperty(CdkTreeNodePadding.prototype, "indent", {
  1268. /**
  1269. * The indent for each level. Can be a number or a CSS string.
  1270. * Default number 40px from material design menu sub-menu spec.
  1271. */
  1272. get: /**
  1273. * The indent for each level. Can be a number or a CSS string.
  1274. * Default number 40px from material design menu sub-menu spec.
  1275. * @return {?}
  1276. */
  1277. function () { return this._indent; },
  1278. set: /**
  1279. * @param {?} indent
  1280. * @return {?}
  1281. */
  1282. function (indent) {
  1283. /** @type {?} */
  1284. var value = indent;
  1285. /** @type {?} */
  1286. var units = 'px';
  1287. if (typeof indent === 'string') {
  1288. /** @type {?} */
  1289. var parts = indent.split(cssUnitPattern);
  1290. value = parts[0];
  1291. units = parts[1] || units;
  1292. }
  1293. this.indentUnits = units;
  1294. this._indent = coercion.coerceNumberProperty(value);
  1295. this._setPadding();
  1296. },
  1297. enumerable: true,
  1298. configurable: true
  1299. });
  1300. /**
  1301. * @return {?}
  1302. */
  1303. CdkTreeNodePadding.prototype.ngOnDestroy = /**
  1304. * @return {?}
  1305. */
  1306. function () {
  1307. this._destroyed.next();
  1308. this._destroyed.complete();
  1309. };
  1310. /** The padding indent value for the tree node. Returns a string with px numbers if not null. */
  1311. /**
  1312. * The padding indent value for the tree node. Returns a string with px numbers if not null.
  1313. * @return {?}
  1314. */
  1315. CdkTreeNodePadding.prototype._paddingIndent = /**
  1316. * The padding indent value for the tree node. Returns a string with px numbers if not null.
  1317. * @return {?}
  1318. */
  1319. function () {
  1320. /** @type {?} */
  1321. var nodeLevel = (this._treeNode.data && this._tree.treeControl.getLevel)
  1322. ? this._tree.treeControl.getLevel(this._treeNode.data)
  1323. : null;
  1324. /** @type {?} */
  1325. var level = this._level == null ? nodeLevel : this._level;
  1326. return typeof level === 'number' ? "" + level * this._indent + this.indentUnits : null;
  1327. };
  1328. /**
  1329. * @param {?=} forceChange
  1330. * @return {?}
  1331. */
  1332. CdkTreeNodePadding.prototype._setPadding = /**
  1333. * @param {?=} forceChange
  1334. * @return {?}
  1335. */
  1336. function (forceChange) {
  1337. if (forceChange === void 0) { forceChange = false; }
  1338. /** @type {?} */
  1339. var padding = this._paddingIndent();
  1340. if (padding !== this._currentPadding || forceChange) {
  1341. /** @type {?} */
  1342. var element = this._element.nativeElement;
  1343. /** @type {?} */
  1344. var paddingProp = this._dir && this._dir.value === 'rtl' ? 'paddingRight' : 'paddingLeft';
  1345. /** @type {?} */
  1346. var resetProp = paddingProp === 'paddingLeft' ? 'paddingRight' : 'paddingLeft';
  1347. this._renderer.setStyle(element, paddingProp, padding);
  1348. this._renderer.setStyle(element, resetProp, null);
  1349. this._currentPadding = padding;
  1350. }
  1351. };
  1352. CdkTreeNodePadding.decorators = [
  1353. { type: core.Directive, args: [{
  1354. selector: '[cdkTreeNodePadding]',
  1355. },] },
  1356. ];
  1357. /** @nocollapse */
  1358. CdkTreeNodePadding.ctorParameters = function () { return [
  1359. { type: CdkTreeNode },
  1360. { type: CdkTree },
  1361. { type: core.Renderer2 },
  1362. { type: core.ElementRef },
  1363. { type: bidi.Directionality, decorators: [{ type: core.Optional }] }
  1364. ]; };
  1365. CdkTreeNodePadding.propDecorators = {
  1366. level: [{ type: core.Input, args: ['cdkTreeNodePadding',] }],
  1367. indent: [{ type: core.Input, args: ['cdkTreeNodePaddingIndent',] }]
  1368. };
  1369. return CdkTreeNodePadding;
  1370. }());
  1371. /**
  1372. * @fileoverview added by tsickle
  1373. * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
  1374. */
  1375. /**
  1376. * Node toggle to expand/collapse the node.
  1377. * @template T
  1378. */
  1379. var CdkTreeNodeToggle = /** @class */ (function () {
  1380. function CdkTreeNodeToggle(_tree, _treeNode) {
  1381. this._tree = _tree;
  1382. this._treeNode = _treeNode;
  1383. this._recursive = false;
  1384. }
  1385. Object.defineProperty(CdkTreeNodeToggle.prototype, "recursive", {
  1386. /** Whether expand/collapse the node recursively. */
  1387. get: /**
  1388. * Whether expand/collapse the node recursively.
  1389. * @return {?}
  1390. */
  1391. function () { return this._recursive; },
  1392. set: /**
  1393. * @param {?} value
  1394. * @return {?}
  1395. */
  1396. function (value) { this._recursive = coercion.coerceBooleanProperty(value); },
  1397. enumerable: true,
  1398. configurable: true
  1399. });
  1400. // We have to use a `HostListener` here in order to support both Ivy and ViewEngine.
  1401. // In Ivy the `host` bindings will be merged when this class is extended, whereas in
  1402. // ViewEngine they're overwritten.
  1403. // TODO(crisbeto): we move this back into `host` once Ivy is turned on by default.
  1404. // tslint:disable-next-line:no-host-decorator-in-concrete
  1405. // We have to use a `HostListener` here in order to support both Ivy and ViewEngine.
  1406. // In Ivy the `host` bindings will be merged when this class is extended, whereas in
  1407. // ViewEngine they're overwritten.
  1408. // TODO(crisbeto): we move this back into `host` once Ivy is turned on by default.
  1409. // tslint:disable-next-line:no-host-decorator-in-concrete
  1410. /**
  1411. * @param {?} event
  1412. * @return {?}
  1413. */
  1414. CdkTreeNodeToggle.prototype._toggle =
  1415. // We have to use a `HostListener` here in order to support both Ivy and ViewEngine.
  1416. // In Ivy the `host` bindings will be merged when this class is extended, whereas in
  1417. // ViewEngine they're overwritten.
  1418. // TODO(crisbeto): we move this back into `host` once Ivy is turned on by default.
  1419. // tslint:disable-next-line:no-host-decorator-in-concrete
  1420. /**
  1421. * @param {?} event
  1422. * @return {?}
  1423. */
  1424. function (event) {
  1425. this.recursive
  1426. ? this._tree.treeControl.toggleDescendants(this._treeNode.data)
  1427. : this._tree.treeControl.toggle(this._treeNode.data);
  1428. event.stopPropagation();
  1429. };
  1430. CdkTreeNodeToggle.decorators = [
  1431. { type: core.Directive, args: [{ selector: '[cdkTreeNodeToggle]' },] },
  1432. ];
  1433. /** @nocollapse */
  1434. CdkTreeNodeToggle.ctorParameters = function () { return [
  1435. { type: CdkTree },
  1436. { type: CdkTreeNode }
  1437. ]; };
  1438. CdkTreeNodeToggle.propDecorators = {
  1439. recursive: [{ type: core.Input, args: ['cdkTreeNodeToggleRecursive',] }],
  1440. _toggle: [{ type: core.HostListener, args: ['click', ['$event'],] }]
  1441. };
  1442. return CdkTreeNodeToggle;
  1443. }());
  1444. /**
  1445. * @fileoverview added by tsickle
  1446. * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
  1447. */
  1448. /** @type {?} */
  1449. var EXPORTED_DECLARATIONS = [
  1450. CdkNestedTreeNode,
  1451. CdkTreeNodeDef,
  1452. CdkTreeNodePadding,
  1453. CdkTreeNodeToggle,
  1454. CdkTree,
  1455. CdkTreeNode,
  1456. CdkTreeNodeOutlet,
  1457. ];
  1458. var CdkTreeModule = /** @class */ (function () {
  1459. function CdkTreeModule() {
  1460. }
  1461. CdkTreeModule.decorators = [
  1462. { type: core.NgModule, args: [{
  1463. imports: [common.CommonModule],
  1464. exports: EXPORTED_DECLARATIONS,
  1465. declarations: EXPORTED_DECLARATIONS,
  1466. providers: [a11y.FocusMonitor, CdkTreeNodeDef]
  1467. },] },
  1468. ];
  1469. return CdkTreeModule;
  1470. }());
  1471. exports.BaseTreeControl = BaseTreeControl;
  1472. exports.FlatTreeControl = FlatTreeControl;
  1473. exports.NestedTreeControl = NestedTreeControl;
  1474. exports.CdkNestedTreeNode = CdkNestedTreeNode;
  1475. exports.CdkTreeNodeOutletContext = CdkTreeNodeOutletContext;
  1476. exports.CdkTreeNodeDef = CdkTreeNodeDef;
  1477. exports.CdkTreeNodePadding = CdkTreeNodePadding;
  1478. exports.CDK_TREE_NODE_OUTLET_NODE = CDK_TREE_NODE_OUTLET_NODE;
  1479. exports.CdkTreeNodeOutlet = CdkTreeNodeOutlet;
  1480. exports.CdkTree = CdkTree;
  1481. exports.CdkTreeNode = CdkTreeNode;
  1482. exports.getTreeNoValidDataSourceError = getTreeNoValidDataSourceError;
  1483. exports.getTreeMultipleDefaultNodeDefsError = getTreeMultipleDefaultNodeDefsError;
  1484. exports.getTreeMissingMatchingNodeDefError = getTreeMissingMatchingNodeDefError;
  1485. exports.getTreeControlMissingError = getTreeControlMissingError;
  1486. exports.getTreeControlFunctionsMissingError = getTreeControlFunctionsMissingError;
  1487. exports.CdkTreeModule = CdkTreeModule;
  1488. exports.CdkTreeNodeToggle = CdkTreeNodeToggle;
  1489. Object.defineProperty(exports, '__esModule', { value: true });
  1490. })));
  1491. //# sourceMappingURL=cdk-tree.umd.js.map