Fixes #11

- Fix dashboard draggin: introduced sophistaced drag handle
- Fix disappearing of charts when dragged inside a dashboard widget

src/main/java/com/example/components/GridStackItem.java

@@ -9,10 +9,19 @@ import java.util.UUID;
  * A single cell inside a {@link GridStackLayout}. Position/size are written as
  * {@code gs-*} attributes, which is how gridstack.js reads a widget's initial
  * placement when {@code makeWidget} converts it client-side (see grid-stack.ts).
+ * <p>
+ * Dragging starts from the grip handle only, never from the item body, so the
+ * components inside an item stay interactive (see
+ * {@link GridStackLayout#setDragHandle(String)}).
  */
 public class GridStackItem extends Div {
 
+    /** Selector gridstack is told to treat as the drag handle — see
+     *  {@link GridStackLayout}'s {@code handle} option. */
+    public static final String DRAG_HANDLE_CLASS = "dialect-drag-handle";
+
     private final Div content = new Div();
+    private final Div dragHandle = new Div();
 
     public GridStackItem(Component... content) {
         this(UUID.randomUUID().toString(), 0, 0, 4, 3, content);
@@ -33,6 +42,15 @@ public class GridStackItem extends Div {
         // own child.
         getElement().appendChild(this.content.getElement());
         this.content.add(content);
+
+        // Sibling of the content wrapper, not a child of it: the wrapper is
+        // `overflow: auto`, so a handle inside it would scroll out of view.
+        dragHandle.addClassName(DRAG_HANDLE_CLASS);
+        dragHandle.add(Fa.DRAG.create());
+        String label = getTranslation("gridstack.dragHandle");
+        dragHandle.getElement().setAttribute("title", label);
+        dragHandle.getElement().setAttribute("aria-label", label);
+        getElement().appendChild(dragHandle.getElement());
     }
 
     public void add(Component... components) {
@@ -52,11 +70,20 @@ public class GridStackItem extends Div {
         return this;
     }
 
+    /** Also hides the grip handle when {@code false} — the {@code gs-no-move}
+     *  attribute written here is what {@code styles.css} keys the handle's
+     *  visibility off. */
     public GridStackItem setMovable(boolean movable) {
         setBooleanAttribute("gs-no-move", !movable);
         return this;
     }
 
+    /** The element gridstack drags the item by. Exposed so callers can restyle
+     *  or reposition it; removing it from the DOM makes the item immovable. */
+    public Div getDragHandle() {
+        return dragHandle;
+    }
+
     /** Writes an explicit "true" (gridstack reads this via its own
      *  {@code Utils.toBool}) or removes the attribute — avoids relying on
      *  Vaadin's HTML5 empty-string boolean-attribute convention, which