Skip to Content
SDK ReferenceWidget Control

Widget Control

The SDK provides three methods to control the feedback widget’s lifecycle: show(), hide(), and destroy().

show()

Mounts the feedback widget to the DOM and displays the trigger button. The widget is lazy-loaded on first call.

await maestrio.show();

Behavior

  • Lazy loading: The widget code is dynamically imported on the first show() call, keeping the initial bundle small.
  • Prerequisite: Throws a NotIdentifiedError if identify() was not called first.
  • Idempotent: Calling show() multiple times does not create duplicate widgets.

Example: show on button click

document.getElementById("feedback-btn").addEventListener("click", () => {
  maestrio.show();
});

hide()

Closes the widget panel but keeps it mounted in the DOM. The trigger button remains visible.

maestrio.hide();

Behavior

  • If the widget is not mounted, this is a no-op.
  • The widget can be re-opened by the user clicking the trigger button, or by calling show() again.

destroy()

Completely removes the widget from the DOM and cleans up all event listeners.

maestrio.destroy();

Behavior

  • After calling destroy(), you must call show() again to re-mount the widget.
  • The widget will be re-created from scratch (lazy-loaded again).
  • The identified user is preserved — you don’t need to call identify() again.

Example: cleanup in a SPA

// React
useEffect(() => {
  maestrio.show();
  return () => maestrio.destroy();
}, []);
// Vue
onMounted(() => maestrio.show());
onUnmounted(() => maestrio.destroy());

Lifecycle

identify() → show() → [user interacts] → hide() / destroy()
                ↑                              |
                └──────────── show() ←─────────┘
  1. identify() — required before any widget interaction
  2. show() — mounts widget (first time) or re-opens it
  3. hide() — closes panel, trigger stays visible
  4. destroy() — removes everything from the DOM
submitRequest()Configuration