@strivacity/sdk-svelte 3.0.2 → 4.0.0-beta.0

package/dist/server/utils.cjs

@@ -0,0 +1 @@
+require("../assets/rolldown-runtime.cjs");var e=require("@strivacity/sdk-core/utils");Object.keys(e).forEach(function(t){t!=="default"&&!Object.prototype.hasOwnProperty.call(exports,t)&&Object.defineProperty(exports,t,{enumerable:!0,get:function(){return e[t]}})});

package/dist/server/utils.d.ts

@@ -0,0 +1 @@
+export * from '@strivacity/sdk-core/utils';

package/dist/server/utils.mjs

@@ -0,0 +1 @@
+export*from"@strivacity/sdk-core/utils";

package/dist/types.cjs

@@ -1,2 +1 @@
-"use strict";
-//# sourceMappingURL=types.cjs.map
+require("./assets/rolldown-runtime.cjs"),require("./client/types.cjs"),require("./server/types.cjs");var e=require("@strivacity/sdk-core/types");Object.keys(e).forEach(function(t){t!=="default"&&!Object.prototype.hasOwnProperty.call(exports,t)&&Object.defineProperty(exports,t,{enumerable:!0,get:function(){return e[t]}})});

package/dist/types.d.ts

@@ -1,181 +1,2 @@
-import { IdTokenClaims, LoginFlowMessage, LoginFlowState, SDKOptions } from '@strivacity/sdk-core';
-import { PopupFlow } from '@strivacity/sdk-core/flows/PopupFlow';
-import { RedirectFlow } from '@strivacity/sdk-core/flows/RedirectFlow';
-import { NativeFlow } from '@strivacity/sdk-core/flows/NativeFlow';
-/**
- * Represents the session state, including authentication details and token information.
- */
-export type State = {
-    /**
-     * Indicates if the session is being loaded.
-     */
-    loading: boolean;
-    /**
-     * The SDK options used to configure the session.
-     */
-    options: SDKOptions;
-    /**
-     * Indicates whether the user is authenticated.
-     */
-    isAuthenticated: boolean;
-    /**
-     * Claims from the ID token or `null` if not available.
-     */
-    idTokenClaims: IdTokenClaims | null;
-    /**
-     * The access token or `null` if not available.
-     */
-    accessToken: string | null;
-    /**
-     * The refresh token or `null` if not available.
-     */
-    refreshToken: string | null;
-    /**
-     * Indicates if the access token has expired.
-     */
-    accessTokenExpired: boolean;
-    /**
-     * Expiration date of the access token or `null` if not set.
-     */
-    accessTokenExpirationDate: number | null;
-};
-/**
- * Represents the available authentication flows and operations for Popup-based interactions.
- */
-export type PopupSDK = {
-    /**
-     * Represents the SDK instance.
-     */
-    sdk: InstanceType<typeof PopupFlow>;
-    /**
-     * Initiates the login process.
-     */
-    login: InstanceType<typeof PopupFlow>['login'];
-    /**
-     * Registers a new user.
-     */
-    register: InstanceType<typeof PopupFlow>['register'];
-    /**
-     * Initiates the entry process.
-     */
-    entry: InstanceType<typeof PopupFlow>['entry'];
-    /**
-     * Refreshes the user's session.
-     */
-    refresh: InstanceType<typeof PopupFlow>['refresh'];
-    /**
-     * Revokes the current session tokens.
-     */
-    revoke: InstanceType<typeof PopupFlow>['revoke'];
-    /**
-     * Logs out the user.
-     */
-    logout: InstanceType<typeof PopupFlow>['logout'];
-    /**
-     * Handles the callback after authentication or token exchange.
-     */
-    handleCallback: InstanceType<typeof PopupFlow>['handleCallback'];
-};
-/**
- * Represents the available authentication flows and operations for Redirect-based interactions.
- */
-export type RedirectSDK = {
-    /**
-     * Represents the SDK instance.
-     */
-    sdk: InstanceType<typeof RedirectFlow>;
-    /**
-     * Initiates the login process.
-     */
-    login: InstanceType<typeof RedirectFlow>['login'];
-    /**
-     * Registers a new user.
-     */
-    register: InstanceType<typeof RedirectFlow>['register'];
-    /**
-     * Initiates the entry process.
-     */
-    entry: InstanceType<typeof RedirectFlow>['entry'];
-    /**
-     * Refreshes the user's session.
-     */
-    refresh: InstanceType<typeof RedirectFlow>['refresh'];
-    /**
-     * Revokes the current session tokens.
-     */
-    revoke: InstanceType<typeof RedirectFlow>['revoke'];
-    /**
-     * Logs out the user.
-     */
-    logout: InstanceType<typeof RedirectFlow>['logout'];
-    /**
-     * Handles the callback after authentication or token exchange.
-     */
-    handleCallback: InstanceType<typeof RedirectFlow>['handleCallback'];
-};
-/**
- * Represents the available authentication flows and operations for Native-based interactions.
- */
-export type NativeSDK = {
-    /**
-     * Represents the SDK instance.
-     */
-    sdk: InstanceType<typeof NativeFlow>;
-    /**
-     * Initiates the login process.
-     */
-    login: InstanceType<typeof NativeFlow>['login'];
-    /**
-     * Registers a new user.
-     */
-    register: InstanceType<typeof NativeFlow>['register'];
-    /**
-     * Initiates the entry process.
-     */
-    entry: InstanceType<typeof NativeFlow>['entry'];
-    /**
-     * Refreshes the user's session.
-     */
-    refresh: InstanceType<typeof NativeFlow>['refresh'];
-    /**
-     * Revokes the current session tokens.
-     */
-    revoke: InstanceType<typeof NativeFlow>['revoke'];
-    /**
-     * Logs out the user.
-     */
-    logout: InstanceType<typeof NativeFlow>['logout'];
-    /**
-     * Handles the callback after authentication or token exchange.
-     */
-    handleCallback: InstanceType<typeof NativeFlow>['handleCallback'];
-};
-/**
- * Represents a combined context for Popup-based flows, containing both the Popup SDK and the session state.
- */
-export type PopupContext = PopupSDK & {
-    state: State;
-};
-/**
- * Represents a combined context for Redirect-based flows, containing both the Redirect SDK and the session state.
- */
-export type RedirectContext = RedirectSDK & {
-    state: State;
-};
-/**
- * Represents a combined context for Native-based flows, containing both the Native SDK and the session state.
- */
-export type NativeContext = NativeSDK & {
-    state: State;
-};
-export type NativeFlowContextValue = {
-    loading: boolean;
-    forms: Record<string, Record<string, unknown>>;
-    messages: Record<string, Record<string, LoginFlowMessage>>;
-    state: Partial<LoginFlowState>;
-    submitForm: (formId: string) => Promise<void>;
-    triggerFallback: (hostedUrl?: string) => void;
-    triggerClose: () => void;
-    setFormValue: (formId: string, widgetId: string, value: unknown) => void;
-    setMessage: (formId: string, widgetId: string, value: LoginFlowMessage) => void;
-};
+export * from './client/types';
+export * from './server/types';

