Nie możesz wybrać więcej, niż 25 tematów Tematy muszą się zaczynać od litery lub cyfry, mogą zawierać myślniki ('-') i mogą mieć do 35 znaków.

componentFromStream.js 3.4 KiB

3 lat temu
123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109
  1. "use strict";
  2. var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
  3. exports.__esModule = true;
  4. exports.default = exports.componentFromStreamWithConfig = void 0;
  5. var _inheritsLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/inheritsLoose"));
  6. var _react = require("react");
  7. var _changeEmitter = require("change-emitter");
  8. var _symbolObservable = _interopRequireDefault(require("symbol-observable"));
  9. var _setObservableConfig = require("./setObservableConfig");
  10. var componentFromStreamWithConfig = function componentFromStreamWithConfig(config) {
  11. return function (propsToVdom) {
  12. return (
  13. /*#__PURE__*/
  14. function (_Component) {
  15. (0, _inheritsLoose2.default)(ComponentFromStream, _Component);
  16. function ComponentFromStream() {
  17. var _config$fromESObserva;
  18. var _this;
  19. for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
  20. args[_key] = arguments[_key];
  21. }
  22. _this = _Component.call.apply(_Component, [this].concat(args)) || this;
  23. _this.state = {
  24. vdom: null
  25. };
  26. _this.propsEmitter = (0, _changeEmitter.createChangeEmitter)();
  27. _this.props$ = config.fromESObservable((_config$fromESObserva = {
  28. subscribe: function subscribe(observer) {
  29. var unsubscribe = _this.propsEmitter.listen(function (props) {
  30. if (props) {
  31. observer.next(props);
  32. } else {
  33. observer.complete();
  34. }
  35. });
  36. return {
  37. unsubscribe: unsubscribe
  38. };
  39. }
  40. }, _config$fromESObserva[_symbolObservable.default] = function () {
  41. return this;
  42. }, _config$fromESObserva));
  43. _this.vdom$ = config.toESObservable(propsToVdom(_this.props$));
  44. return _this;
  45. }
  46. var _proto = ComponentFromStream.prototype;
  47. _proto.componentWillMount = function componentWillMount() {
  48. var _this2 = this;
  49. // Subscribe to child prop changes so we know when to re-render
  50. this.subscription = this.vdom$.subscribe({
  51. next: function next(vdom) {
  52. _this2.setState({
  53. vdom: vdom
  54. });
  55. }
  56. });
  57. this.propsEmitter.emit(this.props);
  58. };
  59. _proto.componentWillReceiveProps = function componentWillReceiveProps(nextProps) {
  60. // Receive new props from the owner
  61. this.propsEmitter.emit(nextProps);
  62. };
  63. _proto.shouldComponentUpdate = function shouldComponentUpdate(nextProps, nextState) {
  64. return nextState.vdom !== this.state.vdom;
  65. };
  66. _proto.componentWillUnmount = function componentWillUnmount() {
  67. // Call without arguments to complete stream
  68. this.propsEmitter.emit(); // Clean-up subscription before un-mounting
  69. this.subscription.unsubscribe();
  70. };
  71. _proto.render = function render() {
  72. return this.state.vdom;
  73. };
  74. return ComponentFromStream;
  75. }(_react.Component)
  76. );
  77. };
  78. };
  79. exports.componentFromStreamWithConfig = componentFromStreamWithConfig;
  80. var componentFromStream = function componentFromStream(propsToVdom) {
  81. return componentFromStreamWithConfig(_setObservableConfig.config)(propsToVdom);
  82. };
  83. var _default = componentFromStream;
  84. exports.default = _default;