@zautha/react 0.1.0

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2026 Hasan Talha Yalmanbas
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/README.md

@@ -0,0 +1,35 @@
+# @zautha/react
+
+React bindings for [Zautha](https://zautha.com): `<ZauthaProvider>`, hooks (`useAuth`, `useUser`,
+`useSession`, …), `<Show>`, and the prebuilt components from `@zautha/ui`.
+
+## Install
+
+```sh
+npm i @zautha/react @zautha/ui
+```
+
+## Quickstart (React + Vite)
+
+```tsx
+import { Show, SignIn, UserButton, ZauthaProvider } from "@zautha/react";
+import { ui } from "@zautha/ui";
+import "@zautha/ui/styles.css";
+
+export function App() {
+  return (
+    <ZauthaProvider publishableKey="pk_test_…" ui={ui}>
+      <Show when="signed-out">
+        <SignIn />
+      </Show>
+      <Show when="signed-in">
+        <UserButton />
+      </Show>
+    </ZauthaProvider>
+  );
+}
+```
+
+## License
+
+MIT, see [LICENSE](./LICENSE).

package/dist/index.cjs

@@ -0,0 +1,345 @@
+"use client";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+let _zautha_js = require("@zautha/js");
+let react = require("react");
+let react_jsx_runtime = require("react/jsx-runtime");
+//#region src/provider.tsx
+const ZauthaContext = (0, react.createContext)(void 0);
+/**
+* Creates the Zautha instance after mount (never during render, so StrictMode's double mount and SSR
+* create no timers or channels), loads it, and disposes it on unmount. Until then hooks report
+* `isLoaded: false`.
+*/
+function ZauthaProvider({ publishableKey, children, ...options }) {
+	const [zautha, setZautha] = (0, react.useState)(null);
+	const { ui, appearance, localization, signInUrl, signUpUrl, navigate } = options;
+	(0, react.useEffect)(() => {
+		const instance = new _zautha_js.Zautha(publishableKey, {
+			...ui === void 0 ? {} : { ui },
+			...appearance === void 0 ? {} : { appearance },
+			...localization === void 0 ? {} : { localization },
+			...signInUrl === void 0 ? {} : { signInUrl },
+			...signUpUrl === void 0 ? {} : { signUpUrl },
+			...navigate === void 0 ? {} : { navigate }
+		});
+		setZautha(instance);
+		instance.load();
+		return () => {
+			instance.dispose();
+			setZautha(null);
+		};
+	}, [publishableKey]);
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(ZauthaContext.Provider, {
+		value: zautha,
+		children
+	});
+}
+/** The Zautha instance, or null before the provider has created it. */
+function useZautha() {
+	const zautha = (0, react.useContext)(ZauthaContext);
+	if (zautha === void 0) throw new Error("Zautha hooks and components must be used inside <ZauthaProvider>.");
+	return zautha;
+}
+const NO_STATE = {
+	status: "loading",
+	environment: null,
+	client: null,
+	session: null,
+	user: null
+};
+const noop = () => () => void 0;
+/** Reactive snapshot of the instance state (the loading state before the instance exists). */
+function useZauthaState() {
+	const zautha = useZautha();
+	return (0, react.useSyncExternalStore)(zautha?.subscribe ?? noop, () => zautha?.getSnapshot() ?? NO_STATE, () => NO_STATE);
+}
+//#endregion
+//#region src/hooks.ts
+const isLoadedStatus = (status) => status === "ready" || status === "degraded";
+function useAuth() {
+	const zautha = useZautha();
+	const state = useZauthaState();
+	const getToken = (0, react.useCallback)((options) => zautha?.getToken(options) ?? Promise.resolve(null), [zautha]);
+	const signOut = (0, react.useCallback)((options) => zautha?.signOut(options) ?? Promise.resolve(), [zautha]);
+	const signedIn = state.session !== null;
+	const has = (0, react.useCallback)((params) => signedIn && params.role === void 0 && params.permission === void 0, [signedIn]);
+	return {
+		isLoaded: isLoadedStatus(state.status),
+		isSignedIn: signedIn,
+		userId: state.session?.userId ?? null,
+		sessionId: state.session?.id ?? null,
+		getToken,
+		signOut,
+		has
+	};
+}
+function useUser() {
+	const state = useZauthaState();
+	return {
+		isLoaded: isLoadedStatus(state.status),
+		isSignedIn: state.session !== null,
+		user: state.user
+	};
+}
+function useSession() {
+	const state = useZauthaState();
+	return {
+		isLoaded: isLoadedStatus(state.status),
+		isSignedIn: state.session !== null,
+		session: state.session
+	};
+}
+const noopSubscribe = () => () => void 0;
+function useResource(resource) {
+	return (0, react.useSyncExternalStore)(resource?.subscribe ?? noopSubscribe, () => resource?.snapshot ?? null, () => null);
+}
+const NO_ERRORS = {
+	fields: {},
+	global: []
+};
+function useSignIn() {
+	const zautha = useZautha();
+	const state = useZauthaState();
+	const snapshot = useResource(zautha?.signIn ?? null);
+	return {
+		isLoaded: isLoadedStatus(state.status),
+		signIn: zautha?.signIn ?? null,
+		errors: snapshot?.errors ?? NO_ERRORS,
+		fetchStatus: snapshot?.fetchStatus ?? "idle"
+	};
+}
+function useSignUp() {
+	const zautha = useZautha();
+	const state = useZauthaState();
+	const snapshot = useResource(zautha?.signUp ?? null);
+	return {
+		isLoaded: isLoadedStatus(state.status),
+		signUp: zautha?.signUp ?? null,
+		errors: snapshot?.errors ?? NO_ERRORS,
+		fetchStatus: snapshot?.fetchStatus ?? "idle"
+	};
+}
+//#endregion
+//#region src/control.tsx
+/**
+* Renders `children` when the condition holds, else `fallback`. Renders nothing until Zautha has
+* loaded, so a signed-in user never sees a signed-out flash.
+*/
+function Show(props) {
+	const { isLoaded, isSignedIn, has } = useAuth();
+	if (!isLoaded) return null;
+	const { when } = props;
+	return (when === "signed-in" ? isSignedIn : when === "signed-out" ? !isSignedIn : typeof when === "function" ? when(has) : has(when)) ? props.children : props.fallback ?? null;
+}
+function ZauthaLoading(props) {
+	return useZauthaState().status === "loading" ? props.children : null;
+}
+/** Loaded, including degraded (network trouble after load: last known state is shown). */
+function ZauthaLoaded(props) {
+	const { status } = useZauthaState();
+	return status === "ready" || status === "degraded" ? props.children : null;
+}
+function ZauthaDegraded(props) {
+	return useZauthaState().status === "degraded" ? props.children : null;
+}
+function ZauthaFailed(props) {
+	return useZauthaState().status === "failed" ? props.children : null;
+}
+/** Sends a signed-out visitor to sign-in once loaded; renders nothing. */
+function RedirectToSignIn(props) {
+	const zautha = useZautha();
+	const { isLoaded, isSignedIn } = useAuth();
+	const { redirectUrl } = props;
+	(0, react.useEffect)(() => {
+		if (zautha !== null && isLoaded && !isSignedIn) zautha.redirectToSignIn(redirectUrl === void 0 ? {} : { redirectUrl });
+	}, [
+		zautha,
+		isLoaded,
+		isSignedIn,
+		redirectUrl
+	]);
+	return null;
+}
+function RedirectToSignUp(props) {
+	const zautha = useZautha();
+	const { isLoaded, isSignedIn } = useAuth();
+	const { redirectUrl } = props;
+	(0, react.useEffect)(() => {
+		if (zautha !== null && isLoaded && !isSignedIn) zautha.redirectToSignUp(redirectUrl === void 0 ? {} : { redirectUrl });
+	}, [
+		zautha,
+		isLoaded,
+		isSignedIn,
+		redirectUrl
+	]);
+	return null;
+}
+//#endregion
+//#region src/buttons.tsx
+/** Wraps its single child (or renders a plain button) and wires the click. Unstyled by design. */
+function Trigger(props) {
+	const child = react.Children.count(props.children) === 1 ? react.Children.only(props.children) : null;
+	if ((0, react.isValidElement)(child)) {
+		const original = child.props.onClick;
+		return (0, react.cloneElement)(child, { onClick: (event) => {
+			original?.(event);
+			if (!event.defaultPrevented) props.onClick();
+		} });
+	}
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+		type: "button",
+		onClick: props.onClick,
+		children: props.children ?? props.label
+	});
+}
+function SignInButton(props) {
+	const zautha = useZautha();
+	const options = props.redirectUrl === void 0 ? {} : { redirectUrl: props.redirectUrl };
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Trigger, {
+		label: "Sign in",
+		onClick: () => props.mode === "modal" ? zautha?.openSignIn(options) : zautha?.redirectToSignIn(options),
+		children: props.children
+	});
+}
+function SignUpButton(props) {
+	const zautha = useZautha();
+	const options = props.redirectUrl === void 0 ? {} : { redirectUrl: props.redirectUrl };
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Trigger, {
+		label: "Sign up",
+		onClick: () => props.mode === "modal" ? zautha?.openSignUp(options) : zautha?.redirectToSignUp(options),
+		children: props.children
+	});
+}
+function SignOutButton(props) {
+	const zautha = useZautha();
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Trigger, {
+		label: "Sign out",
+		onClick: () => void zautha?.signOut(props.redirectUrl === void 0 ? {} : { redirectUrl: props.redirectUrl }),
+		children: props.children
+	});
+}
+//#endregion
+//#region src/prebuilt.tsx
+/**
+* Mounts a @zautha/ui component into a div once the instance exists; later prop changes update it in
+* place. SSR renders only the empty div.
+*/
+function Mounted(props) {
+	const zautha = useZautha();
+	const ref = (0, react.useRef)(null);
+	const mountedWith = (0, react.useRef)(null);
+	const { name, componentProps } = props;
+	(0, react.useEffect)(() => {
+		const element = ref.current;
+		if (zautha === null || element === null) return;
+		zautha.mount(name, element, componentProps);
+		mountedWith.current = componentProps;
+		return () => {
+			mountedWith.current = null;
+			zautha.unmount(element);
+		};
+	}, [zautha, name]);
+	(0, react.useEffect)(() => {
+		const element = ref.current;
+		if (zautha === null || element === null || mountedWith.current === null || mountedWith.current === componentProps) return;
+		mountedWith.current = componentProps;
+		zautha.updateMounted(element, componentProps);
+	}, [zautha, componentProps]);
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", { ref });
+}
+function SignIn(props) {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Mounted, {
+		name: "SignIn",
+		componentProps: props
+	});
+}
+function SignUp(props) {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Mounted, {
+		name: "SignUp",
+		componentProps: props
+	});
+}
+function UserButton(props) {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Mounted, {
+		name: "UserButton",
+		componentProps: props
+	});
+}
+function OAuthConsent(props) {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Mounted, {
+		name: "OAuthConsent",
+		componentProps: props
+	});
+}
+//#endregion
+exports.OAuthConsent = OAuthConsent;
+exports.RedirectToSignIn = RedirectToSignIn;
+exports.RedirectToSignUp = RedirectToSignUp;
+exports.Show = Show;
+exports.SignIn = SignIn;
+exports.SignInButton = SignInButton;
+exports.SignOutButton = SignOutButton;
+exports.SignUp = SignUp;
+exports.SignUpButton = SignUpButton;
+exports.UserButton = UserButton;
+Object.defineProperty(exports, "ZauthaApiError", {
+	enumerable: true,
+	get: function() {
+		return _zautha_js.ZauthaApiError;
+	}
+});
+exports.ZauthaDegraded = ZauthaDegraded;
+Object.defineProperty(exports, "ZauthaError", {
+	enumerable: true,
+	get: function() {
+		return _zautha_js.ZauthaError;
+	}
+});
+exports.ZauthaFailed = ZauthaFailed;
+exports.ZauthaLoaded = ZauthaLoaded;
+exports.ZauthaLoading = ZauthaLoading;
+Object.defineProperty(exports, "ZauthaNetworkError", {
+	enumerable: true,
+	get: function() {
+		return _zautha_js.ZauthaNetworkError;
+	}
+});
+Object.defineProperty(exports, "ZauthaOfflineError", {
+	enumerable: true,
+	get: function() {
+		return _zautha_js.ZauthaOfflineError;
+	}
+});
+exports.ZauthaProvider = ZauthaProvider;
+Object.defineProperty(exports, "isZauthaApiError", {
+	enumerable: true,
+	get: function() {
+		return _zautha_js.isZauthaApiError;
+	}
+});
+Object.defineProperty(exports, "isZauthaError", {
+	enumerable: true,
+	get: function() {
+		return _zautha_js.isZauthaError;
+	}
+});
+Object.defineProperty(exports, "isZauthaNetworkError", {
+	enumerable: true,
+	get: function() {
+		return _zautha_js.isZauthaNetworkError;
+	}
+});
+Object.defineProperty(exports, "isZauthaOfflineError", {
+	enumerable: true,
+	get: function() {
+		return _zautha_js.isZauthaOfflineError;
+	}
+});
+exports.useAuth = useAuth;
+exports.useSession = useSession;
+exports.useSignIn = useSignIn;
+exports.useSignUp = useSignUp;
+exports.useUser = useUser;
+exports.useZautha = useZautha;
+
+//# sourceMappingURL=index.cjs.map

