Skip to main content
The video uses a specific AI coding tool to demonstrate the setup, but the configuration works 1:1 with Cursor, Claude Code, or any other tool. Despia is web framework and tooling agnostic, so the only thing that matters is the SDK call with a properly encoded message and URL.
shareapp:// opens the native share sheet pre-populated with a text message and a URL. The user picks a destination (Messages, WhatsApp, Mail, AirDrop, Twitter, LinkedIn, Notes, anything that registered a share extension) and the OS routes the content into that app. Use this for sharing referral links, social posts, snippets of text with a deep link, or anything where you want a single payload of message plus URL going out together. For sharing files (PDFs, images, video, archives), use File Sharing instead. Share Dialog is text-and-URL only.

Installation

npm install despia-native
import despia from 'despia-native';

How it works

Two query parameters: the message text and the URL. The runtime opens the share sheet with both pre-filled. The destination app decides how to render them, some apps combine the message and URL into one block of text, others put them in separate fields.
import despia from 'despia-native'

const isDespia = navigator.userAgent.toLowerCase().includes('despia')

if (isDespia) {
    const message = 'Check out this app'
    const url     = 'https://myapp.com/invite/abc123'

    despia(`shareapp://message?=${encodeURIComponent(message)}&url=${encodeURIComponent(url)}`)
}
Always wrap user-facing strings with encodeURIComponent. Without it, any &, =, or # in your message will break the parser and the share sheet will open with truncated or empty content.

Scheme parameters

ParameterValueNotes
messageThe text to include in the shared payloadWrap with encodeURIComponent. Keep it short, some platforms truncate at 280 characters or less
urlThe URL to attach to the shareWrap with encodeURIComponent. Most platforms generate a preview from the URL’s Open Graph tags, so make sure your link target has good og:title, og:description, and og:image values
function shareWithReferralCode(text, slug, code) {
    if (!isDespia) return

    const message = encodeURIComponent(text)
    const url     = encodeURIComponent(`https://myapp.com/${slug}?ref=${code}`)

    despia(`shareapp://message?=${message}&url=${url}`)
}

shareWithReferralCode('Just hit a 30-day streak on this habit tracker', 'invite', 'user_123')

Share from a button

The natural pattern is a “Share” button next to content that has a public URL. Tap, share sheet opens, user picks where to send it.
import despia from 'despia-native'

const isDespia = navigator.userAgent.toLowerCase().includes('despia')

function ShareButton({ message, url, label = 'Share' }) {
    function share() {
        if (!isDespia) return

        const m = encodeURIComponent(message)
        const u = encodeURIComponent(url)

        despia(`shareapp://message?=${m}&url=${u}`)
    }

    return <button onClick={share}>{label}</button>
}
Use this on referral CTAs, social-share prompts after a milestone, or anywhere you want the user to send something to a friend in their preferred app. The native share sheet beats trying to detect installed apps and rendering custom buttons for each one, since the OS already knows which apps the user has and how they prefer to share.

Browser fallback

In a regular browser the SDK call is a no-op behind the isDespia guard. If you also want to handle web users, fall back to the Web Share API (supported in Safari and most mobile browsers) and to a clipboard copy as a last resort.
async function share(message, url) {
    if (isDespia) {
        despia(`shareapp://message?=${encodeURIComponent(message)}&url=${encodeURIComponent(url)}`)
        return
    }

    if (navigator.share) {
        try {
            await navigator.share({ text: message, url })
        } catch {
            // user cancelled, do nothing
        }
        return
    }

    // last resort, copy to clipboard
    await navigator.clipboard.writeText(`${message} ${url}`)
    alert('Copied to clipboard')
}
The same code now ships from a Despia build, a Safari preview, and a desktop browser without any per-platform branching above this function.

Resources

NPM Package

despia-native