/**
 * A selection model for {@link Ext.grid.Panel grids} which allows you to select data in
 * a spreadsheet-like manner.
 *
 * Supported features:
 *
 *  - Single / Range / Multiple individual row selection.
 *  - Single / Range cell selection.
 *  - Column selection by click selecting column headers.
 *  - Select / deselect all by clicking in the top-left, header.
 *  - Adds row number column to enable row selection.
 *  - Optionally you can enable row selection using checkboxes
 *
 * # Example usage
 *
 *     @example
 *     var store = Ext.create('Ext.data.Store', {
 *         fields: ['name', 'email', 'phone'],
 *         data: [
 *             { name: 'Lisa', email: '[email protected]', phone: '555-111-1224' },
 *             { name: 'Bart', email: '[email protected]', phone: '555-222-1234' },
 *             { name: 'Homer', email: '[email protected]', phone: '555-222-1244' },
 *             { name: 'Marge', email: '[email protected]', phone: '555-222-1254' }
 *         ]
 *     });
 *
 *     Ext.create('Ext.grid.Panel', {
 *         title: 'Simpsons',
 *         store: store,
 *         width: 400,
 *         renderTo: Ext.getBody(),
 *         columns: [
 *             { text: 'Name', dataIndex: 'name' },
 *             { text: 'Email', dataIndex: 'email', flex: 1 },
 *             { text: 'Phone', dataIndex: 'phone' }
 *         ],
 *         selModel: {
 *            type: 'spreadsheet'
 *         }
 *     });
 *
 * # Using {@link Ext.data.BufferedStore}s
 * It is very important to remember that a {@link Ext.data.BufferedStore} does *not* contain the
 * full dataset. The purpose of a BufferedStore is to only hold in the client, a range of
 * pages from the dataset that corresponds with what is currently visible in the grid
 * (plus a few pages above and below the visible range to allow fast scrolling).
 *
 * When using "select all" rows and a BufferedStore, an `allSelected` flag is set, and so all
 * records which are read into the client side cache will thenceforth be selected, and will
 * be rendered as selected in the grid.
 *
 * *But records which have not been read into the cache will obviously not be available
 * when interrogating selected records. As you scroll through the dataset, and more
 * pages are read from the server, they will become available to add to the selection.*
 *
 * @since 5.1.0
 */
