Files
calendar/packages/embeds/embed-react/floating.tsx
4f69c0e502 fix: Namespaced react embeds not working with Floating and Element Click Popups (#13386)
* Fix embed queue

* Fix getCalApi namespace use

* Fixes

* Add more e2e

* Fix test

* Fix syntax error in generated code

* Make getCalApi argument optional

* Fix types

* Add more namespacing tests

---------

Co-authored-by: Joe Au-Yeung <65426560+joeauyeung@users.noreply.github.com>
2024-04-18 14:41:39 +05:30

31 lines
858 B
TypeScript

/**
* @fileoverview This file is an example file and tells how to use floating popup button in a React application. This is also used by playwright e2e
*/
import { useEffect } from "react";
import * as React from "react";
import ReactDom from "react-dom";
import { getCalApi } from "./src/index";
function App() {
useEffect(() => {
(async function () {
const cal = await getCalApi({
namespace: "floating",
embedJsUrl: "http://localhost:3000/embed/embed.js",
});
cal("floatingButton", {
calLink: "pro",
calOrigin: "http://localhost:3000",
config: {
theme: "dark",
},
});
cal("ui", { styles: { branding: { brandColor: "#000000" } }, hideEventTypeDetails: false });
})();
}, []);
return null;
}
ReactDom.render(<App />, document.getElementById("root"));