SkeletonPlaceholder.js 3.0 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980
  1. 'use strict';
  2. function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
  3. function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
  4. function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
  5. /**
  6. * Licensed Materials - Property of IBM
  7. * IBM Cognos Products: BI Cloud (C) Copyright IBM Corp. 2019, 2021
  8. * US Government Users Restricted Rights - Use, duplication or disclosure restricted by GSA ADP Schedule Contract with IBM Corp.
  9. */
  10. define(['react', 'prop-types'], function (React, PropTypes) {
  11. var _class, _temp;
  12. return _temp = _class = function (_React$Component) {
  13. _inherits(SkeletonPlaceholder, _React$Component);
  14. function SkeletonPlaceholder() {
  15. _classCallCheck(this, SkeletonPlaceholder);
  16. return _possibleConstructorReturn(this, _React$Component.apply(this, arguments));
  17. }
  18. SkeletonPlaceholder.prototype.remove = function remove() {
  19. this.props.shown = false;
  20. };
  21. SkeletonPlaceholder.prototype.render = function render() {
  22. if (this.props.shown) {
  23. if (this.props.placeholderImage) {
  24. var img = this.props.placeholderImage;
  25. return React.createElement(
  26. 'div',
  27. { className: 'skeletonPlaceholder' },
  28. React.createElement(
  29. 'div',
  30. { className: 'shimmer' },
  31. React.createElement('img', { src: img, alt: this.props.alt })
  32. )
  33. );
  34. } else if (this.props.placeholderSVG) {
  35. return React.createElement(
  36. 'div',
  37. { className: 'skeletonPlaceholder' },
  38. React.createElement(
  39. 'div',
  40. { className: 'shimmer' },
  41. React.createElement(
  42. 'svg',
  43. { className: 'shimmer', x: '0px', y: '0px', width: '256px', height: '256px', viewBox: '0 0 256 256' },
  44. React.createElement('use', { xlinkHref: this.props.placeholderSVG })
  45. )
  46. )
  47. );
  48. } else if (this.props.placeholderText) {
  49. return React.createElement(
  50. 'div',
  51. { className: 'skeletonPlaceholder placeholderText' },
  52. this.props.placeholderText
  53. );
  54. } else {
  55. return React.createElement('div', { className: 'skeletonPlaceholder noimage' });
  56. }
  57. } else {
  58. return null;
  59. }
  60. };
  61. return SkeletonPlaceholder;
  62. }(React.Component), _class.propTypes = {
  63. placeholderImage: PropTypes.img,
  64. placeholderSVG: PropTypes.svg,
  65. alt: PropTypes.string,
  66. shown: PropTypes.bool,
  67. placeholderText: PropTypes.string
  68. }, _temp;
  69. });
  70. //# sourceMappingURL=SkeletonPlaceholder.js.map