[FIX] web_editor: fix shape flipping

This commit fixes an issue that causes thin spacing to appear between
two snippets containing shapes. This bug had already been fixed in this
commit [1] but the theme snippets have not been adapted to the changes.

With this commit, the shapes of theme snippets are automatically adapted
when they are dropped on the page.

Steps to reproduce the bug:

- Choose the "Clean Theme" for a website.
- Drag and drop a "Call to action" snippet on the page.
- Drag and drop a "Text" snippet with a dark background before it.
- Resize the window to change the window width.
- At some points, the gap will appear.

[1]: https://github.com/odoo/odoo/commit/42b3ad10e0b32b7fc72f801e2c67d6baf938c566

task-2824607
opw-3069213
opw-3057533

closes odoo/odoo#115004

X-original-commit: 256ff539afe331544ccb58848f1ecd0eecbe4daa
Signed-off-by: Quentin Smetz (qsm) <qsm@odoo.com>

addons/web_editor/static/src/js/editor/snippets.options.js

@@ -6821,6 +6821,18 @@ registry.BackgroundShape = SnippetOptionWidget.extend({
         }
         return this._super.apply(this, arguments);
     },
+    /**
+     * @override
+     */
+    onBuilt() {
+        // Flip classes should no longer be used but are still present in some
+        // theme snippets.
+        if (this.$target[0].querySelector('.o_we_flip_x, .o_we_flip_y')) {
+            this._handlePreviewState(false, () => {
+                return {flip: this._getShapeData().flip};
+            });
+        }
+    },
 
     //--------------------------------------------------------------------------
     // Options