@wpic/ui 0.8.7 → 0.8.9

package/CHANGELOG.md

@@ -1,3 +1,12 @@
+## 0.8.9
+
+- WPopover: add `shiftCrossAxis` so preferred-side panels remain inside narrow viewports. Perpendicular overflow is handled by shifting instead of changing sides.
+
+## 0.8.8
+
+- Add opt-in automatic placement to WPopover: choose among all four sides, adapt to viewport changes, and shift into view before constraining content height. Existing placement behavior is preserved.
+- Verify automatic panels fit without internal scrolling on desktop and narrow viewports, including reopening and Escape focus restoration.
+
 ## 0.8.7
 
 - Increase WTable header vertical padding from 8px to 12px per side (4px to 6px in compact mode), including selection and expansion columns.

package/COMPONENTS.md

@@ -360,6 +360,10 @@ disabled?: boolean
 
 ## WPopover
 
+Set `autoPlacement` to choose among all four sides with Floating UI. Combine it with `freezePositionOnOpen=false` for panels that must adapt while scrolling or resizing. In this mode, viewport shifting can overlap the anchor when necessary to keep the panel visible; content only scrolls when taller than the viewport. The default placement/flip behavior is unchanged.
+
+For a preferred left-side panel, use `placement="left-start"`, `shiftCrossAxis`, and `freezePositionOnOpen=false` (without `autoPlacement`). It flips right when there is insufficient horizontal space and shifts within the viewport, allowing anchor overlap on narrow screens.
+
 **Import:** `import { WPopover } from '@wpic/ui'`
 
 **Props:**

package/dist/components/WPopover.vue.d.ts

@@ -18,6 +18,10 @@ type __VLS_Props = {
     /** Keep the first computed placement while the panel remains open */
     freezePositionOnOpen?: boolean;
     flip?: boolean;
+    /** Choose the side with most room, allowing overlap when needed to keep content in view. */
+    autoPlacement?: boolean;
+    /** Shift on both axes to keep a preferred side visible, allowing anchor overlap on small screens. */
+    shiftCrossAxis?: boolean;
     zIndex?: string | number;
     /** Extra DOM elements (e.g. Teleport'd submenus) that should not trigger close */
     extraPanels?: (HTMLElement | null)[];