cdk-table.umd.js 125 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495969798991001011021031041051061071081091101111121131141151161171181191201211221231241251261271281291301311321331341351361371381391401411421431441451461471481491501511521531541551561571581591601611621631641651661671681691701711721731741751761771781791801811821831841851861871881891901911921931941951961971981992002012022032042052062072082092102112122132142152162172182192202212222232242252262272282292302312322332342352362372382392402412422432442452462472482492502512522532542552562572582592602612622632642652662672682692702712722732742752762772782792802812822832842852862872882892902912922932942952962972982993003013023033043053063073083093103113123133143153163173183193203213223233243253263273283293303313323333343353363373383393403413423433443453463473483493503513523533543553563573583593603613623633643653663673683693703713723733743753763773783793803813823833843853863873883893903913923933943953963973983994004014024034044054064074084094104114124134144154164174184194204214224234244254264274284294304314324334344354364374384394404414424434444454464474484494504514524534544554564574584594604614624634644654664674684694704714724734744754764774784794804814824834844854864874884894904914924934944954964974984995005015025035045055065075085095105115125135145155165175185195205215225235245255265275285295305315325335345355365375385395405415425435445455465475485495505515525535545555565575585595605615625635645655665675685695705715725735745755765775785795805815825835845855865875885895905915925935945955965975985996006016026036046056066076086096106116126136146156166176186196206216226236246256266276286296306316326336346356366376386396406416426436446456466476486496506516526536546556566576586596606616626636646656666676686696706716726736746756766776786796806816826836846856866876886896906916926936946956966976986997007017027037047057067077087097107117127137147157167177187197207217227237247257267277287297307317327337347357367377387397407417427437447457467477487497507517527537547557567577587597607617627637647657667677687697707717727737747757767777787797807817827837847857867877887897907917927937947957967977987998008018028038048058068078088098108118128138148158168178188198208218228238248258268278288298308318328338348358368378388398408418428438448458468478488498508518528538548558568578588598608618628638648658668678688698708718728738748758768778788798808818828838848858868878888898908918928938948958968978988999009019029039049059069079089099109119129139149159169179189199209219229239249259269279289299309319329339349359369379389399409419429439449459469479489499509519529539549559569579589599609619629639649659669679689699709719729739749759769779789799809819829839849859869879889899909919929939949959969979989991000100110021003100410051006100710081009101010111012101310141015101610171018101910201021102210231024102510261027102810291030103110321033103410351036103710381039104010411042104310441045104610471048104910501051105210531054105510561057105810591060106110621063106410651066106710681069107010711072107310741075107610771078107910801081108210831084108510861087108810891090109110921093109410951096109710981099110011011102110311041105110611071108110911101111111211131114111511161117111811191120112111221123112411251126112711281129113011311132113311341135113611371138113911401141114211431144114511461147114811491150115111521153115411551156115711581159116011611162116311641165116611671168116911701171117211731174117511761177117811791180118111821183118411851186118711881189119011911192119311941195119611971198119912001201120212031204120512061207120812091210121112121213121412151216121712181219122012211222122312241225122612271228122912301231123212331234123512361237123812391240124112421243124412451246124712481249125012511252125312541255125612571258125912601261126212631264126512661267126812691270127112721273127412751276127712781279128012811282128312841285128612871288128912901291129212931294129512961297129812991300130113021303130413051306130713081309131013111312131313141315131613171318131913201321132213231324132513261327132813291330133113321333133413351336133713381339134013411342134313441345134613471348134913501351135213531354135513561357135813591360136113621363136413651366136713681369137013711372137313741375137613771378137913801381138213831384138513861387138813891390139113921393139413951396139713981399140014011402140314041405140614071408140914101411141214131414141514161417141814191420142114221423142414251426142714281429143014311432143314341435143614371438143914401441144214431444144514461447144814491450145114521453145414551456145714581459146014611462146314641465146614671468146914701471147214731474147514761477147814791480148114821483148414851486148714881489149014911492149314941495149614971498149915001501150215031504150515061507150815091510151115121513151415151516151715181519152015211522152315241525152615271528152915301531153215331534153515361537153815391540154115421543154415451546154715481549155015511552155315541555155615571558155915601561156215631564156515661567156815691570157115721573157415751576157715781579158015811582158315841585158615871588158915901591159215931594159515961597159815991600160116021603160416051606160716081609161016111612161316141615161616171618161916201621162216231624162516261627162816291630163116321633163416351636163716381639164016411642164316441645164616471648164916501651165216531654165516561657165816591660166116621663166416651666166716681669167016711672167316741675167616771678167916801681168216831684168516861687168816891690169116921693169416951696169716981699170017011702170317041705170617071708170917101711171217131714171517161717171817191720172117221723172417251726172717281729173017311732173317341735173617371738173917401741174217431744174517461747174817491750175117521753175417551756175717581759176017611762176317641765176617671768176917701771177217731774177517761777177817791780178117821783178417851786178717881789179017911792179317941795179617971798179918001801180218031804180518061807180818091810181118121813181418151816181718181819182018211822182318241825182618271828182918301831183218331834183518361837183818391840184118421843184418451846184718481849185018511852185318541855185618571858185918601861186218631864186518661867186818691870187118721873187418751876187718781879188018811882188318841885188618871888188918901891189218931894189518961897189818991900190119021903190419051906190719081909191019111912191319141915191619171918191919201921192219231924192519261927192819291930193119321933193419351936193719381939194019411942194319441945194619471948194919501951195219531954195519561957195819591960196119621963196419651966196719681969197019711972197319741975197619771978197919801981198219831984198519861987198819891990199119921993199419951996199719981999200020012002200320042005200620072008200920102011201220132014201520162017201820192020202120222023202420252026202720282029203020312032203320342035203620372038203920402041204220432044204520462047204820492050205120522053205420552056205720582059206020612062206320642065206620672068206920702071207220732074207520762077207820792080208120822083208420852086208720882089209020912092209320942095209620972098209921002101210221032104210521062107210821092110211121122113211421152116211721182119212021212122212321242125212621272128212921302131213221332134213521362137213821392140214121422143214421452146214721482149215021512152215321542155215621572158215921602161216221632164216521662167216821692170217121722173217421752176217721782179218021812182218321842185218621872188218921902191219221932194219521962197219821992200220122022203220422052206220722082209221022112212221322142215221622172218221922202221222222232224222522262227222822292230223122322233223422352236223722382239224022412242224322442245224622472248224922502251225222532254225522562257225822592260226122622263226422652266226722682269227022712272227322742275227622772278227922802281228222832284228522862287228822892290229122922293229422952296229722982299230023012302230323042305230623072308230923102311231223132314231523162317231823192320232123222323232423252326232723282329233023312332233323342335233623372338233923402341234223432344234523462347234823492350235123522353235423552356235723582359236023612362236323642365236623672368236923702371237223732374237523762377237823792380238123822383238423852386238723882389239023912392239323942395239623972398239924002401240224032404240524062407240824092410241124122413241424152416241724182419242024212422242324242425242624272428242924302431243224332434243524362437243824392440244124422443244424452446244724482449245024512452245324542455245624572458245924602461246224632464246524662467246824692470247124722473247424752476247724782479248024812482248324842485248624872488248924902491249224932494249524962497249824992500250125022503250425052506250725082509251025112512251325142515251625172518251925202521252225232524252525262527252825292530253125322533253425352536253725382539254025412542254325442545254625472548254925502551255225532554255525562557255825592560256125622563256425652566256725682569257025712572257325742575257625772578257925802581258225832584258525862587258825892590259125922593259425952596259725982599260026012602260326042605260626072608260926102611261226132614261526162617261826192620262126222623262426252626262726282629263026312632263326342635263626372638263926402641264226432644264526462647264826492650265126522653265426552656265726582659266026612662266326642665266626672668266926702671267226732674267526762677267826792680268126822683268426852686268726882689269026912692269326942695269626972698269927002701270227032704270527062707270827092710271127122713271427152716271727182719272027212722272327242725272627272728272927302731273227332734273527362737273827392740274127422743274427452746274727482749275027512752275327542755275627572758275927602761276227632764276527662767276827692770277127722773277427752776277727782779278027812782278327842785278627872788278927902791279227932794279527962797279827992800280128022803280428052806280728082809281028112812281328142815281628172818281928202821282228232824282528262827282828292830283128322833283428352836283728382839284028412842284328442845284628472848284928502851285228532854285528562857285828592860286128622863286428652866286728682869287028712872287328742875287628772878287928802881288228832884288528862887288828892890289128922893289428952896289728982899290029012902290329042905290629072908290929102911291229132914291529162917291829192920292129222923292429252926292729282929293029312932293329342935293629372938293929402941294229432944294529462947294829492950295129522953295429552956295729582959296029612962296329642965296629672968296929702971297229732974297529762977297829792980298129822983298429852986298729882989299029912992299329942995299629972998299930003001300230033004300530063007300830093010301130123013301430153016301730183019302030213022302330243025302630273028302930303031303230333034303530363037303830393040304130423043304430453046304730483049305030513052305330543055
  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/coercion'), require('@angular/core'), require('@angular/cdk/bidi'), require('@angular/cdk/collections'), require('@angular/cdk/platform'), require('@angular/common'), require('rxjs'), require('rxjs/operators')) :
  10. typeof define === 'function' && define.amd ? define('@angular/cdk/table', ['exports', '@angular/cdk/coercion', '@angular/core', '@angular/cdk/bidi', '@angular/cdk/collections', '@angular/cdk/platform', '@angular/common', 'rxjs', 'rxjs/operators'], factory) :
  11. (factory((global.ng = global.ng || {}, global.ng.cdk = global.ng.cdk || {}, global.ng.cdk.table = {}),global.ng.cdk.coercion,global.ng.core,global.ng.cdk.bidi,global.ng.cdk.collections,global.ng.cdk.platform,global.ng.common,global.rxjs,global.rxjs.operators));
  12. }(this, (function (exports,coercion,core,bidi,collections,platform,common,rxjs,operators) { '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. * Mixin to provide a directive with a function that checks if the sticky input has been
  43. * changed since the last time the function was called. Essentially adds a dirty-check to the
  44. * sticky value.
  45. * \@docs-private
  46. * @template T
  47. * @param {?} base
  48. * @return {?}
  49. */
  50. function mixinHasStickyInput(base) {
  51. return /** @class */ (function (_super) {
  52. __extends(class_1, _super);
  53. function class_1() {
  54. var args = [];
  55. for (var _i = 0; _i < arguments.length; _i++) {
  56. args[_i] = arguments[_i];
  57. }
  58. var _this = _super.apply(this, args) || this;
  59. _this._sticky = false;
  60. /**
  61. * Whether the sticky input has changed since it was last checked.
  62. */
  63. _this._hasStickyChanged = false;
  64. return _this;
  65. }
  66. Object.defineProperty(class_1.prototype, "sticky", {
  67. /** Whether sticky positioning should be applied. */
  68. get: /**
  69. * Whether sticky positioning should be applied.
  70. * @return {?}
  71. */
  72. function () { return this._sticky; },
  73. set: /**
  74. * @param {?} v
  75. * @return {?}
  76. */
  77. function (v) {
  78. /** @type {?} */
  79. var prevValue = this._sticky;
  80. this._sticky = coercion.coerceBooleanProperty(v);
  81. this._hasStickyChanged = prevValue !== this._sticky;
  82. },
  83. enumerable: true,
  84. configurable: true
  85. });
  86. /** Whether the sticky value has changed since this was last called. */
  87. /**
  88. * Whether the sticky value has changed since this was last called.
  89. * @return {?}
  90. */
  91. class_1.prototype.hasStickyChanged = /**
  92. * Whether the sticky value has changed since this was last called.
  93. * @return {?}
  94. */
  95. function () {
  96. /** @type {?} */
  97. var hasStickyChanged = this._hasStickyChanged;
  98. this._hasStickyChanged = false;
  99. return hasStickyChanged;
  100. };
  101. /** Resets the dirty check for cases where the sticky state has been used without checking. */
  102. /**
  103. * Resets the dirty check for cases where the sticky state has been used without checking.
  104. * @return {?}
  105. */
  106. class_1.prototype.resetStickyChanged = /**
  107. * Resets the dirty check for cases where the sticky state has been used without checking.
  108. * @return {?}
  109. */
  110. function () {
  111. this._hasStickyChanged = false;
  112. };
  113. return class_1;
  114. }(base));
  115. }
  116. /**
  117. * @fileoverview added by tsickle
  118. * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
  119. */
  120. /**
  121. * Cell definition for a CDK table.
  122. * Captures the template of a column's data row cell as well as cell-specific properties.
  123. */
  124. var CdkCellDef = /** @class */ (function () {
  125. function CdkCellDef(/** @docs-private */ template) {
  126. this.template = template;
  127. }
  128. CdkCellDef.decorators = [
  129. { type: core.Directive, args: [{ selector: '[cdkCellDef]' },] },
  130. ];
  131. /** @nocollapse */
  132. CdkCellDef.ctorParameters = function () { return [
  133. { type: core.TemplateRef }
  134. ]; };
  135. return CdkCellDef;
  136. }());
  137. /**
  138. * Header cell definition for a CDK table.
  139. * Captures the template of a column's header cell and as well as cell-specific properties.
  140. */
  141. var CdkHeaderCellDef = /** @class */ (function () {
  142. function CdkHeaderCellDef(/** @docs-private */ template) {
  143. this.template = template;
  144. }
  145. CdkHeaderCellDef.decorators = [
  146. { type: core.Directive, args: [{ selector: '[cdkHeaderCellDef]' },] },
  147. ];
  148. /** @nocollapse */
  149. CdkHeaderCellDef.ctorParameters = function () { return [
  150. { type: core.TemplateRef }
  151. ]; };
  152. return CdkHeaderCellDef;
  153. }());
  154. /**
  155. * Footer cell definition for a CDK table.
  156. * Captures the template of a column's footer cell and as well as cell-specific properties.
  157. */
  158. var CdkFooterCellDef = /** @class */ (function () {
  159. function CdkFooterCellDef(/** @docs-private */ template) {
  160. this.template = template;
  161. }
  162. CdkFooterCellDef.decorators = [
  163. { type: core.Directive, args: [{ selector: '[cdkFooterCellDef]' },] },
  164. ];
  165. /** @nocollapse */
  166. CdkFooterCellDef.ctorParameters = function () { return [
  167. { type: core.TemplateRef }
  168. ]; };
  169. return CdkFooterCellDef;
  170. }());
  171. // Boilerplate for applying mixins to CdkColumnDef.
  172. /**
  173. * \@docs-private
  174. */
  175. var
  176. // Boilerplate for applying mixins to CdkColumnDef.
  177. /**
  178. * \@docs-private
  179. */
  180. CdkColumnDefBase = /** @class */ (function () {
  181. function CdkColumnDefBase() {
  182. }
  183. return CdkColumnDefBase;
  184. }());
  185. /** @type {?} */
  186. var _CdkColumnDefBase = mixinHasStickyInput(CdkColumnDefBase);
  187. /**
  188. * Column definition for the CDK table.
  189. * Defines a set of cells available for a table column.
  190. */
  191. var CdkColumnDef = /** @class */ (function (_super) {
  192. __extends(CdkColumnDef, _super);
  193. function CdkColumnDef() {
  194. var _this = _super !== null && _super.apply(this, arguments) || this;
  195. _this._stickyEnd = false;
  196. return _this;
  197. }
  198. Object.defineProperty(CdkColumnDef.prototype, "name", {
  199. /** Unique name for this column. */
  200. get: /**
  201. * Unique name for this column.
  202. * @return {?}
  203. */
  204. function () {
  205. return this._name;
  206. },
  207. set: /**
  208. * @param {?} name
  209. * @return {?}
  210. */
  211. function (name) {
  212. // If the directive is set without a name (updated programatically), then this setter will
  213. // trigger with an empty string and should not overwrite the programatically set value.
  214. if (!name) {
  215. return;
  216. }
  217. this._name = name;
  218. this.cssClassFriendlyName = name.replace(/[^a-z0-9_-]/ig, '-');
  219. },
  220. enumerable: true,
  221. configurable: true
  222. });
  223. Object.defineProperty(CdkColumnDef.prototype, "stickyEnd", {
  224. /**
  225. * Whether this column should be sticky positioned on the end of the row. Should make sure
  226. * that it mimics the `CanStick` mixin such that `_hasStickyChanged` is set to true if the value
  227. * has been changed.
  228. */
  229. get: /**
  230. * Whether this column should be sticky positioned on the end of the row. Should make sure
  231. * that it mimics the `CanStick` mixin such that `_hasStickyChanged` is set to true if the value
  232. * has been changed.
  233. * @return {?}
  234. */
  235. function () {
  236. return this._stickyEnd;
  237. },
  238. set: /**
  239. * @param {?} v
  240. * @return {?}
  241. */
  242. function (v) {
  243. /** @type {?} */
  244. var prevValue = this._stickyEnd;
  245. this._stickyEnd = coercion.coerceBooleanProperty(v);
  246. this._hasStickyChanged = prevValue !== this._stickyEnd;
  247. },
  248. enumerable: true,
  249. configurable: true
  250. });
  251. CdkColumnDef.decorators = [
  252. { type: core.Directive, args: [{
  253. selector: '[cdkColumnDef]',
  254. inputs: ['sticky'],
  255. providers: [{ provide: 'MAT_SORT_HEADER_COLUMN_DEF', useExisting: CdkColumnDef }],
  256. },] },
  257. ];
  258. CdkColumnDef.propDecorators = {
  259. name: [{ type: core.Input, args: ['cdkColumnDef',] }],
  260. stickyEnd: [{ type: core.Input, args: ['stickyEnd',] }],
  261. cell: [{ type: core.ContentChild, args: [CdkCellDef, { static: false },] }],
  262. headerCell: [{ type: core.ContentChild, args: [CdkHeaderCellDef, { static: false },] }],
  263. footerCell: [{ type: core.ContentChild, args: [CdkFooterCellDef, { static: false },] }]
  264. };
  265. return CdkColumnDef;
  266. }(_CdkColumnDefBase));
  267. /**
  268. * Base class for the cells. Adds a CSS classname that identifies the column it renders in.
  269. */
  270. var /**
  271. * Base class for the cells. Adds a CSS classname that identifies the column it renders in.
  272. */
  273. BaseCdkCell = /** @class */ (function () {
  274. function BaseCdkCell(columnDef, elementRef) {
  275. /** @type {?} */
  276. var columnClassName = "cdk-column-" + columnDef.cssClassFriendlyName;
  277. elementRef.nativeElement.classList.add(columnClassName);
  278. }
  279. return BaseCdkCell;
  280. }());
  281. /**
  282. * Header cell template container that adds the right classes and role.
  283. */
  284. var CdkHeaderCell = /** @class */ (function (_super) {
  285. __extends(CdkHeaderCell, _super);
  286. function CdkHeaderCell(columnDef, elementRef) {
  287. return _super.call(this, columnDef, elementRef) || this;
  288. }
  289. CdkHeaderCell.decorators = [
  290. { type: core.Directive, args: [{
  291. selector: 'cdk-header-cell, th[cdk-header-cell]',
  292. host: {
  293. 'class': 'cdk-header-cell',
  294. 'role': 'columnheader',
  295. },
  296. },] },
  297. ];
  298. /** @nocollapse */
  299. CdkHeaderCell.ctorParameters = function () { return [
  300. { type: CdkColumnDef },
  301. { type: core.ElementRef }
  302. ]; };
  303. return CdkHeaderCell;
  304. }(BaseCdkCell));
  305. /**
  306. * Footer cell template container that adds the right classes and role.
  307. */
  308. var CdkFooterCell = /** @class */ (function (_super) {
  309. __extends(CdkFooterCell, _super);
  310. function CdkFooterCell(columnDef, elementRef) {
  311. return _super.call(this, columnDef, elementRef) || this;
  312. }
  313. CdkFooterCell.decorators = [
  314. { type: core.Directive, args: [{
  315. selector: 'cdk-footer-cell, td[cdk-footer-cell]',
  316. host: {
  317. 'class': 'cdk-footer-cell',
  318. 'role': 'gridcell',
  319. },
  320. },] },
  321. ];
  322. /** @nocollapse */
  323. CdkFooterCell.ctorParameters = function () { return [
  324. { type: CdkColumnDef },
  325. { type: core.ElementRef }
  326. ]; };
  327. return CdkFooterCell;
  328. }(BaseCdkCell));
  329. /**
  330. * Cell template container that adds the right classes and role.
  331. */
  332. var CdkCell = /** @class */ (function (_super) {
  333. __extends(CdkCell, _super);
  334. function CdkCell(columnDef, elementRef) {
  335. return _super.call(this, columnDef, elementRef) || this;
  336. }
  337. CdkCell.decorators = [
  338. { type: core.Directive, args: [{
  339. selector: 'cdk-cell, td[cdk-cell]',
  340. host: {
  341. 'class': 'cdk-cell',
  342. 'role': 'gridcell',
  343. },
  344. },] },
  345. ];
  346. /** @nocollapse */
  347. CdkCell.ctorParameters = function () { return [
  348. { type: CdkColumnDef },
  349. { type: core.ElementRef }
  350. ]; };
  351. return CdkCell;
  352. }(BaseCdkCell));
  353. /**
  354. * @fileoverview added by tsickle
  355. * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
  356. */
  357. /**
  358. * The row template that can be used by the mat-table. Should not be used outside of the
  359. * material library.
  360. * @type {?}
  361. */
  362. var CDK_ROW_TEMPLATE = "<ng-container cdkCellOutlet></ng-container>";
  363. /**
  364. * Base class for the CdkHeaderRowDef and CdkRowDef that handles checking their columns inputs
  365. * for changes and notifying the table.
  366. * @abstract
  367. */
  368. var /**
  369. * Base class for the CdkHeaderRowDef and CdkRowDef that handles checking their columns inputs
  370. * for changes and notifying the table.
  371. * @abstract
  372. */
  373. BaseRowDef = /** @class */ (function () {
  374. function BaseRowDef(template, _differs) {
  375. this.template = template;
  376. this._differs = _differs;
  377. }
  378. /**
  379. * @param {?} changes
  380. * @return {?}
  381. */
  382. BaseRowDef.prototype.ngOnChanges = /**
  383. * @param {?} changes
  384. * @return {?}
  385. */
  386. function (changes) {
  387. // Create a new columns differ if one does not yet exist. Initialize it based on initial value
  388. // of the columns property or an empty array if none is provided.
  389. if (!this._columnsDiffer) {
  390. /** @type {?} */
  391. var columns = (changes['columns'] && changes['columns'].currentValue) || [];
  392. this._columnsDiffer = this._differs.find(columns).create();
  393. this._columnsDiffer.diff(columns);
  394. }
  395. };
  396. /**
  397. * Returns the difference between the current columns and the columns from the last diff, or null
  398. * if there is no difference.
  399. */
  400. /**
  401. * Returns the difference between the current columns and the columns from the last diff, or null
  402. * if there is no difference.
  403. * @return {?}
  404. */
  405. BaseRowDef.prototype.getColumnsDiff = /**
  406. * Returns the difference between the current columns and the columns from the last diff, or null
  407. * if there is no difference.
  408. * @return {?}
  409. */
  410. function () {
  411. return this._columnsDiffer.diff(this.columns);
  412. };
  413. /** Gets this row def's relevant cell template from the provided column def. */
  414. /**
  415. * Gets this row def's relevant cell template from the provided column def.
  416. * @param {?} column
  417. * @return {?}
  418. */
  419. BaseRowDef.prototype.extractCellTemplate = /**
  420. * Gets this row def's relevant cell template from the provided column def.
  421. * @param {?} column
  422. * @return {?}
  423. */
  424. function (column) {
  425. if (this instanceof CdkHeaderRowDef) {
  426. return column.headerCell.template;
  427. }
  428. if (this instanceof CdkFooterRowDef) {
  429. return column.footerCell.template;
  430. }
  431. else {
  432. return column.cell.template;
  433. }
  434. };
  435. return BaseRowDef;
  436. }());
  437. // Boilerplate for applying mixins to CdkHeaderRowDef.
  438. /**
  439. * \@docs-private
  440. */
  441. var
  442. // Boilerplate for applying mixins to CdkHeaderRowDef.
  443. /**
  444. * \@docs-private
  445. */
  446. CdkHeaderRowDefBase = /** @class */ (function (_super) {
  447. __extends(CdkHeaderRowDefBase, _super);
  448. function CdkHeaderRowDefBase() {
  449. return _super !== null && _super.apply(this, arguments) || this;
  450. }
  451. return CdkHeaderRowDefBase;
  452. }(BaseRowDef));
  453. /** @type {?} */
  454. var _CdkHeaderRowDefBase = mixinHasStickyInput(CdkHeaderRowDefBase);
  455. /**
  456. * Header row definition for the CDK table.
  457. * Captures the header row's template and other header properties such as the columns to display.
  458. */
  459. var CdkHeaderRowDef = /** @class */ (function (_super) {
  460. __extends(CdkHeaderRowDef, _super);
  461. function CdkHeaderRowDef(template, _differs) {
  462. return _super.call(this, template, _differs) || this;
  463. }
  464. // Prerender fails to recognize that ngOnChanges in a part of this class through inheritance.
  465. // Explicitly define it so that the method is called as part of the Angular lifecycle.
  466. // Prerender fails to recognize that ngOnChanges in a part of this class through inheritance.
  467. // Explicitly define it so that the method is called as part of the Angular lifecycle.
  468. /**
  469. * @param {?} changes
  470. * @return {?}
  471. */
  472. CdkHeaderRowDef.prototype.ngOnChanges =
  473. // Prerender fails to recognize that ngOnChanges in a part of this class through inheritance.
  474. // Explicitly define it so that the method is called as part of the Angular lifecycle.
  475. /**
  476. * @param {?} changes
  477. * @return {?}
  478. */
  479. function (changes) {
  480. _super.prototype.ngOnChanges.call(this, changes);
  481. };
  482. CdkHeaderRowDef.decorators = [
  483. { type: core.Directive, args: [{
  484. selector: '[cdkHeaderRowDef]',
  485. inputs: ['columns: cdkHeaderRowDef', 'sticky: cdkHeaderRowDefSticky'],
  486. },] },
  487. ];
  488. /** @nocollapse */
  489. CdkHeaderRowDef.ctorParameters = function () { return [
  490. { type: core.TemplateRef },
  491. { type: core.IterableDiffers }
  492. ]; };
  493. return CdkHeaderRowDef;
  494. }(_CdkHeaderRowDefBase));
  495. // Boilerplate for applying mixins to CdkFooterRowDef.
  496. /**
  497. * \@docs-private
  498. */
  499. var
  500. // Boilerplate for applying mixins to CdkFooterRowDef.
  501. /**
  502. * \@docs-private
  503. */
  504. CdkFooterRowDefBase = /** @class */ (function (_super) {
  505. __extends(CdkFooterRowDefBase, _super);
  506. function CdkFooterRowDefBase() {
  507. return _super !== null && _super.apply(this, arguments) || this;
  508. }
  509. return CdkFooterRowDefBase;
  510. }(BaseRowDef));
  511. /** @type {?} */
  512. var _CdkFooterRowDefBase = mixinHasStickyInput(CdkFooterRowDefBase);
  513. /**
  514. * Footer row definition for the CDK table.
  515. * Captures the footer row's template and other footer properties such as the columns to display.
  516. */
  517. var CdkFooterRowDef = /** @class */ (function (_super) {
  518. __extends(CdkFooterRowDef, _super);
  519. function CdkFooterRowDef(template, _differs) {
  520. return _super.call(this, template, _differs) || this;
  521. }
  522. // Prerender fails to recognize that ngOnChanges in a part of this class through inheritance.
  523. // Explicitly define it so that the method is called as part of the Angular lifecycle.
  524. // Prerender fails to recognize that ngOnChanges in a part of this class through inheritance.
  525. // Explicitly define it so that the method is called as part of the Angular lifecycle.
  526. /**
  527. * @param {?} changes
  528. * @return {?}
  529. */
  530. CdkFooterRowDef.prototype.ngOnChanges =
  531. // Prerender fails to recognize that ngOnChanges in a part of this class through inheritance.
  532. // Explicitly define it so that the method is called as part of the Angular lifecycle.
  533. /**
  534. * @param {?} changes
  535. * @return {?}
  536. */
  537. function (changes) {
  538. _super.prototype.ngOnChanges.call(this, changes);
  539. };
  540. CdkFooterRowDef.decorators = [
  541. { type: core.Directive, args: [{
  542. selector: '[cdkFooterRowDef]',
  543. inputs: ['columns: cdkFooterRowDef', 'sticky: cdkFooterRowDefSticky'],
  544. },] },
  545. ];
  546. /** @nocollapse */
  547. CdkFooterRowDef.ctorParameters = function () { return [
  548. { type: core.TemplateRef },
  549. { type: core.IterableDiffers }
  550. ]; };
  551. return CdkFooterRowDef;
  552. }(_CdkFooterRowDefBase));
  553. /**
  554. * Data row definition for the CDK table.
  555. * Captures the header row's template and other row properties such as the columns to display and
  556. * a when predicate that describes when this row should be used.
  557. * @template T
  558. */
  559. var CdkRowDef = /** @class */ (function (_super) {
  560. __extends(CdkRowDef, _super);
  561. // TODO(andrewseguin): Add an input for providing a switch function to determine
  562. // if this template should be used.
  563. function CdkRowDef(template, _differs) {
  564. return _super.call(this, template, _differs) || this;
  565. }
  566. CdkRowDef.decorators = [
  567. { type: core.Directive, args: [{
  568. selector: '[cdkRowDef]',
  569. inputs: ['columns: cdkRowDefColumns', 'when: cdkRowDefWhen'],
  570. },] },
  571. ];
  572. /** @nocollapse */
  573. CdkRowDef.ctorParameters = function () { return [
  574. { type: core.TemplateRef },
  575. { type: core.IterableDiffers }
  576. ]; };
  577. return CdkRowDef;
  578. }(BaseRowDef));
  579. /**
  580. * Outlet for rendering cells inside of a row or header row.
  581. * \@docs-private
  582. */
  583. var CdkCellOutlet = /** @class */ (function () {
  584. function CdkCellOutlet(_viewContainer) {
  585. this._viewContainer = _viewContainer;
  586. CdkCellOutlet.mostRecentCellOutlet = this;
  587. }
  588. /**
  589. * @return {?}
  590. */
  591. CdkCellOutlet.prototype.ngOnDestroy = /**
  592. * @return {?}
  593. */
  594. function () {
  595. // If this was the last outlet being rendered in the view, remove the reference
  596. // from the static property after it has been destroyed to avoid leaking memory.
  597. if (CdkCellOutlet.mostRecentCellOutlet === this) {
  598. CdkCellOutlet.mostRecentCellOutlet = null;
  599. }
  600. };
  601. /**
  602. * Static property containing the latest constructed instance of this class.
  603. * Used by the CDK table when each CdkHeaderRow and CdkRow component is created using
  604. * createEmbeddedView. After one of these components are created, this property will provide
  605. * a handle to provide that component's cells and context. After init, the CdkCellOutlet will
  606. * construct the cells with the provided context.
  607. */
  608. CdkCellOutlet.mostRecentCellOutlet = null;
  609. CdkCellOutlet.decorators = [
  610. { type: core.Directive, args: [{ selector: '[cdkCellOutlet]' },] },
  611. ];
  612. /** @nocollapse */
  613. CdkCellOutlet.ctorParameters = function () { return [
  614. { type: core.ViewContainerRef }
  615. ]; };
  616. return CdkCellOutlet;
  617. }());
  618. /**
  619. * Header template container that contains the cell outlet. Adds the right class and role.
  620. */
  621. var CdkHeaderRow = /** @class */ (function () {
  622. function CdkHeaderRow() {
  623. }
  624. CdkHeaderRow.decorators = [
  625. { type: core.Component, args: [{selector: 'cdk-header-row, tr[cdk-header-row]',
  626. template: CDK_ROW_TEMPLATE,
  627. host: {
  628. 'class': 'cdk-header-row',
  629. 'role': 'row',
  630. },
  631. // See note on CdkTable for explanation on why this uses the default change detection strategy.
  632. // tslint:disable-next-line:validate-decorators
  633. changeDetection: core.ChangeDetectionStrategy.Default,
  634. encapsulation: core.ViewEncapsulation.None,
  635. },] },
  636. ];
  637. return CdkHeaderRow;
  638. }());
  639. /**
  640. * Footer template container that contains the cell outlet. Adds the right class and role.
  641. */
  642. var CdkFooterRow = /** @class */ (function () {
  643. function CdkFooterRow() {
  644. }
  645. CdkFooterRow.decorators = [
  646. { type: core.Component, args: [{selector: 'cdk-footer-row, tr[cdk-footer-row]',
  647. template: CDK_ROW_TEMPLATE,
  648. host: {
  649. 'class': 'cdk-footer-row',
  650. 'role': 'row',
  651. },
  652. // See note on CdkTable for explanation on why this uses the default change detection strategy.
  653. // tslint:disable-next-line:validate-decorators
  654. changeDetection: core.ChangeDetectionStrategy.Default,
  655. encapsulation: core.ViewEncapsulation.None,
  656. },] },
  657. ];
  658. return CdkFooterRow;
  659. }());
  660. /**
  661. * Data row template container that contains the cell outlet. Adds the right class and role.
  662. */
  663. var CdkRow = /** @class */ (function () {
  664. function CdkRow() {
  665. }
  666. CdkRow.decorators = [
  667. { type: core.Component, args: [{selector: 'cdk-row, tr[cdk-row]',
  668. template: CDK_ROW_TEMPLATE,
  669. host: {
  670. 'class': 'cdk-row',
  671. 'role': 'row',
  672. },
  673. // See note on CdkTable for explanation on why this uses the default change detection strategy.
  674. // tslint:disable-next-line:validate-decorators
  675. changeDetection: core.ChangeDetectionStrategy.Default,
  676. encapsulation: core.ViewEncapsulation.None,
  677. },] },
  678. ];
  679. return CdkRow;
  680. }());
  681. /**
  682. * @fileoverview added by tsickle
  683. * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
  684. */
  685. /**
  686. * List of all possible directions that can be used for sticky positioning.
  687. * \@docs-private
  688. * @type {?}
  689. */
  690. var STICKY_DIRECTIONS = ['top', 'bottom', 'left', 'right'];
  691. /**
  692. * Applies and removes sticky positioning styles to the `CdkTable` rows and columns cells.
  693. * \@docs-private
  694. */
  695. var /**
  696. * Applies and removes sticky positioning styles to the `CdkTable` rows and columns cells.
  697. * \@docs-private
  698. */
  699. StickyStyler = /** @class */ (function () {
  700. /**
  701. * @param _isNativeHtmlTable Whether the sticky logic should be based on a table
  702. * that uses the native `<table>` element.
  703. * @param _stickCellCss The CSS class that will be applied to every row/cell that has
  704. * sticky positioning applied.
  705. * @param direction The directionality context of the table (ltr/rtl); affects column positioning
  706. * by reversing left/right positions.
  707. * @param _isBrowser Whether the table is currently being rendered on the server or the client.
  708. */
  709. function StickyStyler(_isNativeHtmlTable, _stickCellCss, direction, _isBrowser) {
  710. if (_isBrowser === void 0) { _isBrowser = true; }
  711. this._isNativeHtmlTable = _isNativeHtmlTable;
  712. this._stickCellCss = _stickCellCss;
  713. this.direction = direction;
  714. this._isBrowser = _isBrowser;
  715. }
  716. /**
  717. * Clears the sticky positioning styles from the row and its cells by resetting the `position`
  718. * style, setting the zIndex to 0, and unsetting each provided sticky direction.
  719. * @param rows The list of rows that should be cleared from sticking in the provided directions
  720. * @param stickyDirections The directions that should no longer be set as sticky on the rows.
  721. */
  722. /**
  723. * Clears the sticky positioning styles from the row and its cells by resetting the `position`
  724. * style, setting the zIndex to 0, and unsetting each provided sticky direction.
  725. * @param {?} rows The list of rows that should be cleared from sticking in the provided directions
  726. * @param {?} stickyDirections The directions that should no longer be set as sticky on the rows.
  727. * @return {?}
  728. */
  729. StickyStyler.prototype.clearStickyPositioning = /**
  730. * Clears the sticky positioning styles from the row and its cells by resetting the `position`
  731. * style, setting the zIndex to 0, and unsetting each provided sticky direction.
  732. * @param {?} rows The list of rows that should be cleared from sticking in the provided directions
  733. * @param {?} stickyDirections The directions that should no longer be set as sticky on the rows.
  734. * @return {?}
  735. */
  736. function (rows, stickyDirections) {
  737. for (var _i = 0, rows_1 = rows; _i < rows_1.length; _i++) {
  738. var row = rows_1[_i];
  739. // If the row isn't an element (e.g. if it's an `ng-container`),
  740. // it won't have inline styles or `children` so we skip it.
  741. if (row.nodeType !== row.ELEMENT_NODE) {
  742. continue;
  743. }
  744. this._removeStickyStyle(row, stickyDirections);
  745. for (var i = 0; i < row.children.length; i++) {
  746. /** @type {?} */
  747. var cell = (/** @type {?} */ (row.children[i]));
  748. this._removeStickyStyle(cell, stickyDirections);
  749. }
  750. }
  751. };
  752. /**
  753. * Applies sticky left and right positions to the cells of each row according to the sticky
  754. * states of the rendered column definitions.
  755. * @param rows The rows that should have its set of cells stuck according to the sticky states.
  756. * @param stickyStartStates A list of boolean states where each state represents whether the cell
  757. * in this index position should be stuck to the start of the row.
  758. * @param stickyEndStates A list of boolean states where each state represents whether the cell
  759. * in this index position should be stuck to the end of the row.
  760. */
  761. /**
  762. * Applies sticky left and right positions to the cells of each row according to the sticky
  763. * states of the rendered column definitions.
  764. * @param {?} rows The rows that should have its set of cells stuck according to the sticky states.
  765. * @param {?} stickyStartStates A list of boolean states where each state represents whether the cell
  766. * in this index position should be stuck to the start of the row.
  767. * @param {?} stickyEndStates A list of boolean states where each state represents whether the cell
  768. * in this index position should be stuck to the end of the row.
  769. * @return {?}
  770. */
  771. StickyStyler.prototype.updateStickyColumns = /**
  772. * Applies sticky left and right positions to the cells of each row according to the sticky
  773. * states of the rendered column definitions.
  774. * @param {?} rows The rows that should have its set of cells stuck according to the sticky states.
  775. * @param {?} stickyStartStates A list of boolean states where each state represents whether the cell
  776. * in this index position should be stuck to the start of the row.
  777. * @param {?} stickyEndStates A list of boolean states where each state represents whether the cell
  778. * in this index position should be stuck to the end of the row.
  779. * @return {?}
  780. */
  781. function (rows, stickyStartStates, stickyEndStates) {
  782. /** @type {?} */
  783. var hasStickyColumns = stickyStartStates.some((/**
  784. * @param {?} state
  785. * @return {?}
  786. */
  787. function (state) { return state; })) || stickyEndStates.some((/**
  788. * @param {?} state
  789. * @return {?}
  790. */
  791. function (state) { return state; }));
  792. if (!rows.length || !hasStickyColumns || !this._isBrowser) {
  793. return;
  794. }
  795. /** @type {?} */
  796. var firstRow = rows[0];
  797. /** @type {?} */
  798. var numCells = firstRow.children.length;
  799. /** @type {?} */
  800. var cellWidths = this._getCellWidths(firstRow);
  801. /** @type {?} */
  802. var startPositions = this._getStickyStartColumnPositions(cellWidths, stickyStartStates);
  803. /** @type {?} */
  804. var endPositions = this._getStickyEndColumnPositions(cellWidths, stickyEndStates);
  805. /** @type {?} */
  806. var isRtl = this.direction === 'rtl';
  807. for (var _i = 0, rows_2 = rows; _i < rows_2.length; _i++) {
  808. var row = rows_2[_i];
  809. for (var i = 0; i < numCells; i++) {
  810. /** @type {?} */
  811. var cell = (/** @type {?} */ (row.children[i]));
  812. if (stickyStartStates[i]) {
  813. this._addStickyStyle(cell, isRtl ? 'right' : 'left', startPositions[i]);
  814. }
  815. if (stickyEndStates[i]) {
  816. this._addStickyStyle(cell, isRtl ? 'left' : 'right', endPositions[i]);
  817. }
  818. }
  819. }
  820. };
  821. /**
  822. * Applies sticky positioning to the row's cells if using the native table layout, and to the
  823. * row itself otherwise.
  824. * @param rowsToStick The list of rows that should be stuck according to their corresponding
  825. * sticky state and to the provided top or bottom position.
  826. * @param stickyStates A list of boolean states where each state represents whether the row
  827. * should be stuck in the particular top or bottom position.
  828. * @param position The position direction in which the row should be stuck if that row should be
  829. * sticky.
  830. *
  831. */
  832. /**
  833. * Applies sticky positioning to the row's cells if using the native table layout, and to the
  834. * row itself otherwise.
  835. * @param {?} rowsToStick The list of rows that should be stuck according to their corresponding
  836. * sticky state and to the provided top or bottom position.
  837. * @param {?} stickyStates A list of boolean states where each state represents whether the row
  838. * should be stuck in the particular top or bottom position.
  839. * @param {?} position The position direction in which the row should be stuck if that row should be
  840. * sticky.
  841. *
  842. * @return {?}
  843. */
  844. StickyStyler.prototype.stickRows = /**
  845. * Applies sticky positioning to the row's cells if using the native table layout, and to the
  846. * row itself otherwise.
  847. * @param {?} rowsToStick The list of rows that should be stuck according to their corresponding
  848. * sticky state and to the provided top or bottom position.
  849. * @param {?} stickyStates A list of boolean states where each state represents whether the row
  850. * should be stuck in the particular top or bottom position.
  851. * @param {?} position The position direction in which the row should be stuck if that row should be
  852. * sticky.
  853. *
  854. * @return {?}
  855. */
  856. function (rowsToStick, stickyStates, position) {
  857. // Since we can't measure the rows on the server, we can't stick the rows properly.
  858. if (!this._isBrowser) {
  859. return;
  860. }
  861. // If positioning the rows to the bottom, reverse their order when evaluating the sticky
  862. // position such that the last row stuck will be "bottom: 0px" and so on.
  863. /** @type {?} */
  864. var rows = position === 'bottom' ? rowsToStick.reverse() : rowsToStick;
  865. /** @type {?} */
  866. var stickyHeight = 0;
  867. for (var rowIndex = 0; rowIndex < rows.length; rowIndex++) {
  868. if (!stickyStates[rowIndex]) {
  869. continue;
  870. }
  871. /** @type {?} */
  872. var row = rows[rowIndex];
  873. if (this._isNativeHtmlTable) {
  874. for (var j = 0; j < row.children.length; j++) {
  875. /** @type {?} */
  876. var cell = (/** @type {?} */ (row.children[j]));
  877. this._addStickyStyle(cell, position, stickyHeight);
  878. }
  879. }
  880. else {
  881. // Flex does not respect the stick positioning on the cells, needs to be applied to the row.
  882. // If this is applied on a native table, Safari causes the header to fly in wrong direction.
  883. this._addStickyStyle(row, position, stickyHeight);
  884. }
  885. if (rowIndex === rows.length - 1) {
  886. // prevent unnecessary reflow from getBoundingClientRect()
  887. return;
  888. }
  889. stickyHeight += row.getBoundingClientRect().height;
  890. }
  891. };
  892. /**
  893. * When using the native table in Safari, sticky footer cells do not stick. The only way to stick
  894. * footer rows is to apply sticky styling to the tfoot container. This should only be done if
  895. * all footer rows are sticky. If not all footer rows are sticky, remove sticky positioning from
  896. * the tfoot element.
  897. */
  898. /**
  899. * When using the native table in Safari, sticky footer cells do not stick. The only way to stick
  900. * footer rows is to apply sticky styling to the tfoot container. This should only be done if
  901. * all footer rows are sticky. If not all footer rows are sticky, remove sticky positioning from
  902. * the tfoot element.
  903. * @param {?} tableElement
  904. * @param {?} stickyStates
  905. * @return {?}
  906. */
  907. StickyStyler.prototype.updateStickyFooterContainer = /**
  908. * When using the native table in Safari, sticky footer cells do not stick. The only way to stick
  909. * footer rows is to apply sticky styling to the tfoot container. This should only be done if
  910. * all footer rows are sticky. If not all footer rows are sticky, remove sticky positioning from
  911. * the tfoot element.
  912. * @param {?} tableElement
  913. * @param {?} stickyStates
  914. * @return {?}
  915. */
  916. function (tableElement, stickyStates) {
  917. if (!this._isNativeHtmlTable) {
  918. return;
  919. }
  920. /** @type {?} */
  921. var tfoot = (/** @type {?} */ (tableElement.querySelector('tfoot')));
  922. if (stickyStates.some((/**
  923. * @param {?} state
  924. * @return {?}
  925. */
  926. function (state) { return !state; }))) {
  927. this._removeStickyStyle(tfoot, ['bottom']);
  928. }
  929. else {
  930. this._addStickyStyle(tfoot, 'bottom', 0);
  931. }
  932. };
  933. /**
  934. * Removes the sticky style on the element by removing the sticky cell CSS class, re-evaluating
  935. * the zIndex, removing each of the provided sticky directions, and removing the
  936. * sticky position if there are no more directions.
  937. */
  938. /**
  939. * Removes the sticky style on the element by removing the sticky cell CSS class, re-evaluating
  940. * the zIndex, removing each of the provided sticky directions, and removing the
  941. * sticky position if there are no more directions.
  942. * @param {?} element
  943. * @param {?} stickyDirections
  944. * @return {?}
  945. */
  946. StickyStyler.prototype._removeStickyStyle = /**
  947. * Removes the sticky style on the element by removing the sticky cell CSS class, re-evaluating
  948. * the zIndex, removing each of the provided sticky directions, and removing the
  949. * sticky position if there are no more directions.
  950. * @param {?} element
  951. * @param {?} stickyDirections
  952. * @return {?}
  953. */
  954. function (element, stickyDirections) {
  955. for (var _i = 0, stickyDirections_1 = stickyDirections; _i < stickyDirections_1.length; _i++) {
  956. var dir = stickyDirections_1[_i];
  957. element.style[dir] = '';
  958. }
  959. element.style.zIndex = this._getCalculatedZIndex(element);
  960. // If the element no longer has any more sticky directions, remove sticky positioning and
  961. // the sticky CSS class.
  962. /** @type {?} */
  963. var hasDirection = STICKY_DIRECTIONS.some((/**
  964. * @param {?} dir
  965. * @return {?}
  966. */
  967. function (dir) { return !!element.style[dir]; }));
  968. if (!hasDirection) {
  969. element.style.position = '';
  970. element.classList.remove(this._stickCellCss);
  971. }
  972. };
  973. /**
  974. * Adds the sticky styling to the element by adding the sticky style class, changing position
  975. * to be sticky (and -webkit-sticky), setting the appropriate zIndex, and adding a sticky
  976. * direction and value.
  977. */
  978. /**
  979. * Adds the sticky styling to the element by adding the sticky style class, changing position
  980. * to be sticky (and -webkit-sticky), setting the appropriate zIndex, and adding a sticky
  981. * direction and value.
  982. * @param {?} element
  983. * @param {?} dir
  984. * @param {?} dirValue
  985. * @return {?}
  986. */
  987. StickyStyler.prototype._addStickyStyle = /**
  988. * Adds the sticky styling to the element by adding the sticky style class, changing position
  989. * to be sticky (and -webkit-sticky), setting the appropriate zIndex, and adding a sticky
  990. * direction and value.
  991. * @param {?} element
  992. * @param {?} dir
  993. * @param {?} dirValue
  994. * @return {?}
  995. */
  996. function (element, dir, dirValue) {
  997. element.classList.add(this._stickCellCss);
  998. element.style[dir] = dirValue + "px";
  999. element.style.cssText += 'position: -webkit-sticky; position: sticky; ';
  1000. element.style.zIndex = this._getCalculatedZIndex(element);
  1001. };
  1002. /**
  1003. * Calculate what the z-index should be for the element, depending on what directions (top,
  1004. * bottom, left, right) have been set. It should be true that elements with a top direction
  1005. * should have the highest index since these are elements like a table header. If any of those
  1006. * elements are also sticky in another direction, then they should appear above other elements
  1007. * that are only sticky top (e.g. a sticky column on a sticky header). Bottom-sticky elements
  1008. * (e.g. footer rows) should then be next in the ordering such that they are below the header
  1009. * but above any non-sticky elements. Finally, left/right sticky elements (e.g. sticky columns)
  1010. * should minimally increment so that they are above non-sticky elements but below top and bottom
  1011. * elements.
  1012. */
  1013. /**
  1014. * Calculate what the z-index should be for the element, depending on what directions (top,
  1015. * bottom, left, right) have been set. It should be true that elements with a top direction
  1016. * should have the highest index since these are elements like a table header. If any of those
  1017. * elements are also sticky in another direction, then they should appear above other elements
  1018. * that are only sticky top (e.g. a sticky column on a sticky header). Bottom-sticky elements
  1019. * (e.g. footer rows) should then be next in the ordering such that they are below the header
  1020. * but above any non-sticky elements. Finally, left/right sticky elements (e.g. sticky columns)
  1021. * should minimally increment so that they are above non-sticky elements but below top and bottom
  1022. * elements.
  1023. * @param {?} element
  1024. * @return {?}
  1025. */
  1026. StickyStyler.prototype._getCalculatedZIndex = /**
  1027. * Calculate what the z-index should be for the element, depending on what directions (top,
  1028. * bottom, left, right) have been set. It should be true that elements with a top direction
  1029. * should have the highest index since these are elements like a table header. If any of those
  1030. * elements are also sticky in another direction, then they should appear above other elements
  1031. * that are only sticky top (e.g. a sticky column on a sticky header). Bottom-sticky elements
  1032. * (e.g. footer rows) should then be next in the ordering such that they are below the header
  1033. * but above any non-sticky elements. Finally, left/right sticky elements (e.g. sticky columns)
  1034. * should minimally increment so that they are above non-sticky elements but below top and bottom
  1035. * elements.
  1036. * @param {?} element
  1037. * @return {?}
  1038. */
  1039. function (element) {
  1040. /** @type {?} */
  1041. var zIndexIncrements = {
  1042. top: 100,
  1043. bottom: 10,
  1044. left: 1,
  1045. right: 1,
  1046. };
  1047. /** @type {?} */
  1048. var zIndex = 0;
  1049. for (var _i = 0, STICKY_DIRECTIONS_1 = STICKY_DIRECTIONS; _i < STICKY_DIRECTIONS_1.length; _i++) {
  1050. var dir = STICKY_DIRECTIONS_1[_i];
  1051. if (element.style[dir]) {
  1052. zIndex += zIndexIncrements[dir];
  1053. }
  1054. }
  1055. return zIndex ? "" + zIndex : '';
  1056. };
  1057. /** Gets the widths for each cell in the provided row. */
  1058. /**
  1059. * Gets the widths for each cell in the provided row.
  1060. * @param {?} row
  1061. * @return {?}
  1062. */
  1063. StickyStyler.prototype._getCellWidths = /**
  1064. * Gets the widths for each cell in the provided row.
  1065. * @param {?} row
  1066. * @return {?}
  1067. */
  1068. function (row) {
  1069. /** @type {?} */
  1070. var cellWidths = [];
  1071. /** @type {?} */
  1072. var firstRowCells = row.children;
  1073. for (var i = 0; i < firstRowCells.length; i++) {
  1074. /** @type {?} */
  1075. var cell = (/** @type {?} */ (firstRowCells[i]));
  1076. cellWidths.push(cell.getBoundingClientRect().width);
  1077. }
  1078. return cellWidths;
  1079. };
  1080. /**
  1081. * Determines the left and right positions of each sticky column cell, which will be the
  1082. * accumulation of all sticky column cell widths to the left and right, respectively.
  1083. * Non-sticky cells do not need to have a value set since their positions will not be applied.
  1084. */
  1085. /**
  1086. * Determines the left and right positions of each sticky column cell, which will be the
  1087. * accumulation of all sticky column cell widths to the left and right, respectively.
  1088. * Non-sticky cells do not need to have a value set since their positions will not be applied.
  1089. * @param {?} widths
  1090. * @param {?} stickyStates
  1091. * @return {?}
  1092. */
  1093. StickyStyler.prototype._getStickyStartColumnPositions = /**
  1094. * Determines the left and right positions of each sticky column cell, which will be the
  1095. * accumulation of all sticky column cell widths to the left and right, respectively.
  1096. * Non-sticky cells do not need to have a value set since their positions will not be applied.
  1097. * @param {?} widths
  1098. * @param {?} stickyStates
  1099. * @return {?}
  1100. */
  1101. function (widths, stickyStates) {
  1102. /** @type {?} */
  1103. var positions = [];
  1104. /** @type {?} */
  1105. var nextPosition = 0;
  1106. for (var i = 0; i < widths.length; i++) {
  1107. if (stickyStates[i]) {
  1108. positions[i] = nextPosition;
  1109. nextPosition += widths[i];
  1110. }
  1111. }
  1112. return positions;
  1113. };
  1114. /**
  1115. * Determines the left and right positions of each sticky column cell, which will be the
  1116. * accumulation of all sticky column cell widths to the left and right, respectively.
  1117. * Non-sticky cells do not need to have a value set since their positions will not be applied.
  1118. */
  1119. /**
  1120. * Determines the left and right positions of each sticky column cell, which will be the
  1121. * accumulation of all sticky column cell widths to the left and right, respectively.
  1122. * Non-sticky cells do not need to have a value set since their positions will not be applied.
  1123. * @param {?} widths
  1124. * @param {?} stickyStates
  1125. * @return {?}
  1126. */
  1127. StickyStyler.prototype._getStickyEndColumnPositions = /**
  1128. * Determines the left and right positions of each sticky column cell, which will be the
  1129. * accumulation of all sticky column cell widths to the left and right, respectively.
  1130. * Non-sticky cells do not need to have a value set since their positions will not be applied.
  1131. * @param {?} widths
  1132. * @param {?} stickyStates
  1133. * @return {?}
  1134. */
  1135. function (widths, stickyStates) {
  1136. /** @type {?} */
  1137. var positions = [];
  1138. /** @type {?} */
  1139. var nextPosition = 0;
  1140. for (var i = widths.length; i > 0; i--) {
  1141. if (stickyStates[i]) {
  1142. positions[i] = nextPosition;
  1143. nextPosition += widths[i];
  1144. }
  1145. }
  1146. return positions;
  1147. };
  1148. return StickyStyler;
  1149. }());
  1150. /**
  1151. * @fileoverview added by tsickle
  1152. * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
  1153. */
  1154. /**
  1155. * Returns an error to be thrown when attempting to find an unexisting column.
  1156. * \@docs-private
  1157. * @param {?} id Id whose lookup failed.
  1158. * @return {?}
  1159. */
  1160. function getTableUnknownColumnError(id) {
  1161. return Error("Could not find column with id \"" + id + "\".");
  1162. }
  1163. /**
  1164. * Returns an error to be thrown when two column definitions have the same name.
  1165. * \@docs-private
  1166. * @param {?} name
  1167. * @return {?}
  1168. */
  1169. function getTableDuplicateColumnNameError(name) {
  1170. return Error("Duplicate column definition name provided: \"" + name + "\".");
  1171. }
  1172. /**
  1173. * Returns an error to be thrown when there are multiple rows that are missing a when function.
  1174. * \@docs-private
  1175. * @return {?}
  1176. */
  1177. function getTableMultipleDefaultRowDefsError() {
  1178. return Error("There can only be one default row without a when predicate function.");
  1179. }
  1180. /**
  1181. * Returns an error to be thrown when there are no matching row defs for a particular set of data.
  1182. * \@docs-private
  1183. * @param {?} data
  1184. * @return {?}
  1185. */
  1186. function getTableMissingMatchingRowDefError(data) {
  1187. return Error("Could not find a matching row definition for the" +
  1188. ("provided row data: " + JSON.stringify(data)));
  1189. }
  1190. /**
  1191. * Returns an error to be thrown when there is no row definitions present in the content.
  1192. * \@docs-private
  1193. * @return {?}
  1194. */
  1195. function getTableMissingRowDefsError() {
  1196. return Error('Missing definitions for header, footer, and row; ' +
  1197. 'cannot determine which columns should be rendered.');
  1198. }
  1199. /**
  1200. * Returns an error to be thrown when the data source does not match the compatible types.
  1201. * \@docs-private
  1202. * @return {?}
  1203. */
  1204. function getTableUnknownDataSourceError() {
  1205. return Error("Provided data source did not match an array, Observable, or DataSource");
  1206. }
  1207. /**
  1208. * Returns an error to be thrown when the text column cannot find a parent table to inject.
  1209. * \@docs-private
  1210. * @return {?}
  1211. */
  1212. function getTableTextColumnMissingParentTableError() {
  1213. return Error("Text column could not find a parent table for registration.");
  1214. }
  1215. /**
  1216. * Returns an error to be thrown when a table text column doesn't have a name.
  1217. * \@docs-private
  1218. * @return {?}
  1219. */
  1220. function getTableTextColumnMissingNameError() {
  1221. return Error("Table text column must have a name.");
  1222. }
  1223. /**
  1224. * @fileoverview added by tsickle
  1225. * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
  1226. */
  1227. /**
  1228. * Provides a handle for the table to grab the view container's ng-container to insert data rows.
  1229. * \@docs-private
  1230. */
  1231. var DataRowOutlet = /** @class */ (function () {
  1232. function DataRowOutlet(viewContainer, elementRef) {
  1233. this.viewContainer = viewContainer;
  1234. this.elementRef = elementRef;
  1235. }
  1236. DataRowOutlet.decorators = [
  1237. { type: core.Directive, args: [{ selector: '[rowOutlet]' },] },
  1238. ];
  1239. /** @nocollapse */
  1240. DataRowOutlet.ctorParameters = function () { return [
  1241. { type: core.ViewContainerRef },
  1242. { type: core.ElementRef }
  1243. ]; };
  1244. return DataRowOutlet;
  1245. }());
  1246. /**
  1247. * Provides a handle for the table to grab the view container's ng-container to insert the header.
  1248. * \@docs-private
  1249. */
  1250. var HeaderRowOutlet = /** @class */ (function () {
  1251. function HeaderRowOutlet(viewContainer, elementRef) {
  1252. this.viewContainer = viewContainer;
  1253. this.elementRef = elementRef;
  1254. }
  1255. HeaderRowOutlet.decorators = [
  1256. { type: core.Directive, args: [{ selector: '[headerRowOutlet]' },] },
  1257. ];
  1258. /** @nocollapse */
  1259. HeaderRowOutlet.ctorParameters = function () { return [
  1260. { type: core.ViewContainerRef },
  1261. { type: core.ElementRef }
  1262. ]; };
  1263. return HeaderRowOutlet;
  1264. }());
  1265. /**
  1266. * Provides a handle for the table to grab the view container's ng-container to insert the footer.
  1267. * \@docs-private
  1268. */
  1269. var FooterRowOutlet = /** @class */ (function () {
  1270. function FooterRowOutlet(viewContainer, elementRef) {
  1271. this.viewContainer = viewContainer;
  1272. this.elementRef = elementRef;
  1273. }
  1274. FooterRowOutlet.decorators = [
  1275. { type: core.Directive, args: [{ selector: '[footerRowOutlet]' },] },
  1276. ];
  1277. /** @nocollapse */
  1278. FooterRowOutlet.ctorParameters = function () { return [
  1279. { type: core.ViewContainerRef },
  1280. { type: core.ElementRef }
  1281. ]; };
  1282. return FooterRowOutlet;
  1283. }());
  1284. /**
  1285. * The table template that can be used by the mat-table. Should not be used outside of the
  1286. * material library.
  1287. * \@docs-private
  1288. * @type {?}
  1289. */
  1290. var CDK_TABLE_TEMPLATE =
  1291. // Note that according to MDN, the `caption` element has to be projected as the **first**
  1292. // element in the table. See https://developer.mozilla.org/en-US/docs/Web/HTML/Element/caption
  1293. "\n <ng-content select=\"caption\"></ng-content>\n <ng-container headerRowOutlet></ng-container>\n <ng-container rowOutlet></ng-container>\n <ng-container footerRowOutlet></ng-container>\n";
  1294. /**
  1295. * Class used to conveniently type the embedded view ref for rows with a context.
  1296. * \@docs-private
  1297. * @abstract
  1298. * @template T
  1299. */
  1300. var /**
  1301. * Class used to conveniently type the embedded view ref for rows with a context.
  1302. * \@docs-private
  1303. * @abstract
  1304. * @template T
  1305. */
  1306. RowViewRef = /** @class */ (function (_super) {
  1307. __extends(RowViewRef, _super);
  1308. function RowViewRef() {
  1309. return _super !== null && _super.apply(this, arguments) || this;
  1310. }
  1311. return RowViewRef;
  1312. }(core.EmbeddedViewRef));
  1313. /**
  1314. * A data table that can render a header row, data rows, and a footer row.
  1315. * Uses the dataSource input to determine the data to be rendered. The data can be provided either
  1316. * as a data array, an Observable stream that emits the data array to render, or a DataSource with a
  1317. * connect function that will return an Observable stream that emits the data array to render.
  1318. * @template T
  1319. */
  1320. var CdkTable = /** @class */ (function () {
  1321. function CdkTable(_differs, _changeDetectorRef, _elementRef, role, _dir, _document, _platform) {
  1322. this._differs = _differs;
  1323. this._changeDetectorRef = _changeDetectorRef;
  1324. this._elementRef = _elementRef;
  1325. this._dir = _dir;
  1326. this._platform = _platform;
  1327. /**
  1328. * Subject that emits when the component has been destroyed.
  1329. */
  1330. this._onDestroy = new rxjs.Subject();
  1331. /**
  1332. * Map of all the user's defined columns (header, data, and footer cell template) identified by
  1333. * name. Collection populated by the column definitions gathered by `ContentChildren` as well as
  1334. * any custom column definitions added to `_customColumnDefs`.
  1335. */
  1336. this._columnDefsByName = new Map();
  1337. /**
  1338. * Column definitions that were defined outside of the direct content children of the table.
  1339. * These will be defined when, e.g., creating a wrapper around the cdkTable that has
  1340. * column definitions as *its* content child.
  1341. */
  1342. this._customColumnDefs = new Set();
  1343. /**
  1344. * Data row definitions that were defined outside of the direct content children of the table.
  1345. * These will be defined when, e.g., creating a wrapper around the cdkTable that has
  1346. * built-in data rows as *its* content child.
  1347. */
  1348. this._customRowDefs = new Set();
  1349. /**
  1350. * Header row definitions that were defined outside of the direct content children of the table.
  1351. * These will be defined when, e.g., creating a wrapper around the cdkTable that has
  1352. * built-in header rows as *its* content child.
  1353. */
  1354. this._customHeaderRowDefs = new Set();
  1355. /**
  1356. * Footer row definitions that were defined outside of the direct content children of the table.
  1357. * These will be defined when, e.g., creating a wrapper around the cdkTable that has a
  1358. * built-in footer row as *its* content child.
  1359. */
  1360. this._customFooterRowDefs = new Set();
  1361. /**
  1362. * Whether the header row definition has been changed. Triggers an update to the header row after
  1363. * content is checked. Initialized as true so that the table renders the initial set of rows.
  1364. */
  1365. this._headerRowDefChanged = true;
  1366. /**
  1367. * Whether the footer row definition has been changed. Triggers an update to the footer row after
  1368. * content is checked. Initialized as true so that the table renders the initial set of rows.
  1369. */
  1370. this._footerRowDefChanged = true;
  1371. /**
  1372. * Cache of the latest rendered `RenderRow` objects as a map for easy retrieval when constructing
  1373. * a new list of `RenderRow` objects for rendering rows. Since the new list is constructed with
  1374. * the cached `RenderRow` objects when possible, the row identity is preserved when the data
  1375. * and row template matches, which allows the `IterableDiffer` to check rows by reference
  1376. * and understand which rows are added/moved/removed.
  1377. *
  1378. * Implemented as a map of maps where the first key is the `data: T` object and the second is the
  1379. * `CdkRowDef<T>` object. With the two keys, the cache points to a `RenderRow<T>` object that
  1380. * contains an array of created pairs. The array is necessary to handle cases where the data
  1381. * array contains multiple duplicate data objects and each instantiated `RenderRow` must be
  1382. * stored.
  1383. */
  1384. this._cachedRenderRowsMap = new Map();
  1385. /**
  1386. * CSS class added to any row or cell that has sticky positioning applied. May be overriden by
  1387. * table subclasses.
  1388. */
  1389. this.stickyCssClass = 'cdk-table-sticky';
  1390. this._multiTemplateDataRows = false;
  1391. // TODO(andrewseguin): Remove max value as the end index
  1392. // and instead calculate the view on init and scroll.
  1393. /**
  1394. * Stream containing the latest information on what rows are being displayed on screen.
  1395. * Can be used by the data source to as a heuristic of what data should be provided.
  1396. *
  1397. * \@docs-private
  1398. */
  1399. this.viewChange = new rxjs.BehaviorSubject({ start: 0, end: Number.MAX_VALUE });
  1400. if (!role) {
  1401. this._elementRef.nativeElement.setAttribute('role', 'grid');
  1402. }
  1403. this._document = _document;
  1404. this._isNativeHtmlTable = this._elementRef.nativeElement.nodeName === 'TABLE';
  1405. }
  1406. Object.defineProperty(CdkTable.prototype, "trackBy", {
  1407. /**
  1408. * Tracking function that will be used to check the differences in data changes. Used similarly
  1409. * to `ngFor` `trackBy` function. Optimize row operations by identifying a row based on its data
  1410. * relative to the function to know if a row should be added/removed/moved.
  1411. * Accepts a function that takes two parameters, `index` and `item`.
  1412. */
  1413. get: /**
  1414. * Tracking function that will be used to check the differences in data changes. Used similarly
  1415. * to `ngFor` `trackBy` function. Optimize row operations by identifying a row based on its data
  1416. * relative to the function to know if a row should be added/removed/moved.
  1417. * Accepts a function that takes two parameters, `index` and `item`.
  1418. * @return {?}
  1419. */
  1420. function () {
  1421. return this._trackByFn;
  1422. },
  1423. set: /**
  1424. * @param {?} fn
  1425. * @return {?}
  1426. */
  1427. function (fn) {
  1428. if (core.isDevMode() && fn != null && typeof fn !== 'function' && (/** @type {?} */ (console)) &&
  1429. (/** @type {?} */ (console.warn))) {
  1430. console.warn("trackBy must be a function, but received " + JSON.stringify(fn) + ".");
  1431. }
  1432. this._trackByFn = fn;
  1433. },
  1434. enumerable: true,
  1435. configurable: true
  1436. });
  1437. Object.defineProperty(CdkTable.prototype, "dataSource", {
  1438. /**
  1439. * The table's source of data, which can be provided in three ways (in order of complexity):
  1440. * - Simple data array (each object represents one table row)
  1441. * - Stream that emits a data array each time the array changes
  1442. * - `DataSource` object that implements the connect/disconnect interface.
  1443. *
  1444. * If a data array is provided, the table must be notified when the array's objects are
  1445. * added, removed, or moved. This can be done by calling the `renderRows()` function which will
  1446. * render the diff since the last table render. If the data array reference is changed, the table
  1447. * will automatically trigger an update to the rows.
  1448. *
  1449. * When providing an Observable stream, the table will trigger an update automatically when the
  1450. * stream emits a new array of data.
  1451. *
  1452. * Finally, when providing a `DataSource` object, the table will use the Observable stream
  1453. * provided by the connect function and trigger updates when that stream emits new data array
  1454. * values. During the table's ngOnDestroy or when the data source is removed from the table, the
  1455. * table will call the DataSource's `disconnect` function (may be useful for cleaning up any
  1456. * subscriptions registered during the connect process).
  1457. */
  1458. get: /**
  1459. * The table's source of data, which can be provided in three ways (in order of complexity):
  1460. * - Simple data array (each object represents one table row)
  1461. * - Stream that emits a data array each time the array changes
  1462. * - `DataSource` object that implements the connect/disconnect interface.
  1463. *
  1464. * If a data array is provided, the table must be notified when the array's objects are
  1465. * added, removed, or moved. This can be done by calling the `renderRows()` function which will
  1466. * render the diff since the last table render. If the data array reference is changed, the table
  1467. * will automatically trigger an update to the rows.
  1468. *
  1469. * When providing an Observable stream, the table will trigger an update automatically when the
  1470. * stream emits a new array of data.
  1471. *
  1472. * Finally, when providing a `DataSource` object, the table will use the Observable stream
  1473. * provided by the connect function and trigger updates when that stream emits new data array
  1474. * values. During the table's ngOnDestroy or when the data source is removed from the table, the
  1475. * table will call the DataSource's `disconnect` function (may be useful for cleaning up any
  1476. * subscriptions registered during the connect process).
  1477. * @return {?}
  1478. */
  1479. function () {
  1480. return this._dataSource;
  1481. },
  1482. set: /**
  1483. * @param {?} dataSource
  1484. * @return {?}
  1485. */
  1486. function (dataSource) {
  1487. if (this._dataSource !== dataSource) {
  1488. this._switchDataSource(dataSource);
  1489. }
  1490. },
  1491. enumerable: true,
  1492. configurable: true
  1493. });
  1494. Object.defineProperty(CdkTable.prototype, "multiTemplateDataRows", {
  1495. /**
  1496. * Whether to allow multiple rows per data object by evaluating which rows evaluate their 'when'
  1497. * predicate to true. If `multiTemplateDataRows` is false, which is the default value, then each
  1498. * dataobject will render the first row that evaluates its when predicate to true, in the order
  1499. * defined in the table, or otherwise the default row which does not have a when predicate.
  1500. */
  1501. get: /**
  1502. * Whether to allow multiple rows per data object by evaluating which rows evaluate their 'when'
  1503. * predicate to true. If `multiTemplateDataRows` is false, which is the default value, then each
  1504. * dataobject will render the first row that evaluates its when predicate to true, in the order
  1505. * defined in the table, or otherwise the default row which does not have a when predicate.
  1506. * @return {?}
  1507. */
  1508. function () {
  1509. return this._multiTemplateDataRows;
  1510. },
  1511. set: /**
  1512. * @param {?} v
  1513. * @return {?}
  1514. */
  1515. function (v) {
  1516. this._multiTemplateDataRows = coercion.coerceBooleanProperty(v);
  1517. // In Ivy if this value is set via a static attribute (e.g. <table multiTemplateDataRows>),
  1518. // this setter will be invoked before the row outlet has been defined hence the null check.
  1519. if (this._rowOutlet && this._rowOutlet.viewContainer.length) {
  1520. this._forceRenderDataRows();
  1521. }
  1522. },
  1523. enumerable: true,
  1524. configurable: true
  1525. });
  1526. /**
  1527. * @return {?}
  1528. */
  1529. CdkTable.prototype.ngOnInit = /**
  1530. * @return {?}
  1531. */
  1532. function () {
  1533. var _this = this;
  1534. this._setupStickyStyler();
  1535. if (this._isNativeHtmlTable) {
  1536. this._applyNativeTableSections();
  1537. }
  1538. // Set up the trackBy function so that it uses the `RenderRow` as its identity by default. If
  1539. // the user has provided a custom trackBy, return the result of that function as evaluated
  1540. // with the values of the `RenderRow`'s data and index.
  1541. this._dataDiffer = this._differs.find([]).create((/**
  1542. * @param {?} _i
  1543. * @param {?} dataRow
  1544. * @return {?}
  1545. */
  1546. function (_i, dataRow) {
  1547. return _this.trackBy ? _this.trackBy(dataRow.dataIndex, dataRow.data) : dataRow;
  1548. }));
  1549. };
  1550. /**
  1551. * @return {?}
  1552. */
  1553. CdkTable.prototype.ngAfterContentChecked = /**
  1554. * @return {?}
  1555. */
  1556. function () {
  1557. // Cache the row and column definitions gathered by ContentChildren and programmatic injection.
  1558. this._cacheRowDefs();
  1559. this._cacheColumnDefs();
  1560. // Make sure that the user has at least added header, footer, or data row def.
  1561. if (!this._headerRowDefs.length && !this._footerRowDefs.length && !this._rowDefs.length) {
  1562. throw getTableMissingRowDefsError();
  1563. }
  1564. // Render updates if the list of columns have been changed for the header, row, or footer defs.
  1565. this._renderUpdatedColumns();
  1566. // If the header row definition has been changed, trigger a render to the header row.
  1567. if (this._headerRowDefChanged) {
  1568. this._forceRenderHeaderRows();
  1569. this._headerRowDefChanged = false;
  1570. }
  1571. // If the footer row definition has been changed, trigger a render to the footer row.
  1572. if (this._footerRowDefChanged) {
  1573. this._forceRenderFooterRows();
  1574. this._footerRowDefChanged = false;
  1575. }
  1576. // If there is a data source and row definitions, connect to the data source unless a
  1577. // connection has already been made.
  1578. if (this.dataSource && this._rowDefs.length > 0 && !this._renderChangeSubscription) {
  1579. this._observeRenderChanges();
  1580. }
  1581. this._checkStickyStates();
  1582. };
  1583. /**
  1584. * @return {?}
  1585. */
  1586. CdkTable.prototype.ngOnDestroy = /**
  1587. * @return {?}
  1588. */
  1589. function () {
  1590. this._rowOutlet.viewContainer.clear();
  1591. this._headerRowOutlet.viewContainer.clear();
  1592. this._footerRowOutlet.viewContainer.clear();
  1593. this._cachedRenderRowsMap.clear();
  1594. this._onDestroy.next();
  1595. this._onDestroy.complete();
  1596. if (collections.isDataSource(this.dataSource)) {
  1597. this.dataSource.disconnect(this);
  1598. }
  1599. };
  1600. /**
  1601. * Renders rows based on the table's latest set of data, which was either provided directly as an
  1602. * input or retrieved through an Observable stream (directly or from a DataSource).
  1603. * Checks for differences in the data since the last diff to perform only the necessary
  1604. * changes (add/remove/move rows).
  1605. *
  1606. * If the table's data source is a DataSource or Observable, this will be invoked automatically
  1607. * each time the provided Observable stream emits a new data array. Otherwise if your data is
  1608. * an array, this function will need to be called to render any changes.
  1609. */
  1610. /**
  1611. * Renders rows based on the table's latest set of data, which was either provided directly as an
  1612. * input or retrieved through an Observable stream (directly or from a DataSource).
  1613. * Checks for differences in the data since the last diff to perform only the necessary
  1614. * changes (add/remove/move rows).
  1615. *
  1616. * If the table's data source is a DataSource or Observable, this will be invoked automatically
  1617. * each time the provided Observable stream emits a new data array. Otherwise if your data is
  1618. * an array, this function will need to be called to render any changes.
  1619. * @return {?}
  1620. */
  1621. CdkTable.prototype.renderRows = /**
  1622. * Renders rows based on the table's latest set of data, which was either provided directly as an
  1623. * input or retrieved through an Observable stream (directly or from a DataSource).
  1624. * Checks for differences in the data since the last diff to perform only the necessary
  1625. * changes (add/remove/move rows).
  1626. *
  1627. * If the table's data source is a DataSource or Observable, this will be invoked automatically
  1628. * each time the provided Observable stream emits a new data array. Otherwise if your data is
  1629. * an array, this function will need to be called to render any changes.
  1630. * @return {?}
  1631. */
  1632. function () {
  1633. var _this = this;
  1634. this._renderRows = this._getAllRenderRows();
  1635. /** @type {?} */
  1636. var changes = this._dataDiffer.diff(this._renderRows);
  1637. if (!changes) {
  1638. return;
  1639. }
  1640. /** @type {?} */
  1641. var viewContainer = this._rowOutlet.viewContainer;
  1642. changes.forEachOperation((/**
  1643. * @param {?} record
  1644. * @param {?} prevIndex
  1645. * @param {?} currentIndex
  1646. * @return {?}
  1647. */
  1648. function (record, prevIndex, currentIndex) {
  1649. if (record.previousIndex == null) {
  1650. _this._insertRow(record.item, (/** @type {?} */ (currentIndex)));
  1651. }
  1652. else if (currentIndex == null) {
  1653. viewContainer.remove((/** @type {?} */ (prevIndex)));
  1654. }
  1655. else {
  1656. /** @type {?} */
  1657. var view = (/** @type {?} */ (viewContainer.get((/** @type {?} */ (prevIndex)))));
  1658. viewContainer.move((/** @type {?} */ (view)), currentIndex);
  1659. }
  1660. }));
  1661. // Update the meta context of a row's context data (index, count, first, last, ...)
  1662. this._updateRowIndexContext();
  1663. // Update rows that did not get added/removed/moved but may have had their identity changed,
  1664. // e.g. if trackBy matched data on some property but the actual data reference changed.
  1665. changes.forEachIdentityChange((/**
  1666. * @param {?} record
  1667. * @return {?}
  1668. */
  1669. function (record) {
  1670. /** @type {?} */
  1671. var rowView = (/** @type {?} */ (viewContainer.get((/** @type {?} */ (record.currentIndex)))));
  1672. rowView.context.$implicit = record.item.data;
  1673. }));
  1674. this.updateStickyColumnStyles();
  1675. };
  1676. /**
  1677. * Sets the header row definition to be used. Overrides the header row definition gathered by
  1678. * using `ContentChild`, if one exists. Sets a flag that will re-render the header row after the
  1679. * table's content is checked.
  1680. * @docs-private
  1681. * @deprecated Use `addHeaderRowDef` and `removeHeaderRowDef` instead
  1682. * @breaking-change 8.0.0
  1683. */
  1684. /**
  1685. * Sets the header row definition to be used. Overrides the header row definition gathered by
  1686. * using `ContentChild`, if one exists. Sets a flag that will re-render the header row after the
  1687. * table's content is checked.
  1688. * \@docs-private
  1689. * @deprecated Use `addHeaderRowDef` and `removeHeaderRowDef` instead
  1690. * \@breaking-change 8.0.0
  1691. * @param {?} headerRowDef
  1692. * @return {?}
  1693. */
  1694. CdkTable.prototype.setHeaderRowDef = /**
  1695. * Sets the header row definition to be used. Overrides the header row definition gathered by
  1696. * using `ContentChild`, if one exists. Sets a flag that will re-render the header row after the
  1697. * table's content is checked.
  1698. * \@docs-private
  1699. * @deprecated Use `addHeaderRowDef` and `removeHeaderRowDef` instead
  1700. * \@breaking-change 8.0.0
  1701. * @param {?} headerRowDef
  1702. * @return {?}
  1703. */
  1704. function (headerRowDef) {
  1705. this._customHeaderRowDefs = new Set([headerRowDef]);
  1706. this._headerRowDefChanged = true;
  1707. };
  1708. /**
  1709. * Sets the footer row definition to be used. Overrides the footer row definition gathered by
  1710. * using `ContentChild`, if one exists. Sets a flag that will re-render the footer row after the
  1711. * table's content is checked.
  1712. * @docs-private
  1713. * @deprecated Use `addFooterRowDef` and `removeFooterRowDef` instead
  1714. * @breaking-change 8.0.0
  1715. */
  1716. /**
  1717. * Sets the footer row definition to be used. Overrides the footer row definition gathered by
  1718. * using `ContentChild`, if one exists. Sets a flag that will re-render the footer row after the
  1719. * table's content is checked.
  1720. * \@docs-private
  1721. * @deprecated Use `addFooterRowDef` and `removeFooterRowDef` instead
  1722. * \@breaking-change 8.0.0
  1723. * @param {?} footerRowDef
  1724. * @return {?}
  1725. */
  1726. CdkTable.prototype.setFooterRowDef = /**
  1727. * Sets the footer row definition to be used. Overrides the footer row definition gathered by
  1728. * using `ContentChild`, if one exists. Sets a flag that will re-render the footer row after the
  1729. * table's content is checked.
  1730. * \@docs-private
  1731. * @deprecated Use `addFooterRowDef` and `removeFooterRowDef` instead
  1732. * \@breaking-change 8.0.0
  1733. * @param {?} footerRowDef
  1734. * @return {?}
  1735. */
  1736. function (footerRowDef) {
  1737. this._customFooterRowDefs = new Set([footerRowDef]);
  1738. this._footerRowDefChanged = true;
  1739. };
  1740. /** Adds a column definition that was not included as part of the content children. */
  1741. /**
  1742. * Adds a column definition that was not included as part of the content children.
  1743. * @param {?} columnDef
  1744. * @return {?}
  1745. */
  1746. CdkTable.prototype.addColumnDef = /**
  1747. * Adds a column definition that was not included as part of the content children.
  1748. * @param {?} columnDef
  1749. * @return {?}
  1750. */
  1751. function (columnDef) {
  1752. this._customColumnDefs.add(columnDef);
  1753. };
  1754. /** Removes a column definition that was not included as part of the content children. */
  1755. /**
  1756. * Removes a column definition that was not included as part of the content children.
  1757. * @param {?} columnDef
  1758. * @return {?}
  1759. */
  1760. CdkTable.prototype.removeColumnDef = /**
  1761. * Removes a column definition that was not included as part of the content children.
  1762. * @param {?} columnDef
  1763. * @return {?}
  1764. */
  1765. function (columnDef) {
  1766. this._customColumnDefs.delete(columnDef);
  1767. };
  1768. /** Adds a row definition that was not included as part of the content children. */
  1769. /**
  1770. * Adds a row definition that was not included as part of the content children.
  1771. * @param {?} rowDef
  1772. * @return {?}
  1773. */
  1774. CdkTable.prototype.addRowDef = /**
  1775. * Adds a row definition that was not included as part of the content children.
  1776. * @param {?} rowDef
  1777. * @return {?}
  1778. */
  1779. function (rowDef) {
  1780. this._customRowDefs.add(rowDef);
  1781. };
  1782. /** Removes a row definition that was not included as part of the content children. */
  1783. /**
  1784. * Removes a row definition that was not included as part of the content children.
  1785. * @param {?} rowDef
  1786. * @return {?}
  1787. */
  1788. CdkTable.prototype.removeRowDef = /**
  1789. * Removes a row definition that was not included as part of the content children.
  1790. * @param {?} rowDef
  1791. * @return {?}
  1792. */
  1793. function (rowDef) {
  1794. this._customRowDefs.delete(rowDef);
  1795. };
  1796. /** Adds a header row definition that was not included as part of the content children. */
  1797. /**
  1798. * Adds a header row definition that was not included as part of the content children.
  1799. * @param {?} headerRowDef
  1800. * @return {?}
  1801. */
  1802. CdkTable.prototype.addHeaderRowDef = /**
  1803. * Adds a header row definition that was not included as part of the content children.
  1804. * @param {?} headerRowDef
  1805. * @return {?}
  1806. */
  1807. function (headerRowDef) {
  1808. this._customHeaderRowDefs.add(headerRowDef);
  1809. this._headerRowDefChanged = true;
  1810. };
  1811. /** Removes a header row definition that was not included as part of the content children. */
  1812. /**
  1813. * Removes a header row definition that was not included as part of the content children.
  1814. * @param {?} headerRowDef
  1815. * @return {?}
  1816. */
  1817. CdkTable.prototype.removeHeaderRowDef = /**
  1818. * Removes a header row definition that was not included as part of the content children.
  1819. * @param {?} headerRowDef
  1820. * @return {?}
  1821. */
  1822. function (headerRowDef) {
  1823. this._customHeaderRowDefs.delete(headerRowDef);
  1824. this._headerRowDefChanged = true;
  1825. };
  1826. /** Adds a footer row definition that was not included as part of the content children. */
  1827. /**
  1828. * Adds a footer row definition that was not included as part of the content children.
  1829. * @param {?} footerRowDef
  1830. * @return {?}
  1831. */
  1832. CdkTable.prototype.addFooterRowDef = /**
  1833. * Adds a footer row definition that was not included as part of the content children.
  1834. * @param {?} footerRowDef
  1835. * @return {?}
  1836. */
  1837. function (footerRowDef) {
  1838. this._customFooterRowDefs.add(footerRowDef);
  1839. this._footerRowDefChanged = true;
  1840. };
  1841. /** Removes a footer row definition that was not included as part of the content children. */
  1842. /**
  1843. * Removes a footer row definition that was not included as part of the content children.
  1844. * @param {?} footerRowDef
  1845. * @return {?}
  1846. */
  1847. CdkTable.prototype.removeFooterRowDef = /**
  1848. * Removes a footer row definition that was not included as part of the content children.
  1849. * @param {?} footerRowDef
  1850. * @return {?}
  1851. */
  1852. function (footerRowDef) {
  1853. this._customFooterRowDefs.delete(footerRowDef);
  1854. this._footerRowDefChanged = true;
  1855. };
  1856. /**
  1857. * Updates the header sticky styles. First resets all applied styles with respect to the cells
  1858. * sticking to the top. Then, evaluating which cells need to be stuck to the top. This is
  1859. * automatically called when the header row changes its displayed set of columns, or if its
  1860. * sticky input changes. May be called manually for cases where the cell content changes outside
  1861. * of these events.
  1862. */
  1863. /**
  1864. * Updates the header sticky styles. First resets all applied styles with respect to the cells
  1865. * sticking to the top. Then, evaluating which cells need to be stuck to the top. This is
  1866. * automatically called when the header row changes its displayed set of columns, or if its
  1867. * sticky input changes. May be called manually for cases where the cell content changes outside
  1868. * of these events.
  1869. * @return {?}
  1870. */
  1871. CdkTable.prototype.updateStickyHeaderRowStyles = /**
  1872. * Updates the header sticky styles. First resets all applied styles with respect to the cells
  1873. * sticking to the top. Then, evaluating which cells need to be stuck to the top. This is
  1874. * automatically called when the header row changes its displayed set of columns, or if its
  1875. * sticky input changes. May be called manually for cases where the cell content changes outside
  1876. * of these events.
  1877. * @return {?}
  1878. */
  1879. function () {
  1880. /** @type {?} */
  1881. var headerRows = this._getRenderedRows(this._headerRowOutlet);
  1882. /** @type {?} */
  1883. var tableElement = (/** @type {?} */ (this._elementRef.nativeElement));
  1884. // Hide the thead element if there are no header rows. This is necessary to satisfy
  1885. // overzealous a11y checkers that fail because the `rowgroup` element does not contain
  1886. // required child `row`.
  1887. /** @type {?} */
  1888. var thead = tableElement.querySelector('thead');
  1889. if (thead) {
  1890. thead.style.display = headerRows.length ? '' : 'none';
  1891. }
  1892. /** @type {?} */
  1893. var stickyStates = this._headerRowDefs.map((/**
  1894. * @param {?} def
  1895. * @return {?}
  1896. */
  1897. function (def) { return def.sticky; }));
  1898. this._stickyStyler.clearStickyPositioning(headerRows, ['top']);
  1899. this._stickyStyler.stickRows(headerRows, stickyStates, 'top');
  1900. // Reset the dirty state of the sticky input change since it has been used.
  1901. this._headerRowDefs.forEach((/**
  1902. * @param {?} def
  1903. * @return {?}
  1904. */
  1905. function (def) { return def.resetStickyChanged(); }));
  1906. };
  1907. /**
  1908. * Updates the footer sticky styles. First resets all applied styles with respect to the cells
  1909. * sticking to the bottom. Then, evaluating which cells need to be stuck to the bottom. This is
  1910. * automatically called when the footer row changes its displayed set of columns, or if its
  1911. * sticky input changes. May be called manually for cases where the cell content changes outside
  1912. * of these events.
  1913. */
  1914. /**
  1915. * Updates the footer sticky styles. First resets all applied styles with respect to the cells
  1916. * sticking to the bottom. Then, evaluating which cells need to be stuck to the bottom. This is
  1917. * automatically called when the footer row changes its displayed set of columns, or if its
  1918. * sticky input changes. May be called manually for cases where the cell content changes outside
  1919. * of these events.
  1920. * @return {?}
  1921. */
  1922. CdkTable.prototype.updateStickyFooterRowStyles = /**
  1923. * Updates the footer sticky styles. First resets all applied styles with respect to the cells
  1924. * sticking to the bottom. Then, evaluating which cells need to be stuck to the bottom. This is
  1925. * automatically called when the footer row changes its displayed set of columns, or if its
  1926. * sticky input changes. May be called manually for cases where the cell content changes outside
  1927. * of these events.
  1928. * @return {?}
  1929. */
  1930. function () {
  1931. /** @type {?} */
  1932. var footerRows = this._getRenderedRows(this._footerRowOutlet);
  1933. /** @type {?} */
  1934. var tableElement = (/** @type {?} */ (this._elementRef.nativeElement));
  1935. // Hide the tfoot element if there are no footer rows. This is necessary to satisfy
  1936. // overzealous a11y checkers that fail because the `rowgroup` element does not contain
  1937. // required child `row`.
  1938. /** @type {?} */
  1939. var tfoot = tableElement.querySelector('tfoot');
  1940. if (tfoot) {
  1941. tfoot.style.display = footerRows.length ? '' : 'none';
  1942. }
  1943. /** @type {?} */
  1944. var stickyStates = this._footerRowDefs.map((/**
  1945. * @param {?} def
  1946. * @return {?}
  1947. */
  1948. function (def) { return def.sticky; }));
  1949. this._stickyStyler.clearStickyPositioning(footerRows, ['bottom']);
  1950. this._stickyStyler.stickRows(footerRows, stickyStates, 'bottom');
  1951. this._stickyStyler.updateStickyFooterContainer(this._elementRef.nativeElement, stickyStates);
  1952. // Reset the dirty state of the sticky input change since it has been used.
  1953. this._footerRowDefs.forEach((/**
  1954. * @param {?} def
  1955. * @return {?}
  1956. */
  1957. function (def) { return def.resetStickyChanged(); }));
  1958. };
  1959. /**
  1960. * Updates the column sticky styles. First resets all applied styles with respect to the cells
  1961. * sticking to the left and right. Then sticky styles are added for the left and right according
  1962. * to the column definitions for each cell in each row. This is automatically called when
  1963. * the data source provides a new set of data or when a column definition changes its sticky
  1964. * input. May be called manually for cases where the cell content changes outside of these events.
  1965. */
  1966. /**
  1967. * Updates the column sticky styles. First resets all applied styles with respect to the cells
  1968. * sticking to the left and right. Then sticky styles are added for the left and right according
  1969. * to the column definitions for each cell in each row. This is automatically called when
  1970. * the data source provides a new set of data or when a column definition changes its sticky
  1971. * input. May be called manually for cases where the cell content changes outside of these events.
  1972. * @return {?}
  1973. */
  1974. CdkTable.prototype.updateStickyColumnStyles = /**
  1975. * Updates the column sticky styles. First resets all applied styles with respect to the cells
  1976. * sticking to the left and right. Then sticky styles are added for the left and right according
  1977. * to the column definitions for each cell in each row. This is automatically called when
  1978. * the data source provides a new set of data or when a column definition changes its sticky
  1979. * input. May be called manually for cases where the cell content changes outside of these events.
  1980. * @return {?}
  1981. */
  1982. function () {
  1983. var _this = this;
  1984. /** @type {?} */
  1985. var headerRows = this._getRenderedRows(this._headerRowOutlet);
  1986. /** @type {?} */
  1987. var dataRows = this._getRenderedRows(this._rowOutlet);
  1988. /** @type {?} */
  1989. var footerRows = this._getRenderedRows(this._footerRowOutlet);
  1990. // Clear the left and right positioning from all columns in the table across all rows since
  1991. // sticky columns span across all table sections (header, data, footer)
  1992. this._stickyStyler.clearStickyPositioning(headerRows.concat(dataRows, footerRows), ['left', 'right']);
  1993. // Update the sticky styles for each header row depending on the def's sticky state
  1994. headerRows.forEach((/**
  1995. * @param {?} headerRow
  1996. * @param {?} i
  1997. * @return {?}
  1998. */
  1999. function (headerRow, i) {
  2000. _this._addStickyColumnStyles([headerRow], _this._headerRowDefs[i]);
  2001. }));
  2002. // Update the sticky styles for each data row depending on its def's sticky state
  2003. this._rowDefs.forEach((/**
  2004. * @param {?} rowDef
  2005. * @return {?}
  2006. */
  2007. function (rowDef) {
  2008. // Collect all the rows rendered with this row definition.
  2009. /** @type {?} */
  2010. var rows = [];
  2011. for (var i = 0; i < dataRows.length; i++) {
  2012. if (_this._renderRows[i].rowDef === rowDef) {
  2013. rows.push(dataRows[i]);
  2014. }
  2015. }
  2016. _this._addStickyColumnStyles(rows, rowDef);
  2017. }));
  2018. // Update the sticky styles for each footer row depending on the def's sticky state
  2019. footerRows.forEach((/**
  2020. * @param {?} footerRow
  2021. * @param {?} i
  2022. * @return {?}
  2023. */
  2024. function (footerRow, i) {
  2025. _this._addStickyColumnStyles([footerRow], _this._footerRowDefs[i]);
  2026. }));
  2027. // Reset the dirty state of the sticky input change since it has been used.
  2028. Array.from(this._columnDefsByName.values()).forEach((/**
  2029. * @param {?} def
  2030. * @return {?}
  2031. */
  2032. function (def) { return def.resetStickyChanged(); }));
  2033. };
  2034. /**
  2035. * Get the list of RenderRow objects to render according to the current list of data and defined
  2036. * row definitions. If the previous list already contained a particular pair, it should be reused
  2037. * so that the differ equates their references.
  2038. */
  2039. /**
  2040. * Get the list of RenderRow objects to render according to the current list of data and defined
  2041. * row definitions. If the previous list already contained a particular pair, it should be reused
  2042. * so that the differ equates their references.
  2043. * @private
  2044. * @return {?}
  2045. */
  2046. CdkTable.prototype._getAllRenderRows = /**
  2047. * Get the list of RenderRow objects to render according to the current list of data and defined
  2048. * row definitions. If the previous list already contained a particular pair, it should be reused
  2049. * so that the differ equates their references.
  2050. * @private
  2051. * @return {?}
  2052. */
  2053. function () {
  2054. /** @type {?} */
  2055. var renderRows = [];
  2056. // Store the cache and create a new one. Any re-used RenderRow objects will be moved into the
  2057. // new cache while unused ones can be picked up by garbage collection.
  2058. /** @type {?} */
  2059. var prevCachedRenderRows = this._cachedRenderRowsMap;
  2060. this._cachedRenderRowsMap = new Map();
  2061. // For each data object, get the list of rows that should be rendered, represented by the
  2062. // respective `RenderRow` object which is the pair of `data` and `CdkRowDef`.
  2063. for (var i = 0; i < this._data.length; i++) {
  2064. /** @type {?} */
  2065. var data = this._data[i];
  2066. /** @type {?} */
  2067. var renderRowsForData = this._getRenderRowsForData(data, i, prevCachedRenderRows.get(data));
  2068. if (!this._cachedRenderRowsMap.has(data)) {
  2069. this._cachedRenderRowsMap.set(data, new WeakMap());
  2070. }
  2071. for (var j = 0; j < renderRowsForData.length; j++) {
  2072. /** @type {?} */
  2073. var renderRow = renderRowsForData[j];
  2074. /** @type {?} */
  2075. var cache = (/** @type {?} */ (this._cachedRenderRowsMap.get(renderRow.data)));
  2076. if (cache.has(renderRow.rowDef)) {
  2077. (/** @type {?} */ (cache.get(renderRow.rowDef))).push(renderRow);
  2078. }
  2079. else {
  2080. cache.set(renderRow.rowDef, [renderRow]);
  2081. }
  2082. renderRows.push(renderRow);
  2083. }
  2084. }
  2085. return renderRows;
  2086. };
  2087. /**
  2088. * Gets a list of `RenderRow<T>` for the provided data object and any `CdkRowDef` objects that
  2089. * should be rendered for this data. Reuses the cached RenderRow objects if they match the same
  2090. * `(T, CdkRowDef)` pair.
  2091. */
  2092. /**
  2093. * Gets a list of `RenderRow<T>` for the provided data object and any `CdkRowDef` objects that
  2094. * should be rendered for this data. Reuses the cached RenderRow objects if they match the same
  2095. * `(T, CdkRowDef)` pair.
  2096. * @private
  2097. * @param {?} data
  2098. * @param {?} dataIndex
  2099. * @param {?=} cache
  2100. * @return {?}
  2101. */
  2102. CdkTable.prototype._getRenderRowsForData = /**
  2103. * Gets a list of `RenderRow<T>` for the provided data object and any `CdkRowDef` objects that
  2104. * should be rendered for this data. Reuses the cached RenderRow objects if they match the same
  2105. * `(T, CdkRowDef)` pair.
  2106. * @private
  2107. * @param {?} data
  2108. * @param {?} dataIndex
  2109. * @param {?=} cache
  2110. * @return {?}
  2111. */
  2112. function (data, dataIndex, cache) {
  2113. /** @type {?} */
  2114. var rowDefs = this._getRowDefs(data, dataIndex);
  2115. return rowDefs.map((/**
  2116. * @param {?} rowDef
  2117. * @return {?}
  2118. */
  2119. function (rowDef) {
  2120. /** @type {?} */
  2121. var cachedRenderRows = (cache && cache.has(rowDef)) ? (/** @type {?} */ (cache.get(rowDef))) : [];
  2122. if (cachedRenderRows.length) {
  2123. /** @type {?} */
  2124. var dataRow = (/** @type {?} */ (cachedRenderRows.shift()));
  2125. dataRow.dataIndex = dataIndex;
  2126. return dataRow;
  2127. }
  2128. else {
  2129. return { data: data, rowDef: rowDef, dataIndex: dataIndex };
  2130. }
  2131. }));
  2132. };
  2133. /** Update the map containing the content's column definitions. */
  2134. /**
  2135. * Update the map containing the content's column definitions.
  2136. * @private
  2137. * @return {?}
  2138. */
  2139. CdkTable.prototype._cacheColumnDefs = /**
  2140. * Update the map containing the content's column definitions.
  2141. * @private
  2142. * @return {?}
  2143. */
  2144. function () {
  2145. var _this = this;
  2146. this._columnDefsByName.clear();
  2147. /** @type {?} */
  2148. var columnDefs = mergeQueryListAndSet(this._contentColumnDefs, this._customColumnDefs);
  2149. columnDefs.forEach((/**
  2150. * @param {?} columnDef
  2151. * @return {?}
  2152. */
  2153. function (columnDef) {
  2154. if (_this._columnDefsByName.has(columnDef.name)) {
  2155. throw getTableDuplicateColumnNameError(columnDef.name);
  2156. }
  2157. _this._columnDefsByName.set(columnDef.name, columnDef);
  2158. }));
  2159. };
  2160. /** Update the list of all available row definitions that can be used. */
  2161. /**
  2162. * Update the list of all available row definitions that can be used.
  2163. * @private
  2164. * @return {?}
  2165. */
  2166. CdkTable.prototype._cacheRowDefs = /**
  2167. * Update the list of all available row definitions that can be used.
  2168. * @private
  2169. * @return {?}
  2170. */
  2171. function () {
  2172. this._headerRowDefs =
  2173. mergeQueryListAndSet(this._contentHeaderRowDefs, this._customHeaderRowDefs);
  2174. this._footerRowDefs =
  2175. mergeQueryListAndSet(this._contentFooterRowDefs, this._customFooterRowDefs);
  2176. this._rowDefs = mergeQueryListAndSet(this._contentRowDefs, this._customRowDefs);
  2177. // After all row definitions are determined, find the row definition to be considered default.
  2178. /** @type {?} */
  2179. var defaultRowDefs = this._rowDefs.filter((/**
  2180. * @param {?} def
  2181. * @return {?}
  2182. */
  2183. function (def) { return !def.when; }));
  2184. if (!this.multiTemplateDataRows && defaultRowDefs.length > 1) {
  2185. throw getTableMultipleDefaultRowDefsError();
  2186. }
  2187. this._defaultRowDef = defaultRowDefs[0];
  2188. };
  2189. /**
  2190. * Check if the header, data, or footer rows have changed what columns they want to display or
  2191. * whether the sticky states have changed for the header or footer. If there is a diff, then
  2192. * re-render that section.
  2193. */
  2194. /**
  2195. * Check if the header, data, or footer rows have changed what columns they want to display or
  2196. * whether the sticky states have changed for the header or footer. If there is a diff, then
  2197. * re-render that section.
  2198. * @private
  2199. * @return {?}
  2200. */
  2201. CdkTable.prototype._renderUpdatedColumns = /**
  2202. * Check if the header, data, or footer rows have changed what columns they want to display or
  2203. * whether the sticky states have changed for the header or footer. If there is a diff, then
  2204. * re-render that section.
  2205. * @private
  2206. * @return {?}
  2207. */
  2208. function () {
  2209. /** @type {?} */
  2210. var columnsDiffReducer = (/**
  2211. * @param {?} acc
  2212. * @param {?} def
  2213. * @return {?}
  2214. */
  2215. function (acc, def) { return acc || !!def.getColumnsDiff(); });
  2216. // Force re-render data rows if the list of column definitions have changed.
  2217. if (this._rowDefs.reduce(columnsDiffReducer, false)) {
  2218. this._forceRenderDataRows();
  2219. }
  2220. // Force re-render header/footer rows if the list of column definitions have changed..
  2221. if (this._headerRowDefs.reduce(columnsDiffReducer, false)) {
  2222. this._forceRenderHeaderRows();
  2223. }
  2224. if (this._footerRowDefs.reduce(columnsDiffReducer, false)) {
  2225. this._forceRenderFooterRows();
  2226. }
  2227. };
  2228. /**
  2229. * Switch to the provided data source by resetting the data and unsubscribing from the current
  2230. * render change subscription if one exists. If the data source is null, interpret this by
  2231. * clearing the row outlet. Otherwise start listening for new data.
  2232. */
  2233. /**
  2234. * Switch to the provided data source by resetting the data and unsubscribing from the current
  2235. * render change subscription if one exists. If the data source is null, interpret this by
  2236. * clearing the row outlet. Otherwise start listening for new data.
  2237. * @private
  2238. * @param {?} dataSource
  2239. * @return {?}
  2240. */
  2241. CdkTable.prototype._switchDataSource = /**
  2242. * Switch to the provided data source by resetting the data and unsubscribing from the current
  2243. * render change subscription if one exists. If the data source is null, interpret this by
  2244. * clearing the row outlet. Otherwise start listening for new data.
  2245. * @private
  2246. * @param {?} dataSource
  2247. * @return {?}
  2248. */
  2249. function (dataSource) {
  2250. this._data = [];
  2251. if (collections.isDataSource(this.dataSource)) {
  2252. this.dataSource.disconnect(this);
  2253. }
  2254. // Stop listening for data from the previous data source.
  2255. if (this._renderChangeSubscription) {
  2256. this._renderChangeSubscription.unsubscribe();
  2257. this._renderChangeSubscription = null;
  2258. }
  2259. if (!dataSource) {
  2260. if (this._dataDiffer) {
  2261. this._dataDiffer.diff([]);
  2262. }
  2263. this._rowOutlet.viewContainer.clear();
  2264. }
  2265. this._dataSource = dataSource;
  2266. };
  2267. /** Set up a subscription for the data provided by the data source. */
  2268. /**
  2269. * Set up a subscription for the data provided by the data source.
  2270. * @private
  2271. * @return {?}
  2272. */
  2273. CdkTable.prototype._observeRenderChanges = /**
  2274. * Set up a subscription for the data provided by the data source.
  2275. * @private
  2276. * @return {?}
  2277. */
  2278. function () {
  2279. var _this = this;
  2280. // If no data source has been set, there is nothing to observe for changes.
  2281. if (!this.dataSource) {
  2282. return;
  2283. }
  2284. /** @type {?} */
  2285. var dataStream;
  2286. if (collections.isDataSource(this.dataSource)) {
  2287. dataStream = this.dataSource.connect(this);
  2288. }
  2289. else if (this.dataSource instanceof rxjs.Observable) {
  2290. dataStream = this.dataSource;
  2291. }
  2292. else if (Array.isArray(this.dataSource)) {
  2293. dataStream = rxjs.of(this.dataSource);
  2294. }
  2295. if (dataStream === undefined) {
  2296. throw getTableUnknownDataSourceError();
  2297. }
  2298. this._renderChangeSubscription = dataStream.pipe(operators.takeUntil(this._onDestroy)).subscribe((/**
  2299. * @param {?} data
  2300. * @return {?}
  2301. */
  2302. function (data) {
  2303. _this._data = data || [];
  2304. _this.renderRows();
  2305. }));
  2306. };
  2307. /**
  2308. * Clears any existing content in the header row outlet and creates a new embedded view
  2309. * in the outlet using the header row definition.
  2310. */
  2311. /**
  2312. * Clears any existing content in the header row outlet and creates a new embedded view
  2313. * in the outlet using the header row definition.
  2314. * @private
  2315. * @return {?}
  2316. */
  2317. CdkTable.prototype._forceRenderHeaderRows = /**
  2318. * Clears any existing content in the header row outlet and creates a new embedded view
  2319. * in the outlet using the header row definition.
  2320. * @private
  2321. * @return {?}
  2322. */
  2323. function () {
  2324. var _this = this;
  2325. // Clear the header row outlet if any content exists.
  2326. if (this._headerRowOutlet.viewContainer.length > 0) {
  2327. this._headerRowOutlet.viewContainer.clear();
  2328. }
  2329. this._headerRowDefs.forEach((/**
  2330. * @param {?} def
  2331. * @param {?} i
  2332. * @return {?}
  2333. */
  2334. function (def, i) { return _this._renderRow(_this._headerRowOutlet, def, i); }));
  2335. this.updateStickyHeaderRowStyles();
  2336. this.updateStickyColumnStyles();
  2337. };
  2338. /**
  2339. * Clears any existing content in the footer row outlet and creates a new embedded view
  2340. * in the outlet using the footer row definition.
  2341. */
  2342. /**
  2343. * Clears any existing content in the footer row outlet and creates a new embedded view
  2344. * in the outlet using the footer row definition.
  2345. * @private
  2346. * @return {?}
  2347. */
  2348. CdkTable.prototype._forceRenderFooterRows = /**
  2349. * Clears any existing content in the footer row outlet and creates a new embedded view
  2350. * in the outlet using the footer row definition.
  2351. * @private
  2352. * @return {?}
  2353. */
  2354. function () {
  2355. var _this = this;
  2356. // Clear the footer row outlet if any content exists.
  2357. if (this._footerRowOutlet.viewContainer.length > 0) {
  2358. this._footerRowOutlet.viewContainer.clear();
  2359. }
  2360. this._footerRowDefs.forEach((/**
  2361. * @param {?} def
  2362. * @param {?} i
  2363. * @return {?}
  2364. */
  2365. function (def, i) { return _this._renderRow(_this._footerRowOutlet, def, i); }));
  2366. this.updateStickyFooterRowStyles();
  2367. this.updateStickyColumnStyles();
  2368. };
  2369. /** Adds the sticky column styles for the rows according to the columns' stick states. */
  2370. /**
  2371. * Adds the sticky column styles for the rows according to the columns' stick states.
  2372. * @private
  2373. * @param {?} rows
  2374. * @param {?} rowDef
  2375. * @return {?}
  2376. */
  2377. CdkTable.prototype._addStickyColumnStyles = /**
  2378. * Adds the sticky column styles for the rows according to the columns' stick states.
  2379. * @private
  2380. * @param {?} rows
  2381. * @param {?} rowDef
  2382. * @return {?}
  2383. */
  2384. function (rows, rowDef) {
  2385. var _this = this;
  2386. /** @type {?} */
  2387. var columnDefs = Array.from(rowDef.columns || []).map((/**
  2388. * @param {?} columnName
  2389. * @return {?}
  2390. */
  2391. function (columnName) {
  2392. /** @type {?} */
  2393. var columnDef = _this._columnDefsByName.get(columnName);
  2394. if (!columnDef) {
  2395. throw getTableUnknownColumnError(columnName);
  2396. }
  2397. return (/** @type {?} */ (columnDef));
  2398. }));
  2399. /** @type {?} */
  2400. var stickyStartStates = columnDefs.map((/**
  2401. * @param {?} columnDef
  2402. * @return {?}
  2403. */
  2404. function (columnDef) { return columnDef.sticky; }));
  2405. /** @type {?} */
  2406. var stickyEndStates = columnDefs.map((/**
  2407. * @param {?} columnDef
  2408. * @return {?}
  2409. */
  2410. function (columnDef) { return columnDef.stickyEnd; }));
  2411. this._stickyStyler.updateStickyColumns(rows, stickyStartStates, stickyEndStates);
  2412. };
  2413. /** Gets the list of rows that have been rendered in the row outlet. */
  2414. /**
  2415. * Gets the list of rows that have been rendered in the row outlet.
  2416. * @param {?} rowOutlet
  2417. * @return {?}
  2418. */
  2419. CdkTable.prototype._getRenderedRows = /**
  2420. * Gets the list of rows that have been rendered in the row outlet.
  2421. * @param {?} rowOutlet
  2422. * @return {?}
  2423. */
  2424. function (rowOutlet) {
  2425. /** @type {?} */
  2426. var renderedRows = [];
  2427. for (var i = 0; i < rowOutlet.viewContainer.length; i++) {
  2428. /** @type {?} */
  2429. var viewRef = ((/** @type {?} */ ((/** @type {?} */ (rowOutlet.viewContainer.get(i))))));
  2430. renderedRows.push(viewRef.rootNodes[0]);
  2431. }
  2432. return renderedRows;
  2433. };
  2434. /**
  2435. * Get the matching row definitions that should be used for this row data. If there is only
  2436. * one row definition, it is returned. Otherwise, find the row definitions that has a when
  2437. * predicate that returns true with the data. If none return true, return the default row
  2438. * definition.
  2439. */
  2440. /**
  2441. * Get the matching row definitions that should be used for this row data. If there is only
  2442. * one row definition, it is returned. Otherwise, find the row definitions that has a when
  2443. * predicate that returns true with the data. If none return true, return the default row
  2444. * definition.
  2445. * @param {?} data
  2446. * @param {?} dataIndex
  2447. * @return {?}
  2448. */
  2449. CdkTable.prototype._getRowDefs = /**
  2450. * Get the matching row definitions that should be used for this row data. If there is only
  2451. * one row definition, it is returned. Otherwise, find the row definitions that has a when
  2452. * predicate that returns true with the data. If none return true, return the default row
  2453. * definition.
  2454. * @param {?} data
  2455. * @param {?} dataIndex
  2456. * @return {?}
  2457. */
  2458. function (data, dataIndex) {
  2459. if (this._rowDefs.length == 1) {
  2460. return [this._rowDefs[0]];
  2461. }
  2462. /** @type {?} */
  2463. var rowDefs = [];
  2464. if (this.multiTemplateDataRows) {
  2465. rowDefs = this._rowDefs.filter((/**
  2466. * @param {?} def
  2467. * @return {?}
  2468. */
  2469. function (def) { return !def.when || def.when(dataIndex, data); }));
  2470. }
  2471. else {
  2472. /** @type {?} */
  2473. var rowDef = this._rowDefs.find((/**
  2474. * @param {?} def
  2475. * @return {?}
  2476. */
  2477. function (def) { return def.when && def.when(dataIndex, data); })) || this._defaultRowDef;
  2478. if (rowDef) {
  2479. rowDefs.push(rowDef);
  2480. }
  2481. }
  2482. if (!rowDefs.length) {
  2483. throw getTableMissingMatchingRowDefError(data);
  2484. }
  2485. return rowDefs;
  2486. };
  2487. /**
  2488. * Create the embedded view for the data row template and place it in the correct index location
  2489. * within the data row view container.
  2490. */
  2491. /**
  2492. * Create the embedded view for the data row template and place it in the correct index location
  2493. * within the data row view container.
  2494. * @private
  2495. * @param {?} renderRow
  2496. * @param {?} renderIndex
  2497. * @return {?}
  2498. */
  2499. CdkTable.prototype._insertRow = /**
  2500. * Create the embedded view for the data row template and place it in the correct index location
  2501. * within the data row view container.
  2502. * @private
  2503. * @param {?} renderRow
  2504. * @param {?} renderIndex
  2505. * @return {?}
  2506. */
  2507. function (renderRow, renderIndex) {
  2508. /** @type {?} */
  2509. var rowDef = renderRow.rowDef;
  2510. /** @type {?} */
  2511. var context = { $implicit: renderRow.data };
  2512. this._renderRow(this._rowOutlet, rowDef, renderIndex, context);
  2513. };
  2514. /**
  2515. * Creates a new row template in the outlet and fills it with the set of cell templates.
  2516. * Optionally takes a context to provide to the row and cells, as well as an optional index
  2517. * of where to place the new row template in the outlet.
  2518. */
  2519. /**
  2520. * Creates a new row template in the outlet and fills it with the set of cell templates.
  2521. * Optionally takes a context to provide to the row and cells, as well as an optional index
  2522. * of where to place the new row template in the outlet.
  2523. * @private
  2524. * @param {?} outlet
  2525. * @param {?} rowDef
  2526. * @param {?} index
  2527. * @param {?=} context
  2528. * @return {?}
  2529. */
  2530. CdkTable.prototype._renderRow = /**
  2531. * Creates a new row template in the outlet and fills it with the set of cell templates.
  2532. * Optionally takes a context to provide to the row and cells, as well as an optional index
  2533. * of where to place the new row template in the outlet.
  2534. * @private
  2535. * @param {?} outlet
  2536. * @param {?} rowDef
  2537. * @param {?} index
  2538. * @param {?=} context
  2539. * @return {?}
  2540. */
  2541. function (outlet, rowDef, index, context) {
  2542. if (context === void 0) { context = {}; }
  2543. // TODO(andrewseguin): enforce that one outlet was instantiated from createEmbeddedView
  2544. outlet.viewContainer.createEmbeddedView(rowDef.template, context, index);
  2545. for (var _a = 0, _b = this._getCellTemplates(rowDef); _a < _b.length; _a++) {
  2546. var cellTemplate = _b[_a];
  2547. if (CdkCellOutlet.mostRecentCellOutlet) {
  2548. CdkCellOutlet.mostRecentCellOutlet._viewContainer.createEmbeddedView(cellTemplate, context);
  2549. }
  2550. }
  2551. this._changeDetectorRef.markForCheck();
  2552. };
  2553. /**
  2554. * Updates the index-related context for each row to reflect any changes in the index of the rows,
  2555. * e.g. first/last/even/odd.
  2556. */
  2557. /**
  2558. * Updates the index-related context for each row to reflect any changes in the index of the rows,
  2559. * e.g. first/last/even/odd.
  2560. * @private
  2561. * @return {?}
  2562. */
  2563. CdkTable.prototype._updateRowIndexContext = /**
  2564. * Updates the index-related context for each row to reflect any changes in the index of the rows,
  2565. * e.g. first/last/even/odd.
  2566. * @private
  2567. * @return {?}
  2568. */
  2569. function () {
  2570. /** @type {?} */
  2571. var viewContainer = this._rowOutlet.viewContainer;
  2572. for (var renderIndex = 0, count = viewContainer.length; renderIndex < count; renderIndex++) {
  2573. /** @type {?} */
  2574. var viewRef = (/** @type {?} */ (viewContainer.get(renderIndex)));
  2575. /** @type {?} */
  2576. var context = (/** @type {?} */ (viewRef.context));
  2577. context.count = count;
  2578. context.first = renderIndex === 0;
  2579. context.last = renderIndex === count - 1;
  2580. context.even = renderIndex % 2 === 0;
  2581. context.odd = !context.even;
  2582. if (this.multiTemplateDataRows) {
  2583. context.dataIndex = this._renderRows[renderIndex].dataIndex;
  2584. context.renderIndex = renderIndex;
  2585. }
  2586. else {
  2587. context.index = this._renderRows[renderIndex].dataIndex;
  2588. }
  2589. }
  2590. };
  2591. /** Gets the column definitions for the provided row def. */
  2592. /**
  2593. * Gets the column definitions for the provided row def.
  2594. * @private
  2595. * @param {?} rowDef
  2596. * @return {?}
  2597. */
  2598. CdkTable.prototype._getCellTemplates = /**
  2599. * Gets the column definitions for the provided row def.
  2600. * @private
  2601. * @param {?} rowDef
  2602. * @return {?}
  2603. */
  2604. function (rowDef) {
  2605. var _this = this;
  2606. if (!rowDef || !rowDef.columns) {
  2607. return [];
  2608. }
  2609. return Array.from(rowDef.columns, (/**
  2610. * @param {?} columnId
  2611. * @return {?}
  2612. */
  2613. function (columnId) {
  2614. /** @type {?} */
  2615. var column = _this._columnDefsByName.get(columnId);
  2616. if (!column) {
  2617. throw getTableUnknownColumnError(columnId);
  2618. }
  2619. return rowDef.extractCellTemplate(column);
  2620. }));
  2621. };
  2622. /** Adds native table sections (e.g. tbody) and moves the row outlets into them. */
  2623. /**
  2624. * Adds native table sections (e.g. tbody) and moves the row outlets into them.
  2625. * @private
  2626. * @return {?}
  2627. */
  2628. CdkTable.prototype._applyNativeTableSections = /**
  2629. * Adds native table sections (e.g. tbody) and moves the row outlets into them.
  2630. * @private
  2631. * @return {?}
  2632. */
  2633. function () {
  2634. /** @type {?} */
  2635. var documentFragment = this._document.createDocumentFragment();
  2636. /** @type {?} */
  2637. var sections = [
  2638. { tag: 'thead', outlet: this._headerRowOutlet },
  2639. { tag: 'tbody', outlet: this._rowOutlet },
  2640. { tag: 'tfoot', outlet: this._footerRowOutlet },
  2641. ];
  2642. for (var _a = 0, sections_1 = sections; _a < sections_1.length; _a++) {
  2643. var section = sections_1[_a];
  2644. /** @type {?} */
  2645. var element = this._document.createElement(section.tag);
  2646. element.setAttribute('role', 'rowgroup');
  2647. element.appendChild(section.outlet.elementRef.nativeElement);
  2648. documentFragment.appendChild(element);
  2649. }
  2650. // Use a DocumentFragment so we don't hit the DOM on each iteration.
  2651. this._elementRef.nativeElement.appendChild(documentFragment);
  2652. };
  2653. /**
  2654. * Forces a re-render of the data rows. Should be called in cases where there has been an input
  2655. * change that affects the evaluation of which rows should be rendered, e.g. toggling
  2656. * `multiTemplateDataRows` or adding/removing row definitions.
  2657. */
  2658. /**
  2659. * Forces a re-render of the data rows. Should be called in cases where there has been an input
  2660. * change that affects the evaluation of which rows should be rendered, e.g. toggling
  2661. * `multiTemplateDataRows` or adding/removing row definitions.
  2662. * @private
  2663. * @return {?}
  2664. */
  2665. CdkTable.prototype._forceRenderDataRows = /**
  2666. * Forces a re-render of the data rows. Should be called in cases where there has been an input
  2667. * change that affects the evaluation of which rows should be rendered, e.g. toggling
  2668. * `multiTemplateDataRows` or adding/removing row definitions.
  2669. * @private
  2670. * @return {?}
  2671. */
  2672. function () {
  2673. this._dataDiffer.diff([]);
  2674. this._rowOutlet.viewContainer.clear();
  2675. this.renderRows();
  2676. this.updateStickyColumnStyles();
  2677. };
  2678. /**
  2679. * Checks if there has been a change in sticky states since last check and applies the correct
  2680. * sticky styles. Since checking resets the "dirty" state, this should only be performed once
  2681. * during a change detection and after the inputs are settled (after content check).
  2682. */
  2683. /**
  2684. * Checks if there has been a change in sticky states since last check and applies the correct
  2685. * sticky styles. Since checking resets the "dirty" state, this should only be performed once
  2686. * during a change detection and after the inputs are settled (after content check).
  2687. * @private
  2688. * @return {?}
  2689. */
  2690. CdkTable.prototype._checkStickyStates = /**
  2691. * Checks if there has been a change in sticky states since last check and applies the correct
  2692. * sticky styles. Since checking resets the "dirty" state, this should only be performed once
  2693. * during a change detection and after the inputs are settled (after content check).
  2694. * @private
  2695. * @return {?}
  2696. */
  2697. function () {
  2698. /** @type {?} */
  2699. var stickyCheckReducer = (/**
  2700. * @param {?} acc
  2701. * @param {?} d
  2702. * @return {?}
  2703. */
  2704. function (acc, d) {
  2705. return acc || d.hasStickyChanged();
  2706. });
  2707. // Note that the check needs to occur for every definition since it notifies the definition
  2708. // that it can reset its dirty state. Using another operator like `some` may short-circuit
  2709. // remaining definitions and leave them in an unchecked state.
  2710. if (this._headerRowDefs.reduce(stickyCheckReducer, false)) {
  2711. this.updateStickyHeaderRowStyles();
  2712. }
  2713. if (this._footerRowDefs.reduce(stickyCheckReducer, false)) {
  2714. this.updateStickyFooterRowStyles();
  2715. }
  2716. if (Array.from(this._columnDefsByName.values()).reduce(stickyCheckReducer, false)) {
  2717. this.updateStickyColumnStyles();
  2718. }
  2719. };
  2720. /**
  2721. * Creates the sticky styler that will be used for sticky rows and columns. Listens
  2722. * for directionality changes and provides the latest direction to the styler. Re-applies column
  2723. * stickiness when directionality changes.
  2724. */
  2725. /**
  2726. * Creates the sticky styler that will be used for sticky rows and columns. Listens
  2727. * for directionality changes and provides the latest direction to the styler. Re-applies column
  2728. * stickiness when directionality changes.
  2729. * @private
  2730. * @return {?}
  2731. */
  2732. CdkTable.prototype._setupStickyStyler = /**
  2733. * Creates the sticky styler that will be used for sticky rows and columns. Listens
  2734. * for directionality changes and provides the latest direction to the styler. Re-applies column
  2735. * stickiness when directionality changes.
  2736. * @private
  2737. * @return {?}
  2738. */
  2739. function () {
  2740. var _this = this;
  2741. /** @type {?} */
  2742. var direction = this._dir ? this._dir.value : 'ltr';
  2743. this._stickyStyler = new StickyStyler(this._isNativeHtmlTable, this.stickyCssClass, direction, this._platform.isBrowser);
  2744. (this._dir ? this._dir.change : rxjs.of())
  2745. .pipe(operators.takeUntil(this._onDestroy))
  2746. .subscribe((/**
  2747. * @param {?} value
  2748. * @return {?}
  2749. */
  2750. function (value) {
  2751. _this._stickyStyler.direction = value;
  2752. _this.updateStickyColumnStyles();
  2753. }));
  2754. };
  2755. CdkTable.decorators = [
  2756. { type: core.Component, args: [{selector: 'cdk-table, table[cdk-table]',
  2757. exportAs: 'cdkTable',
  2758. template: CDK_TABLE_TEMPLATE,
  2759. host: {
  2760. 'class': 'cdk-table',
  2761. },
  2762. encapsulation: core.ViewEncapsulation.None,
  2763. // The "OnPush" status for the `MatTable` component is effectively a noop, so we are removing it.
  2764. // The view for `MatTable` consists entirely of templates declared in other views. As they are
  2765. // declared elsewhere, they are checked when their declaration points are checked.
  2766. // tslint:disable-next-line:validate-decorators
  2767. changeDetection: core.ChangeDetectionStrategy.Default,
  2768. },] },
  2769. ];
  2770. /** @nocollapse */
  2771. CdkTable.ctorParameters = function () { return [
  2772. { type: core.IterableDiffers },
  2773. { type: core.ChangeDetectorRef },
  2774. { type: core.ElementRef },
  2775. { type: String, decorators: [{ type: core.Attribute, args: ['role',] }] },
  2776. { type: bidi.Directionality, decorators: [{ type: core.Optional }] },
  2777. { type: undefined, decorators: [{ type: core.Inject, args: [common.DOCUMENT,] }] },
  2778. { type: platform.Platform }
  2779. ]; };
  2780. CdkTable.propDecorators = {
  2781. trackBy: [{ type: core.Input }],
  2782. dataSource: [{ type: core.Input }],
  2783. multiTemplateDataRows: [{ type: core.Input }],
  2784. _rowOutlet: [{ type: core.ViewChild, args: [DataRowOutlet, { static: true },] }],
  2785. _headerRowOutlet: [{ type: core.ViewChild, args: [HeaderRowOutlet, { static: true },] }],
  2786. _footerRowOutlet: [{ type: core.ViewChild, args: [FooterRowOutlet, { static: true },] }],
  2787. _contentColumnDefs: [{ type: core.ContentChildren, args: [CdkColumnDef,] }],
  2788. _contentRowDefs: [{ type: core.ContentChildren, args: [CdkRowDef,] }],
  2789. _contentHeaderRowDefs: [{ type: core.ContentChildren, args: [CdkHeaderRowDef,] }],
  2790. _contentFooterRowDefs: [{ type: core.ContentChildren, args: [CdkFooterRowDef,] }]
  2791. };
  2792. return CdkTable;
  2793. }());
  2794. /**
  2795. * Utility function that gets a merged list of the entries in a QueryList and values of a Set.
  2796. * @template T
  2797. * @param {?} queryList
  2798. * @param {?} set
  2799. * @return {?}
  2800. */
  2801. function mergeQueryListAndSet(queryList, set) {
  2802. return queryList.toArray().concat(Array.from(set));
  2803. }
  2804. /**
  2805. * @fileoverview added by tsickle
  2806. * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
  2807. */
  2808. /**
  2809. * Injection token that can be used to specify the text column options.
  2810. * @type {?}
  2811. */
  2812. var TEXT_COLUMN_OPTIONS = new core.InjectionToken('text-column-options');
  2813. /**
  2814. * Column that simply shows text content for the header and row cells. Assumes that the table
  2815. * is using the native table implementation (`<table>`).
  2816. *
  2817. * By default, the name of this column will be the header text and data property accessor.
  2818. * The header text can be overridden with the `headerText` input. Cell values can be overridden with
  2819. * the `dataAccessor` input. Change the text justification to the start or end using the `justify`
  2820. * input.
  2821. * @template T
  2822. */
  2823. var CdkTextColumn = /** @class */ (function () {
  2824. function CdkTextColumn(_table, _options) {
  2825. this._table = _table;
  2826. this._options = _options;
  2827. /**
  2828. * Alignment of the cell values.
  2829. */
  2830. this.justify = 'start';
  2831. this._options = _options || {};
  2832. }
  2833. Object.defineProperty(CdkTextColumn.prototype, "name", {
  2834. /** Column name that should be used to reference this column. */
  2835. get: /**
  2836. * Column name that should be used to reference this column.
  2837. * @return {?}
  2838. */
  2839. function () {
  2840. return this._name;
  2841. },
  2842. set: /**
  2843. * @param {?} name
  2844. * @return {?}
  2845. */
  2846. function (name) {
  2847. this._name = name;
  2848. // With Ivy, inputs can be initialized before static query results are
  2849. // available. In that case, we defer the synchronization until "ngOnInit" fires.
  2850. this._syncColumnDefName();
  2851. },
  2852. enumerable: true,
  2853. configurable: true
  2854. });
  2855. /**
  2856. * @return {?}
  2857. */
  2858. CdkTextColumn.prototype.ngOnInit = /**
  2859. * @return {?}
  2860. */
  2861. function () {
  2862. this._syncColumnDefName();
  2863. if (this.headerText === undefined) {
  2864. this.headerText = this._createDefaultHeaderText();
  2865. }
  2866. if (!this.dataAccessor) {
  2867. this.dataAccessor =
  2868. this._options.defaultDataAccessor || ((/**
  2869. * @param {?} data
  2870. * @param {?} name
  2871. * @return {?}
  2872. */
  2873. function (data, name) { return ((/** @type {?} */ (data)))[name]; }));
  2874. }
  2875. if (this._table) {
  2876. // Provide the cell and headerCell directly to the table with the static `ViewChild` query,
  2877. // since the columnDef will not pick up its content by the time the table finishes checking
  2878. // its content and initializing the rows.
  2879. this.columnDef.cell = this.cell;
  2880. this.columnDef.headerCell = this.headerCell;
  2881. this._table.addColumnDef(this.columnDef);
  2882. }
  2883. else {
  2884. throw getTableTextColumnMissingParentTableError();
  2885. }
  2886. };
  2887. /**
  2888. * @return {?}
  2889. */
  2890. CdkTextColumn.prototype.ngOnDestroy = /**
  2891. * @return {?}
  2892. */
  2893. function () {
  2894. if (this._table) {
  2895. this._table.removeColumnDef(this.columnDef);
  2896. }
  2897. };
  2898. /**
  2899. * Creates a default header text. Use the options' header text transformation function if one
  2900. * has been provided. Otherwise simply capitalize the column name.
  2901. */
  2902. /**
  2903. * Creates a default header text. Use the options' header text transformation function if one
  2904. * has been provided. Otherwise simply capitalize the column name.
  2905. * @return {?}
  2906. */
  2907. CdkTextColumn.prototype._createDefaultHeaderText = /**
  2908. * Creates a default header text. Use the options' header text transformation function if one
  2909. * has been provided. Otherwise simply capitalize the column name.
  2910. * @return {?}
  2911. */
  2912. function () {
  2913. /** @type {?} */
  2914. var name = this.name;
  2915. if (core.isDevMode() && !name) {
  2916. throw getTableTextColumnMissingNameError();
  2917. }
  2918. if (this._options && this._options.defaultHeaderTextTransform) {
  2919. return this._options.defaultHeaderTextTransform(name);
  2920. }
  2921. return name[0].toUpperCase() + name.slice(1);
  2922. };
  2923. /** Synchronizes the column definition name with the text column name. */
  2924. /**
  2925. * Synchronizes the column definition name with the text column name.
  2926. * @private
  2927. * @return {?}
  2928. */
  2929. CdkTextColumn.prototype._syncColumnDefName = /**
  2930. * Synchronizes the column definition name with the text column name.
  2931. * @private
  2932. * @return {?}
  2933. */
  2934. function () {
  2935. if (this.columnDef) {
  2936. this.columnDef.name = this.name;
  2937. }
  2938. };
  2939. CdkTextColumn.decorators = [
  2940. { type: core.Component, args: [{selector: 'cdk-text-column',
  2941. template: "\n <ng-container cdkColumnDef>\n <th cdk-header-cell *cdkHeaderCellDef [style.text-align]=\"justify\">\n {{headerText}}\n </th>\n <td cdk-cell *cdkCellDef=\"let data\" [style.text-align]=\"justify\">\n {{dataAccessor(data, name)}}\n </td>\n </ng-container>\n ",
  2942. encapsulation: core.ViewEncapsulation.None,
  2943. // Change detection is intentionally not set to OnPush. This component's template will be provided
  2944. // to the table to be inserted into its view. This is problematic when change detection runs since
  2945. // the bindings in this template will be evaluated _after_ the table's view is evaluated, which
  2946. // mean's the template in the table's view will not have the updated value (and in fact will cause
  2947. // an ExpressionChangedAfterItHasBeenCheckedError).
  2948. // tslint:disable-next-line:validate-decorators
  2949. changeDetection: core.ChangeDetectionStrategy.Default,
  2950. },] },
  2951. ];
  2952. /** @nocollapse */
  2953. CdkTextColumn.ctorParameters = function () { return [
  2954. { type: CdkTable, decorators: [{ type: core.Optional }] },
  2955. { type: undefined, decorators: [{ type: core.Optional }, { type: core.Inject, args: [TEXT_COLUMN_OPTIONS,] }] }
  2956. ]; };
  2957. CdkTextColumn.propDecorators = {
  2958. name: [{ type: core.Input }],
  2959. headerText: [{ type: core.Input }],
  2960. dataAccessor: [{ type: core.Input }],
  2961. justify: [{ type: core.Input }],
  2962. columnDef: [{ type: core.ViewChild, args: [CdkColumnDef, { static: true },] }],
  2963. cell: [{ type: core.ViewChild, args: [CdkCellDef, { static: true },] }],
  2964. headerCell: [{ type: core.ViewChild, args: [CdkHeaderCellDef, { static: true },] }]
  2965. };
  2966. return CdkTextColumn;
  2967. }());
  2968. /**
  2969. * @fileoverview added by tsickle
  2970. * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
  2971. */
  2972. /** @type {?} */
  2973. var EXPORTED_DECLARATIONS = [
  2974. CdkTable,
  2975. CdkRowDef,
  2976. CdkCellDef,
  2977. CdkCellOutlet,
  2978. CdkHeaderCellDef,
  2979. CdkFooterCellDef,
  2980. CdkColumnDef,
  2981. CdkCell,
  2982. CdkRow,
  2983. CdkHeaderCell,
  2984. CdkFooterCell,
  2985. CdkHeaderRow,
  2986. CdkHeaderRowDef,
  2987. CdkFooterRow,
  2988. CdkFooterRowDef,
  2989. DataRowOutlet,
  2990. HeaderRowOutlet,
  2991. FooterRowOutlet,
  2992. CdkTextColumn,
  2993. ];
  2994. var CdkTableModule = /** @class */ (function () {
  2995. function CdkTableModule() {
  2996. }
  2997. CdkTableModule.decorators = [
  2998. { type: core.NgModule, args: [{
  2999. imports: [common.CommonModule],
  3000. exports: EXPORTED_DECLARATIONS,
  3001. declarations: EXPORTED_DECLARATIONS
  3002. },] },
  3003. ];
  3004. return CdkTableModule;
  3005. }());
  3006. exports.DataSource = collections.DataSource;
  3007. exports.DataRowOutlet = DataRowOutlet;
  3008. exports.HeaderRowOutlet = HeaderRowOutlet;
  3009. exports.FooterRowOutlet = FooterRowOutlet;
  3010. exports.CDK_TABLE_TEMPLATE = CDK_TABLE_TEMPLATE;
  3011. exports.CdkTable = CdkTable;
  3012. exports.CdkCellDef = CdkCellDef;
  3013. exports.CdkHeaderCellDef = CdkHeaderCellDef;
  3014. exports.CdkFooterCellDef = CdkFooterCellDef;
  3015. exports.CdkColumnDef = CdkColumnDef;
  3016. exports.BaseCdkCell = BaseCdkCell;
  3017. exports.CdkHeaderCell = CdkHeaderCell;
  3018. exports.CdkFooterCell = CdkFooterCell;
  3019. exports.CdkCell = CdkCell;
  3020. exports.CDK_ROW_TEMPLATE = CDK_ROW_TEMPLATE;
  3021. exports.BaseRowDef = BaseRowDef;
  3022. exports.CdkHeaderRowDef = CdkHeaderRowDef;
  3023. exports.CdkFooterRowDef = CdkFooterRowDef;
  3024. exports.CdkRowDef = CdkRowDef;
  3025. exports.CdkCellOutlet = CdkCellOutlet;
  3026. exports.CdkHeaderRow = CdkHeaderRow;
  3027. exports.CdkFooterRow = CdkFooterRow;
  3028. exports.CdkRow = CdkRow;
  3029. exports.CdkTableModule = CdkTableModule;
  3030. exports.STICKY_DIRECTIONS = STICKY_DIRECTIONS;
  3031. exports.StickyStyler = StickyStyler;
  3032. exports.mixinHasStickyInput = mixinHasStickyInput;
  3033. exports.TEXT_COLUMN_OPTIONS = TEXT_COLUMN_OPTIONS;
  3034. exports.CdkTextColumn = CdkTextColumn;
  3035. Object.defineProperty(exports, '__esModule', { value: true });
  3036. })));
  3037. //# sourceMappingURL=cdk-table.umd.js.map