I have been trying to integrate cal.com into a SvelteKit website, but I am facing difficulties implementing it using vanilla JavaScript as per the official documentation.
While following the instructions provided for vanilla JavaScript, I had success with the version for Next.js, but I seem to be encountering issues with Svelte.
The last line Cal("init") is causing an error stating "Cannot find name 'Cal'." Additionally, when checked on the server, it shows a "500 Internal Error."
<script>
(function (C, A, L) {
let p = function (a, ar) {
a.q.push(ar);
};
let d = C.document;
C.Cal =
C.Cal ||
function () {
let cal = C.Cal;
let ar = arguments;
if (!cal.loaded) {
cal.ns = {};
cal.q = cal.q || [];
d.head.appendChild(d.createElement("script")).src = A;
cal.loaded = true;
}
if (ar[0] === L) {
const api = function () {
p(api, arguments);
};
const namespace = ar[1];
api.q = api.q || [];
typeof namespace === "string" ? (cal.ns[namespace] = api) && p(api, ar) : p(cal, ar);
return;
}
p(cal, ar);
};
})(window, "https://cal.com/embed.js", "init");
Cal("init")
</script>