Resubscribe Vue SDK

The official Svelte SDK for Resubscribe.

Setup

Add the component and then trigger the Resubscribe modal with the openWithConsent method. Replace the placeholders with your own values.

<script lang="ts">
import Resubscribe from 'resubscribe-svelte-sdk'

const onTrigger = () => {
    Resubscribe.openWithConsent({
        slug: '{organization-slug}',
        apiKey: '{api-key}',
        aiType: '{ai-type}',
        userId: '{uid}',
        userEmail: '{optionalEmail}',
        colors: {
            primary: '#31B15F',
            background: '#fff',
            text: '#333',
        },
    })
}
</script>

<div>
    ...
    <Resubscribe.Component />
</div>

Headless

You can alternatively use the headless version of the SDK.

<script lang="ts">
import Resubscribe from 'resubscribe-svelte-sdk'

const handleClick = () => {
    Resubscribe.headless.setOptions({
        slug: '{organization-slug}',
        apiKey: '{api-key}',
        aiType: '{ai-type}',
        userId: '{uid}',
        userEmail: '{optionalEmail}',
    });
    Resubscribe.headless.registerConsentRequest();
    // Open your own consent modal here 👇
    const confirmed = await confirm(...);

    if (confirmed) {
        Resubscribe.headless.openChat({
            onClose: (via) => {
                console.log('onClose', via);
            },
        });
    }
}
</script>

<div>
    ...
    <Resubscribe.Component />
</div>