@omegagrid/dashboard 0.9.46 → 0.9.48

package/dist/ui/dashboard.d.ts

@@ -20,16 +20,25 @@ export declare class Dashboard extends OmegaComponent implements Layout {
     gridCanvas: HTMLCanvasElement;
     private _currentItem;
     private _previewPositions;
+    private _autoScrollInterval;
+    private _autoScrollSpeed;
+    private _isResizing;
     readonly components: ComponentStore<HTMLElement & Layout>;
     private _baseSize;
     get baseSize(): Size;
     startMove(item: DashboardItem): void;
+    startResize(item: DashboardItem): void;
     stopMove(): void;
     get scrollOffset(): number;
     offsetToXCoord(offset: number): number;
     offsetToYCoord(offset: number): number;
     updatePreviewPositions(): void;
     previewLayout(rect: Rect): void;
+    checkAutoScroll(item: DashboardItem): void;
+    checkResizeExpansion(item: DashboardItem): void;
+    startAutoScroll(): void;
+    stopAutoScroll(): void;
+    expandContentArea(): void;
     _onItemMove: (e: DashboardEvent) => void;
     _onItemResize: (e: DashboardEvent) => void;
     constructor();

package/dist/ui/dashboard.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"dashboard.d.ts","sourceRoot":"","sources":["../../src/ui/dashboard.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,gBAAgB,EAAE,cAAc,EAAE,MAAM,EAAE,cAAc,EAAO,IAAI,EAAE,SAAS,EAAE,IAAI,EAAE,MAAM,iBAAiB,CAAC;AAKvH,OAAO,EAAE,kBAAkB,EAAE,cAAc,EAAE,MAAM,UAAU,CAAC;AAC9D,OAAO,EAAE,eAAe,EAAE,MAAM,UAAU,CAAC;AAC3C,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAEhD,qBAAa,cAAe,SAAQ,KAAK;IAExC,QAAQ,CAAC,IAAI,EAAE,aAAa,CAAC;IAC7B,QAAQ,CAAC,KAAK,EAAE,kBAAkB,CAAC;gBAEvB,IAAI,EAAE,MAAM,EAAE,IAAI,EAAE,OAAO,CAAC,cAAc,CAAC;CAIvD;AAED,qBACa,SAAU,SAAQ,cAAe,YAAW,MAAM;IAE9D,MAAM,CAAC,MAAM,iCAAkC;IAG/C,KAAK,EAAE,cAAc,CAAC;IAGtB,UAAU,UAAS;IAGnB,MAAM,UAAS;IAGf,eAAe,EAAE,gBAAgB,CAAC;IAGlC,KAAK,EAAE,QAAQ,CAAC;IAGhB,SAAS,EAAE,SAAS,CAAC;IAGrB,OAAO,EAAE,cAAc,CAAC;IAGxB,WAAW,EAAE,cAAc,CAAC;IAG5B,UAAU,EAAE,iBAAiB,CAAC;IAE9B,OAAO,CAAC,YAAY,CAAgB;IACpC,OAAO,CAAC,iBAAiB,CAAS;IAElC,QAAQ,CAAC,UAAU,uCAEjB;IAEF,OAAO,CAAC,SAAS,CAAO;IACxB,IAAI,QAAQ,SAYX;IAED,SAAS,CAAC,IAAI,EAAE,aAAa;IAM7B,QAAQ;IASR,IAAI,YAAY,WAEf;IAED,cAAc,CAAC,MAAM,EAAE,MAAM;IAI7B,cAAc,CAAC,MAAM,EAAE,MAAM;IAI7B,sBAAsB;IAOtB,aAAa,CAAC,IAAI,EAAE,IAAI;IAQxB,WAAW,GAAI,GAAG,cAAc,UAQ/B;IAED,aAAa,GAAI,GAAG,cAAc,UAQjC;;IAYD,qBAAqB,CAAC,IAAI,EAAE,IAAI,GAAI,IAAI;IAWxC,eAAe,CAAC,IAAI,EAAE,IAAI;IAK1B,eAAe;IAIf,aAAa,CAAC,MAAM,EAAE,eAAe;IAMrC,eAAe,CAAC,GAAG,EAAE,WAAW,EAAE,IAAI,EAAE,IAAI;IAM5C,aAAa;IAMb,MAAM;IAcA,QAAQ;IAyCd,OAAO;IAIP,MAAM,kDAgBC;CAEP"}
+{"version":3,"file":"dashboard.d.ts","sourceRoot":"","sources":["../../src/ui/dashboard.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,gBAAgB,EAAE,cAAc,EAAE,MAAM,EAAE,cAAc,EAAO,IAAI,EAAE,SAAS,EAAE,IAAI,EAAE,MAAM,iBAAiB,CAAC;AAKvH,OAAO,EAAE,kBAAkB,EAAE,cAAc,EAAE,MAAM,UAAU,CAAC;AAC9D,OAAO,EAAE,eAAe,EAAE,MAAM,UAAU,CAAC;AAC3C,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAEhD,qBAAa,cAAe,SAAQ,KAAK;IAExC,QAAQ,CAAC,IAAI,EAAE,aAAa,CAAC;IAC7B,QAAQ,CAAC,KAAK,EAAE,kBAAkB,CAAC;gBAEvB,IAAI,EAAE,MAAM,EAAE,IAAI,EAAE,OAAO,CAAC,cAAc,CAAC;CAIvD;AAED,qBACa,SAAU,SAAQ,cAAe,YAAW,MAAM;IAE9D,MAAM,CAAC,MAAM,iCAAkC;IAG/C,KAAK,EAAE,cAAc,CAAC;IAGtB,UAAU,UAAS;IAGnB,MAAM,UAAS;IAGf,eAAe,EAAE,gBAAgB,CAAC;IAGlC,KAAK,EAAE,QAAQ,CAAC;IAGhB,SAAS,EAAE,SAAS,CAAC;IAGrB,OAAO,EAAE,cAAc,CAAC;IAGxB,WAAW,EAAE,cAAc,CAAC;IAG5B,UAAU,EAAE,iBAAiB,CAAC;IAE9B,OAAO,CAAC,YAAY,CAAgB;IACpC,OAAO,CAAC,iBAAiB,CAAS;IAClC,OAAO,CAAC,mBAAmB,CAAgB;IAC3C,OAAO,CAAC,gBAAgB,CAAkB;IAC1C,OAAO,CAAC,WAAW,CAAS;IAE5B,QAAQ,CAAC,UAAU,uCAEjB;IAEF,OAAO,CAAC,SAAS,CAAO;IACxB,IAAI,QAAQ,SAYX;IAED,SAAS,CAAC,IAAI,EAAE,aAAa;IAO7B,WAAW,CAAC,IAAI,EAAE,aAAa;IAO/B,QAAQ;IAUR,IAAI,YAAY,WAEf;IAED,cAAc,CAAC,MAAM,EAAE,MAAM;IAI7B,cAAc,CAAC,MAAM,EAAE,MAAM;IAI7B,sBAAsB;IAOtB,aAAa,CAAC,IAAI,EAAE,IAAI;IAQxB,eAAe,CAAC,IAAI,EAAE,aAAa;IAuCnC,oBAAoB,CAAC,IAAI,EAAE,aAAa;IAsCxC,eAAe;IAiDf,cAAc;IAQd,iBAAiB;IA8CjB,WAAW,GAAI,GAAG,cAAc,UAS/B;IAED,aAAa,GAAI,GAAG,cAAc,UASjC;;IAYD,qBAAqB,CAAC,IAAI,EAAE,IAAI,GAAI,IAAI;IAWxC,eAAe,CAAC,IAAI,EAAE,IAAI;IAK1B,eAAe;IAIf,aAAa,CAAC,MAAM,EAAE,eAAe;IAMrC,eAAe,CAAC,GAAG,EAAE,WAAW,EAAE,IAAI,EAAE,IAAI;IAM5C,aAAa;IAMb,MAAM;IAcA,QAAQ;IAyCd,OAAO;IAIP,MAAM,kDAgBC;CAEP"}

package/dist/ui/dashboard.js

@@ -35,6 +35,13 @@ let Dashboard = class Dashboard extends OmegaComponent {
         this._currentItem = item;
         this._currentItem.classList.toggle('active', true);
         this.classList.toggle('moving', true);
+        this._isResizing = false;
+    }
+    startResize(item) {
+        this._currentItem = item;
+        this._currentItem.classList.toggle('active', true);
+        this.classList.toggle('moving', true);
+        this._isResizing = true;
     }
     stopMove() {
         if (!this._currentItem)
@@ -44,6 +51,7 @@ let Dashboard = class Dashboard extends OmegaComponent {
         this.classList.toggle('moving', false);
         this.hidePlaceholder();
         this.updatePreviewPositions();
+        this.stopAutoScroll();
     }
     get scrollOffset() {
         return this.container?.verticalSlider?.value || 0;
@@ -69,10 +77,167 @@ let Dashboard = class Dashboard extends OmegaComponent {
                 this.setItemPosition(item, rect);
         });
     }
+    checkAutoScroll(item) {
+        if (!this.container)
+            return;
+        // For resize, also expand content area preemptively so there's space to scroll into
+        if (this._isResizing) {
+            this.checkResizeExpansion(item);
+        }
+        const threshold = 50; // pixels from edge to trigger scroll
+        const scrollSpeed = 5; // pixels per frame
+        const containerRect = this.container.getBoundingClientRect();
+        const itemRect = item.getBoundingClientRect();
+        let scrollX = 0;
+        let scrollY = 0;
+        // Check horizontal scrolling
+        if (itemRect.right > containerRect.right - threshold) {
+            scrollX = scrollSpeed;
+        }
+        else if (itemRect.left < containerRect.left + threshold) {
+            scrollX = -scrollSpeed;
+        }
+        // Check vertical scrolling
+        if (itemRect.bottom > containerRect.bottom - threshold) {
+            scrollY = scrollSpeed;
+        }
+        else if (itemRect.top < containerRect.top + threshold) {
+            scrollY = -scrollSpeed;
+        }
+        this._autoScrollSpeed = { x: scrollX, y: scrollY };
+        if ((scrollX !== 0 || scrollY !== 0) && !this._autoScrollInterval) {
+            this.startAutoScroll();
+        }
+        else if (scrollX === 0 && scrollY === 0 && this._autoScrollInterval) {
+            this.stopAutoScroll();
+        }
+    }
+    checkResizeExpansion(item) {
+        if (!this.container || !this.model)
+            return;
+        const baseSize = this.baseSize;
+        const gap = this.model.options.gap;
+        // Item edges in content coordinates - offsetTop is already content-relative
+        const itemBottom = item.offsetTop + item.offsetHeight;
+        const itemRight = item.offsetLeft + item.offsetWidth;
+        const currentContentHeight = this.content.offsetHeight;
+        const currentContentWidth = this.content.offsetWidth;
+        // Threshold: expand when item is within 1 grid cell of the content edge
+        const thresholdY = baseSize.h + gap;
+        const thresholdX = baseSize.w + gap;
+        let newHeight = currentContentHeight;
+        let newWidth = currentContentWidth;
+        let needsUpdate = false;
+        if (itemBottom > currentContentHeight - thresholdY) {
+            newHeight = currentContentHeight + 5 * (baseSize.h + gap);
+            needsUpdate = true;
+        }
+        if (itemRight > currentContentWidth - thresholdX) {
+            newWidth = currentContentWidth + 5 * (baseSize.w + gap);
+            needsUpdate = true;
+        }
+        if (needsUpdate) {
+            dom.setSize(this.content, { w: newWidth, h: newHeight });
+            this.model.size.w = Math.max(this.model.size.w, Math.ceil((newWidth - gap) / (baseSize.w + gap)));
+            this.model.size.h = Math.max(this.model.size.h, Math.ceil((newHeight - gap) / (baseSize.h + gap)));
+            this.drawGrid();
+        }
+    }
+    startAutoScroll() {
+        if (this._autoScrollInterval)
+            return;
+        this._autoScrollInterval = window.setInterval(() => {
+            if (!this.container)
+                return;
+            const { x, y } = this._autoScrollSpeed;
+            // Scroll vertically
+            if (y !== 0 && this.container.verticalSlider) {
+                const currentScroll = this.container.verticalSlider.value;
+                const maxScroll = this.container.verticalSlider.maxValue;
+                // Expand content area if scrolling down near the bottom
+                if (y > 0 && currentScroll >= maxScroll * 0.85) {
+                    this.expandContentArea();
+                    // After expanding, continue scrolling
+                    const newMaxScroll = this.container.verticalSlider.maxValue;
+                    this.container.scrollVerticalTo(Math.min(newMaxScroll, currentScroll + y));
+                }
+                else {
+                    const newScroll = Math.max(0, Math.min(maxScroll, currentScroll + y));
+                    this.container.scrollVerticalTo(newScroll);
+                }
+            }
+            // Scroll horizontally
+            if (x !== 0 && this.container.horizontalSlider) {
+                const currentScroll = this.container.horizontalSlider.value;
+                const maxScroll = this.container.horizontalSlider.maxValue;
+                // Expand content area if scrolling right near the edge
+                if (x > 0 && currentScroll >= maxScroll * 0.85) {
+                    this.expandContentArea();
+                    // After expanding, continue scrolling
+                    const newMaxScroll = this.container.horizontalSlider.maxValue;
+                    this.container.scrollHorizontalTo(Math.min(newMaxScroll, currentScroll + x));
+                }
+                else {
+                    const newScroll = Math.max(0, Math.min(maxScroll, currentScroll + x));
+                    this.container.scrollHorizontalTo(newScroll);
+                }
+            }
+            // During resize, update item size with new scroll offset so placeholder follows smoothly
+            if (this._isResizing && this._currentItem) {
+                this._currentItem.updateResize();
+            }
+        }, 16); // ~60fps
+    }
+    stopAutoScroll() {
+        if (this._autoScrollInterval) {
+            window.clearInterval(this._autoScrollInterval);
+            this._autoScrollInterval = null;
+        }
+        this._autoScrollSpeed = { x: 0, y: 0 };
+    }
+    expandContentArea() {
+        if (!this.model || !this._currentItem)
+            return;
+        // Calculate how much space we need based on current item position
+        const topOffset = this.scrollOffset;
+        const itemBottom = this._currentItem.offsetTop + this._currentItem.offsetHeight + topOffset;
+        const itemRight = this._currentItem.offsetLeft + this._currentItem.offsetWidth;
+        const currentContentHeight = this.content.offsetHeight;
+        const currentContentWidth = this.content.offsetWidth;
+        // Expand by 2 grid cells if needed
+        const expandRows = 2;
+        const expandCols = 2;
+        const baseSize = this.baseSize;
+        const gap = this.model.options.gap;
+        let newHeight = currentContentHeight;
+        let newWidth = currentContentWidth;
+        // Check if we need more height - only expand, never shrink
+        if (itemBottom > currentContentHeight - gap * 2) {
+            newHeight = Math.max(currentContentHeight, currentContentHeight + expandRows * (baseSize.h + gap));
+        }
+        // Check if we need more width - only expand, never shrink
+        if (itemRight > currentContentWidth - gap * 2) {
+            newWidth = Math.max(currentContentWidth, currentContentWidth + expandCols * (baseSize.w + gap));
+        }
+        // Only update if size actually changed
+        if (newHeight !== currentContentHeight || newWidth !== currentContentWidth) {
+            dom.setSize(this.content, { w: newWidth, h: newHeight });
+            // Update model size to match new content dimensions
+            const newModelWidth = Math.ceil((newWidth - gap) / (baseSize.w + gap));
+            const newModelHeight = Math.ceil((newHeight - gap) / (baseSize.h + gap));
+            // Only update if model size increased
+            this.model.size.w = Math.max(this.model.size.w, newModelWidth);
+            this.model.size.h = Math.max(this.model.size.h, newModelHeight);
+            this.drawGrid();
+        }
+    }
     constructor() {
         super();
         this.designMode = false;
         this.noGrid = false;
+        this._autoScrollInterval = null;
+        this._autoScrollSpeed = { x: 0, y: 0 };
+        this._isResizing = false;
         this.components = new ComponentStore(id => this.createComponent ? this.createComponent(id) : null);
         this._onItemMove = (e) => {
             if (!e.item.moving)
@@ -83,6 +248,7 @@ let Dashboard = class Dashboard extends OmegaComponent {
             const rect = { x, y, w: e.item.model.w, h: e.item.model.h };
             this.showPlaceholder(rect);
             this.previewLayout(rect);
+            this.checkAutoScroll(e.item);
         };
         this._onItemResize = (e) => {
             if (!e.item.resizing)
@@ -93,6 +259,7 @@ let Dashboard = class Dashboard extends OmegaComponent {
             const rect = { x: e.item.model.x, y: e.item.model.y, w, h };
             this.showPlaceholder(rect);
             this.previewLayout(rect);
+            this.checkAutoScroll(e.item);
         };
         this.render = () => this.model ? html `
 		<og-container>
@@ -112,7 +279,7 @@ let Dashboard = class Dashboard extends OmegaComponent {
 		</og-container>
 	` : '';
         this.addEventListener('dashboard.movestart', (e) => this.startMove(e.item));
-        this.addEventListener('dashboard.resizestart', (e) => this.startMove(e.item));
+        this.addEventListener('dashboard.resizestart', (e) => this.startResize(e.item));
         this.addEventListener('dashboard.movestop', () => this.stopMove());
         this.addEventListener('dashboard.resizestop', () => this.stopMove());
         this.addEventListener('dashboard.move', this._onItemMove);

package/dist/ui/dashboard.js.map

@@ -1 +1 @@
-{"version":3,"file":"dashboard.js","sourceRoot":"","sources":["../../src/ui/dashboard.ts"],"names":[],"mappings":"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","sourcesContent":["import { ComponentFactory, ComponentStore, Layout, OmegaComponent, dom, Rect, Container, Size } from '@omegagrid/core';\nimport { html } from 'lit';\nimport { customElement, property, query, queryAll } from 'lit/decorators.js';\nimport { map } from 'lit/directives/map.js';\nimport { style } from './dashboard.style';\nimport { DashboardItemModel, DashboardModel } from '../model';\nimport { DashboardSource } from '../types';\nimport { DashboardItem } from './dashboardItem';\n\nexport class DashboardEvent extends Event {\n\n\treadonly item: DashboardItem;\n\treadonly model: DashboardItemModel;\n\n\tconstructor(type: string, args: Partial<DashboardEvent>) {\n\t\tsuper(`dashboard.${type}`, {bubbles: true, composed: true});\n\t\tObject.assign(this, args);\n\t}\n}\n\n@customElement('og-dashboard')\nexport class Dashboard extends OmegaComponent implements Layout {\n\n\tstatic styles = [OmegaComponent.styles, style];\n\n\t@property({type: Object})\n\tmodel: DashboardModel;\n\n\t@property({type: Boolean, reflect: true})\n\tdesignMode = false;\n\n\t@property({type: Boolean})\n\tnoGrid = false;\n\n\t@property({type: Object})\n\tcreateComponent: ComponentFactory;\n\n\t@queryAll('og-dashboard-item')\n\titems: NodeList;\n\n\t@query('og-container')\n\tcontainer: Container;\n\n\t@query('[slot=\"content\"]')\n\tcontent: HTMLDivElement;\n\n\t@query('.item-placeholder')\n\tplaceholder: HTMLDivElement;\n\n\t@query('.item-grid')\n\tgridCanvas: HTMLCanvasElement;\n\n\tprivate _currentItem: DashboardItem;\n\tprivate _previewPositions: Rect[];\n\n\treadonly components = new ComponentStore<HTMLElement & Layout>(\n\t\tid => this.createComponent ? this.createComponent(id) as HTMLElement & Layout : null\n\t);\n\n\tprivate _baseSize: Size;\n\tget baseSize() {\n\t\tif (this._baseSize) return this._baseSize;\n\t\tconst { columns, columnWidth, rows, rowHeight, gap } = this.model.options;\n\n\t\tthis._baseSize = {\n\t\t\tw: columnWidth || (columns ? (this.container.clientWidth - ((columns + 1) * gap)) / columns : null),\n\t\t\th: rowHeight || (rows ? (this.container.clientHeight - ((rows + 1) * gap)) / rows : null),\n\t\t};\n\n\t\tif (this._baseSize.w == null) this._baseSize.w = this._baseSize.h;\n\t\tif (this._baseSize.h == null) this._baseSize.h = this._baseSize.w;\n\t\treturn this._baseSize;\n\t}\n\n\tstartMove(item: DashboardItem) {\n\t\tthis._currentItem = item;\n\t\tthis._currentItem.classList.toggle('active', true);\n\t\tthis.classList.toggle('moving', true);\n\t}\n\n\tstopMove() {\n\t\tif (!this._currentItem) return;\n\t\tthis._currentItem.classList.toggle('active', false);\n\t\tthis._currentItem = null;\n\t\tthis.classList.toggle('moving', false);\n\t\tthis.hidePlaceholder();\n\t\tthis.updatePreviewPositions();\n\t}\n\n\tget scrollOffset() {\n\t\treturn this.container?.verticalSlider?.value || 0;\n\t}\n\n\toffsetToXCoord(offset: number) {\n\t\treturn Math.max(0, Math.floor(offset / (this.baseSize.w + this.model.options.gap)));\n\t}\n\n\toffsetToYCoord(offset: number) {\n\t\treturn Math.max(0, Math.floor(offset / (this.baseSize.h + this.model.options.gap)));\n\t}\n\n\tupdatePreviewPositions() {\n\t\tif (!this._previewPositions) return;\n\t\tthis.model.updatePositions(this._previewPositions);\n\t\tthis._previewPositions = null;\n\t\tthis.layout();\n\t}\n\n\tpreviewLayout(rect: Rect) {\n\t\tthis._previewPositions = this.model.calculatePositions(this._currentItem.model, rect);\n\t\tthis._previewPositions.forEach((rect, i) => {\n\t\t\tconst item = this.items[i] as DashboardItem;\n\t\t\tif (item && item != this._currentItem) this.setItemPosition(item, rect);\n\t\t});\n\t}\n\n\t_onItemMove = (e: DashboardEvent) => {\n\t\tif (!e.item.moving) return;\n\t\tconst topOffset = this.scrollOffset;\n\t\tconst x = this.offsetToXCoord(e.item.offsetLeft);\n\t\tconst y = this.offsetToYCoord(e.item.offsetTop + topOffset);\n\t\tconst rect: Rect = {x, y, w: e.item.model.w, h: e.item.model.h};\n\t\tthis.showPlaceholder(rect);\n\t\tthis.previewLayout(rect);\n\t}\n\n\t_onItemResize = (e: DashboardEvent) => {\n\t\tif (!e.item.resizing) return;\n\t\tconst topOffset = this.scrollOffset;\n\t\tconst w = this.offsetToXCoord(e.item.offsetLeft + e.item.offsetWidth) - e.item.model.x + 1;\n\t\tconst h = this.offsetToYCoord(e.item.offsetTop + e.item.offsetHeight + topOffset) - e.item.model.y + 1;\n\t\tconst rect: Rect = {x: e.item.model.x, y: e.item.model.y, w, h};\n\t\tthis.showPlaceholder(rect);\n\t\tthis.previewLayout(rect);\n\t}\n\n\tconstructor() {\n\t\tsuper();\n\t\tthis.addEventListener('dashboard.movestart', (e: DashboardEvent) => this.startMove(e.item));\n\t\tthis.addEventListener('dashboard.resizestart', (e: DashboardEvent) => this.startMove(e.item));\n\t\tthis.addEventListener('dashboard.movestop', () => this.stopMove());\n\t\tthis.addEventListener('dashboard.resizestop', () => this.stopMove());\n\t\tthis.addEventListener('dashboard.move', this._onItemMove);\n\t\tthis.addEventListener('dashboard.resize', this._onItemResize);\n\t}\n\n\tcalculateItemLocation(item: Rect) : Rect {\n\t\tconst baseSize = this.baseSize;\n\t\tconst gap = this.model.options.gap;\n\t\treturn {\n\t\t\tx: item.x * (baseSize.w + gap) + gap,\n\t\t\ty: item.y * (baseSize.h + gap) + gap,\n\t\t\tw: item.w * (baseSize.w + gap) - gap,\n\t\t\th: item.h * (baseSize.h + gap) - gap,\n\t\t};\n\t}\n\n\tshowPlaceholder(rect: Rect) {\n\t\tdom.showElement(this.placeholder);\n\t\tthis.setItemPosition(this.placeholder, rect);\n\t}\n\n\thidePlaceholder() {\n\t\tdom.hideElement(this.placeholder);\n\t}\n\n\tsetSourceData(source: DashboardSource) {\n\t\tthis.components.clear();\n\t\tthis.model = new DashboardModel(source);\n\t\tthis.model.detectAndFixCollisions();\n\t}\n\n\tsetItemPosition(elm: HTMLElement, rect: Rect) {\n\t\tconst {x, y, w, h} = this.calculateItemLocation(rect);\n\t\tdom.setSize(elm, { w, h});\n\t\tdom.setPosition(elm, {l: x, t: y});\n\t}\n\n\tfixCollisions() {\n\t\tif (!this.model) return;\n\t\tthis.model.detectAndFixCollisions();\n\t\tthis.layout();\n\t}\n\n\tlayout() {\n\t\tthis._baseSize = null;\n\t\tif (!this.model) return;\n\t\tthis.items?.forEach((item: DashboardItem) => this.setItemPosition(item, item.model));\n\t\t\n\t\tdom.setSize(this.content, {\n\t\t\tw: this.model.size.w * (this.baseSize.w + this.model.options.gap) + this.model.options.gap,\n\t\t\th: this.model.size.h * (this.baseSize.h + this.model.options.gap) + this.model.options.gap\n\t\t});\n\n\t\tthis.items?.forEach((item: DashboardItem) => item.layout());\n\t\tthis.drawGrid();\n\t}\n\n\tasync drawGrid() {\n\t\tif (!this.gridCanvas) return;\n\t\tif (this.container.isUpdatePending) await this.container.updateComplete;\n\n\t\tconst ctx = this.gridCanvas.getContext('2d');\n\t\tif (!ctx) return;\n\n\t\tconst gap = this.model.options.gap;\n\t\tconst baseSize = this.baseSize;\n\t\t\n\t\tthis.gridCanvas.style.width = '100%';\n\t\tthis.gridCanvas.style.height = '100%';\n\t\tconst width = this.gridCanvas.offsetWidth;\n\t\tthis.gridCanvas.width = width;\n\t\tconst height = this.gridCanvas.offsetHeight;\n\t\tthis.gridCanvas.height = height;\n\t\tconst columns = width / baseSize.w;\n\t\tconst rows = height / baseSize.h;\n\n\n\t\tctx.clearRect(0, 0, width, height);\n\t\tctx.strokeStyle = 'rgba(116,116,116,0.2)';\n\t\tctx.lineWidth = 1;\n\n\t\tfor (let i = 0; i <= columns; i++) {\n\t\t\tconst x = Math.round(i * (baseSize.w + gap) + gap / 2) + 0.5;\n\t\t\tctx.beginPath();\n\t\t\tctx.moveTo(x, 0);\n\t\t\tctx.lineTo(x, height);\n\t\t\tctx.stroke();\n\t\t}\n\n\t\tfor (let i = 0; i <= rows; i++) {\n\t\t\tconst y = Math.round(i * (baseSize.h + gap) + gap / 2) + 0.5;\n\t\t\tctx.beginPath();\n\t\t\tctx.moveTo(0, y);\n\t\t\tctx.lineTo(width, y);\n\t\t\tctx.stroke();\n\t\t}\n\t}\n\n\tupdated() {\n\t\tthis.layout();\n\t}\n\t\n\trender = () => this.model ? html`\n\t\t<og-container>\n\t\t\t<div slot=\"content\">\n\t\t\t\t${this.designMode ? html`\n\t\t\t\t\t${this.noGrid ? '' : html`<canvas class=\"item-grid\"></canvas>`}\n\t\t\t\t\t<div class=\"item-placeholder\"></div>\n\t\t\t\t` : null}\n\t\t\t\t${map(this.model.items, item => html`\n\t\t\t\t\t<og-dashboard-item\n\t\t\t\t\t\t?designMode=\"${this.designMode}\"\n\t\t\t\t\t\t.model=\"${item}\" \n\t\t\t\t\t\t.components=\"${this.components}\">\n\t\t\t\t\t</og-dashboard-item>\n\t\t\t\t`)}\n\t\t\t</div>\n\t\t</og-container>\n\t` : '';\n\n}"]}
+{"version":3,"file":"dashboard.js","sourceRoot":"","sources":["../../src/ui/dashboard.ts"],"names":[],"mappings":"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","sourcesContent":["import { ComponentFactory, ComponentStore, Layout, OmegaComponent, dom, Rect, Container, Size } from '@omegagrid/core';\nimport { html } from 'lit';\nimport { customElement, property, query, queryAll } from 'lit/decorators.js';\nimport { map } from 'lit/directives/map.js';\nimport { style } from './dashboard.style';\nimport { DashboardItemModel, DashboardModel } from '../model';\nimport { DashboardSource } from '../types';\nimport { DashboardItem } from './dashboardItem';\n\nexport class DashboardEvent extends Event {\n\n\treadonly item: DashboardItem;\n\treadonly model: DashboardItemModel;\n\n\tconstructor(type: string, args: Partial<DashboardEvent>) {\n\t\tsuper(`dashboard.${type}`, {bubbles: true, composed: true});\n\t\tObject.assign(this, args);\n\t}\n}\n\n@customElement('og-dashboard')\nexport class Dashboard extends OmegaComponent implements Layout {\n\n\tstatic styles = [OmegaComponent.styles, style];\n\n\t@property({type: Object})\n\tmodel: DashboardModel;\n\n\t@property({type: Boolean, reflect: true})\n\tdesignMode = false;\n\n\t@property({type: Boolean})\n\tnoGrid = false;\n\n\t@property({type: Object})\n\tcreateComponent: ComponentFactory;\n\n\t@queryAll('og-dashboard-item')\n\titems: NodeList;\n\n\t@query('og-container')\n\tcontainer: Container;\n\n\t@query('[slot=\"content\"]')\n\tcontent: HTMLDivElement;\n\n\t@query('.item-placeholder')\n\tplaceholder: HTMLDivElement;\n\n\t@query('.item-grid')\n\tgridCanvas: HTMLCanvasElement;\n\n\tprivate _currentItem: DashboardItem;\n\tprivate _previewPositions: Rect[];\n\tprivate _autoScrollInterval: number = null;\n\tprivate _autoScrollSpeed = { x: 0, y: 0 };\n\tprivate _isResizing = false;\n\n\treadonly components = new ComponentStore<HTMLElement & Layout>(\n\t\tid => this.createComponent ? this.createComponent(id) as HTMLElement & Layout : null\n\t);\n\n\tprivate _baseSize: Size;\n\tget baseSize() {\n\t\tif (this._baseSize) return this._baseSize;\n\t\tconst { columns, columnWidth, rows, rowHeight, gap } = this.model.options;\n\n\t\tthis._baseSize = {\n\t\t\tw: columnWidth || (columns ? (this.container.clientWidth - ((columns + 1) * gap)) / columns : null),\n\t\t\th: rowHeight || (rows ? (this.container.clientHeight - ((rows + 1) * gap)) / rows : null),\n\t\t};\n\n\t\tif (this._baseSize.w == null) this._baseSize.w = this._baseSize.h;\n\t\tif (this._baseSize.h == null) this._baseSize.h = this._baseSize.w;\n\t\treturn this._baseSize;\n\t}\n\n\tstartMove(item: DashboardItem) {\n\t\tthis._currentItem = item;\n\t\tthis._currentItem.classList.toggle('active', true);\n\t\tthis.classList.toggle('moving', true);\n\t\tthis._isResizing = false;\n\t}\n\n\tstartResize(item: DashboardItem) {\n\t\tthis._currentItem = item;\n\t\tthis._currentItem.classList.toggle('active', true);\n\t\tthis.classList.toggle('moving', true);\n\t\tthis._isResizing = true;\n\t}\n\n\tstopMove() {\n\t\tif (!this._currentItem) return;\n\t\tthis._currentItem.classList.toggle('active', false);\n\t\tthis._currentItem = null;\n\t\tthis.classList.toggle('moving', false);\n\t\tthis.hidePlaceholder();\n\t\tthis.updatePreviewPositions();\n\t\tthis.stopAutoScroll();\n\t}\n\n\tget scrollOffset() {\n\t\treturn this.container?.verticalSlider?.value || 0;\n\t}\n\n\toffsetToXCoord(offset: number) {\n\t\treturn Math.max(0, Math.floor(offset / (this.baseSize.w + this.model.options.gap)));\n\t}\n\n\toffsetToYCoord(offset: number) {\n\t\treturn Math.max(0, Math.floor(offset / (this.baseSize.h + this.model.options.gap)));\n\t}\n\n\tupdatePreviewPositions() {\n\t\tif (!this._previewPositions) return;\n\t\tthis.model.updatePositions(this._previewPositions);\n\t\tthis._previewPositions = null;\n\t\tthis.layout();\n\t}\n\n\tpreviewLayout(rect: Rect) {\n\t\tthis._previewPositions = this.model.calculatePositions(this._currentItem.model, rect);\n\t\tthis._previewPositions.forEach((rect, i) => {\n\t\t\tconst item = this.items[i] as DashboardItem;\n\t\t\tif (item && item != this._currentItem) this.setItemPosition(item, rect);\n\t\t});\n\t}\n\n\tcheckAutoScroll(item: DashboardItem) {\n\t\tif (!this.container) return;\n\n\t\t// For resize, also expand content area preemptively so there's space to scroll into\n\t\tif (this._isResizing) {\n\t\t\tthis.checkResizeExpansion(item);\n\t\t}\n\n\t\tconst threshold = 50; // pixels from edge to trigger scroll\n\t\tconst scrollSpeed = 5; // pixels per frame\n\t\tconst containerRect = this.container.getBoundingClientRect();\n\t\tconst itemRect = item.getBoundingClientRect();\n\n\t\tlet scrollX = 0;\n\t\tlet scrollY = 0;\n\n\t\t// Check horizontal scrolling\n\t\tif (itemRect.right > containerRect.right - threshold) {\n\t\t\tscrollX = scrollSpeed;\n\t\t} else if (itemRect.left < containerRect.left + threshold) {\n\t\t\tscrollX = -scrollSpeed;\n\t\t}\n\n\t\t// Check vertical scrolling\n\t\tif (itemRect.bottom > containerRect.bottom - threshold) {\n\t\t\tscrollY = scrollSpeed;\n\t\t} else if (itemRect.top < containerRect.top + threshold) {\n\t\t\tscrollY = -scrollSpeed;\n\t\t}\n\n\t\tthis._autoScrollSpeed = { x: scrollX, y: scrollY };\n\n\t\tif ((scrollX !== 0 || scrollY !== 0) && !this._autoScrollInterval) {\n\t\t\tthis.startAutoScroll();\n\t\t} else if (scrollX === 0 && scrollY === 0 && this._autoScrollInterval) {\n\t\t\tthis.stopAutoScroll();\n\t\t}\n\t}\n\n\tcheckResizeExpansion(item: DashboardItem) {\n\t\tif (!this.container || !this.model) return;\n\n\t\tconst baseSize = this.baseSize;\n\t\tconst gap = this.model.options.gap;\n\n\t\t// Item edges in content coordinates - offsetTop is already content-relative\n\t\tconst itemBottom = item.offsetTop + item.offsetHeight;\n\t\tconst itemRight = item.offsetLeft + item.offsetWidth;\n\t\tconst currentContentHeight = this.content.offsetHeight;\n\t\tconst currentContentWidth = this.content.offsetWidth;\n\n\t\t// Threshold: expand when item is within 1 grid cell of the content edge\n\t\tconst thresholdY = baseSize.h + gap;\n\t\tconst thresholdX = baseSize.w + gap;\n\n\t\tlet newHeight = currentContentHeight;\n\t\tlet newWidth = currentContentWidth;\n\t\tlet needsUpdate = false;\n\n\t\tif (itemBottom > currentContentHeight - thresholdY) {\n\t\t\tnewHeight = currentContentHeight + 5 * (baseSize.h + gap);\n\t\t\tneedsUpdate = true;\n\t\t}\n\n\t\tif (itemRight > currentContentWidth - thresholdX) {\n\t\t\tnewWidth = currentContentWidth + 5 * (baseSize.w + gap);\n\t\t\tneedsUpdate = true;\n\t\t}\n\n\t\tif (needsUpdate) {\n\t\t\tdom.setSize(this.content, { w: newWidth, h: newHeight });\n\t\t\tthis.model.size.w = Math.max(this.model.size.w, Math.ceil((newWidth - gap) / (baseSize.w + gap)));\n\t\t\tthis.model.size.h = Math.max(this.model.size.h, Math.ceil((newHeight - gap) / (baseSize.h + gap)));\n\t\t\tthis.drawGrid();\n\t\t}\n\t}\n\n\tstartAutoScroll() {\n\t\tif (this._autoScrollInterval) return;\n\t\t\n\t\tthis._autoScrollInterval = window.setInterval(() => {\n\t\t\tif (!this.container) return;\n\n\t\t\tconst { x, y } = this._autoScrollSpeed;\n\n\t\t\t// Scroll vertically\n\t\t\tif (y !== 0 && this.container.verticalSlider) {\n\t\t\t\tconst currentScroll = this.container.verticalSlider.value;\n\t\t\t\tconst maxScroll = this.container.verticalSlider.maxValue;\n\t\t\t\t\n\t\t\t\t// Expand content area if scrolling down near the bottom\n\t\t\t\tif (y > 0 && currentScroll >= maxScroll * 0.85) {\n\t\t\t\t\tthis.expandContentArea();\n\t\t\t\t\t// After expanding, continue scrolling\n\t\t\t\t\tconst newMaxScroll = this.container.verticalSlider.maxValue;\n\t\t\t\t\tthis.container.scrollVerticalTo(Math.min(newMaxScroll, currentScroll + y));\n\t\t\t\t} else {\n\t\t\t\t\tconst newScroll = Math.max(0, Math.min(maxScroll, currentScroll + y));\n\t\t\t\t\tthis.container.scrollVerticalTo(newScroll);\n\t\t\t\t}\n\t\t\t}\n\n\t\t\t// Scroll horizontally\n\t\t\tif (x !== 0 && this.container.horizontalSlider) {\n\t\t\t\tconst currentScroll = this.container.horizontalSlider.value;\n\t\t\t\tconst maxScroll = this.container.horizontalSlider.maxValue;\n\t\t\t\t\n\t\t\t\t// Expand content area if scrolling right near the edge\n\t\t\t\tif (x > 0 && currentScroll >= maxScroll * 0.85) {\n\t\t\t\t\tthis.expandContentArea();\n\t\t\t\t\t// After expanding, continue scrolling\n\t\t\t\t\tconst newMaxScroll = this.container.horizontalSlider.maxValue;\n\t\t\t\t\tthis.container.scrollHorizontalTo(Math.min(newMaxScroll, currentScroll + x));\n\t\t\t\t} else {\n\t\t\t\t\tconst newScroll = Math.max(0, Math.min(maxScroll, currentScroll + x));\n\t\t\t\t\tthis.container.scrollHorizontalTo(newScroll);\n\t\t\t\t}\n\t\t\t}\n\n\t\t\t// During resize, update item size with new scroll offset so placeholder follows smoothly\n\t\t\tif (this._isResizing && this._currentItem) {\n\t\t\t\tthis._currentItem.updateResize();\n\t\t\t}\n\t\t}, 16); // ~60fps\n\t}\n\n\tstopAutoScroll() {\n\t\tif (this._autoScrollInterval) {\n\t\t\twindow.clearInterval(this._autoScrollInterval);\n\t\t\tthis._autoScrollInterval = null;\n\t\t}\n\t\tthis._autoScrollSpeed = { x: 0, y: 0 };\n\t}\n\n\texpandContentArea() {\n\t\tif (!this.model || !this._currentItem) return;\n\n\t\t// Calculate how much space we need based on current item position\n\t\tconst topOffset = this.scrollOffset;\n\t\tconst itemBottom = this._currentItem.offsetTop + this._currentItem.offsetHeight + topOffset;\n\t\tconst itemRight = this._currentItem.offsetLeft + this._currentItem.offsetWidth;\n\n\t\tconst currentContentHeight = this.content.offsetHeight;\n\t\tconst currentContentWidth = this.content.offsetWidth;\n\n\t\t// Expand by 2 grid cells if needed\n\t\tconst expandRows = 2;\n\t\tconst expandCols = 2;\n\t\tconst baseSize = this.baseSize;\n\t\tconst gap = this.model.options.gap;\n\n\t\tlet newHeight = currentContentHeight;\n\t\tlet newWidth = currentContentWidth;\n\n\t\t// Check if we need more height - only expand, never shrink\n\t\tif (itemBottom > currentContentHeight - gap * 2) {\n\t\t\tnewHeight = Math.max(currentContentHeight, currentContentHeight + expandRows * (baseSize.h + gap));\n\t\t}\n\n\t\t// Check if we need more width - only expand, never shrink\n\t\tif (itemRight > currentContentWidth - gap * 2) {\n\t\t\tnewWidth = Math.max(currentContentWidth, currentContentWidth + expandCols * (baseSize.w + gap));\n\t\t}\n\n\t\t// Only update if size actually changed\n\t\tif (newHeight !== currentContentHeight || newWidth !== currentContentWidth) {\n\t\t\tdom.setSize(this.content, { w: newWidth, h: newHeight });\n\t\t\t\n\t\t\t// Update model size to match new content dimensions\n\t\t\tconst newModelWidth = Math.ceil((newWidth - gap) / (baseSize.w + gap));\n\t\t\tconst newModelHeight = Math.ceil((newHeight - gap) / (baseSize.h + gap));\n\t\t\t\n\t\t\t// Only update if model size increased\n\t\t\tthis.model.size.w = Math.max(this.model.size.w, newModelWidth);\n\t\t\tthis.model.size.h = Math.max(this.model.size.h, newModelHeight);\n\t\t\t\n\t\t\tthis.drawGrid();\n\t\t}\n\t}\n\n\t_onItemMove = (e: DashboardEvent) => {\n\t\tif (!e.item.moving) return;\n\t\tconst topOffset = this.scrollOffset;\n\t\tconst x = this.offsetToXCoord(e.item.offsetLeft);\n\t\tconst y = this.offsetToYCoord(e.item.offsetTop + topOffset);\n\t\tconst rect: Rect = {x, y, w: e.item.model.w, h: e.item.model.h};\n\t\tthis.showPlaceholder(rect);\n\t\tthis.previewLayout(rect);\n\t\tthis.checkAutoScroll(e.item);\n\t}\n\n\t_onItemResize = (e: DashboardEvent) => {\n\t\tif (!e.item.resizing) return;\n\t\tconst topOffset = this.scrollOffset;\n\t\tconst w = this.offsetToXCoord(e.item.offsetLeft + e.item.offsetWidth) - e.item.model.x + 1;\n\t\tconst h = this.offsetToYCoord(e.item.offsetTop + e.item.offsetHeight + topOffset) - e.item.model.y + 1;\n\t\tconst rect: Rect = {x: e.item.model.x, y: e.item.model.y, w, h};\n\t\tthis.showPlaceholder(rect);\n\t\tthis.previewLayout(rect);\n\t\tthis.checkAutoScroll(e.item);\n\t}\n\n\tconstructor() {\n\t\tsuper();\n\t\tthis.addEventListener('dashboard.movestart', (e: DashboardEvent) => this.startMove(e.item));\n\t\tthis.addEventListener('dashboard.resizestart', (e: DashboardEvent) => this.startResize(e.item));\n\t\tthis.addEventListener('dashboard.movestop', () => this.stopMove());\n\t\tthis.addEventListener('dashboard.resizestop', () => this.stopMove());\n\t\tthis.addEventListener('dashboard.move', this._onItemMove);\n\t\tthis.addEventListener('dashboard.resize', this._onItemResize);\n\t}\n\n\tcalculateItemLocation(item: Rect) : Rect {\n\t\tconst baseSize = this.baseSize;\n\t\tconst gap = this.model.options.gap;\n\t\treturn {\n\t\t\tx: item.x * (baseSize.w + gap) + gap,\n\t\t\ty: item.y * (baseSize.h + gap) + gap,\n\t\t\tw: item.w * (baseSize.w + gap) - gap,\n\t\t\th: item.h * (baseSize.h + gap) - gap,\n\t\t};\n\t}\n\n\tshowPlaceholder(rect: Rect) {\n\t\tdom.showElement(this.placeholder);\n\t\tthis.setItemPosition(this.placeholder, rect);\n\t}\n\n\thidePlaceholder() {\n\t\tdom.hideElement(this.placeholder);\n\t}\n\n\tsetSourceData(source: DashboardSource) {\n\t\tthis.components.clear();\n\t\tthis.model = new DashboardModel(source);\n\t\tthis.model.detectAndFixCollisions();\n\t}\n\n\tsetItemPosition(elm: HTMLElement, rect: Rect) {\n\t\tconst {x, y, w, h} = this.calculateItemLocation(rect);\n\t\tdom.setSize(elm, { w, h});\n\t\tdom.setPosition(elm, {l: x, t: y});\n\t}\n\n\tfixCollisions() {\n\t\tif (!this.model) return;\n\t\tthis.model.detectAndFixCollisions();\n\t\tthis.layout();\n\t}\n\n\tlayout() {\n\t\tthis._baseSize = null;\n\t\tif (!this.model) return;\n\t\tthis.items?.forEach((item: DashboardItem) => this.setItemPosition(item, item.model));\n\t\t\n\t\tdom.setSize(this.content, {\n\t\t\tw: this.model.size.w * (this.baseSize.w + this.model.options.gap) + this.model.options.gap,\n\t\t\th: this.model.size.h * (this.baseSize.h + this.model.options.gap) + this.model.options.gap\n\t\t});\n\n\t\tthis.items?.forEach((item: DashboardItem) => item.layout());\n\t\tthis.drawGrid();\n\t}\n\n\tasync drawGrid() {\n\t\tif (!this.gridCanvas) return;\n\t\tif (this.container.isUpdatePending) await this.container.updateComplete;\n\n\t\tconst ctx = this.gridCanvas.getContext('2d');\n\t\tif (!ctx) return;\n\n\t\tconst gap = this.model.options.gap;\n\t\tconst baseSize = this.baseSize;\n\t\t\n\t\tthis.gridCanvas.style.width = '100%';\n\t\tthis.gridCanvas.style.height = '100%';\n\t\tconst width = this.gridCanvas.offsetWidth;\n\t\tthis.gridCanvas.width = width;\n\t\tconst height = this.gridCanvas.offsetHeight;\n\t\tthis.gridCanvas.height = height;\n\t\tconst columns = width / baseSize.w;\n\t\tconst rows = height / baseSize.h;\n\n\n\t\tctx.clearRect(0, 0, width, height);\n\t\tctx.strokeStyle = 'rgba(116,116,116,0.2)';\n\t\tctx.lineWidth = 1;\n\n\t\tfor (let i = 0; i <= columns; i++) {\n\t\t\tconst x = Math.round(i * (baseSize.w + gap) + gap / 2) + 0.5;\n\t\t\tctx.beginPath();\n\t\t\tctx.moveTo(x, 0);\n\t\t\tctx.lineTo(x, height);\n\t\t\tctx.stroke();\n\t\t}\n\n\t\tfor (let i = 0; i <= rows; i++) {\n\t\t\tconst y = Math.round(i * (baseSize.h + gap) + gap / 2) + 0.5;\n\t\t\tctx.beginPath();\n\t\t\tctx.moveTo(0, y);\n\t\t\tctx.lineTo(width, y);\n\t\t\tctx.stroke();\n\t\t}\n\t}\n\n\tupdated() {\n\t\tthis.layout();\n\t}\n\t\n\trender = () => this.model ? html`\n\t\t<og-container>\n\t\t\t<div slot=\"content\">\n\t\t\t\t${this.designMode ? html`\n\t\t\t\t\t${this.noGrid ? '' : html`<canvas class=\"item-grid\"></canvas>`}\n\t\t\t\t\t<div class=\"item-placeholder\"></div>\n\t\t\t\t` : null}\n\t\t\t\t${map(this.model.items, item => html`\n\t\t\t\t\t<og-dashboard-item\n\t\t\t\t\t\t?designMode=\"${this.designMode}\"\n\t\t\t\t\t\t.model=\"${item}\" \n\t\t\t\t\t\t.components=\"${this.components}\">\n\t\t\t\t\t</og-dashboard-item>\n\t\t\t\t`)}\n\t\t\t</div>\n\t\t</og-container>\n\t` : '';\n\n}"]}

package/dist/ui/dashboard.style.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"dashboard.style.d.ts","sourceRoot":"","sources":["../../src/ui/dashboard.style.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,KAAK,yBAwDjB,CAAC"}
+{"version":3,"file":"dashboard.style.d.ts","sourceRoot":"","sources":["../../src/ui/dashboard.style.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,KAAK,yBAyDjB,CAAC"}

package/dist/ui/dashboard.style.js

@@ -34,6 +34,7 @@ export const style = css `
 	:host([designMode]) og-dashboard-item.active {
 		border: none;
 		background-color: var(--og-accent-color);
+		resize: none;
 	}
 
 	:host([designMode].moving) og-dashboard-item.active {

package/dist/ui/dashboard.style.js.map

@@ -1 +1 @@
-{"version":3,"file":"dashboard.style.js","sourceRoot":"","sources":["../../src/ui/dashboard.style.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,KAAK,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAwDvB,CAAC","sourcesContent":["import { css } from 'lit';\n\nexport const style = css`\n\t:host {\n\t\tposition: relative;\n\t\toverflow: hidden;\n\t}\n\n\tog-container {\n\t\twidth: 100%;\n\t\theight: 100%;\n\t}\n\n\tog-dashboard-item {\n\t\t_border: 2px solid var(--og-accent-color);\n\t\tz-index: 100;\n\t\ttransition: left 0.2s, top 0.2s;\n\t}\n\n\tog-dashboard-item.active {\n\t\ttransition: none;\n\t}\n\n\t:host([designMode]) og-dashboard-item {\n\t\tcursor: move;\n\t\tresize: both;\n\t\tbackground-color: var(--og-accent-color);\n\t\tcolor: var(--og-text-color-2);\n\t}\n\t\n\t:host([designMode].moving) og-dashboard-item {\n\t\topacity: 0.6;\n\t}\n\n\t:host([designMode]) og-dashboard-item.active {\n\t\tborder: none;\n\t\tbackground-color: var(--og-accent-color);\n\t}\n\n\t:host([designMode].moving) og-dashboard-item.active {\n\t\topacity: 1;\n\t}\n\t\n\t.item-placeholder {\n\t\tdisplay: none;\n\t\tborder: 2px dotted var(--og-accent-color);\n\t\ttransition: left 0.2s, top 0.2s, width 0.2s, height 0.2s;\n\t\tz-index: 99;\n\t}\n\n\t.item-grid {\n\t\tz-index: 98;\n\t\tposition: absolute;\n\t\ttop: 0;\n\t\tleft: 0;\n\t\twidth: 100%;\n\t\theight: 100%;\n\t}\n`;"]}
+{"version":3,"file":"dashboard.style.js","sourceRoot":"","sources":["../../src/ui/dashboard.style.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,KAAK,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAyDvB,CAAC","sourcesContent":["import { css } from 'lit';\n\nexport const style = css`\n\t:host {\n\t\tposition: relative;\n\t\toverflow: hidden;\n\t}\n\n\tog-container {\n\t\twidth: 100%;\n\t\theight: 100%;\n\t}\n\n\tog-dashboard-item {\n\t\t_border: 2px solid var(--og-accent-color);\n\t\tz-index: 100;\n\t\ttransition: left 0.2s, top 0.2s;\n\t}\n\n\tog-dashboard-item.active {\n\t\ttransition: none;\n\t}\n\n\t:host([designMode]) og-dashboard-item {\n\t\tcursor: move;\n\t\tresize: both;\n\t\tbackground-color: var(--og-accent-color);\n\t\tcolor: var(--og-text-color-2);\n\t}\n\t\n\t:host([designMode].moving) og-dashboard-item {\n\t\topacity: 0.6;\n\t}\n\n\t:host([designMode]) og-dashboard-item.active {\n\t\tborder: none;\n\t\tbackground-color: var(--og-accent-color);\n\t\tresize: none;\n\t}\n\n\t:host([designMode].moving) og-dashboard-item.active {\n\t\topacity: 1;\n\t}\n\t\n\t.item-placeholder {\n\t\tdisplay: none;\n\t\tborder: 2px dotted var(--og-accent-color);\n\t\ttransition: left 0.2s, top 0.2s, width 0.2s, height 0.2s;\n\t\tz-index: 99;\n\t}\n\n\t.item-grid {\n\t\tz-index: 98;\n\t\tposition: absolute;\n\t\ttop: 0;\n\t\tleft: 0;\n\t\twidth: 100%;\n\t\theight: 100%;\n\t}\n`;"]}

package/dist/ui/dashboardItem.d.ts

@@ -13,6 +13,9 @@ export declare class DashboardItem extends OmegaComponent implements Layout {
     private _resizing;
     private _elementOffset;
     private _resizeObserver;
+    private _initialSize;
+    private _initialScrollOffset;
+    private _lastMouseEvent;
     get mouseOffset(): {
         top: number;
         left: number;
@@ -27,6 +30,10 @@ export declare class DashboardItem extends OmegaComponent implements Layout {
     _onMouseUp: () => void;
     _onMouseDown: (e: MouseEvent) => void;
     _onMouseMove: (e: MouseEvent) => void;
+    _onMouseResize: (e: MouseEvent) => void;
+    /** Re-trigger resize calculation with current scroll offset (called from autoscroll interval) */
+    updateResize(): void;
+    private _applyResize;
     _onResize: () => void;
     layout(): Promise<void>;
     showOverlay(text?: string, loader?: boolean): void;

package/dist/ui/dashboardItem.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"dashboardItem.d.ts","sourceRoot":"","sources":["../../src/ui/dashboardItem.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAO,MAAM,EAAE,cAAc,EAAE,OAAO,EAAE,MAAM,iBAAiB,CAAC;AAGvF,OAAO,EAAE,kBAAkB,EAAE,MAAM,UAAU,CAAC;AAG9C,qBACa,aAAc,SAAQ,cAAe,YAAW,MAAM;IAElE,MAAM,CAAC,MAAM,iCAgBV;IAGH,UAAU,EAAE,cAAc,CAAC,WAAW,GAAG,MAAM,CAAC,CAAC;IAGjD,KAAK,EAAE,kBAAkB,CAAC;IAG1B,UAAU,UAAS;IAGnB,SAAS,EAAE,cAAc,CAAC;IAG1B,OAAO,EAAE,OAAO,CAAC;IAEjB,OAAO,CAAC,OAAO,CAAY;IAC3B,OAAO,CAAC,YAAY,CAAqC;IACzD,OAAO,CAAC,aAAa,CAAqC;IAC1D,OAAO,CAAC,SAAS,CAAS;IAC1B,OAAO,CAAC,cAAc,CAAqC;IAC3D,OAAO,CAAC,eAAe,CAAiB;IAExC,IAAI,WAAW;aANa,MAAM;cAAQ,MAAM;MAMF;IAC9C,IAAI,MAAM,YAAyC;IACnD,IAAI,QAAQ,YAA4B;IAGxC,IAAI,SAAS,kCAIZ;;IAWD,iBAAiB;IAMjB,oBAAoB;IAMpB,WAAW;IAKX,UAAU,aAUR;IAEF,YAAY,GAAI,GAAG,UAAU,UAc3B;IAEF,YAAY,GAAI,GAAG,UAAU,UAO3B;IAEF,SAAS,aAEP;IAEI,MAAM;IAKZ,WAAW,CAAC,IAAI,GAAE,MAAa,EAAE,MAAM,GAAE,OAAe;IASxD,WAAW;IAKL,OAAO;IAgBb,MAAM,6CAGJ;CAEF"}
+{"version":3,"file":"dashboardItem.d.ts","sourceRoot":"","sources":["../../src/ui/dashboardItem.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAO,MAAM,EAAE,cAAc,EAAE,OAAO,EAAE,MAAM,iBAAiB,CAAC;AAGvF,OAAO,EAAE,kBAAkB,EAAE,MAAM,UAAU,CAAC;AAG9C,qBACa,aAAc,SAAQ,cAAe,YAAW,MAAM;IAElE,MAAM,CAAC,MAAM,iCAgBV;IAGH,UAAU,EAAE,cAAc,CAAC,WAAW,GAAG,MAAM,CAAC,CAAC;IAGjD,KAAK,EAAE,kBAAkB,CAAC;IAG1B,UAAU,UAAS;IAGnB,SAAS,EAAE,cAAc,CAAC;IAG1B,OAAO,EAAE,OAAO,CAAC;IAEjB,OAAO,CAAC,OAAO,CAAY;IAC3B,OAAO,CAAC,YAAY,CAAqC;IACzD,OAAO,CAAC,aAAa,CAAqC;IAC1D,OAAO,CAAC,SAAS,CAAS;IAC1B,OAAO,CAAC,cAAc,CAAqC;IAC3D,OAAO,CAAC,eAAe,CAAiB;IACxC,OAAO,CAAC,YAAY,CAAyC;IAC7D,OAAO,CAAC,oBAAoB,CAAK;IACjC,OAAO,CAAC,eAAe,CAAoB;IAE3C,IAAI,WAAW;aATa,MAAM;cAAQ,MAAM;MASF;IAC9C,IAAI,MAAM,YAAyC;IACnD,IAAI,QAAQ,YAA4B;IAGxC,IAAI,SAAS,kCAIZ;;IAcD,iBAAiB;IAMjB,oBAAoB;IAMpB,WAAW;IAMX,UAAU,aAYR;IAEF,YAAY,GAAI,GAAG,UAAU,UAoB3B;IAEF,YAAY,GAAI,GAAG,UAAU,UAO3B;IAEF,cAAc,GAAI,GAAG,UAAU,UAG7B;IAEF,iGAAiG;IACjG,YAAY;IAMZ,OAAO,CAAC,YAAY;IAYpB,SAAS,aAEP;IAEI,MAAM;IAKZ,WAAW,CAAC,IAAI,GAAE,MAAa,EAAE,MAAM,GAAE,OAAe;IASxD,WAAW;IAKL,OAAO;IAgBb,MAAM,6CAGJ;CAEF"}

package/dist/ui/dashboardItem.js

@@ -26,6 +26,9 @@ let DashboardItem = class DashboardItem extends OmegaComponent {
         this._movingOffset = null;
         this._resizing = false;
         this._elementOffset = null;
+        this._initialSize = null;
+        this._initialScrollOffset = 0;
+        this._lastMouseEvent = null;
         this._onMouseUp = () => {
             if (this.resizing) {
                 this.dispatchEvent(new DashboardEvent('resizestop', { item: this, model: this.model }));
@@ -35,6 +38,8 @@ let DashboardItem = class DashboardItem extends OmegaComponent {
             }
             this._movingOffset = null;
             this._resizing = false;
+            this._initialSize = null;
+            this._lastMouseEvent = null;
             this.clearEvents();
         };
         this._onMouseDown = (e) => {
@@ -44,6 +49,12 @@ let DashboardItem = class DashboardItem extends OmegaComponent {
             this._mouseOffset = { top: e.offsetY, left: e.offsetX };
             if (e.offsetX > this.offsetWidth - 20 && e.offsetY > this.offsetHeight - 20) {
                 this._resizing = true;
+                // Store pure client coordinates - NO scroll offset for resize
+                this._movingOffset = { left: e.clientX, top: e.clientY };
+                this._initialSize = { width: this.offsetWidth, height: this.offsetHeight };
+                this._initialScrollOffset = scrollOffset;
+                this._parent.addEventListener('mouseup', this._onMouseUp);
+                this._parent.addEventListener('mousemove', this._onMouseResize);
                 this.dispatchEvent(new DashboardEvent('resizestart', { item: this, model: this.model }));
             }
             else {
@@ -62,6 +73,10 @@ let DashboardItem = class DashboardItem extends OmegaComponent {
             });
             this.dispatchEvent(new DashboardEvent('move', { item: this, model: this.model }));
         };
+        this._onMouseResize = (e) => {
+            this._lastMouseEvent = e;
+            this._applyResize(e.clientX, e.clientY);
+        };
         this._onResize = () => {
             this.dispatchEvent(new DashboardEvent('resize', { item: this, model: this.model }));
         };
@@ -72,7 +87,10 @@ let DashboardItem = class DashboardItem extends OmegaComponent {
         this.addEventListener('mousedown', this._onMouseDown);
         this.addEventListener('mouseup', this._onMouseUp);
         this._resizeObserver = new ResizeObserver(() => {
-            this.dispatchEvent(new DashboardEvent('resize', { item: this, model: this.model }));
+            // Only dispatch resize event if not manually resizing
+            if (!this._resizing) {
+                this.dispatchEvent(new DashboardEvent('resize', { item: this, model: this.model }));
+            }
         });
     }
     connectedCallback() {
@@ -88,6 +106,22 @@ let DashboardItem = class DashboardItem extends OmegaComponent {
     clearEvents() {
         this._parent.removeEventListener('mouseup', this._onMouseUp);
         this._parent.removeEventListener('mousemove', this._onMouseMove);
+        this._parent.removeEventListener('mousemove', this._onMouseResize);
+    }
+    /** Re-trigger resize calculation with current scroll offset (called from autoscroll interval) */
+    updateResize() {
+        if (this._lastMouseEvent) {
+            this._applyResize(this._lastMouseEvent.clientX, this._lastMouseEvent.clientY);
+        }
+    }
+    _applyResize(clientX, clientY) {
+        const scrollDelta = this._parent.scrollOffset - this._initialScrollOffset;
+        const deltaX = clientX - this._movingOffset.left;
+        const deltaY = clientY - this._movingOffset.top + scrollDelta;
+        const newWidth = Math.max(50, this._initialSize.width + deltaX);
+        const newHeight = Math.max(50, this._initialSize.height + deltaY);
+        dom.setSize(this, { w: newWidth, h: newHeight });
+        this.dispatchEvent(new DashboardEvent('resize', { item: this, model: this.model }));
     }
     async layout() {
         const c = await this.component;

package/dist/ui/dashboardItem.js.map

@@ -1 +1 @@
-{"version":3,"file":"dashboardItem.js","sourceRoot":"","sources":["../../src/ui/dashboardItem.ts"],"names":[],"mappings":"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","sourcesContent":["import { ComponentStore, dom, Layout, OmegaComponent, Overlay } from \"@omegagrid/core\";\nimport { css, html } from \"lit\";\nimport { customElement, property, query } from \"lit/decorators.js\";\nimport { DashboardItemModel } from \"../model\";\nimport { Dashboard, DashboardEvent } from \"./dashboard\";\n\n@customElement('og-dashboard-item')\nexport class DashboardItem extends OmegaComponent implements Layout {\n\n\tstatic styles = [OmegaComponent.styles, css`\n\t\t:host {\n\t\t\tposition: relative;\n\t\t\toverflow: hidden;\n\t\t}\n\n\t\tog-overlay {\n\t\t\tposition: absolute;\n\t\t\tinset: 0;\n\t\t\tz-index: 1101;\n\t\t\tbackground-color: var(--og-accent-color);\n\t\t}\n\n\t\t.container {\n\t\t\theight: 100%;\n\t\t}\n\t`];\n\n\t@property({type: Object})\n\tcomponents: ComponentStore<HTMLElement & Layout>;\n\n\t@property({type: Object})\n\tmodel: DashboardItemModel;\n\n\t@property({type: Boolean, reflect: true})\n\tdesignMode = false;\n\n\t@query('.container')\n\tcontainer: HTMLDivElement;\n\t\n\t@query('og-overlay')\n\toverlay: Overlay;\n\n\tprivate _parent: Dashboard;\n\tprivate _mouseOffset: {top: number, left: number} = null;\n\tprivate _movingOffset: {top: number, left: number} = null;\n\tprivate _resizing = false;\n\tprivate _elementOffset: {top: number, left: number} = null;\n\tprivate _resizeObserver: ResizeObserver;\n\n\tget mouseOffset() { return this._mouseOffset }\n\tget moving() { return this._movingOffset !== null }\n\tget resizing() { return this._resizing }\n\n\n\tget component() {\n\t\tif (!this.model) return null;\n\t\tif (!this.components) return null;\n\t\treturn this.components.get(this.model.id);\n\t}\n\n\tconstructor() {\n\t\tsuper();\n\t\tthis.addEventListener('mousedown', this._onMouseDown);\n\t\tthis.addEventListener('mouseup', this._onMouseUp);\n\t\tthis._resizeObserver = new ResizeObserver(() => {\n\t\t\tthis.dispatchEvent(new DashboardEvent('resize', {item: this, model: this.model}));\n\t\t});\n\t}\n\n\tconnectedCallback() {\n\t\tsuper.connectedCallback();\n\t\tthis._resizeObserver.observe(this);\n\t\tthis._parent = dom.findParent<Dashboard>(this, elm => elm instanceof Dashboard);\n\t}\n\n\tdisconnectedCallback() {\n\t\tthis.clearEvents();\n\t\tthis._parent = null;\n\t\tthis._resizeObserver.unobserve(this);\n\t}\n\n\tclearEvents() {\n\t\tthis._parent.removeEventListener('mouseup', this._onMouseUp);\n\t\tthis._parent.removeEventListener('mousemove', this._onMouseMove);\n\t}\n\n\t_onMouseUp = () => {\n\t\tif (this.resizing) {\n\t\t\tthis.dispatchEvent(new DashboardEvent('resizestop', {item: this, model: this.model}));\n\t\t} else if (this.moving) {\n\t\t\tthis.dispatchEvent(new DashboardEvent('movestop', {item: this, model: this.model}));\n\t\t}\n\n\t\tthis._movingOffset = null;\n\t\tthis._resizing = false;\n\t\tthis.clearEvents();\n\t};\n\n\t_onMouseDown = (e: MouseEvent) => {\n\t\tif (!this._parent.designMode) return;\n\t\tconst scrollOffset = this._parent.scrollOffset;\n\t\tthis._mouseOffset = {top: e.offsetY, left: e.offsetX};\n\t\tif (e.offsetX > this.offsetWidth - 20 && e.offsetY > this.offsetHeight - 20) {\n\t\t\tthis._resizing = true;\n\t\t\tthis.dispatchEvent(new DashboardEvent('resizestart', {item: this, model: this.model}));\n\t\t} else {\n\t\t\tthis._movingOffset = {left: e.clientX, top: e.clientY + scrollOffset}; \n\t\t\tthis._elementOffset = {left: this.offsetLeft, top: this.offsetTop + scrollOffset};\n\t\t\tthis._parent.addEventListener('mouseup', this._onMouseUp);\n\t\t\tthis._parent.addEventListener('mousemove', this._onMouseMove);\n\t\t\tthis.dispatchEvent(new DashboardEvent('movestart', {item: this, model: this.model}));\n\t\t}\n\t};\n\n\t_onMouseMove = (e: MouseEvent) => {\n\t\tconst scrollOffset = this._parent.scrollOffset;\n\t\tdom.setPosition(this, {\n\t\t\tl: this._elementOffset.left + e.clientX - this._movingOffset.left,\n\t\t\tt: this._elementOffset.top + e.clientY - this._movingOffset.top + scrollOffset,   \n\t\t});\n\t\tthis.dispatchEvent(new DashboardEvent('move', {item: this, model: this.model}));\n\t};\n\n\t_onResize = () => {\n\t\tthis.dispatchEvent(new DashboardEvent('resize', {item: this, model: this.model}));\n\t};\n\n\tasync layout() {\n\t\tconst c = await this.component;\n\t\tif (c?.layout) c.layout();\n\t}\n\n\tshowOverlay(text: string = null, loader: boolean = false) {\n\t\tthis.overlay.text = text;\n\t\tthis.overlay.defaultLoader = loader;\n\t\tconst opacity = this.model.model.options.overlay?.opacity ?? 1;\n\t\tthis.overlay.style.opacity = opacity.toString();\n\t\tthis.overlay.show(this);\n\t\tif (opacity >= 1) dom.hideElement(this.container);\n\t}\n\n\thideOverlay() {\n\t\tthis.overlay.hide();\n\t\tdom.showElement(this.container);\n\t}\n\n\tasync updated() {\n\t\tthis.showOverlay(this.designMode ? this.model.title : null);\n\t\tconst component = await this.component;\n\t\tif (component) {\n\t\t\tdom.empty(this.container);\n\t\t\tthis.container.appendChild(component);\n\t\t}\n\t\t\t\n\t\tif (this.designMode) {\n\t\t\tthis.showOverlay(this.model.title, false);\n\t\t} else {\n\t\t\tthis.hideOverlay();\n\t\t}\n\t\t\n\t}\n\n\trender = () => html`\n\t\t<div class=\"container\"></div>\n\t\t<og-overlay></og-overlay>\n\t`;\n\n}"]}
+{"version":3,"file":"dashboardItem.js","sourceRoot":"","sources":["../../src/ui/dashboardItem.ts"],"names":[],"mappings":"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","sourcesContent":["import { ComponentStore, dom, Layout, OmegaComponent, Overlay } from \"@omegagrid/core\";\nimport { css, html } from \"lit\";\nimport { customElement, property, query } from \"lit/decorators.js\";\nimport { DashboardItemModel } from \"../model\";\nimport { Dashboard, DashboardEvent } from \"./dashboard\";\n\n@customElement('og-dashboard-item')\nexport class DashboardItem extends OmegaComponent implements Layout {\n\n\tstatic styles = [OmegaComponent.styles, css`\n\t\t:host {\n\t\t\tposition: relative;\n\t\t\toverflow: hidden;\n\t\t}\n\n\t\tog-overlay {\n\t\t\tposition: absolute;\n\t\t\tinset: 0;\n\t\t\tz-index: 1101;\n\t\t\tbackground-color: var(--og-accent-color);\n\t\t}\n\n\t\t.container {\n\t\t\theight: 100%;\n\t\t}\n\t`];\n\n\t@property({type: Object})\n\tcomponents: ComponentStore<HTMLElement & Layout>;\n\n\t@property({type: Object})\n\tmodel: DashboardItemModel;\n\n\t@property({type: Boolean, reflect: true})\n\tdesignMode = false;\n\n\t@query('.container')\n\tcontainer: HTMLDivElement;\n\t\n\t@query('og-overlay')\n\toverlay: Overlay;\n\n\tprivate _parent: Dashboard;\n\tprivate _mouseOffset: {top: number, left: number} = null;\n\tprivate _movingOffset: {top: number, left: number} = null;\n\tprivate _resizing = false;\n\tprivate _elementOffset: {top: number, left: number} = null;\n\tprivate _resizeObserver: ResizeObserver;\n\tprivate _initialSize: {width: number, height: number} = null;\n\tprivate _initialScrollOffset = 0;\n\tprivate _lastMouseEvent: MouseEvent = null;\n\n\tget mouseOffset() { return this._mouseOffset }\n\tget moving() { return this._movingOffset !== null }\n\tget resizing() { return this._resizing }\n\n\n\tget component() {\n\t\tif (!this.model) return null;\n\t\tif (!this.components) return null;\n\t\treturn this.components.get(this.model.id);\n\t}\n\n\tconstructor() {\n\t\tsuper();\n\t\tthis.addEventListener('mousedown', this._onMouseDown);\n\t\tthis.addEventListener('mouseup', this._onMouseUp);\n\t\tthis._resizeObserver = new ResizeObserver(() => {\n\t\t\t// Only dispatch resize event if not manually resizing\n\t\t\tif (!this._resizing) {\n\t\t\t\tthis.dispatchEvent(new DashboardEvent('resize', {item: this, model: this.model}));\n\t\t\t}\n\t\t});\n\t}\n\n\tconnectedCallback() {\n\t\tsuper.connectedCallback();\n\t\tthis._resizeObserver.observe(this);\n\t\tthis._parent = dom.findParent<Dashboard>(this, elm => elm instanceof Dashboard);\n\t}\n\n\tdisconnectedCallback() {\n\t\tthis.clearEvents();\n\t\tthis._parent = null;\n\t\tthis._resizeObserver.unobserve(this);\n\t}\n\n\tclearEvents() {\n\t\tthis._parent.removeEventListener('mouseup', this._onMouseUp);\n\t\tthis._parent.removeEventListener('mousemove', this._onMouseMove);\n\t\tthis._parent.removeEventListener('mousemove', this._onMouseResize);\n\t}\n\n\t_onMouseUp = () => {\n\t\tif (this.resizing) {\n\t\t\tthis.dispatchEvent(new DashboardEvent('resizestop', {item: this, model: this.model}));\n\t\t} else if (this.moving) {\n\t\t\tthis.dispatchEvent(new DashboardEvent('movestop', {item: this, model: this.model}));\n\t\t}\n\n\t\tthis._movingOffset = null;\n\t\tthis._resizing = false;\n\t\tthis._initialSize = null;\n\t\tthis._lastMouseEvent = null;\n\t\tthis.clearEvents();\n\t};\n\n\t_onMouseDown = (e: MouseEvent) => {\n\t\tif (!this._parent.designMode) return;\n\t\tconst scrollOffset = this._parent.scrollOffset;\n\t\tthis._mouseOffset = {top: e.offsetY, left: e.offsetX};\n\t\tif (e.offsetX > this.offsetWidth - 20 && e.offsetY > this.offsetHeight - 20) {\n\t\t\tthis._resizing = true;\n\t\t\t// Store pure client coordinates - NO scroll offset for resize\n\t\t\tthis._movingOffset = {left: e.clientX, top: e.clientY};\n\t\t\tthis._initialSize = {width: this.offsetWidth, height: this.offsetHeight};\n\t\t\tthis._initialScrollOffset = scrollOffset;\n\t\t\tthis._parent.addEventListener('mouseup', this._onMouseUp);\n\t\t\tthis._parent.addEventListener('mousemove', this._onMouseResize);\n\t\t\tthis.dispatchEvent(new DashboardEvent('resizestart', {item: this, model: this.model}));\n\t\t} else {\n\t\t\tthis._movingOffset = {left: e.clientX, top: e.clientY + scrollOffset}; \n\t\t\tthis._elementOffset = {left: this.offsetLeft, top: this.offsetTop + scrollOffset};\n\t\t\tthis._parent.addEventListener('mouseup', this._onMouseUp);\n\t\t\tthis._parent.addEventListener('mousemove', this._onMouseMove);\n\t\t\tthis.dispatchEvent(new DashboardEvent('movestart', {item: this, model: this.model}));\n\t\t}\n\t};\n\n\t_onMouseMove = (e: MouseEvent) => {\n\t\tconst scrollOffset = this._parent.scrollOffset;\n\t\tdom.setPosition(this, {\n\t\t\tl: this._elementOffset.left + e.clientX - this._movingOffset.left,\n\t\t\tt: this._elementOffset.top + e.clientY - this._movingOffset.top + scrollOffset,   \n\t\t});\n\t\tthis.dispatchEvent(new DashboardEvent('move', {item: this, model: this.model}));\n\t};\n\n\t_onMouseResize = (e: MouseEvent) => {\n\t\tthis._lastMouseEvent = e;\n\t\tthis._applyResize(e.clientX, e.clientY);\n\t};\n\n\t/** Re-trigger resize calculation with current scroll offset (called from autoscroll interval) */\n\tupdateResize() {\n\t\tif (this._lastMouseEvent) {\n\t\t\tthis._applyResize(this._lastMouseEvent.clientX, this._lastMouseEvent.clientY);\n\t\t}\n\t}\n\n\tprivate _applyResize(clientX: number, clientY: number) {\n\t\tconst scrollDelta = this._parent.scrollOffset - this._initialScrollOffset;\n\t\tconst deltaX = clientX - this._movingOffset.left;\n\t\tconst deltaY = clientY - this._movingOffset.top + scrollDelta;\n\n\t\tconst newWidth = Math.max(50, this._initialSize.width + deltaX);\n\t\tconst newHeight = Math.max(50, this._initialSize.height + deltaY);\n\n\t\tdom.setSize(this, { w: newWidth, h: newHeight });\n\t\tthis.dispatchEvent(new DashboardEvent('resize', {item: this, model: this.model}));\n\t}\n\n\t_onResize = () => {\n\t\tthis.dispatchEvent(new DashboardEvent('resize', {item: this, model: this.model}));\n\t};\n\n\tasync layout() {\n\t\tconst c = await this.component;\n\t\tif (c?.layout) c.layout();\n\t}\n\n\tshowOverlay(text: string = null, loader: boolean = false) {\n\t\tthis.overlay.text = text;\n\t\tthis.overlay.defaultLoader = loader;\n\t\tconst opacity = this.model.model.options.overlay?.opacity ?? 1;\n\t\tthis.overlay.style.opacity = opacity.toString();\n\t\tthis.overlay.show(this);\n\t\tif (opacity >= 1) dom.hideElement(this.container);\n\t}\n\n\thideOverlay() {\n\t\tthis.overlay.hide();\n\t\tdom.showElement(this.container);\n\t}\n\n\tasync updated() {\n\t\tthis.showOverlay(this.designMode ? this.model.title : null);\n\t\tconst component = await this.component;\n\t\tif (component) {\n\t\t\tdom.empty(this.container);\n\t\t\tthis.container.appendChild(component);\n\t\t}\n\t\t\t\n\t\tif (this.designMode) {\n\t\t\tthis.showOverlay(this.model.title, false);\n\t\t} else {\n\t\t\tthis.hideOverlay();\n\t\t}\n\t\t\n\t}\n\n\trender = () => html`\n\t\t<div class=\"container\"></div>\n\t\t<og-overlay></og-overlay>\n\t`;\n\n}"]}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@omegagrid/dashboard",
-  "version": "0.9.46",
+  "version": "0.9.48",
   "license": "UNLICENSED",
   "description": "Dashboard component",
   "main": "./dist/index.js",
@@ -28,8 +28,8 @@
   },
   "dependencies": {
     "@fortawesome/fontawesome-svg-core": "^7.0.1",
-    "@omegagrid/core": "^0.9.46",
-    "@omegagrid/localize": "^0.9.46",
+    "@omegagrid/core": "^0.9.48",
+    "@omegagrid/localize": "^0.9.48",
     "date-fns": "^3.2.0",
     "lit": "^3.1.1",
     "ts-debounce": "^4.0.0"