package/dist/types.mjs

@@ -1,2 +1 @@
-
-//# sourceMappingURL=types.mjs.map
+import"./client/types.mjs";import"./server/types.mjs";export*from"@strivacity/sdk-core/types";

package/eslint.config.mjs

@@ -0,0 +1,3 @@
+import { defineSvelteConfig } from '../../eslint.config.base.mjs';
+
+export default defineSvelteConfig();

package/package.json

@@ -1,27 +1,75 @@
 {
   "name": "@strivacity/sdk-svelte",
-  "version": "3.0.2",
-  "license": "MIT",
+  "version": "4.0.0-beta.0",
   "description": "Strivacity Svelte SDK client",
+  "license": "MIT",
   "author": "strivacity <opensource@strivacity.com>",
   "repository": {
     "type": "git",
     "url": "https://github.com/Strivacity/sdk-js"
   },
+  "main": "./dist/index.cjs",
+  "types": "./dist/index.d.ts",
+  "exports": {
+    "./client": {
+      "types": "./dist/client/index.d.ts",
+      "import": "./dist/client/index.mjs",
+      "require": "./dist/client/index.cjs",
+      "default": "./dist/client/index.mjs"
+    },
+    "./client/*": {
+      "types": "./dist/client/*.d.ts",
+      "import": "./dist/client/*.mjs",
+      "require": "./dist/client/*.cjs",
+      "default": "./dist/client/*.mjs"
+    },
+    "./client/components": {
+      "types": "./dist/client/components.svelte.d.ts",
+      "import": "./dist/client/components.svelte.mjs",
+      "require": "./dist/client/components.svelte.cjs",
+      "default": "./dist/client/components.svelte.mjs"
+    },
+    "./client/hooks": {
+      "types": "./dist/client/hooks.svelte.d.ts",
+      "import": "./dist/client/hooks.svelte.mjs",
+      "require": "./dist/client/hooks.svelte.cjs",
+      "default": "./dist/client/hooks.svelte.mjs"
+    },
+    "./server": {
+      "types": "./dist/server/index.d.ts",
+      "import": "./dist/server/index.mjs",
+      "require": "./dist/server/index.cjs",
+      "default": "./dist/server/index.mjs"
+    },
+    "./server/*": {
+      "types": "./dist/server/*.d.ts",
+      "import": "./dist/server/*.mjs",
+      "require": "./dist/server/*.cjs",
+      "default": "./dist/server/*.mjs"
+    },
+    "./errors": {
+      "types": "./dist/errors.d.ts",
+      "import": "./dist/errors.mjs",
+      "require": "./dist/errors.cjs",
+      "default": "./dist/errors.mjs"
+    },
+    "./types": {
+      "types": "./dist/types.d.ts",
+      "import": "./dist/types.mjs",
+      "require": "./dist/types.cjs",
+      "default": "./dist/types.mjs"
+    }
+  },
   "dependencies": {
-    "@strivacity/sdk-core": "3.0.2"
+    "@strivacity/sdk-core": "4.0.0-beta.0"
   },
   "peerDependencies": {
+    "@sveltejs/kit": ">=2",
     "svelte": ">=5"
   },
-  "main": "./dist/index.cjs",
-  "types": "./dist/index.d.ts",
-  "exports": {
-    ".": {
-      "types": "./dist/index.d.ts",
-      "import": "./dist/index.mjs",
-      "require": "./dist/index.cjs",
-      "default": "./dist/index.mjs"
+  "peerDependenciesMeta": {
+    "@sveltejs/kit": {
+      "optional": true
     }
   }
 }

package/project.json

@@ -0,0 +1,47 @@
+{
+  "$schema": "../../node_modules/nx/schemas/project-schema.json",
+  "name": "sdk-svelte",
+  "projectType": "library",
+  "sourceRoot": "packages/sdk-svelte/src",
+  "targets": {
+    "type-check": {
+      "executor": "nx:run-commands",
+      "dependsOn": ["sdk-core:build"],
+      "options": {
+        "cwd": "packages/sdk-svelte",
+        "command": "svelte-check --tsconfig ./tsconfig.app.json"
+      }
+    },
+    "build": {
+      "executor": "nx:run-commands",
+      "dependsOn": ["type-check"],
+      "outputs": ["{workspaceRoot}/packages/sdk-svelte/dist"],
+      "defaultConfiguration": "development",
+      "options": {
+        "cwd": "packages/sdk-svelte"
+      },
+      "configurations": {
+        "serve": {
+          "mode": "development",
+          "command": "vite build --watch"
+        },
+        "development": {
+          "mode": "development",
+          "command": "vite build"
+        },
+        "production": {
+          "mode": "production",
+          "command": "vite build"
+        }
+      }
+    },
+    "test": {
+      "executor": "nx:run-commands",
+      "dependsOn": ["build"],
+      "options": {
+        "cwd": "packages/sdk-svelte",
+        "command": "vitest"
+      }
+    }
+  }
+}

package/src/client/components.svelte.ts

@@ -0,0 +1,125 @@
+import { setContext, onDestroy } from 'svelte';
+import { initFlow } from '@strivacity/sdk-core';
+import type { IdTokenClaims, RedirectFlow, PopupFlow, EmbeddedFlow, NativeFlow, SDKContext, SDKInstance, StyAuthProviderProps } from '../types';
+import { STRIVACITY_SDK } from './hooks.svelte';
+
+/**
+ * The `StyAuthProvider` component is a Svelte context provider that initializes the Strivacity SDK and provides its state and methods to the rest of the application.
+ *
+ * @param {StyAuthProviderProps} props - The properties for the `StyAuthProvider` component.
+ * @param {SDKInitConfig} props.options - The configuration options for initializing the Strivacity SDK.
+ * @param {() => SessionData | null | undefined} [props.session] - Optional getter for session data to initialize/refresh the SDK with.
+ *
+ * @returns {SDKContext<RedirectFlow | PopupFlow | NativeFlow | EmbeddedFlow>} A Svelte context provider that wraps its children and provides access to the Strivacity SDK.
+ */
+export function createStyAuthProvider(props: StyAuthProviderProps): SDKContext<RedirectFlow | PopupFlow | NativeFlow | EmbeddedFlow> {
+	let sdk: SDKInstance;
+	let subscriptions: ReturnType<SDKInstance['subscribeToAllEvents']> | null = null;
+
+	let loading = $state<boolean>(true);
+	let language = $state<string>(globalThis.navigator?.language ?? 'en-US');
+	let isAuthenticated = $state<boolean>(false);
+	let idTokenClaims = $state<IdTokenClaims | null>(null);
+	let accessToken = $state<string | null>(null);
+	let refreshToken = $state<string | null>(null);
+	let accessTokenExpired = $state<boolean>(true);
+	let accessTokenExpirationDate = $state<number | null>(null);
+
+	const updateSession = async () => {
+		const authenticated = await sdk.isAuthenticated;
+
+		if (loading) {
+			loading = false;
+		}
+		if (sdk.language !== language) {
+			language = sdk.language;
+		}
+		if (authenticated !== isAuthenticated) {
+			isAuthenticated = authenticated;
+		}
+		if (sdk.idTokenClaims !== idTokenClaims) {
+			idTokenClaims = sdk.idTokenClaims || null;
+		}
+		if (sdk.accessToken !== accessToken) {
+			accessToken = sdk.accessToken || null;
+		}
+		if (sdk.refreshToken !== refreshToken) {
+			refreshToken = sdk.refreshToken || null;
+		}
+		if (sdk.accessTokenExpired !== accessTokenExpired) {
+			accessTokenExpired = sdk.accessTokenExpired;
+		}
+		if (sdk.accessTokenExpirationDate !== accessTokenExpirationDate) {
+			accessTokenExpirationDate = sdk.accessTokenExpirationDate || null;
+		}
+	};
+
+	function onInit() {
+		sdk = initFlow(props.options as never);
+		subscriptions = sdk.subscribeToAllEvents(updateSession);
+
+		$effect(() => {
+			const session = props.session?.();
+
+			if (session) {
+				sdk.session = session;
+			}
+
+			void updateSession();
+		});
+	}
+
+	onDestroy(() => {
+		subscriptions?.dispose();
+	});
+
+	if (typeof window !== 'undefined') {
+		onInit();
+	}
+
+	const contextValue: SDKContext<RedirectFlow | PopupFlow | NativeFlow | EmbeddedFlow> = {
+		get sdk() {
+			return sdk;
+		},
+		get loading() {
+			return loading;
+		},
+		get language() {
+			return language;
+		},
+		get isAuthenticated() {
+			return isAuthenticated;
+		},
+		get idTokenClaims() {
+			return idTokenClaims;
+		},
+		get accessToken() {
+			return accessToken;
+		},
+		get refreshToken() {
+			return refreshToken;
+		},
+		get accessTokenExpired() {
+			return accessTokenExpired;
+		},
+		get accessTokenExpirationDate() {
+			return accessTokenExpirationDate;
+		},
+		init: () => sdk.init(),
+		subscribeToEvent: ((...args: Parameters<typeof sdk.subscribeToEvent>) => sdk.subscribeToEvent(...args)) as typeof sdk.subscribeToEvent,
+		subscribeToAllEvents: (...args: Parameters<typeof sdk.subscribeToAllEvents>) => sdk.subscribeToAllEvents(...args),
+		checkAuthentication: (...args: Parameters<typeof sdk.checkAuthentication>) => sdk.checkAuthentication(...args),
+		tokenExchange: (...args: Parameters<typeof sdk.tokenExchange>) => sdk.tokenExchange(...args),
+		handleCallback: (...args: Parameters<typeof sdk.handleCallback>) => sdk.handleCallback(...args),
+		refresh: () => sdk.refresh(),
+		revoke: () => sdk.revoke(),
+		logout: (...args: Parameters<typeof sdk.logout>) => sdk.logout(...args),
+		login: (...args: Parameters<typeof sdk.login>) => sdk.login(...args),
+		register: (...args: Parameters<typeof sdk.register>) => sdk.register(...args),
+		entry: (...args: Parameters<typeof sdk.entry>) => sdk.entry(...args),
+	};
+
+	setContext(STRIVACITY_SDK, contextValue);
+
+	return contextValue;
+}

package/src/client/hooks.svelte.ts

@@ -0,0 +1,221 @@
+import { getContext, setContext, onMount, onDestroy } from 'svelte';
+import { SvelteURL } from 'svelte/reactivity';
+import type { RedirectFlow, PopupFlow, EmbeddedFlow, NativeFlow, NativeParams, NativeFlowState, NativeFlowMessage } from '@strivacity/sdk-core/types';
+import type { LoginContext, SDKContext, UseNativeLoginOptions } from '../types';
+import { FallbackError } from '@strivacity/sdk-core/utils/errors';
+import { unflattenObject } from '@strivacity/sdk-core/utils';
+
+export const STRIVACITY_SDK = Symbol('strivacity-sdk');
+export const STRIVACITY_LOGIN_CONTEXT = Symbol('strivacity-login-context');
+
+/**
+ * Access the Strivacity SDK context.
+ *
+ * @template T - The type of the Strivacity SDK flow (RedirectFlow, PopupFlow, NativeFlow, or EmbeddedFlow).
+ * @returns {SDKContext<T>} - The Strivacity SDK context.
+ * @throws {Error} - If the Strivacity SDK context is not found.
+ */
+export const useStrivacity = <
+	T extends RedirectFlow | PopupFlow | NativeFlow | EmbeddedFlow = RedirectFlow | PopupFlow | NativeFlow | EmbeddedFlow,
+>(): SDKContext<T> => {
+	const context = getContext<SDKContext<T>>(STRIVACITY_SDK);
+
+	if (!context) {
+		throw new Error('Missing SDK context');
+	}
+
+	return context;
+};
+
+/**
+ * Access the Strivacity SDK context specifically for native login flow.
+ *
+ * @returns {LoginContext} - The native flow context.
+ * @throws {Error} - If the Strivacity SDK context is not found.
+ */
+export const useNativeLoginContext = (): LoginContext => {
+	const context = getContext<LoginContext>(STRIVACITY_LOGIN_CONTEXT);
+
+	if (!context) {
+		throw new Error('Missing SDK native login context');
+	}
+
+	return context;
+};
+
+/**
+ * Manages a native login flow session.
+ *
+ * @param {UseNativeLoginOptions} [options] - Optional options for the login session.
+ * @returns {LoginContext} - The native flow context.
+ * @throws {Error} - If the Strivacity SDK context is not found.
+ */
+export function useNativeLogin(options: UseNativeLoginOptions = {}): LoginContext {
+	const abortController = new AbortController();
+	const ctx = useStrivacity<NativeFlow>();
+
+	let loading = $state<boolean>(true);
+	let forms = $state<Record<string, Record<string, unknown>>>({});
+	let messages = $state<Record<string, Record<string, NativeFlowMessage>>>({});
+	let state = $state<Partial<NativeFlowState>>({});
+
+	onMount(async () => {
+		await ctx.init();
+
+		try {
+			await startSession(options.params);
+		} catch (error) {
+			if (error instanceof DOMException && error.name === 'AbortError') {
+				return;
+			}
+
+			ctx.sdk.logging?.error('Error fetching authorization URI', error as Error);
+			void options.onError?.(error as Error);
+			loading = false;
+		}
+	});
+
+	onDestroy(() => {
+		abortController.abort();
+	});
+
+	async function startSession(loginParams: NativeParams = {}) {
+		try {
+			loading = true;
+
+			const nextState = await ctx.sdk.startSession(loginParams);
+
+			if (nextState) {
+				handleResponse(nextState);
+			}
+		} catch (error) {
+			if (error instanceof FallbackError) {
+				ctx.sdk.logging?.error('Fallback error occurred', error);
+				void options.onFallback?.(error);
+			} else {
+				ctx.sdk.logging?.error('Error starting session', error as Error);
+				void options.onError?.(error as Error);
+			}
+		}
+	}
+
+	function handleResponse(nextState: Partial<NativeFlowState>) {
+		if (ctx.sdk.session) {
+			return void options.onLogin?.(ctx.sdk.session);
+		}
+
+		const newState: NativeFlowState = {
+			hostedUrl: nextState?.hostedUrl ?? state.hostedUrl,
+			finalizeUrl: nextState?.finalizeUrl ?? state.finalizeUrl,
+			screen: nextState?.screen ?? state.screen,
+			forms: nextState?.forms ?? state.forms,
+			layout: nextState?.layout ?? state.layout,
+			messages: nextState?.messages ?? {},
+			branding: nextState?.branding ?? state.branding,
+		};
+
+		if (newState.screen !== state.screen) {
+			forms = {};
+			messages = {};
+
+			for (const form of newState.forms ?? []) {
+				forms[form.id] = {};
+				messages[form.id] = {};
+			}
+		} else {
+			ctx.sdk.logging?.info(`Updating screen: ${newState.screen}`);
+		}
+
+		for (const formId of Object.keys(newState.messages ?? {})) {
+			if (formId === 'global') {
+				// eslint-disable-next-line @typescript-eslint/no-non-null-asserted-optional-chain
+				void options.onGlobalMessage?.(newState.messages?.global!);
+			} else {
+				messages[formId] = newState.messages![formId] ?? {};
+			}
+		}
+
+		state = newState;
+
+		if (!newState.finalizeUrl) {
+			loading = false;
+		}
+	}
+
+	function triggerFallback(message?: string) {
+		ctx.sdk.logging?.warn(message ? `Triggering fallback due to: ${message}` : 'Triggering fallback');
+
+		if (!state.hostedUrl) {
+			const error = new Error('No hosted URL provided');
+			ctx.sdk.logging?.error('Fallback error', error);
+			throw error;
+		}
+
+		void options.onFallback?.(new FallbackError(new SvelteURL(state.hostedUrl)));
+	}
+
+	function triggerClose() {
+		ctx.sdk.logging?.debug('Triggering close');
+		void options.onClose?.();
+	}
+
+	async function submitForm(formId: string, customBody?: Record<string, unknown>) {
+		try {
+			loading = true;
+
+			const nextState = await ctx.sdk.submitForm(formId, customBody ?? unflattenObject(forms[formId] ?? {}));
+
+			if (nextState) {
+				handleResponse(nextState);
+			}
+		} catch (error) {
+			if (error instanceof FallbackError) {
+				ctx.sdk.logging?.error('Fallback error occurred', error);
+				void options.onFallback?.(error);
+			} else {
+				ctx.sdk.logging?.error('Error submitting form', error as Error);
+				void options.onError?.(error as Error);
+			}
+		}
+	}
+
+	function setFormValue(formId: string, widgetId: string, value: unknown) {
+		if (forms[formId] === undefined) {
+			forms[formId] = {};
+		}
+
+		forms[formId][widgetId] = value === '' ? null : value;
+	}
+
+	function setMessage(formId: string, widgetId: string, value: NativeFlowMessage) {
+		if (messages[formId] === undefined) {
+			messages[formId] = {};
+		}
+
+		messages[formId][widgetId] = value;
+	}
+
+	const context: LoginContext = {
+		get loading() {
+			return loading;
+		},
+		get forms() {
+			return forms;
+		},
+		get messages() {
+			return messages;
+		},
+		get state() {
+			return state;
+		},
+		triggerFallback,
+		triggerClose,
+		submitForm,
+		setFormValue,
+		setMessage,
+	};
+
+	setContext(STRIVACITY_LOGIN_CONTEXT, context);
+
+	return context;
+}