package/dist/index.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.cjs","names":["createContext","useState","Zautha","useContext","useSyncExternalStore","useCallback","useSyncExternalStore","Children","isValidElement","cloneElement","useRef"],"sources":["../src/provider.tsx","../src/hooks.ts","../src/control.tsx","../src/buttons.tsx","../src/prebuilt.tsx"],"sourcesContent":["import { Zautha, type ZauthaOptions, type ZauthaState } from \"@zautha/js\";\nimport { createContext, useContext, useEffect, useState, useSyncExternalStore, type ReactNode } from \"react\";\n\nconst ZauthaContext = createContext<Zautha | null | undefined>(undefined);\n\nexport interface ZauthaProviderProps extends Omit<ZauthaOptions, \"fetch\"> {\n  publishableKey: string;\n  children?: ReactNode;\n}\n\n/**\n * Creates the Zautha instance after mount (never during render, so StrictMode's double mount and SSR\n * create no timers or channels), loads it, and disposes it on unmount. Until then hooks report\n * `isLoaded: false`.\n */\nexport function ZauthaProvider({ publishableKey, children, ...options }: ZauthaProviderProps): ReactNode {\n  const [zautha, setZautha] = useState<Zautha | null>(null);\n  const { ui, appearance, localization, signInUrl, signUpUrl, navigate } = options;\n\n  useEffect(() => {\n    const instance = new Zautha(publishableKey, {\n      ...(ui === undefined ? {} : { ui }),\n      ...(appearance === undefined ? {} : { appearance }),\n      ...(localization === undefined ? {} : { localization }),\n      ...(signInUrl === undefined ? {} : { signInUrl }),\n      ...(signUpUrl === undefined ? {} : { signUpUrl }),\n      ...(navigate === undefined ? {} : { navigate }),\n    });\n    // The instance is an external system: it is created here, never during render, and published through state.\n    // eslint-disable-next-line react-hooks/set-state-in-effect\n    setZautha(instance);\n    void instance.load();\n    return () => {\n      instance.dispose();\n      setZautha(null);\n    };\n    // Appearance/localization objects are read at mount; changing the key re-creates the instance.\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [publishableKey]);\n\n  return <ZauthaContext.Provider value={zautha}>{children}</ZauthaContext.Provider>;\n}\n\n/** The Zautha instance, or null before the provider has created it. */\nexport function useZautha(): Zautha | null {\n  const zautha = useContext(ZauthaContext);\n  if (zautha === undefined) throw new Error(\"Zautha hooks and components must be used inside <ZauthaProvider>.\");\n  return zautha;\n}\n\nconst NO_STATE: ZauthaState = { status: \"loading\", environment: null, client: null, session: null, user: null };\nconst noop = (): (() => void) => () => undefined;\n\n/** Reactive snapshot of the instance state (the loading state before the instance exists). */\nexport function useZauthaState(): ZauthaState {\n  const zautha = useZautha();\n  return useSyncExternalStore(\n    zautha?.subscribe ?? noop,\n    () => zautha?.getSnapshot() ?? NO_STATE,\n    () => NO_STATE,\n  );\n}\n","import type { AttemptErrors, FetchStatus, Session, SignInResource, SignUpResource, User } from \"@zautha/js\";\nimport { useCallback, useSyncExternalStore } from \"react\";\nimport { useZautha, useZauthaState } from \"./provider\";\n\n/** Authorization check. In 3a there are no organization claims yet, so role/permission checks are false. */\nexport type HasParams = { role?: string; permission?: string };\nexport type Has = (params: HasParams) => boolean;\n\nexport interface UseAuthResult {\n  isLoaded: boolean;\n  isSignedIn: boolean;\n  userId: string | null;\n  sessionId: string | null;\n  getToken: (options?: { skipCache?: boolean }) => Promise<string | null>;\n  signOut: (options?: { redirectUrl?: string }) => Promise<void>;\n  has: Has;\n}\n\nconst isLoadedStatus = (status: string): boolean => status === \"ready\" || status === \"degraded\";\n\nexport function useAuth(): UseAuthResult {\n  const zautha = useZautha();\n  const state = useZauthaState();\n  const getToken = useCallback(\n    (options?: { skipCache?: boolean }) => zautha?.getToken(options) ?? Promise.resolve(null),\n    [zautha],\n  );\n  const signOut = useCallback(\n    (options?: { redirectUrl?: string }) => zautha?.signOut(options) ?? Promise.resolve(),\n    [zautha],\n  );\n  const signedIn = state.session !== null;\n  const has = useCallback<Has>(\n    (params) => signedIn && params.role === undefined && params.permission === undefined,\n    [signedIn],\n  );\n  return {\n    isLoaded: isLoadedStatus(state.status),\n    isSignedIn: signedIn,\n    userId: state.session?.userId ?? null,\n    sessionId: state.session?.id ?? null,\n    getToken,\n    signOut,\n    has,\n  };\n}\n\nexport function useUser(): { isLoaded: boolean; isSignedIn: boolean; user: User | null } {\n  const state = useZauthaState();\n  return { isLoaded: isLoadedStatus(state.status), isSignedIn: state.session !== null, user: state.user };\n}\n\nexport function useSession(): { isLoaded: boolean; isSignedIn: boolean; session: Session | null } {\n  const state = useZauthaState();\n  return { isLoaded: isLoadedStatus(state.status), isSignedIn: state.session !== null, session: state.session };\n}\n\nconst noopSubscribe = (): (() => void) => () => undefined;\n\nfunction useResource<T extends SignInResource | SignUpResource>(resource: T | null) {\n  const snapshot = useSyncExternalStore(\n    resource?.subscribe ?? noopSubscribe,\n    () => resource?.snapshot ?? null,\n    () => null,\n  );\n  return snapshot;\n}\n\nexport interface UseSignInResult {\n  isLoaded: boolean;\n  /** The sign-in resource; null until the provider has created the instance. */\n  signIn: SignInResource | null;\n  errors: AttemptErrors;\n  fetchStatus: FetchStatus;\n}\n\nconst NO_ERRORS: AttemptErrors = { fields: {}, global: [] };\n\nexport function useSignIn(): UseSignInResult {\n  const zautha = useZautha();\n  const state = useZauthaState();\n  const snapshot = useResource(zautha?.signIn ?? null);\n  return {\n    isLoaded: isLoadedStatus(state.status),\n    signIn: zautha?.signIn ?? null,\n    errors: snapshot?.errors ?? NO_ERRORS,\n    fetchStatus: snapshot?.fetchStatus ?? \"idle\",\n  };\n}\n\nexport interface UseSignUpResult {\n  isLoaded: boolean;\n  signUp: SignUpResource | null;\n  errors: AttemptErrors;\n  fetchStatus: FetchStatus;\n}\n\nexport function useSignUp(): UseSignUpResult {\n  const zautha = useZautha();\n  const state = useZauthaState();\n  const snapshot = useResource(zautha?.signUp ?? null);\n  return {\n    isLoaded: isLoadedStatus(state.status),\n    signUp: zautha?.signUp ?? null,\n    errors: snapshot?.errors ?? NO_ERRORS,\n    fetchStatus: snapshot?.fetchStatus ?? \"idle\",\n  };\n}\n","import { useEffect, type ReactNode } from \"react\";\nimport { useAuth, type Has, type HasParams } from \"./hooks\";\nimport { useZautha, useZauthaState } from \"./provider\";\n\nexport type ShowWhen = \"signed-in\" | \"signed-out\" | HasParams | ((has: Has) => boolean);\n\n/**\n * Renders `children` when the condition holds, else `fallback`. Renders nothing until Zautha has\n * loaded, so a signed-in user never sees a signed-out flash.\n */\nexport function Show(props: { when: ShowWhen; fallback?: ReactNode; children?: ReactNode }): ReactNode {\n  const { isLoaded, isSignedIn, has } = useAuth();\n  if (!isLoaded) return null;\n  const { when } = props;\n  const pass =\n    when === \"signed-in\"\n      ? isSignedIn\n      : when === \"signed-out\"\n        ? !isSignedIn\n        : typeof when === \"function\"\n          ? when(has)\n          : has(when);\n  return pass ? props.children : (props.fallback ?? null);\n}\n\nexport function ZauthaLoading(props: { children?: ReactNode }): ReactNode {\n  return useZauthaState().status === \"loading\" ? props.children : null;\n}\n\n/** Loaded, including degraded (network trouble after load: last known state is shown). */\nexport function ZauthaLoaded(props: { children?: ReactNode }): ReactNode {\n  const { status } = useZauthaState();\n  return status === \"ready\" || status === \"degraded\" ? props.children : null;\n}\n\nexport function ZauthaDegraded(props: { children?: ReactNode }): ReactNode {\n  return useZauthaState().status === \"degraded\" ? props.children : null;\n}\n\nexport function ZauthaFailed(props: { children?: ReactNode }): ReactNode {\n  return useZauthaState().status === \"failed\" ? props.children : null;\n}\n\n/** Sends a signed-out visitor to sign-in once loaded; renders nothing. */\nexport function RedirectToSignIn(props: { redirectUrl?: string }): ReactNode {\n  const zautha = useZautha();\n  const { isLoaded, isSignedIn } = useAuth();\n  const { redirectUrl } = props;\n  useEffect(() => {\n    if (zautha !== null && isLoaded && !isSignedIn)\n      zautha.redirectToSignIn(redirectUrl === undefined ? {} : { redirectUrl });\n  }, [zautha, isLoaded, isSignedIn, redirectUrl]);\n  return null;\n}\n\nexport function RedirectToSignUp(props: { redirectUrl?: string }): ReactNode {\n  const zautha = useZautha();\n  const { isLoaded, isSignedIn } = useAuth();\n  const { redirectUrl } = props;\n  useEffect(() => {\n    if (zautha !== null && isLoaded && !isSignedIn)\n      zautha.redirectToSignUp(redirectUrl === undefined ? {} : { redirectUrl });\n  }, [zautha, isLoaded, isSignedIn, redirectUrl]);\n  return null;\n}\n","import { Children, cloneElement, isValidElement, type MouseEvent, type ReactElement, type ReactNode } from \"react\";\nimport { useZautha } from \"./provider\";\n\ninterface ButtonProps {\n  /** `redirect` (default) goes to the sign-in page; `modal` opens the prebuilt component (needs `ui`). */\n  mode?: \"redirect\" | \"modal\";\n  redirectUrl?: string;\n  children?: ReactNode;\n}\n\n/** Wraps its single child (or renders a plain button) and wires the click. Unstyled by design. */\nfunction Trigger(props: { children: ReactNode; label: string; onClick: () => void }): ReactNode {\n  const child = Children.count(props.children) === 1 ? Children.only(props.children) : null;\n  if (isValidElement<{ onClick?: (event: MouseEvent) => void }>(child)) {\n    const original = child.props.onClick;\n    return cloneElement(child as ReactElement<{ onClick?: (event: MouseEvent) => void }>, {\n      onClick: (event: MouseEvent) => {\n        original?.(event);\n        if (!event.defaultPrevented) props.onClick();\n      },\n    });\n  }\n  return (\n    <button type=\"button\" onClick={props.onClick}>\n      {props.children ?? props.label}\n    </button>\n  );\n}\n\nexport function SignInButton(props: ButtonProps): ReactNode {\n  const zautha = useZautha();\n  const options = props.redirectUrl === undefined ? {} : { redirectUrl: props.redirectUrl };\n  return (\n    <Trigger\n      label=\"Sign in\"\n      onClick={() => (props.mode === \"modal\" ? zautha?.openSignIn(options) : zautha?.redirectToSignIn(options))}\n    >\n      {props.children}\n    </Trigger>\n  );\n}\n\nexport function SignUpButton(props: ButtonProps): ReactNode {\n  const zautha = useZautha();\n  const options = props.redirectUrl === undefined ? {} : { redirectUrl: props.redirectUrl };\n  return (\n    <Trigger\n      label=\"Sign up\"\n      onClick={() => (props.mode === \"modal\" ? zautha?.openSignUp(options) : zautha?.redirectToSignUp(options))}\n    >\n      {props.children}\n    </Trigger>\n  );\n}\n\nexport function SignOutButton(props: { redirectUrl?: string; children?: ReactNode }): ReactNode {\n  const zautha = useZautha();\n  return (\n    <Trigger\n      label=\"Sign out\"\n      onClick={() => void zautha?.signOut(props.redirectUrl === undefined ? {} : { redirectUrl: props.redirectUrl })}\n    >\n      {props.children}\n    </Trigger>\n  );\n}\n","import type { UiComponentName } from \"@zautha/js\";\nimport { useEffect, useRef, type ReactNode } from \"react\";\nimport { useZautha } from \"./provider\";\n\n/**\n * Mounts a @zautha/ui component into a div once the instance exists; later prop changes update it in\n * place. SSR renders only the empty div.\n */\nfunction Mounted(props: { name: UiComponentName; componentProps: object }): ReactNode {\n  const zautha = useZautha();\n  const ref = useRef<HTMLDivElement>(null);\n  const mountedWith = useRef<object | null>(null);\n  const { name, componentProps } = props;\n\n  useEffect(() => {\n    const element = ref.current;\n    if (zautha === null || element === null) return;\n    zautha.mount(name, element, componentProps);\n    mountedWith.current = componentProps;\n    return () => {\n      mountedWith.current = null;\n      zautha.unmount(element);\n    };\n    // componentProps changes are applied by the effect below without remounting.\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [zautha, name]);\n\n  useEffect(() => {\n    const element = ref.current;\n    if (zautha === null || element === null || mountedWith.current === null || mountedWith.current === componentProps)\n      return;\n    mountedWith.current = componentProps;\n    zautha.updateMounted(element, componentProps);\n  }, [zautha, componentProps]);\n\n  return <div ref={ref} />;\n}\n\n// Prop types live in @zautha/ui; they are structural here so @zautha/react has no runtime dependency on it.\nexport function SignIn(props: import(\"@zautha/ui\").SignInProps): ReactNode {\n  return <Mounted name=\"SignIn\" componentProps={props} />;\n}\n\nexport function SignUp(props: import(\"@zautha/ui\").SignUpProps): ReactNode {\n  return <Mounted name=\"SignUp\" componentProps={props} />;\n}\n\nexport function UserButton(props: import(\"@zautha/ui\").UserButtonProps): ReactNode {\n  return <Mounted name=\"UserButton\" componentProps={props} />;\n}\n\nexport function OAuthConsent(props: import(\"@zautha/ui\").OAuthConsentProps): ReactNode {\n  return <Mounted name=\"OAuthConsent\" componentProps={props} />;\n}\n"],"mappings":"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"}

