import { forEach } from '../../renderer/utils';
import { cssClass } from '../../styles';
/** @internal */
export default function appendDate(col, node) {
    var current = col.getDateGrouper();
    var granularity = current.granularity;
    var circular = current.circular;
    var html = '';
    for (var _i = 0, _a = ['century', 'decade', 'year', 'month', 'week', 'day_of_week', 'day_of_month', 'day_of_year', 'hour', 'minute', 'second']; _i < _a.length; _i++) {
        var g = _a[_i];
        html += "<label class=\"" + cssClass('checkbox') + "\">\n    <input type=\"radio\" name=\"granularity\" value=\"" + g + "\" " + (granularity === g ? 'checked' : '') + ">\n    <span> by " + g + " </span>\n  </label>";
    }
    html += "<label class=\"" + cssClass('checkbox') + "\">\n    <input type=\"checkbox\" name=\"circular\" " + (circular ? 'checked' : '') + ">\n    <span> Circular </span>\n  </label>";
    node.insertAdjacentHTML('beforeend', html);
    var update = function () {
        col.setDateGrouper({ granularity: granularity, circular: circular });
    };
    node.querySelector('input[name=circular]').addEventListener('change', function (evt) {
        circular = evt.currentTarget.checked;
        update();
    }, { passive: true });
    forEach(node, 'input[name=granularity]', function (d) {
        d.addEventListener('change', function () {
            granularity = d.value;
            update();
        }, { passive: true });
    });
}
//# sourceMappingURL=groupDate.js.map