Frameworks
Vue Integration
Integrate CornerCue in Vue with a slot-based feedback trigger component.
Install
npm install @cornercue/vue
Basic usage
<script setup>import { FeedbackButton } from "@cornercue/vue";</script>
<template> <FeedbackButton project-id="YOUR_PROJECT_ID" :user="{ id: 'user_123', email: 'john@example.com' }" :metadata="{ plan: 'pro', version: '2.1.0' }" > <button class="my-feedback-btn">Give Feedback</button> </FeedbackButton></template>Main props
| Prop | Type | Required | Description |
|---|---|---|---|
project-id | string | Yes | CornerCue project ID |
user | UserInfo | null | No | User info (id, username, email) |
metadata | Metadata | null | No | Extra key-value context |
default-type | "bug" | "feature" | "feedback" | No | Skip menu and open direct type |
config | WidgetConfig | No | Widget behavior overrides |
events | WidgetEvents | No | Event callbacks |
Skip type menu
<template> <FeedbackButton project-id="YOUR_PROJECT_ID" default-type="feature"> <button>Request Feature</button> </FeedbackButton></template>Event callbacks
<template> <FeedbackButton project-id="YOUR_PROJECT_ID" :events="{ onOpen: () => console.log('Widget opened'), onClose: () => console.log('Widget closed'), onSubmit: (payload) => console.log('Submitting', payload), onSubmitSuccess: (payload) => console.log('Sent', payload), onSubmitError: (error, payload) => console.error('Failed', error, payload), }" > <button>Feedback</button> </FeedbackButton></template>