package/dist/index.d.cts

@@ -0,0 +1,118 @@
+
+import { AttemptErrors, Environment, FetchStatus, Session, Session as Session$1, SignInResource, SignInResource as SignInResource$1, SignUpResource, SignUpResource as SignUpResource$1, User, User as User$1, Zautha, ZauthaApiError, ZauthaError, ZauthaErrorCode, ZauthaNetworkError, ZauthaOfflineError, ZauthaOptions, isZauthaApiError, isZauthaError, isZauthaNetworkError, isZauthaOfflineError } from "@zautha/js";
+import { ReactNode } from "react";
+//#region src/provider.d.ts
+interface ZauthaProviderProps extends Omit<ZauthaOptions, "fetch"> {
+  publishableKey: string;
+  children?: ReactNode;
+}
+/**
+ * Creates the Zautha instance after mount (never during render, so StrictMode's double mount and SSR
+ * create no timers or channels), loads it, and disposes it on unmount. Until then hooks report
+ * `isLoaded: false`.
+ */
+export declare function ZauthaProvider({ publishableKey, children, ...options }: ZauthaProviderProps): ReactNode;
+/** The Zautha instance, or null before the provider has created it. */
+export declare function useZautha(): Zautha | null;
+//#endregion
+//#region src/hooks.d.ts
+/** Authorization check. In 3a there are no organization claims yet, so role/permission checks are false. */
+type HasParams = {
+  role?: string;
+  permission?: string;
+};
+type Has = (params: HasParams) => boolean;
+interface UseAuthResult {
+  isLoaded: boolean;
+  isSignedIn: boolean;
+  userId: string | null;
+  sessionId: string | null;
+  getToken: (options?: {
+    skipCache?: boolean;
+  }) => Promise<string | null>;
+  signOut: (options?: {
+    redirectUrl?: string;
+  }) => Promise<void>;
+  has: Has;
+}
+export declare function useAuth(): UseAuthResult;
+export declare function useUser(): {
+  isLoaded: boolean;
+  isSignedIn: boolean;
+  user: User$1 | null;
+};
+export declare function useSession(): {
+  isLoaded: boolean;
+  isSignedIn: boolean;
+  session: Session$1 | null;
+};
+interface UseSignInResult {
+  isLoaded: boolean;
+  /** The sign-in resource; null until the provider has created the instance. */
+  signIn: SignInResource$1 | null;
+  errors: AttemptErrors;
+  fetchStatus: FetchStatus;
+}
+export declare function useSignIn(): UseSignInResult;
+interface UseSignUpResult {
+  isLoaded: boolean;
+  signUp: SignUpResource$1 | null;
+  errors: AttemptErrors;
+  fetchStatus: FetchStatus;
+}
+export declare function useSignUp(): UseSignUpResult;
+//#endregion
+//#region src/control.d.ts
+type ShowWhen = "signed-in" | "signed-out" | HasParams | ((has: Has) => boolean);
+/**
+ * Renders `children` when the condition holds, else `fallback`. Renders nothing until Zautha has
+ * loaded, so a signed-in user never sees a signed-out flash.
+ */
+export declare function Show(props: {
+  when: ShowWhen;
+  fallback?: ReactNode;
+  children?: ReactNode;
+}): ReactNode;
+export declare function ZauthaLoading(props: {
+  children?: ReactNode;
+}): ReactNode;
+/** Loaded, including degraded (network trouble after load: last known state is shown). */
+export declare function ZauthaLoaded(props: {
+  children?: ReactNode;
+}): ReactNode;
+export declare function ZauthaDegraded(props: {
+  children?: ReactNode;
+}): ReactNode;
+export declare function ZauthaFailed(props: {
+  children?: ReactNode;
+}): ReactNode;
+/** Sends a signed-out visitor to sign-in once loaded; renders nothing. */
+export declare function RedirectToSignIn(props: {
+  redirectUrl?: string;
+}): ReactNode;
+export declare function RedirectToSignUp(props: {
+  redirectUrl?: string;
+}): ReactNode;
+//#endregion
+//#region src/buttons.d.ts
+interface ButtonProps {
+  /** `redirect` (default) goes to the sign-in page; `modal` opens the prebuilt component (needs `ui`). */
+  mode?: "redirect" | "modal";
+  redirectUrl?: string;
+  children?: ReactNode;
+}
+export declare function SignInButton(props: ButtonProps): ReactNode;
+export declare function SignUpButton(props: ButtonProps): ReactNode;
+export declare function SignOutButton(props: {
+  redirectUrl?: string;
+  children?: ReactNode;
+}): ReactNode;
+//#endregion
+//#region src/prebuilt.d.ts
+export declare function SignIn(props: import("@zautha/ui").SignInProps): ReactNode;
+export declare function SignUp(props: import("@zautha/ui").SignUpProps): ReactNode;
+export declare function UserButton(props: import("@zautha/ui").UserButtonProps): ReactNode;
+export declare function OAuthConsent(props: import("@zautha/ui").OAuthConsentProps): ReactNode;
+//#endregion
+export { type Environment, type Has, type HasParams, type Session, type ShowWhen, type SignInResource, type SignUpResource, type UseAuthResult, type UseSignInResult, type UseSignUpResult, type User, ZauthaApiError, ZauthaError, type ZauthaErrorCode, ZauthaNetworkError, ZauthaOfflineError, type ZauthaProviderProps, isZauthaApiError, isZauthaError, isZauthaNetworkError, isZauthaOfflineError };
+//# sourceMappingURL=index.d.cts.map

