@clerk/clerk-react
Version:
Clerk.dev React library
353 lines • 12.9 kB
JavaScript
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
const utils_1 = require("./utils");
const errors_1 = require("./errors");
class IsomorphicClerk {
constructor(frontendApi, options = {}, Clerk = null) {
this.clerkjs = null;
this.preopenSignIn = null;
this.preopenSignUp = null;
this.premountSignInNodes = new Map();
this.premountSignUpNodes = new Map();
this.premountUserProfileNodes = new Map();
this.premountUserButtonNodes = new Map();
this.premountMethodCalls = new Map();
this._loaded = false;
this.ssrData = null;
this.hydrateClerkJS = async (clerkjs) => {
if (!clerkjs) {
throw new Error('Failed to hydrate latest Clerk JS');
}
this.clerkjs = clerkjs;
this.premountMethodCalls.forEach(cb => cb());
if (this.preopenSignIn !== null) {
clerkjs.openSignIn(this.preopenSignIn);
}
if (this.preopenSignUp !== null) {
clerkjs.openSignUp(this.preopenSignUp);
}
this.premountSignInNodes.forEach((props, node) => {
clerkjs.mountSignIn(node, props);
});
this.premountSignUpNodes.forEach((props, node) => {
clerkjs.mountSignUp(node, props);
});
this.premountUserProfileNodes.forEach((props, node) => {
clerkjs.mountUserProfile(node, props);
});
this.premountUserButtonNodes.forEach((props, node) => {
clerkjs.mountUserButton(node, props);
});
this._loaded = true;
return this.clerkjs;
};
this.setSession = (session, beforeEmit) => {
if (this.clerkjs) {
return this.clerkjs.setSession(session, beforeEmit);
}
else {
return Promise.reject();
}
};
this.openSignIn = (props) => {
if (this.clerkjs && this._loaded) {
this.clerkjs.openSignIn(props);
}
else {
this.preopenSignIn = props;
}
};
this.closeSignIn = () => {
if (this.clerkjs && this._loaded) {
this.clerkjs.closeSignIn();
}
else {
this.preopenSignIn = null;
}
};
this.openSignUp = (props) => {
if (this.clerkjs && this._loaded) {
this.clerkjs.openSignUp(props);
}
else {
this.preopenSignUp = props;
}
};
this.closeSignUp = () => {
if (this.clerkjs && this._loaded) {
this.clerkjs.closeSignUp();
}
else {
this.preopenSignUp = null;
}
};
this.mountSignIn = (node, props) => {
if (this.clerkjs && this._loaded) {
this.clerkjs.mountSignIn(node, props);
}
else {
this.premountSignInNodes.set(node, props);
}
};
this.unmountSignIn = (node) => {
if (this.clerkjs && this._loaded) {
this.clerkjs.unmountSignIn(node);
}
else {
this.premountSignInNodes.delete(node);
}
};
this.mountSignUp = (node, props) => {
if (this.clerkjs && this._loaded) {
this.clerkjs.mountSignUp(node, props);
}
else {
this.premountSignUpNodes.set(node, props);
}
};
this.unmountSignUp = (node) => {
if (this.clerkjs && this._loaded) {
this.clerkjs.unmountSignUp(node);
}
else {
this.premountSignUpNodes.delete(node);
}
};
this.mountUserProfile = (node, props) => {
if (this.clerkjs && this._loaded) {
this.clerkjs.mountUserProfile(node, props);
}
else {
this.premountUserProfileNodes.set(node, props);
}
};
this.unmountUserProfile = (node) => {
if (this.clerkjs && this._loaded) {
this.clerkjs.unmountUserProfile(node);
}
else {
this.premountUserProfileNodes.delete(node);
}
};
this.mountUserButton = (node, userButtonProps) => {
if (this.clerkjs && this._loaded) {
this.clerkjs.mountUserButton(node, userButtonProps);
}
else {
this.premountUserButtonNodes.set(node, userButtonProps);
}
};
this.unmountUserButton = (node) => {
if (this.clerkjs && this._loaded) {
this.clerkjs.unmountUserButton(node);
}
else {
this.premountUserButtonNodes.delete(node);
}
};
this.addListener = (listener) => {
const callback = () => { var _a; return (_a = this.clerkjs) === null || _a === void 0 ? void 0 : _a.addListener(listener); };
if (this.clerkjs) {
callback();
}
else {
this.premountMethodCalls.set('addListener', callback);
}
};
this.loadFromServer = (token) => {
if (this.mode === 'browser') {
void this.throwError('loadFromServer cannot be called in a browser context.');
}
this.ssrData = JSON.stringify({
client: this.client,
session: this.session,
token: token,
});
};
this.navigate = (to) => {
const callback = () => { var _a; return (_a = this.clerkjs) === null || _a === void 0 ? void 0 : _a.navigate(to); };
if (this.clerkjs && this._loaded) {
void callback();
}
else {
this.premountMethodCalls.set('navigate', callback);
}
};
// DX: deprecated <=2.4.2
// Deprecate the boolean type before removing returnBack
this.redirectToSignIn = (opts) => {
const callback = () => { var _a; return (_a = this.clerkjs) === null || _a === void 0 ? void 0 : _a.redirectToSignIn(opts); };
if (this.clerkjs && this._loaded) {
void callback();
}
else {
this.premountMethodCalls.set('redirectToSignIn', callback);
}
};
// DX: deprecated <=2.4.2
// Deprecate the boolean type before removing returnBack
this.redirectToSignUp = (opts) => {
const callback = () => { var _a; return (_a = this.clerkjs) === null || _a === void 0 ? void 0 : _a.redirectToSignUp(opts); };
if (this.clerkjs && this._loaded) {
void callback();
}
else {
this.premountMethodCalls.set('redirectToSignUp', callback);
}
};
this.redirectToUserProfile = () => {
const callback = () => { var _a; return (_a = this.clerkjs) === null || _a === void 0 ? void 0 : _a.redirectToUserProfile(); };
if (this.clerkjs && this._loaded) {
callback();
}
else {
this.premountMethodCalls.set('redirectToUserProfile', callback);
}
};
this.handleRedirectCallback = (params) => {
const callback = () => { var _a; return (_a = this.clerkjs) === null || _a === void 0 ? void 0 : _a.handleRedirectCallback(params); };
if (this.clerkjs && this._loaded) {
void callback();
}
else {
this.premountMethodCalls.set('handleRedirectCallback', callback);
}
};
this.handleMagicLinkVerification = async (params) => {
const callback = () => { var _a; return (_a = this.clerkjs) === null || _a === void 0 ? void 0 : _a.handleMagicLinkVerification(params); };
if (this.clerkjs && this._loaded) {
return callback();
}
else {
this.premountMethodCalls.set('handleMagicLinkVerification', callback);
}
};
this.signOut = async (signOutCallback) => {
const callback = () => { var _a; return (_a = this.clerkjs) === null || _a === void 0 ? void 0 : _a.signOut(signOutCallback); };
if (this.clerkjs && this._loaded) {
return callback();
}
else {
this.premountMethodCalls.set('signOut', callback);
}
};
this.signOutOne = async (signOutCallback) => {
const callback = () => { var _a; return (_a = this.clerkjs) === null || _a === void 0 ? void 0 : _a.signOutOne(signOutCallback); };
if (this.clerkjs && this._loaded) {
return callback();
}
else {
this.premountMethodCalls.set('signOutOne', callback);
}
};
this.frontendApi = frontendApi;
this.options = options;
this.Clerk = Clerk;
this.mode = (0, utils_1.inBrowser)() ? 'browser' : 'server';
// TODO: Support SRR for NextJS
// const ssrDataNode = document.querySelector(`script[data-clerk="SSR"]`);
// if (ssrDataNode) {
// this.ssrData = ssrDataNode.innerHTML;
// const parsedData = JSON.parse(this.ssrData);
// this.ssrClient = parsedData.client;
// this.ssrSession = parsedData.session;
// }
}
async loadClerkJS() {
if (!this.frontendApi) {
this.throwError(errors_1.noFrontendApiError);
}
try {
if (this.Clerk) {
// Set a fixed Clerk version
let c;
if ((0, utils_1.isConstructor)(this.Clerk)) {
// Construct a new Clerk object if a constructor is passed
c = new this.Clerk(this.frontendApi);
await c.load(this.options);
}
else {
// Otherwise use the instantiated Clerk object
c = this.Clerk;
if (!c.isReady()) {
await c.load(this.options);
}
}
global.Clerk = c;
}
else {
// Hot-load latest ClerkJS from Clerk CDN
await (0, utils_1.loadScript)(this.frontendApi, this.options.scriptUrl);
if (!global.Clerk) {
throw new Error('Failed to download latest ClerkJS. Contact support@clerk.dev.');
}
await global.Clerk.load(this.options);
}
return this.hydrateClerkJS(global.Clerk);
}
catch (err) {
let message;
if (err instanceof Error) {
message = err.message;
}
else {
message = String(err);
}
this.throwError(message);
return;
}
}
// Custom wrapper to throw an error, since we need to apply different handling between
// production and development builds. In Next.js we can throw a full screen error in
// development mode. However, in production throwing an error results in an infinite loop
// as shown at https://github.com/vercel/next.js/issues/6973
throwError(errorMsg) {
if (process.env.NODE_ENV === 'production') {
console.error(errorMsg);
}
throw new Error(errorMsg);
}
get version() {
var _a;
return (_a = this.clerkjs) === null || _a === void 0 ? void 0 : _a.version;
}
get client() {
if (this.clerkjs) {
return this.clerkjs.client;
// TODO: add ssr condition
}
else {
return undefined;
}
}
get session() {
if (this.clerkjs) {
return this.clerkjs.session;
// TODO: add ssr condition
}
else {
return undefined;
}
}
get user() {
if (this.clerkjs) {
return this.clerkjs.user;
// TODO: add ssr condition
}
else {
return undefined;
}
}
// TODO: Remove temp use of __unstable__environment
get __unstable__environment() {
if (this.clerkjs) {
return this.clerkjs.__unstable__environment;
// TODO: add ssr condition
}
else {
return undefined;
}
}
}
exports.default = IsomorphicClerk;
//# sourceMappingURL=isomorphicClerk.js.map