Skip to main content
Glama

gridstack_resize_widget

Resize dashboard widgets by specifying new width and height dimensions to adjust layout elements dynamically.

Instructions

Resize a widget

Input Schema

TableJSON Schema
NameRequiredDescriptionDefault
elYesWidget selector or ID to resize
widthNoNew width in columns
heightNoNew height in rows

Implementation Reference

  • Main handler function that executes the tool logic: extracts parameters, generates the GridStack 'grid.resize()' code snippet, and formats response via utility.
    private async resizeWidget(params: ResizeWidgetParams): Promise<string> { const { el, width, height } = params; return this.utils.generateGridStackCode("resizeWidget", { element: el, size: { width, height }, code: `grid.resize('${String(el)}', ${width}, ${height});`, }); }
  • Tool registration entry in GridStackTools.listTools() array, defining name, description, and input schema for MCP tool discovery.
    { name: "gridstack_resize_widget", description: "Resize a widget", inputSchema: { type: "object", required: ["el"], properties: { el: { type: "string", description: "Widget selector or ID to resize", }, width: { type: "number", description: "New width in columns", }, height: { type: "number", description: "New height in rows", }, }, }, },
  • Type definition for tool input parameters, used for TypeScript typing and parameter destructuring in handler.
    export interface ResizeWidgetParams { el: string | HTMLElement; width?: number; height?: number; }
  • Dispatch case in GridStackTools.callTool() switch statement that routes tool calls to the resizeWidget handler.
    case "gridstack_resize_widget": return this.resizeWidget(args as ResizeWidgetParams);
  • Utility method called by handler to format the response with code snippet, parameters, description, example, and notes for the resize operation.
    generateGridStackCode(operation: string, params: any): string { const result: GridStackCodeResult = { operation, parameters: params, code: params.code || "", description: this.getOperationDescription(operation), example: this.getOperationExample(operation), notes: this.getOperationNotes(operation), }; return this.formatResponse(result); }

Latest Blog Posts

MCP directory API

We provide all the information about MCP servers via our MCP API.

curl -X GET 'https://glama.ai/api/mcp/v1/servers/raghavsharma-simpplr/gridstack-mcp-server'

If you have feedback or need assistance with the MCP directory API, please join our Discord server