@lonelyplanet/dotcom-core/dist/classes/renderer.js

This package is meant to house some of our more common UI and shared libs across dotcom applications.

"use strict";

var __assign = this && this.__assign || Object.assign || function (t) {
  for (var s, i = 1, n = arguments.length; i < n; i++) {
    s = arguments[i];

    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p)) t[p] = s[p];
  }

  return t;
};

var __decorate = this && this.__decorate || function (decorators, target, key, desc) {
  var c = arguments.length,
      r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc,
      d;
  if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
  return c > 3 && r && Object.defineProperty(target, key, r), r;
};

var __metadata = this && this.__metadata || function (k, v) {
  if (typeof Reflect === "object" && typeof Reflect.metadata === "function") return Reflect.metadata(k, v);
};

var __param = this && this.__param || function (paramIndex, decorator) {
  return function (target, key) {
    decorator(target, key, paramIndex);
  };
};

Object.defineProperty(exports, "__esModule", {
  value: true
});

var inversify_1 = require("inversify");

var React = require("react");

var server_1 = require("react-dom/server");

var types_1 = require("../types");

var Renderer =
/** @class */
function () {
  function Renderer(loader, render, renderToString) {
    this.loader = loader;
    this._render = render;
    this._renderToString = renderToString;
  }

  Renderer.prototype.render = function (_a) {
    var component = _a.component,
        _b = _a.props,
        props = _b === void 0 ? {} : _b,
        el = _a.el;
    var Component = this.loadComponent(component);
    var instance = React.createElement(Component, __assign({}, props));

    var html = this._renderToString(instance);

    if (!el) {
      return server_1.renderToStaticMarkup(React.createElement("div", {
        "data-lpui-component": component,
        "data-lpui-component-props": JSON.stringify(props),
        dangerouslySetInnerHTML: {
          __html: html
        }
      }));
    }

    return this._render(instance, el);
  };

  Renderer.prototype.loadComponent = function (name) {
    return this.loader(name);
  };

  Renderer = __decorate([inversify_1.injectable(), __param(0, inversify_1.inject(types_1.default.IRequire)), __param(1, inversify_1.inject(types_1.default.render)), __param(2, inversify_1.inject(types_1.default.renderToString)), __metadata("design:paramtypes", [Function, Object, Object])], Renderer);
  return Renderer;
}();

exports.default = Renderer;