/*! ColReorder 3.0.0 for DataTables
 * Copyright (c) SpryMedia Ltd - datatables.net/license
 */

import DataTable, { util, Dom, Api } from 'datatables.net';

/**
 * Mutate an array, moving a set of elements into a new index position
 *
 * @param arr Array to modify
 * @param from Start move index
 * @param count Number of elements to move
 * @param to Index where the start element will move to
 */
function arrayMove(arr, from, count, to) {
    let movers = arr.splice(from, count);
    // Add delete and start to the array, so we can use it for the `apply`
    movers.unshift(0); // splice delete param
    movers.unshift(to < from ? to : to - count + 1); // splice start param
    arr.splice.apply(arr, movers);
}
/**
 * Run finishing activities after one or more columns have been reordered.
 *
 * @param dt DataTable being operated on - must be a single table instance
 */
function finalise(dt) {
    // Cache invalidation. Always read from the data object rather
    // than reading back from the DOM since it could have been
    // changed by a renderer
    dt.rows().invalidate('data');
    // Redraw the header / footer. Its a little bit of a hack this, as DT
    // doesn't expose the header draw as an API method. It calls state
    // saving, so we don't need to here.
    dt.column(0).visible(dt.column(0).visible());
    dt.columns.adjust();
    // Fire an event so other plug-ins can update
    let order = dt.colReorder.order();
    dt.trigger('columns-reordered', [
        {
            order: order,
            mapping: invertKeyValues(order)
        }
    ]);
}
/**
 * Get the original indexes in their current order
 *
 * @param dt DataTable being operated on - must be a single table instance
 * @returns Original indexes in current order
 */
function getOrder(dt) {
    return dt.settings()[0].columns.map(function (col) {
        return col._crOriginalIdx;
    });
}
/**
 * Manipulate a header / footer array in DataTables settings to reorder
 * the columns.
 */
function headerUpdate(structure, map, from, to) {
    let done = [];
    for (let i = 0; i < structure.length; i++) {
        let headerRow = structure[i];
        arrayMove(headerRow, from[0], from.length, to);
        for (let j = 0; j < headerRow.length; j++) {
            let cell = headerRow[j].cell;
            // Only work on a DOM element once, otherwise we risk remapping a
            // remapped value (etc).
            if (done.includes(cell)) {
                continue;
            }
            let indexes = cell.getAttribute('data-dt-column').split(',');
            let mapped = indexes
                .map(function (idx) {
                return map[idx];
            })
                .join(',');
            // Update data attributes for the new column position
            cell.setAttribute('data-dt-column', mapped);
            done.push(cell);
        }
    }
}
/**
 * Setup for ColReorder API operations
 *
 * @param dt DataTable(s) being operated on - might have multiple tables!
 */
function init(api) {
    // Assign the original column index to a parameter that we can lookup.
    // On the first pass (i.e. when the parameter hasn't yet been set), the
    // index order will be the original order, so this is quite a simple
    // assignment.
    api.columns().iterator('column', function (s, idx) {
        let columns = s.columns;
        if (columns[idx]._crOriginalIdx === undefined) {
            columns[idx]._crOriginalIdx = idx;
        }
    });
}
/**
 * Switch the key value pairing of an index array to be value key (i.e. the old value is now the
 * key). For example consider [ 2, 0, 1 ] this would be returned as [ 1, 2, 0 ].
 *
 *  @param   array arr Array to switch around
 */
function invertKeyValues(arr) {
    let result = [];
    for (let i = 0; i < arr.length; i++) {
        result[arr[i]] = i;
    }
    return result;
}
function transposeArray(arr, inverted) {
    for (let i = 0; i < arr.length; i++) {
        arr[i] = inverted[arr[i]];
    }
    arr.sort();
    return arr;
}
/**
 * Move one or more columns from one index to another.
 *
 * This method has a lot of knowledge about how DataTables works internally.
 * If DataTables changes how it handles cells, columns, etc, then this
 * method would need to be updated accordingly.
 *
 * @param dt DataTable being operated on - must be a single table instance
 * @param from Column indexes to move
 * @param to Destination index (starting if multiple)
 */
