bemreact

index.js

'use strict';

const React = require('react');
const ReactDOMServer = require('react-dom/server');

const bemxjst = require('../bem-xjst');
const bemreact = bemxjst.bemreact;

const templates = bemreact.compile(function() {
  'use strict';

  block('fuck')(
      tag()('section'),
      content()(function() {
          return `${this.ctx.content} works fine`;
      })
  );
  block('link')(
      tag()('a'),
      attrs()(function() {
          return Object.assign({}, this.ctx.attrs, { href: this.ctx.url });
      })
  );
  block('fuck')(
      tag()('main'),
      content()(function() {
          return {
              block: 'link',
              url: '#',
              content: applyNext()
          };
      })
  );
});

let reactArguments = templates.apply({
    block: 'fuck',
    mods: {
        size: 's',
        view: 'extra',
        theme: 'alfa-on-color'
    },
    attrs: {
        onClick: 'do something',
        'data-test': 'test-data'
    },
    content: 'Anton'
});

function makeComponent(args) {
    return React.createElement(
        args[0],
        args[1],
        Array.isArray(args[2]) ?
            makeComponent(args[2]) :
            args[2]);
}

let reactComponent = makeComponent(reactArguments);

let reactDOM = ReactDOMServer.renderToString(reactComponent);

console.log(reactDOM);