jsl-ui 9.14.6 → 9.15.0

package/lib/grid/plugins/ext.overlay.js

@@ -130,6 +130,9 @@ export function Overlays(options) {
         });
         selectionOverlay.handle.style.left = (position.left + position.width - 4) + "px";
         selectionOverlay.handle.style.top = (position.top + position.height - 4) + "px";
+        // console.log("row: " + activeCell.row + " - cell: "+ activeCell.cell);
+        // console.log("container: " + grid.getCanvasNode(activeCell.row, activeCell.cell).className);
+        selectionOverlay.moveToContainer(grid.getCanvasNode(activeCell.cell, activeCell.row));
     }
     var dd_range;
     function handleOverlayDragStart(e) {
@@ -189,7 +192,8 @@ export function Overlays(options) {
             this.handle = document.createElement("div");
             this.handle.classList.add("handle-overlay");
             target.appendChild(this.handle);
-            Moveable(target, {
+            var moveContainer = target.closest(".slickgrid");
+            Moveable(moveContainer, {
                 selector: ".handle-overlay",
                 direction: "y",
                 gridY: grid.getOptions().rowHeight,
@@ -204,6 +208,15 @@ export function Overlays(options) {
                 })
             });
         }
+        this.moveToContainer = function (container) {
+            this.$left.appendTo(container);
+            this.$right.appendTo(container);
+            this.$top.appendTo(container);
+            this.$bottom.appendTo(container);
+            if (this.handle) {
+                $(this.handle).appendTo(container);
+            }
+        };
         this.toggle = function (showOrHide) {
             this.$left.css("display", showOrHide ? "" : "none");
             this.$right.css("display", showOrHide ? "" : "none");
@@ -220,7 +233,8 @@ export function Overlays(options) {
         function show(range) {
             r = range;
             if (!decorator) {
-                decorator = new Overlay(grid.getCanvasNode(), false, 'selection-');
+                console.log(grid.getContainerNode().className);
+                decorator = new Overlay(grid.getCanvasNode(range.fromCell, range.fromRow), false, 'selection-');
             }
             var from = targetGrid.getCellNodeBox(range.fromRow, range.fromCell);
             var to = targetGrid.getCellNodeBox(range.toRow, range.toCell);

package/lib/grid/slick.grid.d.ts

@@ -250,7 +250,7 @@ export interface ISlickGrid<T> {
         cancelCurrentEdit: () => boolean;
     };
     "invalidateRow": (row: number) => void;
-    "getCanvasNode": () => HTMLElement;
+    "getCanvasNode": (columnIdOrIdx?: number, rowIndex?: number) => HTMLElement;
     "focus": () => void;
     "getActiveCellPosition": () => {
         top: number;

package/lib/grid.d.ts

@@ -1,3 +1,4 @@
+import "./ui/base.css";
 export * from "./grid/slick.core";
 export * from "./grid/slick.creator";
 export * from "./grid/slick.dataview";

package/lib/grid.js

@@ -1,3 +1,4 @@
+import "./ui/base.css";
 export * from "./grid/slick.core";
 export * from "./grid/slick.creator";
 export * from "./grid/slick.dataview";