function move(dt, from, to) {
    let i, j;
    let settings = dt.settings()[0];
    let columns = settings.columns;
    let newOrder = columns.map(function (col, idx) {
        return idx;
    });
    // The to column in already inside the from column(s) (might be the same)
    // no change required
    if (from.includes(to)) {
        return;
    }
    // A reverse index array so we can look up new indexes from old
    arrayMove(newOrder, from[0], from.length, to);
    let reverseIndexes = invertKeyValues(newOrder);
    // Main column
    arrayMove(columns, from[0], from.length, to);
    // Per row manipulations
    for (i = 0; i < settings.data.length; i++) {
        var data = settings.data[i];
        // Allow for sparse array
        if (!data) {
            continue;
        }
        var cells = data.cells;
        // Not yet rendered
        if (!cells) {
            continue;
        }
        // Array of cells
        arrayMove(cells, from[0], from.length, to);
        for (j = 0; j < cells.length; j++) {
            // Reinsert into the document in the new order
            if (data.tr && cells[j] && columns[j].visible) {
                data.tr.appendChild(cells[j]);
            }
            // Update lookup index
            if (cells[j] && cells[j]._DT_CellIndex) {
                cells[j]._DT_CellIndex.column = j;
            }
        }
    }
    // Per column manipulation
    for (i = 0; i < columns.length; i++) {
        let column = columns[i];
        // Data column sorting
        transposeArray(column.orderData, reverseIndexes);
        // Update the column indexes
        column.idx = reverseIndexes[column.idx];
        // Reorder the colgroup > col elements for the new order
        if (column.visible) {
            settings.colgroup.append(column.colEl);
        }
    }
    // Header and footer
    headerUpdate(settings.header, reverseIndexes, from, to);
    headerUpdate(settings.footer, reverseIndexes, from, to);
    // Search - core. Here the `searches` object is keyed by the columns that
    // the search applies to, which needs to be updated, but also there is a
    // `columns` array for each property which must also be updated.
    util.object.each(settings.searches, (key, search) => {
        let columns = transposeArray(search.columns, reverseIndexes);
        // In case there is an overlap between those which have been reordered
        // and those still to be done, we need to use a name that indicates that
        // it has been reordered
        if (key !== '*') {
            settings.searches[columns.join(',') + '-transposed'] = search;
            delete settings.searches[key];
        }
    });
    // And then delete the transposed ones
    util.object.each(settings.searches, (key, search) => {
        if (key.includes('-transposed')) {
            settings.searches[key.replace('-transposed', '')] = search;
            delete settings.searches[key];
        }
    });
    // Search - fixed. Similar to `searches` but there is an inner object that
    // is keyed by the name of the fixed search.
    util.object.each(settings.searchesFixed, (key, fixed) => {
        util.object.each(settings.searchesFixed[key], (name, search) => {
            transposeArray(search.columns, reverseIndexes);
        });
        // Top level object is named by columns
        if (key !== '*') {
            settings.searchesFixed[key + '-transposed'] = settings.searchesFixed[key];
            delete settings.searchesFixed[key];
        }
    });
    // And then delete the transposed ones
    util.object.each(settings.searchesFixed, (key, fixed) => {
        if (key.includes('-transposed')) {
            let first = fixed[Object.keys(fixed)[0]];
            settings.searchesFixed[first.columns.join(',')] = fixed;
            delete settings.searchesFixed[key];
        }
    });
    // Ordering indexes update - note that the sort listener on the
    // header works out the index to apply on each draw, so it doesn't
    // need to be updated here.
    orderingIndexes(reverseIndexes, settings.order);
    if (Array.isArray(settings.orderFixed)) {
        orderingIndexes(reverseIndexes, settings.orderFixed);
    }
    else if (settings.orderFixed.pre) {
        orderingIndexes(reverseIndexes, settings.orderFixed.pre);
    }
    else if (settings.orderFixed.post) {
        orderingIndexes(reverseIndexes, settings.orderFixed.pre);
    }
    settings.lastOrder.forEach(function (el) {
        el.src = reverseIndexes[el.src];
    });
    // Fire an event so other plug-ins can update
    dt.trigger('column-reorder', [
        dt.settings()[0],
        {
            from: from,
            to: to,
            mapping: reverseIndexes
        }
    ]);
}
/**
 * Update the indexing for ordering arrays
 *
 * @param map Reverse index map
 * @param order Array to update
 */
