Adjacent JSX elements

adjacent-elements.jsx

'use strict';

/**
 * Module dependencies.
 */
const React = require('react');

/**
 * Function that returns adjacent JSX elements.
 *
 * @return {Array} - The array of React elements.
 */
module.exports = function() {
    const props = this.props || {};

    if (props.list && props.list.constructor === Array) {
        return props.list.map(function(item, index) {
            return (
                <li key={index}>
                    {typeof item === 'string' ? item.toUpperCase() : item}
                </li>
            );
        });
    } else {
        return [];
    }
};

Component.jsx

'use strict';

/**
 * Module dependencies.
 */
const React = require('react');
const adjacentElements = require('./adjacent-elements.jsx');

/**
 * Component.
 */
module.exports = React.createClass({
    getDefaultProps: function() {
        return {
            list: ['foo', 'bar', 'baz']
        };
    },

    render: function() {
        return (
            <ol>
                {/* ensure the component context is bound */}
                {adjacentElements.apply(this)}
            </ol>
        );
    }
});