import { StringColumn } from '../model';
import { filterMissingMarkup, findFilterMissing } from '../ui/missing';
import { renderMissingDOM } from './missing';
import { setText, exampleText } from './utils';
import { cssClass } from '../styles';
/**
 * renders a string with additional alignment behavior
 * one instance factory shared among strings
 * @internal
 */
var StringCellRenderer = /** @class */ (function () {
    function StringCellRenderer() {
        this.title = 'Default';
    }
    StringCellRenderer.prototype.canRender = function (col) {
        return col instanceof StringColumn;
    };
    StringCellRenderer.prototype.create = function (col) {
        var align = col.alignment || 'left';
        return {
            template: "<div" + (align !== 'left' ? " class=\"" + cssClass(align) + "\"" : '') + "> </div>",
            update: function (n, d) {
                renderMissingDOM(n, col, d);
                if (col.escape) {
                    setText(n, col.getLabel(d));
                }
                else {
                    n.innerHTML = col.getLabel(d);
                }
            }
        };
    };
    StringCellRenderer.prototype.createGroup = function (col, context) {
        return {
            template: "<div> </div>",
            update: function (n, group) {
                return context.tasks.groupExampleRows(col, group, 'string', function (rows) { return exampleText(col, rows); }).then(function (text) {
                    if (typeof text === 'symbol') {
                        return;
                    }
                    if (col.escape) {
                        setText(n, text);
                    }
                    else {
                        n.innerHTML = text;
                    }
                });
            }
        };
    };
    StringCellRenderer.interactiveSummary = function (col, node) {
        var form = node;
        var filterMissing = findFilterMissing(node);
        var input = node.querySelector('input[type="text"]');
        var isRegex = node.querySelector('input[type="checkbox"]');
        var update = function () {
            input.disabled = filterMissing.checked;
            isRegex.disabled = filterMissing.checked;
            if (filterMissing.checked) {
                col.setFilter(StringColumn.FILTER_MISSING);
                return;
            }
            var valid = input.value.trim();
            filterMissing.disabled = valid.length > 0;
            if (valid.length <= 0) {
                col.setFilter(null);
                return;
            }
            col.setFilter(isRegex.checked ? new RegExp(input.value) : input.value);
        };
        filterMissing.onchange = update;
        input.onchange = update;
        isRegex.onchange = update;
        form.onsubmit = function (evt) {
            evt.preventDefault();
            evt.stopPropagation();
            update();
            return false;
        };
        return function (actCol) {
            col = actCol;
            var bak = col.getFilter() || '';
            var bakMissing = bak === StringColumn.FILTER_MISSING;
            if (bakMissing) {
                bak = '';
            }
            filterMissing.checked = bakMissing;
            input.value = bak instanceof RegExp ? bak.source : bak;
            isRegex.checked = bak instanceof RegExp;
            filterMissing.disabled = input.value.trim().length > 0;
            input.disabled = filterMissing.checked;
            isRegex.disabled = filterMissing.checked;
        };
    };
    StringCellRenderer.prototype.createSummary = function (col, _context, interactive) {
        if (!interactive) {
            return {
                template: "<div></div>",
                update: function (node) {
                    var filter = col.getFilter() || '';
                    node.textContent = toString(filter);
                }
            };
        }
        var bak = col.getFilter() || '';
        var bakMissing = bak === StringColumn.FILTER_MISSING;
        if (bakMissing) {
            bak = '';
        }
        var update;
        return {
            template: "<form><input type=\"text\" placeholder=\"Filter " + col.desc.label + "...\" autofocus value=\"" + ((bak instanceof RegExp) ? bak.source : bak) + "\">\n          <label class=\"" + cssClass('checkbox') + "\"><input type=\"checkbox\" " + ((bak instanceof RegExp) ? 'checked="checked"' : '') + "><span>Use regular expressions</span></label>\n          " + filterMissingMarkup(bakMissing) + "</form>",
            update: function (node) {
                if (!update) {
                    update = StringCellRenderer.interactiveSummary(col, node);
                }
                update(col);
            }
        };
    };
    return StringCellRenderer;
}());
export default StringCellRenderer;
function toString(filter) {
    if (filter == null || filter === '' || filter === StringColumn.FILTER_MISSING) {
        return '';
    }
    if (filter instanceof RegExp) {
        return filter.source;
    }
    return String(filter);
}
//# sourceMappingURL=StringCellRenderer.js.map