@reloop-sdk/vue

npm install @reloop-sdk/core @reloop-sdk/vue

Plugin

import { createApp } from "vue";
import { ReloopPlugin, FeedbackWidget } from "@reloop-sdk/vue";
import App from "./App.vue";

const app = createApp(App);
app.use(ReloopPlugin, {
  apiKey: "rl_pub_...",
  endpoint: "https://feedback.example.com",
});
app.component("FeedbackWidget", FeedbackWidget);
app.mount("#app");

You can also pass a pre-built client instead of options.

useFeedback()

<script setup lang="ts">
import { useFeedback } from "@reloop-sdk/vue";

const { submit, status, error } = useFeedback();
</script>

<template>
  <button :disabled="status === 'submitting'"
          @click="submit({ type: 'idea', message: 'Add dark mode' })">
    {{ status === "submitting" ? "Sending…" : "Send idea" }}
  </button>
</template>

useReloop()

Returns the underlying @reloop-sdk/core client, e.g. for identify():

import { useReloop } from "@reloop-sdk/vue";

const reloop = useReloop();
reloop.identify({ id: user.id, email: user.email });

FeedbackWidget

Drop-in floating widget. Props: title (string), position ("bottom-right" | "bottom-left").