import Renderables from '../Renderables';
import { Timestamp } from '../timestamp';
/**
 * Implementation of the 'selectionItem' markup element. A div HTML element
 * is created and the and the classes lto-selection-tem is added to
 * allow CSS modifications.
 *
 * @see {@link IRenderable}
 * @see {@link IStackeable}
 */
var SelectionItem = /** @class */ (function () {
    function SelectionItem(message) {
        this.spec = message;
    }
    /**
     * @inheritDoc
     */
    SelectionItem.prototype.render = function (renderer, isNested) {
        var _this = this;
        var position = this.spec.position || 'left';
        var selectionItem = document.createElement('div');
        selectionItem.classList.add('lto-selection-item', "lto-" + position);
        selectionItem.setAttribute("name", this.spec.name || "");
        if (this.spec.id !== undefined) {
            selectionItem.id = this.spec.id;
        }
        if (this.spec.class !== undefined) {
            this.spec.class.split(" ").forEach(function (e) { return selectionItem.classList.add(e); });
        }
        selectionItem.appendChild(Timestamp.render());
        var elements = (this.spec.elements || []).map(function (e) { return renderer.render(e, _this); });
        elements.forEach(function (e) { return e.forEach(function (x) { return selectionItem.appendChild(x); }); });
        if (isNested) {
            selectionItem.classList.add('lto-nested');
        }
        return selectionItem;
    };
    return SelectionItem;
}());
export { SelectionItem };
Renderables.register("selectionItem", SelectionItem);
//# sourceMappingURL=index.js.map