Server Error When Custom Breakpoint with Associated Custom CSS is Deleted

[ectu]

Description

When a custom breakpoint is deleted, and elements have Custom CSS defined specifically for that breakpoint (via Advanced > Custom CSS), the page cannot be saved. Attempting to save results in a "Your server returned a 500 error" message.

To resolve the issue, affected elements must be identified, and the Custom CSS must be manually removed. This process is time-consuming, and all Custom CSS for other breakpoints is lost in the process. Ideally, deleting a custom breakpoint should automatically remove associated Custom CSS to prevent the issue.

Steps to Reproduce

1. Set up a WordPress installation with Breakdance installed and activated.
2. Add a custom breakpoint under Preferences > Breakpoints (e.g., 1200px).
3. Create a page using the Breakdance editor.
4. Add an element (e.g., "Text") and navigate to Advanced > Custom CSS.
5. Add CSS code for the custom breakpoint > Save Page
6. Delete the custom breakpoint from the Preferences > Breakpoints menu.
7. Attempt to save the page.

Expected Behavior

The page should save without errors, and any Custom CSS targeting the deleted breakpoint should either:

1. Be automatically removed
2. Prompt the user to confirm its removal or reassignment.
3. Optionally, warn the user about the implications of deleting the breakpoint and provide a preview of the impacted elements or CSS.

This issue disrupts the workflow and may lead to data loss (Custom CSS) for valid breakpoints.
It can be difficult to locate elements with Custom CSS tied to the deleted breakpoint, especially on larger pages.

Environment

WordPress Version: 6.7.1
Breakdance Version: 2.2
PHP Version: 8.3
Browser: Safari (18)