ngx-bootstrap-dropdown.js 29 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887
  1. import { __values } from 'tslib';
  2. import { Injectable, EventEmitter, Component, ChangeDetectionStrategy, ChangeDetectorRef, Renderer2, ElementRef, Directive, ViewContainerRef, Input, Output, TemplateRef, HostBinding, HostListener, NgModule } from '@angular/core';
  3. import { filter } from 'rxjs/operators';
  4. import { ComponentLoaderFactory } from 'ngx-bootstrap/component-loader';
  5. import { isBs3 } from 'ngx-bootstrap/utils';
  6. import { style, animate, AnimationBuilder } from '@angular/animations';
  7. import { PositioningService } from 'ngx-bootstrap/positioning';
  8. /**
  9. * @fileoverview added by tsickle
  10. * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
  11. */
  12. /**
  13. * Default dropdown configuration
  14. */
  15. var BsDropdownConfig = /** @class */ (function () {
  16. function BsDropdownConfig() {
  17. /**
  18. * default dropdown auto closing behavior
  19. */
  20. this.autoClose = true;
  21. /**
  22. * default dropdown auto closing behavior
  23. */
  24. this.insideClick = false;
  25. /**
  26. * turn on/off animation
  27. */
  28. this.isAnimated = false;
  29. }
  30. BsDropdownConfig.decorators = [
  31. { type: Injectable }
  32. ];
  33. return BsDropdownConfig;
  34. }());
  35. /**
  36. * @fileoverview added by tsickle
  37. * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
  38. */
  39. var BsDropdownState = /** @class */ (function () {
  40. function BsDropdownState() {
  41. var _this = this;
  42. this.direction = 'down';
  43. this.isOpenChange = new EventEmitter();
  44. this.isDisabledChange = new EventEmitter();
  45. this.toggleClick = new EventEmitter();
  46. this.dropdownMenu = new Promise((/**
  47. * @param {?} resolve
  48. * @return {?}
  49. */
  50. function (resolve) {
  51. _this.resolveDropdownMenu = resolve;
  52. }));
  53. }
  54. BsDropdownState.decorators = [
  55. { type: Injectable }
  56. ];
  57. /** @nocollapse */
  58. BsDropdownState.ctorParameters = function () { return []; };
  59. return BsDropdownState;
  60. }());
  61. /**
  62. * @fileoverview added by tsickle
  63. * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
  64. */
  65. /** @type {?} */
  66. var DROPDOWN_ANIMATION_TIMING = '220ms cubic-bezier(0, 0, 0.2, 1)';
  67. /** @type {?} */
  68. var dropdownAnimation = [
  69. style({ height: 0, overflow: 'hidden' }),
  70. animate(DROPDOWN_ANIMATION_TIMING, style({ height: '*', overflow: 'hidden' }))
  71. ];
  72. /**
  73. * @fileoverview added by tsickle
  74. * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
  75. */
  76. var BsDropdownContainerComponent = /** @class */ (function () {
  77. function BsDropdownContainerComponent(_state, cd, _renderer, _element, _builder) {
  78. var _this = this;
  79. this._state = _state;
  80. this.cd = cd;
  81. this._renderer = _renderer;
  82. this._element = _element;
  83. this.isOpen = false;
  84. this._factoryDropDownAnimation = _builder.build(dropdownAnimation);
  85. this._subscription = _state.isOpenChange.subscribe((/**
  86. * @param {?} value
  87. * @return {?}
  88. */
  89. function (value) {
  90. _this.isOpen = value;
  91. /** @type {?} */
  92. var dropdown = _this._element.nativeElement.querySelector('.dropdown-menu');
  93. _this._renderer.addClass(_this._element.nativeElement.querySelector('div'), 'open');
  94. if (dropdown && !isBs3()) {
  95. _this._renderer.addClass(dropdown, 'show');
  96. if (dropdown.classList.contains('dropdown-menu-right')) {
  97. _this._renderer.setStyle(dropdown, 'left', 'auto');
  98. _this._renderer.setStyle(dropdown, 'right', '0');
  99. }
  100. if (_this.direction === 'up') {
  101. _this._renderer.setStyle(dropdown, 'top', 'auto');
  102. _this._renderer.setStyle(dropdown, 'transform', 'translateY(-101%)');
  103. }
  104. }
  105. if (dropdown && _this._state.isAnimated) {
  106. _this._factoryDropDownAnimation.create(dropdown)
  107. .play();
  108. }
  109. _this.cd.markForCheck();
  110. _this.cd.detectChanges();
  111. }));
  112. }
  113. Object.defineProperty(BsDropdownContainerComponent.prototype, "direction", {
  114. get: /**
  115. * @return {?}
  116. */
  117. function () {
  118. return this._state.direction;
  119. },
  120. enumerable: true,
  121. configurable: true
  122. });
  123. /** @internal */
  124. /**
  125. * \@internal
  126. * @param {?} el
  127. * @return {?}
  128. */
  129. BsDropdownContainerComponent.prototype._contains = /**
  130. * \@internal
  131. * @param {?} el
  132. * @return {?}
  133. */
  134. function (el) {
  135. return this._element.nativeElement.contains(el);
  136. };
  137. /**
  138. * @return {?}
  139. */
  140. BsDropdownContainerComponent.prototype.ngOnDestroy = /**
  141. * @return {?}
  142. */
  143. function () {
  144. this._subscription.unsubscribe();
  145. };
  146. BsDropdownContainerComponent.decorators = [
  147. { type: Component, args: [{
  148. selector: 'bs-dropdown-container',
  149. changeDetection: ChangeDetectionStrategy.OnPush,
  150. host: {
  151. style: 'display:block;position: absolute;'
  152. },
  153. template: "\n <div [class.dropup]=\"direction === 'up'\"\n [class.dropdown]=\"direction === 'down'\"\n [class.show]=\"isOpen\"\n [class.open]=\"isOpen\"><ng-content></ng-content>\n </div>\n "
  154. }] }
  155. ];
  156. /** @nocollapse */
  157. BsDropdownContainerComponent.ctorParameters = function () { return [
  158. { type: BsDropdownState },
  159. { type: ChangeDetectorRef },
  160. { type: Renderer2 },
  161. { type: ElementRef },
  162. { type: AnimationBuilder }
  163. ]; };
  164. return BsDropdownContainerComponent;
  165. }());
  166. /**
  167. * @fileoverview added by tsickle
  168. * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
  169. */
  170. var BsDropdownDirective = /** @class */ (function () {
  171. function BsDropdownDirective(_elementRef, _renderer, _viewContainerRef, _cis, _state, _config, _builder) {
  172. this._elementRef = _elementRef;
  173. this._renderer = _renderer;
  174. this._viewContainerRef = _viewContainerRef;
  175. this._cis = _cis;
  176. this._state = _state;
  177. this._config = _config;
  178. // todo: move to component loader
  179. this._isInlineOpen = false;
  180. this._subscriptions = [];
  181. this._isInited = false;
  182. // set initial dropdown state from config
  183. this._state.autoClose = this._config.autoClose;
  184. this._state.insideClick = this._config.insideClick;
  185. this._state.isAnimated = this._config.isAnimated;
  186. this._factoryDropDownAnimation = _builder.build(dropdownAnimation);
  187. // create dropdown component loader
  188. this._dropdown = this._cis
  189. .createLoader(this._elementRef, this._viewContainerRef, this._renderer)
  190. .provide({ provide: BsDropdownState, useValue: this._state });
  191. this.onShown = this._dropdown.onShown;
  192. this.onHidden = this._dropdown.onHidden;
  193. this.isOpenChange = this._state.isOpenChange;
  194. }
  195. Object.defineProperty(BsDropdownDirective.prototype, "autoClose", {
  196. get: /**
  197. * @return {?}
  198. */
  199. function () {
  200. return this._state.autoClose;
  201. },
  202. /**
  203. * Indicates that dropdown will be closed on item or document click,
  204. * and after pressing ESC
  205. */
  206. set: /**
  207. * Indicates that dropdown will be closed on item or document click,
  208. * and after pressing ESC
  209. * @param {?} value
  210. * @return {?}
  211. */
  212. function (value) {
  213. this._state.autoClose = value;
  214. },
  215. enumerable: true,
  216. configurable: true
  217. });
  218. Object.defineProperty(BsDropdownDirective.prototype, "isAnimated", {
  219. get: /**
  220. * @return {?}
  221. */
  222. function () {
  223. return this._state.isAnimated;
  224. },
  225. /**
  226. * Indicates that dropdown will be animated
  227. */
  228. set: /**
  229. * Indicates that dropdown will be animated
  230. * @param {?} value
  231. * @return {?}
  232. */
  233. function (value) {
  234. this._state.isAnimated = value;
  235. },
  236. enumerable: true,
  237. configurable: true
  238. });
  239. Object.defineProperty(BsDropdownDirective.prototype, "insideClick", {
  240. get: /**
  241. * @return {?}
  242. */
  243. function () {
  244. return this._state.insideClick;
  245. },
  246. /**
  247. * This attribute indicates that the dropdown shouldn't close on inside click when autoClose is set to true
  248. */
  249. set: /**
  250. * This attribute indicates that the dropdown shouldn't close on inside click when autoClose is set to true
  251. * @param {?} value
  252. * @return {?}
  253. */
  254. function (value) {
  255. this._state.insideClick = value;
  256. },
  257. enumerable: true,
  258. configurable: true
  259. });
  260. Object.defineProperty(BsDropdownDirective.prototype, "isDisabled", {
  261. get: /**
  262. * @return {?}
  263. */
  264. function () {
  265. return this._isDisabled;
  266. },
  267. /**
  268. * Disables dropdown toggle and hides dropdown menu if opened
  269. */
  270. set: /**
  271. * Disables dropdown toggle and hides dropdown menu if opened
  272. * @param {?} value
  273. * @return {?}
  274. */
  275. function (value) {
  276. this._isDisabled = value;
  277. this._state.isDisabledChange.emit(value);
  278. if (value) {
  279. this.hide();
  280. }
  281. },
  282. enumerable: true,
  283. configurable: true
  284. });
  285. Object.defineProperty(BsDropdownDirective.prototype, "isOpen", {
  286. /**
  287. * Returns whether or not the popover is currently being shown
  288. */
  289. get: /**
  290. * Returns whether or not the popover is currently being shown
  291. * @return {?}
  292. */
  293. function () {
  294. if (this._showInline) {
  295. return this._isInlineOpen;
  296. }
  297. return this._dropdown.isShown;
  298. },
  299. set: /**
  300. * @param {?} value
  301. * @return {?}
  302. */
  303. function (value) {
  304. if (value) {
  305. this.show();
  306. }
  307. else {
  308. this.hide();
  309. }
  310. },
  311. enumerable: true,
  312. configurable: true
  313. });
  314. Object.defineProperty(BsDropdownDirective.prototype, "isBs4", {
  315. get: /**
  316. * @return {?}
  317. */
  318. function () {
  319. return !isBs3();
  320. },
  321. enumerable: true,
  322. configurable: true
  323. });
  324. Object.defineProperty(BsDropdownDirective.prototype, "_showInline", {
  325. get: /**
  326. * @private
  327. * @return {?}
  328. */
  329. function () {
  330. return !this.container;
  331. },
  332. enumerable: true,
  333. configurable: true
  334. });
  335. /**
  336. * @return {?}
  337. */
  338. BsDropdownDirective.prototype.ngOnInit = /**
  339. * @return {?}
  340. */
  341. function () {
  342. var _this = this;
  343. // fix: seems there are an issue with `routerLinkActive`
  344. // which result in duplicated call ngOnInit without call to ngOnDestroy
  345. // read more: https://github.com/valor-software/ngx-bootstrap/issues/1885
  346. if (this._isInited) {
  347. return;
  348. }
  349. this._isInited = true;
  350. // attach DOM listeners
  351. this._dropdown.listen({
  352. // because of dropdown inline mode
  353. outsideClick: false,
  354. triggers: this.triggers,
  355. show: (/**
  356. * @return {?}
  357. */
  358. function () { return _this.show(); })
  359. });
  360. // toggle visibility on toggle element click
  361. this._subscriptions.push(this._state.toggleClick.subscribe((/**
  362. * @param {?} value
  363. * @return {?}
  364. */
  365. function (value) { return _this.toggle(value); })));
  366. // hide dropdown if set disabled while opened
  367. this._subscriptions.push(this._state.isDisabledChange
  368. .pipe(filter((/**
  369. * @param {?} value
  370. * @return {?}
  371. */
  372. function (value) { return value; })))
  373. .subscribe((/**
  374. * @param {?} value
  375. * @return {?}
  376. */
  377. function (value) { return _this.hide(); })));
  378. };
  379. /**
  380. * Opens an element’s popover. This is considered a “manual” triggering of
  381. * the popover.
  382. */
  383. /**
  384. * Opens an element’s popover. This is considered a “manual” triggering of
  385. * the popover.
  386. * @return {?}
  387. */
  388. BsDropdownDirective.prototype.show = /**
  389. * Opens an element’s popover. This is considered a “manual” triggering of
  390. * the popover.
  391. * @return {?}
  392. */
  393. function () {
  394. var _this = this;
  395. if (this.isOpen || this.isDisabled) {
  396. return;
  397. }
  398. if (this._showInline) {
  399. if (!this._inlinedMenu) {
  400. this._state.dropdownMenu.then((/**
  401. * @param {?} dropdownMenu
  402. * @return {?}
  403. */
  404. function (dropdownMenu) {
  405. _this._dropdown.attachInline(dropdownMenu.viewContainer, dropdownMenu.templateRef);
  406. _this._inlinedMenu = _this._dropdown._inlineViewRef;
  407. _this.addBs4Polyfills();
  408. _this._renderer.addClass(_this._inlinedMenu.rootNodes[0].parentNode, 'open');
  409. _this.playAnimation();
  410. }))
  411. // swallow errors
  412. .catch();
  413. }
  414. this.addBs4Polyfills();
  415. this._isInlineOpen = true;
  416. this.onShown.emit(true);
  417. this._state.isOpenChange.emit(true);
  418. this.playAnimation();
  419. return;
  420. }
  421. this._state.dropdownMenu.then((/**
  422. * @param {?} dropdownMenu
  423. * @return {?}
  424. */
  425. function (dropdownMenu) {
  426. // check direction in which dropdown should be opened
  427. /** @type {?} */
  428. var _dropup = _this.dropup ||
  429. (typeof _this.dropup !== 'undefined' && _this.dropup);
  430. _this._state.direction = _dropup ? 'up' : 'down';
  431. /** @type {?} */
  432. var _placement = _this.placement || (_dropup ? 'top start' : 'bottom start');
  433. // show dropdown
  434. _this._dropdown
  435. .attach(BsDropdownContainerComponent)
  436. .to(_this.container)
  437. .position({ attachment: _placement })
  438. .show({
  439. content: dropdownMenu.templateRef,
  440. placement: _placement
  441. });
  442. _this._state.isOpenChange.emit(true);
  443. }))
  444. // swallow error
  445. .catch();
  446. };
  447. /**
  448. * Closes an element’s popover. This is considered a “manual” triggering of
  449. * the popover.
  450. */
  451. /**
  452. * Closes an element’s popover. This is considered a “manual” triggering of
  453. * the popover.
  454. * @return {?}
  455. */
  456. BsDropdownDirective.prototype.hide = /**
  457. * Closes an element’s popover. This is considered a “manual” triggering of
  458. * the popover.
  459. * @return {?}
  460. */
  461. function () {
  462. if (!this.isOpen) {
  463. return;
  464. }
  465. if (this._showInline) {
  466. this.removeShowClass();
  467. this.removeDropupStyles();
  468. this._isInlineOpen = false;
  469. this.onHidden.emit(true);
  470. }
  471. else {
  472. this._dropdown.hide();
  473. }
  474. this._state.isOpenChange.emit(false);
  475. };
  476. /**
  477. * Toggles an element’s popover. This is considered a “manual” triggering of
  478. * the popover. With parameter <code>true</code> allows toggling, with parameter <code>false</code>
  479. * only hides opened dropdown. Parameter usage will be removed in ngx-bootstrap v3
  480. */
  481. /**
  482. * Toggles an element’s popover. This is considered a “manual” triggering of
  483. * the popover. With parameter <code>true</code> allows toggling, with parameter <code>false</code>
  484. * only hides opened dropdown. Parameter usage will be removed in ngx-bootstrap v3
  485. * @param {?=} value
  486. * @return {?}
  487. */
  488. BsDropdownDirective.prototype.toggle = /**
  489. * Toggles an element’s popover. This is considered a “manual” triggering of
  490. * the popover. With parameter <code>true</code> allows toggling, with parameter <code>false</code>
  491. * only hides opened dropdown. Parameter usage will be removed in ngx-bootstrap v3
  492. * @param {?=} value
  493. * @return {?}
  494. */
  495. function (value) {
  496. if (this.isOpen || !value) {
  497. return this.hide();
  498. }
  499. return this.show();
  500. };
  501. /** @internal */
  502. /**
  503. * \@internal
  504. * @param {?} event
  505. * @return {?}
  506. */
  507. BsDropdownDirective.prototype._contains = /**
  508. * \@internal
  509. * @param {?} event
  510. * @return {?}
  511. */
  512. function (event) {
  513. return this._elementRef.nativeElement.contains(event.target) ||
  514. (this._dropdown.instance && this._dropdown.instance._contains(event.target));
  515. };
  516. /**
  517. * @return {?}
  518. */
  519. BsDropdownDirective.prototype.ngOnDestroy = /**
  520. * @return {?}
  521. */
  522. function () {
  523. var e_1, _a;
  524. try {
  525. // clean up subscriptions and destroy dropdown
  526. for (var _b = __values(this._subscriptions), _c = _b.next(); !_c.done; _c = _b.next()) {
  527. var sub = _c.value;
  528. sub.unsubscribe();
  529. }
  530. }
  531. catch (e_1_1) { e_1 = { error: e_1_1 }; }
  532. finally {
  533. try {
  534. if (_c && !_c.done && (_a = _b.return)) _a.call(_b);
  535. }
  536. finally { if (e_1) throw e_1.error; }
  537. }
  538. this._dropdown.dispose();
  539. };
  540. /**
  541. * @private
  542. * @return {?}
  543. */
  544. BsDropdownDirective.prototype.addBs4Polyfills = /**
  545. * @private
  546. * @return {?}
  547. */
  548. function () {
  549. if (!isBs3()) {
  550. this.addShowClass();
  551. this.checkRightAlignment();
  552. this.addDropupStyles();
  553. }
  554. };
  555. /**
  556. * @private
  557. * @return {?}
  558. */
  559. BsDropdownDirective.prototype.playAnimation = /**
  560. * @private
  561. * @return {?}
  562. */
  563. function () {
  564. if (this._state.isAnimated && this._inlinedMenu) {
  565. this._factoryDropDownAnimation.create(this._inlinedMenu.rootNodes[0])
  566. .play();
  567. }
  568. };
  569. /**
  570. * @private
  571. * @return {?}
  572. */
  573. BsDropdownDirective.prototype.addShowClass = /**
  574. * @private
  575. * @return {?}
  576. */
  577. function () {
  578. if (this._inlinedMenu && this._inlinedMenu.rootNodes[0]) {
  579. this._renderer.addClass(this._inlinedMenu.rootNodes[0], 'show');
  580. }
  581. };
  582. /**
  583. * @private
  584. * @return {?}
  585. */
  586. BsDropdownDirective.prototype.removeShowClass = /**
  587. * @private
  588. * @return {?}
  589. */
  590. function () {
  591. if (this._inlinedMenu && this._inlinedMenu.rootNodes[0]) {
  592. this._renderer.removeClass(this._inlinedMenu.rootNodes[0], 'show');
  593. }
  594. };
  595. /**
  596. * @private
  597. * @return {?}
  598. */
  599. BsDropdownDirective.prototype.checkRightAlignment = /**
  600. * @private
  601. * @return {?}
  602. */
  603. function () {
  604. if (this._inlinedMenu && this._inlinedMenu.rootNodes[0]) {
  605. /** @type {?} */
  606. var isRightAligned = this._inlinedMenu.rootNodes[0].classList.contains('dropdown-menu-right');
  607. this._renderer.setStyle(this._inlinedMenu.rootNodes[0], 'left', isRightAligned ? 'auto' : '0');
  608. this._renderer.setStyle(this._inlinedMenu.rootNodes[0], 'right', isRightAligned ? '0' : 'auto');
  609. }
  610. };
  611. /**
  612. * @private
  613. * @return {?}
  614. */
  615. BsDropdownDirective.prototype.addDropupStyles = /**
  616. * @private
  617. * @return {?}
  618. */
  619. function () {
  620. if (this._inlinedMenu && this._inlinedMenu.rootNodes[0]) {
  621. // a little hack to not break support of bootstrap 4 beta
  622. this._renderer.setStyle(this._inlinedMenu.rootNodes[0], 'top', this.dropup ? 'auto' : '100%');
  623. this._renderer.setStyle(this._inlinedMenu.rootNodes[0], 'transform', this.dropup ? 'translateY(-101%)' : 'translateY(0)');
  624. this._renderer.setStyle(this._inlinedMenu.rootNodes[0], 'bottom', 'auto');
  625. }
  626. };
  627. /**
  628. * @private
  629. * @return {?}
  630. */
  631. BsDropdownDirective.prototype.removeDropupStyles = /**
  632. * @private
  633. * @return {?}
  634. */
  635. function () {
  636. if (this._inlinedMenu && this._inlinedMenu.rootNodes[0]) {
  637. this._renderer.removeStyle(this._inlinedMenu.rootNodes[0], 'top');
  638. this._renderer.removeStyle(this._inlinedMenu.rootNodes[0], 'transform');
  639. this._renderer.removeStyle(this._inlinedMenu.rootNodes[0], 'bottom');
  640. }
  641. };
  642. BsDropdownDirective.decorators = [
  643. { type: Directive, args: [{
  644. selector: '[bsDropdown],[dropdown]',
  645. exportAs: 'bs-dropdown',
  646. providers: [BsDropdownState],
  647. host: {
  648. '[class.dropup]': 'dropup',
  649. '[class.open]': 'isOpen',
  650. '[class.show]': 'isOpen && isBs4'
  651. }
  652. },] }
  653. ];
  654. /** @nocollapse */
  655. BsDropdownDirective.ctorParameters = function () { return [
  656. { type: ElementRef },
  657. { type: Renderer2 },
  658. { type: ViewContainerRef },
  659. { type: ComponentLoaderFactory },
  660. { type: BsDropdownState },
  661. { type: BsDropdownConfig },
  662. { type: AnimationBuilder }
  663. ]; };
  664. BsDropdownDirective.propDecorators = {
  665. placement: [{ type: Input }],
  666. triggers: [{ type: Input }],
  667. container: [{ type: Input }],
  668. dropup: [{ type: Input }],
  669. autoClose: [{ type: Input }],
  670. isAnimated: [{ type: Input }],
  671. insideClick: [{ type: Input }],
  672. isDisabled: [{ type: Input }],
  673. isOpen: [{ type: Input }],
  674. isOpenChange: [{ type: Output }],
  675. onShown: [{ type: Output }],
  676. onHidden: [{ type: Output }]
  677. };
  678. return BsDropdownDirective;
  679. }());
  680. /**
  681. * @fileoverview added by tsickle
  682. * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
  683. */
  684. var BsDropdownMenuDirective = /** @class */ (function () {
  685. // tslint:disable:no-any
  686. function BsDropdownMenuDirective(_state, _viewContainer, _templateRef) {
  687. _state.resolveDropdownMenu({
  688. templateRef: _templateRef,
  689. viewContainer: _viewContainer
  690. });
  691. }
  692. BsDropdownMenuDirective.decorators = [
  693. { type: Directive, args: [{
  694. selector: '[bsDropdownMenu],[dropdownMenu]',
  695. exportAs: 'bs-dropdown-menu'
  696. },] }
  697. ];
  698. /** @nocollapse */
  699. BsDropdownMenuDirective.ctorParameters = function () { return [
  700. { type: BsDropdownState },
  701. { type: ViewContainerRef },
  702. { type: TemplateRef }
  703. ]; };
  704. return BsDropdownMenuDirective;
  705. }());
  706. /**
  707. * @fileoverview added by tsickle
  708. * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
  709. */
  710. var BsDropdownToggleDirective = /** @class */ (function () {
  711. function BsDropdownToggleDirective(_changeDetectorRef, _dropdown, _element, _renderer, _state) {
  712. var _this = this;
  713. this._changeDetectorRef = _changeDetectorRef;
  714. this._dropdown = _dropdown;
  715. this._element = _element;
  716. this._renderer = _renderer;
  717. this._state = _state;
  718. this.isDisabled = null;
  719. this._subscriptions = [];
  720. // sync is open value with state
  721. this._subscriptions.push(this._state.isOpenChange.subscribe((/**
  722. * @param {?} value
  723. * @return {?}
  724. */
  725. function (value) {
  726. _this.isOpen = value;
  727. if (value) {
  728. _this._documentClickListener = _this._renderer.listen('document', 'click', (/**
  729. * @param {?} event
  730. * @return {?}
  731. */
  732. function (event) {
  733. if (_this._state.autoClose && event.button !== 2 &&
  734. !_this._element.nativeElement.contains(event.target) &&
  735. !(_this._state.insideClick && _this._dropdown._contains(event))) {
  736. _this._state.toggleClick.emit(false);
  737. _this._changeDetectorRef.detectChanges();
  738. }
  739. }));
  740. _this._escKeyUpListener = _this._renderer.listen(_this._element.nativeElement, 'keyup.esc', (/**
  741. * @return {?}
  742. */
  743. function () {
  744. if (_this._state.autoClose) {
  745. _this._state.toggleClick.emit(false);
  746. _this._changeDetectorRef.detectChanges();
  747. }
  748. }));
  749. }
  750. else {
  751. _this._documentClickListener();
  752. _this._escKeyUpListener();
  753. }
  754. })));
  755. // populate disabled state
  756. this._subscriptions.push(this._state.isDisabledChange.subscribe((/**
  757. * @param {?} value
  758. * @return {?}
  759. */
  760. function (value) { return (_this.isDisabled = value || null); })));
  761. }
  762. /**
  763. * @return {?}
  764. */
  765. BsDropdownToggleDirective.prototype.onClick = /**
  766. * @return {?}
  767. */
  768. function () {
  769. if (this.isDisabled) {
  770. return;
  771. }
  772. this._state.toggleClick.emit(true);
  773. };
  774. /**
  775. * @return {?}
  776. */
  777. BsDropdownToggleDirective.prototype.ngOnDestroy = /**
  778. * @return {?}
  779. */
  780. function () {
  781. var e_1, _a;
  782. if (this._documentClickListener) {
  783. this._documentClickListener();
  784. }
  785. if (this._escKeyUpListener) {
  786. this._escKeyUpListener();
  787. }
  788. try {
  789. for (var _b = __values(this._subscriptions), _c = _b.next(); !_c.done; _c = _b.next()) {
  790. var sub = _c.value;
  791. sub.unsubscribe();
  792. }
  793. }
  794. catch (e_1_1) { e_1 = { error: e_1_1 }; }
  795. finally {
  796. try {
  797. if (_c && !_c.done && (_a = _b.return)) _a.call(_b);
  798. }
  799. finally { if (e_1) throw e_1.error; }
  800. }
  801. };
  802. BsDropdownToggleDirective.decorators = [
  803. { type: Directive, args: [{
  804. selector: '[bsDropdownToggle],[dropdownToggle]',
  805. exportAs: 'bs-dropdown-toggle',
  806. host: {
  807. '[attr.aria-haspopup]': 'true'
  808. }
  809. },] }
  810. ];
  811. /** @nocollapse */
  812. BsDropdownToggleDirective.ctorParameters = function () { return [
  813. { type: ChangeDetectorRef },
  814. { type: BsDropdownDirective },
  815. { type: ElementRef },
  816. { type: Renderer2 },
  817. { type: BsDropdownState }
  818. ]; };
  819. BsDropdownToggleDirective.propDecorators = {
  820. isDisabled: [{ type: HostBinding, args: ['attr.disabled',] }],
  821. isOpen: [{ type: HostBinding, args: ['attr.aria-expanded',] }],
  822. onClick: [{ type: HostListener, args: ['click', [],] }]
  823. };
  824. return BsDropdownToggleDirective;
  825. }());
  826. /**
  827. * @fileoverview added by tsickle
  828. * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
  829. */
  830. var BsDropdownModule = /** @class */ (function () {
  831. function BsDropdownModule() {
  832. }
  833. // tslint:disable-next-line:no-any
  834. // tslint:disable-next-line:no-any
  835. /**
  836. * @param {?=} config
  837. * @return {?}
  838. */
  839. BsDropdownModule.forRoot =
  840. // tslint:disable-next-line:no-any
  841. /**
  842. * @param {?=} config
  843. * @return {?}
  844. */
  845. function (config) {
  846. return {
  847. ngModule: BsDropdownModule,
  848. providers: [
  849. ComponentLoaderFactory,
  850. PositioningService,
  851. BsDropdownState,
  852. {
  853. provide: BsDropdownConfig,
  854. useValue: config ? config : { autoClose: true, insideClick: false }
  855. }
  856. ]
  857. };
  858. };
  859. BsDropdownModule.decorators = [
  860. { type: NgModule, args: [{
  861. declarations: [
  862. BsDropdownMenuDirective,
  863. BsDropdownToggleDirective,
  864. BsDropdownContainerComponent,
  865. BsDropdownDirective
  866. ],
  867. exports: [
  868. BsDropdownMenuDirective,
  869. BsDropdownToggleDirective,
  870. BsDropdownDirective
  871. ],
  872. entryComponents: [BsDropdownContainerComponent]
  873. },] }
  874. ];
  875. return BsDropdownModule;
  876. }());
  877. export { BsDropdownConfig, BsDropdownContainerComponent, BsDropdownDirective, BsDropdownMenuDirective, BsDropdownModule, BsDropdownState, BsDropdownToggleDirective };
  878. //# sourceMappingURL=ngx-bootstrap-dropdown.js.map