@voyage-sdk/core

Feedback widget SDK for collecting user feedback. Help your users send feedback directly to the maker.

Installation

npm install @voyage-sdk/core

Or via CDN:

<script src="https://unpkg.com/@voyage-sdk/core"></script>

Note: Styles are automatically injected. No CSS import required.

Quick Start

HTML / Vanilla JS

<script src="https://unpkg.com/@voyage-sdk/core"></script>
<script>
  Voyage.init({
    sdkKey: 'your-sdk-key-here'
  })
</script>

React / Next.js

import { useEffect } from 'react'
import Voyage from '@voyage-sdk/core'

function App() {
  useEffect(() => {
    Voyage.init({
      sdkKey: 'your-sdk-key-here'
    })
  }, [])

  return <div>...</div>
}

Vue.js

<script setup>
import { onMounted } from 'vue'
import Voyage from '@voyage-sdk/core'

onMounted(() => {
  Voyage.init({
    sdkKey: 'your-sdk-key-here'
  })
})
</script>

Svelte

<script>
  import { onMount } from 'svelte'
  import Voyage from '@voyage-sdk/core'

  onMount(() => {
    Voyage.init({
      sdkKey: 'your-sdk-key-here'
    })
  })
</script>

Configuration

Voyage.init({
  // Required: Your SDK key from the dashboard
  sdkKey: 'your-sdk-key-here',

  // Optional: Control where the widget appears
  include: ['/dashboard/*', '/app/*'], // Only show on these paths
  exclude: ['/admin/*', '/login']       // Hide on these paths
})

Note: Theme settings (color, position, labels) are configured from the dashboard.

API

Voyage.init(config)

Initialize the SDK with your configuration.

Voyage.show()

Show the feedback widget button.

Voyage.hide()

Hide the feedback widget button.

Voyage.open()

Open the feedback modal.

Voyage.close()

Close the feedback modal.

Voyage.isOpen()

Returns true if the modal is currently open.

Voyage.isVisible()

Returns true if the widget button is visible.

Voyage.destroy()

Remove the widget from the page and clean up.

Voyage.refreshConfig()

Fetch the latest widget configuration from the server.

Path Matching

Use include and exclude to control where the widget appears:

Voyage.init({
  sdkKey: 'your-sdk-key',

  // Widget only appears on paths starting with /app/
  include: ['/app/*'],

  // Or exclude specific paths
  exclude: ['/admin/*', '/checkout']
})

• include takes priority over exclude
• Use /* for wildcard matching (e.g., /admin/* matches /admin/users)
• Exact paths match exactly (e.g., /login only matches /login)

Get Your SDK Key

1. Sign up at morphPRD.io
2. Create a new project
3. Copy your SDK key from the project settings

License

MIT