package/dist/index.d.mts

@@ -0,0 +1,118 @@
+
+import { AttemptErrors, Environment, FetchStatus, Session, Session as Session$1, SignInResource, SignInResource as SignInResource$1, SignUpResource, SignUpResource as SignUpResource$1, User, User as User$1, Zautha, ZauthaApiError, ZauthaError, ZauthaErrorCode, ZauthaNetworkError, ZauthaOfflineError, ZauthaOptions, isZauthaApiError, isZauthaError, isZauthaNetworkError, isZauthaOfflineError } from "@zautha/js";
+import { ReactNode } from "react";
+//#region src/provider.d.ts
+interface ZauthaProviderProps extends Omit<ZauthaOptions, "fetch"> {
+  publishableKey: string;
+  children?: ReactNode;
+}
+/**
+ * Creates the Zautha instance after mount (never during render, so StrictMode's double mount and SSR
+ * create no timers or channels), loads it, and disposes it on unmount. Until then hooks report
+ * `isLoaded: false`.
+ */
+export declare function ZauthaProvider({ publishableKey, children, ...options }: ZauthaProviderProps): ReactNode;
+/** The Zautha instance, or null before the provider has created it. */
+export declare function useZautha(): Zautha | null;
+//#endregion
+//#region src/hooks.d.ts
+/** Authorization check. In 3a there are no organization claims yet, so role/permission checks are false. */
+type HasParams = {
+  role?: string;
+  permission?: string;
+};
+type Has = (params: HasParams) => boolean;
+interface UseAuthResult {
+  isLoaded: boolean;
+  isSignedIn: boolean;
+  userId: string | null;
+  sessionId: string | null;
+  getToken: (options?: {
+    skipCache?: boolean;
+  }) => Promise<string | null>;
+  signOut: (options?: {
+    redirectUrl?: string;
+  }) => Promise<void>;
+  has: Has;
+}
+export declare function useAuth(): UseAuthResult;
+export declare function useUser(): {
+  isLoaded: boolean;
+  isSignedIn: boolean;
+  user: User$1 | null;
+};
+export declare function useSession(): {
+  isLoaded: boolean;
+  isSignedIn: boolean;
+  session: Session$1 | null;
+};
+interface UseSignInResult {
+  isLoaded: boolean;
+  /** The sign-in resource; null until the provider has created the instance. */
+  signIn: SignInResource$1 | null;
+  errors: AttemptErrors;
+  fetchStatus: FetchStatus;
+}
+export declare function useSignIn(): UseSignInResult;
+interface UseSignUpResult {
+  isLoaded: boolean;
+  signUp: SignUpResource$1 | null;
+  errors: AttemptErrors;
+  fetchStatus: FetchStatus;
+}
+export declare function useSignUp(): UseSignUpResult;
+//#endregion
+//#region src/control.d.ts
+type ShowWhen = "signed-in" | "signed-out" | HasParams | ((has: Has) => boolean);
+/**
+ * Renders `children` when the condition holds, else `fallback`. Renders nothing until Zautha has
+ * loaded, so a signed-in user never sees a signed-out flash.
+ */
+export declare function Show(props: {
+  when: ShowWhen;
+  fallback?: ReactNode;
+  children?: ReactNode;
+}): ReactNode;
+export declare function ZauthaLoading(props: {
+  children?: ReactNode;
+}): ReactNode;
+/** Loaded, including degraded (network trouble after load: last known state is shown). */
+export declare function ZauthaLoaded(props: {
+  children?: ReactNode;
+}): ReactNode;
+export declare function ZauthaDegraded(props: {
+  children?: ReactNode;
+}): ReactNode;
+export declare function ZauthaFailed(props: {
+  children?: ReactNode;
+}): ReactNode;
+/** Sends a signed-out visitor to sign-in once loaded; renders nothing. */
+export declare function RedirectToSignIn(props: {
+  redirectUrl?: string;
+}): ReactNode;
+export declare function RedirectToSignUp(props: {
+  redirectUrl?: string;
+}): ReactNode;
+//#endregion
+//#region src/buttons.d.ts
+interface ButtonProps {
+  /** `redirect` (default) goes to the sign-in page; `modal` opens the prebuilt component (needs `ui`). */
+  mode?: "redirect" | "modal";
+  redirectUrl?: string;
+  children?: ReactNode;
+}
+export declare function SignInButton(props: ButtonProps): ReactNode;
+export declare function SignUpButton(props: ButtonProps): ReactNode;
+export declare function SignOutButton(props: {
+  redirectUrl?: string;
+  children?: ReactNode;
+}): ReactNode;
+//#endregion
+//#region src/prebuilt.d.ts
+export declare function SignIn(props: import("@zautha/ui").SignInProps): ReactNode;
+export declare function SignUp(props: import("@zautha/ui").SignUpProps): ReactNode;
+export declare function UserButton(props: import("@zautha/ui").UserButtonProps): ReactNode;
+export declare function OAuthConsent(props: import("@zautha/ui").OAuthConsentProps): ReactNode;
+//#endregion
+export { type Environment, type Has, type HasParams, type Session, type ShowWhen, type SignInResource, type SignUpResource, type UseAuthResult, type UseSignInResult, type UseSignUpResult, type User, ZauthaApiError, ZauthaError, type ZauthaErrorCode, ZauthaNetworkError, ZauthaOfflineError, type ZauthaProviderProps, isZauthaApiError, isZauthaError, isZauthaNetworkError, isZauthaOfflineError };
+//# sourceMappingURL=index.d.mts.map

