FloatingActionButtons

defaultSide is the edge the group starts snapped to when you let it manage its own position. Drag the pill by its grip — or by any empty space in it — towards another edge of the box and it snaps to whichever is nearest, switching between a horizontal and a vertical layout as it crosses. defaultSide is only the starting point, so it's ignored the moment you pass position.

position takes the side away from the component and puts it in your hands. Pass it — with v-model:position if you also want dragging to write back — and the group sits where you say; omit it and the group keeps its own side internally, starting from defaultSide. Useful when the edge has to follow something else on the page, like a panel that opens on the right.

handle shows the drag grip at the end of the pill. Turning it off doesn't stop the group being dragged — empty space and the buttons themselves still work — it only removes the affordance that says so, which is worth doing when the grip would be the widest thing in a two-button group.

draggable is the one that actually pins the group down. Set it to false and the pill stays on the side it was given, grip and all gestures inert — the right setting for a toolbar whose position is part of the layout rather than a preference.

margin is the distance in pixels kept between the group and the edge of its bounds, whether that's the viewport or a container you named.

container confines the group to one element's box instead of the viewport. Pass a template ref: dragging, snapping and margin are all measured against that element, which is what every preview on this page does — without it the pill would be position: fixed and drag across the whole page.