defer-rendering.js 14 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373
  1. "use strict";
  2. var __extends = (this && this.__extends) || (function () {
  3. var extendStatics = Object.setPrototypeOf ||
  4. ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
  5. function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
  6. return function (d, b) {
  7. extendStatics(d, b);
  8. function __() { this.constructor = d; }
  9. d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
  10. };
  11. })();
  12. /*!
  13. * devextreme-angular
  14. * Version: 19.1.16
  15. * Build date: Tue Oct 18 2022
  16. *
  17. * Copyright (c) 2012 - 2022 Developer Express Inc. ALL RIGHTS RESERVED
  18. *
  19. * This software may be modified and distributed under the terms
  20. * of the MIT license. See the LICENSE file in the root of the project for details.
  21. *
  22. * https://github.com/DevExpress/devextreme-angular
  23. */
  24. Object.defineProperty(exports, "__esModule", { value: true });
  25. var platform_browser_1 = require("@angular/platform-browser");
  26. var platform_browser_2 = require("@angular/platform-browser");
  27. var core_1 = require("@angular/core");
  28. var defer_rendering_1 = require("devextreme/ui/defer_rendering");
  29. var component_1 = require("../core/component");
  30. var template_host_1 = require("../core/template-host");
  31. var integration_1 = require("../core/integration");
  32. var template_1 = require("../core/template");
  33. var nested_option_1 = require("../core/nested-option");
  34. var watcher_helper_1 = require("../core/watcher-helper");
  35. var animation_1 = require("./nested/animation");
  36. /**
  37. * The DeferRendering is a widget that waits for its content to be ready before rendering it. While the content is getting ready, the DeferRendering displays a loading indicator.
  38. */
  39. var DxDeferRenderingComponent = (function (_super) {
  40. __extends(DxDeferRenderingComponent, _super);
  41. function DxDeferRenderingComponent(elementRef, ngZone, templateHost, _watcherHelper, optionHost, transferState, platformId) {
  42. var _this = _super.call(this, elementRef, ngZone, templateHost, _watcherHelper, transferState, platformId) || this;
  43. _this._createEventEmitters([
  44. { subscribe: 'contentReady', emit: 'onContentReady' },
  45. { subscribe: 'disposing', emit: 'onDisposing' },
  46. { subscribe: 'initialized', emit: 'onInitialized' },
  47. { subscribe: 'optionChanged', emit: 'onOptionChanged' },
  48. { subscribe: 'rendered', emit: 'onRendered' },
  49. { subscribe: 'shown', emit: 'onShown' },
  50. { emit: 'accessKeyChange' },
  51. { emit: 'activeStateEnabledChange' },
  52. { emit: 'animationChange' },
  53. { emit: 'disabledChange' },
  54. { emit: 'elementAttrChange' },
  55. { emit: 'focusStateEnabledChange' },
  56. { emit: 'heightChange' },
  57. { emit: 'hintChange' },
  58. { emit: 'hoverStateEnabledChange' },
  59. { emit: 'renderWhenChange' },
  60. { emit: 'rtlEnabledChange' },
  61. { emit: 'showLoadIndicatorChange' },
  62. { emit: 'staggerItemSelectorChange' },
  63. { emit: 'tabIndexChange' },
  64. { emit: 'visibleChange' },
  65. { emit: 'widthChange' }
  66. ]);
  67. optionHost.setHost(_this);
  68. return _this;
  69. }
  70. Object.defineProperty(DxDeferRenderingComponent.prototype, "accessKey", {
  71. get: /**
  72. * Specifies the shortcut key that sets focus on the widget.
  73. */
  74. function () {
  75. return this._getOption('accessKey');
  76. },
  77. set: function (value) {
  78. this._setOption('accessKey', value);
  79. },
  80. enumerable: true,
  81. configurable: true
  82. });
  83. Object.defineProperty(DxDeferRenderingComponent.prototype, "activeStateEnabled", {
  84. get: /**
  85. * Specifies whether or not the widget changes its state when interacting with a user.
  86. */
  87. function () {
  88. return this._getOption('activeStateEnabled');
  89. },
  90. set: function (value) {
  91. this._setOption('activeStateEnabled', value);
  92. },
  93. enumerable: true,
  94. configurable: true
  95. });
  96. Object.defineProperty(DxDeferRenderingComponent.prototype, "animation", {
  97. get: /**
  98. * Specifies the animation to be used to show the rendered content.
  99. */
  100. function () {
  101. return this._getOption('animation');
  102. },
  103. set: function (value) {
  104. this._setOption('animation', value);
  105. },
  106. enumerable: true,
  107. configurable: true
  108. });
  109. Object.defineProperty(DxDeferRenderingComponent.prototype, "disabled", {
  110. get: /**
  111. * Specifies whether the widget responds to user interaction.
  112. */
  113. function () {
  114. return this._getOption('disabled');
  115. },
  116. set: function (value) {
  117. this._setOption('disabled', value);
  118. },
  119. enumerable: true,
  120. configurable: true
  121. });
  122. Object.defineProperty(DxDeferRenderingComponent.prototype, "elementAttr", {
  123. get: /**
  124. * Specifies the attributes to be attached to the widget's root element.
  125. */
  126. function () {
  127. return this._getOption('elementAttr');
  128. },
  129. set: function (value) {
  130. this._setOption('elementAttr', value);
  131. },
  132. enumerable: true,
  133. configurable: true
  134. });
  135. Object.defineProperty(DxDeferRenderingComponent.prototype, "focusStateEnabled", {
  136. get: /**
  137. * Specifies whether the widget can be focused using keyboard navigation.
  138. */
  139. function () {
  140. return this._getOption('focusStateEnabled');
  141. },
  142. set: function (value) {
  143. this._setOption('focusStateEnabled', value);
  144. },
  145. enumerable: true,
  146. configurable: true
  147. });
  148. Object.defineProperty(DxDeferRenderingComponent.prototype, "height", {
  149. get: /**
  150. * Specifies the widget's height.
  151. */
  152. function () {
  153. return this._getOption('height');
  154. },
  155. set: function (value) {
  156. this._setOption('height', value);
  157. },
  158. enumerable: true,
  159. configurable: true
  160. });
  161. Object.defineProperty(DxDeferRenderingComponent.prototype, "hint", {
  162. get: /**
  163. * Specifies text for a hint that appears when a user pauses on the widget.
  164. */
  165. function () {
  166. return this._getOption('hint');
  167. },
  168. set: function (value) {
  169. this._setOption('hint', value);
  170. },
  171. enumerable: true,
  172. configurable: true
  173. });
  174. Object.defineProperty(DxDeferRenderingComponent.prototype, "hoverStateEnabled", {
  175. get: /**
  176. * Specifies whether the widget changes its state when a user pauses on it.
  177. */
  178. function () {
  179. return this._getOption('hoverStateEnabled');
  180. },
  181. set: function (value) {
  182. this._setOption('hoverStateEnabled', value);
  183. },
  184. enumerable: true,
  185. configurable: true
  186. });
  187. Object.defineProperty(DxDeferRenderingComponent.prototype, "renderWhen", {
  188. get: /**
  189. * Specifies when the widget content is rendered.
  190. */
  191. function () {
  192. return this._getOption('renderWhen');
  193. },
  194. set: function (value) {
  195. this._setOption('renderWhen', value);
  196. },
  197. enumerable: true,
  198. configurable: true
  199. });
  200. Object.defineProperty(DxDeferRenderingComponent.prototype, "rtlEnabled", {
  201. get: /**
  202. * Switches the widget to a right-to-left representation.
  203. */
  204. function () {
  205. return this._getOption('rtlEnabled');
  206. },
  207. set: function (value) {
  208. this._setOption('rtlEnabled', value);
  209. },
  210. enumerable: true,
  211. configurable: true
  212. });
  213. Object.defineProperty(DxDeferRenderingComponent.prototype, "showLoadIndicator", {
  214. get: /**
  215. * Indicates if a load indicator should be shown until the widget's content is rendered.
  216. */
  217. function () {
  218. return this._getOption('showLoadIndicator');
  219. },
  220. set: function (value) {
  221. this._setOption('showLoadIndicator', value);
  222. },
  223. enumerable: true,
  224. configurable: true
  225. });
  226. Object.defineProperty(DxDeferRenderingComponent.prototype, "staggerItemSelector", {
  227. get: /**
  228. * Specifies a jQuery selector of items that should be rendered using a staggered animation.
  229. */
  230. function () {
  231. return this._getOption('staggerItemSelector');
  232. },
  233. set: function (value) {
  234. this._setOption('staggerItemSelector', value);
  235. },
  236. enumerable: true,
  237. configurable: true
  238. });
  239. Object.defineProperty(DxDeferRenderingComponent.prototype, "tabIndex", {
  240. get: /**
  241. * Specifies the number of the element when the Tab key is used for navigating.
  242. */
  243. function () {
  244. return this._getOption('tabIndex');
  245. },
  246. set: function (value) {
  247. this._setOption('tabIndex', value);
  248. },
  249. enumerable: true,
  250. configurable: true
  251. });
  252. Object.defineProperty(DxDeferRenderingComponent.prototype, "visible", {
  253. get: /**
  254. * Specifies whether the widget is visible.
  255. */
  256. function () {
  257. return this._getOption('visible');
  258. },
  259. set: function (value) {
  260. this._setOption('visible', value);
  261. },
  262. enumerable: true,
  263. configurable: true
  264. });
  265. Object.defineProperty(DxDeferRenderingComponent.prototype, "width", {
  266. get: /**
  267. * Specifies the widget's width.
  268. */
  269. function () {
  270. return this._getOption('width');
  271. },
  272. set: function (value) {
  273. this._setOption('width', value);
  274. },
  275. enumerable: true,
  276. configurable: true
  277. });
  278. DxDeferRenderingComponent.prototype._createInstance = function (element, options) {
  279. return new defer_rendering_1.default(element, options);
  280. };
  281. DxDeferRenderingComponent.prototype.ngOnDestroy = function () {
  282. this._destroyWidget();
  283. };
  284. DxDeferRenderingComponent.decorators = [
  285. { type: core_1.Component, args: [{
  286. selector: 'dx-defer-rendering',
  287. template: '',
  288. providers: [
  289. template_host_1.DxTemplateHost,
  290. watcher_helper_1.WatcherHelper,
  291. nested_option_1.NestedOptionHost
  292. ]
  293. },] },
  294. ];
  295. /** @nocollapse */
  296. DxDeferRenderingComponent.ctorParameters = function () { return [
  297. { type: core_1.ElementRef, },
  298. { type: core_1.NgZone, },
  299. { type: template_host_1.DxTemplateHost, },
  300. { type: watcher_helper_1.WatcherHelper, },
  301. { type: nested_option_1.NestedOptionHost, },
  302. { type: platform_browser_2.TransferState, },
  303. { type: undefined, decorators: [{ type: core_1.Inject, args: [core_1.PLATFORM_ID,] },] },
  304. ]; };
  305. DxDeferRenderingComponent.propDecorators = {
  306. "accessKey": [{ type: core_1.Input },],
  307. "activeStateEnabled": [{ type: core_1.Input },],
  308. "animation": [{ type: core_1.Input },],
  309. "disabled": [{ type: core_1.Input },],
  310. "elementAttr": [{ type: core_1.Input },],
  311. "focusStateEnabled": [{ type: core_1.Input },],
  312. "height": [{ type: core_1.Input },],
  313. "hint": [{ type: core_1.Input },],
  314. "hoverStateEnabled": [{ type: core_1.Input },],
  315. "renderWhen": [{ type: core_1.Input },],
  316. "rtlEnabled": [{ type: core_1.Input },],
  317. "showLoadIndicator": [{ type: core_1.Input },],
  318. "staggerItemSelector": [{ type: core_1.Input },],
  319. "tabIndex": [{ type: core_1.Input },],
  320. "visible": [{ type: core_1.Input },],
  321. "width": [{ type: core_1.Input },],
  322. "onContentReady": [{ type: core_1.Output },],
  323. "onDisposing": [{ type: core_1.Output },],
  324. "onInitialized": [{ type: core_1.Output },],
  325. "onOptionChanged": [{ type: core_1.Output },],
  326. "onRendered": [{ type: core_1.Output },],
  327. "onShown": [{ type: core_1.Output },],
  328. "accessKeyChange": [{ type: core_1.Output },],
  329. "activeStateEnabledChange": [{ type: core_1.Output },],
  330. "animationChange": [{ type: core_1.Output },],
  331. "disabledChange": [{ type: core_1.Output },],
  332. "elementAttrChange": [{ type: core_1.Output },],
  333. "focusStateEnabledChange": [{ type: core_1.Output },],
  334. "heightChange": [{ type: core_1.Output },],
  335. "hintChange": [{ type: core_1.Output },],
  336. "hoverStateEnabledChange": [{ type: core_1.Output },],
  337. "renderWhenChange": [{ type: core_1.Output },],
  338. "rtlEnabledChange": [{ type: core_1.Output },],
  339. "showLoadIndicatorChange": [{ type: core_1.Output },],
  340. "staggerItemSelectorChange": [{ type: core_1.Output },],
  341. "tabIndexChange": [{ type: core_1.Output },],
  342. "visibleChange": [{ type: core_1.Output },],
  343. "widthChange": [{ type: core_1.Output },],
  344. };
  345. return DxDeferRenderingComponent;
  346. }(component_1.DxComponent));
  347. exports.DxDeferRenderingComponent = DxDeferRenderingComponent;
  348. var DxDeferRenderingModule = (function () {
  349. function DxDeferRenderingModule() {
  350. }
  351. DxDeferRenderingModule.decorators = [
  352. { type: core_1.NgModule, args: [{
  353. imports: [
  354. animation_1.DxoAnimationModule,
  355. integration_1.DxIntegrationModule,
  356. template_1.DxTemplateModule,
  357. platform_browser_1.BrowserTransferStateModule
  358. ],
  359. declarations: [
  360. DxDeferRenderingComponent
  361. ],
  362. exports: [
  363. DxDeferRenderingComponent,
  364. animation_1.DxoAnimationModule,
  365. template_1.DxTemplateModule
  366. ]
  367. },] },
  368. ];
  369. return DxDeferRenderingModule;
  370. }());
  371. exports.DxDeferRenderingModule = DxDeferRenderingModule;
  372. //# sourceMappingURL=defer-rendering.js.map