@vscode-elements/elements 2.4.0 → 2.4.1-pre.1

package/dist/vscode-table/ColumnResizeController.js

@@ -0,0 +1,146 @@
+import { percent, px, toPercent, toPx } from '../includes/sizes.js';
+import { calculateColumnWidths } from './calculations.js';
+export class ColumnResizeController {
+    constructor(host) {
+        this._hostWidth = px(0);
+        this._hostX = px(0);
+        this._activeSplitter = null;
+        this._columnMinWidths = new Map();
+        this._columnWidths = [];
+        this._dragState = null;
+        this._cachedSplitterPositions = null;
+        (this._host = host).addController(this);
+    }
+    hostConnected() {
+        this.saveHostDimensions();
+    }
+    get isDragging() {
+        return this._dragState !== null;
+    }
+    get splitterPositions() {
+        if (this._cachedSplitterPositions) {
+            return this._cachedSplitterPositions;
+        }
+        const result = [];
+        let acc = percent(0);
+        for (let i = 0; i < this._columnWidths.length - 1; i++) {
+            acc = percent(acc + this._columnWidths[i]);
+            result.push(acc);
+        }
+        this._cachedSplitterPositions = result;
+        return result;
+    }
+    getActiveSplitterCalculatedPosition() {
+        const splitterPositions = this.splitterPositions;
+        if (!this._dragState) {
+            return px(0);
+        }
+        const activeSplitterPos = splitterPositions[this._dragState.splitterIndex];
+        const activeSplitterPosPx = this._toPx(activeSplitterPos);
+        return activeSplitterPosPx;
+    }
+    get columnWidths() {
+        return this._columnWidths;
+    }
+    get columnMinWidths() {
+        return new Map(this._columnMinWidths);
+    }
+    saveHostDimensions() {
+        const cr = this._host.getBoundingClientRect();
+        const { width, x } = cr;
+        this._hostWidth = px(width);
+        this._hostX = px(x);
+        return this;
+    }
+    setActiveSplitter(splitter) {
+        this._activeSplitter = splitter;
+        return this;
+    }
+    getActiveSplitter() {
+        return this._activeSplitter;
+    }
+    setColumnMinWidthAt(colIndex, value) {
+        this._columnMinWidths.set(colIndex, value);
+        this._host.requestUpdate();
+        return this;
+    }
+    setColumWidths(widths) {
+        this._columnWidths = widths;
+        this._cachedSplitterPositions = null;
+        this._host.requestUpdate();
+        return this;
+    }
+    shouldDrag(event) {
+        return (+event.currentTarget.dataset.index ===
+            this._dragState?.splitterIndex);
+    }
+    startDrag(event) {
+        event.stopPropagation();
+        if (this._dragState) {
+            return;
+        }
+        this._activeSplitter?.setPointerCapture(event.pointerId);
+        const mouseX = event.pageX;
+        const splitter = event.currentTarget;
+        const splitterX = splitter.getBoundingClientRect().x;
+        const xOffset = px(mouseX - splitterX);
+        this._dragState = {
+            dragOffset: px(xOffset),
+            pointerId: event.pointerId,
+            splitterIndex: +splitter.dataset.index,
+            prevX: px(mouseX - xOffset),
+        };
+        this._host.requestUpdate();
+    }
+    drag(event) {
+        event.stopPropagation();
+        if (!event?.currentTarget?.hasPointerCapture?.(event.pointerId)) {
+            return;
+        }
+        if (!this._dragState) {
+            return;
+        }
+        if (event.pointerId !== this._dragState.pointerId) {
+            return;
+        }
+        if (!this.shouldDrag(event)) {
+            return;
+        }
+        const mouseX = event.pageX;
+        const x = px(mouseX - this._dragState.dragOffset);
+        const deltaPx = px(x - this._dragState.prevX);
+        const delta = this._toPercent(deltaPx);
+        this._dragState.prevX = x;
+        const splitterPos = this.getActiveSplitterCalculatedPosition();
+        if ((deltaPx <= 0 && mouseX > splitterPos + this._hostX) ||
+            (deltaPx > 0 && mouseX < splitterPos + this._hostX)) {
+            return;
+        }
+        this._columnWidths = calculateColumnWidths(this._columnWidths, this._dragState.splitterIndex, delta, this._columnMinWidths);
+        this._cachedSplitterPositions = null;
+        this._host.requestUpdate();
+    }
+    stopDrag(event) {
+        event.stopPropagation();
+        if (!this._dragState) {
+            return;
+        }
+        const el = event.currentTarget;
+        try {
+            el.releasePointerCapture(this._dragState.pointerId);
+        }
+        catch (e) {
+            // ignore
+        }
+        this._dragState = null;
+        this._activeSplitter = null;
+        this._host.requestUpdate();
+    }
+    _toPercent(px) {
+        return toPercent(px, this._hostWidth);
+    }
+    _toPx(percent) {
+        return toPx(percent, this._hostWidth);
+    }
+}
+//# sourceMappingURL=ColumnResizeController.js.map