package/dist/index.mjs

@@ -0,0 +1,276 @@
+"use client";
+import { Zautha, ZauthaApiError, ZauthaError, ZauthaNetworkError, ZauthaOfflineError, isZauthaApiError, isZauthaError, isZauthaNetworkError, isZauthaOfflineError } from "@zautha/js";
+import { Children, cloneElement, createContext, isValidElement, useCallback, useContext, useEffect, useRef, useState, useSyncExternalStore } from "react";
+import { jsx } from "react/jsx-runtime";
+//#region src/provider.tsx
+const ZauthaContext = createContext(void 0);
+/**
+* Creates the Zautha instance after mount (never during render, so StrictMode's double mount and SSR
+* create no timers or channels), loads it, and disposes it on unmount. Until then hooks report
+* `isLoaded: false`.
+*/
+function ZauthaProvider({ publishableKey, children, ...options }) {
+	const [zautha, setZautha] = useState(null);
+	const { ui, appearance, localization, signInUrl, signUpUrl, navigate } = options;
+	useEffect(() => {
+		const instance = new Zautha(publishableKey, {
+			...ui === void 0 ? {} : { ui },
+			...appearance === void 0 ? {} : { appearance },
+			...localization === void 0 ? {} : { localization },
+			...signInUrl === void 0 ? {} : { signInUrl },
+			...signUpUrl === void 0 ? {} : { signUpUrl },
+			...navigate === void 0 ? {} : { navigate }
+		});
+		setZautha(instance);
+		instance.load();
+		return () => {
+			instance.dispose();
+			setZautha(null);
+		};
+	}, [publishableKey]);
+	return /* @__PURE__ */ jsx(ZauthaContext.Provider, {
+		value: zautha,
+		children
+	});
+}
+/** The Zautha instance, or null before the provider has created it. */
+function useZautha() {
+	const zautha = useContext(ZauthaContext);
+	if (zautha === void 0) throw new Error("Zautha hooks and components must be used inside <ZauthaProvider>.");
+	return zautha;
+}
+const NO_STATE = {
+	status: "loading",
+	environment: null,
+	client: null,
+	session: null,
+	user: null
+};
+const noop = () => () => void 0;
+/** Reactive snapshot of the instance state (the loading state before the instance exists). */
+function useZauthaState() {
+	const zautha = useZautha();
+	return useSyncExternalStore(zautha?.subscribe ?? noop, () => zautha?.getSnapshot() ?? NO_STATE, () => NO_STATE);
+}
+//#endregion
+//#region src/hooks.ts
+const isLoadedStatus = (status) => status === "ready" || status === "degraded";
+function useAuth() {
+	const zautha = useZautha();
+	const state = useZauthaState();
+	const getToken = useCallback((options) => zautha?.getToken(options) ?? Promise.resolve(null), [zautha]);
+	const signOut = useCallback((options) => zautha?.signOut(options) ?? Promise.resolve(), [zautha]);
+	const signedIn = state.session !== null;
+	const has = useCallback((params) => signedIn && params.role === void 0 && params.permission === void 0, [signedIn]);
+	return {
+		isLoaded: isLoadedStatus(state.status),
+		isSignedIn: signedIn,
+		userId: state.session?.userId ?? null,
+		sessionId: state.session?.id ?? null,
+		getToken,
+		signOut,
+		has
+	};
+}
+function useUser() {
+	const state = useZauthaState();
+	return {
+		isLoaded: isLoadedStatus(state.status),
+		isSignedIn: state.session !== null,
+		user: state.user
+	};
+}
+function useSession() {
+	const state = useZauthaState();
+	return {
+		isLoaded: isLoadedStatus(state.status),
+		isSignedIn: state.session !== null,
+		session: state.session
+	};
+}
+const noopSubscribe = () => () => void 0;
+function useResource(resource) {
+	return useSyncExternalStore(resource?.subscribe ?? noopSubscribe, () => resource?.snapshot ?? null, () => null);
+}
+const NO_ERRORS = {
+	fields: {},
+	global: []
+};
+function useSignIn() {
+	const zautha = useZautha();
+	const state = useZauthaState();
+	const snapshot = useResource(zautha?.signIn ?? null);
+	return {
+		isLoaded: isLoadedStatus(state.status),
+		signIn: zautha?.signIn ?? null,
+		errors: snapshot?.errors ?? NO_ERRORS,
+		fetchStatus: snapshot?.fetchStatus ?? "idle"
+	};
+}
+function useSignUp() {
+	const zautha = useZautha();
+	const state = useZauthaState();
+	const snapshot = useResource(zautha?.signUp ?? null);
+	return {
+		isLoaded: isLoadedStatus(state.status),
+		signUp: zautha?.signUp ?? null,
+		errors: snapshot?.errors ?? NO_ERRORS,
+		fetchStatus: snapshot?.fetchStatus ?? "idle"
+	};
+}
+//#endregion
+//#region src/control.tsx
+/**
+* Renders `children` when the condition holds, else `fallback`. Renders nothing until Zautha has
+* loaded, so a signed-in user never sees a signed-out flash.
+*/
+function Show(props) {
+	const { isLoaded, isSignedIn, has } = useAuth();
+	if (!isLoaded) return null;
+	const { when } = props;
+	return (when === "signed-in" ? isSignedIn : when === "signed-out" ? !isSignedIn : typeof when === "function" ? when(has) : has(when)) ? props.children : props.fallback ?? null;
+}
+function ZauthaLoading(props) {
+	return useZauthaState().status === "loading" ? props.children : null;
+}
+/** Loaded, including degraded (network trouble after load: last known state is shown). */
+function ZauthaLoaded(props) {
+	const { status } = useZauthaState();
+	return status === "ready" || status === "degraded" ? props.children : null;
+}
+function ZauthaDegraded(props) {
+	return useZauthaState().status === "degraded" ? props.children : null;
+}
+function ZauthaFailed(props) {
+	return useZauthaState().status === "failed" ? props.children : null;
+}
+/** Sends a signed-out visitor to sign-in once loaded; renders nothing. */
+function RedirectToSignIn(props) {
+	const zautha = useZautha();
+	const { isLoaded, isSignedIn } = useAuth();
+	const { redirectUrl } = props;
+	useEffect(() => {
+		if (zautha !== null && isLoaded && !isSignedIn) zautha.redirectToSignIn(redirectUrl === void 0 ? {} : { redirectUrl });
+	}, [
+		zautha,
+		isLoaded,
+		isSignedIn,
+		redirectUrl
+	]);
+	return null;
+}
+function RedirectToSignUp(props) {
+	const zautha = useZautha();
+	const { isLoaded, isSignedIn } = useAuth();
+	const { redirectUrl } = props;
+	useEffect(() => {
+		if (zautha !== null && isLoaded && !isSignedIn) zautha.redirectToSignUp(redirectUrl === void 0 ? {} : { redirectUrl });
+	}, [
+		zautha,
+		isLoaded,
+		isSignedIn,
+		redirectUrl
+	]);
+	return null;
+}
+//#endregion
+//#region src/buttons.tsx
+/** Wraps its single child (or renders a plain button) and wires the click. Unstyled by design. */
+function Trigger(props) {
+	const child = Children.count(props.children) === 1 ? Children.only(props.children) : null;
+	if (isValidElement(child)) {
+		const original = child.props.onClick;
+		return cloneElement(child, { onClick: (event) => {
+			original?.(event);
+			if (!event.defaultPrevented) props.onClick();
+		} });
+	}
+	return /* @__PURE__ */ jsx("button", {
+		type: "button",
+		onClick: props.onClick,
+		children: props.children ?? props.label
+	});
+}
+function SignInButton(props) {
+	const zautha = useZautha();
+	const options = props.redirectUrl === void 0 ? {} : { redirectUrl: props.redirectUrl };
+	return /* @__PURE__ */ jsx(Trigger, {
+		label: "Sign in",
+		onClick: () => props.mode === "modal" ? zautha?.openSignIn(options) : zautha?.redirectToSignIn(options),
+		children: props.children
+	});
+}
+function SignUpButton(props) {
+	const zautha = useZautha();
+	const options = props.redirectUrl === void 0 ? {} : { redirectUrl: props.redirectUrl };
+	return /* @__PURE__ */ jsx(Trigger, {
+		label: "Sign up",
+		onClick: () => props.mode === "modal" ? zautha?.openSignUp(options) : zautha?.redirectToSignUp(options),
+		children: props.children
+	});
+}
+function SignOutButton(props) {
+	const zautha = useZautha();
+	return /* @__PURE__ */ jsx(Trigger, {
+		label: "Sign out",
+		onClick: () => void zautha?.signOut(props.redirectUrl === void 0 ? {} : { redirectUrl: props.redirectUrl }),
+		children: props.children
+	});
+}
+//#endregion
+//#region src/prebuilt.tsx
+/**
+* Mounts a @zautha/ui component into a div once the instance exists; later prop changes update it in
+* place. SSR renders only the empty div.
+*/
+function Mounted(props) {
+	const zautha = useZautha();
+	const ref = useRef(null);
+	const mountedWith = useRef(null);
+	const { name, componentProps } = props;
+	useEffect(() => {
+		const element = ref.current;
+		if (zautha === null || element === null) return;
+		zautha.mount(name, element, componentProps);
+		mountedWith.current = componentProps;
+		return () => {
+			mountedWith.current = null;
+			zautha.unmount(element);
+		};
+	}, [zautha, name]);
+	useEffect(() => {
+		const element = ref.current;
+		if (zautha === null || element === null || mountedWith.current === null || mountedWith.current === componentProps) return;
+		mountedWith.current = componentProps;
+		zautha.updateMounted(element, componentProps);
+	}, [zautha, componentProps]);
+	return /* @__PURE__ */ jsx("div", { ref });
+}
+function SignIn(props) {
+	return /* @__PURE__ */ jsx(Mounted, {
+		name: "SignIn",
+		componentProps: props
+	});
+}
+function SignUp(props) {
+	return /* @__PURE__ */ jsx(Mounted, {
+		name: "SignUp",
+		componentProps: props
+	});
+}
+function UserButton(props) {
+	return /* @__PURE__ */ jsx(Mounted, {
+		name: "UserButton",
+		componentProps: props
+	});
+}
+function OAuthConsent(props) {
+	return /* @__PURE__ */ jsx(Mounted, {
+		name: "OAuthConsent",
+		componentProps: props
+	});
+}
+//#endregion
+export { OAuthConsent, RedirectToSignIn, RedirectToSignUp, Show, SignIn, SignInButton, SignOutButton, SignUp, SignUpButton, UserButton, ZauthaApiError, ZauthaDegraded, ZauthaError, ZauthaFailed, ZauthaLoaded, ZauthaLoading, ZauthaNetworkError, ZauthaOfflineError, ZauthaProvider, isZauthaApiError, isZauthaError, isZauthaNetworkError, isZauthaOfflineError, useAuth, useSession, useSignIn, useSignUp, useUser, useZautha };
+
+//# sourceMappingURL=index.mjs.map

