React, Next.js, Vue and others

<script src="https://api.paperlinkai.com/widget.js" async></script>

import { useEffect } from 'react';

export function PaperlinkWidget() {
  useEffect(() => {
    let chat: PaperlinkAI.ChatInstance | undefined;
    let unmounted = false;

    window.PaperlinkAIChatQueue = window.PaperlinkAIChatQueue || [];
    window.PaperlinkAIChatQueue.push((PaperlinkAIChat) => {
      if (!unmounted) chat = PaperlinkAIChat.init({ apiKey: 'pl_live_...' });
    });

    return () => {
      unmounted = true;
      chat?.destroy();
    };
  }, []);

  return null;
}

<script src="https://api.paperlinkai.com/widget.js" async></script>

<script setup lang="ts">
import { onMounted, onUnmounted } from 'vue';

let chat: PaperlinkAI.ChatInstance | undefined;
let unmounted = false;

onMounted(() => {
  window.PaperlinkAIChatQueue = window.PaperlinkAIChatQueue || [];
  window.PaperlinkAIChatQueue.push((PaperlinkAIChat) => {
    if (!unmounted) chat = PaperlinkAIChat.init({ apiKey: 'pl_live_...' });
  });
});

onUnmounted(() => {
  unmounted = true;
  chat?.destroy();
});
</script>

<template></template>

<script src="https://api.paperlinkai.com/widget.js" data-api-key="YOUR_API_KEY" async></script>