Demo / Plugins/ Base / Resize
npm package:
@omnigrid/resize-pluginResizable columns
Drag the thin handle on a header cell to resize it. Double-click a header to auto-fit the column to the widest visible value.
Resizable pinned columns
ID and Category are pinned left, the price columns are pinned right — the pinned panes stay in place while the centre scrolls. Dragging a handle resizes the column inside its pane and the pane width follows. Right-pinned columns expose their resize handle on the left edge instead of the right one.
Resizable grouped columns
Headers are stacked: Product, Warehouse and Pricing are group headers that span their children across a second header row. Resize handles are attached to leaf columns only — drag a leaf handle and the group header above it narrows/widens together with its children. Double-click a leaf header to auto-fit it within the group.
Resize events
The resize plugin exposes
onResizeStart, onResize and onResizeEnd callbacks. Drag any resizable column header to fire events — each line below is a single event, showing the column id and its new pixel width.No resize events yet — drag a header handle.