function orderingIndexes(map, order) {
    // Can happen if the order was deleted from a saved state
    if (!order) {
        return;
    }
    for (let i = 0; i < order.length; i++) {
        let el = order[i];
        if (typeof el === 'number') {
            // Just a number
            order[i] = map[el];
        }
        else if (util.is.plainObject(el) && el.idx !== undefined) {
            // New index in an object style
            el.idx = map[el.idx];
        }
        else if (Array.isArray(el) && typeof el[0] === 'number') {
            // The good old fixes length array
            el[0] = map[el[0]];
        }
        // No need to update if in object + .name style
    }
}
/**
 * Take an index array for the current positioned, reordered to what you want
 * them to be.
 *
 * @param dt DataTable being operated on - must be a single table instance
 * @param order Indexes from current order, positioned as you want them to be
 */
function setOrder(dt, order, original) {
    let changed = false;
    let i;
    if (order.length !== dt.columns().count()) {
        dt.error('ColReorder - column count mismatch');
        return;
    }
    // The order given is based on the original indexes, rather than the
    // existing ones, so we need to translate from the original to current
    // before then doing the order
    if (original) {
        order = transpose(dt, order, 'toCurrent');
    }
    // The API is array index as the desired position, but our algorithm below is
    // for array index as the current position. So we need to invert for it to work.
    let setOrder = invertKeyValues(order);
    // Move columns, one by one with validation disabled!
    for (i = 0; i < setOrder.length; i++) {
        let currentIndex = setOrder.indexOf(i);
        if (i !== currentIndex) {
            // Reorder our switching error
            arrayMove(setOrder, currentIndex, 1, i);
            // Do the reorder
            move(dt, [currentIndex], i);
            changed = true;
        }
    }
    // Reorder complete
    if (changed) {
        finalise(dt);
    }
}
/**
 * Convert the DataTables header structure array into a 2D array where each
 * element has a reference to its TH/TD cell (regardless of spanning).
 *
 * @param structure Header / footer structure object
 * @returns 2D array of header cells
 */
function structureFill(structure) {
    let filledIn = [];
    for (let row = 0; row < structure.length; row++) {
        filledIn.push([]);
        for (let col = 0; col < structure[row].length; col++) {
            let cell = structure[row][col];
            if (cell) {
                for (let rowInner = 0; rowInner < cell.rowspan; rowInner++) {
                    if (!filledIn[row + rowInner]) {
                        filledIn[row + rowInner] = [];
                    }
                    for (let colInner = 0; colInner < cell.colspan; colInner++) {
                        filledIn[row + rowInner][col + colInner] = cell.cell;
                    }
                }
            }
        }
    }
    return filledIn;
}
/**
 * Convert the index type
 *
 * @param dt DataTable to work on
 * @param idx Index to transform
 * @param dir Transform direction
 * @returns Converted number(s)
 */
function transpose(dt, idx, dir) {
    var order = dt.colReorder.order();
    var columns = dt.settings()[0].columns;
    if (dir === 'toCurrent' || dir === 'fromOriginal') {
        // Given an original index, want the current
        return !Array.isArray(idx)
            ? order.indexOf(idx)
            : idx.map(function (index) {
                return order.indexOf(index);
            });
    }
    // Given a current index, want the original
    return !Array.isArray(idx)
        ? columns[idx]._crOriginalIdx
        : idx.map(function (index) {
            return columns[index]._crOriginalIdx;
        });
}
/**
 * Validate that a requested move is okay. This includes bound checking
 * and that it won't split colspan'ed cells.
 *
 * @param table API instance
 * @param from Column indexes to move
 * @param to Destination index (starting if multiple)
 * @returns Validation result
 */