package/dist/index.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.mjs","names":[],"sources":["../src/provider.tsx","../src/hooks.ts","../src/control.tsx","../src/buttons.tsx","../src/prebuilt.tsx"],"sourcesContent":["import { Zautha, type ZauthaOptions, type ZauthaState } from \"@zautha/js\";\nimport { createContext, useContext, useEffect, useState, useSyncExternalStore, type ReactNode } from \"react\";\n\nconst ZauthaContext = createContext<Zautha | null | undefined>(undefined);\n\nexport interface ZauthaProviderProps extends Omit<ZauthaOptions, \"fetch\"> {\n  publishableKey: string;\n  children?: ReactNode;\n}\n\n/**\n * Creates the Zautha instance after mount (never during render, so StrictMode's double mount and SSR\n * create no timers or channels), loads it, and disposes it on unmount. Until then hooks report\n * `isLoaded: false`.\n */\nexport function ZauthaProvider({ publishableKey, children, ...options }: ZauthaProviderProps): ReactNode {\n  const [zautha, setZautha] = useState<Zautha | null>(null);\n  const { ui, appearance, localization, signInUrl, signUpUrl, navigate } = options;\n\n  useEffect(() => {\n    const instance = new Zautha(publishableKey, {\n      ...(ui === undefined ? {} : { ui }),\n      ...(appearance === undefined ? {} : { appearance }),\n      ...(localization === undefined ? {} : { localization }),\n      ...(signInUrl === undefined ? {} : { signInUrl }),\n      ...(signUpUrl === undefined ? {} : { signUpUrl }),\n      ...(navigate === undefined ? {} : { navigate }),\n    });\n    // The instance is an external system: it is created here, never during render, and published through state.\n    // eslint-disable-next-line react-hooks/set-state-in-effect\n    setZautha(instance);\n    void instance.load();\n    return () => {\n      instance.dispose();\n      setZautha(null);\n    };\n    // Appearance/localization objects are read at mount; changing the key re-creates the instance.\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [publishableKey]);\n\n  return <ZauthaContext.Provider value={zautha}>{children}</ZauthaContext.Provider>;\n}\n\n/** The Zautha instance, or null before the provider has created it. */\nexport function useZautha(): Zautha | null {\n  const zautha = useContext(ZauthaContext);\n  if (zautha === undefined) throw new Error(\"Zautha hooks and components must be used inside <ZauthaProvider>.\");\n  return zautha;\n}\n\nconst NO_STATE: ZauthaState = { status: \"loading\", environment: null, client: null, session: null, user: null };\nconst noop = (): (() => void) => () => undefined;\n\n/** Reactive snapshot of the instance state (the loading state before the instance exists). */\nexport function useZauthaState(): ZauthaState {\n  const zautha = useZautha();\n  return useSyncExternalStore(\n    zautha?.subscribe ?? noop,\n    () => zautha?.getSnapshot() ?? NO_STATE,\n    () => NO_STATE,\n  );\n}\n","import type { AttemptErrors, FetchStatus, Session, SignInResource, SignUpResource, User } from \"@zautha/js\";\nimport { useCallback, useSyncExternalStore } from \"react\";\nimport { useZautha, useZauthaState } from \"./provider\";\n\n/** Authorization check. In 3a there are no organization claims yet, so role/permission checks are false. */\nexport type HasParams = { role?: string; permission?: string };\nexport type Has = (params: HasParams) => boolean;\n\nexport interface UseAuthResult {\n  isLoaded: boolean;\n  isSignedIn: boolean;\n  userId: string | null;\n  sessionId: string | null;\n  getToken: (options?: { skipCache?: boolean }) => Promise<string | null>;\n  signOut: (options?: { redirectUrl?: string }) => Promise<void>;\n  has: Has;\n}\n\nconst isLoadedStatus = (status: string): boolean => status === \"ready\" || status === \"degraded\";\n\nexport function useAuth(): UseAuthResult {\n  const zautha = useZautha();\n  const state = useZauthaState();\n  const getToken = useCallback(\n    (options?: { skipCache?: boolean }) => zautha?.getToken(options) ?? Promise.resolve(null),\n    [zautha],\n  );\n  const signOut = useCallback(\n    (options?: { redirectUrl?: string }) => zautha?.signOut(options) ?? Promise.resolve(),\n    [zautha],\n  );\n  const signedIn = state.session !== null;\n  const has = useCallback<Has>(\n    (params) => signedIn && params.role === undefined && params.permission === undefined,\n    [signedIn],\n  );\n  return {\n    isLoaded: isLoadedStatus(state.status),\n    isSignedIn: signedIn,\n    userId: state.session?.userId ?? null,\n    sessionId: state.session?.id ?? null,\n    getToken,\n    signOut,\n    has,\n  };\n}\n\nexport function useUser(): { isLoaded: boolean; isSignedIn: boolean; user: User | null } {\n  const state = useZauthaState();\n  return { isLoaded: isLoadedStatus(state.status), isSignedIn: state.session !== null, user: state.user };\n}\n\nexport function useSession(): { isLoaded: boolean; isSignedIn: boolean; session: Session | null } {\n  const state = useZauthaState();\n  return { isLoaded: isLoadedStatus(state.status), isSignedIn: state.session !== null, session: state.session };\n}\n\nconst noopSubscribe = (): (() => void) => () => undefined;\n\nfunction useResource<T extends SignInResource | SignUpResource>(resource: T | null) {\n  const snapshot = useSyncExternalStore(\n    resource?.subscribe ?? noopSubscribe,\n    () => resource?.snapshot ?? null,\n    () => null,\n  );\n  return snapshot;\n}\n\nexport interface UseSignInResult {\n  isLoaded: boolean;\n  /** The sign-in resource; null until the provider has created the instance. */\n  signIn: SignInResource | null;\n  errors: AttemptErrors;\n  fetchStatus: FetchStatus;\n}\n\nconst NO_ERRORS: AttemptErrors = { fields: {}, global: [] };\n\nexport function useSignIn(): UseSignInResult {\n  const zautha = useZautha();\n  const state = useZauthaState();\n  const snapshot = useResource(zautha?.signIn ?? null);\n  return {\n    isLoaded: isLoadedStatus(state.status),\n    signIn: zautha?.signIn ?? null,\n    errors: snapshot?.errors ?? NO_ERRORS,\n    fetchStatus: snapshot?.fetchStatus ?? \"idle\",\n  };\n}\n\nexport interface UseSignUpResult {\n  isLoaded: boolean;\n  signUp: SignUpResource | null;\n  errors: AttemptErrors;\n  fetchStatus: FetchStatus;\n}\n\nexport function useSignUp(): UseSignUpResult {\n  const zautha = useZautha();\n  const state = useZauthaState();\n  const snapshot = useResource(zautha?.signUp ?? null);\n  return {\n    isLoaded: isLoadedStatus(state.status),\n    signUp: zautha?.signUp ?? null,\n    errors: snapshot?.errors ?? NO_ERRORS,\n    fetchStatus: snapshot?.fetchStatus ?? \"idle\",\n  };\n}\n","import { useEffect, type ReactNode } from \"react\";\nimport { useAuth, type Has, type HasParams } from \"./hooks\";\nimport { useZautha, useZauthaState } from \"./provider\";\n\nexport type ShowWhen = \"signed-in\" | \"signed-out\" | HasParams | ((has: Has) => boolean);\n\n/**\n * Renders `children` when the condition holds, else `fallback`. Renders nothing until Zautha has\n * loaded, so a signed-in user never sees a signed-out flash.\n */\nexport function Show(props: { when: ShowWhen; fallback?: ReactNode; children?: ReactNode }): ReactNode {\n  const { isLoaded, isSignedIn, has } = useAuth();\n  if (!isLoaded) return null;\n  const { when } = props;\n  const pass =\n    when === \"signed-in\"\n      ? isSignedIn\n      : when === \"signed-out\"\n        ? !isSignedIn\n        : typeof when === \"function\"\n          ? when(has)\n          : has(when);\n  return pass ? props.children : (props.fallback ?? null);\n}\n\nexport function ZauthaLoading(props: { children?: ReactNode }): ReactNode {\n  return useZauthaState().status === \"loading\" ? props.children : null;\n}\n\n/** Loaded, including degraded (network trouble after load: last known state is shown). */\nexport function ZauthaLoaded(props: { children?: ReactNode }): ReactNode {\n  const { status } = useZauthaState();\n  return status === \"ready\" || status === \"degraded\" ? props.children : null;\n}\n\nexport function ZauthaDegraded(props: { children?: ReactNode }): ReactNode {\n  return useZauthaState().status === \"degraded\" ? props.children : null;\n}\n\nexport function ZauthaFailed(props: { children?: ReactNode }): ReactNode {\n  return useZauthaState().status === \"failed\" ? props.children : null;\n}\n\n/** Sends a signed-out visitor to sign-in once loaded; renders nothing. */\nexport function RedirectToSignIn(props: { redirectUrl?: string }): ReactNode {\n  const zautha = useZautha();\n  const { isLoaded, isSignedIn } = useAuth();\n  const { redirectUrl } = props;\n  useEffect(() => {\n    if (zautha !== null && isLoaded && !isSignedIn)\n      zautha.redirectToSignIn(redirectUrl === undefined ? {} : { redirectUrl });\n  }, [zautha, isLoaded, isSignedIn, redirectUrl]);\n  return null;\n}\n\nexport function RedirectToSignUp(props: { redirectUrl?: string }): ReactNode {\n  const zautha = useZautha();\n  const { isLoaded, isSignedIn } = useAuth();\n  const { redirectUrl } = props;\n  useEffect(() => {\n    if (zautha !== null && isLoaded && !isSignedIn)\n      zautha.redirectToSignUp(redirectUrl === undefined ? {} : { redirectUrl });\n  }, [zautha, isLoaded, isSignedIn, redirectUrl]);\n  return null;\n}\n","import { Children, cloneElement, isValidElement, type MouseEvent, type ReactElement, type ReactNode } from \"react\";\nimport { useZautha } from \"./provider\";\n\ninterface ButtonProps {\n  /** `redirect` (default) goes to the sign-in page; `modal` opens the prebuilt component (needs `ui`). */\n  mode?: \"redirect\" | \"modal\";\n  redirectUrl?: string;\n  children?: ReactNode;\n}\n\n/** Wraps its single child (or renders a plain button) and wires the click. Unstyled by design. */\nfunction Trigger(props: { children: ReactNode; label: string; onClick: () => void }): ReactNode {\n  const child = Children.count(props.children) === 1 ? Children.only(props.children) : null;\n  if (isValidElement<{ onClick?: (event: MouseEvent) => void }>(child)) {\n    const original = child.props.onClick;\n    return cloneElement(child as ReactElement<{ onClick?: (event: MouseEvent) => void }>, {\n      onClick: (event: MouseEvent) => {\n        original?.(event);\n        if (!event.defaultPrevented) props.onClick();\n      },\n    });\n  }\n  return (\n    <button type=\"button\" onClick={props.onClick}>\n      {props.children ?? props.label}\n    </button>\n  );\n}\n\nexport function SignInButton(props: ButtonProps): ReactNode {\n  const zautha = useZautha();\n  const options = props.redirectUrl === undefined ? {} : { redirectUrl: props.redirectUrl };\n  return (\n    <Trigger\n      label=\"Sign in\"\n      onClick={() => (props.mode === \"modal\" ? zautha?.openSignIn(options) : zautha?.redirectToSignIn(options))}\n    >\n      {props.children}\n    </Trigger>\n  );\n}\n\nexport function SignUpButton(props: ButtonProps): ReactNode {\n  const zautha = useZautha();\n  const options = props.redirectUrl === undefined ? {} : { redirectUrl: props.redirectUrl };\n  return (\n    <Trigger\n      label=\"Sign up\"\n      onClick={() => (props.mode === \"modal\" ? zautha?.openSignUp(options) : zautha?.redirectToSignUp(options))}\n    >\n      {props.children}\n    </Trigger>\n  );\n}\n\nexport function SignOutButton(props: { redirectUrl?: string; children?: ReactNode }): ReactNode {\n  const zautha = useZautha();\n  return (\n    <Trigger\n      label=\"Sign out\"\n      onClick={() => void zautha?.signOut(props.redirectUrl === undefined ? {} : { redirectUrl: props.redirectUrl })}\n    >\n      {props.children}\n    </Trigger>\n  );\n}\n","import type { UiComponentName } from \"@zautha/js\";\nimport { useEffect, useRef, type ReactNode } from \"react\";\nimport { useZautha } from \"./provider\";\n\n/**\n * Mounts a @zautha/ui component into a div once the instance exists; later prop changes update it in\n * place. SSR renders only the empty div.\n */\nfunction Mounted(props: { name: UiComponentName; componentProps: object }): ReactNode {\n  const zautha = useZautha();\n  const ref = useRef<HTMLDivElement>(null);\n  const mountedWith = useRef<object | null>(null);\n  const { name, componentProps } = props;\n\n  useEffect(() => {\n    const element = ref.current;\n    if (zautha === null || element === null) return;\n    zautha.mount(name, element, componentProps);\n    mountedWith.current = componentProps;\n    return () => {\n      mountedWith.current = null;\n      zautha.unmount(element);\n    };\n    // componentProps changes are applied by the effect below without remounting.\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [zautha, name]);\n\n  useEffect(() => {\n    const element = ref.current;\n    if (zautha === null || element === null || mountedWith.current === null || mountedWith.current === componentProps)\n      return;\n    mountedWith.current = componentProps;\n    zautha.updateMounted(element, componentProps);\n  }, [zautha, componentProps]);\n\n  return <div ref={ref} />;\n}\n\n// Prop types live in @zautha/ui; they are structural here so @zautha/react has no runtime dependency on it.\nexport function SignIn(props: import(\"@zautha/ui\").SignInProps): ReactNode {\n  return <Mounted name=\"SignIn\" componentProps={props} />;\n}\n\nexport function SignUp(props: import(\"@zautha/ui\").SignUpProps): ReactNode {\n  return <Mounted name=\"SignUp\" componentProps={props} />;\n}\n\nexport function UserButton(props: import(\"@zautha/ui\").UserButtonProps): ReactNode {\n  return <Mounted name=\"UserButton\" componentProps={props} />;\n}\n\nexport function OAuthConsent(props: import(\"@zautha/ui\").OAuthConsentProps): ReactNode {\n  return <Mounted name=\"OAuthConsent\" componentProps={props} />;\n}\n"],"mappings":"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"}