Ext.define('Ext.grid.selection.SpreadsheetModel', {
    extend: 'Ext.selection.Model',
    requires: [
        'Ext.grid.selection.Selection',
        'Ext.grid.selection.Cells',
        'Ext.grid.selection.Rows',
        'Ext.grid.selection.Columns',
        'Ext.grid.selection.SelectionExtender' // TODO: cmd-auto-dependency 
    ],
 
    alias: 'selection.spreadsheet',
 
    isSpreadsheetModel: true,
 
    config: {
        /**
         * @cfg {Boolean} [columnSelect=false]
         * Set to `true` to enable selection of columns.
         *
         * **NOTE**: This will remove sorting on header click and instead provide column
         * selection and deselection. Sorting is still available via column header menu.
         */
        columnSelect: {
            $value: false,
            lazy: true
        },
 
        /**
         * @cfg {Boolean} [cellSelect=true]
         * Set to `true` to enable selection of individual cells or a single rectangular
         * range of cells. This will provide cell range selection using click, and
         * potentially drag to select a rectangular range. You can also use "SHIFT + arrow"
         * key navigation to select a range of cells.
         */
        cellSelect: {
            $value: true,
            lazy: true
        },
 
        /**
         * @cfg {Boolean} [rowSelect=true]
         * Set to `true` to enable selection of rows by clicking on a row number column.
         *
         * *Note*: This feature will add the row number as the first column.
         */
        rowSelect: {
            $value: true,
            lazy: true
        },
 
        /**
        * @cfg {Boolean} [dragSelect=true]
        * Set to `true` to enables cell range selection by cell dragging.
        */
        dragSelect: {
            $value: true,
            lazy: true
        },
 
        /**
        * @cfg {Ext.grid.selection.Selection} [selected]
        * Pass an instance of one of the subclasses of {@link Ext.grid.selection.Selection}.
        */
        selected: null,
 
        /**
         * @cfg {String} extensible 
         * This configures whether this selection model is to implement a mouse based dragging gesture to extend a *contiguous* selection.
         *
         * Note that if there are multiple, discontiguous selected rows or columns, selection extension is not available.
         *
         * If set, then the bottom right corner of the contiguous selection will display a drag handle. By dragging this, an extension area
         * may be defined into which the selection is extended.
         *
         * Upon the end of the drag, the {@link Ext.panel.Table#beforeselectionextend beforeselectionextend} event will be fired though the
         * encapsulating grid. Event handlers may manipulate the store data in any way.
         *
         * Possible values for this configuration are
         *
         *    - `"x"` Only allow extending the block to the left or right.
         *    - `"y"` Only allow extending the block above or below.
         *    - `"xy"` Allow extending the block in both dimensions.
         *    - `"both"` Allow extending the block in both dimensions.
         *    - `true` Allow extending the block in both dimensions.
         *    - `false` Disable the extensible feature
         *    - `null` Disable the extensible feature
         *
         * It's important to notice that setting this to `"both"`, `"xy"` or `true` will allow you to extend the selection in both
         * directions, but only one direction at a time. It will NOT be possible to drag it diagonally. 
         */
        extensible: {
            $value: true,
            lazy: true
        }
    },
 
    /**
     * @event selectionchange
     * Fired *by the grid* after the selection changes. Return `false` to veto the selection extension.
     *
     * Note that the behavior of selectionchange is different in Ext 6.x vs. Ext 5.  In Ext 6.x, if rows
     * are being selected, a block of records is passed as the second parameter.  In Ext 5, the selection
     * object was passed.  
     * 
     *
     * @param {Ext.grid.Panel} grid The grid whose selection has changed.
     * @param {Ext.grid.selection.Selection} selection A subclass of
     * {@link Ext.grid.selection.Selection} describing the new selection.
     */
 
    /**
     * @cfg {Boolean} checkboxSelect [checkboxSelect=false]
     * Enables selection of the row via clicking on checkbox. Note: this feature will add
     * new column at position specified by {@link #checkboxColumnIndex}.
     */
    checkboxSelect: false,
 
    /**
     * @cfg {Number/String} [checkboxColumnIndex=0]
     * The index at which to insert the checkbox column.
     * Supported values are a numeric index, and the strings 'first' and 'last'. Only valid when set
     * *before* render.
     */
    checkboxColumnIndex: 0,
 
    /**
     * @cfg {Boolean} [showHeaderCheckbox=true]
     * Configure as `false` to not display the header checkbox at the top of the checkbox column
     * when {@link #checkboxSelect} is set.
     */
    showHeaderCheckbox: true,
 
    /**
     * @cfg {String} [checkColumnHeaderText]
     * Displays the configured text in the check column's header.
     *
     * if {@link #cfg-showHeaderCheckbox} is `true`, the text is shown *above* the checkbox.
     * @since 6.0.1
     */
    checkColumnHeaderText: null,
    /**
     * @cfg {Number/String} [checkboxHeaderWidth=24]
     * Width of checkbox column.
     */
    checkboxHeaderWidth: 24,
 
    /**
     * @cfg {Number/String} [rowNumbererHeaderWidth=46]
     * Width of row numbering column.
     */
    rowNumbererHeaderWidth: 46,
 
    columnSelectCls: Ext.baseCSSPrefix + 'ssm-column-select',
    rowNumbererHeaderCls: Ext.baseCSSPrefix + 'ssm-row-numberer-hd',
 
    tdCls: Ext.baseCSSPrefix + 'grid-cell-special ' + Ext.baseCSSPrefix + 'selmodel-column',
 
    /**
     * @method getCount
     * This method is not supported by SpreadsheetModel.
     *
     * To interrogate the selection use {@link #getSelected} which will return an instance of one
     * of the three selection types, or `null` if no selection.
     *
     * The three selection types are:
     *
     *    * {@link Ext.grid.selection.Rows}
     *    * {@link Ext.grid.selection.Columns}
     *    * {@link Ext.grid.selection.Cells}
     */
 
    /**
     * @method getSelectionMode
     * This method is not supported by SpreadsheetModel.
     */
 
    /**
     * @method setSelectionMode
     * This method is not supported by SpreadsheetModel.
     */
 
    /**
     * @method setLocked
     * This method is not currently supported by SpreadsheetModel.
     */
 
    /**
     * @method isLocked
     * This method is not currently supported by SpreadsheetModel.
     */
 
    /**
     * @method isRangeSelected
     * This method is not supported by SpreadsheetModel.
     *
     * To interrogate the selection use {@link #getSelected} which will return an instance of one
     * of the three selection types, or `null` if no selection.
     *
     * The three selection types are:
     *
     *    * {@link Ext.grid.selection.Rows}
     *    * {@link Ext.grid.selection.Columns}
     *    * {@link Ext.grid.selection.Cells}
     */
 
    /**
     * @member Ext.panel.Table
     * @event beforeselectionextend An event fired when an extension block is extended 
     * using a drag gesture.  Only fired when the SpreadsheetSelectionModel is used and 
     * configured with the 
     * {@link Ext.grid.selection.SpreadsheetModel#extensible extensible} config.
     * @param {Ext.panel.Table} grid The owning grid.
     * @param {Ext.grid.selection.Selection} An object which encapsulates a contiguous selection block.
     * @param {Object} extension An object describing the type and size of extension.
     * @param {String} extension.type `"rows"` or `"columns"`
     * @param {Ext.grid.CellContext} extension.start The start (top left) cell of the extension area.
     * @param {Ext.grid.CellContext} extension.end The end (bottom right) cell of the extension area.
     * @param {number} [extension.columns] The number of columns extended (-ve means on the left side).
     * @param {number} [extension.rows] The number of rows extended (-ve means on the top side).
     */
 
    /**
     * @member Ext.panel.Table
     * @event selectionextenderdrag An event fired when an extension block is dragged to 
     * encompass a new range.  Only fired when the SpreadsheetSelectionModel is used and 
     * configured with the 
     * {@link Ext.grid.selection.SpreadsheetModel#extensible extensible} config.
     * @param {Ext.panel.Table} grid The owning grid.
     * @param {Ext.grid.selection.Selection} An object which encapsulates a contiguous selection block.
     * @param {Object} extension An object describing the type and size of extension.
     * @param {String} extension.type `"rows"` or `"columns"`
     * @param {HTMLElement} extension.overCell The grid cell over which the mouse is being dragged.
     * @param {Ext.grid.CellContext} extension.start The start (top left) cell of the extension area.
     * @param {Ext.grid.CellContext} extension.end The end (bottom right) cell of the extension area.
     * @param {number} [extension.columns] The number of columns extended (-ve means on the left side).
     * @param {number} [extension.rows] The number of rows extended (-ve means on the top side).
     */
 
    /**
     * @private
     */
    bindComponent: function(view) {
        var me = this,
            viewListeners,
            storeListeners,
            lockedGrid;
 
        if (me.view !== view) {
            if (me.view) {
                me.navigationModel = null;
                Ext.destroy(me.viewListeners, me.navigationListeners);
            }
            me.view = view;
            if (view) {
                // We need to realize our lazy configs now that we have the view... 
                me.getCellSelect();
 
                lockedGrid = view.ownerGrid.lockedGrid;
                // If there is a locked grid, process it now 
                if (lockedGrid) {
                    me.hasLockedHeader = true;
                    me.onViewCreated(lockedGrid, lockedGrid.getView());
                } 
                // Otherwise, get back to us when the view is fully created so that we can tweak its headerCt 
                else {
                    view.grid.on({
                        viewcreated: me.onViewCreated,
                        scope: me,
                        single: true
                    });
                }
                me.gridListeners = view.ownerGrid.on({
                    columnschanged: me.onColumnsChanged,
                    columnmove: me.onColumnMove,
                    scope: me,
                    destroyable: true
                });
 
                storeListeners = me.getStoreListeners();
                storeListeners.scope = me;
                storeListeners.destroyable = true;
                me.storeListeners = me.store.on(storeListeners);
                viewListeners = me.getViewListeners();
                viewListeners.scope = me;
                viewListeners.destroyable = true;
                me.viewListeners = view.on(viewListeners);
                me.navigationModel = view.getNavigationModel();
                me.navigationListeners = me.navigationModel.on({
                    navigate: me.onNavigate,
                    scope: me,
                    destroyable: true
                });
 
                // Add class to add special cursor pointer to column headers 
                if (me.getColumnSelect()) {
                    view.ownerGrid.addCls(me.columnSelectCls);
                }
                me.updateHeaderState();
            }
        }
    },
 
    /**
     * Retrieve a configuration to be used in a HeaderContainer.
     * This should be used when checkboxSelect is set to false.
     * @protected
     */
    getCheckboxHeaderConfig: function() {
        var me = this,
            showCheck = me.showHeaderCheckbox !== false;
 
        return {
            xtype: 'checkcolumn',
            isCheckerHd: showCheck, // historically used as a discriminator property before isCheckColumn 
            headerCheckbox: showCheck,
            ignoreExport: true,
            text : me.checkColumnHeaderText,
            clickTargetName: 'el',
            width: me.checkboxHeaderWidth,
            sortable: false,
            draggable: false,
            resizable: false,
            hideable: false,
            menuDisabled: true,
            tdCls: me.tdCls,
            cls: Ext.baseCSSPrefix + 'selmodel-column',
            stopSelection: false,
            editRenderer:  me.editRenderer || me.renderEmpty,
            locked: me.hasLockedHeader,
            updateHeaderState: me.updateHeaderState.bind(me),
 
            // It must not attempt to set anything in the records on toggle. 
            // We handle that in onHeaderClick. 
            toggleAll: Ext.emptyFn,
 
            // The selection model listens to the navigation model to select/deselect 
            setRecordCheck: Ext.emptyFn,
            
            // It uses our isRowSelected to test whether a row is checked 
            isRecordChecked: Ext.emptyFn
        };
    },
 
    renderEmpty: function() {
        return '\u00a0';
    },
 
    /**
     * @private
     */
    getStoreListeners: function() {
        var me = this,
            r = me.callParent();
 
        r.priority = 2000;
        r.refresh = me.onStoreChanged;
        r.clear = me.onStoreChanged;
        return r;
},
 
    /**
     * @private
     */
    onHeaderClick: function(headerCt, header, e) {
    // Template method. See base class 
        var me = this,
            sel = me.selected,
            cm,
            range,
            i;
 
        if (header === me.numbererColumn || header === me.checkColumn) {
            e.stopEvent();
            // Not all selected, select all 
            if (!sel || !sel.isAllSelected()) {
                me.selectAll();
            } else {
                me.deselectAll();
            }
            me.updateHeaderState();
            me.lastColumnSelected = null;
        } else if (me.columnSelect) {
            if (e.shiftKey && sel && sel.lastColumnSelected) {
                sel.clear();
                cm = me.view.ownerGrid.getVisibleColumnManager();
                range = Ext.Array.sort([cm.indexOf(sel.lastColumnSelected), cm.indexOf(header)], Ext.Array.numericSortFn);
                for (= range[0]; i <= range[1]; i++) {
                    me.selectColumn(cm.getHeaderAtIndex(i), true);
                }
            } else {
                if (me.isColumnSelected(header)) {
                    me.deselectColumn(header);
                    me.selected.lastColumnSelected = null;
                } else {
                    me.selectColumn(header, e.ctrlKey);
                    me.selected.lastColumnSelected = header;
                }
            }
        }
    },
 
    selectByPosition: function(position) {
        var me = this;
 
        position = new Ext.grid.CellContext(me.view).setPosition(position.row, position.column);
        
        if (me.getCellSelect()) {
            me.selectCells(position, position);
        } else if (me.getRowSelect()) {
            this.select(position.record);
        } else if (me.getColumnSelect()) {
            me.selectColumn(position.column);
        }
    },
 
    /**
     * @private
     */
    updateHeaderState: function() {
        // check to see if all records are selected 
        var me = this,
            store = me.view.dataSource,
            views = me.views,
            sel = me.selected,
            isChecked = false,
            checkHd = me.checkColumn,
            storeCount;
 
        if (store && sel && sel.isRows) {
            storeCount = store.getCount();
            if (store.isBufferedStore) {
                isChecked = sel.allSelected;
            } else {
                isChecked = storeCount > 0 && (storeCount === sel.getCount());
            }
        }
 
        if (views && views.length) {
            if (checkHd) {
                checkHd.setHeaderStatus(isChecked);
            }
        }
    },
 
    onBindStore: function(store, oldStore, initial) {
        if (!initial) {
            this.onStoreRefresh();
        }
    },
 
    /**
     * Handles the grid's beforereconfigure event.  Adds the checkbox header if the columns have been reconfigured.
     * Also adds the row numberer.
     * @param {Ext.panel.Table} grid
     * @param {Ext.data.Store} store
     * @param {Object[]} columns
     * @private
     */
    onBeforeReconfigure: function(grid, store, columns, oldStore, oldColumns) {
        var me = this,
            checkboxColumnIndex = me.checkboxColumnIndex;
 
        if (columns) {
            Ext.suspendLayouts();
 
 
            if (me.numbererColumn) {
                me.numbererColumn.ownerCt.remove(me.numbererColumn, false);
                columns.unshift(me.numbererColumn);
            }
            if (me.checkColumn) {
                if (checkboxColumnIndex === 'first') {
                    checkboxColumnIndex = 0;
                } else if (checkboxColumnIndex === 'last') {
                    checkboxColumnIndex = columns.length;
                }
                me.checkColumn.ownerCt.remove(me.checkColumn, false);
                Ext.Array.insert(columns, checkboxColumnIndex, [me.checkColumn]);
            }
            Ext.resumeLayouts();
        }
    },
 
    /**
     * This is a helper method to create a cell context which encapsulates one cell in a grid view.
     *
     * It will contain the following properties:
     *  colIdx - column index
     *  rowIdx - row index
     *  column - {@link Ext.grid.column.Column Column} under which the cell is located.
     *  record - {@link Ext.data.Model} Record from which the cell derives its data.
     *  view - The view. If this selection model is for a locking grid, this will be the 
     *  outermost view, the {@link Ext.grid.locking.View} which encapsulates the sub 
     *  grids. Column indices are relative to the outermost view's visible column set.
     *
     * @param {Number} record Record for which to select the cell, or row index.
     * @param {Number} column Grid column header, or column index.
     * @return {Ext.grid.CellContext} A context object describing the cell. Note that the `rowidx` and `colIdx` properties are only valid
     * at the time the context object is created. Column movement, sorting or filtering might changed where the cell is.
     * @private
     */
    getCellContext: function(record, column) {
        return new Ext.grid.CellContext(this.view.ownerGrid.getView()).setPosition(record, column);
    },
 
    select: function(records, keepExisting, suppressEvent) {
        // API docs are inherited 
        var me = this,
            sel = me.selected,
            view = me.view,
            store = view.dataSource,
            len,
            i,
            record,
            changed = false;
 
        // Ensure selection object is of the correct type 
        if (!sel || !sel.isRows || sel.view !== view) {
            me.resetSelection(true);
            sel = me.selected = new Ext.grid.selection.Rows(view);
        } else if (!keepExisting) {
            sel.clear();
        }
        
        if (!Ext.isArray(records)) {
            records = [records];
        }
        len = records.length;
        for (= 0; i < len; i++) {
            record = records[i];
            if (typeof record === 'number') {
                record = store.getAt(record);
            }
            if (!sel.contains(record)) {
                sel.add(record);
                changed = true;
            }
        }
        if (changed) {
            me.updateHeaderState();
            if (!suppressEvent) {
                me.fireSelectionChange();
            }
        }
    },
 
    deselect: function(records, suppressEvent) {
        // API docs are inherited 
        var me = this,
            sel = me.selected,
            store = me.view.dataSource,
            len,
            i,
            record,
            changed = false;
 
        if (sel && sel.isRows) {
            if (!Ext.isArray(records)) {
                records = [records];
            }
            len = records.length;
            for (= 0; i < len; i++) {
                record = records[i];
                if (typeof record === 'number') {
                    record = store.getAt(record);
                }
                changed = changed || sel.remove(record);
            }
        }
        if (changed) {
            me.updateHeaderState();
            if (!suppressEvent) {
                me.fireSelectionChange();
            }
        }
    },
 
    /**
     * This method allows programmatic selection of the cell range.
     *
     *     @example
     *     var store = Ext.create('Ext.data.Store', {
     *         fields  : ['name', 'email', 'phone'],
     *         data    : {
     *             items : [
     *                 { name : 'Lisa',  email : '[email protected]',  phone : '555-111-1224' },
     *                 { name : 'Bart',  email : '[email protected]',  phone : '555-222-1234' },
     *                 { name : 'Homer', email : '[email protected]', phone : '555-222-1244' },
     *                 { name : 'Marge', email : '[email protected]', phone : '555-222-1254' }
     *             ]
     *         },
     *         proxy   : {
     *             type   : 'memory',
     *             reader : {
     *                 type : 'json',
     *                 root : 'items'
     *             }
     *         }
     *     });
     *
     *     var grid = Ext.create('Ext.grid.Panel', {
     *         title    : 'Simpsons',
     *         store    : store,
     *         width    : 400,
     *         renderTo : Ext.getBody(),
     *         columns  : [
     *            columns: [
     *               { text: 'Name',  dataIndex: 'name' },
     *               { text: 'Email', dataIndex: 'email', flex: 1 },
     *               { text: 'Phone', dataIndex: 'phone', width:120 },
     *               {
     *                   text:'Combined', dataIndex: 'name', width : 300,
     *                   renderer: function(value, metaData, record, rowIndex, colIndex, store, view) {
     *                       console.log(arguments);
     *                       return value + ' has email: ' + record.get('email');
     *                   }
     *               }
     *           ],
     *         ],
     *         selType: 'spreadsheet'
     *     });
     *
     *     var model = grid.getSelectionModel();  // get selection model
     *
     *     // We will create range of 4 cells.
     *
     *     // Now set the range  and prevent rangeselect event from being fired.
     *     // We can use a simple array when we have no locked columns.
     *     model.selectCells([0, 0], [1, 1], true);
     *
     * @param rangeStart {Ext.grid.CellContext/Number[]} Range starting position. Can be either Cell context or a `[rowIndex, columnIndex]` numeric array.
     *
     * Note that when a numeric array is used in a locking grid, the column indices are relative to the outermost grid, encompassing locked *and* normal sides.
     * @param rangeEnd {Ext.grid.CellContext/Number[]} Range end position. Can be either Cell context or a `[rowIndex, columnIndex]` numeric array.
     *
     * Note that when a numeric array is used in a locking grid, the column indices are relative to the outermost grid, encompassing locked *and* normal sides.
     * @param {Boolean} [suppressEvent] Pass `true` to prevent firing the
     * `{@link #selectionchange}` event.
     */
    selectCells: function(rangeStart, rangeEnd, suppressEvent) {
        var me = this,
            view = me.view.ownerGrid.view,
            sel;
 
        rangeStart = rangeStart.isCellContext ? rangeStart.clone() : new Ext.grid.CellContext(view).setPosition(rangeStart);
        rangeEnd   = rangeEnd.isCellContext   ? rangeEnd.clone()   : new Ext.grid.CellContext(view).setPosition(rangeEnd);
 
        me.resetSelection(true);
 
        me.selected = sel = new Ext.grid.selection.Cells(rangeStart.view);
        sel.setRangeStart(rangeStart);
        sel.setRangeEnd(rangeEnd);
 
        if (!suppressEvent) {
            me.fireSelectionChange();
        }
    },
 
    /**
     * Select all the data if possible.
     *
     * If {@link #rowSelect} is `true`, then all *records* will be selected.
     *
     * If {@link #cellSelect} is `true`, then all *rendered cells* will be selected.
     *
     * If {@link #columnSelect} is `true`, then all *columns* will be selected.
     *
     * @param {Boolean} [suppressEvent] Pass `true` to prevent firing the
     * `{@link #selectionchange}` event.
     */
    selectAll: function (suppressEvent) {
        var me = this,
            sel = me.selected,
            doSelect,
            view = me.view;
 
        if (me.rowSelect) {
            if (!sel || !sel.isRows) {
                me.resetSelection(true);
                me.selected = sel = new Ext.grid.selection.Rows(view);
            }
            doSelect = true;
        }
        else if (me.cellSelect) {
            if (!sel || !sel.isCells) {
                me.resetSelection(true);
                me.selected = sel = new Ext.grid.selection.Cells(view);
            }
            doSelect = true;
        }
        else if (me.columnSelect) {
            if (!sel || !sel.isColumns) {
                me.resetSelection(true);
                me.selected = sel = new Ext.grid.selection.Columns(view);
            }
            doSelect = true;
        }
 
        if (sel) {
            sel.allSelected = true;
        }
 
        if (doSelect) {
            me.updateHeaderState();
            sel.selectAll(); //this populates the selection with the records 
            if (!suppressEvent) {
                me.fireSelectionChange();
            }
        }
    },
 
    /**
     * Clears the selection.
     * @param {Boolean} [suppressEvent] Pass `true` to prevent firing the
     * `{@link #selectionchange}` event.
     */
    deselectAll: function (suppressEvent) {
        var me = this,
            sel = me.selected;
        
        if (sel && sel.getCount()) {
            sel.clear();
            sel.allSelected = false;
            me.updateHeaderState();
            if (!suppressEvent) {
                me.fireSelectionChange();
            }
        }
    },
 
    /**
     * Select one or more rows.
     * @param rows {Ext.data.Model[]} Records to select.
     * @param {Boolean} [keepSelection=false] Pass `true` to keep previous selection.
     * @param {Boolean} [suppressEvent] Pass `true` to prevent firing the
     * `{@link #selectionchange}` event.
     */
    selectRows: function(rows, keepSelection, suppressEvent) {
        var me = this,
            sel = me.selected,
            isSelectingRows = sel && sel.isRows,
            len = rows.length,
            i;
 
        if (!keepSelection || !isSelectingRows) {
            me.resetSelection(true);
        }
        if (!isSelectingRows) {
            me.selected = sel = new Ext.grid.selection.Rows(me.view);
        }
 
        if (rows.isEntity) {
            sel.add(rows);
        } else for (= 0; i < len; i++) {
            sel.add(rows[i]);
        }
 
        if (!suppressEvent) {
            me.fireSelectionChange();
        }
    },
 
    isSelected: function(record) {
        // API docs are inherited. 
        return this.isRowSelected(record);
    },
 
    /**
     * Selects a column.
     * @param {Ext.grid.column.Column} column Column to select.
     * @param {Boolean} [keepSelection=false] Pass `true` to keep previous selection.
     * @param {Boolean} [suppressEvent] Pass `true` to prevent firing the
     * `{@link #selectionchange}` event.
     */
    selectColumn: function(column, keepSelection, suppressEvent) {
        var me = this,
            selData = me.selected,
            view = column.getView();
 
        // Clear other selection types 
        if (!selData || !selData.isColumns || selData.view !== view.ownerGrid.view) {
            me.resetSelection(true);
            me.selected = selData = new Ext.grid.selection.Columns(view);
        }
 
        if (!selData.contains(column)) {
            if (!keepSelection) {
                selData.clear();
            }
            selData.add(column);
 
            me.updateHeaderState();
            if (!suppressEvent) {
                me.fireSelectionChange();
            }
        }
    },
 
    /**
     * Deselects a column.
     * @param {Ext.grid.column.Column} column Column to deselect.
     * @param {Boolean} [suppressEvent] Pass `true` to prevent firing the
     * `{@link #selectionchange}` event.
     */
    deselectColumn: function(column, suppressEvent) {
        var me = this,
            selData = me.getSelected();
 
        if (selData && selData.isColumns && selData.contains(column)) {
            selData.remove(column);
            me.updateHeaderState();
            if (!suppressEvent) {
                me.fireSelectionChange();
            }
        }
    },
 
    getSelection: function() {
        // API docs are inherited. 
        // Superclass returns array of selected records 
        var selData = this.selected;
 
        if (selData && selData.isRows) {
            return selData.getRecords();
        }
        return [];
    },
 
    destroy: function() {
        var me = this,
            scrollEls = me.scrollEls;
 
        Ext.destroy(me.gridListeners, me.viewListeners, me.selected, me.navigationListeners, me.extensible);
        if (scrollEls) {
            Ext.dd.ScrollManager.unregister(scrollEls);
        }
        me.selected = me.gridListeners = me.viewListeners = me.selectionData = me.navigationListeners = me.scrollEls = null;
        me.callParent();
    },
 
    //------------------------------------------------------------------------- 
 
    privates: {
        /**
         * @property {Object} axesConfigs 
         * Use when converting the extensible config into a SelectionExtender to create its `axes` config to specify which axes it may extend.
         * @private
         */
        axesConfigs: {
            x: 1,
            y: 2,
            xy: 3,
            both: 3,
            "true": 3 // reserved word MUST be quoted when used an a property name 
        },
 
        getNumbererColumnConfig: function() {
            var me = this;
 
            return {
                xtype: 'rownumberer',
                width: me.rowNumbererHeaderWidth,
                editRenderer:  me.renderEmpty,
                tdCls: me.rowNumbererTdCls,
                cls: me.rowNumbererHeaderCls,
                locked: me.hasLockedHeader
            };
        },
 
        /**
         * @return {Object}
         * @private
         */
        getViewListeners: function() {
            return {
                refresh: this.onViewRefresh,
                keyup: {
                    element: 'el',
                    fn: this.onViewKeyUp,
                    scope: this
                }
            };
        },
 
        /**
         * @private
         */
        onViewKeyUp: function(e) {
            var sel = this.selected;
 
            // Released the shift key, terminate a keyboard based range selection 
            if (e.keyCode === e.SHIFT && sel && sel.isRows && sel.getRangeSize()) {
                // Copy the drag range into the selected records collection 
                sel.addRange();
            }
        },
 
        /**
         * @private
         */
        onStoreChanged: function() {
            var me = this,
                view = me.view,
                selData = me.selected;
 
            if (selData) {
                if (selData.isCells) {
                    me.resetSelection();
                }
                else if (selData.isRows) {
                    if (me.pruneRemoved === false && selData.selectedRecords.length) {
                        me.refresh();
                    }
                    else {
                        me.resetSelection();
                    }
                }
            }
        },
 
        /**
         * @private
         */
        onColumnsChanged: function() {
            var me = this,
                selectionChanged = me.onViewChanged(me.view, true);
            
            // This event is fired directly from the HeaderContainer before the view updates. 
            // So we have to wait until idle to update the selection UI. 
            // NB: fireSelectionChange calls updateSelectionExtender after firing its event. 
            Ext.on('idle', selectionChanged ? me.fireSelectionChange : me.updateSelectionExtender, me, {
                single: true
            });
        },
 
        // The selection may have acquired or lost contiguity, so the replicator may need enabling or disabling 
        onColumnMove: function() {
            this.updateSelectionExtender();
        },
 
        /**
         * @private
         */
        onViewRefresh: function(view) {
            var me = this,
                selectionChanged = me.onViewChanged(view);
            
            // The selection may have acquired or lost contiguity, so the replicator may need enabling or disabling 
            // NB: fireSelectionChange calls updateSelectionExtender after firing its event. 
            me[selectionChanged ? 'fireSelectionChange' : 'updateSelectionExtender']();
        },
 
        /**
         * @private
         */
        resetSelection: function(suppressEvent) {
            var sel = this.selected;
 
            if (sel) {
                sel.clear();
                if (!suppressEvent) {
                    this.fireSelectionChange();
                }
            }
        },
    
        /**
         * When the view has changed, whether it be to a refresh or a column change, we need
         * to check the current selection and deselect anything that may no longer be valid.
         * @param {Ext.view.Table} view
         * @param {Boolean} isColumnChange `true` if this change is based on a column change
         * @returns {Boolean} `true` if a change to the selection was made
         * @private
         * @since 6.2.2
         */
        onViewChanged: function (view, isColumnChange) {
            var me = this,
                selData = me.selected,
                store = view.store,
                selectionChanged = false,
                rowRange, colCount, colIdx, rowIdx, context;
    
            // When columns have changed, we have to deselect *every* cell in the row range because we do not know where the 
            // columns have gone to. 
            if (selData) {
                view = selData.view;
    
                if (isColumnChange) {
                    if (selData.isCells) {
                        context = new Ext.grid.CellContext(view);
                        rowRange = selData.getRowRange();
                        colCount = view.ownerGrid.getColumnManager().getColumns().length;
                        if (colCount) {
                            for (rowIdx = rowRange[0]; rowIdx <= rowRange[1]; rowIdx++) {
                                context.setRow(rowIdx);
                                for (colIdx = 0; colIdx < colCount; colIdx++) {
                                    // CellContext only works with visible columns and this index is 
                                    // potentially a hidden column. Ensure the column is available 
                                    // before deselecting the cell. 
                                    context.setColumn(colIdx);
                                    if (context.column) {
                                        view.onCellDeselect(context);
                                    }
                        
                                    // Selection may still reference a hidden column and may need 
                                    // to be cleared 
                                    if (me.maybeClearSelection(context)) {
                                        selectionChanged = true;
                                    }
                                }
                            }
                        } else {
                            me.clearSelections();
                            selectionChanged = true;
                        }
                    }
        
                    // We have to deselect columns which have been hidden/removed 
                    else if (selData.isColumns) {
                        selectionChanged = false;
                        selData.eachColumn(function (column, columnIdx) {
                            if (!column.isVisible() || !view.ownerGrid.isAncestor(column)) {
                                me.remove(column);
                                if (me.maybeClearSelection({column: column})) {
                                    selectionChanged = true;
                                }
                            }
                        });
                    }
                }
 
                // View has refreshed; deselect filtered out records 
                else if (selData.isRows && store.isFiltered()) {
                    selData.eachRow(function (rec) {
                        if (!store.contains(rec)) {
                            this.remove(rec);  // Maintainer: this is the Rows selection object, *NOT* me. 
                            if (me.maybeClearSelection({rowIdx: view.indexOf(rec)})) {
                                selectionChanged = true;
                            }
                        }
            
                    });
                }
            }
            
            return selectionChanged;
        },
 
        onViewCreated: function(grid, view) {
            var me = this,
                ownerGrid = view.ownerGrid,
                headerCt = view.headerCt;
 
            // Only add columns to the locked view, or only view if there is no twin 
            if (!ownerGrid.lockable || view.isLockedView) {
                // if there is no row number column and we ask for it, then it should be added here 
                if (me.getRowSelect()) {
                    // Ensure we have a rownumber column 
                    me.getNumbererColumn();
                }
 
                if (me.checkboxSelect) {
                    me.addCheckbox(view, true);
                }
                me.mon(view.ownerGrid, 'beforereconfigure', me.onBeforeReconfigure, me);
            }
 
            // Disable sortOnClick if we're columnSelecting 
            headerCt.sortOnClick = !me.getColumnSelect();
 
            if (me.getDragSelect()) {
                view.on('render', me.onViewRender, me, {
                    single: true
                });
            }
        },
 
        /**
         * Initialize drag selection support
         * @private
         */
        onViewRender: function(view) {
            var me = this,
                el = view.getEl(),
                views = me.views,
                len = views.length,
                i;
 
            // If we receive the render event after the columnSelect config has been set, 
            // ensure that the view's headerCts know not to sort on click if we're selecting columns. 
            for (= 0; i < len; i++) {
                views[i].headerCt.sortOnClick = !me.columnSelect;
            }
 
            el.ddScrollConfig = {
                vthresh: 50,
                hthresh: 50,
                frequency: 300,
                increment: 100
            };
            Ext.dd.ScrollManager.register(el);
 
            // Possible two child views to register as scrollable on drag 
            (me.scrollEls || (me.scrollEls = [])).push(el);
 
            view.on('cellmousedown', me.handleMouseDown, me);
 
            // In a locking situation, we need a mousedown listener on both sides. 
            if (view.lockingPartner) {
                view.lockingPartner.on('cellmousedown', me.handleMouseDown, me);
            }
        },
 
        /**
         * Plumbing for drag selection of cell range
         * @private
         */
        handleMouseDown: function(view, td, cellIndex, record, tr, rowIdx, e) {
            var me = this,
                sel = me.selected,
                header = e.position.column,
                isCheckClick,
                startDragSelect;
 
            // Ignore right click, shift and alt modifiers. 
            // Also ignore touchstart because e cannot drag select using touches and 
            // ignore when actionableMode is true so we can select the text inside an editor 
            if (e.button || e.shiftKey || e.altKey || e.pointerType ==='touch' || view.actionableMode) {
                return;
            }
 
            if (header) {
                me.mousedownPosition = e.position.clone();
 
                isCheckClick = header === me.checkColumn;
 
                if (isCheckClick) {
                    me.checkCellClicked = e.position.getCell(true);
                }
 
                // Differentiate between row and cell selections. 
                if (header === me.numbererColumn || isCheckClick || !me.cellSelect) {
                    // Enforce rowSelect setting 
                    if (me.rowSelect) {
                        if (sel && sel.isRows) {
                            if (!e.ctrlKey && !isCheckClick) {
                                sel.clear();
                            }
                        } else {
                            if (sel) {
                                sel.clear();
                            }
                            sel = me.selected = new Ext.grid.selection.Rows(view);
                        }
                        startDragSelect = true;
                    } else if (me.columnSelect) {
                        if (sel && sel.isColumns) {
                            if (!e.ctrlKey && !isCheckClick) {
                                sel.clear();
                            }
                        } else {
                            if (sel) {
                                sel.clear();
                            }
                            sel = me.selected = new Ext.grid.selection.Columns(view);
                        }
                        startDragSelect = true;
                    } else {
                        return false;
                    }
                } else {
                    if (sel) {
                        sel.clear();
                    }
                    if (!sel || !sel.isCells) {
                        sel = me.selected = new Ext.grid.selection.Cells(view);
                    }
                    startDragSelect = true;
                }
 
                me.lastOverRecord = me.lastOverColumn = null;
 
                // Add the listener after the view has potentially been corrected 
                Ext.getBody().on('mouseup', me.onMouseUp, me, { single: true, view: sel.view });
 
                // Only begin the drag process if configured to select what they asked for 
                if (startDragSelect) {
                    sel.view.el.on('mousemove', me.onMouseMove, me, {view: sel.view});
                }
            }
        },
 
        /**
         * Selects range based on mouse movements
         * @param e
         * @param cell
         * @param opts
         * @private
         */
        onMouseMove: function(e, target, opts) {
            var me = this,
                view = opts.view,
                record,
                rowIdx,
                cell = e.getTarget(view.cellSelector),
                header = opts.view.getHeaderByCell(cell),
                selData = me.selected,
                pos,
                recChange,
                colChange;
 
            // when the mousedown happens in a checkcolumn, we need to verify is the mouse pointer has moved out of the initial clicked cell. 
            // if it has, then we select the initial row and mark it as the range start, otherwise passing the lastOverRecord and return as 
            // we don't want to select the record while moving the pointer around the initial cell. 
            if (me.checkCellClicked) {
                // We are dragging within the check cell... 
                if (cell === me.checkCellClicked) {
                    if (!me.lastOverRecord) {
                        me.lastOverRecord = view.getRecord(cell.parentNode);
                    }
                    return;
                } else {
                    me.checkCellClicked = null;
                    if (me.lastOverRecord) {
                        me.select(me.lastOverRecord);
                        selData.setRangeStart(me.store.indexOf(me.lastOverRecord));
                    }
                }
            }
 
            // Disable until a valid new selection is announced in fireSelectionChange 
            if (me.extensible) {
                me.extensible.disable();
            }
 
            if (header) {
                record = view.getRecord(cell.parentNode);
                rowIdx = me.store.indexOf(record);
                recChange = record !== me.lastOverRecord;
                colChange = header !== me.lastOverColumn;
 
                if (recChange || colChange) {
                    pos = me.getCellContext(record, header);
                }
 
                // Initial mousedown was in rownumberer or checkbox column 
                if (selData.isRows) {
                    // Only react if we've changed row 
                    if (recChange) {
                        if (me.lastOverRecord) {
                            selData.setRangeEnd(rowIdx);
                        } else {
                            selData.setRangeStart(rowIdx);
                        }
                    }
                }
                // Selecting cells 
                else if (selData.isCells) {
                    // Only react if we've changed row or column 
                    if (recChange || colChange) {
                        if (me.lastOverRecord) {
                            selData.setRangeEnd(pos);
                        } else {
                            selData.setRangeStart(pos);
                        }
                    }
                }
                // Selecting columns 
                else if (selData.isColumns) {
                    // Only react if we've changed column 
                    if (colChange) {
                        if (me.lastOverColumn) {
                            selData.setRangeEnd(pos.column);
                        } else {
                            selData.setRangeStart(pos.column);
                        }
                    }
                }
 
                // Focus MUST follow the mouse. 
                // Otherwise the focus may scroll out of the rendered range and revert to document 
                if (recChange || colChange) {
                    // We MUST pass local view into NavigationModel, not the potentially outermost locking view. 
                    // TODO: When that's fixed, use setPosition(pos). 
                    view.getNavigationModel().setPosition(new Ext.grid.CellContext(header.getView()).setPosition(record, header));
                }
                me.lastOverColumn = header;
                me.lastOverRecord = record;
            }
        },
 
        /**
         * Clean up mousemove event
         * @param e
         * @param target
         * @param opts
         * @private
         */
        onMouseUp: function(e, target, opts) {
            var me = this,
                view = opts.view,
                lastPos = me.lastOverRecord && new Ext.grid.CellContext(view).setPosition(me.lastOverRecord, me.lastOverColumn),
                changedCell = !lastPos || !lastPos.isEqual(me.mousedownPosition),
                cell, record;
 
            me.checkCellClicked = null;
 
            if (view && !view.destroyed) {
                // If we catch the event before the View sees it and stamps a position in, we need to know where they mouseupped. 
                if (!e.position) {
                    cell = e.getTarget(view.cellSelector);
                    if (cell) {
                        record = view.getRecord(cell);
                        if (record) {
                            e.position = new Ext.grid.CellContext(view).setPosition(record, view.getHeaderByCell(cell));
                        }
                    }
                }
 
                // Disable until a valid new selection is announced in fireSelectionChange unless it's a click 
                if (me.extensible && changedCell) {
                    me.extensible.disable();
                }
 
                view.el.un('mousemove', me.onMouseMove, me);
 
                // Copy the records encompassed by the drag range into the record collection 
                if (me.selected.isRows) {
                    me.selected.addRange();
                }
 
                // Fire selection change only if we have dragged - if the mouseup position is different from the mousedown position. 
                // If there has been no drag, the click handler will select the single row 
                if (changedCell) {
                    me.fireSelectionChange();
                }
            }
        },
 
        /**
         * Add the header checkbox to the header row
         * @param view
         * @param {Boolean} initial True if we're binding for the first time.
         * @private
         */
        addCheckbox: function(view, initial) {
            var me = this,
                checkbox = me.checkboxColumnIndex,
                headerCt = view.headerCt;
 
            // Preserve behaviour of false, but not clear why that would ever be done. 
            if (checkbox !== false) {
                if (checkbox === 'first') {
                    checkbox = 0;
                } else if (checkbox === 'last') {
                    checkbox = headerCt.getColumnCount();
                }
                me.checkColumn = headerCt.add(checkbox, me.getCheckboxHeaderConfig());
            }
 
            if (initial !== true) {
                view.refresh();
            }
        },
 
        /**
         * Called when the grid's Navigation model detects navigation events (`mousedown`, `click` and certain `keydown` events).
         * @param {Ext.event.Event} navigateEvent The event which caused navigation.
         * @private
         */
        onNavigate: function(navigateEvent) {
            var me = this,
                // Use outermost view. May be lockable 
                view = navigateEvent.view && navigateEvent.view.ownerGrid.view,
                record = navigateEvent.record,
                sel = me.selected,
 
                // Create a new Context based upon the outermost View. 
                // NavigationModel works on local views. TODO: remove this step when NavModel is fixed to use outermost view in locked grid. 
                // At that point, we can use navigateEvent.position 
                pos = view && new Ext.grid.CellContext(view).setPosition(record, navigateEvent.column),
                keyEvent = navigateEvent.keyEvent,
                ctrlKey = keyEvent.ctrlKey,
                shiftKey = keyEvent.shiftKey,
                keyCode = keyEvent.getKey(),
                selectionChanged;
 
            // if there's no position then the user might have clicked outside a cell 
            if (!pos) {
                return;
            }
 
            // A Column's processEvent method may set this flag if configured to do so. 
            if (keyEvent.stopSelection) {
                return;
            }
 
            // CTRL/Arrow just navigates, does not select 
            if (ctrlKey && (keyCode === keyEvent.UP || keyCode === keyEvent.LEFT || keyCode === keyEvent.RIGHT || keyCode === keyEvent.DOWN)) {
                return;
            }
 
            // Click is the mouseup at the end of a multi-cell/multi-column select swipe; reject. 
            if (sel && (sel.isCells || (sel.isColumns && !me.getRowSelect() && !(ctrlKey || shiftKey))) && sel.getCount() > 1 && !keyEvent.shiftKey && keyEvent.type === 'click') {
                return;
            }
 
            // If all selection types are disabled, or it's not a selecting event, return 
            if (!(me.cellSelect || me.columnSelect || me.rowSelect) || !navigateEvent.record || keyEvent.type === 'mousedown') {
                return;
            }
 
            // Ctrl/A key - Deselect current selection, or select all if no selection 
            if (ctrlKey && keyEvent.keyCode === keyEvent.A ) {
                // No selection, or only one, select all 
                if (!sel || sel.getCount() < 2) {
                    me.selectAll();
                } else {
                    me.deselectAll();
                }
                me.updateHeaderState();
                return;
            }
 
            if (shiftKey) {
                // If the event is in one of the row selecting cells, or cell selecting is turned off 
                if (pos.column === me.numbererColumn || pos.column === me.checkColumn || !(me.cellSelect || me.columnSelect) || (sel && sel.isRows)) {
                    if (me.rowSelect) {
                        // Ensure selection object is of the correct type 
                        if (!sel || !sel.isRows || sel.view !== view) {
                            me.resetSelection(true);
                            sel = me.selected = new Ext.grid.selection.Rows(view);
                        }
                        // First shift 
                        if (!sel.getRangeSize()) {
                            sel.setRangeStart(navigateEvent.previousRecordIndex || 0);
                        }
                        sel.setRangeEnd(navigateEvent.recordIndex);
                        sel.addRange();
                        selectionChanged = true;
                    }
                }
                // Navigate event in a normal cell 
                else {
                    if (me.cellSelect) {
                        // Ensure selection object is of the correct type 
                        if (!sel || !sel.isCells || sel.view !== view) {
                            me.resetSelection(true);
                            sel = me.selected = new Ext.grid.selection.Cells(view);
                        }
                        // First shift 
                        if (!sel.getRangeSize()) {
                            sel.setRangeStart(navigateEvent.previousPosition || me.getCellContext(0, 0));
                        }
                        sel.setRangeEnd(pos);
                        selectionChanged = true;
                    } else if (me.columnSelect) {
                        // Ensure selection object is of the correct type 
                        if (!sel || !sel.isColumns || sel.view !== view) {
                            me.resetSelection(true);
                            sel = me.selected = new Ext.grid.selection.Columns(view);
                        }
                        if (!sel.getCount()) {
                            sel.setRangeStart(pos.column);
                        }
                        sel.setRangeEnd(navigateEvent.position.column);
                        selectionChanged = true;
                    }
                }
            } else {
                // If the event is in one of the row selecting cells, or we have enabled row selection but not column selection 
                // so prioritize selecting rows 
                if (pos.column === me.numbererColumn || pos.column === me.checkColumn || (me.rowSelect && !me.cellSelect)) {
                    // Ensure selection object is of the correct type 
                    if (!sel || !sel.isRows || sel.view !== view) {
                        me.resetSelection(true);
                        sel = me.selected = new Ext.grid.selection.Rows(view);
                    }
 
                    if (ctrlKey ||  pos.column === me.checkColumn) {
                        if (sel.contains(record)) {
                            sel.remove(record);
                        } else {
                            sel.add(record);
                        }
                    } else {
                        sel.clear();
                        sel.add(record);
                    }
                    selectionChanged = true;
                }
                // Navigate event in a normal cell 
                else {
                    // Prioritize cell selection over column selection 
                    if (me.cellSelect) {
                        // Ensure selection object is of the correct type 
                        if (!sel || !sel.isCells || sel.view !== view) {
                            me.resetSelection(true);
                            me.selected = sel = new Ext.grid.selection.Cells(view);
                        } else {
                            sel.clear();
                        }
                        sel.setRangeStart(pos);
                        selectionChanged = true;
                    }
                    else if (me.columnSelect) {
                        // Ensure selection object is of the correct type 
                        if (!sel || !sel.isColumns || sel.view !== view) {
                            me.resetSelection(true);
                            me.selected = sel = new Ext.grid.selection.Columns(view);
                        }
 
                        if (ctrlKey) {
                            if (sel.contains(pos.column)) {
                                sel.remove(pos.column);
                            } else {
                                sel.add(pos.column);
                            }
                        } else {
                            sel.setRangeStart(pos.column);
                        }
                        selectionChanged = true;
                    }
                }
            }
 
            // If our configuration allowed selection changes, update check header and fire event 
            if (selectionChanged) {
                if (sel.isRows) {
                    me.updateHeaderState();
                }
                me.fireSelectionChange();
            }
        },
    
        /**
         * Checks the current selection (if available) against the context being removed.
         * If the context was selected, the selection is cleared since it's no longer valid.
         * @param {Object} removedContext 
         * @return {Boolean} `true` if part or all of the selection was cleared
         * @since 6.2.2
         */
        maybeClearSelection: function (removedContext) {
            var me = this,
                selData = me.selected,
                startCell = selData.startCell,
                endCell = selData.endCell,
                column = removedContext.column,
                colIdx = removedContext.colIdx,
                rowIdx = removedContext.rowIdx,
                changed;
    
            if (startCell && (startCell.column === column || startCell.colIdx === colIdx) && startCell.rowIdx === rowIdx) {
                selData.startCell = changed = null;
            }
    
            if (endCell && (endCell.column === column || endCell.colIdx === colIdx) && endCell.rowIdx === rowIdx) {
                selData.endCell = changed = null;
            }
    
            return changed === null;
        },
 
        /**
         * Check if given record is currently selected.
         *
         * Used in {@link Ext.view.Table view} rendering to decide upon cell UI treatment.
         * @param {Ext.data.Model} record
         * @return {Boolean}
         * @private
         */
        isRowSelected: function(record) {
            var me = this,
                sel = me.selected;
 
            if (sel && sel.isRows) {
                record = Ext.isNumber(record) ? me.store.getAt(record) : record;
                return sel.contains(record);
            } else {
                return false;
            }
        },
 
        /**
         * Check if given column is currently selected.
         *
         * @param {Ext.grid.column.Column} column
         * @return {Boolean}
         * @private
         */
        isColumnSelected: function(column) {
            var me = this,
                sel = me.selected;
 
            if (sel && sel.isColumns) {
                return sel.contains(column);
            } else {
                return false;
            }
        },
 
        /**
         * Returns true if specified cell within specified view is selected
         *
         * Used in {@link Ext.view.Table view} rendering to decide upon row UI treatment.
         * @param {Ext.grid.View} view - impactful when locked columns are used
         * @param {Number} row - row index
         * @param {Number} column - column index, within the current view
         *
         * @return {Boolean}
         * @private
         */
        isCellSelected: function(view, row, column) {
            var me = this,
                testPos,
                sel = me.selected;
 
            // view MUST be outermost (possible locking) view 
            view = view.ownerGrid.view;
            if (sel) {
                if (sel.isColumns) {
                    if (typeof column === 'number') {
                        column = view.getVisibleColumnManager().getColumns()[column];
                    }
                    return sel.contains(column);
                }
 
                if (sel.isCells) {
                    testPos = new Ext.grid.CellContext(view).setPosition({
                        row: row,
                        // IMPORTANT: The historic API for columns has been to include hidden columns 
                        // in the index. So we must index into the "all" ColumnManager. 
                        column: column
                    });
 
                    return sel.contains(testPos);
                }
            }
 
            return false;
        },
 
        /**
         * @private
         */
        applySelected: function(selected) {
            // Must override base class's applier which creates a Collection 
            //<debug> 
            if (selected && !(selected.isRows || selected.isCells || selected.isColumns)) {
                Ext.raise('SpreadsheelModel#setSelected must be passed an instance of Ext.grid.selection.Selection');
            }
            //</debug> 
            return selected;
        },
 
        /**
         * @private
         */
        updateSelected: function(selected, oldSelected) {
            var view,
                columns,
                len,
                i,
                cell;
 
            // Clear old selection. 
            if (oldSelected) {
                oldSelected.clear();
            }
 
            // Update the UI to match the new selection 
            if (selected && selected.getCount()) {
                view = selected.view;
 
                // Rows; update each selected row 
                if (selected.isRows) {
                    selected.eachRow(view.onRowSelect, view);
                }
                // Columns; update the selected columns for all rows 
                else if (selected.isColumns) {
                    columns = selected.getColumns();
                    len = columns.length;
 
                    if (len) {
                        cell = new Ext.grid.CelContext(view);
                        view.store.each(function(rec) {
                            cell.setRow(rec);
                            for (= 0; i < len; i++) {
                                cell.setColumn(columns[i]);
                                view.onCellSelect(cell);
                            }
                        });
                    }
                }
                // Cells; update each selected cell 
                else if (selected.isCells) {
                    selected.eachCell(view.onCellSelect, view);
                }
            }
        },
 
        getNumbererColumn: function(col) {
            var me = this,
                result = me.numbererColumn,
                view = me.view;
 
            if (!result) {
                // Always put row selection columns in the locked side if there is one. 
                if (view.isNormalView) {
                    view = view.ownerGrid.lockedGrid;
                }
                result = me.numbererColumn = view.headerCt.down('rownumberer') || view.headerCt.add(0, me.getNumbererColumnConfig());
            }
            return result;
        },
 
        /**
         * Show/hide the extra column headers depending upon rowSelection.
         * @private
         */
        updateRowSelect: function(rowSelect) {
            var me = this,
                sel = me.selected,
                view = me.view;
 
            if (view && view.rendered) {
                if (rowSelect) {
                    if (me.checkColumn) {
                        me.checkColumn.show();
                    }
                    me.getNumbererColumn().show();
                } else {
                    if (me.checkColumn) {
                        me.checkColumn.hide();
                    }
                    if (me.numbererColumn) {
                        me.numbererColumn.hide();
                    }
                }
                if (!rowSelect && sel && sel.isRows) {
                    sel.clear();
                    me.fireSelectionChange();
                }
            }
        },
 
        /**
         * Enable/disable the HeaderContainer's sortOnClick in line with column select on
         * column click.
         * @private
         */
        updateColumnSelect: function(columnSelect) {
            var me = this,
                sel = me.selected,
                views = me.views,
                len = views ? views.length : 0,
                i;
 
            for (= 0; i < len; i++) {
                views[i].headerCt.sortOnClick = !columnSelect;
            }
            if (!columnSelect && sel && sel.isColumns) {
                sel.clear();
                me.fireSelectionChange();
            }
            if (columnSelect) {
                me.view.ownerGrid.addCls(me.columnSelectCls);
            } else {
                me.view.ownerGrid.removeCls(me.columnSelectCls);
            }
        },
 
        /**
         * @private
         */
        updateCellSelect: function(cellSelect) {
            var me = this,
                sel = me.selected;
 
            if (!cellSelect && sel && sel.isCells) {
                sel.clear();
                me.fireSelectionChange();
            }
        },
 
        /**
         * @private
         */
        fireSelectionChange: function () {
            var me = this,
                sel = me.selected,
                view = sel.view,
                grid = view.ownerGrid,
                store = view.dataSource,
                records, count;
 
            // Inform selection object that we're done 
            me.updateSelectionExtender();
 
            // We must still fire a selectionchange event through the SelectionModel because Ext.panel.Table listens for this event 
            // to update its bound selection. 
            if (sel.isRows) {
                records = sel.getRecords();
                count = store.getTotalCount() || store.getCount();
                // When there is a BufferedStore the allSelected flag cannot be set in a manual selection 
                me.selected.allSelected = !!(store.isBufferedStore ? me.selected.allSelected : count && records.length && (count === records.length));
                me.fireEvent('selectionchange', me, records);
            } else if (sel.isCells) {
                me.selected.allSelected = false;
                me.fireEvent( 'selectionchange', me, sel.getCount() ? me.store.getRange.apply( sel.view.dataSource, sel.getRowRange()) : []);
            }
            grid.fireEvent('selectionchange', grid, sel);
        },
 
        /**
         * @private
         * Called by {@link Ext.panel.Table#updateBindSelection} when publishing the `selection` property.
         * It should yield the last record selected.
         * @return {Ext.data.Model} The last record selected. This is only available if the current selection type is cells or rows.
         * In the case of multiple selection, the *last* record added to the selection is returned.
         */
        getLastSelected: function() {
            var sel = this.selected;
 
            if (sel.getLastSelected) {
                return sel.getLastSelected();
            }
        },
 
        updateSelectionExtender: function() {
            var sel = this.selected;
            
            if (sel) {
                sel.onSelectionFinish();
            }
        },
 
        /**
         * Called when a selection has been made. The selection object's onSelectionFinish calls back into this.
         * @param {Ext.grid.selection.Selection} sel The selection object specific to 
         * the selection performed.
         * @param {Ext.grid.CellContext} [firstCell] The left/top most selected cell.
         * Will be undefined if the selection is clear.
         * @param {Ext.grid.CellContext} [lastCell] The bottom/right most selected cell.
         * Will be undefined if the selection is clear.
         * @private
         */
        onSelectionFinish: function(sel, firstCell, lastCell) {
            var extensible = this.getExtensible();
 
            if (extensible) {
                extensible.setHandle(firstCell, lastCell);
            }
        },
 
        applyExtensible: function(extensible) {
            var me = this;
 
            // if extensible is false/null we should return undefined so the value 
            // does not get set and we don't call updateExtensible 
            if (!extensible) {
                return undefined;
            }
            if (extensible === true || typeof extensible === 'string') {
                extensible = {
                    axes: me.axesConfigs[extensible]
                };
            } else {
                extensible = Ext.Object.chain(extensible); // don't mutate the user's config 
            }
            
            extensible.view = me.selected.view;
 
            return new Ext.grid.selection.SelectionExtender(extensible);
        },
 
        /**
         * Called when the SelectionExtender has the mouse released.
         * @param {Object} extension An object describing the type and size of extension.
         * @param {String} extension.type `"rows"` or `"columns"`
         * @param {Ext.grid.CellContext} extension.start The start (top left) cell of the extension area.
         * @param {Ext.grid.CellContext} extension.end The end (bottom right) cell of the extension area.
         * @param {number} [extension.columns] The number of columns extended (-ve means on the left side).
         * @param {number} [extension.rows] The number of rows extended (-ve means on the top side).
         * @private
         */
        extendSelection: function(extension) {
            var me = this,
                sel = me.selected;
 
            // Announce that the selection is to be extended, and if no objections, extend it 
            if (me.view.ownerGrid.fireEvent('beforeselectionextend', me.view.ownerGrid, sel, extension) !== false) {
                sel.extendRange(extension);
                me.fireSelectionChange();
            }
        },
 
        /**
         * @private
         */
        onIdChanged: function(store, rec, oldId, newId) {
            var sel = this.selected;
 
            if (sel && sel.isRows && sel.selectedRecords) {
                sel.selectedRecords.updateKey(rec, oldId);
            }
        },
 
        /**
         * Called when a page is added to BufferedStore.
         * @private
         */
        onPageAdd: function(pageMap, pageNumber, records) {
            var sel = this.selected,
                len = records.length,
                i,
                record,
                selected = sel && sel.selectedRecords;
 
            // Check for return of already selected records. 
            // Maintainer: To only use one conditional expression, the value of assignment of 
            // (selected = sel.selectedRecords) is part of the single conditional expression. 
            if (selected && sel.isRows) {
                for (= 0; i < len; i++) {
                    record = records[i];
                    if (selected.get(record.id)) {
                        selected.replace(record);
                    }
                    else if (sel.allSelected) {
                        selected.add(record);
                    }
                }
            }
        },
 
        /**
         * @private
         */
        refresh: function() {
            var sel = this.getSelected();
 
            // Refreshing the selected record Collection based upon a possible 
            // store mutation is only valid if we are selecting records. 
            if (sel && sel.isRows) {
                this.callParent();
            }
        },
 
        /**
         * @private
         */
        onStoreAdd: function() {
            var sel = this.getSelected();
 
            // Updating on store mutation is only valid if we are selecting records. 
            if (sel && sel.isRows) {
                this.callParent(arguments);
                this.updateHeaderState();
            }
        },
 
        /**
         * @private
         */
        onStoreClear: function() {
            this.resetSelection();
        },
 
        /**
         * @private
         */
        onStoreLoad: function() {
            var sel = this.getSelected();
 
            // Updating on store mutation is only valid if we are selecting records. 
            if (sel && sel.isRows) {
                this.callParent(arguments);
                this.updateHeaderState();
            }
        },
 
        /**
         * @private
         */
        onStoreRefresh: function() {
            var sel = this.selected;
 
            // Ensure that records which are no longer in the new store are pruned if configured to do so. 
            // Ensure that selected records in the collection are the correct instance. 
            if (sel && sel.isRows && sel.selectedRecords) {
                this.updateSelectedInstances(sel.selectedRecords);
            }
            if (this.view) {
                this.updateHeaderState();
            }
        },
 
        /**
         * @private
         */
        onPageRemove: function(pageMap, pageNumber, records) {
            var sel = this.selected;
 
            // On page purge from a buffered store, do not react if 
            // we have selected all. All are still selected! 
            if (!(sel && sel.allSelected)) {
                this.onStoreRemove(this.store, records);
            }
        },
 
        /**
         * @private
         */
        onStoreRemove: function() {
            var sel = this.getSelected();
 
            // Updating on store mutation is only valid if we are selecting records. 
            if (sel && sel.isRows) {
                this.callParent(arguments);
            }
        }
    }
}, function (SpreadsheetModel) {
    var RowNumberer = Ext.ClassManager.get('Ext.grid.column.RowNumberer');
    if (RowNumberer) {
        SpreadsheetModel.prototype.rowNumbererTdCls = 
            Ext.grid.column.RowNumberer.prototype.tdCls + ' ' + Ext.baseCSSPrefix + 'ssm-row-numberer-cell';
    }
});