package/dist/vscode-table/ColumnResizeController.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ColumnResizeController.js","sourceRoot":"","sources":["../../src/vscode-table/ColumnResizeController.ts"],"names":[],"mappings":"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","sourcesContent":["import {ReactiveController} from 'lit';\nimport {type VscodeTable} from './vscode-table.js';\nimport {Percent, percent, Px, px, toPercent, toPx} from '../includes/sizes.js';\nimport {calculateColumnWidths} from './calculations.js';\n\ntype SplitterElement = HTMLDivElement & {\n  dataset: DOMStringMap & {\n    index: string;\n  };\n};\n\nexport class ColumnResizeController implements ReactiveController {\n  private _host: VscodeTable;\n  private _hostWidth = px(0);\n  private _hostX = px(0);\n  private _activeSplitter: SplitterElement | null = null;\n  private _columnMinWidths = new Map<number, Percent>();\n  private _columnWidths: Percent[] = [];\n  private _dragState: {\n    splitterIndex: number;\n    pointerId: number;\n    prevX: Px;\n    dragOffset: Px;\n  } | null = null;\n  private _cachedSplitterPositions: Percent[] | null = null;\n\n  constructor(host: VscodeTable) {\n    (this._host = host).addController(this);\n  }\n\n  hostConnected(): void {\n    this.saveHostDimensions();\n  }\n\n  get isDragging(): boolean {\n    return this._dragState !== null;\n  }\n\n  get splitterPositions(): Percent[] {\n    if (this._cachedSplitterPositions) {\n      return this._cachedSplitterPositions;\n    }\n\n    const result: Percent[] = [];\n\n    let acc = percent(0);\n\n    for (let i = 0; i < this._columnWidths.length - 1; i++) {\n      acc = percent(acc + this._columnWidths[i]);\n      result.push(acc);\n    }\n\n    this._cachedSplitterPositions = result;\n\n    return result;\n  }\n\n  getActiveSplitterCalculatedPosition() {\n    const splitterPositions = this.splitterPositions;\n\n    if (!this._dragState) {\n      return px(0);\n    }\n\n    const activeSplitterPos = splitterPositions[this._dragState.splitterIndex];\n    const activeSplitterPosPx = this._toPx(activeSplitterPos);\n\n    return activeSplitterPosPx;\n  }\n\n  get columnWidths() {\n    return this._columnWidths;\n  }\n\n  get columnMinWidths() {\n    return new Map(this._columnMinWidths);\n  }\n\n  saveHostDimensions() {\n    const cr = this._host.getBoundingClientRect();\n    const {width, x} = cr;\n    this._hostWidth = px(width);\n    this._hostX = px(x);\n    return this;\n  }\n\n  setActiveSplitter(splitter: HTMLElement) {\n    this._activeSplitter = splitter as SplitterElement;\n    return this;\n  }\n\n  getActiveSplitter() {\n    return this._activeSplitter;\n  }\n\n  setColumnMinWidthAt(colIndex: number, value: Percent) {\n    this._columnMinWidths.set(colIndex, value);\n    this._host.requestUpdate();\n    return this;\n  }\n\n  setColumWidths(widths: Percent[]) {\n    this._columnWidths = widths;\n    this._cachedSplitterPositions = null;\n    this._host.requestUpdate();\n    return this;\n  }\n\n  shouldDrag(event: PointerEvent) {\n    return (\n      +(event.currentTarget as SplitterElement).dataset.index ===\n      this._dragState?.splitterIndex\n    );\n  }\n\n  startDrag(event: PointerEvent) {\n    event.stopPropagation();\n\n    if (this._dragState) {\n      return;\n    }\n\n    this._activeSplitter?.setPointerCapture(event.pointerId);\n\n    const mouseX = event.pageX;\n    const splitter = event.currentTarget as SplitterElement;\n    const splitterX = splitter!.getBoundingClientRect().x;\n    const xOffset = px(mouseX - splitterX);\n\n    this._dragState = {\n      dragOffset: px(xOffset),\n      pointerId: event.pointerId,\n      splitterIndex: +splitter.dataset.index,\n      prevX: px(mouseX - xOffset),\n    };\n\n    this._host.requestUpdate();\n  }\n\n  drag(event: PointerEvent) {\n    event.stopPropagation();\n\n    if (\n      !(event?.currentTarget as SplitterElement)?.hasPointerCapture?.(\n        event.pointerId\n      )\n    ) {\n      return;\n    }\n\n    if (!this._dragState) {\n      return;\n    }\n\n    if (event.pointerId !== this._dragState.pointerId) {\n      return;\n    }\n\n    if (!this.shouldDrag(event)) {\n      return;\n    }\n\n    const mouseX = event.pageX;\n    const x = px(mouseX - this._dragState.dragOffset);\n    const deltaPx = px(x - this._dragState.prevX);\n    const delta = this._toPercent(deltaPx);\n    this._dragState.prevX = x;\n\n    const splitterPos = this.getActiveSplitterCalculatedPosition();\n\n    if (\n      (deltaPx <= 0 && mouseX > splitterPos + this._hostX) ||\n      (deltaPx > 0 && mouseX < splitterPos + this._hostX)\n    ) {\n      return;\n    }\n\n    this._columnWidths = calculateColumnWidths(\n      this._columnWidths,\n      this._dragState.splitterIndex,\n      delta,\n      this._columnMinWidths\n    );\n    this._cachedSplitterPositions = null;\n\n    this._host.requestUpdate();\n  }\n\n  stopDrag(event: PointerEvent) {\n    event.stopPropagation();\n\n    if (!this._dragState) {\n      return;\n    }\n\n    const el = event.currentTarget as SplitterElement;\n\n    try {\n      el.releasePointerCapture(this._dragState.pointerId);\n    } catch (e) {\n      // ignore\n    }\n\n    this._dragState = null;\n    this._activeSplitter = null;\n    this._host.requestUpdate();\n  }\n\n  private _toPercent(px: Px) {\n    return toPercent(px, this._hostWidth);\n  }\n\n  private _toPx(percent: Percent) {\n    return toPx(percent, this._hostWidth);\n  }\n}\n"]}

package/dist/vscode-table/calculations.d.ts

@@ -0,0 +1,3 @@
+import { Percent } from '../includes/sizes.js';
+export declare function calculateColumnWidths(widths: Percent[], splitterIndex: number, delta: Percent, minWidths: Map<number, Percent>): Percent[];
+//# sourceMappingURL=calculations.d.ts.map

package/dist/vscode-table/calculations.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"calculations.d.ts","sourceRoot":"","sources":["../../src/vscode-table/calculations.ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,OAAO,EAAU,MAAM,sBAAsB,CAAC;AAEtD,wBAAgB,qBAAqB,CACnC,MAAM,EAAE,OAAO,EAAE,EACjB,aAAa,EAAE,MAAM,EACrB,KAAK,EAAE,OAAO,EACd,SAAS,EAAE,GAAG,CAAC,MAAM,EAAE,OAAO,CAAC,GAC9B,OAAO,EAAE,CAmEX"}

package/dist/vscode-table/calculations.js

@@ -0,0 +1,54 @@
+import { percent } from '../includes/sizes.js';
+export function calculateColumnWidths(widths, splitterIndex, delta, minWidths) {
+    const result = [...widths];
+    // No-op for invalid splitter position or zero delta
+    if (delta === 0 || splitterIndex < 0 || splitterIndex >= widths.length - 1) {
+        return result;
+    }
+    const absDelta = Math.abs(delta);
+    let remaining = percent(absDelta);
+    const leftIndices = [];
+    const rightIndices = [];
+    // Collect column indices to the left of the splitter (inclusive)
+    for (let i = splitterIndex; i >= 0; i--) {
+        leftIndices.push(i);
+    }
+    // Collect column indices to the right of the splitter
+    for (let i = splitterIndex + 1; i < widths.length; i++) {
+        rightIndices.push(i);
+    }
+    // One side shrinks, the other grows depending on drag direction
+    const shrinkingSide = delta > 0 ? rightIndices : leftIndices;
+    const growingSide = delta > 0 ? leftIndices : rightIndices;
+    // Calculate total shrinkable space respecting minWidth
+    let totalAvailable = percent(0);
+    for (const i of shrinkingSide) {
+        const available = Math.max(0, result[i] - (minWidths.get(i) ?? 0));
+        totalAvailable = percent(totalAvailable + available);
+    }
+    // Abort if the requested delta cannot be fully satisfied
+    if (totalAvailable < remaining) {
+        return result;
+    }
+    // Shrink columns sequentially until the delta is fully consumed
+    for (const i of shrinkingSide) {
+        if (remaining === 0) {
+            break;
+        }
+        const available = Math.max(0, result[i] - (minWidths.get(i) ?? 0));
+        const take = Math.min(available, remaining);
+        result[i] = percent(result[i] - take);
+        remaining = percent(remaining - take);
+    }
+    // Apply the exact opposite delta to the growing side
+    let toAdd = percent(absDelta);
+    for (const i of growingSide) {
+        if (toAdd === 0) {
+            break;
+        }
+        result[i] = percent(result[i] + toAdd);
+        toAdd = percent(0); // all growth is applied to the nearest column
+    }
+    return result;
+}
+//# sourceMappingURL=calculations.js.map

package/dist/vscode-table/calculations.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"calculations.js","sourceRoot":"","sources":["../../src/vscode-table/calculations.ts"],"names":[],"mappings":"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","sourcesContent":["import {Percent, percent} from '../includes/sizes.js';\n\nexport function calculateColumnWidths(\n  widths: Percent[],\n  splitterIndex: number,\n  delta: Percent,\n  minWidths: Map<number, Percent>\n): Percent[] {\n  const result = [...widths];\n\n  // No-op for invalid splitter position or zero delta\n  if (delta === 0 || splitterIndex < 0 || splitterIndex >= widths.length - 1) {\n    return result;\n  }\n\n  const absDelta = Math.abs(delta);\n  let remaining: Percent = percent(absDelta);\n\n  const leftIndices: number[] = [];\n  const rightIndices: number[] = [];\n\n  // Collect column indices to the left of the splitter (inclusive)\n  for (let i = splitterIndex; i >= 0; i--) {\n    leftIndices.push(i);\n  }\n\n  // Collect column indices to the right of the splitter\n  for (let i = splitterIndex + 1; i < widths.length; i++) {\n    rightIndices.push(i);\n  }\n\n  // One side shrinks, the other grows depending on drag direction\n  const shrinkingSide = delta > 0 ? rightIndices : leftIndices;\n  const growingSide = delta > 0 ? leftIndices : rightIndices;\n\n  // Calculate total shrinkable space respecting minWidth\n  let totalAvailable: Percent = percent(0);\n\n  for (const i of shrinkingSide) {\n    const available = Math.max(0, result[i] - (minWidths.get(i) ?? 0));\n    totalAvailable = percent(totalAvailable + available);\n  }\n\n  // Abort if the requested delta cannot be fully satisfied\n  if (totalAvailable < remaining) {\n    return result;\n  }\n\n  // Shrink columns sequentially until the delta is fully consumed\n  for (const i of shrinkingSide) {\n    if (remaining === 0) {\n      break;\n    }\n\n    const available = Math.max(0, result[i] - (minWidths.get(i) ?? 0));\n    const take = Math.min(available, remaining);\n\n    result[i] = percent(result[i] - take);\n    remaining = percent(remaining - take);\n  }\n\n  // Apply the exact opposite delta to the growing side\n  let toAdd: Percent = percent(absDelta);\n\n  for (const i of growingSide) {\n    if (toAdd === 0) {\n      break;\n    }\n\n    result[i] = percent(result[i] + toAdd);\n    toAdd = percent(0); // all growth is applied to the nearest column\n  }\n\n  return result;\n}\n"]}

package/dist/vscode-table/vscode-table.d.ts

@@ -1,4 +1,4 @@
-import { TemplateResult } from 'lit';
+import { PropertyValues, TemplateResult } from 'lit';
 import { VscElement } from '../includes/VscElement.js';
 import '../vscode-scrollable/index.js';
 /**
@@ -62,7 +62,6 @@ export declare class VscodeTable extends VscElement {
      * Zebra stripes, odd rows are tinted.
      */
     zebraOdd: boolean;
-    private _bodySlot;
     private _headerElement;
     private _scrollableElement;
     private _sashVisibleElements;
@@ -83,8 +82,6 @@ export declare class VscodeTable extends VscElement {
     private _headerResizeObserver?;
     private _bodyResizeObserver?;
     private _activeSashElementIndex;
-    private _activeSashCursorOffset;
-    private _componentX;
     private _componentH;
     private _componentW;
     /**
@@ -97,14 +94,13 @@ export declare class VscodeTable extends VscElement {
      * It shouldn't be used directly, check the "_getCellsOfFirstRow" function.
      */
     private _cellsOfFirstRow;
-    private _cellsToResize;
-    private _headerCellsToResize;
     private _prevHeaderHeight;
     private _prevComponentHeight;
+    private _columnResizeController;
+    constructor();
     connectedCallback(): void;
     disconnectedCallback(): void;
-    private _px2Percent;
-    private _percent2Px;
+    protected willUpdate(changedProperties: PropertyValues): void;
     private _memoizeComponentDimensions;
     private _queryHeaderCells;
     /**
@@ -121,7 +117,7 @@ export declare class VscodeTable extends VscElement {
     private _componentResizeObserverCallback;
     private _headerResizeObserverCallback;
     private _bodyResizeObserverCallback;
-    private _calcColWidthPercentages;
+    private _calculateInitialColumnWidths;
     private _initHeaderCellSizes;
     private _initBodyColumnSizes;
     private _initSashes;
@@ -130,17 +126,18 @@ export declare class VscodeTable extends VscElement {
     private _applyCompactViewColumnLabels;
     private _clearCompactViewColumnLabels;
     private _toggleCompactView;
+    private _stopDrag;
     private _onDefaultSlotChange;
     private _onHeaderSlotChange;
     private _onBodySlotChange;
     private _onSashMouseOver;
     private _onSashMouseOut;
-    private _onSashMouseDown;
-    private _updateActiveSashPosition;
-    private _getSashPositions;
     private _resizeColumns;
-    private _onResizingMouseMove;
-    private _onResizingMouseUp;
+    private _handleSplitterPointerDown;
+    private _handleSplitterPointerMove;
+    private _handleSplitterPointerUp;
+    private _handleSplitterPointerCancel;
+    private _handleMinColumnWidthChange;
     render(): TemplateResult;
 }
 declare global {

package/dist/vscode-table/vscode-table.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"vscode-table.d.ts","sourceRoot":"","sources":["../../src/vscode-table/vscode-table.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"vscode-table.d.ts","sourceRoot":"","sources":["../../src/vscode-table/vscode-table.ts"],"names":[],"mappings":"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"}