function validateMove(table, from, to) {
    let columns = table.columns().count();
    // Sanity and bound checking
    if (from[0] < to && to < from[from.length]) {
        return false;
    }
    if (from[0] < 0 && from[from.length - 1] > columns) {
        return false;
    }
    if (to < 0 && to > columns) {
        return false;
    }
    // No change - it's valid
    if (from.includes(to)) {
        return true;
    }
    if (!validateStructureMove(table.table().header.structure(), from, to)) {
        return false;
    }
    if (!validateStructureMove(table.table().footer.structure(), from, to)) {
        return false;
    }
    return true;
}
/**
 * For a given structure check that the move is valid.
 * @param structure
 * @param from
 * @param to
 * @returns
 */
function validateStructureMove(structure, from, to) {
    let header = structureFill(structure);
    let i;
    // Shuffle the header cells around
    for (i = 0; i < header.length; i++) {
        arrayMove(header[i], from[0], from.length, to);
    }
    // Sanity check that the headers are next to each other
    for (i = 0; i < header.length; i++) {
        let seen = [];
        for (let j = 0; j < header[i].length; j++) {
            let cell = header[i][j];
            if (!seen.includes(cell)) {
                // Hasn't been seen before
                seen.push(cell);
            }
            else if (seen[seen.length - 1] !== cell) {
                // Has been seen before and is not the previous cell - validation failed
                return false;
            }
        }
    }
    return true;
}

// Sanity check
if (!DataTable.versionCheck('3')) {
    throw 'Warning: ColReorder requires DataTables 3 or newer';
}
/**
 * This is one possible UI for column reordering in DataTables. In this case
 * columns are reordered by clicking and dragging a column header. It calculates
 * where columns can be dropped based on the column header used to start the drag
 * and then `colReorder.move()` method to alter the DataTable.
 */
