shadowcat
Simple JS OAuth solutions for Manifold UI
Usage
React
In a terminal, install @manifoldco/shadowcat for your app:
npm i @manifoldco/shadowcatThen register the web component (we recommend as high up the DOM tree as possible, so it’ll load sooner).
import React, { useEffect, useRef } from "react";
import("@manifoldco/shadowcat/dist/loader").then(({ defineCustomElements }) =>
defineCustomElements(window)
);
const App = () => {
const authRef = useRef(null);
useEffect(() => {
// Fires whenever a token is received
const tokenReceived = detail => {
console.log(detail);
// {
// duration: 1450,
// error: null,
// expiry: 1566565841,
// token: "Hi I'm a super duper secret token!"
// }
};
if (authRef.current) {
authRef.addEventListener("receiveManifoldToken", tokenReceived);
}
}, []);
return (
<>
<Routes />
<manifold-oauth ref={authRef} /> {/* this can be placed anywhere, really, but the sooner it loads the better */}
</>
);
};HTML / JS
<body>
<manifold-auth></manifold-auth>
<script src="https://unpkg.com/@manifoldco/shadowcat/dist/manifold.js"></script>
<script>
document
.querySelector("manifold-oauth")
.addEventListener("receiveManifoldToken", e => {
console.log(e.detail);
// {
// duration: 1450,
// error: null,
// expiry: 1566565841,
// token: "Hi I'm a super duper secret token!"
// }
});
</script>
</body>CDN
In any setup, you can use a CDN for Shadowcat
https://js.cdn.manifold.co/@manifoldco/shadowcat/ # latest (beware of breaking changes!)
https://js.cdn.manifold.co/@manifoldco/shadowcat@0.2.0/ # specific version
Options
OAuth URL
You can change the OAuth URL from Manifold’s default by specifying oauth-url on the custom element:
<manifold-oauth oauth-url="[your-oauth-url]"></manifold-oauth>Links
Code of Conduct | Contribution Guidelines
