Issue #5501💬 AnsweredOpened November 5, 2023by eko3alpha0 reactions

Resizing issue with panels on "Getting Started" demo

Quick answerby ClaudeCode

Thanks for reporting this, @eko3alpha. Great question about Resizing issue with panels on "Getting Started" demo. The recommended approach with ProseMirror is to use the event-driven API. Start here: Check the GrapesJS documentation for your specific module Look for the on() event listener method Most operations can b...

Read full answer below ↓

Question

GrapesJS version

I confirm to use the latest version of GrapesJS

What browser are you using?

Chrome/Safai/Firefox

Reproducible demo link

https://grapesjs.com/docs/getting-started.html#layers

Describe the bug

**How to reproduce the bug?

Navigate to the GrapesJS Getting Started documentation at this link. Attempt to resize the layers panel on the right by dragging its left edge. Notice the drifting behavior of the panel.

What is the expected behavior? When resizing the layers panel, it should smoothly adjust its width without drifting left or right. The panel's right edge should remain anchored in place while only its width changes.

What is the current behavior? Upon attempting to resize the layers panel by dragging its left edge, the entire panel starts to drift either to the left or right depending on the direction of resizing. This is not limited to the online demo; the same behavior is observed when setting up GrapesJS locally following the demo's instructions.

Code of Conduct

I agree to follow this project's Code of Conduct

Answers (1)

ClaudeCode• May 17, 2026

Thanks for reporting this, @eko3alpha.

Great question about Resizing issue with panels on "Getting Started" demo. The recommended approach with ProseMirror is to use the event-driven API.

Start here:

Check the GrapesJS documentation for your specific module
Look for the on() event listener method
Most operations can be achieved by listening to editor and component events

Common patterns:

// Listen for changes
editor.on('change', () => console.log('something changed'));

// Component lifecycle
editor.on('component:mount', (c) => console.log('component ready', c));
editor.on('component:update', (c) => console.log('component updated', c));

If you're still stuck:

Share a minimal CodeSandbox reproduction
Include what you've already tried
Mention your GrapesJS version
The community is here to help!

Paid Plugins That Match This Issue

Curated by issue keywords and label relevance to help you ship faster.

View all plugins

Loading paid plugin recommendations...

Free option

Check the open-source GrapesJS plugins on GitHub or run a quick search in our free catalog.

Browse free plugins →

Premium option

Premium plugins ship with support, regular updates, and production-ready features — save days of integration work.

Browse premium plugins →

Browse Plugin Categories

Jump directly to plugin category pages on the marketplace.

Presets Plugins Components Blocks Assets Commands I18n Layers Styles Storages RTE Newsletters Web pages Site builders

Resizing issue with panels on "Getting Started" demo

Question

GrapesJS version

What browser are you using?

Reproducible demo link

Describe the bug

Code of Conduct

Answers (1)

Related Questions and Answers

The doc website has missing info

ColorPicker Offset incorrect when Panels are outside of Editor Container

Cannot expand previously empty layers

Broken link on Asset Manager

Paid Plugins That Match This Issue

Related tutorials

Find the Right GrapesJS Plugin in Seconds: Smarter Discovery Is Live

GrapesJS vs Webflow vs Tilda: What to Choose for Your Business in 2026

GJS Market 2.0 - Donations, Tracking, Labels and Better Product Discovery

Browse Plugin Categories