class ColReorder {
    disable() {
        this.c.enable = false;
        return this;
    }
    enable(flag = true) {
        if (flag === false) {
            return this.disable();
        }
        this.c.enable = true;
        return this;
    }
    constructor(dt, opts) {
        this.dom = {
            drag: null
        };
        this.c = {
            columns: null,
            enable: null,
            headerRows: null,
            order: null
        };
        this.s = {
            dropZones: [],
            mouse: {
                absLeft: -1,
                offset: {
                    x: -1,
                    y: -1
                },
                start: {
                    x: -1,
                    y: -1
                },
                target: null,
                targets: []
            },
            scrollInterval: null
        };
        let ctx = dt.settings()[0];
        // Check if ColReorder already has been initialised on this DataTable - only
        // one can exist.
        if (ctx._colReorder) {
            return;
        }
        dt.settings()[0]._colReorder = this;
        this.dt = dt;
        util.object.assign(this.c, ColReorder.defaults, opts);
        init(dt);
        dt.on('stateSaveParams', function (e, s, d) {
            d.colReorder = getOrder(dt);
        });
        dt.on('destroy', function () {
            dt.off('.colReorder');
            dt.colReorder.reset();
        });
        // Initial ordering / state restoring
        let loaded = dt.state.loaded();
        let order = this.c.order;
        if (loaded && loaded.colReorder && dt.columns().count() === loaded.colReorder.length) {
            order = loaded.colReorder;
        }
        if (order) {
            dt.ready(function () {
                setOrder(dt, order, true);
            });
        }
        dt.table()
            .header.structure()
            .forEach((row, rowIdx) => {
            let headerRows = this.c.headerRows;
            for (let i = 0; i < row.length; i++) {
                if (!headerRows || headerRows.includes(rowIdx)) {
                    if (row[i] && row[i].cell) {
                        this._addListener(row[i].cell);
                    }
                }
            }
        });
    }
    /**
     * Attach the mouse down listener to an element to start a column reorder action
     *
     * @param el
     */
    _addListener(el) {
        let that = this;
        Dom.s(el)
            .on('selectstart.colReorder', function () {
            return false;
        })
            .on('mousedown.colReorder touchstart.colReorder', function (e) {
            // Ignore middle and right click
            if (e.type === 'mousedown' && e.which !== 1) {
                return;
            }
            // Ignore if disabled
            if (!that.c.enable) {
                return;
            }
            // ColumnControl integration - if there is a CC reorder button in the header
            // then the mousedown is limited to that
            let btn = Dom.s(this).find('button.dtcc-button_reorder');
            if (btn.count() && e.target !== btn.get(0) && btn.find(e.target).count() === 0) {
                return;
            }
            that._mouseDown(e, this);
        });
    }
    /**
     * Create the element that is dragged around the page
     */
    _createDragNode() {
        let origCell = this.s.mouse.target;
        let origTr = origCell.parent();
        let origThead = origTr.parent();
        let origTable = origThead.parent();
        let cloneCell = origCell.clone();
        // This is a slightly odd combination of jQuery and DOM, but it is the
        // fastest and least resource intensive way I could think of cloning
        // the table with just a single header cell in it.
        this.dom.drag = Dom.s(origTable.get(0).cloneNode(false))
            .classAdd('dtcr-cloned')
            .append(Dom.s(origThead.get(0).cloneNode(false)).append(Dom.s(origTr.get(0).cloneNode(false)).append(cloneCell.get(0))))
            .css({
            position: 'absolute',
            top: '0',
            left: '0',
            width: origCell.width('outer') + 'px',
            height: origCell.height('outer') + 'px'
        })
            .appendTo('body');
    }
    /**
     * Get cursor position regardless of mouse or touch input
     *
     * @param e Event
     * @param prop Property name to get
     * @returns Value - assuming a number here
     */
    _cursorPosition(e, prop) {
        return e.type.indexOf('touch') !== -1 ? e.originalEvent.touches[0][prop] : e[prop];
    }
    /**
     * Cache values at start
     *
     * @param e Triggering event
     * @param cell Cell that the action started on
     * @returns
     */
    _mouseDown(e, cell) {
        let target = Dom.s(e.target).closest('th, td');
        let offset = target.offset();
        let moveableColumns = this.dt.columns(this.c.columns).indexes().toArray();
        let moveColumnIndexes = Dom.s(cell)
            .attr('data-dt-column')
            .split(',')
            .map(function (val) {
            return parseInt(val, 10);
        });
        // Don't do anything for columns which are not selected as moveable
        for (let j = 0; j < moveColumnIndexes.length; j++) {
            if (!moveableColumns.includes(moveColumnIndexes[j])) {
                return false;
            }
        }
        this.s.mouse.start.x = this._cursorPosition(e, 'pageX');
        this.s.mouse.start.y = this._cursorPosition(e, 'pageY');
        this.s.mouse.offset.x = this._cursorPosition(e, 'pageX') - offset.left;
        this.s.mouse.offset.y = this._cursorPosition(e, 'pageY') - offset.top;
        this.s.mouse.target = target;
        this.s.mouse.targets = moveColumnIndexes;
        // Classes to highlight the columns being moved
        for (let i = 0; i < moveColumnIndexes.length; i++) {
            let cells = Dom.s(this.dt
                .cells(null, moveColumnIndexes[i], { page: 'current' })
                .nodes()
                .toArray());
            let klass = 'dtcr-moving';
            if (i === 0) {
                klass += ' dtcr-moving-first';
            }
            if (i === moveColumnIndexes.length - 1) {
                klass += ' dtcr-moving-last';
            }
            cells.classAdd(klass);
        }
        this._regions(moveColumnIndexes);
        this._scrollRegions();
        /* Add event handlers to the document */
        Dom.s(document)
            .on('mousemove.colReorder touchmove.colReorder', (e) => {
            this._mouseMove(e);
        })
            .on('mouseup.colReorder touchend.colReorder', (e) => {
            this._mouseUp(e);
        });
    }
    _mouseMove(e) {
        if (this.dom.drag === null) {
            // Only create the drag element if the mouse has moved a specific distance from the start
            // point - this allows the user to make small mouse movements when sorting and not have a
            // possibly confusing drag element showing up
            if (Math.pow(Math.pow(this._cursorPosition(e, 'pageX') - this.s.mouse.start.x, 2) +
                Math.pow(this._cursorPosition(e, 'pageY') - this.s.mouse.start.y, 2), 0.5) < 5) {
                return;
            }
            Dom.s(document.body).classAdd('dtcr-dragging');
            this._createDragNode();
        }
        // Position the element - we respect where in the element the click occurred
        this.dom.drag.css({
            left: this._cursorPosition(e, 'pageX') - this.s.mouse.offset.x,
            top: this._cursorPosition(e, 'pageY') - this.s.mouse.offset.y
        });
        // Find cursor's left position relative to the table
        const tableNode = this.dt.table().node();
        let tableOffset = Dom.s(tableNode).offset().left;
        let cursorMouseLeft = this._cursorPosition(e, 'pageX') - tableOffset;
        let cursorInlineStart;
        if (this._isRtl()) {
            const tableWidth = tableNode.clientWidth;
            cursorInlineStart = tableWidth - cursorMouseLeft;
        }
        else {
            cursorInlineStart = cursorMouseLeft;
        }
        let dropZone = this.s.dropZones.find(function (zone) {
            if (zone.inlineStart <= cursorInlineStart && cursorInlineStart <= zone.inlineStart + zone.width) {
                return true;
            }
            return false;
        });
        this.s.mouse.absLeft = this._cursorPosition(e, 'pageX');
        if (!dropZone) {
            return;
        }
        if (!dropZone.self) {
            this._move(dropZone, cursorInlineStart);
        }
    }
    _mouseUp(e) {
        Dom.s(document).off('.colReorder');
        Dom.s(document.body).classRemove('dtcr-dragging');
        if (this.dom.drag) {
            this.dom.drag.remove();
            this.dom.drag = null;
            // Once the element is removed, Firefox will then complete the mouse event
            // sequence by firing a click event on the element that the mouse is now
            // over. This means that a click event happens on the header cell triggering
            // a sort. A setTimeout on the remove doesn't appear to work around this.
            //
            // Therefore, we need to add a click event listener that will kill the
            // bubbling of the event, and then _almost_ immediately remove it.
            this.s.mouse.target.on('click.dtcr', function (e) {
                return false;
            });
            setTimeout(() => {
                this.s.mouse.target.off('.dtcr');
            }, 10);
        }
        if (this.s.scrollInterval) {
            clearInterval(this.s.scrollInterval);
        }
        Dom.s(this.dt.cells('.dtcr-moving').nodes().toArray()).classRemove('dtcr-moving dtcr-moving-first dtcr-moving-last');
    }
    /**
     * Shift columns around
     *
     * @param dropZone Where to move to
     * @param cursorInlineStart Cursor position, relative to the inline start (left or right) of the table
     */
    _move(dropZone, cursorInlineStart) {
        let that = this;
        this.dt.colReorder.move(this.s.mouse.targets, dropZone.colIdx);
        // Update the targets
        this.s.mouse.targets = this.s.mouse.target
            .attr('data-dt-column')
            .split(',')
            .map(function (val) {
            return parseInt(val, 10);
        });
        this._regions(this.s.mouse.targets);
        let visibleTargets = this.s.mouse.targets.filter(function (val) {
            return that.dt.column(val).visible();
        });
        // If the column being moved is smaller than the column it is replacing,
        // the drop zones might need a correction to allow for this since, otherwise
        // we might immediately be changing the column order as soon as it was placed.
        // Find the drop zone for the first in the list of targets - is its
        // left greater than the mouse position. If so, it needs correcting
        let dz = this.s.dropZones.find(function (zone) {
            return zone.colIdx === visibleTargets[0];
        });
        let dzIdx = this.s.dropZones.indexOf(dz);
        if (dz.inlineStart > cursorInlineStart) {
            let previousDiff = dz.inlineStart - cursorInlineStart;
            let previousDz = this.s.dropZones[dzIdx - 1];
            dz.inlineStart -= previousDiff;
            dz.width += previousDiff;
            if (previousDz) {
                previousDz.width -= previousDiff;
            }
        }
        // And for the last in the list
        dz = this.s.dropZones.find(function (zone) {
            return zone.colIdx === visibleTargets[visibleTargets.length - 1];
        });
        if (dz.inlineStart + dz.width < cursorInlineStart) {
            let nextDiff = cursorInlineStart - (dz.inlineStart + dz.width);
            let nextDz = this.s.dropZones[dzIdx + 1];
            dz.width += nextDiff;
            if (nextDz) {
                nextDz.inlineStart += nextDiff;
                nextDz.width -= nextDiff;
            }
        }
    }
    /**
     * Determine the boundaries for where drops can happen and where they would
     * insert into.
     */
    _regions(moveColumns) {
        let that = this;
        let dropZones = [];
        let totalWidth = 0;
        let negativeCorrect = 0;
        let allowedColumns = this.dt.columns(this.c.columns).indexes().toArray();
        let widths = this.dt.columns().widths();
        // Each column is a drop zone
        this.dt.columns().every(function (colIdx, tabIdx, i) {
            if (!this.visible()) {
                return;
            }
            let columnWidth = widths[colIdx];
            // Check that we are allowed to move into this column - if not, need
            // to offset the widths
            if (!allowedColumns.includes(colIdx)) {
                totalWidth += columnWidth;
                return;
            }
            let valid = validateMove(that.dt, moveColumns, colIdx);
            if (valid) {
                // New drop zone. Note that it might have it's offset moved
                // by the final condition in this logic set
                dropZones.push({
                    colIdx: colIdx,
                    inlineStart: totalWidth - negativeCorrect,
                    self: moveColumns[0] <= colIdx && colIdx <= moveColumns[moveColumns.length - 1],
                    width: columnWidth + negativeCorrect
                });
            }
            else if (colIdx < moveColumns[0]) {
                // Not valid and before the column(s) to be moved - the drop
                // zone for the previous valid drop point is extended
                if (dropZones.length) {
                    dropZones[dropZones.length - 1].width += columnWidth;
                }
            }
            else if (colIdx > moveColumns[moveColumns.length - 1]) {
                // Not valid and after the column(s) to be moved - the next
                // drop zone to be created will be extended
                negativeCorrect += columnWidth;
            }
            totalWidth += columnWidth;
        });
        this.s.dropZones = dropZones;
        // this._drawDropZones();
    }
    /**
     * Check if the table is scrolling or not. It is it the `table` isn't the same for
     * the header and body parents.
     *
     * @returns
     */
    _isScrolling() {
        return this.dt.table().body().parentNode !== this.dt.table().header().parentNode;
    }
    /**
     * Set an interval clock that will check to see if the scrolling of the table body should be moved
     * as the mouse moves on the scroll (allowing a drag and drop to columns which aren't yet visible)
     */
    _scrollRegions() {
        if (!this._isScrolling()) {
            // Not scrolling - nothing to do
            return;
        }
        let that = this;
        let tableLeft = Dom.s(this.dt.table().container()).offset().left;
        let tableWidth = Dom.s(this.dt.table().container()).width('outer');
        let mouseBuffer = 75;
        let scrollContainer = this.dt.table().body().parentElement.parentElement;
        this.s.scrollInterval = setInterval(function () {
            let mouseLeft = that.s.mouse.absLeft;
            // On initial mouse down the mouse position can be -1, which we want to ignore
            if (mouseLeft === -1) {
                return;
            }
            if (mouseLeft < tableLeft + mouseBuffer && scrollContainer.scrollLeft) {
                scrollContainer.scrollLeft -= 5;
            }
            else if (mouseLeft > tableLeft + tableWidth - mouseBuffer &&
                scrollContainer.scrollLeft < scrollContainer.scrollWidth) {
                scrollContainer.scrollLeft += 5;
            }
        }, 25);
    }
    // This is handy for debugging where the drop zones actually are!
    // private _drawDropZones () {
    // 	let dropZones = this.s.dropZones;
    // 	$('div.allan').remove();
    // 	for (let i=0 ; i<dropZones.length ; i++) {
    // 		let zone = dropZones[i];
    // 		$(this.dt.table().container()).append(
    // 			$('<div>')
    // 				.addClass('allan')
    // 				.css({
    // 					position: 'absolute',
    // 					top: 0,
    // 					width: zone.width - 4,
    // 					height: 20,
    // 					left: zone.left + 2,
    // 					border: '1px solid red',
    // 				})
    // 		);
    // 	}
    // }
    _isRtl() {
        return Dom.s(this.dt.table().node()).css('direction') === 'rtl';
    }
}
ColReorder.defaults = {
    columns: '',
    enable: true,
    headerRows: null,
    order: null
};
ColReorder.version = '3.0.0';


