overlay.es5.js 195 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910911912913914915916917918919920921922923924925926927928929930931932933934935936937938939940941942943944945946947948949950951952953954955956957958959960961962963964965966967968969970971972973974975976977978979980981982983984985986987988989990991992993994995996997998999100010011002100310041005100610071008100910101011101210131014101510161017101810191020102110221023102410251026102710281029103010311032103310341035103610371038103910401041104210431044104510461047104810491050105110521053105410551056105710581059106010611062106310641065106610671068106910701071107210731074107510761077107810791080108110821083108410851086108710881089109010911092109310941095109610971098109911001101110211031104110511061107110811091110111111121113111411151116111711181119112011211122112311241125112611271128112911301131113211331134113511361137113811391140114111421143114411451146114711481149115011511152115311541155115611571158115911601161116211631164116511661167116811691170117111721173117411751176117711781179118011811182118311841185118611871188118911901191119211931194119511961197119811991200120112021203120412051206120712081209121012111212121312141215121612171218121912201221122212231224122512261227122812291230123112321233123412351236123712381239124012411242124312441245124612471248124912501251125212531254125512561257125812591260126112621263126412651266126712681269127012711272127312741275127612771278127912801281128212831284128512861287128812891290129112921293129412951296129712981299130013011302130313041305130613071308130913101311131213131314131513161317131813191320132113221323132413251326132713281329133013311332133313341335133613371338133913401341134213431344134513461347134813491350135113521353135413551356135713581359136013611362136313641365136613671368136913701371137213731374137513761377137813791380138113821383138413851386138713881389139013911392139313941395139613971398139914001401140214031404140514061407140814091410141114121413141414151416141714181419142014211422142314241425142614271428142914301431143214331434143514361437143814391440144114421443144414451446144714481449145014511452145314541455145614571458145914601461146214631464146514661467146814691470147114721473147414751476147714781479148014811482148314841485148614871488148914901491149214931494149514961497149814991500150115021503150415051506150715081509151015111512151315141515151615171518151915201521152215231524152515261527152815291530153115321533153415351536153715381539154015411542154315441545154615471548154915501551155215531554155515561557155815591560156115621563156415651566156715681569157015711572157315741575157615771578157915801581158215831584158515861587158815891590159115921593159415951596159715981599160016011602160316041605160616071608160916101611161216131614161516161617161816191620162116221623162416251626162716281629163016311632163316341635163616371638163916401641164216431644164516461647164816491650165116521653165416551656165716581659166016611662166316641665166616671668166916701671167216731674167516761677167816791680168116821683168416851686168716881689169016911692169316941695169616971698169917001701170217031704170517061707170817091710171117121713171417151716171717181719172017211722172317241725172617271728172917301731173217331734173517361737173817391740174117421743174417451746174717481749175017511752175317541755175617571758175917601761176217631764176517661767176817691770177117721773177417751776177717781779178017811782178317841785178617871788178917901791179217931794179517961797179817991800180118021803180418051806180718081809181018111812181318141815181618171818181918201821182218231824182518261827182818291830183118321833183418351836183718381839184018411842184318441845184618471848184918501851185218531854185518561857185818591860186118621863186418651866186718681869187018711872187318741875187618771878187918801881188218831884188518861887188818891890189118921893189418951896189718981899190019011902190319041905190619071908190919101911191219131914191519161917191819191920192119221923192419251926192719281929193019311932193319341935193619371938193919401941194219431944194519461947194819491950195119521953195419551956195719581959196019611962196319641965196619671968196919701971197219731974197519761977197819791980198119821983198419851986198719881989199019911992199319941995199619971998199920002001200220032004200520062007200820092010201120122013201420152016201720182019202020212022202320242025202620272028202920302031203220332034203520362037203820392040204120422043204420452046204720482049205020512052205320542055205620572058205920602061206220632064206520662067206820692070207120722073207420752076207720782079208020812082208320842085208620872088208920902091209220932094209520962097209820992100210121022103210421052106210721082109211021112112211321142115211621172118211921202121212221232124212521262127212821292130213121322133213421352136213721382139214021412142214321442145214621472148214921502151215221532154215521562157215821592160216121622163216421652166216721682169217021712172217321742175217621772178217921802181218221832184218521862187218821892190219121922193219421952196219721982199220022012202220322042205220622072208220922102211221222132214221522162217221822192220222122222223222422252226222722282229223022312232223322342235223622372238223922402241224222432244224522462247224822492250225122522253225422552256225722582259226022612262226322642265226622672268226922702271227222732274227522762277227822792280228122822283228422852286228722882289229022912292229322942295229622972298229923002301230223032304230523062307230823092310231123122313231423152316231723182319232023212322232323242325232623272328232923302331233223332334233523362337233823392340234123422343234423452346234723482349235023512352235323542355235623572358235923602361236223632364236523662367236823692370237123722373237423752376237723782379238023812382238323842385238623872388238923902391239223932394239523962397239823992400240124022403240424052406240724082409241024112412241324142415241624172418241924202421242224232424242524262427242824292430243124322433243424352436243724382439244024412442244324442445244624472448244924502451245224532454245524562457245824592460246124622463246424652466246724682469247024712472247324742475247624772478247924802481248224832484248524862487248824892490249124922493249424952496249724982499250025012502250325042505250625072508250925102511251225132514251525162517251825192520252125222523252425252526252725282529253025312532253325342535253625372538253925402541254225432544254525462547254825492550255125522553255425552556255725582559256025612562256325642565256625672568256925702571257225732574257525762577257825792580258125822583258425852586258725882589259025912592259325942595259625972598259926002601260226032604260526062607260826092610261126122613261426152616261726182619262026212622262326242625262626272628262926302631263226332634263526362637263826392640264126422643264426452646264726482649265026512652265326542655265626572658265926602661266226632664266526662667266826692670267126722673267426752676267726782679268026812682268326842685268626872688268926902691269226932694269526962697269826992700270127022703270427052706270727082709271027112712271327142715271627172718271927202721272227232724272527262727272827292730273127322733273427352736273727382739274027412742274327442745274627472748274927502751275227532754275527562757275827592760276127622763276427652766276727682769277027712772277327742775277627772778277927802781278227832784278527862787278827892790279127922793279427952796279727982799280028012802280328042805280628072808280928102811281228132814281528162817281828192820282128222823282428252826282728282829283028312832283328342835283628372838283928402841284228432844284528462847284828492850285128522853285428552856285728582859286028612862286328642865286628672868286928702871287228732874287528762877287828792880288128822883288428852886288728882889289028912892289328942895289628972898289929002901290229032904290529062907290829092910291129122913291429152916291729182919292029212922292329242925292629272928292929302931293229332934293529362937293829392940294129422943294429452946294729482949295029512952295329542955295629572958295929602961296229632964296529662967296829692970297129722973297429752976297729782979298029812982298329842985298629872988298929902991299229932994299529962997299829993000300130023003300430053006300730083009301030113012301330143015301630173018301930203021302230233024302530263027302830293030303130323033303430353036303730383039304030413042304330443045304630473048304930503051305230533054305530563057305830593060306130623063306430653066306730683069307030713072307330743075307630773078307930803081308230833084308530863087308830893090309130923093309430953096309730983099310031013102310331043105310631073108310931103111311231133114311531163117311831193120312131223123312431253126312731283129313031313132313331343135313631373138313931403141314231433144314531463147314831493150315131523153315431553156315731583159316031613162316331643165316631673168316931703171317231733174317531763177317831793180318131823183318431853186318731883189319031913192319331943195319631973198319932003201320232033204320532063207320832093210321132123213321432153216321732183219322032213222322332243225322632273228322932303231323232333234323532363237323832393240324132423243324432453246324732483249325032513252325332543255325632573258325932603261326232633264326532663267326832693270327132723273327432753276327732783279328032813282328332843285328632873288328932903291329232933294329532963297329832993300330133023303330433053306330733083309331033113312331333143315331633173318331933203321332233233324332533263327332833293330333133323333333433353336333733383339334033413342334333443345334633473348334933503351335233533354335533563357335833593360336133623363336433653366336733683369337033713372337333743375337633773378337933803381338233833384338533863387338833893390339133923393339433953396339733983399340034013402340334043405340634073408340934103411341234133414341534163417341834193420342134223423342434253426342734283429343034313432343334343435343634373438343934403441344234433444344534463447344834493450345134523453345434553456345734583459346034613462346334643465346634673468346934703471347234733474347534763477347834793480348134823483348434853486348734883489349034913492349334943495349634973498349935003501350235033504350535063507350835093510351135123513351435153516351735183519352035213522352335243525352635273528352935303531353235333534353535363537353835393540354135423543354435453546354735483549355035513552355335543555355635573558355935603561356235633564356535663567356835693570357135723573357435753576357735783579358035813582358335843585358635873588358935903591359235933594359535963597359835993600360136023603360436053606360736083609361036113612361336143615361636173618361936203621362236233624362536263627362836293630363136323633363436353636363736383639364036413642364336443645364636473648364936503651365236533654365536563657365836593660366136623663366436653666366736683669367036713672367336743675367636773678367936803681368236833684368536863687368836893690369136923693369436953696369736983699370037013702370337043705370637073708370937103711371237133714371537163717371837193720372137223723372437253726372737283729373037313732373337343735373637373738373937403741374237433744374537463747374837493750375137523753375437553756375737583759376037613762376337643765376637673768376937703771377237733774377537763777377837793780378137823783378437853786378737883789379037913792379337943795379637973798379938003801380238033804380538063807380838093810381138123813381438153816381738183819382038213822382338243825382638273828382938303831383238333834383538363837383838393840384138423843384438453846384738483849385038513852385338543855385638573858385938603861386238633864386538663867386838693870387138723873387438753876387738783879388038813882388338843885388638873888388938903891389238933894389538963897389838993900390139023903390439053906390739083909391039113912391339143915391639173918391939203921392239233924392539263927392839293930393139323933393439353936393739383939394039413942394339443945394639473948394939503951395239533954395539563957395839593960396139623963396439653966396739683969397039713972397339743975397639773978397939803981398239833984398539863987398839893990399139923993399439953996399739983999400040014002400340044005400640074008400940104011401240134014401540164017401840194020402140224023402440254026402740284029403040314032403340344035403640374038403940404041404240434044404540464047404840494050405140524053405440554056405740584059406040614062406340644065406640674068406940704071407240734074407540764077407840794080408140824083408440854086408740884089409040914092409340944095409640974098409941004101410241034104410541064107410841094110411141124113411441154116411741184119412041214122412341244125412641274128412941304131413241334134413541364137413841394140414141424143414441454146414741484149415041514152415341544155415641574158415941604161416241634164416541664167416841694170417141724173417441754176417741784179418041814182418341844185418641874188418941904191419241934194419541964197419841994200420142024203420442054206420742084209421042114212421342144215421642174218421942204221422242234224422542264227422842294230423142324233423442354236423742384239424042414242424342444245424642474248424942504251425242534254425542564257425842594260426142624263426442654266426742684269427042714272427342744275427642774278427942804281428242834284428542864287428842894290429142924293429442954296429742984299430043014302430343044305430643074308430943104311431243134314431543164317431843194320432143224323432443254326432743284329433043314332433343344335433643374338433943404341434243434344434543464347434843494350435143524353435443554356435743584359436043614362436343644365436643674368436943704371437243734374437543764377437843794380438143824383438443854386438743884389439043914392439343944395439643974398439944004401440244034404440544064407440844094410441144124413441444154416441744184419442044214422442344244425442644274428442944304431443244334434443544364437443844394440444144424443444444454446444744484449445044514452445344544455445644574458445944604461446244634464446544664467446844694470447144724473447444754476447744784479448044814482448344844485448644874488448944904491449244934494449544964497449844994500450145024503450445054506450745084509451045114512451345144515451645174518451945204521452245234524452545264527452845294530453145324533453445354536453745384539454045414542454345444545454645474548454945504551455245534554455545564557455845594560456145624563456445654566456745684569457045714572457345744575457645774578457945804581458245834584458545864587458845894590459145924593459445954596459745984599460046014602460346044605460646074608460946104611461246134614461546164617461846194620462146224623462446254626462746284629463046314632463346344635463646374638463946404641464246434644464546464647464846494650465146524653465446554656465746584659466046614662466346644665466646674668466946704671467246734674467546764677467846794680468146824683468446854686468746884689469046914692469346944695469646974698469947004701470247034704470547064707470847094710471147124713471447154716471747184719472047214722472347244725472647274728472947304731473247334734473547364737473847394740474147424743474447454746474747484749475047514752475347544755475647574758475947604761476247634764476547664767476847694770477147724773477447754776477747784779478047814782478347844785478647874788478947904791479247934794479547964797479847994800480148024803480448054806480748084809481048114812481348144815481648174818481948204821482248234824482548264827482848294830483148324833483448354836483748384839484048414842484348444845484648474848484948504851485248534854485548564857485848594860486148624863486448654866486748684869487048714872487348744875487648774878487948804881488248834884488548864887488848894890489148924893489448954896489748984899490049014902490349044905490649074908490949104911491249134914491549164917491849194920492149224923492449254926492749284929493049314932493349344935493649374938493949404941494249434944494549464947494849494950495149524953495449554956495749584959496049614962496349644965496649674968496949704971497249734974497549764977497849794980498149824983498449854986498749884989499049914992499349944995499649974998499950005001500250035004500550065007500850095010501150125013501450155016501750185019502050215022502350245025502650275028502950305031503250335034503550365037503850395040504150425043504450455046504750485049505050515052505350545055505650575058505950605061506250635064506550665067506850695070507150725073507450755076507750785079508050815082508350845085508650875088
  1. /**
  2. * @license
  3. * Copyright Google LLC All Rights Reserved.
  4. *
  5. * Use of this source code is governed by an MIT-style license that can be
  6. * found in the LICENSE file at https://angular.io/license
  7. */
  8. import { coerceCssPixelValue, coerceArray, coerceBooleanProperty } from '@angular/cdk/coercion';
  9. import { ScrollDispatcher, ViewportRuler, ScrollingModule, VIEWPORT_RULER_PROVIDER } from '@angular/cdk/scrolling';
  10. export { ViewportRuler, VIEWPORT_RULER_PROVIDER, CdkScrollable, ScrollDispatcher } from '@angular/cdk/scrolling';
  11. import { DOCUMENT, Location } from '@angular/common';
  12. import { Inject, Injectable, NgZone, Optional, NgModule, SkipSelf, ApplicationRef, ComponentFactoryResolver, Injector, ElementRef, Directive, EventEmitter, InjectionToken, Input, Output, TemplateRef, ViewContainerRef, ɵɵdefineInjectable, ɵɵinject } from '@angular/core';
  13. import { __assign, __extends } from 'tslib';
  14. import { Observable, Subject, merge, Subscription } from 'rxjs';
  15. import { take, takeUntil } from 'rxjs/operators';
  16. import { Platform } from '@angular/cdk/platform';
  17. import { Directionality, BidiModule } from '@angular/cdk/bidi';
  18. import { DomPortalOutlet, TemplatePortal, PortalModule } from '@angular/cdk/portal';
  19. import { ESCAPE, hasModifierKey } from '@angular/cdk/keycodes';
  20. /**
  21. * @fileoverview added by tsickle
  22. * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
  23. */
  24. /**
  25. * Strategy that will prevent the user from scrolling while the overlay is visible.
  26. */
  27. var /**
  28. * Strategy that will prevent the user from scrolling while the overlay is visible.
  29. */
  30. BlockScrollStrategy = /** @class */ (function () {
  31. function BlockScrollStrategy(_viewportRuler, document) {
  32. this._viewportRuler = _viewportRuler;
  33. this._previousHTMLStyles = { top: '', left: '' };
  34. this._isEnabled = false;
  35. this._document = document;
  36. }
  37. /** Attaches this scroll strategy to an overlay. */
  38. /**
  39. * Attaches this scroll strategy to an overlay.
  40. * @return {?}
  41. */
  42. BlockScrollStrategy.prototype.attach = /**
  43. * Attaches this scroll strategy to an overlay.
  44. * @return {?}
  45. */
  46. function () { };
  47. /** Blocks page-level scroll while the attached overlay is open. */
  48. /**
  49. * Blocks page-level scroll while the attached overlay is open.
  50. * @return {?}
  51. */
  52. BlockScrollStrategy.prototype.enable = /**
  53. * Blocks page-level scroll while the attached overlay is open.
  54. * @return {?}
  55. */
  56. function () {
  57. if (this._canBeEnabled()) {
  58. /** @type {?} */
  59. var root = (/** @type {?} */ (this._document.documentElement));
  60. this._previousScrollPosition = this._viewportRuler.getViewportScrollPosition();
  61. // Cache the previous inline styles in case the user had set them.
  62. this._previousHTMLStyles.left = root.style.left || '';
  63. this._previousHTMLStyles.top = root.style.top || '';
  64. // Note: we're using the `html` node, instead of the `body`, because the `body` may
  65. // have the user agent margin, whereas the `html` is guaranteed not to have one.
  66. root.style.left = coerceCssPixelValue(-this._previousScrollPosition.left);
  67. root.style.top = coerceCssPixelValue(-this._previousScrollPosition.top);
  68. root.classList.add('cdk-global-scrollblock');
  69. this._isEnabled = true;
  70. }
  71. };
  72. /** Unblocks page-level scroll while the attached overlay is open. */
  73. /**
  74. * Unblocks page-level scroll while the attached overlay is open.
  75. * @return {?}
  76. */
  77. BlockScrollStrategy.prototype.disable = /**
  78. * Unblocks page-level scroll while the attached overlay is open.
  79. * @return {?}
  80. */
  81. function () {
  82. if (this._isEnabled) {
  83. /** @type {?} */
  84. var html = (/** @type {?} */ (this._document.documentElement));
  85. /** @type {?} */
  86. var body = (/** @type {?} */ (this._document.body));
  87. /** @type {?} */
  88. var htmlStyle = (/** @type {?} */ (html.style));
  89. /** @type {?} */
  90. var bodyStyle = (/** @type {?} */ (body.style));
  91. /** @type {?} */
  92. var previousHtmlScrollBehavior = htmlStyle.scrollBehavior || '';
  93. /** @type {?} */
  94. var previousBodyScrollBehavior = bodyStyle.scrollBehavior || '';
  95. this._isEnabled = false;
  96. htmlStyle.left = this._previousHTMLStyles.left;
  97. htmlStyle.top = this._previousHTMLStyles.top;
  98. html.classList.remove('cdk-global-scrollblock');
  99. // Disable user-defined smooth scrolling temporarily while we restore the scroll position.
  100. // See https://developer.mozilla.org/en-US/docs/Web/CSS/scroll-behavior
  101. htmlStyle.scrollBehavior = bodyStyle.scrollBehavior = 'auto';
  102. window.scroll(this._previousScrollPosition.left, this._previousScrollPosition.top);
  103. htmlStyle.scrollBehavior = previousHtmlScrollBehavior;
  104. bodyStyle.scrollBehavior = previousBodyScrollBehavior;
  105. }
  106. };
  107. /**
  108. * @private
  109. * @return {?}
  110. */
  111. BlockScrollStrategy.prototype._canBeEnabled = /**
  112. * @private
  113. * @return {?}
  114. */
  115. function () {
  116. // Since the scroll strategies can't be singletons, we have to use a global CSS class
  117. // (`cdk-global-scrollblock`) to make sure that we don't try to disable global
  118. // scrolling multiple times.
  119. /** @type {?} */
  120. var html = (/** @type {?} */ (this._document.documentElement));
  121. if (html.classList.contains('cdk-global-scrollblock') || this._isEnabled) {
  122. return false;
  123. }
  124. /** @type {?} */
  125. var body = this._document.body;
  126. /** @type {?} */
  127. var viewport = this._viewportRuler.getViewportSize();
  128. return body.scrollHeight > viewport.height || body.scrollWidth > viewport.width;
  129. };
  130. return BlockScrollStrategy;
  131. }());
  132. /**
  133. * @fileoverview added by tsickle
  134. * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
  135. */
  136. /**
  137. * Returns an error to be thrown when attempting to attach an already-attached scroll strategy.
  138. * @return {?}
  139. */
  140. function getMatScrollStrategyAlreadyAttachedError() {
  141. return Error("Scroll strategy has already been attached.");
  142. }
  143. /**
  144. * @fileoverview added by tsickle
  145. * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
  146. */
  147. /**
  148. * Strategy that will close the overlay as soon as the user starts scrolling.
  149. */
  150. var /**
  151. * Strategy that will close the overlay as soon as the user starts scrolling.
  152. */
  153. CloseScrollStrategy = /** @class */ (function () {
  154. function CloseScrollStrategy(_scrollDispatcher, _ngZone, _viewportRuler, _config) {
  155. var _this = this;
  156. this._scrollDispatcher = _scrollDispatcher;
  157. this._ngZone = _ngZone;
  158. this._viewportRuler = _viewportRuler;
  159. this._config = _config;
  160. this._scrollSubscription = null;
  161. /**
  162. * Detaches the overlay ref and disables the scroll strategy.
  163. */
  164. this._detach = (/**
  165. * @return {?}
  166. */
  167. function () {
  168. _this.disable();
  169. if (_this._overlayRef.hasAttached()) {
  170. _this._ngZone.run((/**
  171. * @return {?}
  172. */
  173. function () { return _this._overlayRef.detach(); }));
  174. }
  175. });
  176. }
  177. /** Attaches this scroll strategy to an overlay. */
  178. /**
  179. * Attaches this scroll strategy to an overlay.
  180. * @param {?} overlayRef
  181. * @return {?}
  182. */
  183. CloseScrollStrategy.prototype.attach = /**
  184. * Attaches this scroll strategy to an overlay.
  185. * @param {?} overlayRef
  186. * @return {?}
  187. */
  188. function (overlayRef) {
  189. if (this._overlayRef) {
  190. throw getMatScrollStrategyAlreadyAttachedError();
  191. }
  192. this._overlayRef = overlayRef;
  193. };
  194. /** Enables the closing of the attached overlay on scroll. */
  195. /**
  196. * Enables the closing of the attached overlay on scroll.
  197. * @return {?}
  198. */
  199. CloseScrollStrategy.prototype.enable = /**
  200. * Enables the closing of the attached overlay on scroll.
  201. * @return {?}
  202. */
  203. function () {
  204. var _this = this;
  205. if (this._scrollSubscription) {
  206. return;
  207. }
  208. /** @type {?} */
  209. var stream = this._scrollDispatcher.scrolled(0);
  210. if (this._config && this._config.threshold && this._config.threshold > 1) {
  211. this._initialScrollPosition = this._viewportRuler.getViewportScrollPosition().top;
  212. this._scrollSubscription = stream.subscribe((/**
  213. * @return {?}
  214. */
  215. function () {
  216. /** @type {?} */
  217. var scrollPosition = _this._viewportRuler.getViewportScrollPosition().top;
  218. if (Math.abs(scrollPosition - _this._initialScrollPosition) > (/** @type {?} */ ((/** @type {?} */ (_this._config)).threshold))) {
  219. _this._detach();
  220. }
  221. else {
  222. _this._overlayRef.updatePosition();
  223. }
  224. }));
  225. }
  226. else {
  227. this._scrollSubscription = stream.subscribe(this._detach);
  228. }
  229. };
  230. /** Disables the closing the attached overlay on scroll. */
  231. /**
  232. * Disables the closing the attached overlay on scroll.
  233. * @return {?}
  234. */
  235. CloseScrollStrategy.prototype.disable = /**
  236. * Disables the closing the attached overlay on scroll.
  237. * @return {?}
  238. */
  239. function () {
  240. if (this._scrollSubscription) {
  241. this._scrollSubscription.unsubscribe();
  242. this._scrollSubscription = null;
  243. }
  244. };
  245. /**
  246. * @return {?}
  247. */
  248. CloseScrollStrategy.prototype.detach = /**
  249. * @return {?}
  250. */
  251. function () {
  252. this.disable();
  253. this._overlayRef = (/** @type {?} */ (null));
  254. };
  255. return CloseScrollStrategy;
  256. }());
  257. /**
  258. * @fileoverview added by tsickle
  259. * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
  260. */
  261. /**
  262. * Scroll strategy that doesn't do anything.
  263. */
  264. var /**
  265. * Scroll strategy that doesn't do anything.
  266. */
  267. NoopScrollStrategy = /** @class */ (function () {
  268. function NoopScrollStrategy() {
  269. }
  270. /** Does nothing, as this scroll strategy is a no-op. */
  271. /**
  272. * Does nothing, as this scroll strategy is a no-op.
  273. * @return {?}
  274. */
  275. NoopScrollStrategy.prototype.enable = /**
  276. * Does nothing, as this scroll strategy is a no-op.
  277. * @return {?}
  278. */
  279. function () { };
  280. /** Does nothing, as this scroll strategy is a no-op. */
  281. /**
  282. * Does nothing, as this scroll strategy is a no-op.
  283. * @return {?}
  284. */
  285. NoopScrollStrategy.prototype.disable = /**
  286. * Does nothing, as this scroll strategy is a no-op.
  287. * @return {?}
  288. */
  289. function () { };
  290. /** Does nothing, as this scroll strategy is a no-op. */
  291. /**
  292. * Does nothing, as this scroll strategy is a no-op.
  293. * @return {?}
  294. */
  295. NoopScrollStrategy.prototype.attach = /**
  296. * Does nothing, as this scroll strategy is a no-op.
  297. * @return {?}
  298. */
  299. function () { };
  300. return NoopScrollStrategy;
  301. }());
  302. /**
  303. * @fileoverview added by tsickle
  304. * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
  305. */
  306. // TODO(jelbourn): move this to live with the rest of the scrolling code
  307. // TODO(jelbourn): someday replace this with IntersectionObservers
  308. /**
  309. * Gets whether an element is scrolled outside of view by any of its parent scrolling containers.
  310. * \@docs-private
  311. * @param {?} element Dimensions of the element (from getBoundingClientRect)
  312. * @param {?} scrollContainers Dimensions of element's scrolling containers (from getBoundingClientRect)
  313. * @return {?} Whether the element is scrolled out of view
  314. */
  315. function isElementScrolledOutsideView(element, scrollContainers) {
  316. return scrollContainers.some((/**
  317. * @param {?} containerBounds
  318. * @return {?}
  319. */
  320. function (containerBounds) {
  321. /** @type {?} */
  322. var outsideAbove = element.bottom < containerBounds.top;
  323. /** @type {?} */
  324. var outsideBelow = element.top > containerBounds.bottom;
  325. /** @type {?} */
  326. var outsideLeft = element.right < containerBounds.left;
  327. /** @type {?} */
  328. var outsideRight = element.left > containerBounds.right;
  329. return outsideAbove || outsideBelow || outsideLeft || outsideRight;
  330. }));
  331. }
  332. /**
  333. * Gets whether an element is clipped by any of its scrolling containers.
  334. * \@docs-private
  335. * @param {?} element Dimensions of the element (from getBoundingClientRect)
  336. * @param {?} scrollContainers Dimensions of element's scrolling containers (from getBoundingClientRect)
  337. * @return {?} Whether the element is clipped
  338. */
  339. function isElementClippedByScrolling(element, scrollContainers) {
  340. return scrollContainers.some((/**
  341. * @param {?} scrollContainerRect
  342. * @return {?}
  343. */
  344. function (scrollContainerRect) {
  345. /** @type {?} */
  346. var clippedAbove = element.top < scrollContainerRect.top;
  347. /** @type {?} */
  348. var clippedBelow = element.bottom > scrollContainerRect.bottom;
  349. /** @type {?} */
  350. var clippedLeft = element.left < scrollContainerRect.left;
  351. /** @type {?} */
  352. var clippedRight = element.right > scrollContainerRect.right;
  353. return clippedAbove || clippedBelow || clippedLeft || clippedRight;
  354. }));
  355. }
  356. /**
  357. * @fileoverview added by tsickle
  358. * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
  359. */
  360. /**
  361. * Strategy that will update the element position as the user is scrolling.
  362. */
  363. var /**
  364. * Strategy that will update the element position as the user is scrolling.
  365. */
  366. RepositionScrollStrategy = /** @class */ (function () {
  367. function RepositionScrollStrategy(_scrollDispatcher, _viewportRuler, _ngZone, _config) {
  368. this._scrollDispatcher = _scrollDispatcher;
  369. this._viewportRuler = _viewportRuler;
  370. this._ngZone = _ngZone;
  371. this._config = _config;
  372. this._scrollSubscription = null;
  373. }
  374. /** Attaches this scroll strategy to an overlay. */
  375. /**
  376. * Attaches this scroll strategy to an overlay.
  377. * @param {?} overlayRef
  378. * @return {?}
  379. */
  380. RepositionScrollStrategy.prototype.attach = /**
  381. * Attaches this scroll strategy to an overlay.
  382. * @param {?} overlayRef
  383. * @return {?}
  384. */
  385. function (overlayRef) {
  386. if (this._overlayRef) {
  387. throw getMatScrollStrategyAlreadyAttachedError();
  388. }
  389. this._overlayRef = overlayRef;
  390. };
  391. /** Enables repositioning of the attached overlay on scroll. */
  392. /**
  393. * Enables repositioning of the attached overlay on scroll.
  394. * @return {?}
  395. */
  396. RepositionScrollStrategy.prototype.enable = /**
  397. * Enables repositioning of the attached overlay on scroll.
  398. * @return {?}
  399. */
  400. function () {
  401. var _this = this;
  402. if (!this._scrollSubscription) {
  403. /** @type {?} */
  404. var throttle = this._config ? this._config.scrollThrottle : 0;
  405. this._scrollSubscription = this._scrollDispatcher.scrolled(throttle).subscribe((/**
  406. * @return {?}
  407. */
  408. function () {
  409. _this._overlayRef.updatePosition();
  410. // TODO(crisbeto): make `close` on by default once all components can handle it.
  411. if (_this._config && _this._config.autoClose) {
  412. /** @type {?} */
  413. var overlayRect = _this._overlayRef.overlayElement.getBoundingClientRect();
  414. var _a = _this._viewportRuler.getViewportSize(), width = _a.width, height = _a.height;
  415. // TODO(crisbeto): include all ancestor scroll containers here once
  416. // we have a way of exposing the trigger element to the scroll strategy.
  417. /** @type {?} */
  418. var parentRects = [{ width: width, height: height, bottom: height, right: width, top: 0, left: 0 }];
  419. if (isElementScrolledOutsideView(overlayRect, parentRects)) {
  420. _this.disable();
  421. _this._ngZone.run((/**
  422. * @return {?}
  423. */
  424. function () { return _this._overlayRef.detach(); }));
  425. }
  426. }
  427. }));
  428. }
  429. };
  430. /** Disables repositioning of the attached overlay on scroll. */
  431. /**
  432. * Disables repositioning of the attached overlay on scroll.
  433. * @return {?}
  434. */
  435. RepositionScrollStrategy.prototype.disable = /**
  436. * Disables repositioning of the attached overlay on scroll.
  437. * @return {?}
  438. */
  439. function () {
  440. if (this._scrollSubscription) {
  441. this._scrollSubscription.unsubscribe();
  442. this._scrollSubscription = null;
  443. }
  444. };
  445. /**
  446. * @return {?}
  447. */
  448. RepositionScrollStrategy.prototype.detach = /**
  449. * @return {?}
  450. */
  451. function () {
  452. this.disable();
  453. this._overlayRef = (/** @type {?} */ (null));
  454. };
  455. return RepositionScrollStrategy;
  456. }());
  457. /**
  458. * @fileoverview added by tsickle
  459. * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
  460. */
  461. /**
  462. * Options for how an overlay will handle scrolling.
  463. *
  464. * Users can provide a custom value for `ScrollStrategyOptions` to replace the default
  465. * behaviors. This class primarily acts as a factory for ScrollStrategy instances.
  466. */
  467. var ScrollStrategyOptions = /** @class */ (function () {
  468. function ScrollStrategyOptions(_scrollDispatcher, _viewportRuler, _ngZone, document) {
  469. var _this = this;
  470. this._scrollDispatcher = _scrollDispatcher;
  471. this._viewportRuler = _viewportRuler;
  472. this._ngZone = _ngZone;
  473. /**
  474. * Do nothing on scroll.
  475. */
  476. this.noop = (/**
  477. * @return {?}
  478. */
  479. function () { return new NoopScrollStrategy(); });
  480. /**
  481. * Close the overlay as soon as the user scrolls.
  482. * @param config Configuration to be used inside the scroll strategy.
  483. */
  484. this.close = (/**
  485. * @param {?=} config
  486. * @return {?}
  487. */
  488. function (config) { return new CloseScrollStrategy(_this._scrollDispatcher, _this._ngZone, _this._viewportRuler, config); });
  489. /**
  490. * Block scrolling.
  491. */
  492. this.block = (/**
  493. * @return {?}
  494. */
  495. function () { return new BlockScrollStrategy(_this._viewportRuler, _this._document); });
  496. /**
  497. * Update the overlay's position on scroll.
  498. * @param config Configuration to be used inside the scroll strategy.
  499. * Allows debouncing the reposition calls.
  500. */
  501. this.reposition = (/**
  502. * @param {?=} config
  503. * @return {?}
  504. */
  505. function (config) { return new RepositionScrollStrategy(_this._scrollDispatcher, _this._viewportRuler, _this._ngZone, config); });
  506. this._document = document;
  507. }
  508. ScrollStrategyOptions.decorators = [
  509. { type: Injectable, args: [{ providedIn: 'root' },] },
  510. ];
  511. /** @nocollapse */
  512. ScrollStrategyOptions.ctorParameters = function () { return [
  513. { type: ScrollDispatcher },
  514. { type: ViewportRuler },
  515. { type: NgZone },
  516. { type: undefined, decorators: [{ type: Inject, args: [DOCUMENT,] }] }
  517. ]; };
  518. /** @nocollapse */ ScrollStrategyOptions.ngInjectableDef = ɵɵdefineInjectable({ factory: function ScrollStrategyOptions_Factory() { return new ScrollStrategyOptions(ɵɵinject(ScrollDispatcher), ɵɵinject(ViewportRuler), ɵɵinject(NgZone), ɵɵinject(DOCUMENT)); }, token: ScrollStrategyOptions, providedIn: "root" });
  519. return ScrollStrategyOptions;
  520. }());
  521. /**
  522. * @fileoverview added by tsickle
  523. * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
  524. */
  525. /**
  526. * @fileoverview added by tsickle
  527. * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
  528. */
  529. /**
  530. * Initial configuration used when creating an overlay.
  531. */
  532. var /**
  533. * Initial configuration used when creating an overlay.
  534. */
  535. OverlayConfig = /** @class */ (function () {
  536. function OverlayConfig(config) {
  537. /**
  538. * Strategy to be used when handling scroll events while the overlay is open.
  539. */
  540. this.scrollStrategy = new NoopScrollStrategy();
  541. /**
  542. * Custom class to add to the overlay pane.
  543. */
  544. this.panelClass = '';
  545. /**
  546. * Whether the overlay has a backdrop.
  547. */
  548. this.hasBackdrop = false;
  549. /**
  550. * Custom class to add to the backdrop
  551. */
  552. this.backdropClass = 'cdk-overlay-dark-backdrop';
  553. /**
  554. * Whether the overlay should be disposed of when the user goes backwards/forwards in history.
  555. * Note that this usually doesn't include clicking on links (unless the user is using
  556. * the `HashLocationStrategy`).
  557. */
  558. this.disposeOnNavigation = false;
  559. if (config) {
  560. /** @type {?} */
  561. var configKeys = (/** @type {?} */ (Object.keys(config)));
  562. for (var _i = 0, configKeys_1 = configKeys; _i < configKeys_1.length; _i++) {
  563. var key = configKeys_1[_i];
  564. if (config[key] !== undefined) {
  565. // TypeScript, as of version 3.5, sees the left-hand-side of this expression
  566. // as "I don't know *which* key this is, so the only valid value is the intersection
  567. // of all the posible values." In this case, that happens to be `undefined`. TypeScript
  568. // is not smart enough to see that the right-hand-side is actually an access of the same
  569. // exact type with the same exact key, meaning that the value type must be identical.
  570. // So we use `any` to work around this.
  571. this[key] = (/** @type {?} */ (config[key]));
  572. }
  573. }
  574. }
  575. }
  576. return OverlayConfig;
  577. }());
  578. /**
  579. * @fileoverview added by tsickle
  580. * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
  581. */
  582. /**
  583. * The points of the origin element and the overlay element to connect.
  584. */
  585. var /**
  586. * The points of the origin element and the overlay element to connect.
  587. */
  588. ConnectionPositionPair = /** @class */ (function () {
  589. function ConnectionPositionPair(origin, overlay, offsetX, offsetY, panelClass) {
  590. this.offsetX = offsetX;
  591. this.offsetY = offsetY;
  592. this.panelClass = panelClass;
  593. this.originX = origin.originX;
  594. this.originY = origin.originY;
  595. this.overlayX = overlay.overlayX;
  596. this.overlayY = overlay.overlayY;
  597. }
  598. return ConnectionPositionPair;
  599. }());
  600. /**
  601. * Set of properties regarding the position of the origin and overlay relative to the viewport
  602. * with respect to the containing Scrollable elements.
  603. *
  604. * The overlay and origin are clipped if any part of their bounding client rectangle exceeds the
  605. * bounds of any one of the strategy's Scrollable's bounding client rectangle.
  606. *
  607. * The overlay and origin are outside view if there is no overlap between their bounding client
  608. * rectangle and any one of the strategy's Scrollable's bounding client rectangle.
  609. *
  610. * ----------- -----------
  611. * | outside | | clipped |
  612. * | view | --------------------------
  613. * | | | | | |
  614. * ---------- | ----------- |
  615. * -------------------------- | |
  616. * | | | Scrollable |
  617. * | | | |
  618. * | | --------------------------
  619. * | Scrollable |
  620. * | |
  621. * --------------------------
  622. *
  623. * \@docs-private
  624. */
  625. var /**
  626. * Set of properties regarding the position of the origin and overlay relative to the viewport
  627. * with respect to the containing Scrollable elements.
  628. *
  629. * The overlay and origin are clipped if any part of their bounding client rectangle exceeds the
  630. * bounds of any one of the strategy's Scrollable's bounding client rectangle.
  631. *
  632. * The overlay and origin are outside view if there is no overlap between their bounding client
  633. * rectangle and any one of the strategy's Scrollable's bounding client rectangle.
  634. *
  635. * ----------- -----------
  636. * | outside | | clipped |
  637. * | view | --------------------------
  638. * | | | | | |
  639. * ---------- | ----------- |
  640. * -------------------------- | |
  641. * | | | Scrollable |
  642. * | | | |
  643. * | | --------------------------
  644. * | Scrollable |
  645. * | |
  646. * --------------------------
  647. *
  648. * \@docs-private
  649. */
  650. ScrollingVisibility = /** @class */ (function () {
  651. function ScrollingVisibility() {
  652. }
  653. return ScrollingVisibility;
  654. }());
  655. /**
  656. * The change event emitted by the strategy when a fallback position is used.
  657. */
  658. var ConnectedOverlayPositionChange = /** @class */ (function () {
  659. function ConnectedOverlayPositionChange(connectionPair, scrollableViewProperties) {
  660. this.connectionPair = connectionPair;
  661. this.scrollableViewProperties = scrollableViewProperties;
  662. }
  663. /** @nocollapse */
  664. ConnectedOverlayPositionChange.ctorParameters = function () { return [
  665. { type: ConnectionPositionPair },
  666. { type: ScrollingVisibility, decorators: [{ type: Optional }] }
  667. ]; };
  668. return ConnectedOverlayPositionChange;
  669. }());
  670. /**
  671. * Validates whether a vertical position property matches the expected values.
  672. * \@docs-private
  673. * @param {?} property Name of the property being validated.
  674. * @param {?} value Value of the property being validated.
  675. * @return {?}
  676. */
  677. function validateVerticalPosition(property, value) {
  678. if (value !== 'top' && value !== 'bottom' && value !== 'center') {
  679. throw Error("ConnectedPosition: Invalid " + property + " \"" + value + "\". " +
  680. "Expected \"top\", \"bottom\" or \"center\".");
  681. }
  682. }
  683. /**
  684. * Validates whether a horizontal position property matches the expected values.
  685. * \@docs-private
  686. * @param {?} property Name of the property being validated.
  687. * @param {?} value Value of the property being validated.
  688. * @return {?}
  689. */
  690. function validateHorizontalPosition(property, value) {
  691. if (value !== 'start' && value !== 'end' && value !== 'center') {
  692. throw Error("ConnectedPosition: Invalid " + property + " \"" + value + "\". " +
  693. "Expected \"start\", \"end\" or \"center\".");
  694. }
  695. }
  696. /**
  697. * @fileoverview added by tsickle
  698. * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
  699. */
  700. /**
  701. * Service for dispatching keyboard events that land on the body to appropriate overlay ref,
  702. * if any. It maintains a list of attached overlays to determine best suited overlay based
  703. * on event target and order of overlay opens.
  704. */
  705. var OverlayKeyboardDispatcher = /** @class */ (function () {
  706. function OverlayKeyboardDispatcher(document) {
  707. var _this = this;
  708. /**
  709. * Currently attached overlays in the order they were attached.
  710. */
  711. this._attachedOverlays = [];
  712. /**
  713. * Keyboard event listener that will be attached to the body.
  714. */
  715. this._keydownListener = (/**
  716. * @param {?} event
  717. * @return {?}
  718. */
  719. function (event) {
  720. /** @type {?} */
  721. var overlays = _this._attachedOverlays;
  722. for (var i = overlays.length - 1; i > -1; i--) {
  723. // Dispatch the keydown event to the top overlay which has subscribers to its keydown events.
  724. // We want to target the most recent overlay, rather than trying to match where the event came
  725. // from, because some components might open an overlay, but keep focus on a trigger element
  726. // (e.g. for select and autocomplete). We skip overlays without keydown event subscriptions,
  727. // because we don't want overlays that don't handle keyboard events to block the ones below
  728. // them that do.
  729. if (overlays[i]._keydownEventSubscriptions > 0) {
  730. overlays[i]._keydownEvents.next(event);
  731. break;
  732. }
  733. }
  734. });
  735. this._document = document;
  736. }
  737. /**
  738. * @return {?}
  739. */
  740. OverlayKeyboardDispatcher.prototype.ngOnDestroy = /**
  741. * @return {?}
  742. */
  743. function () {
  744. this._detach();
  745. };
  746. /** Add a new overlay to the list of attached overlay refs. */
  747. /**
  748. * Add a new overlay to the list of attached overlay refs.
  749. * @param {?} overlayRef
  750. * @return {?}
  751. */
  752. OverlayKeyboardDispatcher.prototype.add = /**
  753. * Add a new overlay to the list of attached overlay refs.
  754. * @param {?} overlayRef
  755. * @return {?}
  756. */
  757. function (overlayRef) {
  758. // Ensure that we don't get the same overlay multiple times.
  759. this.remove(overlayRef);
  760. // Lazily start dispatcher once first overlay is added
  761. if (!this._isAttached) {
  762. this._document.body.addEventListener('keydown', this._keydownListener);
  763. this._isAttached = true;
  764. }
  765. this._attachedOverlays.push(overlayRef);
  766. };
  767. /** Remove an overlay from the list of attached overlay refs. */
  768. /**
  769. * Remove an overlay from the list of attached overlay refs.
  770. * @param {?} overlayRef
  771. * @return {?}
  772. */
  773. OverlayKeyboardDispatcher.prototype.remove = /**
  774. * Remove an overlay from the list of attached overlay refs.
  775. * @param {?} overlayRef
  776. * @return {?}
  777. */
  778. function (overlayRef) {
  779. /** @type {?} */
  780. var index = this._attachedOverlays.indexOf(overlayRef);
  781. if (index > -1) {
  782. this._attachedOverlays.splice(index, 1);
  783. }
  784. // Remove the global listener once there are no more overlays.
  785. if (this._attachedOverlays.length === 0) {
  786. this._detach();
  787. }
  788. };
  789. /** Detaches the global keyboard event listener. */
  790. /**
  791. * Detaches the global keyboard event listener.
  792. * @private
  793. * @return {?}
  794. */
  795. OverlayKeyboardDispatcher.prototype._detach = /**
  796. * Detaches the global keyboard event listener.
  797. * @private
  798. * @return {?}
  799. */
  800. function () {
  801. if (this._isAttached) {
  802. this._document.body.removeEventListener('keydown', this._keydownListener);
  803. this._isAttached = false;
  804. }
  805. };
  806. OverlayKeyboardDispatcher.decorators = [
  807. { type: Injectable, args: [{ providedIn: 'root' },] },
  808. ];
  809. /** @nocollapse */
  810. OverlayKeyboardDispatcher.ctorParameters = function () { return [
  811. { type: undefined, decorators: [{ type: Inject, args: [DOCUMENT,] }] }
  812. ]; };
  813. /** @nocollapse */ OverlayKeyboardDispatcher.ngInjectableDef = ɵɵdefineInjectable({ factory: function OverlayKeyboardDispatcher_Factory() { return new OverlayKeyboardDispatcher(ɵɵinject(DOCUMENT)); }, token: OverlayKeyboardDispatcher, providedIn: "root" });
  814. return OverlayKeyboardDispatcher;
  815. }());
  816. /**
  817. * \@docs-private \@deprecated \@breaking-change 8.0.0
  818. * @param {?} dispatcher
  819. * @param {?} _document
  820. * @return {?}
  821. */
  822. function OVERLAY_KEYBOARD_DISPATCHER_PROVIDER_FACTORY(dispatcher, _document) {
  823. return dispatcher || new OverlayKeyboardDispatcher(_document);
  824. }
  825. /**
  826. * \@docs-private \@deprecated \@breaking-change 8.0.0
  827. * @type {?}
  828. */
  829. var OVERLAY_KEYBOARD_DISPATCHER_PROVIDER = {
  830. // If there is already an OverlayKeyboardDispatcher available, use that.
  831. // Otherwise, provide a new one.
  832. provide: OverlayKeyboardDispatcher,
  833. deps: [
  834. [new Optional(), new SkipSelf(), OverlayKeyboardDispatcher],
  835. (/** @type {?} */ (
  836. // Coerce to `InjectionToken` so that the `deps` match the "shape"
  837. // of the type expected by Angular
  838. DOCUMENT))
  839. ],
  840. useFactory: OVERLAY_KEYBOARD_DISPATCHER_PROVIDER_FACTORY
  841. };
  842. /**
  843. * @fileoverview added by tsickle
  844. * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
  845. */
  846. /**
  847. * Container inside which all overlays will render.
  848. */
  849. var OverlayContainer = /** @class */ (function () {
  850. function OverlayContainer(document) {
  851. this._document = document;
  852. }
  853. /**
  854. * @return {?}
  855. */
  856. OverlayContainer.prototype.ngOnDestroy = /**
  857. * @return {?}
  858. */
  859. function () {
  860. if (this._containerElement && this._containerElement.parentNode) {
  861. this._containerElement.parentNode.removeChild(this._containerElement);
  862. }
  863. };
  864. /**
  865. * This method returns the overlay container element. It will lazily
  866. * create the element the first time it is called to facilitate using
  867. * the container in non-browser environments.
  868. * @returns the container element
  869. */
  870. /**
  871. * This method returns the overlay container element. It will lazily
  872. * create the element the first time it is called to facilitate using
  873. * the container in non-browser environments.
  874. * @return {?} the container element
  875. */
  876. OverlayContainer.prototype.getContainerElement = /**
  877. * This method returns the overlay container element. It will lazily
  878. * create the element the first time it is called to facilitate using
  879. * the container in non-browser environments.
  880. * @return {?} the container element
  881. */
  882. function () {
  883. if (!this._containerElement) {
  884. this._createContainer();
  885. }
  886. return this._containerElement;
  887. };
  888. /**
  889. * Create the overlay container element, which is simply a div
  890. * with the 'cdk-overlay-container' class on the document body.
  891. */
  892. /**
  893. * Create the overlay container element, which is simply a div
  894. * with the 'cdk-overlay-container' class on the document body.
  895. * @protected
  896. * @return {?}
  897. */
  898. OverlayContainer.prototype._createContainer = /**
  899. * Create the overlay container element, which is simply a div
  900. * with the 'cdk-overlay-container' class on the document body.
  901. * @protected
  902. * @return {?}
  903. */
  904. function () {
  905. /** @type {?} */
  906. var containerClass = 'cdk-overlay-container';
  907. /** @type {?} */
  908. var previousContainers = this._document.getElementsByClassName(containerClass);
  909. // Remove any old containers. This can happen when transitioning from the server to the client.
  910. for (var i = 0; i < previousContainers.length; i++) {
  911. (/** @type {?} */ (previousContainers[i].parentNode)).removeChild(previousContainers[i]);
  912. }
  913. /** @type {?} */
  914. var container = this._document.createElement('div');
  915. container.classList.add(containerClass);
  916. this._document.body.appendChild(container);
  917. this._containerElement = container;
  918. };
  919. OverlayContainer.decorators = [
  920. { type: Injectable, args: [{ providedIn: 'root' },] },
  921. ];
  922. /** @nocollapse */
  923. OverlayContainer.ctorParameters = function () { return [
  924. { type: undefined, decorators: [{ type: Inject, args: [DOCUMENT,] }] }
  925. ]; };
  926. /** @nocollapse */ OverlayContainer.ngInjectableDef = ɵɵdefineInjectable({ factory: function OverlayContainer_Factory() { return new OverlayContainer(ɵɵinject(DOCUMENT)); }, token: OverlayContainer, providedIn: "root" });
  927. return OverlayContainer;
  928. }());
  929. /**
  930. * \@docs-private \@deprecated \@breaking-change 8.0.0
  931. * @param {?} parentContainer
  932. * @param {?} _document
  933. * @return {?}
  934. */
  935. function OVERLAY_CONTAINER_PROVIDER_FACTORY(parentContainer, _document) {
  936. return parentContainer || new OverlayContainer(_document);
  937. }
  938. /**
  939. * \@docs-private \@deprecated \@breaking-change 8.0.0
  940. * @type {?}
  941. */
  942. var OVERLAY_CONTAINER_PROVIDER = {
  943. // If there is already an OverlayContainer available, use that. Otherwise, provide a new one.
  944. provide: OverlayContainer,
  945. deps: [
  946. [new Optional(), new SkipSelf(), OverlayContainer],
  947. (/** @type {?} */ (DOCUMENT))
  948. ],
  949. useFactory: OVERLAY_CONTAINER_PROVIDER_FACTORY
  950. };
  951. /**
  952. * @fileoverview added by tsickle
  953. * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
  954. */
  955. /**
  956. * Reference to an overlay that has been created with the Overlay service.
  957. * Used to manipulate or dispose of said overlay.
  958. */
  959. var /**
  960. * Reference to an overlay that has been created with the Overlay service.
  961. * Used to manipulate or dispose of said overlay.
  962. */
  963. OverlayRef = /** @class */ (function () {
  964. function OverlayRef(_portalOutlet, _host, _pane, _config, _ngZone, _keyboardDispatcher, _document, _location) {
  965. var _this = this;
  966. this._portalOutlet = _portalOutlet;
  967. this._host = _host;
  968. this._pane = _pane;
  969. this._config = _config;
  970. this._ngZone = _ngZone;
  971. this._keyboardDispatcher = _keyboardDispatcher;
  972. this._document = _document;
  973. this._location = _location;
  974. this._backdropElement = null;
  975. this._backdropClick = new Subject();
  976. this._attachments = new Subject();
  977. this._detachments = new Subject();
  978. this._locationChanges = Subscription.EMPTY;
  979. this._backdropClickHandler = (/**
  980. * @param {?} event
  981. * @return {?}
  982. */
  983. function (event) { return _this._backdropClick.next(event); });
  984. this._keydownEventsObservable = new Observable((/**
  985. * @param {?} observer
  986. * @return {?}
  987. */
  988. function (observer) {
  989. /** @type {?} */
  990. var subscription = _this._keydownEvents.subscribe(observer);
  991. _this._keydownEventSubscriptions++;
  992. return (/**
  993. * @return {?}
  994. */
  995. function () {
  996. subscription.unsubscribe();
  997. _this._keydownEventSubscriptions--;
  998. });
  999. }));
  1000. /**
  1001. * Stream of keydown events dispatched to this overlay.
  1002. */
  1003. this._keydownEvents = new Subject();
  1004. /**
  1005. * Amount of subscriptions to the keydown events.
  1006. */
  1007. this._keydownEventSubscriptions = 0;
  1008. if (_config.scrollStrategy) {
  1009. this._scrollStrategy = _config.scrollStrategy;
  1010. this._scrollStrategy.attach(this);
  1011. }
  1012. this._positionStrategy = _config.positionStrategy;
  1013. }
  1014. Object.defineProperty(OverlayRef.prototype, "overlayElement", {
  1015. /** The overlay's HTML element */
  1016. get: /**
  1017. * The overlay's HTML element
  1018. * @return {?}
  1019. */
  1020. function () {
  1021. return this._pane;
  1022. },
  1023. enumerable: true,
  1024. configurable: true
  1025. });
  1026. Object.defineProperty(OverlayRef.prototype, "backdropElement", {
  1027. /** The overlay's backdrop HTML element. */
  1028. get: /**
  1029. * The overlay's backdrop HTML element.
  1030. * @return {?}
  1031. */
  1032. function () {
  1033. return this._backdropElement;
  1034. },
  1035. enumerable: true,
  1036. configurable: true
  1037. });
  1038. Object.defineProperty(OverlayRef.prototype, "hostElement", {
  1039. /**
  1040. * Wrapper around the panel element. Can be used for advanced
  1041. * positioning where a wrapper with specific styling is
  1042. * required around the overlay pane.
  1043. */
  1044. get: /**
  1045. * Wrapper around the panel element. Can be used for advanced
  1046. * positioning where a wrapper with specific styling is
  1047. * required around the overlay pane.
  1048. * @return {?}
  1049. */
  1050. function () {
  1051. return this._host;
  1052. },
  1053. enumerable: true,
  1054. configurable: true
  1055. });
  1056. /**
  1057. * Attaches content, given via a Portal, to the overlay.
  1058. * If the overlay is configured to have a backdrop, it will be created.
  1059. *
  1060. * @param portal Portal instance to which to attach the overlay.
  1061. * @returns The portal attachment result.
  1062. */
  1063. /**
  1064. * Attaches content, given via a Portal, to the overlay.
  1065. * If the overlay is configured to have a backdrop, it will be created.
  1066. *
  1067. * @param {?} portal Portal instance to which to attach the overlay.
  1068. * @return {?} The portal attachment result.
  1069. */
  1070. OverlayRef.prototype.attach = /**
  1071. * Attaches content, given via a Portal, to the overlay.
  1072. * If the overlay is configured to have a backdrop, it will be created.
  1073. *
  1074. * @param {?} portal Portal instance to which to attach the overlay.
  1075. * @return {?} The portal attachment result.
  1076. */
  1077. function (portal) {
  1078. var _this = this;
  1079. /** @type {?} */
  1080. var attachResult = this._portalOutlet.attach(portal);
  1081. if (this._positionStrategy) {
  1082. this._positionStrategy.attach(this);
  1083. }
  1084. // Update the pane element with the given configuration.
  1085. if (!this._host.parentElement && this._previousHostParent) {
  1086. this._previousHostParent.appendChild(this._host);
  1087. }
  1088. this._updateStackingOrder();
  1089. this._updateElementSize();
  1090. this._updateElementDirection();
  1091. if (this._scrollStrategy) {
  1092. this._scrollStrategy.enable();
  1093. }
  1094. // Update the position once the zone is stable so that the overlay will be fully rendered
  1095. // before attempting to position it, as the position may depend on the size of the rendered
  1096. // content.
  1097. this._ngZone.onStable
  1098. .asObservable()
  1099. .pipe(take(1))
  1100. .subscribe((/**
  1101. * @return {?}
  1102. */
  1103. function () {
  1104. // The overlay could've been detached before the zone has stabilized.
  1105. if (_this.hasAttached()) {
  1106. _this.updatePosition();
  1107. }
  1108. }));
  1109. // Enable pointer events for the overlay pane element.
  1110. this._togglePointerEvents(true);
  1111. if (this._config.hasBackdrop) {
  1112. this._attachBackdrop();
  1113. }
  1114. if (this._config.panelClass) {
  1115. this._toggleClasses(this._pane, this._config.panelClass, true);
  1116. }
  1117. // Only emit the `attachments` event once all other setup is done.
  1118. this._attachments.next();
  1119. // Track this overlay by the keyboard dispatcher
  1120. this._keyboardDispatcher.add(this);
  1121. // @breaking-change 8.0.0 remove the null check for `_location`
  1122. // once the constructor parameter is made required.
  1123. if (this._config.disposeOnNavigation && this._location) {
  1124. this._locationChanges = this._location.subscribe((/**
  1125. * @return {?}
  1126. */
  1127. function () { return _this.dispose(); }));
  1128. }
  1129. return attachResult;
  1130. };
  1131. /**
  1132. * Detaches an overlay from a portal.
  1133. * @returns The portal detachment result.
  1134. */
  1135. /**
  1136. * Detaches an overlay from a portal.
  1137. * @return {?} The portal detachment result.
  1138. */
  1139. OverlayRef.prototype.detach = /**
  1140. * Detaches an overlay from a portal.
  1141. * @return {?} The portal detachment result.
  1142. */
  1143. function () {
  1144. if (!this.hasAttached()) {
  1145. return;
  1146. }
  1147. this.detachBackdrop();
  1148. // When the overlay is detached, the pane element should disable pointer events.
  1149. // This is necessary because otherwise the pane element will cover the page and disable
  1150. // pointer events therefore. Depends on the position strategy and the applied pane boundaries.
  1151. this._togglePointerEvents(false);
  1152. if (this._positionStrategy && this._positionStrategy.detach) {
  1153. this._positionStrategy.detach();
  1154. }
  1155. if (this._scrollStrategy) {
  1156. this._scrollStrategy.disable();
  1157. }
  1158. /** @type {?} */
  1159. var detachmentResult = this._portalOutlet.detach();
  1160. // Only emit after everything is detached.
  1161. this._detachments.next();
  1162. // Remove this overlay from keyboard dispatcher tracking.
  1163. this._keyboardDispatcher.remove(this);
  1164. // Keeping the host element in DOM the can cause scroll jank, because it still gets
  1165. // rendered, even though it's transparent and unclickable which is why we remove it.
  1166. this._detachContentWhenStable();
  1167. // Stop listening for location changes.
  1168. this._locationChanges.unsubscribe();
  1169. return detachmentResult;
  1170. };
  1171. /** Cleans up the overlay from the DOM. */
  1172. /**
  1173. * Cleans up the overlay from the DOM.
  1174. * @return {?}
  1175. */
  1176. OverlayRef.prototype.dispose = /**
  1177. * Cleans up the overlay from the DOM.
  1178. * @return {?}
  1179. */
  1180. function () {
  1181. /** @type {?} */
  1182. var isAttached = this.hasAttached();
  1183. if (this._positionStrategy) {
  1184. this._positionStrategy.dispose();
  1185. }
  1186. this._disposeScrollStrategy();
  1187. this.detachBackdrop();
  1188. this._locationChanges.unsubscribe();
  1189. this._keyboardDispatcher.remove(this);
  1190. this._portalOutlet.dispose();
  1191. this._attachments.complete();
  1192. this._backdropClick.complete();
  1193. this._keydownEvents.complete();
  1194. if (this._host && this._host.parentNode) {
  1195. this._host.parentNode.removeChild(this._host);
  1196. this._host = (/** @type {?} */ (null));
  1197. }
  1198. this._previousHostParent = this._pane = (/** @type {?} */ (null));
  1199. if (isAttached) {
  1200. this._detachments.next();
  1201. }
  1202. this._detachments.complete();
  1203. };
  1204. /** Whether the overlay has attached content. */
  1205. /**
  1206. * Whether the overlay has attached content.
  1207. * @return {?}
  1208. */
  1209. OverlayRef.prototype.hasAttached = /**
  1210. * Whether the overlay has attached content.
  1211. * @return {?}
  1212. */
  1213. function () {
  1214. return this._portalOutlet.hasAttached();
  1215. };
  1216. /** Gets an observable that emits when the backdrop has been clicked. */
  1217. /**
  1218. * Gets an observable that emits when the backdrop has been clicked.
  1219. * @return {?}
  1220. */
  1221. OverlayRef.prototype.backdropClick = /**
  1222. * Gets an observable that emits when the backdrop has been clicked.
  1223. * @return {?}
  1224. */
  1225. function () {
  1226. return this._backdropClick.asObservable();
  1227. };
  1228. /** Gets an observable that emits when the overlay has been attached. */
  1229. /**
  1230. * Gets an observable that emits when the overlay has been attached.
  1231. * @return {?}
  1232. */
  1233. OverlayRef.prototype.attachments = /**
  1234. * Gets an observable that emits when the overlay has been attached.
  1235. * @return {?}
  1236. */
  1237. function () {
  1238. return this._attachments.asObservable();
  1239. };
  1240. /** Gets an observable that emits when the overlay has been detached. */
  1241. /**
  1242. * Gets an observable that emits when the overlay has been detached.
  1243. * @return {?}
  1244. */
  1245. OverlayRef.prototype.detachments = /**
  1246. * Gets an observable that emits when the overlay has been detached.
  1247. * @return {?}
  1248. */
  1249. function () {
  1250. return this._detachments.asObservable();
  1251. };
  1252. /** Gets an observable of keydown events targeted to this overlay. */
  1253. /**
  1254. * Gets an observable of keydown events targeted to this overlay.
  1255. * @return {?}
  1256. */
  1257. OverlayRef.prototype.keydownEvents = /**
  1258. * Gets an observable of keydown events targeted to this overlay.
  1259. * @return {?}
  1260. */
  1261. function () {
  1262. return this._keydownEventsObservable;
  1263. };
  1264. /** Gets the current overlay configuration, which is immutable. */
  1265. /**
  1266. * Gets the current overlay configuration, which is immutable.
  1267. * @return {?}
  1268. */
  1269. OverlayRef.prototype.getConfig = /**
  1270. * Gets the current overlay configuration, which is immutable.
  1271. * @return {?}
  1272. */
  1273. function () {
  1274. return this._config;
  1275. };
  1276. /** Updates the position of the overlay based on the position strategy. */
  1277. /**
  1278. * Updates the position of the overlay based on the position strategy.
  1279. * @return {?}
  1280. */
  1281. OverlayRef.prototype.updatePosition = /**
  1282. * Updates the position of the overlay based on the position strategy.
  1283. * @return {?}
  1284. */
  1285. function () {
  1286. if (this._positionStrategy) {
  1287. this._positionStrategy.apply();
  1288. }
  1289. };
  1290. /** Switches to a new position strategy and updates the overlay position. */
  1291. /**
  1292. * Switches to a new position strategy and updates the overlay position.
  1293. * @param {?} strategy
  1294. * @return {?}
  1295. */
  1296. OverlayRef.prototype.updatePositionStrategy = /**
  1297. * Switches to a new position strategy and updates the overlay position.
  1298. * @param {?} strategy
  1299. * @return {?}
  1300. */
  1301. function (strategy) {
  1302. if (strategy === this._positionStrategy) {
  1303. return;
  1304. }
  1305. if (this._positionStrategy) {
  1306. this._positionStrategy.dispose();
  1307. }
  1308. this._positionStrategy = strategy;
  1309. if (this.hasAttached()) {
  1310. strategy.attach(this);
  1311. this.updatePosition();
  1312. }
  1313. };
  1314. /** Update the size properties of the overlay. */
  1315. /**
  1316. * Update the size properties of the overlay.
  1317. * @param {?} sizeConfig
  1318. * @return {?}
  1319. */
  1320. OverlayRef.prototype.updateSize = /**
  1321. * Update the size properties of the overlay.
  1322. * @param {?} sizeConfig
  1323. * @return {?}
  1324. */
  1325. function (sizeConfig) {
  1326. this._config = __assign({}, this._config, sizeConfig);
  1327. this._updateElementSize();
  1328. };
  1329. /** Sets the LTR/RTL direction for the overlay. */
  1330. /**
  1331. * Sets the LTR/RTL direction for the overlay.
  1332. * @param {?} dir
  1333. * @return {?}
  1334. */
  1335. OverlayRef.prototype.setDirection = /**
  1336. * Sets the LTR/RTL direction for the overlay.
  1337. * @param {?} dir
  1338. * @return {?}
  1339. */
  1340. function (dir) {
  1341. this._config = __assign({}, this._config, { direction: dir });
  1342. this._updateElementDirection();
  1343. };
  1344. /** Add a CSS class or an array of classes to the overlay pane. */
  1345. /**
  1346. * Add a CSS class or an array of classes to the overlay pane.
  1347. * @param {?} classes
  1348. * @return {?}
  1349. */
  1350. OverlayRef.prototype.addPanelClass = /**
  1351. * Add a CSS class or an array of classes to the overlay pane.
  1352. * @param {?} classes
  1353. * @return {?}
  1354. */
  1355. function (classes) {
  1356. if (this._pane) {
  1357. this._toggleClasses(this._pane, classes, true);
  1358. }
  1359. };
  1360. /** Remove a CSS class or an array of classes from the overlay pane. */
  1361. /**
  1362. * Remove a CSS class or an array of classes from the overlay pane.
  1363. * @param {?} classes
  1364. * @return {?}
  1365. */
  1366. OverlayRef.prototype.removePanelClass = /**
  1367. * Remove a CSS class or an array of classes from the overlay pane.
  1368. * @param {?} classes
  1369. * @return {?}
  1370. */
  1371. function (classes) {
  1372. if (this._pane) {
  1373. this._toggleClasses(this._pane, classes, false);
  1374. }
  1375. };
  1376. /**
  1377. * Returns the layout direction of the overlay panel.
  1378. */
  1379. /**
  1380. * Returns the layout direction of the overlay panel.
  1381. * @return {?}
  1382. */
  1383. OverlayRef.prototype.getDirection = /**
  1384. * Returns the layout direction of the overlay panel.
  1385. * @return {?}
  1386. */
  1387. function () {
  1388. /** @type {?} */
  1389. var direction = this._config.direction;
  1390. if (!direction) {
  1391. return 'ltr';
  1392. }
  1393. return typeof direction === 'string' ? direction : direction.value;
  1394. };
  1395. /** Switches to a new scroll strategy. */
  1396. /**
  1397. * Switches to a new scroll strategy.
  1398. * @param {?} strategy
  1399. * @return {?}
  1400. */
  1401. OverlayRef.prototype.updateScrollStrategy = /**
  1402. * Switches to a new scroll strategy.
  1403. * @param {?} strategy
  1404. * @return {?}
  1405. */
  1406. function (strategy) {
  1407. if (strategy === this._scrollStrategy) {
  1408. return;
  1409. }
  1410. this._disposeScrollStrategy();
  1411. this._scrollStrategy = strategy;
  1412. if (this.hasAttached()) {
  1413. strategy.attach(this);
  1414. strategy.enable();
  1415. }
  1416. };
  1417. /** Updates the text direction of the overlay panel. */
  1418. /**
  1419. * Updates the text direction of the overlay panel.
  1420. * @private
  1421. * @return {?}
  1422. */
  1423. OverlayRef.prototype._updateElementDirection = /**
  1424. * Updates the text direction of the overlay panel.
  1425. * @private
  1426. * @return {?}
  1427. */
  1428. function () {
  1429. this._host.setAttribute('dir', this.getDirection());
  1430. };
  1431. /** Updates the size of the overlay element based on the overlay config. */
  1432. /**
  1433. * Updates the size of the overlay element based on the overlay config.
  1434. * @private
  1435. * @return {?}
  1436. */
  1437. OverlayRef.prototype._updateElementSize = /**
  1438. * Updates the size of the overlay element based on the overlay config.
  1439. * @private
  1440. * @return {?}
  1441. */
  1442. function () {
  1443. if (!this._pane) {
  1444. return;
  1445. }
  1446. /** @type {?} */
  1447. var style = this._pane.style;
  1448. style.width = coerceCssPixelValue(this._config.width);
  1449. style.height = coerceCssPixelValue(this._config.height);
  1450. style.minWidth = coerceCssPixelValue(this._config.minWidth);
  1451. style.minHeight = coerceCssPixelValue(this._config.minHeight);
  1452. style.maxWidth = coerceCssPixelValue(this._config.maxWidth);
  1453. style.maxHeight = coerceCssPixelValue(this._config.maxHeight);
  1454. };
  1455. /** Toggles the pointer events for the overlay pane element. */
  1456. /**
  1457. * Toggles the pointer events for the overlay pane element.
  1458. * @private
  1459. * @param {?} enablePointer
  1460. * @return {?}
  1461. */
  1462. OverlayRef.prototype._togglePointerEvents = /**
  1463. * Toggles the pointer events for the overlay pane element.
  1464. * @private
  1465. * @param {?} enablePointer
  1466. * @return {?}
  1467. */
  1468. function (enablePointer) {
  1469. this._pane.style.pointerEvents = enablePointer ? 'auto' : 'none';
  1470. };
  1471. /** Attaches a backdrop for this overlay. */
  1472. /**
  1473. * Attaches a backdrop for this overlay.
  1474. * @private
  1475. * @return {?}
  1476. */
  1477. OverlayRef.prototype._attachBackdrop = /**
  1478. * Attaches a backdrop for this overlay.
  1479. * @private
  1480. * @return {?}
  1481. */
  1482. function () {
  1483. var _this = this;
  1484. /** @type {?} */
  1485. var showingClass = 'cdk-overlay-backdrop-showing';
  1486. this._backdropElement = this._document.createElement('div');
  1487. this._backdropElement.classList.add('cdk-overlay-backdrop');
  1488. if (this._config.backdropClass) {
  1489. this._toggleClasses(this._backdropElement, this._config.backdropClass, true);
  1490. }
  1491. // Insert the backdrop before the pane in the DOM order,
  1492. // in order to handle stacked overlays properly.
  1493. (/** @type {?} */ (this._host.parentElement)).insertBefore(this._backdropElement, this._host);
  1494. // Forward backdrop clicks such that the consumer of the overlay can perform whatever
  1495. // action desired when such a click occurs (usually closing the overlay).
  1496. this._backdropElement.addEventListener('click', this._backdropClickHandler);
  1497. // Add class to fade-in the backdrop after one frame.
  1498. if (typeof requestAnimationFrame !== 'undefined') {
  1499. this._ngZone.runOutsideAngular((/**
  1500. * @return {?}
  1501. */
  1502. function () {
  1503. requestAnimationFrame((/**
  1504. * @return {?}
  1505. */
  1506. function () {
  1507. if (_this._backdropElement) {
  1508. _this._backdropElement.classList.add(showingClass);
  1509. }
  1510. }));
  1511. }));
  1512. }
  1513. else {
  1514. this._backdropElement.classList.add(showingClass);
  1515. }
  1516. };
  1517. /**
  1518. * Updates the stacking order of the element, moving it to the top if necessary.
  1519. * This is required in cases where one overlay was detached, while another one,
  1520. * that should be behind it, was destroyed. The next time both of them are opened,
  1521. * the stacking will be wrong, because the detached element's pane will still be
  1522. * in its original DOM position.
  1523. */
  1524. /**
  1525. * Updates the stacking order of the element, moving it to the top if necessary.
  1526. * This is required in cases where one overlay was detached, while another one,
  1527. * that should be behind it, was destroyed. The next time both of them are opened,
  1528. * the stacking will be wrong, because the detached element's pane will still be
  1529. * in its original DOM position.
  1530. * @private
  1531. * @return {?}
  1532. */
  1533. OverlayRef.prototype._updateStackingOrder = /**
  1534. * Updates the stacking order of the element, moving it to the top if necessary.
  1535. * This is required in cases where one overlay was detached, while another one,
  1536. * that should be behind it, was destroyed. The next time both of them are opened,
  1537. * the stacking will be wrong, because the detached element's pane will still be
  1538. * in its original DOM position.
  1539. * @private
  1540. * @return {?}
  1541. */
  1542. function () {
  1543. if (this._host.nextSibling) {
  1544. (/** @type {?} */ (this._host.parentNode)).appendChild(this._host);
  1545. }
  1546. };
  1547. /** Detaches the backdrop (if any) associated with the overlay. */
  1548. /**
  1549. * Detaches the backdrop (if any) associated with the overlay.
  1550. * @return {?}
  1551. */
  1552. OverlayRef.prototype.detachBackdrop = /**
  1553. * Detaches the backdrop (if any) associated with the overlay.
  1554. * @return {?}
  1555. */
  1556. function () {
  1557. var _this = this;
  1558. /** @type {?} */
  1559. var backdropToDetach = this._backdropElement;
  1560. if (!backdropToDetach) {
  1561. return;
  1562. }
  1563. /** @type {?} */
  1564. var timeoutId;
  1565. /** @type {?} */
  1566. var finishDetach = (/**
  1567. * @return {?}
  1568. */
  1569. function () {
  1570. // It may not be attached to anything in certain cases (e.g. unit tests).
  1571. if (backdropToDetach) {
  1572. backdropToDetach.removeEventListener('click', _this._backdropClickHandler);
  1573. backdropToDetach.removeEventListener('transitionend', finishDetach);
  1574. if (backdropToDetach.parentNode) {
  1575. backdropToDetach.parentNode.removeChild(backdropToDetach);
  1576. }
  1577. }
  1578. // It is possible that a new portal has been attached to this overlay since we started
  1579. // removing the backdrop. If that is the case, only clear the backdrop reference if it
  1580. // is still the same instance that we started to remove.
  1581. if (_this._backdropElement == backdropToDetach) {
  1582. _this._backdropElement = null;
  1583. }
  1584. if (_this._config.backdropClass) {
  1585. _this._toggleClasses((/** @type {?} */ (backdropToDetach)), _this._config.backdropClass, false);
  1586. }
  1587. clearTimeout(timeoutId);
  1588. });
  1589. backdropToDetach.classList.remove('cdk-overlay-backdrop-showing');
  1590. this._ngZone.runOutsideAngular((/**
  1591. * @return {?}
  1592. */
  1593. function () {
  1594. (/** @type {?} */ (backdropToDetach)).addEventListener('transitionend', finishDetach);
  1595. }));
  1596. // If the backdrop doesn't have a transition, the `transitionend` event won't fire.
  1597. // In this case we make it unclickable and we try to remove it after a delay.
  1598. backdropToDetach.style.pointerEvents = 'none';
  1599. // Run this outside the Angular zone because there's nothing that Angular cares about.
  1600. // If it were to run inside the Angular zone, every test that used Overlay would have to be
  1601. // either async or fakeAsync.
  1602. timeoutId = this._ngZone.runOutsideAngular((/**
  1603. * @return {?}
  1604. */
  1605. function () { return setTimeout(finishDetach, 500); }));
  1606. };
  1607. /** Toggles a single CSS class or an array of classes on an element. */
  1608. /**
  1609. * Toggles a single CSS class or an array of classes on an element.
  1610. * @private
  1611. * @param {?} element
  1612. * @param {?} cssClasses
  1613. * @param {?} isAdd
  1614. * @return {?}
  1615. */
  1616. OverlayRef.prototype._toggleClasses = /**
  1617. * Toggles a single CSS class or an array of classes on an element.
  1618. * @private
  1619. * @param {?} element
  1620. * @param {?} cssClasses
  1621. * @param {?} isAdd
  1622. * @return {?}
  1623. */
  1624. function (element, cssClasses, isAdd) {
  1625. /** @type {?} */
  1626. var classList = element.classList;
  1627. coerceArray(cssClasses).forEach((/**
  1628. * @param {?} cssClass
  1629. * @return {?}
  1630. */
  1631. function (cssClass) {
  1632. // We can't do a spread here, because IE doesn't support setting multiple classes.
  1633. // Also trying to add an empty string to a DOMTokenList will throw.
  1634. if (cssClass) {
  1635. isAdd ? classList.add(cssClass) : classList.remove(cssClass);
  1636. }
  1637. }));
  1638. };
  1639. /** Detaches the overlay content next time the zone stabilizes. */
  1640. /**
  1641. * Detaches the overlay content next time the zone stabilizes.
  1642. * @private
  1643. * @return {?}
  1644. */
  1645. OverlayRef.prototype._detachContentWhenStable = /**
  1646. * Detaches the overlay content next time the zone stabilizes.
  1647. * @private
  1648. * @return {?}
  1649. */
  1650. function () {
  1651. var _this = this;
  1652. // Normally we wouldn't have to explicitly run this outside the `NgZone`, however
  1653. // if the consumer is using `zone-patch-rxjs`, the `Subscription.unsubscribe` call will
  1654. // be patched to run inside the zone, which will throw us into an infinite loop.
  1655. this._ngZone.runOutsideAngular((/**
  1656. * @return {?}
  1657. */
  1658. function () {
  1659. // We can't remove the host here immediately, because the overlay pane's content
  1660. // might still be animating. This stream helps us avoid interrupting the animation
  1661. // by waiting for the pane to become empty.
  1662. /** @type {?} */
  1663. var subscription = _this._ngZone.onStable
  1664. .asObservable()
  1665. .pipe(takeUntil(merge(_this._attachments, _this._detachments)))
  1666. .subscribe((/**
  1667. * @return {?}
  1668. */
  1669. function () {
  1670. // Needs a couple of checks for the pane and host, because
  1671. // they may have been removed by the time the zone stabilizes.
  1672. if (!_this._pane || !_this._host || _this._pane.children.length === 0) {
  1673. if (_this._pane && _this._config.panelClass) {
  1674. _this._toggleClasses(_this._pane, _this._config.panelClass, false);
  1675. }
  1676. if (_this._host && _this._host.parentElement) {
  1677. _this._previousHostParent = _this._host.parentElement;
  1678. _this._previousHostParent.removeChild(_this._host);
  1679. }
  1680. subscription.unsubscribe();
  1681. }
  1682. }));
  1683. }));
  1684. };
  1685. /** Disposes of a scroll strategy. */
  1686. /**
  1687. * Disposes of a scroll strategy.
  1688. * @private
  1689. * @return {?}
  1690. */
  1691. OverlayRef.prototype._disposeScrollStrategy = /**
  1692. * Disposes of a scroll strategy.
  1693. * @private
  1694. * @return {?}
  1695. */
  1696. function () {
  1697. /** @type {?} */
  1698. var scrollStrategy = this._scrollStrategy;
  1699. if (scrollStrategy) {
  1700. scrollStrategy.disable();
  1701. if (scrollStrategy.detach) {
  1702. scrollStrategy.detach();
  1703. }
  1704. }
  1705. };
  1706. return OverlayRef;
  1707. }());
  1708. /**
  1709. * @fileoverview added by tsickle
  1710. * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
  1711. */
  1712. // TODO: refactor clipping detection into a separate thing (part of scrolling module)
  1713. // TODO: doesn't handle both flexible width and height when it has to scroll along both axis.
  1714. /**
  1715. * Class to be added to the overlay bounding box.
  1716. * @type {?}
  1717. */
  1718. var boundingBoxClass = 'cdk-overlay-connected-position-bounding-box';
  1719. /**
  1720. * A strategy for positioning overlays. Using this strategy, an overlay is given an
  1721. * implicit position relative some origin element. The relative position is defined in terms of
  1722. * a point on the origin element that is connected to a point on the overlay element. For example,
  1723. * a basic dropdown is connecting the bottom-left corner of the origin to the top-left corner
  1724. * of the overlay.
  1725. */
  1726. var /**
  1727. * A strategy for positioning overlays. Using this strategy, an overlay is given an
  1728. * implicit position relative some origin element. The relative position is defined in terms of
  1729. * a point on the origin element that is connected to a point on the overlay element. For example,
  1730. * a basic dropdown is connecting the bottom-left corner of the origin to the top-left corner
  1731. * of the overlay.
  1732. */
  1733. FlexibleConnectedPositionStrategy = /** @class */ (function () {
  1734. function FlexibleConnectedPositionStrategy(connectedTo, _viewportRuler, _document, _platform, _overlayContainer) {
  1735. this._viewportRuler = _viewportRuler;
  1736. this._document = _document;
  1737. this._platform = _platform;
  1738. this._overlayContainer = _overlayContainer;
  1739. /**
  1740. * Last size used for the bounding box. Used to avoid resizing the overlay after open.
  1741. */
  1742. this._lastBoundingBoxSize = { width: 0, height: 0 };
  1743. /**
  1744. * Whether the overlay was pushed in a previous positioning.
  1745. */
  1746. this._isPushed = false;
  1747. /**
  1748. * Whether the overlay can be pushed on-screen on the initial open.
  1749. */
  1750. this._canPush = true;
  1751. /**
  1752. * Whether the overlay can grow via flexible width/height after the initial open.
  1753. */
  1754. this._growAfterOpen = false;
  1755. /**
  1756. * Whether the overlay's width and height can be constrained to fit within the viewport.
  1757. */
  1758. this._hasFlexibleDimensions = true;
  1759. /**
  1760. * Whether the overlay position is locked.
  1761. */
  1762. this._positionLocked = false;
  1763. /**
  1764. * Amount of space that must be maintained between the overlay and the edge of the viewport.
  1765. */
  1766. this._viewportMargin = 0;
  1767. /**
  1768. * The Scrollable containers used to check scrollable view properties on position change.
  1769. */
  1770. this._scrollables = [];
  1771. /**
  1772. * Ordered list of preferred positions, from most to least desirable.
  1773. */
  1774. this._preferredPositions = [];
  1775. /**
  1776. * Subject that emits whenever the position changes.
  1777. */
  1778. this._positionChanges = new Subject();
  1779. /**
  1780. * Subscription to viewport size changes.
  1781. */
  1782. this._resizeSubscription = Subscription.EMPTY;
  1783. /**
  1784. * Default offset for the overlay along the x axis.
  1785. */
  1786. this._offsetX = 0;
  1787. /**
  1788. * Default offset for the overlay along the y axis.
  1789. */
  1790. this._offsetY = 0;
  1791. /**
  1792. * Keeps track of the CSS classes that the position strategy has applied on the overlay panel.
  1793. */
  1794. this._appliedPanelClasses = [];
  1795. /**
  1796. * Observable sequence of position changes.
  1797. */
  1798. this.positionChanges = this._positionChanges.asObservable();
  1799. this.setOrigin(connectedTo);
  1800. }
  1801. Object.defineProperty(FlexibleConnectedPositionStrategy.prototype, "positions", {
  1802. /** Ordered list of preferred positions, from most to least desirable. */
  1803. get: /**
  1804. * Ordered list of preferred positions, from most to least desirable.
  1805. * @return {?}
  1806. */
  1807. function () {
  1808. return this._preferredPositions;
  1809. },
  1810. enumerable: true,
  1811. configurable: true
  1812. });
  1813. /** Attaches this position strategy to an overlay. */
  1814. /**
  1815. * Attaches this position strategy to an overlay.
  1816. * @param {?} overlayRef
  1817. * @return {?}
  1818. */
  1819. FlexibleConnectedPositionStrategy.prototype.attach = /**
  1820. * Attaches this position strategy to an overlay.
  1821. * @param {?} overlayRef
  1822. * @return {?}
  1823. */
  1824. function (overlayRef) {
  1825. var _this = this;
  1826. if (this._overlayRef && overlayRef !== this._overlayRef) {
  1827. throw Error('This position strategy is already attached to an overlay');
  1828. }
  1829. this._validatePositions();
  1830. overlayRef.hostElement.classList.add(boundingBoxClass);
  1831. this._overlayRef = overlayRef;
  1832. this._boundingBox = overlayRef.hostElement;
  1833. this._pane = overlayRef.overlayElement;
  1834. this._isDisposed = false;
  1835. this._isInitialRender = true;
  1836. this._lastPosition = null;
  1837. this._resizeSubscription.unsubscribe();
  1838. this._resizeSubscription = this._viewportRuler.change().subscribe((/**
  1839. * @return {?}
  1840. */
  1841. function () {
  1842. // When the window is resized, we want to trigger the next reposition as if it
  1843. // was an initial render, in order for the strategy to pick a new optimal position,
  1844. // otherwise position locking will cause it to stay at the old one.
  1845. _this._isInitialRender = true;
  1846. _this.apply();
  1847. }));
  1848. };
  1849. /**
  1850. * Updates the position of the overlay element, using whichever preferred position relative
  1851. * to the origin best fits on-screen.
  1852. *
  1853. * The selection of a position goes as follows:
  1854. * - If any positions fit completely within the viewport as-is,
  1855. * choose the first position that does so.
  1856. * - If flexible dimensions are enabled and at least one satifies the given minimum width/height,
  1857. * choose the position with the greatest available size modified by the positions' weight.
  1858. * - If pushing is enabled, take the position that went off-screen the least and push it
  1859. * on-screen.
  1860. * - If none of the previous criteria were met, use the position that goes off-screen the least.
  1861. * @docs-private
  1862. */
  1863. /**
  1864. * Updates the position of the overlay element, using whichever preferred position relative
  1865. * to the origin best fits on-screen.
  1866. *
  1867. * The selection of a position goes as follows:
  1868. * - If any positions fit completely within the viewport as-is,
  1869. * choose the first position that does so.
  1870. * - If flexible dimensions are enabled and at least one satifies the given minimum width/height,
  1871. * choose the position with the greatest available size modified by the positions' weight.
  1872. * - If pushing is enabled, take the position that went off-screen the least and push it
  1873. * on-screen.
  1874. * - If none of the previous criteria were met, use the position that goes off-screen the least.
  1875. * \@docs-private
  1876. * @return {?}
  1877. */
  1878. FlexibleConnectedPositionStrategy.prototype.apply = /**
  1879. * Updates the position of the overlay element, using whichever preferred position relative
  1880. * to the origin best fits on-screen.
  1881. *
  1882. * The selection of a position goes as follows:
  1883. * - If any positions fit completely within the viewport as-is,
  1884. * choose the first position that does so.
  1885. * - If flexible dimensions are enabled and at least one satifies the given minimum width/height,
  1886. * choose the position with the greatest available size modified by the positions' weight.
  1887. * - If pushing is enabled, take the position that went off-screen the least and push it
  1888. * on-screen.
  1889. * - If none of the previous criteria were met, use the position that goes off-screen the least.
  1890. * \@docs-private
  1891. * @return {?}
  1892. */
  1893. function () {
  1894. // We shouldn't do anything if the strategy was disposed or we're on the server.
  1895. if (this._isDisposed || !this._platform.isBrowser) {
  1896. return;
  1897. }
  1898. // If the position has been applied already (e.g. when the overlay was opened) and the
  1899. // consumer opted into locking in the position, re-use the old position, in order to
  1900. // prevent the overlay from jumping around.
  1901. if (!this._isInitialRender && this._positionLocked && this._lastPosition) {
  1902. this.reapplyLastPosition();
  1903. return;
  1904. }
  1905. this._clearPanelClasses();
  1906. this._resetOverlayElementStyles();
  1907. this._resetBoundingBoxStyles();
  1908. // We need the bounding rects for the origin and the overlay to determine how to position
  1909. // the overlay relative to the origin.
  1910. // We use the viewport rect to determine whether a position would go off-screen.
  1911. this._viewportRect = this._getNarrowedViewportRect();
  1912. this._originRect = this._getOriginRect();
  1913. this._overlayRect = this._pane.getBoundingClientRect();
  1914. /** @type {?} */
  1915. var originRect = this._originRect;
  1916. /** @type {?} */
  1917. var overlayRect = this._overlayRect;
  1918. /** @type {?} */
  1919. var viewportRect = this._viewportRect;
  1920. // Positions where the overlay will fit with flexible dimensions.
  1921. /** @type {?} */
  1922. var flexibleFits = [];
  1923. // Fallback if none of the preferred positions fit within the viewport.
  1924. /** @type {?} */
  1925. var fallback;
  1926. // Go through each of the preferred positions looking for a good fit.
  1927. // If a good fit is found, it will be applied immediately.
  1928. for (var _i = 0, _a = this._preferredPositions; _i < _a.length; _i++) {
  1929. var pos = _a[_i];
  1930. // Get the exact (x, y) coordinate for the point-of-origin on the origin element.
  1931. /** @type {?} */
  1932. var originPoint = this._getOriginPoint(originRect, pos);
  1933. // From that point-of-origin, get the exact (x, y) coordinate for the top-left corner of the
  1934. // overlay in this position. We use the top-left corner for calculations and later translate
  1935. // this into an appropriate (top, left, bottom, right) style.
  1936. /** @type {?} */
  1937. var overlayPoint = this._getOverlayPoint(originPoint, overlayRect, pos);
  1938. // Calculate how well the overlay would fit into the viewport with this point.
  1939. /** @type {?} */
  1940. var overlayFit = this._getOverlayFit(overlayPoint, overlayRect, viewportRect, pos);
  1941. // If the overlay, without any further work, fits into the viewport, use this position.
  1942. if (overlayFit.isCompletelyWithinViewport) {
  1943. this._isPushed = false;
  1944. this._applyPosition(pos, originPoint);
  1945. return;
  1946. }
  1947. // If the overlay has flexible dimensions, we can use this position
  1948. // so long as there's enough space for the minimum dimensions.
  1949. if (this._canFitWithFlexibleDimensions(overlayFit, overlayPoint, viewportRect)) {
  1950. // Save positions where the overlay will fit with flexible dimensions. We will use these
  1951. // if none of the positions fit *without* flexible dimensions.
  1952. flexibleFits.push({
  1953. position: pos,
  1954. origin: originPoint,
  1955. overlayRect: overlayRect,
  1956. boundingBoxRect: this._calculateBoundingBoxRect(originPoint, pos)
  1957. });
  1958. continue;
  1959. }
  1960. // If the current preferred position does not fit on the screen, remember the position
  1961. // if it has more visible area on-screen than we've seen and move onto the next preferred
  1962. // position.
  1963. if (!fallback || fallback.overlayFit.visibleArea < overlayFit.visibleArea) {
  1964. fallback = { overlayFit: overlayFit, overlayPoint: overlayPoint, originPoint: originPoint, position: pos, overlayRect: overlayRect };
  1965. }
  1966. }
  1967. // If there are any positions where the overlay would fit with flexible dimensions, choose the
  1968. // one that has the greatest area available modified by the position's weight
  1969. if (flexibleFits.length) {
  1970. /** @type {?} */
  1971. var bestFit = null;
  1972. /** @type {?} */
  1973. var bestScore = -1;
  1974. for (var _b = 0, flexibleFits_1 = flexibleFits; _b < flexibleFits_1.length; _b++) {
  1975. var fit = flexibleFits_1[_b];
  1976. /** @type {?} */
  1977. var score = fit.boundingBoxRect.width * fit.boundingBoxRect.height * (fit.position.weight || 1);
  1978. if (score > bestScore) {
  1979. bestScore = score;
  1980. bestFit = fit;
  1981. }
  1982. }
  1983. this._isPushed = false;
  1984. this._applyPosition((/** @type {?} */ (bestFit)).position, (/** @type {?} */ (bestFit)).origin);
  1985. return;
  1986. }
  1987. // When none of the preferred positions fit within the viewport, take the position
  1988. // that went off-screen the least and attempt to push it on-screen.
  1989. if (this._canPush) {
  1990. // TODO(jelbourn): after pushing, the opening "direction" of the overlay might not make sense.
  1991. this._isPushed = true;
  1992. this._applyPosition((/** @type {?} */ (fallback)).position, (/** @type {?} */ (fallback)).originPoint);
  1993. return;
  1994. }
  1995. // All options for getting the overlay within the viewport have been exhausted, so go with the
  1996. // position that went off-screen the least.
  1997. this._applyPosition((/** @type {?} */ (fallback)).position, (/** @type {?} */ (fallback)).originPoint);
  1998. };
  1999. /**
  2000. * @return {?}
  2001. */
  2002. FlexibleConnectedPositionStrategy.prototype.detach = /**
  2003. * @return {?}
  2004. */
  2005. function () {
  2006. this._clearPanelClasses();
  2007. this._lastPosition = null;
  2008. this._previousPushAmount = null;
  2009. this._resizeSubscription.unsubscribe();
  2010. };
  2011. /** Cleanup after the element gets destroyed. */
  2012. /**
  2013. * Cleanup after the element gets destroyed.
  2014. * @return {?}
  2015. */
  2016. FlexibleConnectedPositionStrategy.prototype.dispose = /**
  2017. * Cleanup after the element gets destroyed.
  2018. * @return {?}
  2019. */
  2020. function () {
  2021. if (this._isDisposed) {
  2022. return;
  2023. }
  2024. // We can't use `_resetBoundingBoxStyles` here, because it resets
  2025. // some properties to zero, rather than removing them.
  2026. if (this._boundingBox) {
  2027. extendStyles(this._boundingBox.style, (/** @type {?} */ ({
  2028. top: '',
  2029. left: '',
  2030. right: '',
  2031. bottom: '',
  2032. height: '',
  2033. width: '',
  2034. alignItems: '',
  2035. justifyContent: '',
  2036. })));
  2037. }
  2038. if (this._pane) {
  2039. this._resetOverlayElementStyles();
  2040. }
  2041. if (this._overlayRef) {
  2042. this._overlayRef.hostElement.classList.remove(boundingBoxClass);
  2043. }
  2044. this.detach();
  2045. this._positionChanges.complete();
  2046. this._overlayRef = this._boundingBox = (/** @type {?} */ (null));
  2047. this._isDisposed = true;
  2048. };
  2049. /**
  2050. * This re-aligns the overlay element with the trigger in its last calculated position,
  2051. * even if a position higher in the "preferred positions" list would now fit. This
  2052. * allows one to re-align the panel without changing the orientation of the panel.
  2053. */
  2054. /**
  2055. * This re-aligns the overlay element with the trigger in its last calculated position,
  2056. * even if a position higher in the "preferred positions" list would now fit. This
  2057. * allows one to re-align the panel without changing the orientation of the panel.
  2058. * @return {?}
  2059. */
  2060. FlexibleConnectedPositionStrategy.prototype.reapplyLastPosition = /**
  2061. * This re-aligns the overlay element with the trigger in its last calculated position,
  2062. * even if a position higher in the "preferred positions" list would now fit. This
  2063. * allows one to re-align the panel without changing the orientation of the panel.
  2064. * @return {?}
  2065. */
  2066. function () {
  2067. if (!this._isDisposed && (!this._platform || this._platform.isBrowser)) {
  2068. this._originRect = this._getOriginRect();
  2069. this._overlayRect = this._pane.getBoundingClientRect();
  2070. this._viewportRect = this._getNarrowedViewportRect();
  2071. /** @type {?} */
  2072. var lastPosition = this._lastPosition || this._preferredPositions[0];
  2073. /** @type {?} */
  2074. var originPoint = this._getOriginPoint(this._originRect, lastPosition);
  2075. this._applyPosition(lastPosition, originPoint);
  2076. }
  2077. };
  2078. /**
  2079. * Sets the list of Scrollable containers that host the origin element so that
  2080. * on reposition we can evaluate if it or the overlay has been clipped or outside view. Every
  2081. * Scrollable must be an ancestor element of the strategy's origin element.
  2082. */
  2083. /**
  2084. * Sets the list of Scrollable containers that host the origin element so that
  2085. * on reposition we can evaluate if it or the overlay has been clipped or outside view. Every
  2086. * Scrollable must be an ancestor element of the strategy's origin element.
  2087. * @template THIS
  2088. * @this {THIS}
  2089. * @param {?} scrollables
  2090. * @return {THIS}
  2091. */
  2092. FlexibleConnectedPositionStrategy.prototype.withScrollableContainers = /**
  2093. * Sets the list of Scrollable containers that host the origin element so that
  2094. * on reposition we can evaluate if it or the overlay has been clipped or outside view. Every
  2095. * Scrollable must be an ancestor element of the strategy's origin element.
  2096. * @template THIS
  2097. * @this {THIS}
  2098. * @param {?} scrollables
  2099. * @return {THIS}
  2100. */
  2101. function (scrollables) {
  2102. (/** @type {?} */ (this))._scrollables = scrollables;
  2103. return (/** @type {?} */ (this));
  2104. };
  2105. /**
  2106. * Adds new preferred positions.
  2107. * @param positions List of positions options for this overlay.
  2108. */
  2109. /**
  2110. * Adds new preferred positions.
  2111. * @template THIS
  2112. * @this {THIS}
  2113. * @param {?} positions List of positions options for this overlay.
  2114. * @return {THIS}
  2115. */
  2116. FlexibleConnectedPositionStrategy.prototype.withPositions = /**
  2117. * Adds new preferred positions.
  2118. * @template THIS
  2119. * @this {THIS}
  2120. * @param {?} positions List of positions options for this overlay.
  2121. * @return {THIS}
  2122. */
  2123. function (positions) {
  2124. (/** @type {?} */ (this))._preferredPositions = positions;
  2125. // If the last calculated position object isn't part of the positions anymore, clear
  2126. // it in order to avoid it being picked up if the consumer tries to re-apply.
  2127. if (positions.indexOf((/** @type {?} */ ((/** @type {?} */ (this))._lastPosition))) === -1) {
  2128. (/** @type {?} */ (this))._lastPosition = null;
  2129. }
  2130. (/** @type {?} */ (this))._validatePositions();
  2131. return (/** @type {?} */ (this));
  2132. };
  2133. /**
  2134. * Sets a minimum distance the overlay may be positioned to the edge of the viewport.
  2135. * @param margin Required margin between the overlay and the viewport edge in pixels.
  2136. */
  2137. /**
  2138. * Sets a minimum distance the overlay may be positioned to the edge of the viewport.
  2139. * @template THIS
  2140. * @this {THIS}
  2141. * @param {?} margin Required margin between the overlay and the viewport edge in pixels.
  2142. * @return {THIS}
  2143. */
  2144. FlexibleConnectedPositionStrategy.prototype.withViewportMargin = /**
  2145. * Sets a minimum distance the overlay may be positioned to the edge of the viewport.
  2146. * @template THIS
  2147. * @this {THIS}
  2148. * @param {?} margin Required margin between the overlay and the viewport edge in pixels.
  2149. * @return {THIS}
  2150. */
  2151. function (margin) {
  2152. (/** @type {?} */ (this))._viewportMargin = margin;
  2153. return (/** @type {?} */ (this));
  2154. };
  2155. /** Sets whether the overlay's width and height can be constrained to fit within the viewport. */
  2156. /**
  2157. * Sets whether the overlay's width and height can be constrained to fit within the viewport.
  2158. * @template THIS
  2159. * @this {THIS}
  2160. * @param {?=} flexibleDimensions
  2161. * @return {THIS}
  2162. */
  2163. FlexibleConnectedPositionStrategy.prototype.withFlexibleDimensions = /**
  2164. * Sets whether the overlay's width and height can be constrained to fit within the viewport.
  2165. * @template THIS
  2166. * @this {THIS}
  2167. * @param {?=} flexibleDimensions
  2168. * @return {THIS}
  2169. */
  2170. function (flexibleDimensions) {
  2171. if (flexibleDimensions === void 0) { flexibleDimensions = true; }
  2172. (/** @type {?} */ (this))._hasFlexibleDimensions = flexibleDimensions;
  2173. return (/** @type {?} */ (this));
  2174. };
  2175. /** Sets whether the overlay can grow after the initial open via flexible width/height. */
  2176. /**
  2177. * Sets whether the overlay can grow after the initial open via flexible width/height.
  2178. * @template THIS
  2179. * @this {THIS}
  2180. * @param {?=} growAfterOpen
  2181. * @return {THIS}
  2182. */
  2183. FlexibleConnectedPositionStrategy.prototype.withGrowAfterOpen = /**
  2184. * Sets whether the overlay can grow after the initial open via flexible width/height.
  2185. * @template THIS
  2186. * @this {THIS}
  2187. * @param {?=} growAfterOpen
  2188. * @return {THIS}
  2189. */
  2190. function (growAfterOpen) {
  2191. if (growAfterOpen === void 0) { growAfterOpen = true; }
  2192. (/** @type {?} */ (this))._growAfterOpen = growAfterOpen;
  2193. return (/** @type {?} */ (this));
  2194. };
  2195. /** Sets whether the overlay can be pushed on-screen if none of the provided positions fit. */
  2196. /**
  2197. * Sets whether the overlay can be pushed on-screen if none of the provided positions fit.
  2198. * @template THIS
  2199. * @this {THIS}
  2200. * @param {?=} canPush
  2201. * @return {THIS}
  2202. */
  2203. FlexibleConnectedPositionStrategy.prototype.withPush = /**
  2204. * Sets whether the overlay can be pushed on-screen if none of the provided positions fit.
  2205. * @template THIS
  2206. * @this {THIS}
  2207. * @param {?=} canPush
  2208. * @return {THIS}
  2209. */
  2210. function (canPush) {
  2211. if (canPush === void 0) { canPush = true; }
  2212. (/** @type {?} */ (this))._canPush = canPush;
  2213. return (/** @type {?} */ (this));
  2214. };
  2215. /**
  2216. * Sets whether the overlay's position should be locked in after it is positioned
  2217. * initially. When an overlay is locked in, it won't attempt to reposition itself
  2218. * when the position is re-applied (e.g. when the user scrolls away).
  2219. * @param isLocked Whether the overlay should locked in.
  2220. */
  2221. /**
  2222. * Sets whether the overlay's position should be locked in after it is positioned
  2223. * initially. When an overlay is locked in, it won't attempt to reposition itself
  2224. * when the position is re-applied (e.g. when the user scrolls away).
  2225. * @template THIS
  2226. * @this {THIS}
  2227. * @param {?=} isLocked Whether the overlay should locked in.
  2228. * @return {THIS}
  2229. */
  2230. FlexibleConnectedPositionStrategy.prototype.withLockedPosition = /**
  2231. * Sets whether the overlay's position should be locked in after it is positioned
  2232. * initially. When an overlay is locked in, it won't attempt to reposition itself
  2233. * when the position is re-applied (e.g. when the user scrolls away).
  2234. * @template THIS
  2235. * @this {THIS}
  2236. * @param {?=} isLocked Whether the overlay should locked in.
  2237. * @return {THIS}
  2238. */
  2239. function (isLocked) {
  2240. if (isLocked === void 0) { isLocked = true; }
  2241. (/** @type {?} */ (this))._positionLocked = isLocked;
  2242. return (/** @type {?} */ (this));
  2243. };
  2244. /**
  2245. * Sets the origin, relative to which to position the overlay.
  2246. * Using an element origin is useful for building components that need to be positioned
  2247. * relatively to a trigger (e.g. dropdown menus or tooltips), whereas using a point can be
  2248. * used for cases like contextual menus which open relative to the user's pointer.
  2249. * @param origin Reference to the new origin.
  2250. */
  2251. /**
  2252. * Sets the origin, relative to which to position the overlay.
  2253. * Using an element origin is useful for building components that need to be positioned
  2254. * relatively to a trigger (e.g. dropdown menus or tooltips), whereas using a point can be
  2255. * used for cases like contextual menus which open relative to the user's pointer.
  2256. * @template THIS
  2257. * @this {THIS}
  2258. * @param {?} origin Reference to the new origin.
  2259. * @return {THIS}
  2260. */
  2261. FlexibleConnectedPositionStrategy.prototype.setOrigin = /**
  2262. * Sets the origin, relative to which to position the overlay.
  2263. * Using an element origin is useful for building components that need to be positioned
  2264. * relatively to a trigger (e.g. dropdown menus or tooltips), whereas using a point can be
  2265. * used for cases like contextual menus which open relative to the user's pointer.
  2266. * @template THIS
  2267. * @this {THIS}
  2268. * @param {?} origin Reference to the new origin.
  2269. * @return {THIS}
  2270. */
  2271. function (origin) {
  2272. (/** @type {?} */ (this))._origin = origin;
  2273. return (/** @type {?} */ (this));
  2274. };
  2275. /**
  2276. * Sets the default offset for the overlay's connection point on the x-axis.
  2277. * @param offset New offset in the X axis.
  2278. */
  2279. /**
  2280. * Sets the default offset for the overlay's connection point on the x-axis.
  2281. * @template THIS
  2282. * @this {THIS}
  2283. * @param {?} offset New offset in the X axis.
  2284. * @return {THIS}
  2285. */
  2286. FlexibleConnectedPositionStrategy.prototype.withDefaultOffsetX = /**
  2287. * Sets the default offset for the overlay's connection point on the x-axis.
  2288. * @template THIS
  2289. * @this {THIS}
  2290. * @param {?} offset New offset in the X axis.
  2291. * @return {THIS}
  2292. */
  2293. function (offset) {
  2294. (/** @type {?} */ (this))._offsetX = offset;
  2295. return (/** @type {?} */ (this));
  2296. };
  2297. /**
  2298. * Sets the default offset for the overlay's connection point on the y-axis.
  2299. * @param offset New offset in the Y axis.
  2300. */
  2301. /**
  2302. * Sets the default offset for the overlay's connection point on the y-axis.
  2303. * @template THIS
  2304. * @this {THIS}
  2305. * @param {?} offset New offset in the Y axis.
  2306. * @return {THIS}
  2307. */
  2308. FlexibleConnectedPositionStrategy.prototype.withDefaultOffsetY = /**
  2309. * Sets the default offset for the overlay's connection point on the y-axis.
  2310. * @template THIS
  2311. * @this {THIS}
  2312. * @param {?} offset New offset in the Y axis.
  2313. * @return {THIS}
  2314. */
  2315. function (offset) {
  2316. (/** @type {?} */ (this))._offsetY = offset;
  2317. return (/** @type {?} */ (this));
  2318. };
  2319. /**
  2320. * Configures that the position strategy should set a `transform-origin` on some elements
  2321. * inside the overlay, depending on the current position that is being applied. This is
  2322. * useful for the cases where the origin of an animation can change depending on the
  2323. * alignment of the overlay.
  2324. * @param selector CSS selector that will be used to find the target
  2325. * elements onto which to set the transform origin.
  2326. */
  2327. /**
  2328. * Configures that the position strategy should set a `transform-origin` on some elements
  2329. * inside the overlay, depending on the current position that is being applied. This is
  2330. * useful for the cases where the origin of an animation can change depending on the
  2331. * alignment of the overlay.
  2332. * @template THIS
  2333. * @this {THIS}
  2334. * @param {?} selector CSS selector that will be used to find the target
  2335. * elements onto which to set the transform origin.
  2336. * @return {THIS}
  2337. */
  2338. FlexibleConnectedPositionStrategy.prototype.withTransformOriginOn = /**
  2339. * Configures that the position strategy should set a `transform-origin` on some elements
  2340. * inside the overlay, depending on the current position that is being applied. This is
  2341. * useful for the cases where the origin of an animation can change depending on the
  2342. * alignment of the overlay.
  2343. * @template THIS
  2344. * @this {THIS}
  2345. * @param {?} selector CSS selector that will be used to find the target
  2346. * elements onto which to set the transform origin.
  2347. * @return {THIS}
  2348. */
  2349. function (selector) {
  2350. (/** @type {?} */ (this))._transformOriginSelector = selector;
  2351. return (/** @type {?} */ (this));
  2352. };
  2353. /**
  2354. * Gets the (x, y) coordinate of a connection point on the origin based on a relative position.
  2355. */
  2356. /**
  2357. * Gets the (x, y) coordinate of a connection point on the origin based on a relative position.
  2358. * @private
  2359. * @param {?} originRect
  2360. * @param {?} pos
  2361. * @return {?}
  2362. */
  2363. FlexibleConnectedPositionStrategy.prototype._getOriginPoint = /**
  2364. * Gets the (x, y) coordinate of a connection point on the origin based on a relative position.
  2365. * @private
  2366. * @param {?} originRect
  2367. * @param {?} pos
  2368. * @return {?}
  2369. */
  2370. function (originRect, pos) {
  2371. /** @type {?} */
  2372. var x;
  2373. if (pos.originX == 'center') {
  2374. // Note: when centering we should always use the `left`
  2375. // offset, otherwise the position will be wrong in RTL.
  2376. x = originRect.left + (originRect.width / 2);
  2377. }
  2378. else {
  2379. /** @type {?} */
  2380. var startX = this._isRtl() ? originRect.right : originRect.left;
  2381. /** @type {?} */
  2382. var endX = this._isRtl() ? originRect.left : originRect.right;
  2383. x = pos.originX == 'start' ? startX : endX;
  2384. }
  2385. /** @type {?} */
  2386. var y;
  2387. if (pos.originY == 'center') {
  2388. y = originRect.top + (originRect.height / 2);
  2389. }
  2390. else {
  2391. y = pos.originY == 'top' ? originRect.top : originRect.bottom;
  2392. }
  2393. return { x: x, y: y };
  2394. };
  2395. /**
  2396. * Gets the (x, y) coordinate of the top-left corner of the overlay given a given position and
  2397. * origin point to which the overlay should be connected.
  2398. */
  2399. /**
  2400. * Gets the (x, y) coordinate of the top-left corner of the overlay given a given position and
  2401. * origin point to which the overlay should be connected.
  2402. * @private
  2403. * @param {?} originPoint
  2404. * @param {?} overlayRect
  2405. * @param {?} pos
  2406. * @return {?}
  2407. */
  2408. FlexibleConnectedPositionStrategy.prototype._getOverlayPoint = /**
  2409. * Gets the (x, y) coordinate of the top-left corner of the overlay given a given position and
  2410. * origin point to which the overlay should be connected.
  2411. * @private
  2412. * @param {?} originPoint
  2413. * @param {?} overlayRect
  2414. * @param {?} pos
  2415. * @return {?}
  2416. */
  2417. function (originPoint, overlayRect, pos) {
  2418. // Calculate the (overlayStartX, overlayStartY), the start of the
  2419. // potential overlay position relative to the origin point.
  2420. /** @type {?} */
  2421. var overlayStartX;
  2422. if (pos.overlayX == 'center') {
  2423. overlayStartX = -overlayRect.width / 2;
  2424. }
  2425. else if (pos.overlayX === 'start') {
  2426. overlayStartX = this._isRtl() ? -overlayRect.width : 0;
  2427. }
  2428. else {
  2429. overlayStartX = this._isRtl() ? 0 : -overlayRect.width;
  2430. }
  2431. /** @type {?} */
  2432. var overlayStartY;
  2433. if (pos.overlayY == 'center') {
  2434. overlayStartY = -overlayRect.height / 2;
  2435. }
  2436. else {
  2437. overlayStartY = pos.overlayY == 'top' ? 0 : -overlayRect.height;
  2438. }
  2439. // The (x, y) coordinates of the overlay.
  2440. return {
  2441. x: originPoint.x + overlayStartX,
  2442. y: originPoint.y + overlayStartY,
  2443. };
  2444. };
  2445. /** Gets how well an overlay at the given point will fit within the viewport. */
  2446. /**
  2447. * Gets how well an overlay at the given point will fit within the viewport.
  2448. * @private
  2449. * @param {?} point
  2450. * @param {?} overlay
  2451. * @param {?} viewport
  2452. * @param {?} position
  2453. * @return {?}
  2454. */
  2455. FlexibleConnectedPositionStrategy.prototype._getOverlayFit = /**
  2456. * Gets how well an overlay at the given point will fit within the viewport.
  2457. * @private
  2458. * @param {?} point
  2459. * @param {?} overlay
  2460. * @param {?} viewport
  2461. * @param {?} position
  2462. * @return {?}
  2463. */
  2464. function (point, overlay, viewport, position) {
  2465. var x = point.x, y = point.y;
  2466. /** @type {?} */
  2467. var offsetX = this._getOffset(position, 'x');
  2468. /** @type {?} */
  2469. var offsetY = this._getOffset(position, 'y');
  2470. // Account for the offsets since they could push the overlay out of the viewport.
  2471. if (offsetX) {
  2472. x += offsetX;
  2473. }
  2474. if (offsetY) {
  2475. y += offsetY;
  2476. }
  2477. // How much the overlay would overflow at this position, on each side.
  2478. /** @type {?} */
  2479. var leftOverflow = 0 - x;
  2480. /** @type {?} */
  2481. var rightOverflow = (x + overlay.width) - viewport.width;
  2482. /** @type {?} */
  2483. var topOverflow = 0 - y;
  2484. /** @type {?} */
  2485. var bottomOverflow = (y + overlay.height) - viewport.height;
  2486. // Visible parts of the element on each axis.
  2487. /** @type {?} */
  2488. var visibleWidth = this._subtractOverflows(overlay.width, leftOverflow, rightOverflow);
  2489. /** @type {?} */
  2490. var visibleHeight = this._subtractOverflows(overlay.height, topOverflow, bottomOverflow);
  2491. /** @type {?} */
  2492. var visibleArea = visibleWidth * visibleHeight;
  2493. return {
  2494. visibleArea: visibleArea,
  2495. isCompletelyWithinViewport: (overlay.width * overlay.height) === visibleArea,
  2496. fitsInViewportVertically: visibleHeight === overlay.height,
  2497. fitsInViewportHorizontally: visibleWidth == overlay.width,
  2498. };
  2499. };
  2500. /**
  2501. * Whether the overlay can fit within the viewport when it may resize either its width or height.
  2502. * @param fit How well the overlay fits in the viewport at some position.
  2503. * @param point The (x, y) coordinates of the overlat at some position.
  2504. * @param viewport The geometry of the viewport.
  2505. */
  2506. /**
  2507. * Whether the overlay can fit within the viewport when it may resize either its width or height.
  2508. * @private
  2509. * @param {?} fit How well the overlay fits in the viewport at some position.
  2510. * @param {?} point The (x, y) coordinates of the overlat at some position.
  2511. * @param {?} viewport The geometry of the viewport.
  2512. * @return {?}
  2513. */
  2514. FlexibleConnectedPositionStrategy.prototype._canFitWithFlexibleDimensions = /**
  2515. * Whether the overlay can fit within the viewport when it may resize either its width or height.
  2516. * @private
  2517. * @param {?} fit How well the overlay fits in the viewport at some position.
  2518. * @param {?} point The (x, y) coordinates of the overlat at some position.
  2519. * @param {?} viewport The geometry of the viewport.
  2520. * @return {?}
  2521. */
  2522. function (fit, point, viewport) {
  2523. if (this._hasFlexibleDimensions) {
  2524. /** @type {?} */
  2525. var availableHeight = viewport.bottom - point.y;
  2526. /** @type {?} */
  2527. var availableWidth = viewport.right - point.x;
  2528. /** @type {?} */
  2529. var minHeight = this._overlayRef.getConfig().minHeight;
  2530. /** @type {?} */
  2531. var minWidth = this._overlayRef.getConfig().minWidth;
  2532. /** @type {?} */
  2533. var verticalFit = fit.fitsInViewportVertically ||
  2534. (minHeight != null && minHeight <= availableHeight);
  2535. /** @type {?} */
  2536. var horizontalFit = fit.fitsInViewportHorizontally ||
  2537. (minWidth != null && minWidth <= availableWidth);
  2538. return verticalFit && horizontalFit;
  2539. }
  2540. return false;
  2541. };
  2542. /**
  2543. * Gets the point at which the overlay can be "pushed" on-screen. If the overlay is larger than
  2544. * the viewport, the top-left corner will be pushed on-screen (with overflow occuring on the
  2545. * right and bottom).
  2546. *
  2547. * @param start Starting point from which the overlay is pushed.
  2548. * @param overlay Dimensions of the overlay.
  2549. * @param scrollPosition Current viewport scroll position.
  2550. * @returns The point at which to position the overlay after pushing. This is effectively a new
  2551. * originPoint.
  2552. */
  2553. /**
  2554. * Gets the point at which the overlay can be "pushed" on-screen. If the overlay is larger than
  2555. * the viewport, the top-left corner will be pushed on-screen (with overflow occuring on the
  2556. * right and bottom).
  2557. *
  2558. * @private
  2559. * @param {?} start Starting point from which the overlay is pushed.
  2560. * @param {?} overlay Dimensions of the overlay.
  2561. * @param {?} scrollPosition Current viewport scroll position.
  2562. * @return {?} The point at which to position the overlay after pushing. This is effectively a new
  2563. * originPoint.
  2564. */
  2565. FlexibleConnectedPositionStrategy.prototype._pushOverlayOnScreen = /**
  2566. * Gets the point at which the overlay can be "pushed" on-screen. If the overlay is larger than
  2567. * the viewport, the top-left corner will be pushed on-screen (with overflow occuring on the
  2568. * right and bottom).
  2569. *
  2570. * @private
  2571. * @param {?} start Starting point from which the overlay is pushed.
  2572. * @param {?} overlay Dimensions of the overlay.
  2573. * @param {?} scrollPosition Current viewport scroll position.
  2574. * @return {?} The point at which to position the overlay after pushing. This is effectively a new
  2575. * originPoint.
  2576. */
  2577. function (start, overlay, scrollPosition) {
  2578. // If the position is locked and we've pushed the overlay already, reuse the previous push
  2579. // amount, rather than pushing it again. If we were to continue pushing, the element would
  2580. // remain in the viewport, which goes against the expectations when position locking is enabled.
  2581. if (this._previousPushAmount && this._positionLocked) {
  2582. return {
  2583. x: start.x + this._previousPushAmount.x,
  2584. y: start.y + this._previousPushAmount.y
  2585. };
  2586. }
  2587. /** @type {?} */
  2588. var viewport = this._viewportRect;
  2589. // Determine how much the overlay goes outside the viewport on each
  2590. // side, which we'll use to decide which direction to push it.
  2591. /** @type {?} */
  2592. var overflowRight = Math.max(start.x + overlay.width - viewport.right, 0);
  2593. /** @type {?} */
  2594. var overflowBottom = Math.max(start.y + overlay.height - viewport.bottom, 0);
  2595. /** @type {?} */
  2596. var overflowTop = Math.max(viewport.top - scrollPosition.top - start.y, 0);
  2597. /** @type {?} */
  2598. var overflowLeft = Math.max(viewport.left - scrollPosition.left - start.x, 0);
  2599. // Amount by which to push the overlay in each axis such that it remains on-screen.
  2600. /** @type {?} */
  2601. var pushX = 0;
  2602. /** @type {?} */
  2603. var pushY = 0;
  2604. // If the overlay fits completely within the bounds of the viewport, push it from whichever
  2605. // direction is goes off-screen. Otherwise, push the top-left corner such that its in the
  2606. // viewport and allow for the trailing end of the overlay to go out of bounds.
  2607. if (overlay.width <= viewport.width) {
  2608. pushX = overflowLeft || -overflowRight;
  2609. }
  2610. else {
  2611. pushX = start.x < this._viewportMargin ? (viewport.left - scrollPosition.left) - start.x : 0;
  2612. }
  2613. if (overlay.height <= viewport.height) {
  2614. pushY = overflowTop || -overflowBottom;
  2615. }
  2616. else {
  2617. pushY = start.y < this._viewportMargin ? (viewport.top - scrollPosition.top) - start.y : 0;
  2618. }
  2619. this._previousPushAmount = { x: pushX, y: pushY };
  2620. return {
  2621. x: start.x + pushX,
  2622. y: start.y + pushY,
  2623. };
  2624. };
  2625. /**
  2626. * Applies a computed position to the overlay and emits a position change.
  2627. * @param position The position preference
  2628. * @param originPoint The point on the origin element where the overlay is connected.
  2629. */
  2630. /**
  2631. * Applies a computed position to the overlay and emits a position change.
  2632. * @private
  2633. * @param {?} position The position preference
  2634. * @param {?} originPoint The point on the origin element where the overlay is connected.
  2635. * @return {?}
  2636. */
  2637. FlexibleConnectedPositionStrategy.prototype._applyPosition = /**
  2638. * Applies a computed position to the overlay and emits a position change.
  2639. * @private
  2640. * @param {?} position The position preference
  2641. * @param {?} originPoint The point on the origin element where the overlay is connected.
  2642. * @return {?}
  2643. */
  2644. function (position, originPoint) {
  2645. this._setTransformOrigin(position);
  2646. this._setOverlayElementStyles(originPoint, position);
  2647. this._setBoundingBoxStyles(originPoint, position);
  2648. if (position.panelClass) {
  2649. this._addPanelClasses(position.panelClass);
  2650. }
  2651. // Save the last connected position in case the position needs to be re-calculated.
  2652. this._lastPosition = position;
  2653. // Notify that the position has been changed along with its change properties.
  2654. // We only emit if we've got any subscriptions, because the scroll visibility
  2655. // calculcations can be somewhat expensive.
  2656. if (this._positionChanges.observers.length) {
  2657. /** @type {?} */
  2658. var scrollableViewProperties = this._getScrollVisibility();
  2659. /** @type {?} */
  2660. var changeEvent = new ConnectedOverlayPositionChange(position, scrollableViewProperties);
  2661. this._positionChanges.next(changeEvent);
  2662. }
  2663. this._isInitialRender = false;
  2664. };
  2665. /** Sets the transform origin based on the configured selector and the passed-in position. */
  2666. /**
  2667. * Sets the transform origin based on the configured selector and the passed-in position.
  2668. * @private
  2669. * @param {?} position
  2670. * @return {?}
  2671. */
  2672. FlexibleConnectedPositionStrategy.prototype._setTransformOrigin = /**
  2673. * Sets the transform origin based on the configured selector and the passed-in position.
  2674. * @private
  2675. * @param {?} position
  2676. * @return {?}
  2677. */
  2678. function (position) {
  2679. if (!this._transformOriginSelector) {
  2680. return;
  2681. }
  2682. /** @type {?} */
  2683. var elements = (/** @type {?} */ (this._boundingBox)).querySelectorAll(this._transformOriginSelector);
  2684. /** @type {?} */
  2685. var xOrigin;
  2686. /** @type {?} */
  2687. var yOrigin = position.overlayY;
  2688. if (position.overlayX === 'center') {
  2689. xOrigin = 'center';
  2690. }
  2691. else if (this._isRtl()) {
  2692. xOrigin = position.overlayX === 'start' ? 'right' : 'left';
  2693. }
  2694. else {
  2695. xOrigin = position.overlayX === 'start' ? 'left' : 'right';
  2696. }
  2697. for (var i = 0; i < elements.length; i++) {
  2698. elements[i].style.transformOrigin = xOrigin + " " + yOrigin;
  2699. }
  2700. };
  2701. /**
  2702. * Gets the position and size of the overlay's sizing container.
  2703. *
  2704. * This method does no measuring and applies no styles so that we can cheaply compute the
  2705. * bounds for all positions and choose the best fit based on these results.
  2706. */
  2707. /**
  2708. * Gets the position and size of the overlay's sizing container.
  2709. *
  2710. * This method does no measuring and applies no styles so that we can cheaply compute the
  2711. * bounds for all positions and choose the best fit based on these results.
  2712. * @private
  2713. * @param {?} origin
  2714. * @param {?} position
  2715. * @return {?}
  2716. */
  2717. FlexibleConnectedPositionStrategy.prototype._calculateBoundingBoxRect = /**
  2718. * Gets the position and size of the overlay's sizing container.
  2719. *
  2720. * This method does no measuring and applies no styles so that we can cheaply compute the
  2721. * bounds for all positions and choose the best fit based on these results.
  2722. * @private
  2723. * @param {?} origin
  2724. * @param {?} position
  2725. * @return {?}
  2726. */
  2727. function (origin, position) {
  2728. /** @type {?} */
  2729. var viewport = this._viewportRect;
  2730. /** @type {?} */
  2731. var isRtl = this._isRtl();
  2732. /** @type {?} */
  2733. var height;
  2734. /** @type {?} */
  2735. var top;
  2736. /** @type {?} */
  2737. var bottom;
  2738. if (position.overlayY === 'top') {
  2739. // Overlay is opening "downward" and thus is bound by the bottom viewport edge.
  2740. top = origin.y;
  2741. height = viewport.height - top + this._viewportMargin;
  2742. }
  2743. else if (position.overlayY === 'bottom') {
  2744. // Overlay is opening "upward" and thus is bound by the top viewport edge. We need to add
  2745. // the viewport margin back in, because the viewport rect is narrowed down to remove the
  2746. // margin, whereas the `origin` position is calculated based on its `ClientRect`.
  2747. bottom = viewport.height - origin.y + this._viewportMargin * 2;
  2748. height = viewport.height - bottom + this._viewportMargin;
  2749. }
  2750. else {
  2751. // If neither top nor bottom, it means that the overlay is vertically centered on the
  2752. // origin point. Note that we want the position relative to the viewport, rather than
  2753. // the page, which is why we don't use something like `viewport.bottom - origin.y` and
  2754. // `origin.y - viewport.top`.
  2755. /** @type {?} */
  2756. var smallestDistanceToViewportEdge = Math.min(viewport.bottom - origin.y + viewport.top, origin.y);
  2757. /** @type {?} */
  2758. var previousHeight = this._lastBoundingBoxSize.height;
  2759. height = smallestDistanceToViewportEdge * 2;
  2760. top = origin.y - smallestDistanceToViewportEdge;
  2761. if (height > previousHeight && !this._isInitialRender && !this._growAfterOpen) {
  2762. top = origin.y - (previousHeight / 2);
  2763. }
  2764. }
  2765. // The overlay is opening 'right-ward' (the content flows to the right).
  2766. /** @type {?} */
  2767. var isBoundedByRightViewportEdge = (position.overlayX === 'start' && !isRtl) ||
  2768. (position.overlayX === 'end' && isRtl);
  2769. // The overlay is opening 'left-ward' (the content flows to the left).
  2770. /** @type {?} */
  2771. var isBoundedByLeftViewportEdge = (position.overlayX === 'end' && !isRtl) ||
  2772. (position.overlayX === 'start' && isRtl);
  2773. /** @type {?} */
  2774. var width;
  2775. /** @type {?} */
  2776. var left;
  2777. /** @type {?} */
  2778. var right;
  2779. if (isBoundedByLeftViewportEdge) {
  2780. right = viewport.width - origin.x + this._viewportMargin;
  2781. width = origin.x - this._viewportMargin;
  2782. }
  2783. else if (isBoundedByRightViewportEdge) {
  2784. left = origin.x;
  2785. width = viewport.right - origin.x;
  2786. }
  2787. else {
  2788. // If neither start nor end, it means that the overlay is horizontally centered on the
  2789. // origin point. Note that we want the position relative to the viewport, rather than
  2790. // the page, which is why we don't use something like `viewport.right - origin.x` and
  2791. // `origin.x - viewport.left`.
  2792. /** @type {?} */
  2793. var smallestDistanceToViewportEdge = Math.min(viewport.right - origin.x + viewport.left, origin.x);
  2794. /** @type {?} */
  2795. var previousWidth = this._lastBoundingBoxSize.width;
  2796. width = smallestDistanceToViewportEdge * 2;
  2797. left = origin.x - smallestDistanceToViewportEdge;
  2798. if (width > previousWidth && !this._isInitialRender && !this._growAfterOpen) {
  2799. left = origin.x - (previousWidth / 2);
  2800. }
  2801. }
  2802. return { top: (/** @type {?} */ (top)), left: (/** @type {?} */ (left)), bottom: (/** @type {?} */ (bottom)), right: (/** @type {?} */ (right)), width: width, height: height };
  2803. };
  2804. /**
  2805. * Sets the position and size of the overlay's sizing wrapper. The wrapper is positioned on the
  2806. * origin's connection point and stetches to the bounds of the viewport.
  2807. *
  2808. * @param origin The point on the origin element where the overlay is connected.
  2809. * @param position The position preference
  2810. */
  2811. /**
  2812. * Sets the position and size of the overlay's sizing wrapper. The wrapper is positioned on the
  2813. * origin's connection point and stetches to the bounds of the viewport.
  2814. *
  2815. * @private
  2816. * @param {?} origin The point on the origin element where the overlay is connected.
  2817. * @param {?} position The position preference
  2818. * @return {?}
  2819. */
  2820. FlexibleConnectedPositionStrategy.prototype._setBoundingBoxStyles = /**
  2821. * Sets the position and size of the overlay's sizing wrapper. The wrapper is positioned on the
  2822. * origin's connection point and stetches to the bounds of the viewport.
  2823. *
  2824. * @private
  2825. * @param {?} origin The point on the origin element where the overlay is connected.
  2826. * @param {?} position The position preference
  2827. * @return {?}
  2828. */
  2829. function (origin, position) {
  2830. /** @type {?} */
  2831. var boundingBoxRect = this._calculateBoundingBoxRect(origin, position);
  2832. // It's weird if the overlay *grows* while scrolling, so we take the last size into account
  2833. // when applying a new size.
  2834. if (!this._isInitialRender && !this._growAfterOpen) {
  2835. boundingBoxRect.height = Math.min(boundingBoxRect.height, this._lastBoundingBoxSize.height);
  2836. boundingBoxRect.width = Math.min(boundingBoxRect.width, this._lastBoundingBoxSize.width);
  2837. }
  2838. /** @type {?} */
  2839. var styles = (/** @type {?} */ ({}));
  2840. if (this._hasExactPosition()) {
  2841. styles.top = styles.left = '0';
  2842. styles.bottom = styles.right = '';
  2843. styles.width = styles.height = '100%';
  2844. }
  2845. else {
  2846. /** @type {?} */
  2847. var maxHeight = this._overlayRef.getConfig().maxHeight;
  2848. /** @type {?} */
  2849. var maxWidth = this._overlayRef.getConfig().maxWidth;
  2850. styles.height = coerceCssPixelValue(boundingBoxRect.height);
  2851. styles.top = coerceCssPixelValue(boundingBoxRect.top);
  2852. styles.bottom = coerceCssPixelValue(boundingBoxRect.bottom);
  2853. styles.width = coerceCssPixelValue(boundingBoxRect.width);
  2854. styles.left = coerceCssPixelValue(boundingBoxRect.left);
  2855. styles.right = coerceCssPixelValue(boundingBoxRect.right);
  2856. // Push the pane content towards the proper direction.
  2857. if (position.overlayX === 'center') {
  2858. styles.alignItems = 'center';
  2859. }
  2860. else {
  2861. styles.alignItems = position.overlayX === 'end' ? 'flex-end' : 'flex-start';
  2862. }
  2863. if (position.overlayY === 'center') {
  2864. styles.justifyContent = 'center';
  2865. }
  2866. else {
  2867. styles.justifyContent = position.overlayY === 'bottom' ? 'flex-end' : 'flex-start';
  2868. }
  2869. if (maxHeight) {
  2870. styles.maxHeight = coerceCssPixelValue(maxHeight);
  2871. }
  2872. if (maxWidth) {
  2873. styles.maxWidth = coerceCssPixelValue(maxWidth);
  2874. }
  2875. }
  2876. this._lastBoundingBoxSize = boundingBoxRect;
  2877. extendStyles((/** @type {?} */ (this._boundingBox)).style, styles);
  2878. };
  2879. /** Resets the styles for the bounding box so that a new positioning can be computed. */
  2880. /**
  2881. * Resets the styles for the bounding box so that a new positioning can be computed.
  2882. * @private
  2883. * @return {?}
  2884. */
  2885. FlexibleConnectedPositionStrategy.prototype._resetBoundingBoxStyles = /**
  2886. * Resets the styles for the bounding box so that a new positioning can be computed.
  2887. * @private
  2888. * @return {?}
  2889. */
  2890. function () {
  2891. extendStyles((/** @type {?} */ (this._boundingBox)).style, (/** @type {?} */ ({
  2892. top: '0',
  2893. left: '0',
  2894. right: '0',
  2895. bottom: '0',
  2896. height: '',
  2897. width: '',
  2898. alignItems: '',
  2899. justifyContent: '',
  2900. })));
  2901. };
  2902. /** Resets the styles for the overlay pane so that a new positioning can be computed. */
  2903. /**
  2904. * Resets the styles for the overlay pane so that a new positioning can be computed.
  2905. * @private
  2906. * @return {?}
  2907. */
  2908. FlexibleConnectedPositionStrategy.prototype._resetOverlayElementStyles = /**
  2909. * Resets the styles for the overlay pane so that a new positioning can be computed.
  2910. * @private
  2911. * @return {?}
  2912. */
  2913. function () {
  2914. extendStyles(this._pane.style, (/** @type {?} */ ({
  2915. top: '',
  2916. left: '',
  2917. bottom: '',
  2918. right: '',
  2919. position: '',
  2920. transform: '',
  2921. })));
  2922. };
  2923. /** Sets positioning styles to the overlay element. */
  2924. /**
  2925. * Sets positioning styles to the overlay element.
  2926. * @private
  2927. * @param {?} originPoint
  2928. * @param {?} position
  2929. * @return {?}
  2930. */
  2931. FlexibleConnectedPositionStrategy.prototype._setOverlayElementStyles = /**
  2932. * Sets positioning styles to the overlay element.
  2933. * @private
  2934. * @param {?} originPoint
  2935. * @param {?} position
  2936. * @return {?}
  2937. */
  2938. function (originPoint, position) {
  2939. /** @type {?} */
  2940. var styles = (/** @type {?} */ ({}));
  2941. if (this._hasExactPosition()) {
  2942. /** @type {?} */
  2943. var scrollPosition = this._viewportRuler.getViewportScrollPosition();
  2944. extendStyles(styles, this._getExactOverlayY(position, originPoint, scrollPosition));
  2945. extendStyles(styles, this._getExactOverlayX(position, originPoint, scrollPosition));
  2946. }
  2947. else {
  2948. styles.position = 'static';
  2949. }
  2950. // Use a transform to apply the offsets. We do this because the `center` positions rely on
  2951. // being in the normal flex flow and setting a `top` / `left` at all will completely throw
  2952. // off the position. We also can't use margins, because they won't have an effect in some
  2953. // cases where the element doesn't have anything to "push off of". Finally, this works
  2954. // better both with flexible and non-flexible positioning.
  2955. /** @type {?} */
  2956. var transformString = '';
  2957. /** @type {?} */
  2958. var offsetX = this._getOffset(position, 'x');
  2959. /** @type {?} */
  2960. var offsetY = this._getOffset(position, 'y');
  2961. if (offsetX) {
  2962. transformString += "translateX(" + offsetX + "px) ";
  2963. }
  2964. if (offsetY) {
  2965. transformString += "translateY(" + offsetY + "px)";
  2966. }
  2967. styles.transform = transformString.trim();
  2968. // If a maxWidth or maxHeight is specified on the overlay, we remove them. We do this because
  2969. // we need these values to both be set to "100%" for the automatic flexible sizing to work.
  2970. // The maxHeight and maxWidth are set on the boundingBox in order to enforce the constraint.
  2971. if (this._hasFlexibleDimensions && this._overlayRef.getConfig().maxHeight) {
  2972. styles.maxHeight = '';
  2973. }
  2974. if (this._hasFlexibleDimensions && this._overlayRef.getConfig().maxWidth) {
  2975. styles.maxWidth = '';
  2976. }
  2977. extendStyles(this._pane.style, styles);
  2978. };
  2979. /** Gets the exact top/bottom for the overlay when not using flexible sizing or when pushing. */
  2980. /**
  2981. * Gets the exact top/bottom for the overlay when not using flexible sizing or when pushing.
  2982. * @private
  2983. * @param {?} position
  2984. * @param {?} originPoint
  2985. * @param {?} scrollPosition
  2986. * @return {?}
  2987. */
  2988. FlexibleConnectedPositionStrategy.prototype._getExactOverlayY = /**
  2989. * Gets the exact top/bottom for the overlay when not using flexible sizing or when pushing.
  2990. * @private
  2991. * @param {?} position
  2992. * @param {?} originPoint
  2993. * @param {?} scrollPosition
  2994. * @return {?}
  2995. */
  2996. function (position, originPoint, scrollPosition) {
  2997. // Reset any existing styles. This is necessary in case the
  2998. // preferred position has changed since the last `apply`.
  2999. /** @type {?} */
  3000. var styles = (/** @type {?} */ ({ top: null, bottom: null }));
  3001. /** @type {?} */
  3002. var overlayPoint = this._getOverlayPoint(originPoint, this._overlayRect, position);
  3003. if (this._isPushed) {
  3004. overlayPoint = this._pushOverlayOnScreen(overlayPoint, this._overlayRect, scrollPosition);
  3005. }
  3006. /** @type {?} */
  3007. var virtualKeyboardOffset = this._overlayContainer.getContainerElement().getBoundingClientRect().top;
  3008. // Normally this would be zero, however when the overlay is attached to an input (e.g. in an
  3009. // autocomplete), mobile browsers will shift everything in order to put the input in the middle
  3010. // of the screen and to make space for the virtual keyboard. We need to account for this offset,
  3011. // otherwise our positioning will be thrown off.
  3012. overlayPoint.y -= virtualKeyboardOffset;
  3013. // We want to set either `top` or `bottom` based on whether the overlay wants to appear
  3014. // above or below the origin and the direction in which the element will expand.
  3015. if (position.overlayY === 'bottom') {
  3016. // When using `bottom`, we adjust the y position such that it is the distance
  3017. // from the bottom of the viewport rather than the top.
  3018. /** @type {?} */
  3019. var documentHeight = (/** @type {?} */ (this._document.documentElement)).clientHeight;
  3020. styles.bottom = documentHeight - (overlayPoint.y + this._overlayRect.height) + "px";
  3021. }
  3022. else {
  3023. styles.top = coerceCssPixelValue(overlayPoint.y);
  3024. }
  3025. return styles;
  3026. };
  3027. /** Gets the exact left/right for the overlay when not using flexible sizing or when pushing. */
  3028. /**
  3029. * Gets the exact left/right for the overlay when not using flexible sizing or when pushing.
  3030. * @private
  3031. * @param {?} position
  3032. * @param {?} originPoint
  3033. * @param {?} scrollPosition
  3034. * @return {?}
  3035. */
  3036. FlexibleConnectedPositionStrategy.prototype._getExactOverlayX = /**
  3037. * Gets the exact left/right for the overlay when not using flexible sizing or when pushing.
  3038. * @private
  3039. * @param {?} position
  3040. * @param {?} originPoint
  3041. * @param {?} scrollPosition
  3042. * @return {?}
  3043. */
  3044. function (position, originPoint, scrollPosition) {
  3045. // Reset any existing styles. This is necessary in case the preferred position has
  3046. // changed since the last `apply`.
  3047. /** @type {?} */
  3048. var styles = (/** @type {?} */ ({ left: null, right: null }));
  3049. /** @type {?} */
  3050. var overlayPoint = this._getOverlayPoint(originPoint, this._overlayRect, position);
  3051. if (this._isPushed) {
  3052. overlayPoint = this._pushOverlayOnScreen(overlayPoint, this._overlayRect, scrollPosition);
  3053. }
  3054. // We want to set either `left` or `right` based on whether the overlay wants to appear "before"
  3055. // or "after" the origin, which determines the direction in which the element will expand.
  3056. // For the horizontal axis, the meaning of "before" and "after" change based on whether the
  3057. // page is in RTL or LTR.
  3058. /** @type {?} */
  3059. var horizontalStyleProperty;
  3060. if (this._isRtl()) {
  3061. horizontalStyleProperty = position.overlayX === 'end' ? 'left' : 'right';
  3062. }
  3063. else {
  3064. horizontalStyleProperty = position.overlayX === 'end' ? 'right' : 'left';
  3065. }
  3066. // When we're setting `right`, we adjust the x position such that it is the distance
  3067. // from the right edge of the viewport rather than the left edge.
  3068. if (horizontalStyleProperty === 'right') {
  3069. /** @type {?} */
  3070. var documentWidth = (/** @type {?} */ (this._document.documentElement)).clientWidth;
  3071. styles.right = documentWidth - (overlayPoint.x + this._overlayRect.width) + "px";
  3072. }
  3073. else {
  3074. styles.left = coerceCssPixelValue(overlayPoint.x);
  3075. }
  3076. return styles;
  3077. };
  3078. /**
  3079. * Gets the view properties of the trigger and overlay, including whether they are clipped
  3080. * or completely outside the view of any of the strategy's scrollables.
  3081. */
  3082. /**
  3083. * Gets the view properties of the trigger and overlay, including whether they are clipped
  3084. * or completely outside the view of any of the strategy's scrollables.
  3085. * @private
  3086. * @return {?}
  3087. */
  3088. FlexibleConnectedPositionStrategy.prototype._getScrollVisibility = /**
  3089. * Gets the view properties of the trigger and overlay, including whether they are clipped
  3090. * or completely outside the view of any of the strategy's scrollables.
  3091. * @private
  3092. * @return {?}
  3093. */
  3094. function () {
  3095. // Note: needs fresh rects since the position could've changed.
  3096. /** @type {?} */
  3097. var originBounds = this._getOriginRect();
  3098. /** @type {?} */
  3099. var overlayBounds = this._pane.getBoundingClientRect();
  3100. // TODO(jelbourn): instead of needing all of the client rects for these scrolling containers
  3101. // every time, we should be able to use the scrollTop of the containers if the size of those
  3102. // containers hasn't changed.
  3103. /** @type {?} */
  3104. var scrollContainerBounds = this._scrollables.map((/**
  3105. * @param {?} scrollable
  3106. * @return {?}
  3107. */
  3108. function (scrollable) {
  3109. return scrollable.getElementRef().nativeElement.getBoundingClientRect();
  3110. }));
  3111. return {
  3112. isOriginClipped: isElementClippedByScrolling(originBounds, scrollContainerBounds),
  3113. isOriginOutsideView: isElementScrolledOutsideView(originBounds, scrollContainerBounds),
  3114. isOverlayClipped: isElementClippedByScrolling(overlayBounds, scrollContainerBounds),
  3115. isOverlayOutsideView: isElementScrolledOutsideView(overlayBounds, scrollContainerBounds),
  3116. };
  3117. };
  3118. /** Subtracts the amount that an element is overflowing on an axis from its length. */
  3119. /**
  3120. * Subtracts the amount that an element is overflowing on an axis from its length.
  3121. * @private
  3122. * @param {?} length
  3123. * @param {...?} overflows
  3124. * @return {?}
  3125. */
  3126. FlexibleConnectedPositionStrategy.prototype._subtractOverflows = /**
  3127. * Subtracts the amount that an element is overflowing on an axis from its length.
  3128. * @private
  3129. * @param {?} length
  3130. * @param {...?} overflows
  3131. * @return {?}
  3132. */
  3133. function (length) {
  3134. var overflows = [];
  3135. for (var _i = 1; _i < arguments.length; _i++) {
  3136. overflows[_i - 1] = arguments[_i];
  3137. }
  3138. return overflows.reduce((/**
  3139. * @param {?} currentValue
  3140. * @param {?} currentOverflow
  3141. * @return {?}
  3142. */
  3143. function (currentValue, currentOverflow) {
  3144. return currentValue - Math.max(currentOverflow, 0);
  3145. }), length);
  3146. };
  3147. /** Narrows the given viewport rect by the current _viewportMargin. */
  3148. /**
  3149. * Narrows the given viewport rect by the current _viewportMargin.
  3150. * @private
  3151. * @return {?}
  3152. */
  3153. FlexibleConnectedPositionStrategy.prototype._getNarrowedViewportRect = /**
  3154. * Narrows the given viewport rect by the current _viewportMargin.
  3155. * @private
  3156. * @return {?}
  3157. */
  3158. function () {
  3159. // We recalculate the viewport rect here ourselves, rather than using the ViewportRuler,
  3160. // because we want to use the `clientWidth` and `clientHeight` as the base. The difference
  3161. // being that the client properties don't include the scrollbar, as opposed to `innerWidth`
  3162. // and `innerHeight` that do. This is necessary, because the overlay container uses
  3163. // 100% `width` and `height` which don't include the scrollbar either.
  3164. /** @type {?} */
  3165. var width = (/** @type {?} */ (this._document.documentElement)).clientWidth;
  3166. /** @type {?} */
  3167. var height = (/** @type {?} */ (this._document.documentElement)).clientHeight;
  3168. /** @type {?} */
  3169. var scrollPosition = this._viewportRuler.getViewportScrollPosition();
  3170. return {
  3171. top: scrollPosition.top + this._viewportMargin,
  3172. left: scrollPosition.left + this._viewportMargin,
  3173. right: scrollPosition.left + width - this._viewportMargin,
  3174. bottom: scrollPosition.top + height - this._viewportMargin,
  3175. width: width - (2 * this._viewportMargin),
  3176. height: height - (2 * this._viewportMargin),
  3177. };
  3178. };
  3179. /** Whether the we're dealing with an RTL context */
  3180. /**
  3181. * Whether the we're dealing with an RTL context
  3182. * @private
  3183. * @return {?}
  3184. */
  3185. FlexibleConnectedPositionStrategy.prototype._isRtl = /**
  3186. * Whether the we're dealing with an RTL context
  3187. * @private
  3188. * @return {?}
  3189. */
  3190. function () {
  3191. return this._overlayRef.getDirection() === 'rtl';
  3192. };
  3193. /** Determines whether the overlay uses exact or flexible positioning. */
  3194. /**
  3195. * Determines whether the overlay uses exact or flexible positioning.
  3196. * @private
  3197. * @return {?}
  3198. */
  3199. FlexibleConnectedPositionStrategy.prototype._hasExactPosition = /**
  3200. * Determines whether the overlay uses exact or flexible positioning.
  3201. * @private
  3202. * @return {?}
  3203. */
  3204. function () {
  3205. return !this._hasFlexibleDimensions || this._isPushed;
  3206. };
  3207. /** Retrieves the offset of a position along the x or y axis. */
  3208. /**
  3209. * Retrieves the offset of a position along the x or y axis.
  3210. * @private
  3211. * @param {?} position
  3212. * @param {?} axis
  3213. * @return {?}
  3214. */
  3215. FlexibleConnectedPositionStrategy.prototype._getOffset = /**
  3216. * Retrieves the offset of a position along the x or y axis.
  3217. * @private
  3218. * @param {?} position
  3219. * @param {?} axis
  3220. * @return {?}
  3221. */
  3222. function (position, axis) {
  3223. if (axis === 'x') {
  3224. // We don't do something like `position['offset' + axis]` in
  3225. // order to avoid breking minifiers that rename properties.
  3226. return position.offsetX == null ? this._offsetX : position.offsetX;
  3227. }
  3228. return position.offsetY == null ? this._offsetY : position.offsetY;
  3229. };
  3230. /** Validates that the current position match the expected values. */
  3231. /**
  3232. * Validates that the current position match the expected values.
  3233. * @private
  3234. * @return {?}
  3235. */
  3236. FlexibleConnectedPositionStrategy.prototype._validatePositions = /**
  3237. * Validates that the current position match the expected values.
  3238. * @private
  3239. * @return {?}
  3240. */
  3241. function () {
  3242. if (!this._preferredPositions.length) {
  3243. throw Error('FlexibleConnectedPositionStrategy: At least one position is required.');
  3244. }
  3245. // TODO(crisbeto): remove these once Angular's template type
  3246. // checking is advanced enough to catch these cases.
  3247. this._preferredPositions.forEach((/**
  3248. * @param {?} pair
  3249. * @return {?}
  3250. */
  3251. function (pair) {
  3252. validateHorizontalPosition('originX', pair.originX);
  3253. validateVerticalPosition('originY', pair.originY);
  3254. validateHorizontalPosition('overlayX', pair.overlayX);
  3255. validateVerticalPosition('overlayY', pair.overlayY);
  3256. }));
  3257. };
  3258. /** Adds a single CSS class or an array of classes on the overlay panel. */
  3259. /**
  3260. * Adds a single CSS class or an array of classes on the overlay panel.
  3261. * @private
  3262. * @param {?} cssClasses
  3263. * @return {?}
  3264. */
  3265. FlexibleConnectedPositionStrategy.prototype._addPanelClasses = /**
  3266. * Adds a single CSS class or an array of classes on the overlay panel.
  3267. * @private
  3268. * @param {?} cssClasses
  3269. * @return {?}
  3270. */
  3271. function (cssClasses) {
  3272. var _this = this;
  3273. if (this._pane) {
  3274. coerceArray(cssClasses).forEach((/**
  3275. * @param {?} cssClass
  3276. * @return {?}
  3277. */
  3278. function (cssClass) {
  3279. if (cssClass !== '' && _this._appliedPanelClasses.indexOf(cssClass) === -1) {
  3280. _this._appliedPanelClasses.push(cssClass);
  3281. _this._pane.classList.add(cssClass);
  3282. }
  3283. }));
  3284. }
  3285. };
  3286. /** Clears the classes that the position strategy has applied from the overlay panel. */
  3287. /**
  3288. * Clears the classes that the position strategy has applied from the overlay panel.
  3289. * @private
  3290. * @return {?}
  3291. */
  3292. FlexibleConnectedPositionStrategy.prototype._clearPanelClasses = /**
  3293. * Clears the classes that the position strategy has applied from the overlay panel.
  3294. * @private
  3295. * @return {?}
  3296. */
  3297. function () {
  3298. var _this = this;
  3299. if (this._pane) {
  3300. this._appliedPanelClasses.forEach((/**
  3301. * @param {?} cssClass
  3302. * @return {?}
  3303. */
  3304. function (cssClass) {
  3305. _this._pane.classList.remove(cssClass);
  3306. }));
  3307. this._appliedPanelClasses = [];
  3308. }
  3309. };
  3310. /** Returns the ClientRect of the current origin. */
  3311. /**
  3312. * Returns the ClientRect of the current origin.
  3313. * @private
  3314. * @return {?}
  3315. */
  3316. FlexibleConnectedPositionStrategy.prototype._getOriginRect = /**
  3317. * Returns the ClientRect of the current origin.
  3318. * @private
  3319. * @return {?}
  3320. */
  3321. function () {
  3322. /** @type {?} */
  3323. var origin = this._origin;
  3324. if (origin instanceof ElementRef) {
  3325. return origin.nativeElement.getBoundingClientRect();
  3326. }
  3327. if (origin instanceof HTMLElement) {
  3328. return origin.getBoundingClientRect();
  3329. }
  3330. /** @type {?} */
  3331. var width = origin.width || 0;
  3332. /** @type {?} */
  3333. var height = origin.height || 0;
  3334. // If the origin is a point, return a client rect as if it was a 0x0 element at the point.
  3335. return {
  3336. top: origin.y,
  3337. bottom: origin.y + height,
  3338. left: origin.x,
  3339. right: origin.x + width,
  3340. height: height,
  3341. width: width
  3342. };
  3343. };
  3344. return FlexibleConnectedPositionStrategy;
  3345. }());
  3346. /**
  3347. * Shallow-extends a stylesheet object with another stylesheet object.
  3348. * @param {?} dest
  3349. * @param {?} source
  3350. * @return {?}
  3351. */
  3352. function extendStyles(dest, source) {
  3353. for (var key in source) {
  3354. if (source.hasOwnProperty(key)) {
  3355. dest[key] = source[key];
  3356. }
  3357. }
  3358. return dest;
  3359. }
  3360. /**
  3361. * @fileoverview added by tsickle
  3362. * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
  3363. */
  3364. /**
  3365. * A strategy for positioning overlays. Using this strategy, an overlay is given an
  3366. * implicit position relative to some origin element. The relative position is defined in terms of
  3367. * a point on the origin element that is connected to a point on the overlay element. For example,
  3368. * a basic dropdown is connecting the bottom-left corner of the origin to the top-left corner
  3369. * of the overlay.
  3370. * @deprecated Use `FlexibleConnectedPositionStrategy` instead.
  3371. * \@breaking-change 8.0.0
  3372. */
  3373. var /**
  3374. * A strategy for positioning overlays. Using this strategy, an overlay is given an
  3375. * implicit position relative to some origin element. The relative position is defined in terms of
  3376. * a point on the origin element that is connected to a point on the overlay element. For example,
  3377. * a basic dropdown is connecting the bottom-left corner of the origin to the top-left corner
  3378. * of the overlay.
  3379. * @deprecated Use `FlexibleConnectedPositionStrategy` instead.
  3380. * \@breaking-change 8.0.0
  3381. */
  3382. ConnectedPositionStrategy = /** @class */ (function () {
  3383. function ConnectedPositionStrategy(originPos, overlayPos, connectedTo, viewportRuler, document, platform, overlayContainer) {
  3384. /**
  3385. * Ordered list of preferred positions, from most to least desirable.
  3386. */
  3387. this._preferredPositions = [];
  3388. // Since the `ConnectedPositionStrategy` is deprecated and we don't want to maintain
  3389. // the extra logic, we create an instance of the positioning strategy that has some
  3390. // defaults that make it behave as the old position strategy and to which we'll
  3391. // proxy all of the API calls.
  3392. this._positionStrategy = new FlexibleConnectedPositionStrategy(connectedTo, viewportRuler, document, platform, overlayContainer)
  3393. .withFlexibleDimensions(false)
  3394. .withPush(false)
  3395. .withViewportMargin(0);
  3396. this.withFallbackPosition(originPos, overlayPos);
  3397. }
  3398. Object.defineProperty(ConnectedPositionStrategy.prototype, "_isRtl", {
  3399. /** Whether the we're dealing with an RTL context */
  3400. get: /**
  3401. * Whether the we're dealing with an RTL context
  3402. * @return {?}
  3403. */
  3404. function () {
  3405. return this._overlayRef.getDirection() === 'rtl';
  3406. },
  3407. enumerable: true,
  3408. configurable: true
  3409. });
  3410. Object.defineProperty(ConnectedPositionStrategy.prototype, "onPositionChange", {
  3411. /** Emits an event when the connection point changes. */
  3412. get: /**
  3413. * Emits an event when the connection point changes.
  3414. * @return {?}
  3415. */
  3416. function () {
  3417. return this._positionStrategy.positionChanges;
  3418. },
  3419. enumerable: true,
  3420. configurable: true
  3421. });
  3422. Object.defineProperty(ConnectedPositionStrategy.prototype, "positions", {
  3423. /** Ordered list of preferred positions, from most to least desirable. */
  3424. get: /**
  3425. * Ordered list of preferred positions, from most to least desirable.
  3426. * @return {?}
  3427. */
  3428. function () {
  3429. return this._preferredPositions;
  3430. },
  3431. enumerable: true,
  3432. configurable: true
  3433. });
  3434. /** Attach this position strategy to an overlay. */
  3435. /**
  3436. * Attach this position strategy to an overlay.
  3437. * @param {?} overlayRef
  3438. * @return {?}
  3439. */
  3440. ConnectedPositionStrategy.prototype.attach = /**
  3441. * Attach this position strategy to an overlay.
  3442. * @param {?} overlayRef
  3443. * @return {?}
  3444. */
  3445. function (overlayRef) {
  3446. this._overlayRef = overlayRef;
  3447. this._positionStrategy.attach(overlayRef);
  3448. if (this._direction) {
  3449. overlayRef.setDirection(this._direction);
  3450. this._direction = null;
  3451. }
  3452. };
  3453. /** Disposes all resources used by the position strategy. */
  3454. /**
  3455. * Disposes all resources used by the position strategy.
  3456. * @return {?}
  3457. */
  3458. ConnectedPositionStrategy.prototype.dispose = /**
  3459. * Disposes all resources used by the position strategy.
  3460. * @return {?}
  3461. */
  3462. function () {
  3463. this._positionStrategy.dispose();
  3464. };
  3465. /** @docs-private */
  3466. /**
  3467. * \@docs-private
  3468. * @return {?}
  3469. */
  3470. ConnectedPositionStrategy.prototype.detach = /**
  3471. * \@docs-private
  3472. * @return {?}
  3473. */
  3474. function () {
  3475. this._positionStrategy.detach();
  3476. };
  3477. /**
  3478. * Updates the position of the overlay element, using whichever preferred position relative
  3479. * to the origin fits on-screen.
  3480. * @docs-private
  3481. */
  3482. /**
  3483. * Updates the position of the overlay element, using whichever preferred position relative
  3484. * to the origin fits on-screen.
  3485. * \@docs-private
  3486. * @return {?}
  3487. */
  3488. ConnectedPositionStrategy.prototype.apply = /**
  3489. * Updates the position of the overlay element, using whichever preferred position relative
  3490. * to the origin fits on-screen.
  3491. * \@docs-private
  3492. * @return {?}
  3493. */
  3494. function () {
  3495. this._positionStrategy.apply();
  3496. };
  3497. /**
  3498. * Re-positions the overlay element with the trigger in its last calculated position,
  3499. * even if a position higher in the "preferred positions" list would now fit. This
  3500. * allows one to re-align the panel without changing the orientation of the panel.
  3501. */
  3502. /**
  3503. * Re-positions the overlay element with the trigger in its last calculated position,
  3504. * even if a position higher in the "preferred positions" list would now fit. This
  3505. * allows one to re-align the panel without changing the orientation of the panel.
  3506. * @return {?}
  3507. */
  3508. ConnectedPositionStrategy.prototype.recalculateLastPosition = /**
  3509. * Re-positions the overlay element with the trigger in its last calculated position,
  3510. * even if a position higher in the "preferred positions" list would now fit. This
  3511. * allows one to re-align the panel without changing the orientation of the panel.
  3512. * @return {?}
  3513. */
  3514. function () {
  3515. this._positionStrategy.reapplyLastPosition();
  3516. };
  3517. /**
  3518. * Sets the list of Scrollable containers that host the origin element so that
  3519. * on reposition we can evaluate if it or the overlay has been clipped or outside view. Every
  3520. * Scrollable must be an ancestor element of the strategy's origin element.
  3521. */
  3522. /**
  3523. * Sets the list of Scrollable containers that host the origin element so that
  3524. * on reposition we can evaluate if it or the overlay has been clipped or outside view. Every
  3525. * Scrollable must be an ancestor element of the strategy's origin element.
  3526. * @param {?} scrollables
  3527. * @return {?}
  3528. */
  3529. ConnectedPositionStrategy.prototype.withScrollableContainers = /**
  3530. * Sets the list of Scrollable containers that host the origin element so that
  3531. * on reposition we can evaluate if it or the overlay has been clipped or outside view. Every
  3532. * Scrollable must be an ancestor element of the strategy's origin element.
  3533. * @param {?} scrollables
  3534. * @return {?}
  3535. */
  3536. function (scrollables) {
  3537. this._positionStrategy.withScrollableContainers(scrollables);
  3538. };
  3539. /**
  3540. * Adds a new preferred fallback position.
  3541. * @param originPos
  3542. * @param overlayPos
  3543. */
  3544. /**
  3545. * Adds a new preferred fallback position.
  3546. * @template THIS
  3547. * @this {THIS}
  3548. * @param {?} originPos
  3549. * @param {?} overlayPos
  3550. * @param {?=} offsetX
  3551. * @param {?=} offsetY
  3552. * @return {THIS}
  3553. */
  3554. ConnectedPositionStrategy.prototype.withFallbackPosition = /**
  3555. * Adds a new preferred fallback position.
  3556. * @template THIS
  3557. * @this {THIS}
  3558. * @param {?} originPos
  3559. * @param {?} overlayPos
  3560. * @param {?=} offsetX
  3561. * @param {?=} offsetY
  3562. * @return {THIS}
  3563. */
  3564. function (originPos, overlayPos, offsetX, offsetY) {
  3565. /** @type {?} */
  3566. var position = new ConnectionPositionPair(originPos, overlayPos, offsetX, offsetY);
  3567. (/** @type {?} */ (this))._preferredPositions.push(position);
  3568. (/** @type {?} */ (this))._positionStrategy.withPositions((/** @type {?} */ (this))._preferredPositions);
  3569. return (/** @type {?} */ (this));
  3570. };
  3571. /**
  3572. * Sets the layout direction so the overlay's position can be adjusted to match.
  3573. * @param dir New layout direction.
  3574. */
  3575. /**
  3576. * Sets the layout direction so the overlay's position can be adjusted to match.
  3577. * @template THIS
  3578. * @this {THIS}
  3579. * @param {?} dir New layout direction.
  3580. * @return {THIS}
  3581. */
  3582. ConnectedPositionStrategy.prototype.withDirection = /**
  3583. * Sets the layout direction so the overlay's position can be adjusted to match.
  3584. * @template THIS
  3585. * @this {THIS}
  3586. * @param {?} dir New layout direction.
  3587. * @return {THIS}
  3588. */
  3589. function (dir) {
  3590. // Since the direction might be declared before the strategy is attached,
  3591. // we save the value in a temporary property and we'll transfer it to the
  3592. // overlay ref on attachment.
  3593. if ((/** @type {?} */ (this))._overlayRef) {
  3594. (/** @type {?} */ (this))._overlayRef.setDirection(dir);
  3595. }
  3596. else {
  3597. (/** @type {?} */ (this))._direction = dir;
  3598. }
  3599. return (/** @type {?} */ (this));
  3600. };
  3601. /**
  3602. * Sets an offset for the overlay's connection point on the x-axis
  3603. * @param offset New offset in the X axis.
  3604. */
  3605. /**
  3606. * Sets an offset for the overlay's connection point on the x-axis
  3607. * @template THIS
  3608. * @this {THIS}
  3609. * @param {?} offset New offset in the X axis.
  3610. * @return {THIS}
  3611. */
  3612. ConnectedPositionStrategy.prototype.withOffsetX = /**
  3613. * Sets an offset for the overlay's connection point on the x-axis
  3614. * @template THIS
  3615. * @this {THIS}
  3616. * @param {?} offset New offset in the X axis.
  3617. * @return {THIS}
  3618. */
  3619. function (offset) {
  3620. (/** @type {?} */ (this))._positionStrategy.withDefaultOffsetX(offset);
  3621. return (/** @type {?} */ (this));
  3622. };
  3623. /**
  3624. * Sets an offset for the overlay's connection point on the y-axis
  3625. * @param offset New offset in the Y axis.
  3626. */
  3627. /**
  3628. * Sets an offset for the overlay's connection point on the y-axis
  3629. * @template THIS
  3630. * @this {THIS}
  3631. * @param {?} offset New offset in the Y axis.
  3632. * @return {THIS}
  3633. */
  3634. ConnectedPositionStrategy.prototype.withOffsetY = /**
  3635. * Sets an offset for the overlay's connection point on the y-axis
  3636. * @template THIS
  3637. * @this {THIS}
  3638. * @param {?} offset New offset in the Y axis.
  3639. * @return {THIS}
  3640. */
  3641. function (offset) {
  3642. (/** @type {?} */ (this))._positionStrategy.withDefaultOffsetY(offset);
  3643. return (/** @type {?} */ (this));
  3644. };
  3645. /**
  3646. * Sets whether the overlay's position should be locked in after it is positioned
  3647. * initially. When an overlay is locked in, it won't attempt to reposition itself
  3648. * when the position is re-applied (e.g. when the user scrolls away).
  3649. * @param isLocked Whether the overlay should locked in.
  3650. */
  3651. /**
  3652. * Sets whether the overlay's position should be locked in after it is positioned
  3653. * initially. When an overlay is locked in, it won't attempt to reposition itself
  3654. * when the position is re-applied (e.g. when the user scrolls away).
  3655. * @template THIS
  3656. * @this {THIS}
  3657. * @param {?} isLocked Whether the overlay should locked in.
  3658. * @return {THIS}
  3659. */
  3660. ConnectedPositionStrategy.prototype.withLockedPosition = /**
  3661. * Sets whether the overlay's position should be locked in after it is positioned
  3662. * initially. When an overlay is locked in, it won't attempt to reposition itself
  3663. * when the position is re-applied (e.g. when the user scrolls away).
  3664. * @template THIS
  3665. * @this {THIS}
  3666. * @param {?} isLocked Whether the overlay should locked in.
  3667. * @return {THIS}
  3668. */
  3669. function (isLocked) {
  3670. (/** @type {?} */ (this))._positionStrategy.withLockedPosition(isLocked);
  3671. return (/** @type {?} */ (this));
  3672. };
  3673. /**
  3674. * Overwrites the current set of positions with an array of new ones.
  3675. * @param positions Position pairs to be set on the strategy.
  3676. */
  3677. /**
  3678. * Overwrites the current set of positions with an array of new ones.
  3679. * @template THIS
  3680. * @this {THIS}
  3681. * @param {?} positions Position pairs to be set on the strategy.
  3682. * @return {THIS}
  3683. */
  3684. ConnectedPositionStrategy.prototype.withPositions = /**
  3685. * Overwrites the current set of positions with an array of new ones.
  3686. * @template THIS
  3687. * @this {THIS}
  3688. * @param {?} positions Position pairs to be set on the strategy.
  3689. * @return {THIS}
  3690. */
  3691. function (positions) {
  3692. (/** @type {?} */ (this))._preferredPositions = positions.slice();
  3693. (/** @type {?} */ (this))._positionStrategy.withPositions((/** @type {?} */ (this))._preferredPositions);
  3694. return (/** @type {?} */ (this));
  3695. };
  3696. /**
  3697. * Sets the origin element, relative to which to position the overlay.
  3698. * @param origin Reference to the new origin element.
  3699. */
  3700. /**
  3701. * Sets the origin element, relative to which to position the overlay.
  3702. * @template THIS
  3703. * @this {THIS}
  3704. * @param {?} origin Reference to the new origin element.
  3705. * @return {THIS}
  3706. */
  3707. ConnectedPositionStrategy.prototype.setOrigin = /**
  3708. * Sets the origin element, relative to which to position the overlay.
  3709. * @template THIS
  3710. * @this {THIS}
  3711. * @param {?} origin Reference to the new origin element.
  3712. * @return {THIS}
  3713. */
  3714. function (origin) {
  3715. (/** @type {?} */ (this))._positionStrategy.setOrigin(origin);
  3716. return (/** @type {?} */ (this));
  3717. };
  3718. return ConnectedPositionStrategy;
  3719. }());
  3720. /**
  3721. * @fileoverview added by tsickle
  3722. * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
  3723. */
  3724. /**
  3725. * Class to be added to the overlay pane wrapper.
  3726. * @type {?}
  3727. */
  3728. var wrapperClass = 'cdk-global-overlay-wrapper';
  3729. /**
  3730. * A strategy for positioning overlays. Using this strategy, an overlay is given an
  3731. * explicit position relative to the browser's viewport. We use flexbox, instead of
  3732. * transforms, in order to avoid issues with subpixel rendering which can cause the
  3733. * element to become blurry.
  3734. */
  3735. var /**
  3736. * A strategy for positioning overlays. Using this strategy, an overlay is given an
  3737. * explicit position relative to the browser's viewport. We use flexbox, instead of
  3738. * transforms, in order to avoid issues with subpixel rendering which can cause the
  3739. * element to become blurry.
  3740. */
  3741. GlobalPositionStrategy = /** @class */ (function () {
  3742. function GlobalPositionStrategy() {
  3743. this._cssPosition = 'static';
  3744. this._topOffset = '';
  3745. this._bottomOffset = '';
  3746. this._leftOffset = '';
  3747. this._rightOffset = '';
  3748. this._alignItems = '';
  3749. this._justifyContent = '';
  3750. this._width = '';
  3751. this._height = '';
  3752. }
  3753. /**
  3754. * @param {?} overlayRef
  3755. * @return {?}
  3756. */
  3757. GlobalPositionStrategy.prototype.attach = /**
  3758. * @param {?} overlayRef
  3759. * @return {?}
  3760. */
  3761. function (overlayRef) {
  3762. /** @type {?} */
  3763. var config = overlayRef.getConfig();
  3764. this._overlayRef = overlayRef;
  3765. if (this._width && !config.width) {
  3766. overlayRef.updateSize({ width: this._width });
  3767. }
  3768. if (this._height && !config.height) {
  3769. overlayRef.updateSize({ height: this._height });
  3770. }
  3771. overlayRef.hostElement.classList.add(wrapperClass);
  3772. this._isDisposed = false;
  3773. };
  3774. /**
  3775. * Sets the top position of the overlay. Clears any previously set vertical position.
  3776. * @param value New top offset.
  3777. */
  3778. /**
  3779. * Sets the top position of the overlay. Clears any previously set vertical position.
  3780. * @template THIS
  3781. * @this {THIS}
  3782. * @param {?=} value New top offset.
  3783. * @return {THIS}
  3784. */
  3785. GlobalPositionStrategy.prototype.top = /**
  3786. * Sets the top position of the overlay. Clears any previously set vertical position.
  3787. * @template THIS
  3788. * @this {THIS}
  3789. * @param {?=} value New top offset.
  3790. * @return {THIS}
  3791. */
  3792. function (value) {
  3793. if (value === void 0) { value = ''; }
  3794. (/** @type {?} */ (this))._bottomOffset = '';
  3795. (/** @type {?} */ (this))._topOffset = value;
  3796. (/** @type {?} */ (this))._alignItems = 'flex-start';
  3797. return (/** @type {?} */ (this));
  3798. };
  3799. /**
  3800. * Sets the left position of the overlay. Clears any previously set horizontal position.
  3801. * @param value New left offset.
  3802. */
  3803. /**
  3804. * Sets the left position of the overlay. Clears any previously set horizontal position.
  3805. * @template THIS
  3806. * @this {THIS}
  3807. * @param {?=} value New left offset.
  3808. * @return {THIS}
  3809. */
  3810. GlobalPositionStrategy.prototype.left = /**
  3811. * Sets the left position of the overlay. Clears any previously set horizontal position.
  3812. * @template THIS
  3813. * @this {THIS}
  3814. * @param {?=} value New left offset.
  3815. * @return {THIS}
  3816. */
  3817. function (value) {
  3818. if (value === void 0) { value = ''; }
  3819. (/** @type {?} */ (this))._rightOffset = '';
  3820. (/** @type {?} */ (this))._leftOffset = value;
  3821. (/** @type {?} */ (this))._justifyContent = 'flex-start';
  3822. return (/** @type {?} */ (this));
  3823. };
  3824. /**
  3825. * Sets the bottom position of the overlay. Clears any previously set vertical position.
  3826. * @param value New bottom offset.
  3827. */
  3828. /**
  3829. * Sets the bottom position of the overlay. Clears any previously set vertical position.
  3830. * @template THIS
  3831. * @this {THIS}
  3832. * @param {?=} value New bottom offset.
  3833. * @return {THIS}
  3834. */
  3835. GlobalPositionStrategy.prototype.bottom = /**
  3836. * Sets the bottom position of the overlay. Clears any previously set vertical position.
  3837. * @template THIS
  3838. * @this {THIS}
  3839. * @param {?=} value New bottom offset.
  3840. * @return {THIS}
  3841. */
  3842. function (value) {
  3843. if (value === void 0) { value = ''; }
  3844. (/** @type {?} */ (this))._topOffset = '';
  3845. (/** @type {?} */ (this))._bottomOffset = value;
  3846. (/** @type {?} */ (this))._alignItems = 'flex-end';
  3847. return (/** @type {?} */ (this));
  3848. };
  3849. /**
  3850. * Sets the right position of the overlay. Clears any previously set horizontal position.
  3851. * @param value New right offset.
  3852. */
  3853. /**
  3854. * Sets the right position of the overlay. Clears any previously set horizontal position.
  3855. * @template THIS
  3856. * @this {THIS}
  3857. * @param {?=} value New right offset.
  3858. * @return {THIS}
  3859. */
  3860. GlobalPositionStrategy.prototype.right = /**
  3861. * Sets the right position of the overlay. Clears any previously set horizontal position.
  3862. * @template THIS
  3863. * @this {THIS}
  3864. * @param {?=} value New right offset.
  3865. * @return {THIS}
  3866. */
  3867. function (value) {
  3868. if (value === void 0) { value = ''; }
  3869. (/** @type {?} */ (this))._leftOffset = '';
  3870. (/** @type {?} */ (this))._rightOffset = value;
  3871. (/** @type {?} */ (this))._justifyContent = 'flex-end';
  3872. return (/** @type {?} */ (this));
  3873. };
  3874. /**
  3875. * Sets the overlay width and clears any previously set width.
  3876. * @param value New width for the overlay
  3877. * @deprecated Pass the `width` through the `OverlayConfig`.
  3878. * @breaking-change 8.0.0
  3879. */
  3880. /**
  3881. * Sets the overlay width and clears any previously set width.
  3882. * @deprecated Pass the `width` through the `OverlayConfig`.
  3883. * \@breaking-change 8.0.0
  3884. * @template THIS
  3885. * @this {THIS}
  3886. * @param {?=} value New width for the overlay
  3887. * @return {THIS}
  3888. */
  3889. GlobalPositionStrategy.prototype.width = /**
  3890. * Sets the overlay width and clears any previously set width.
  3891. * @deprecated Pass the `width` through the `OverlayConfig`.
  3892. * \@breaking-change 8.0.0
  3893. * @template THIS
  3894. * @this {THIS}
  3895. * @param {?=} value New width for the overlay
  3896. * @return {THIS}
  3897. */
  3898. function (value) {
  3899. if (value === void 0) { value = ''; }
  3900. if ((/** @type {?} */ (this))._overlayRef) {
  3901. (/** @type {?} */ (this))._overlayRef.updateSize({ width: value });
  3902. }
  3903. else {
  3904. (/** @type {?} */ (this))._width = value;
  3905. }
  3906. return (/** @type {?} */ (this));
  3907. };
  3908. /**
  3909. * Sets the overlay height and clears any previously set height.
  3910. * @param value New height for the overlay
  3911. * @deprecated Pass the `height` through the `OverlayConfig`.
  3912. * @breaking-change 8.0.0
  3913. */
  3914. /**
  3915. * Sets the overlay height and clears any previously set height.
  3916. * @deprecated Pass the `height` through the `OverlayConfig`.
  3917. * \@breaking-change 8.0.0
  3918. * @template THIS
  3919. * @this {THIS}
  3920. * @param {?=} value New height for the overlay
  3921. * @return {THIS}
  3922. */
  3923. GlobalPositionStrategy.prototype.height = /**
  3924. * Sets the overlay height and clears any previously set height.
  3925. * @deprecated Pass the `height` through the `OverlayConfig`.
  3926. * \@breaking-change 8.0.0
  3927. * @template THIS
  3928. * @this {THIS}
  3929. * @param {?=} value New height for the overlay
  3930. * @return {THIS}
  3931. */
  3932. function (value) {
  3933. if (value === void 0) { value = ''; }
  3934. if ((/** @type {?} */ (this))._overlayRef) {
  3935. (/** @type {?} */ (this))._overlayRef.updateSize({ height: value });
  3936. }
  3937. else {
  3938. (/** @type {?} */ (this))._height = value;
  3939. }
  3940. return (/** @type {?} */ (this));
  3941. };
  3942. /**
  3943. * Centers the overlay horizontally with an optional offset.
  3944. * Clears any previously set horizontal position.
  3945. *
  3946. * @param offset Overlay offset from the horizontal center.
  3947. */
  3948. /**
  3949. * Centers the overlay horizontally with an optional offset.
  3950. * Clears any previously set horizontal position.
  3951. *
  3952. * @template THIS
  3953. * @this {THIS}
  3954. * @param {?=} offset Overlay offset from the horizontal center.
  3955. * @return {THIS}
  3956. */
  3957. GlobalPositionStrategy.prototype.centerHorizontally = /**
  3958. * Centers the overlay horizontally with an optional offset.
  3959. * Clears any previously set horizontal position.
  3960. *
  3961. * @template THIS
  3962. * @this {THIS}
  3963. * @param {?=} offset Overlay offset from the horizontal center.
  3964. * @return {THIS}
  3965. */
  3966. function (offset) {
  3967. if (offset === void 0) { offset = ''; }
  3968. (/** @type {?} */ (this)).left(offset);
  3969. (/** @type {?} */ (this))._justifyContent = 'center';
  3970. return (/** @type {?} */ (this));
  3971. };
  3972. /**
  3973. * Centers the overlay vertically with an optional offset.
  3974. * Clears any previously set vertical position.
  3975. *
  3976. * @param offset Overlay offset from the vertical center.
  3977. */
  3978. /**
  3979. * Centers the overlay vertically with an optional offset.
  3980. * Clears any previously set vertical position.
  3981. *
  3982. * @template THIS
  3983. * @this {THIS}
  3984. * @param {?=} offset Overlay offset from the vertical center.
  3985. * @return {THIS}
  3986. */
  3987. GlobalPositionStrategy.prototype.centerVertically = /**
  3988. * Centers the overlay vertically with an optional offset.
  3989. * Clears any previously set vertical position.
  3990. *
  3991. * @template THIS
  3992. * @this {THIS}
  3993. * @param {?=} offset Overlay offset from the vertical center.
  3994. * @return {THIS}
  3995. */
  3996. function (offset) {
  3997. if (offset === void 0) { offset = ''; }
  3998. (/** @type {?} */ (this)).top(offset);
  3999. (/** @type {?} */ (this))._alignItems = 'center';
  4000. return (/** @type {?} */ (this));
  4001. };
  4002. /**
  4003. * Apply the position to the element.
  4004. * @docs-private
  4005. */
  4006. /**
  4007. * Apply the position to the element.
  4008. * \@docs-private
  4009. * @return {?}
  4010. */
  4011. GlobalPositionStrategy.prototype.apply = /**
  4012. * Apply the position to the element.
  4013. * \@docs-private
  4014. * @return {?}
  4015. */
  4016. function () {
  4017. // Since the overlay ref applies the strategy asynchronously, it could
  4018. // have been disposed before it ends up being applied. If that is the
  4019. // case, we shouldn't do anything.
  4020. if (!this._overlayRef || !this._overlayRef.hasAttached()) {
  4021. return;
  4022. }
  4023. /** @type {?} */
  4024. var styles = this._overlayRef.overlayElement.style;
  4025. /** @type {?} */
  4026. var parentStyles = this._overlayRef.hostElement.style;
  4027. /** @type {?} */
  4028. var config = this._overlayRef.getConfig();
  4029. styles.position = this._cssPosition;
  4030. styles.marginLeft = config.width === '100%' ? '0' : this._leftOffset;
  4031. styles.marginTop = config.height === '100%' ? '0' : this._topOffset;
  4032. styles.marginBottom = this._bottomOffset;
  4033. styles.marginRight = this._rightOffset;
  4034. if (config.width === '100%') {
  4035. parentStyles.justifyContent = 'flex-start';
  4036. }
  4037. else if (this._justifyContent === 'center') {
  4038. parentStyles.justifyContent = 'center';
  4039. }
  4040. else if (this._overlayRef.getConfig().direction === 'rtl') {
  4041. // In RTL the browser will invert `flex-start` and `flex-end` automatically, but we
  4042. // don't want that because our positioning is explicitly `left` and `right`, hence
  4043. // why we do another inversion to ensure that the overlay stays in the same position.
  4044. // TODO: reconsider this if we add `start` and `end` methods.
  4045. if (this._justifyContent === 'flex-start') {
  4046. parentStyles.justifyContent = 'flex-end';
  4047. }
  4048. else if (this._justifyContent === 'flex-end') {
  4049. parentStyles.justifyContent = 'flex-start';
  4050. }
  4051. }
  4052. else {
  4053. parentStyles.justifyContent = this._justifyContent;
  4054. }
  4055. parentStyles.alignItems = config.height === '100%' ? 'flex-start' : this._alignItems;
  4056. };
  4057. /**
  4058. * Cleans up the DOM changes from the position strategy.
  4059. * @docs-private
  4060. */
  4061. /**
  4062. * Cleans up the DOM changes from the position strategy.
  4063. * \@docs-private
  4064. * @return {?}
  4065. */
  4066. GlobalPositionStrategy.prototype.dispose = /**
  4067. * Cleans up the DOM changes from the position strategy.
  4068. * \@docs-private
  4069. * @return {?}
  4070. */
  4071. function () {
  4072. if (this._isDisposed || !this._overlayRef) {
  4073. return;
  4074. }
  4075. /** @type {?} */
  4076. var styles = this._overlayRef.overlayElement.style;
  4077. /** @type {?} */
  4078. var parent = this._overlayRef.hostElement;
  4079. /** @type {?} */
  4080. var parentStyles = parent.style;
  4081. parent.classList.remove(wrapperClass);
  4082. parentStyles.justifyContent = parentStyles.alignItems = styles.marginTop =
  4083. styles.marginBottom = styles.marginLeft = styles.marginRight = styles.position = '';
  4084. this._overlayRef = (/** @type {?} */ (null));
  4085. this._isDisposed = true;
  4086. };
  4087. return GlobalPositionStrategy;
  4088. }());
  4089. /**
  4090. * @fileoverview added by tsickle
  4091. * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
  4092. */
  4093. /**
  4094. * Builder for overlay position strategy.
  4095. */
  4096. var OverlayPositionBuilder = /** @class */ (function () {
  4097. function OverlayPositionBuilder(_viewportRuler, _document, _platform, _overlayContainer) {
  4098. this._viewportRuler = _viewportRuler;
  4099. this._document = _document;
  4100. this._platform = _platform;
  4101. this._overlayContainer = _overlayContainer;
  4102. }
  4103. /**
  4104. * Creates a global position strategy.
  4105. */
  4106. /**
  4107. * Creates a global position strategy.
  4108. * @return {?}
  4109. */
  4110. OverlayPositionBuilder.prototype.global = /**
  4111. * Creates a global position strategy.
  4112. * @return {?}
  4113. */
  4114. function () {
  4115. return new GlobalPositionStrategy();
  4116. };
  4117. /**
  4118. * Creates a relative position strategy.
  4119. * @param elementRef
  4120. * @param originPos
  4121. * @param overlayPos
  4122. * @deprecated Use `flexibleConnectedTo` instead.
  4123. * @breaking-change 8.0.0
  4124. */
  4125. /**
  4126. * Creates a relative position strategy.
  4127. * @deprecated Use `flexibleConnectedTo` instead.
  4128. * \@breaking-change 8.0.0
  4129. * @param {?} elementRef
  4130. * @param {?} originPos
  4131. * @param {?} overlayPos
  4132. * @return {?}
  4133. */
  4134. OverlayPositionBuilder.prototype.connectedTo = /**
  4135. * Creates a relative position strategy.
  4136. * @deprecated Use `flexibleConnectedTo` instead.
  4137. * \@breaking-change 8.0.0
  4138. * @param {?} elementRef
  4139. * @param {?} originPos
  4140. * @param {?} overlayPos
  4141. * @return {?}
  4142. */
  4143. function (elementRef, originPos, overlayPos) {
  4144. return new ConnectedPositionStrategy(originPos, overlayPos, elementRef, this._viewportRuler, this._document, this._platform, this._overlayContainer);
  4145. };
  4146. /**
  4147. * Creates a flexible position strategy.
  4148. * @param origin Origin relative to which to position the overlay.
  4149. */
  4150. /**
  4151. * Creates a flexible position strategy.
  4152. * @param {?} origin Origin relative to which to position the overlay.
  4153. * @return {?}
  4154. */
  4155. OverlayPositionBuilder.prototype.flexibleConnectedTo = /**
  4156. * Creates a flexible position strategy.
  4157. * @param {?} origin Origin relative to which to position the overlay.
  4158. * @return {?}
  4159. */
  4160. function (origin) {
  4161. return new FlexibleConnectedPositionStrategy(origin, this._viewportRuler, this._document, this._platform, this._overlayContainer);
  4162. };
  4163. OverlayPositionBuilder.decorators = [
  4164. { type: Injectable, args: [{ providedIn: 'root' },] },
  4165. ];
  4166. /** @nocollapse */
  4167. OverlayPositionBuilder.ctorParameters = function () { return [
  4168. { type: ViewportRuler },
  4169. { type: undefined, decorators: [{ type: Inject, args: [DOCUMENT,] }] },
  4170. { type: Platform },
  4171. { type: OverlayContainer }
  4172. ]; };
  4173. /** @nocollapse */ OverlayPositionBuilder.ngInjectableDef = ɵɵdefineInjectable({ factory: function OverlayPositionBuilder_Factory() { return new OverlayPositionBuilder(ɵɵinject(ViewportRuler), ɵɵinject(DOCUMENT), ɵɵinject(Platform), ɵɵinject(OverlayContainer)); }, token: OverlayPositionBuilder, providedIn: "root" });
  4174. return OverlayPositionBuilder;
  4175. }());
  4176. /**
  4177. * @fileoverview added by tsickle
  4178. * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
  4179. */
  4180. /**
  4181. * Next overlay unique ID.
  4182. * @type {?}
  4183. */
  4184. var nextUniqueId = 0;
  4185. // Note that Overlay is *not* scoped to the app root because the ComponentFactoryResolver
  4186. // it needs is different based on where OverlayModule is imported.
  4187. /**
  4188. * Service to create Overlays. Overlays are dynamically added pieces of floating UI, meant to be
  4189. * used as a low-level building block for other components. Dialogs, tooltips, menus,
  4190. * selects, etc. can all be built using overlays. The service should primarily be used by authors
  4191. * of re-usable components rather than developers building end-user applications.
  4192. *
  4193. * An overlay *is* a PortalOutlet, so any kind of Portal can be loaded into one.
  4194. */
  4195. var Overlay = /** @class */ (function () {
  4196. function Overlay(scrollStrategies, _overlayContainer, _componentFactoryResolver, _positionBuilder, _keyboardDispatcher, _injector, _ngZone, _document, _directionality, _location) {
  4197. this.scrollStrategies = scrollStrategies;
  4198. this._overlayContainer = _overlayContainer;
  4199. this._componentFactoryResolver = _componentFactoryResolver;
  4200. this._positionBuilder = _positionBuilder;
  4201. this._keyboardDispatcher = _keyboardDispatcher;
  4202. this._injector = _injector;
  4203. this._ngZone = _ngZone;
  4204. this._document = _document;
  4205. this._directionality = _directionality;
  4206. this._location = _location;
  4207. }
  4208. /**
  4209. * Creates an overlay.
  4210. * @param config Configuration applied to the overlay.
  4211. * @returns Reference to the created overlay.
  4212. */
  4213. /**
  4214. * Creates an overlay.
  4215. * @param {?=} config Configuration applied to the overlay.
  4216. * @return {?} Reference to the created overlay.
  4217. */
  4218. Overlay.prototype.create = /**
  4219. * Creates an overlay.
  4220. * @param {?=} config Configuration applied to the overlay.
  4221. * @return {?} Reference to the created overlay.
  4222. */
  4223. function (config) {
  4224. /** @type {?} */
  4225. var host = this._createHostElement();
  4226. /** @type {?} */
  4227. var pane = this._createPaneElement(host);
  4228. /** @type {?} */
  4229. var portalOutlet = this._createPortalOutlet(pane);
  4230. /** @type {?} */
  4231. var overlayConfig = new OverlayConfig(config);
  4232. overlayConfig.direction = overlayConfig.direction || this._directionality.value;
  4233. return new OverlayRef(portalOutlet, host, pane, overlayConfig, this._ngZone, this._keyboardDispatcher, this._document, this._location);
  4234. };
  4235. /**
  4236. * Gets a position builder that can be used, via fluent API,
  4237. * to construct and configure a position strategy.
  4238. * @returns An overlay position builder.
  4239. */
  4240. /**
  4241. * Gets a position builder that can be used, via fluent API,
  4242. * to construct and configure a position strategy.
  4243. * @return {?} An overlay position builder.
  4244. */
  4245. Overlay.prototype.position = /**
  4246. * Gets a position builder that can be used, via fluent API,
  4247. * to construct and configure a position strategy.
  4248. * @return {?} An overlay position builder.
  4249. */
  4250. function () {
  4251. return this._positionBuilder;
  4252. };
  4253. /**
  4254. * Creates the DOM element for an overlay and appends it to the overlay container.
  4255. * @returns Newly-created pane element
  4256. */
  4257. /**
  4258. * Creates the DOM element for an overlay and appends it to the overlay container.
  4259. * @private
  4260. * @param {?} host
  4261. * @return {?} Newly-created pane element
  4262. */
  4263. Overlay.prototype._createPaneElement = /**
  4264. * Creates the DOM element for an overlay and appends it to the overlay container.
  4265. * @private
  4266. * @param {?} host
  4267. * @return {?} Newly-created pane element
  4268. */
  4269. function (host) {
  4270. /** @type {?} */
  4271. var pane = this._document.createElement('div');
  4272. pane.id = "cdk-overlay-" + nextUniqueId++;
  4273. pane.classList.add('cdk-overlay-pane');
  4274. host.appendChild(pane);
  4275. return pane;
  4276. };
  4277. /**
  4278. * Creates the host element that wraps around an overlay
  4279. * and can be used for advanced positioning.
  4280. * @returns Newly-create host element.
  4281. */
  4282. /**
  4283. * Creates the host element that wraps around an overlay
  4284. * and can be used for advanced positioning.
  4285. * @private
  4286. * @return {?} Newly-create host element.
  4287. */
  4288. Overlay.prototype._createHostElement = /**
  4289. * Creates the host element that wraps around an overlay
  4290. * and can be used for advanced positioning.
  4291. * @private
  4292. * @return {?} Newly-create host element.
  4293. */
  4294. function () {
  4295. /** @type {?} */
  4296. var host = this._document.createElement('div');
  4297. this._overlayContainer.getContainerElement().appendChild(host);
  4298. return host;
  4299. };
  4300. /**
  4301. * Create a DomPortalOutlet into which the overlay content can be loaded.
  4302. * @param pane The DOM element to turn into a portal outlet.
  4303. * @returns A portal outlet for the given DOM element.
  4304. */
  4305. /**
  4306. * Create a DomPortalOutlet into which the overlay content can be loaded.
  4307. * @private
  4308. * @param {?} pane The DOM element to turn into a portal outlet.
  4309. * @return {?} A portal outlet for the given DOM element.
  4310. */
  4311. Overlay.prototype._createPortalOutlet = /**
  4312. * Create a DomPortalOutlet into which the overlay content can be loaded.
  4313. * @private
  4314. * @param {?} pane The DOM element to turn into a portal outlet.
  4315. * @return {?} A portal outlet for the given DOM element.
  4316. */
  4317. function (pane) {
  4318. // We have to resolve the ApplicationRef later in order to allow people
  4319. // to use overlay-based providers during app initialization.
  4320. if (!this._appRef) {
  4321. this._appRef = this._injector.get(ApplicationRef);
  4322. }
  4323. return new DomPortalOutlet(pane, this._componentFactoryResolver, this._appRef, this._injector);
  4324. };
  4325. Overlay.decorators = [
  4326. { type: Injectable },
  4327. ];
  4328. /** @nocollapse */
  4329. Overlay.ctorParameters = function () { return [
  4330. { type: ScrollStrategyOptions },
  4331. { type: OverlayContainer },
  4332. { type: ComponentFactoryResolver },
  4333. { type: OverlayPositionBuilder },
  4334. { type: OverlayKeyboardDispatcher },
  4335. { type: Injector },
  4336. { type: NgZone },
  4337. { type: undefined, decorators: [{ type: Inject, args: [DOCUMENT,] }] },
  4338. { type: Directionality },
  4339. { type: Location, decorators: [{ type: Optional }] }
  4340. ]; };
  4341. return Overlay;
  4342. }());
  4343. /**
  4344. * @fileoverview added by tsickle
  4345. * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
  4346. */
  4347. /**
  4348. * Default set of positions for the overlay. Follows the behavior of a dropdown.
  4349. * @type {?}
  4350. */
  4351. var defaultPositionList = [
  4352. {
  4353. originX: 'start',
  4354. originY: 'bottom',
  4355. overlayX: 'start',
  4356. overlayY: 'top'
  4357. },
  4358. {
  4359. originX: 'start',
  4360. originY: 'top',
  4361. overlayX: 'start',
  4362. overlayY: 'bottom'
  4363. },
  4364. {
  4365. originX: 'end',
  4366. originY: 'top',
  4367. overlayX: 'end',
  4368. overlayY: 'bottom'
  4369. },
  4370. {
  4371. originX: 'end',
  4372. originY: 'bottom',
  4373. overlayX: 'end',
  4374. overlayY: 'top'
  4375. }
  4376. ];
  4377. /**
  4378. * Injection token that determines the scroll handling while the connected overlay is open.
  4379. * @type {?}
  4380. */
  4381. var CDK_CONNECTED_OVERLAY_SCROLL_STRATEGY = new InjectionToken('cdk-connected-overlay-scroll-strategy');
  4382. /**
  4383. * Directive applied to an element to make it usable as an origin for an Overlay using a
  4384. * ConnectedPositionStrategy.
  4385. */
  4386. var CdkOverlayOrigin = /** @class */ (function () {
  4387. function CdkOverlayOrigin(elementRef) {
  4388. this.elementRef = elementRef;
  4389. }
  4390. CdkOverlayOrigin.decorators = [
  4391. { type: Directive, args: [{
  4392. selector: '[cdk-overlay-origin], [overlay-origin], [cdkOverlayOrigin]',
  4393. exportAs: 'cdkOverlayOrigin',
  4394. },] },
  4395. ];
  4396. /** @nocollapse */
  4397. CdkOverlayOrigin.ctorParameters = function () { return [
  4398. { type: ElementRef }
  4399. ]; };
  4400. return CdkOverlayOrigin;
  4401. }());
  4402. /**
  4403. * Directive to facilitate declarative creation of an
  4404. * Overlay using a FlexibleConnectedPositionStrategy.
  4405. */
  4406. var CdkConnectedOverlay = /** @class */ (function () {
  4407. // TODO(jelbourn): inputs for size, scroll behavior, animation, etc.
  4408. function CdkConnectedOverlay(_overlay, templateRef, viewContainerRef, scrollStrategyFactory, _dir) {
  4409. this._overlay = _overlay;
  4410. this._dir = _dir;
  4411. this._hasBackdrop = false;
  4412. this._lockPosition = false;
  4413. this._growAfterOpen = false;
  4414. this._flexibleDimensions = false;
  4415. this._push = false;
  4416. this._backdropSubscription = Subscription.EMPTY;
  4417. /**
  4418. * Margin between the overlay and the viewport edges.
  4419. */
  4420. this.viewportMargin = 0;
  4421. /**
  4422. * Whether the overlay is open.
  4423. */
  4424. this.open = false;
  4425. /**
  4426. * Event emitted when the backdrop is clicked.
  4427. */
  4428. this.backdropClick = new EventEmitter();
  4429. /**
  4430. * Event emitted when the position has changed.
  4431. */
  4432. this.positionChange = new EventEmitter();
  4433. /**
  4434. * Event emitted when the overlay has been attached.
  4435. */
  4436. this.attach = new EventEmitter();
  4437. /**
  4438. * Event emitted when the overlay has been detached.
  4439. */
  4440. this.detach = new EventEmitter();
  4441. /**
  4442. * Emits when there are keyboard events that are targeted at the overlay.
  4443. */
  4444. this.overlayKeydown = new EventEmitter();
  4445. this._templatePortal = new TemplatePortal(templateRef, viewContainerRef);
  4446. this._scrollStrategyFactory = scrollStrategyFactory;
  4447. this.scrollStrategy = this._scrollStrategyFactory();
  4448. }
  4449. Object.defineProperty(CdkConnectedOverlay.prototype, "offsetX", {
  4450. /** The offset in pixels for the overlay connection point on the x-axis */
  4451. get: /**
  4452. * The offset in pixels for the overlay connection point on the x-axis
  4453. * @return {?}
  4454. */
  4455. function () { return this._offsetX; },
  4456. set: /**
  4457. * @param {?} offsetX
  4458. * @return {?}
  4459. */
  4460. function (offsetX) {
  4461. this._offsetX = offsetX;
  4462. if (this._position) {
  4463. this._updatePositionStrategy(this._position);
  4464. }
  4465. },
  4466. enumerable: true,
  4467. configurable: true
  4468. });
  4469. Object.defineProperty(CdkConnectedOverlay.prototype, "offsetY", {
  4470. /** The offset in pixels for the overlay connection point on the y-axis */
  4471. get: /**
  4472. * The offset in pixels for the overlay connection point on the y-axis
  4473. * @return {?}
  4474. */
  4475. function () { return this._offsetY; },
  4476. set: /**
  4477. * @param {?} offsetY
  4478. * @return {?}
  4479. */
  4480. function (offsetY) {
  4481. this._offsetY = offsetY;
  4482. if (this._position) {
  4483. this._updatePositionStrategy(this._position);
  4484. }
  4485. },
  4486. enumerable: true,
  4487. configurable: true
  4488. });
  4489. Object.defineProperty(CdkConnectedOverlay.prototype, "hasBackdrop", {
  4490. /** Whether or not the overlay should attach a backdrop. */
  4491. get: /**
  4492. * Whether or not the overlay should attach a backdrop.
  4493. * @return {?}
  4494. */
  4495. function () { return this._hasBackdrop; },
  4496. set: /**
  4497. * @param {?} value
  4498. * @return {?}
  4499. */
  4500. function (value) { this._hasBackdrop = coerceBooleanProperty(value); },
  4501. enumerable: true,
  4502. configurable: true
  4503. });
  4504. Object.defineProperty(CdkConnectedOverlay.prototype, "lockPosition", {
  4505. /** Whether or not the overlay should be locked when scrolling. */
  4506. get: /**
  4507. * Whether or not the overlay should be locked when scrolling.
  4508. * @return {?}
  4509. */
  4510. function () { return this._lockPosition; },
  4511. set: /**
  4512. * @param {?} value
  4513. * @return {?}
  4514. */
  4515. function (value) { this._lockPosition = coerceBooleanProperty(value); },
  4516. enumerable: true,
  4517. configurable: true
  4518. });
  4519. Object.defineProperty(CdkConnectedOverlay.prototype, "flexibleDimensions", {
  4520. /** Whether the overlay's width and height can be constrained to fit within the viewport. */
  4521. get: /**
  4522. * Whether the overlay's width and height can be constrained to fit within the viewport.
  4523. * @return {?}
  4524. */
  4525. function () { return this._flexibleDimensions; },
  4526. set: /**
  4527. * @param {?} value
  4528. * @return {?}
  4529. */
  4530. function (value) {
  4531. this._flexibleDimensions = coerceBooleanProperty(value);
  4532. },
  4533. enumerable: true,
  4534. configurable: true
  4535. });
  4536. Object.defineProperty(CdkConnectedOverlay.prototype, "growAfterOpen", {
  4537. /** Whether the overlay can grow after the initial open when flexible positioning is turned on. */
  4538. get: /**
  4539. * Whether the overlay can grow after the initial open when flexible positioning is turned on.
  4540. * @return {?}
  4541. */
  4542. function () { return this._growAfterOpen; },
  4543. set: /**
  4544. * @param {?} value
  4545. * @return {?}
  4546. */
  4547. function (value) { this._growAfterOpen = coerceBooleanProperty(value); },
  4548. enumerable: true,
  4549. configurable: true
  4550. });
  4551. Object.defineProperty(CdkConnectedOverlay.prototype, "push", {
  4552. /** Whether the overlay can be pushed on-screen if none of the provided positions fit. */
  4553. get: /**
  4554. * Whether the overlay can be pushed on-screen if none of the provided positions fit.
  4555. * @return {?}
  4556. */
  4557. function () { return this._push; },
  4558. set: /**
  4559. * @param {?} value
  4560. * @return {?}
  4561. */
  4562. function (value) { this._push = coerceBooleanProperty(value); },
  4563. enumerable: true,
  4564. configurable: true
  4565. });
  4566. Object.defineProperty(CdkConnectedOverlay.prototype, "overlayRef", {
  4567. /** The associated overlay reference. */
  4568. get: /**
  4569. * The associated overlay reference.
  4570. * @return {?}
  4571. */
  4572. function () {
  4573. return this._overlayRef;
  4574. },
  4575. enumerable: true,
  4576. configurable: true
  4577. });
  4578. Object.defineProperty(CdkConnectedOverlay.prototype, "dir", {
  4579. /** The element's layout direction. */
  4580. get: /**
  4581. * The element's layout direction.
  4582. * @return {?}
  4583. */
  4584. function () {
  4585. return this._dir ? this._dir.value : 'ltr';
  4586. },
  4587. enumerable: true,
  4588. configurable: true
  4589. });
  4590. /**
  4591. * @return {?}
  4592. */
  4593. CdkConnectedOverlay.prototype.ngOnDestroy = /**
  4594. * @return {?}
  4595. */
  4596. function () {
  4597. if (this._overlayRef) {
  4598. this._overlayRef.dispose();
  4599. }
  4600. this._backdropSubscription.unsubscribe();
  4601. };
  4602. /**
  4603. * @param {?} changes
  4604. * @return {?}
  4605. */
  4606. CdkConnectedOverlay.prototype.ngOnChanges = /**
  4607. * @param {?} changes
  4608. * @return {?}
  4609. */
  4610. function (changes) {
  4611. if (this._position) {
  4612. this._updatePositionStrategy(this._position);
  4613. this._overlayRef.updateSize({
  4614. width: this.width,
  4615. minWidth: this.minWidth,
  4616. height: this.height,
  4617. minHeight: this.minHeight,
  4618. });
  4619. if (changes['origin'] && this.open) {
  4620. this._position.apply();
  4621. }
  4622. }
  4623. if (changes['open']) {
  4624. this.open ? this._attachOverlay() : this._detachOverlay();
  4625. }
  4626. };
  4627. /** Creates an overlay */
  4628. /**
  4629. * Creates an overlay
  4630. * @private
  4631. * @return {?}
  4632. */
  4633. CdkConnectedOverlay.prototype._createOverlay = /**
  4634. * Creates an overlay
  4635. * @private
  4636. * @return {?}
  4637. */
  4638. function () {
  4639. var _this = this;
  4640. if (!this.positions || !this.positions.length) {
  4641. this.positions = defaultPositionList;
  4642. }
  4643. this._overlayRef = this._overlay.create(this._buildConfig());
  4644. this._overlayRef.keydownEvents().subscribe((/**
  4645. * @param {?} event
  4646. * @return {?}
  4647. */
  4648. function (event) {
  4649. _this.overlayKeydown.next(event);
  4650. if (event.keyCode === ESCAPE && !hasModifierKey(event)) {
  4651. event.preventDefault();
  4652. _this._detachOverlay();
  4653. }
  4654. }));
  4655. };
  4656. /** Builds the overlay config based on the directive's inputs */
  4657. /**
  4658. * Builds the overlay config based on the directive's inputs
  4659. * @private
  4660. * @return {?}
  4661. */
  4662. CdkConnectedOverlay.prototype._buildConfig = /**
  4663. * Builds the overlay config based on the directive's inputs
  4664. * @private
  4665. * @return {?}
  4666. */
  4667. function () {
  4668. /** @type {?} */
  4669. var positionStrategy = this._position = this._createPositionStrategy();
  4670. /** @type {?} */
  4671. var overlayConfig = new OverlayConfig({
  4672. direction: this._dir,
  4673. positionStrategy: positionStrategy,
  4674. scrollStrategy: this.scrollStrategy,
  4675. hasBackdrop: this.hasBackdrop
  4676. });
  4677. if (this.width || this.width === 0) {
  4678. overlayConfig.width = this.width;
  4679. }
  4680. if (this.height || this.height === 0) {
  4681. overlayConfig.height = this.height;
  4682. }
  4683. if (this.minWidth || this.minWidth === 0) {
  4684. overlayConfig.minWidth = this.minWidth;
  4685. }
  4686. if (this.minHeight || this.minHeight === 0) {
  4687. overlayConfig.minHeight = this.minHeight;
  4688. }
  4689. if (this.backdropClass) {
  4690. overlayConfig.backdropClass = this.backdropClass;
  4691. }
  4692. if (this.panelClass) {
  4693. overlayConfig.panelClass = this.panelClass;
  4694. }
  4695. return overlayConfig;
  4696. };
  4697. /** Updates the state of a position strategy, based on the values of the directive inputs. */
  4698. /**
  4699. * Updates the state of a position strategy, based on the values of the directive inputs.
  4700. * @private
  4701. * @param {?} positionStrategy
  4702. * @return {?}
  4703. */
  4704. CdkConnectedOverlay.prototype._updatePositionStrategy = /**
  4705. * Updates the state of a position strategy, based on the values of the directive inputs.
  4706. * @private
  4707. * @param {?} positionStrategy
  4708. * @return {?}
  4709. */
  4710. function (positionStrategy) {
  4711. var _this = this;
  4712. /** @type {?} */
  4713. var positions = this.positions.map((/**
  4714. * @param {?} currentPosition
  4715. * @return {?}
  4716. */
  4717. function (currentPosition) { return ({
  4718. originX: currentPosition.originX,
  4719. originY: currentPosition.originY,
  4720. overlayX: currentPosition.overlayX,
  4721. overlayY: currentPosition.overlayY,
  4722. offsetX: currentPosition.offsetX || _this.offsetX,
  4723. offsetY: currentPosition.offsetY || _this.offsetY,
  4724. panelClass: currentPosition.panelClass || undefined,
  4725. }); }));
  4726. return positionStrategy
  4727. .setOrigin(this.origin.elementRef)
  4728. .withPositions(positions)
  4729. .withFlexibleDimensions(this.flexibleDimensions)
  4730. .withPush(this.push)
  4731. .withGrowAfterOpen(this.growAfterOpen)
  4732. .withViewportMargin(this.viewportMargin)
  4733. .withLockedPosition(this.lockPosition);
  4734. };
  4735. /** Returns the position strategy of the overlay to be set on the overlay config */
  4736. /**
  4737. * Returns the position strategy of the overlay to be set on the overlay config
  4738. * @private
  4739. * @return {?}
  4740. */
  4741. CdkConnectedOverlay.prototype._createPositionStrategy = /**
  4742. * Returns the position strategy of the overlay to be set on the overlay config
  4743. * @private
  4744. * @return {?}
  4745. */
  4746. function () {
  4747. var _this = this;
  4748. /** @type {?} */
  4749. var strategy = this._overlay.position().flexibleConnectedTo(this.origin.elementRef);
  4750. this._updatePositionStrategy(strategy);
  4751. strategy.positionChanges.subscribe((/**
  4752. * @param {?} p
  4753. * @return {?}
  4754. */
  4755. function (p) { return _this.positionChange.emit(p); }));
  4756. return strategy;
  4757. };
  4758. /** Attaches the overlay and subscribes to backdrop clicks if backdrop exists */
  4759. /**
  4760. * Attaches the overlay and subscribes to backdrop clicks if backdrop exists
  4761. * @private
  4762. * @return {?}
  4763. */
  4764. CdkConnectedOverlay.prototype._attachOverlay = /**
  4765. * Attaches the overlay and subscribes to backdrop clicks if backdrop exists
  4766. * @private
  4767. * @return {?}
  4768. */
  4769. function () {
  4770. var _this = this;
  4771. if (!this._overlayRef) {
  4772. this._createOverlay();
  4773. }
  4774. else {
  4775. // Update the overlay size, in case the directive's inputs have changed
  4776. this._overlayRef.getConfig().hasBackdrop = this.hasBackdrop;
  4777. }
  4778. if (!this._overlayRef.hasAttached()) {
  4779. this._overlayRef.attach(this._templatePortal);
  4780. this.attach.emit();
  4781. }
  4782. if (this.hasBackdrop) {
  4783. this._backdropSubscription = this._overlayRef.backdropClick().subscribe((/**
  4784. * @param {?} event
  4785. * @return {?}
  4786. */
  4787. function (event) {
  4788. _this.backdropClick.emit(event);
  4789. }));
  4790. }
  4791. else {
  4792. this._backdropSubscription.unsubscribe();
  4793. }
  4794. };
  4795. /** Detaches the overlay and unsubscribes to backdrop clicks if backdrop exists */
  4796. /**
  4797. * Detaches the overlay and unsubscribes to backdrop clicks if backdrop exists
  4798. * @private
  4799. * @return {?}
  4800. */
  4801. CdkConnectedOverlay.prototype._detachOverlay = /**
  4802. * Detaches the overlay and unsubscribes to backdrop clicks if backdrop exists
  4803. * @private
  4804. * @return {?}
  4805. */
  4806. function () {
  4807. if (this._overlayRef) {
  4808. this._overlayRef.detach();
  4809. this.detach.emit();
  4810. }
  4811. this._backdropSubscription.unsubscribe();
  4812. };
  4813. CdkConnectedOverlay.decorators = [
  4814. { type: Directive, args: [{
  4815. selector: '[cdk-connected-overlay], [connected-overlay], [cdkConnectedOverlay]',
  4816. exportAs: 'cdkConnectedOverlay'
  4817. },] },
  4818. ];
  4819. /** @nocollapse */
  4820. CdkConnectedOverlay.ctorParameters = function () { return [
  4821. { type: Overlay },
  4822. { type: TemplateRef },
  4823. { type: ViewContainerRef },
  4824. { type: undefined, decorators: [{ type: Inject, args: [CDK_CONNECTED_OVERLAY_SCROLL_STRATEGY,] }] },
  4825. { type: Directionality, decorators: [{ type: Optional }] }
  4826. ]; };
  4827. CdkConnectedOverlay.propDecorators = {
  4828. origin: [{ type: Input, args: ['cdkConnectedOverlayOrigin',] }],
  4829. positions: [{ type: Input, args: ['cdkConnectedOverlayPositions',] }],
  4830. offsetX: [{ type: Input, args: ['cdkConnectedOverlayOffsetX',] }],
  4831. offsetY: [{ type: Input, args: ['cdkConnectedOverlayOffsetY',] }],
  4832. width: [{ type: Input, args: ['cdkConnectedOverlayWidth',] }],
  4833. height: [{ type: Input, args: ['cdkConnectedOverlayHeight',] }],
  4834. minWidth: [{ type: Input, args: ['cdkConnectedOverlayMinWidth',] }],
  4835. minHeight: [{ type: Input, args: ['cdkConnectedOverlayMinHeight',] }],
  4836. backdropClass: [{ type: Input, args: ['cdkConnectedOverlayBackdropClass',] }],
  4837. panelClass: [{ type: Input, args: ['cdkConnectedOverlayPanelClass',] }],
  4838. viewportMargin: [{ type: Input, args: ['cdkConnectedOverlayViewportMargin',] }],
  4839. scrollStrategy: [{ type: Input, args: ['cdkConnectedOverlayScrollStrategy',] }],
  4840. open: [{ type: Input, args: ['cdkConnectedOverlayOpen',] }],
  4841. hasBackdrop: [{ type: Input, args: ['cdkConnectedOverlayHasBackdrop',] }],
  4842. lockPosition: [{ type: Input, args: ['cdkConnectedOverlayLockPosition',] }],
  4843. flexibleDimensions: [{ type: Input, args: ['cdkConnectedOverlayFlexibleDimensions',] }],
  4844. growAfterOpen: [{ type: Input, args: ['cdkConnectedOverlayGrowAfterOpen',] }],
  4845. push: [{ type: Input, args: ['cdkConnectedOverlayPush',] }],
  4846. backdropClick: [{ type: Output }],
  4847. positionChange: [{ type: Output }],
  4848. attach: [{ type: Output }],
  4849. detach: [{ type: Output }],
  4850. overlayKeydown: [{ type: Output }]
  4851. };
  4852. return CdkConnectedOverlay;
  4853. }());
  4854. /**
  4855. * \@docs-private
  4856. * @param {?} overlay
  4857. * @return {?}
  4858. */
  4859. function CDK_CONNECTED_OVERLAY_SCROLL_STRATEGY_PROVIDER_FACTORY(overlay) {
  4860. return (/**
  4861. * @return {?}
  4862. */
  4863. function () { return overlay.scrollStrategies.reposition(); });
  4864. }
  4865. /**
  4866. * \@docs-private
  4867. * @type {?}
  4868. */
  4869. var CDK_CONNECTED_OVERLAY_SCROLL_STRATEGY_PROVIDER = {
  4870. provide: CDK_CONNECTED_OVERLAY_SCROLL_STRATEGY,
  4871. deps: [Overlay],
  4872. useFactory: CDK_CONNECTED_OVERLAY_SCROLL_STRATEGY_PROVIDER_FACTORY,
  4873. };
  4874. /**
  4875. * @fileoverview added by tsickle
  4876. * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
  4877. */
  4878. var OverlayModule = /** @class */ (function () {
  4879. function OverlayModule() {
  4880. }
  4881. OverlayModule.decorators = [
  4882. { type: NgModule, args: [{
  4883. imports: [BidiModule, PortalModule, ScrollingModule],
  4884. exports: [CdkConnectedOverlay, CdkOverlayOrigin, ScrollingModule],
  4885. declarations: [CdkConnectedOverlay, CdkOverlayOrigin],
  4886. providers: [
  4887. Overlay,
  4888. CDK_CONNECTED_OVERLAY_SCROLL_STRATEGY_PROVIDER,
  4889. ],
  4890. },] },
  4891. ];
  4892. return OverlayModule;
  4893. }());
  4894. /**
  4895. * @deprecated Use `OverlayModule` instead.
  4896. * \@breaking-change 8.0.0
  4897. * \@docs-private
  4898. * @type {?}
  4899. */
  4900. var OVERLAY_PROVIDERS = [
  4901. Overlay,
  4902. OverlayPositionBuilder,
  4903. OVERLAY_KEYBOARD_DISPATCHER_PROVIDER,
  4904. VIEWPORT_RULER_PROVIDER,
  4905. OVERLAY_CONTAINER_PROVIDER,
  4906. CDK_CONNECTED_OVERLAY_SCROLL_STRATEGY_PROVIDER,
  4907. ];
  4908. /**
  4909. * @fileoverview added by tsickle
  4910. * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
  4911. */
  4912. /**
  4913. * Alternative to OverlayContainer that supports correct displaying of overlay elements in
  4914. * Fullscreen mode
  4915. * https://developer.mozilla.org/en-US/docs/Web/API/Element/requestFullScreen
  4916. *
  4917. * Should be provided in the root component.
  4918. */
  4919. var FullscreenOverlayContainer = /** @class */ (function (_super) {
  4920. __extends(FullscreenOverlayContainer, _super);
  4921. function FullscreenOverlayContainer(_document) {
  4922. return _super.call(this, _document) || this;
  4923. }
  4924. /**
  4925. * @return {?}
  4926. */
  4927. FullscreenOverlayContainer.prototype.ngOnDestroy = /**
  4928. * @return {?}
  4929. */
  4930. function () {
  4931. _super.prototype.ngOnDestroy.call(this);
  4932. if (this._fullScreenEventName && this._fullScreenListener) {
  4933. this._document.removeEventListener(this._fullScreenEventName, this._fullScreenListener);
  4934. }
  4935. };
  4936. /**
  4937. * @protected
  4938. * @return {?}
  4939. */
  4940. FullscreenOverlayContainer.prototype._createContainer = /**
  4941. * @protected
  4942. * @return {?}
  4943. */
  4944. function () {
  4945. var _this = this;
  4946. _super.prototype._createContainer.call(this);
  4947. this._adjustParentForFullscreenChange();
  4948. this._addFullscreenChangeListener((/**
  4949. * @return {?}
  4950. */
  4951. function () { return _this._adjustParentForFullscreenChange(); }));
  4952. };
  4953. /**
  4954. * @private
  4955. * @return {?}
  4956. */
  4957. FullscreenOverlayContainer.prototype._adjustParentForFullscreenChange = /**
  4958. * @private
  4959. * @return {?}
  4960. */
  4961. function () {
  4962. if (!this._containerElement) {
  4963. return;
  4964. }
  4965. /** @type {?} */
  4966. var fullscreenElement = this.getFullscreenElement();
  4967. /** @type {?} */
  4968. var parent = fullscreenElement || this._document.body;
  4969. parent.appendChild(this._containerElement);
  4970. };
  4971. /**
  4972. * @private
  4973. * @param {?} fn
  4974. * @return {?}
  4975. */
  4976. FullscreenOverlayContainer.prototype._addFullscreenChangeListener = /**
  4977. * @private
  4978. * @param {?} fn
  4979. * @return {?}
  4980. */
  4981. function (fn) {
  4982. /** @type {?} */
  4983. var eventName = this._getEventName();
  4984. if (eventName) {
  4985. if (this._fullScreenListener) {
  4986. this._document.removeEventListener(eventName, this._fullScreenListener);
  4987. }
  4988. this._document.addEventListener(eventName, fn);
  4989. this._fullScreenListener = fn;
  4990. }
  4991. };
  4992. /**
  4993. * @private
  4994. * @return {?}
  4995. */
  4996. FullscreenOverlayContainer.prototype._getEventName = /**
  4997. * @private
  4998. * @return {?}
  4999. */
  5000. function () {
  5001. if (!this._fullScreenEventName) {
  5002. /** @type {?} */
  5003. var _document = (/** @type {?} */ (this._document));
  5004. if (_document.fullscreenEnabled) {
  5005. this._fullScreenEventName = 'fullscreenchange';
  5006. }
  5007. else if (_document.webkitFullscreenEnabled) {
  5008. this._fullScreenEventName = 'webkitfullscreenchange';
  5009. }
  5010. else if (_document.mozFullScreenEnabled) {
  5011. this._fullScreenEventName = 'mozfullscreenchange';
  5012. }
  5013. else if (_document.msFullscreenEnabled) {
  5014. this._fullScreenEventName = 'MSFullscreenChange';
  5015. }
  5016. }
  5017. return this._fullScreenEventName;
  5018. };
  5019. /**
  5020. * When the page is put into fullscreen mode, a specific element is specified.
  5021. * Only that element and its children are visible when in fullscreen mode.
  5022. */
  5023. /**
  5024. * When the page is put into fullscreen mode, a specific element is specified.
  5025. * Only that element and its children are visible when in fullscreen mode.
  5026. * @return {?}
  5027. */
  5028. FullscreenOverlayContainer.prototype.getFullscreenElement = /**
  5029. * When the page is put into fullscreen mode, a specific element is specified.
  5030. * Only that element and its children are visible when in fullscreen mode.
  5031. * @return {?}
  5032. */
  5033. function () {
  5034. /** @type {?} */
  5035. var _document = (/** @type {?} */ (this._document));
  5036. return _document.fullscreenElement ||
  5037. _document.webkitFullscreenElement ||
  5038. _document.mozFullScreenElement ||
  5039. _document.msFullscreenElement ||
  5040. null;
  5041. };
  5042. FullscreenOverlayContainer.decorators = [
  5043. { type: Injectable, args: [{ providedIn: 'root' },] },
  5044. ];
  5045. /** @nocollapse */
  5046. FullscreenOverlayContainer.ctorParameters = function () { return [
  5047. { type: undefined, decorators: [{ type: Inject, args: [DOCUMENT,] }] }
  5048. ]; };
  5049. /** @nocollapse */ FullscreenOverlayContainer.ngInjectableDef = ɵɵdefineInjectable({ factory: function FullscreenOverlayContainer_Factory() { return new FullscreenOverlayContainer(ɵɵinject(DOCUMENT)); }, token: FullscreenOverlayContainer, providedIn: "root" });
  5050. return FullscreenOverlayContainer;
  5051. }(OverlayContainer));
  5052. /**
  5053. * @fileoverview added by tsickle
  5054. * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
  5055. */
  5056. /**
  5057. * @fileoverview added by tsickle
  5058. * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
  5059. */
  5060. export { Overlay, OverlayContainer, CdkOverlayOrigin, CdkConnectedOverlay, FullscreenOverlayContainer, OverlayRef, OverlayKeyboardDispatcher, OverlayPositionBuilder, GlobalPositionStrategy, ConnectedPositionStrategy, FlexibleConnectedPositionStrategy, OverlayConfig, validateVerticalPosition, validateHorizontalPosition, ConnectionPositionPair, ScrollingVisibility, ConnectedOverlayPositionChange, ScrollStrategyOptions, RepositionScrollStrategy, CloseScrollStrategy, NoopScrollStrategy, BlockScrollStrategy, OverlayModule, OVERLAY_PROVIDERS, OVERLAY_KEYBOARD_DISPATCHER_PROVIDER as ɵg, OVERLAY_KEYBOARD_DISPATCHER_PROVIDER_FACTORY as ɵf, OVERLAY_CONTAINER_PROVIDER as ɵb, OVERLAY_CONTAINER_PROVIDER_FACTORY as ɵa, CDK_CONNECTED_OVERLAY_SCROLL_STRATEGY as ɵc, CDK_CONNECTED_OVERLAY_SCROLL_STRATEGY_PROVIDER as ɵe, CDK_CONNECTED_OVERLAY_SCROLL_STRATEGY_PROVIDER_FACTORY as ɵd };
  5061. //# sourceMappingURL=overlay.es5.js.map