Fix the bubble overlay editor with long text (#942)

Author: lukasmasuch

packages/core/src/data-editor/stories/utils.tsx

@@ -730,7 +730,14 @@ Try out [Glide](https://www.glideapps.com/)
             getContent: () => {
                 return {
                     kind: GridCellKind.Bubble,
-                    data: [faker.lorem.word(), faker.lorem.word(), faker.lorem.word()],
+                    data: [
+                        faker.lorem.word(),
+                        faker.lorem.word(),
+                        faker.lorem.word(),
+                        faker.lorem.words(2),
+                        faker.lorem.words(2),
+                        faker.lorem.words(2),
+                    ],
                     allowOverlay: true,
                 };
             },

packages/core/src/internal/data-grid-overlay-editor/private/bubbles-overlay-editor-style.tsx

@@ -7,6 +7,7 @@ export const BubblesOverlayEditorStyle = styled.div`
     flex-wrap: wrap;
     margin-top: auto;
     margin-bottom: auto;
+    overflow: auto;
 
     .boe-bubble {
         display: flex;
@@ -20,6 +21,7 @@ export const BubblesOverlayEditorStyle = styled.div`
         background-color: var(--gdg-bg-bubble);
         color: var(--gdg-text-dark);
         margin: 2px;
+        white-space: nowrap;
     }
 
     textarea {