/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * *
 * UI interaction class
 */
/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * *
 * DataTables API integration
 */
/** Enable mouse column reordering */
Api.register('colReorder.enable()', function (flag) {
    return this.iterator('table', function (ctx) {
        if (ctx._colReorder) {
            ctx._colReorder.enable(flag);
        }
    });
});
/** Disable mouse column reordering */
Api.register('colReorder.disable()', function () {
    return this.iterator('table', function (ctx) {
        if (ctx._colReorder) {
            ctx._colReorder.disable();
        }
    });
});
/**
 * Change the ordering of the columns in the DataTable.
 */
Api.register('colReorder.move()', function (from, to) {
    init(this);
    if (!Array.isArray(from)) {
        from = [from];
    }
    if (!validateMove(this, from, to)) {
        this.error('ColReorder - invalid move');
        return this;
    }
    return this.tables().every(function () {
        move(this, from, to);
        finalise(this);
    });
});
Api.register('colReorder.order()', function (set, original) {
    init(this);
    if (!set) {
        return this.context.length ? getOrder(this) : null;
    }
    return this.tables().every(function () {
        setOrder(this, set, original);
    });
});
Api.register('colReorder.reset()', function () {
    init(this);
    return this.tables().every(function () {
        var order = this.columns()
            .every(function (i) {
            return i;
        })
            .flatten()
            .toArray();
        setOrder(this, order, true);
    });
});
Api.register('colReorder.transpose()', function (idx, dir) {
    init(this);
    if (!dir) {
        dir = 'toCurrent';
    }
    return transpose(this, idx, dir);
});
DataTable.ColReorder = ColReorder;
// Called when DataTables is going to load a state. That might be
// before the table is ready (state saving) or after (state restoring).
// Also note that it happens _before_ preInit (below).
Dom.s(document).on('stateLoadInit.dt', function (e, settings, state) {
    if (e.namespace !== 'dt') {
        return;
    }
    let dt = new Api(settings);
    if (state.colReorder && dt.columns().count() === state.colReorder.length) {
        if (dt.ready()) {
            // Table is fully loaded - do the column reordering here
            // so that the stored indexes are in the correct place
            // e.g. column visibility
            setOrder(dt, state.colReorder, true);
        }
        else {
            // If the table is not ready, column reordering is done
            // after it becomes fully ready. That means that saved
            // column indexes need to be updated for where those columns
            // currently are. Any properties which refer to column indexes
            // would need to be updated here.
            // State's ordering indexes
            orderingIndexes(state.colReorder, state.order);
            // State's columns array - sort by restore index
            if (state.columns) {
                for (let i = 0; i < state.columns.length; i++) {
                    state.columns[i]._cr_sort = state.colReorder[i];
                }
                state.columns.sort(function (a, b) {
                    return a._cr_sort - b._cr_sort;
                });
            }
        }
    }
});
Dom.s(document).on('preInit.dt', function (e, settings) {
    if (e.namespace !== 'dt') {
        return;
    }
    var init = settings.init.colReorder;
    var defaults = DataTable.defaults.colReorder;
    if (init || defaults) {
        let opts = {};
        if (util.is.plainObject(defaults)) {
            util.object.assign(opts, defaults);
        }
        if (util.is.plainObject(init)) {
            util.object.assign(opts, init);
        }
        if (init !== false) {
            let dt = new DataTable.Api(settings);
            new ColReorder(dt, opts);
        }
    }
});


export default DataTable;