ReplyPier UI options gallery

One card per placement/behaviour. Stub mode fakes the widget (no backend needed — good for checking the loader UI alone). Real mode loads your actual widget: fill in the widget ID and API URL below.
The loader is loaded from the frontend (npm run dev in frontend/), the same origin the dashboard's embed snippet points at — the backend does not serve it, and no copy is kept in this folder. The loader is a build artifact: after changing its source run cd frontend && npm run build:webclient:prod.

1. Default (zero config)

Legacy behaviour — floating bubble, bottom right. The regression baseline.

2. Floating, left side

Bubble and window hugging the bottom-left corner.

3. Floating, custom size

520 × 700 window instead of the 400 × 560 default.

4. Custom offsets

Launcher lifted 90px — e.g. to clear a fixed bottom nav bar.

5. Sidebar drawer, right

Full-height panel sliding in from the right edge, 460px wide.

6. Sidebar drawer, left

Full-height panel from the left edge, default width.

7. Search bar trigger

The launcher becomes a search-style bar (desktop; bubble on mobile).

8. Hidden launcher + own button

No built-in launcher. Open via the page’s buttons, the trigger selector, data-replypier-open, or the JS API.

9. Custom z-index

Widget at z-index 50 — the page’s fixed overlay (z-index 100) must cover it.

10. Dashboard defaults (stub only)

No page config; the fake widget delivers widget_display as saved in the dashboard’s Widget placement section.

11. Page config beats dashboard (stub only)

Dashboard says 320-wide, left; the page sets width 520. Expect 520 wide, left side, 800 tall.

12. Ask AI palette (⌘K)

Ask Anything/Aurora open as a centered command palette over a dimmed page. Try ⌘K, Esc, and clicking the backdrop. Use Real mode to see the redesigned interior.

13. Drawer + Ask Anything (stub only)

Ask Anything/Aurora draw no in-panel chevron, so the launcher must stay reachable beside the drawer. Every other style hides it while open.

14. Mobile check

Open any card with device emulation / a narrow window: fullscreen chat must win in every mode.