Vue 3

import { createApp } from "vue";
import App from "./App.vue";
 
const analytics = document.createElement("script");
analytics.src = "https://api.rooster.host/analytics/YOUR_PUBLIC_KEY.js";
analytics.defer = true;
document.head.appendChild(analytics);
 
createApp(App).mount("#app");

const collector = document.createElement("script");
collector.src = "https://rooster.ink/embed/YOUR_PUBLIC_KEY.js";
collector.defer = true;
document.head.appendChild(collector);

<script setup lang="ts">
import { onMounted, onUnmounted } from "vue";
 
let script: HTMLScriptElement | undefined;
 
onMounted(() => {
  script = document.createElement("script");
  script.src = "https://rooster.ink/embed/YOUR_PUBLIC_KEY.js";
  script.defer = true;
  script.dataset.roosterForm = "support";
  document.head.appendChild(script);
});
 
onUnmounted(() => script?.remove());
</script>
 
<template>
  <form data-rooster-form="support">
    <input name="email" type="email" required />
    <textarea name="message" required />
    <button type="submit">Send</button>
  </form>
</template>

<script setup lang="ts">
import { onMounted, onUnmounted, ref } from "vue";
 
const step = ref(1);
let script: HTMLScriptElement | undefined;
 
onMounted(() => {
  script = document.createElement("script");
  script.src = "https://rooster.ink/embed/YOUR_PUBLIC_KEY.js";
  script.defer = true;
  script.dataset.roosterForm = "sales";
  document.head.appendChild(script);
});
 
onUnmounted(() => script?.remove());
</script>
 
<template>
  <form data-rooster-form="sales">
    <section v-if="step === 1">
      <input name="work_email" type="email" required />
      <button type="button" data-rooster-continue @click="step = 2">Next</button>
    </section>
 
    <section v-if="step === 2">
      <input name="budget" type="text" />
      <button type="button" data-rooster-continue @click="step = 3">Next</button>
    </section>
 
    <section v-if="step === 3">
      <textarea name="project_notes" />
      <button type="submit" data-rooster-continue data-rooster-final="true">Submit</button>
    </section>
  </form>
</template>