usepages-render-blocks/dist/cjs.js

A renderer of blocks for https://usePages.today

'use strict';

function _interopDefault (ex) { return 'default' in ex ? ex['default'] : ex; }

var React = _interopDefault(require('react'));

var babelHelpers = {};

babelHelpers.extends = Object.assign || function (target) {
  for (var i = 1; i < arguments.length; i++) {
    var source = arguments[i];

    for (var key in source) {
      if (Object.prototype.hasOwnProperty.call(source, key)) {
        target[key] = source[key];
      }
    }
  }

  return target;
};

babelHelpers;

var RESERVED = ['break', 'case', 'class', 'catch', 'const', 'continue', 'debugger', 'default', 'delete', 'do', 'else', 'export', 'extends', 'finally', 'for', 'function', 'if', 'import', 'in', 'new', 'return', 'super', 'switch', 'this', 'throw', 'try', 'var', 'void', 'while', 'with', 'yield', '=>', 'abstract', 'boolean', 'byte', 'char', 'double', 'final', 'float', 'goto', 'int', 'long', 'native', 'short', 'synchronized', 'throws', 'transient', 'volatile', 'async', 'await', 'implements', 'package', 'protected', 'static', 'let', 'interface', 'private', 'public', 'Boolean', 'Number', 'RegExp', 'String'].map(function (w) {
  return '\\s+' + w + '\\s+|^' + w + '$|\\s+' + w + '$|^' + w + '\\s+';
}).join('|');

var SYMBOLS = [';', '\\(', '\\)', 'window', '[\\s+|\\w+]=[\\s+|\\w+]'].join('|');

var BLACKLIST = new RegExp(RESERVED + '|' + SYMBOLS, 'i');

function empty () {};

function toFn() {
  var code = arguments.length <= 0 || arguments[0] === undefined ? '' : arguments[0];

  for (var _len = arguments.length, args = Array(_len > 1 ? _len - 1 : 0), _key = 1; _key < _len; _key++) {
    args[_key - 1] = arguments[_key];
  }

  return BLACKLIST.test(code) ? empty : new Function(args, 'return ' + code + ';');
}

function shouldRender(when, props) {
  return toFn(when, 'props')(props);
}

function raw() {
  var props = arguments.length <= 0 || arguments[0] === undefined ? {} : arguments[0];
  var panelProps = arguments.length <= 1 || arguments[1] === undefined ? {} : arguments[1];

  var rawProps = {};

  Object.keys(props).forEach(function (key) {
    var match = typeof props[key] === 'string' && props[key].match(/^props\.(.+)/);
    rawProps[key] = match && panelProps[match[1]] ? panelProps[match[1]] : props[key];
  });

  return rawProps;
}

function render(blocks, sources, keyPrefix) {
  var props = arguments.length <= 3 || arguments[3] === undefined ? {} : arguments[3];

  if (blocks && typeof blocks.map === 'function') {
    return blocks.map(function (instance, i) {
      // TODO remove once we've fully migrated block instead of type
      var block = instance.block || instance.type;

      try {
        if (instance.when && !shouldRender(instance.when, props)) return null;

        var Block = sources[block] || sources.Unknown;

        var rawProps = raw(instance.props, props);

        return React.createElement(Block, babelHelpers.extends({}, rawProps, { key: keyPrefix + '-' + i, _block: block }));
      } catch (err) {
        var givenProps = Object.keys(instance.props).map(function (key) {
          return React.createElement(
            'span',
            { key: key },
            '`$',
            key,
            ': $',
            instance.props[key],
            '`'
          );
        });

        return React.createElement(
          'div',
          { style: style.error },
          React.createElement(
            'div',
            null,
            'We couldn\'t render your block ',
            block,
            '.'
          ),
          React.createElement(
            'div',
            null,
            'You gave it these props:'
          ),
          React.createElement(
            'div',
            null,
            givenProps
          ),
          React.createElement(
            'div',
            null,
            'This is what failed:'
          ),
          React.createElement(
            'div',
            null,
            err.message
          ),
          React.createElement(
            'div',
            null,
            err.stack
          )
        );
      }
    }).filter(function (block) {
      return block;
    });
  } else {
    return React.createElement(
      'div',
      { style: style.error },
      React.createElement(
        'div',
        null,
        'We couldn\'t render your blocks.'
      ),
      React.createElement(
        'div',
        null,
        'Make sure "blocks" use square brackets [] instead of curly braces {} or anything else.'
      )
    );
  }
}

var style = {
  error: {
    backgroundColor: '#ff5959',
    color: 'white',
    fontSize: 12,
    padding: 20
  }
};

module.exports = render;