package/package.json

@@ -0,0 +1,82 @@
+{
+  "name": "@zautha/react",
+  "version": "0.1.0",
+  "private": false,
+  "description": "React bindings for Zautha: provider, hooks, <Show>, buttons and prebuilt components.",
+  "license": "MIT",
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/hasanyalmanbas/zautha.git",
+    "directory": "web/packages/react"
+  },
+  "type": "module",
+  "sideEffects": false,
+  "exports": {
+    ".": {
+      "import": {
+        "types": "./dist/index.d.mts",
+        "default": "./dist/index.mjs"
+      },
+      "require": {
+        "types": "./dist/index.d.cts",
+        "default": "./dist/index.cjs"
+      }
+    }
+  },
+  "main": "./dist/index.cjs",
+  "module": "./dist/index.mjs",
+  "types": "./dist/index.d.cts",
+  "files": [
+    "dist",
+    "LICENSE"
+  ],
+  "dependencies": {
+    "@zautha/js": "^0.1.0"
+  },
+  "peerDependencies": {
+    "react": "^19.0.0",
+    "react-dom": "^19.0.0",
+    "@zautha/ui": "^0.1.0"
+  },
+  "devDependencies": {
+    "@size-limit/preset-small-lib": "14.0.1",
+    "@testing-library/react": "16.3.3",
+    "@testing-library/user-event": "14.6.7",
+    "@types/react": "19.3.0",
+    "@types/react-dom": "19.3.0",
+    "@zautha/ui": "0.1.0",
+    "happy-dom": "20.14.5",
+    "msw": "2.15.0",
+    "react": "19.3.0",
+    "react-dom": "19.3.0",
+    "size-limit": "14.0.1",
+    "tsdown": "0.23.0",
+    "typescript": "6.0.3",
+    "vitest": "5.0.2"
+  },
+  "size-limit": [
+    {
+      "path": "dist/index.mjs",
+      "limit": "4 kB",
+      "ignore": [
+        "react",
+        "react-dom",
+        "@zautha/js"
+      ]
+    }
+  ],
+  "peerDependenciesMeta": {
+    "@zautha/ui": {
+      "optional": true
+    }
+  },
+  "publishConfig": {
+    "access": "public"
+  },
+  "scripts": {
+    "build": "tsdown",
+    "typecheck": "tsc --noEmit",
+    "test": "vitest run",
+    "size": "size-limit"
+  }
+}