@schibsted/account-sdk-browser 6.0.0-alpha.1 → 6.0.0-alpha.3

package/README.md

@@ -24,11 +24,12 @@ For example if your `pre` domain is pre.sdk-example.com, and it uses id.pre.sdk-
 domain, your local domain should be local.sdk-example.com.
 
 1. Do `npm install --save @schibsted/account-sdk-browser`
-2. Use this library as you would any other npm module: `import { Identity, Monetization, Payment } from '@schibsted/account-sdk-browser'`.
+2. Use this library as you would any other npm module: `import { createAccountSdk, getAccountSdk } from '@schibsted/account-sdk-browser'`.
 3. Build your site as you prefer. This library is published as ES modules and uses modern JavaScript
    syntax (including async/await and other ES2017 and WHATWG features). We recommend that you do
    any transpilation yourself for the browser versions you need to cater to. We do not add polyfills.
-4. Initiate the SDK and provide at least `clientId`, `env` and `sessionDomain`.
+4. Initiate the SDK with `createAccountSdk` and provide `clientId`, `redirectUri` and `sessionDomain`.
+   Set `env` if you do not want to use the default `PRE` environment.
 
 If this is for a new site and there is no sessionDomain yet, contact
 [support](mailto:schibstedaccount@schibsted.com) to initiate the process.
@@ -41,8 +42,8 @@ Follow the [migration guide](./MIGRATION.md).
 
 1. Ensure that your site has no site specific terms and conditions in the Schibsted account login flow.
 1. Define rules for when and how often the simplified login prompt should be shown to unique users on your site. How you do this is up to you, but we recommend starting with showing the prompt once per user before potentially increasing this frequency over time.
-1. Set up a function to check if users landing on your domain [is logged in](https://schibsted.github.io/account-sdk-browser/Identity.html#isLoggedIn) to your site.
-1. If the user is not logged-in to your site, call the [showSimplifiedLoginWidget](https://schibsted.github.io/account-sdk-browser/Identity.html#showSimplifiedLoginWidget) function. The `showSimplifiedLoginWidget` accepts the same params as login function (`state` is required, it might be string or async function). If the simplified login prompt is to be loaded, `showSimplifiedLoginWidget` will return `true`.
+1. Set up a function to check if users landing on your domain [are logged in](https://schibsted.github.io/account-sdk-browser/classes/Account.html#isloggedin) to your site.
+1. If the user is not logged-in to your site, call the [showSimplifiedLoginWidget](https://schibsted.github.io/account-sdk-browser/classes/Account.html#showsimplifiedloginwidget) function. The `showSimplifiedLoginWidget` accepts the same params as login function (`state` is required, it might be string or async function). If the simplified login prompt is to be loaded, `showSimplifiedLoginWidget` will return `true`.
 1. Set up a way to store information about which users have been shown the simplified login prompt. How you do this is up to you, but one way is to use localStorage. Use this information to execute on the rules defined in #2.
 
 ## Example project
@@ -65,39 +66,35 @@ This allows you to call Schibsted Account APIs on behalf of that user.
 
 ## Events
 
-The SDK fires events on the instances when something we deem interesting is happening. For example the
-[Identity](https://schibsted.github.io/account-sdk-browser/Identity.html) class
-emits some events when the user is logged in or logged out. This SDK uses a familar interface that's
-very similar to Node's [EventEmitter](https://nodejs.org/api/events.html). The most important
+The SDK fires events on the Account instance when something we deem interesting is happening. For
+example, the Account instance emits events when the user is logged in or logged out. This SDK uses a
+familiar interface that's very similar to Node's [EventEmitter](https://nodejs.org/api/events.html). The most important
 methods are `.on(eventName, listener)` (to subscribe to an event) and `.off(eventName, listener)`
 (to unsubscribe to an event).
 
-The SDK also emits global events on the `window` when a new instance is created.
-Events are emitted for:
+The SDK also emits a global event on the `window` when a new Account instance is created.
 
 | Class        | event name              |
 | ------------ | ----------------------- |
-| Identity     | `schIdentity:ready`     |
-| Monetization | `schMonetization:ready` |
-| Payment      | `schPayment:ready`      |
+| Account      | `schAccount:ready`      |
 
 ```js
-window.addEventListener('schIdentity:ready', e => {
+window.addEventListener('schAccount:ready', e => {
     // The event contains the initialized instance (e.detail.instance);
 }
 
 ```
 
-## Identity
+## Account
 
 Let's start with a bit of example code:
 
 #### Example
 
 ```javascript
-import { Identity } from '@schibsted/account-sdk-browser';
+import { createAccountSdk } from '@schibsted/account-sdk-browser';
 
-const identity = new Identity({
+const account = createAccountSdk({
     clientId: '56e9a5d1eee0000000000000',
     redirectUri: 'https://awesomenews.site', // ensure it's listed in selfservice
     env: 'PRE', // Schibsted account env. A url or a special key: 'PRE', 'PRO', 'PRO_NO', 'PRO_FI' or 'PRO_DK'
@@ -106,8 +103,8 @@ const identity = new Identity({
 
 async function whenSiteLoaded() {
     const loginContainer = document.getElementById('login-container');
-    if (await identity.isLoggedIn()) {
-        const user = await identity.getUser();
+    if (await account.isLoggedIn()) {
+        const user = await account.getUser();
         const span = document.createElement('span');
         span.textContent = `Hello ${user.givenName}`;
         loginContainer.appendChild(span);
@@ -117,10 +114,18 @@ async function whenSiteLoaded() {
 }
 
 function userClicksLogIn() {
-    identity.login({ state: 'some-random-string-1234-foobar-wonky-pig' });
+    account.login({ state: 'some-random-string-1234-foobar-wonky-pig' });
 }
 ```
 
+If your code needs the initialized singleton from another module, use `getAccountSdk()`:
+
+```javascript
+import { getAccountSdk } from '@schibsted/account-sdk-browser';
+
+const account = await getAccountSdk();
+```
+
 #### Regarding `state`
 
 This parameter is an OpenID Connect parameter (described in [this paragraph in the
@@ -129,7 +134,7 @@ an opaque string. This means you can send anything that can be serialized to a s
 we have good experience sending something like a JSON value like a base64-url-encoded value — it's
 just an easy way to avoid browsers or backends messing with special characters.
 
-But as a trivial example, if you call `Identity.login(..)` with params
+But as a trivial example, if you call `account.login(..)` with params
 `redirectUri=https://site.com&state=article%3D1234` — then at the end of the authentication flow,
 the user will be sent back to your redirectUri, and the `state` parameter will be forwarded along
 with the auth `code` parameter.
@@ -139,7 +144,7 @@ attacks. For example this can be accomplished by:
 
 1. Your backend generates random token: `1234abcd`, saves it in some tokenCache, and forwards to
    your browser frontend
-1. Your frontend calls `Identity.login` with `state = base64Urlencode({ token: '1234abcd', article:
+1. Your frontend calls `account.login` with `state = base64Urlencode({ token: '1234abcd', article:
 '1234', ... })`
 1. When auth flow completes, the user is redirected back to your site. Then, your backend sees the
    query parameters `code` (which it can exchange for OAuth tokens for the user) and `state`
@@ -160,8 +165,8 @@ mentioning that your end users have a few ways to log in:
 *  Multifactor authentication: first client indicates which methods should be preferred, later these
     will be included (if fulfilled) in `AMR` claim of IDToken
 
-The default is username & password. If you wish to use one of the passwordless login methods, the
-`login()` function takes an optional parameter called `acrValues` (Authentication Context Class Reference).
+The default is username & password. If you wish to use one of the passwordless login methods,
+`account.login()` takes an optional parameter called `acrValues` (Authentication Context Class Reference).
 The `acrValues` parameter with multifactor authentication can take following values:
 
 *  `eid` - authentication using BankID (for DEV and PRE environments you can choose between country specific solution by specifying `eid-no` or `eid-se` instead)
@@ -188,10 +193,10 @@ Schibsted account relies on browser cookies to determine whether a user is recog
 The SDK provides functions that can be used to check if the user that's visiting your site is
 already a Schibsted user or not.
 
-*  [Identity#isLoggedIn](https://schibsted.github.io/account-sdk-browser/Identity.html#isLoggedIn)
+*  `account.isLoggedIn()`
     tells you if the user that is visiting your site is already logged in to Schibsted account or not.
 
-*  [Identity#isConnected](https://schibsted.github.io/account-sdk-browser/Identity.html#isConnected)
+*  `account.isConnected()`
     tells you if the user is connected to your client. A user might have `isLoggedIn=true` and at the
     same time `isConnected=false` if they have logged in to Schibsted account, but not accepted terms
     and privacy policy for your site.
@@ -203,62 +208,32 @@ will just ask them to accept those terms and redirect them right back to your si
 #### Logging out
 
 If you want to log the user out of Schibsted account, you can call
-[Identity#logout](https://schibsted.github.io/account-sdk-browser/Identity.html#logout). This
+`account.logout()`. This
 will remove the Schibsted account brand session. User will still be logged into Schibsted account.
 
-## Monetization
+## Access Checks
 
 The preferred method for checking whether a user has access to a product/subscription is
-[Monetization#hasAccess](https://schibsted.github.io/account-sdk-browser/Monetization.html#hasAccess).
+`account.hasAccess()`.
 It requires using Session Service, and supports both Schibsted account productId's and Zuora
 feature id's.
 
 #### Example
 
 ```javascript
-import { Monetization } from '@schibsted/account-sdk-browser';
-
-const monetization = new Monetization({
-    clientId: '56e9a5d1eee0000000000000',
-    redirectUri: 'https://awesomenews.site', // ensure it's listed in selfservice
-    sessionDomain: 'https://id.aweseome.site', // client-configured session-service domain
-    env: 'PRE', // Schibsted account env. A url or a special key: 'PRE', 'PRO' or 'PRO_NO'
-});
+import { getAccountSdk } from '@schibsted/account-sdk-browser';
 
 try {
-    // Check if the user has access to a a particular product
-    const userId = await identity.getUserId();
-    const data = await monetization.hasAccess([productId], userId);
+    // Check if the user has access to a particular product
+    const account = await getAccountSdk();
+    const userId = await account.getUserId();
+    const data = await account.hasAccess([productId], userId);
     alert(`User has access to ${productId}? ${data.entitled}`);
 } catch (err) {
     alert(`Could not query if the user has access to ${productId} because ${err}`);
 }
 ```
 
-## Payment
-
-This class provides methods for paying with a so-called paylink, buying a product, getting links to
-pages for redeeming voucher codes, reviewing payment history, and more.
-
-#### Example
-
-```javascript
-import { Payment } from '@schibsted/account-sdk-browser';
-
-const paymentSDK = new Payment({
-    clientId: '56e9a5d1eee0000000000000',
-    redirectUri: 'https://awesomenews.site', // ensure it's listed in selfservice
-    env: 'PRE', // Schibsted account env. A url or a special key: 'PRE', 'PRO' or 'PRO_NO'
-});
-
-// Get the url to paymentSDK with paylink
-const paylink = '...';
-const paylinkUrl = paymentSDK.purchasePaylinkUrl(paylink);
-
-// Or another example --- pay with paylink in a popup
-paymentSDK.payWithPaylink(paylink);
-```
-
 #### Cookies
 
 There are some cookies used by Schibsted account. They should all be considered opaque on the

package/dist/account-sdk.d.ts

@@ -0,0 +1,4 @@
+import { Account } from './account.js';
+import { AccountConfig } from './types/account.js';
+export declare function createAccountSdk(config: AccountConfig): Account;
+export declare function getAccountSdk(): Promise<Account>;

package/dist/account.d.ts

@@ -0,0 +1,29 @@
+import { AccountConfig, AccountEventHandler, AccountEventName } from './types/account.js';
+import { LoginOptions, SimplifiedLoginData, SimplifiedLoginWidgetLoginOptions, SimplifiedLoginWidgetOptions } from './types/login.js';
+import { HasAccessResult } from './types/monetization.js';
+import { ConnectedSessionResponse, SessionResponse, SessionUserId } from './types/session.js';
+/**
+ * Unified client-side interface for a configured Schibsted Account integration.
+ */
+export declare class Account {
+    #private;
+    constructor(config: AccountConfig);
+    hasSession(): Promise<SessionResponse>;
+    isLoggedIn(): Promise<boolean>;
+    isConnected(): Promise<boolean>;
+    getUser(): Promise<ConnectedSessionResponse>;
+    getUserId(): Promise<string>;
+    getUserSDRN(): Promise<string>;
+    getUserContextData(): Promise<SimplifiedLoginData | null>;
+    getSpId(): Promise<string | null>;
+    login(options: LoginOptions): Window | null;
+    logout(redirectUri?: string): void;
+    loginUrl(options: LoginOptions): string;
+    showSimplifiedLoginWidget(loginParams: SimplifiedLoginWidgetLoginOptions, options?: SimplifiedLoginWidgetOptions): Promise<boolean>;
+    clearCachedUserSession(): void;
+    hasAccess(productIds: string[], userId: SessionUserId): Promise<HasAccessResult | null>;
+    clearCachedAccessResult(productIds: string[], userId: SessionUserId): void;
+    on(event: AccountEventName, callback: AccountEventHandler, ctx?: unknown): this;
+    off(event: AccountEventName, callback?: AccountEventHandler): this;
+}
+export default Account;

package/dist/cache.d.ts

@@ -0,0 +1,65 @@
+/**
+ * Cache implementation used when web storage is available. Wraps a `Storage` instance.
+ * @private
+ */
+declare class WebStorageCache {
+    store: Storage;
+    get: (key: string) => string | null;
+    set: (key: string, value: string) => void;
+    delete: (key: string) => void;
+    /**
+     * Create web storage cache object
+     * @param store - A reference to either `sessionStorage` or `localStorage` from a
+     * `Window` object
+     */
+    constructor(store: Storage);
+}
+/**
+ * Cache implementation used when web storage is not available. Stores entries in an in-memory object.
+ * @private
+ */
+declare class LiteralCache {
+    store: Record<string, string>;
+    get: (key: string) => string | undefined;
+    set: (key: string, value: string) => void;
+    delete: (key: string) => void;
+    /**
+     * Create JS object literal cache object
+     */
+    constructor();
+}
+/**
+ * Cache class that attempts WebStorage (session/local storage), and falls back to JS object literal
+ * @private
+ */
+export default class Cache {
+    cache: WebStorageCache | LiteralCache;
+    type: string;
+    /**
+     * @param storeProvider - A function to return a WebStorage instance (either
+     * `sessionStorage` or `localStorage` from a `Window` object)
+     * @throws {SDKError} - If sessionStorage or localStorage are not accessible
+     */
+    constructor(storeProvider?: () => Storage);
+    /**
+     * Get a value from cache (checks that the object has not expired)
+     * @param key
+     * @private
+     */
+    get(key: string): unknown;
+    /**
+     * Set a cache entry
+     * @param key
+     * @param value
+     * @param expiresIn - Value in milliseconds until the entry expires
+     * @private
+     */
+    set(key: string, value: unknown, expiresIn?: number): void;
+    /**
+     * Delete a cache entry
+     * @param key
+     * @private
+     */
+    delete(key: string): void;
+}
+export {};

package/dist/config.d.ts

@@ -0,0 +1,86 @@
+/**
+ * Core configuration used by the SDK.
+ * - `ENDPOINTS.SPiD` — SPiD endpoints per environment
+ * - `ENDPOINTS.BFF` — Endpoints used with new GDPR-compliant web flows
+ * - `ENDPOINTS.SESSION_SERVICE` — Endpoints to check global user session data
+ *
+ */
+declare const config: {
+    readonly ENDPOINTS: {
+        readonly SPiD: {
+            readonly LOCAL: "http://id.localhost";
+            readonly DEV: "https://identity-dev.schibsted.com";
+            readonly PRE: "https://identity-pre.schibsted.com";
+            readonly PRO: "https://login.schibsted.com";
+            readonly PRO_NO: "https://payment.schibsted.no";
+            readonly PRO_FI: "https://login.schibsted.fi";
+            readonly PRO_DK: "https://login.schibsted.dk";
+        };
+        readonly BFF: {
+            readonly LOCAL: "http://id.localhost/authn/";
+            readonly DEV: "https://identity-dev.schibsted.com/authn/";
+            readonly PRE: "https://identity-pre.schibsted.com/authn/";
+            readonly PRO: "https://login.schibsted.com/authn/";
+            readonly PRO_NO: "https://payment.schibsted.no/authn/";
+            readonly PRO_FI: "https://login.schibsted.fi/authn/";
+            readonly PRO_DK: "https://login.schibsted.dk/authn/";
+        };
+        readonly SESSION_SERVICE: {
+            readonly LOCAL: "http://session-service.id.localhost";
+            readonly DEV: "https://session-service.identity-dev.schibsted.com";
+            readonly PRE: "https://session-service.identity-pre.schibsted.com";
+            readonly PRO: "https://session-service.login.schibsted.com";
+            readonly PRO_NO: "https://session-service.payment.schibsted.no";
+            readonly PRO_FI: "https://session-service.login.schibsted.fi";
+            readonly PRO_DK: "https://session-service.login.schibsted.dk";
+        };
+    };
+    readonly NAMESPACE: {
+        readonly LOCAL: "id.localhost";
+        readonly DEV: "schibsted.com";
+        readonly PRE: "schibsted.com";
+        readonly PRO: "schibsted.com";
+        readonly PRO_NO: "spid.no";
+        readonly PRO_FI: "schibsted.fi";
+        readonly PRO_DK: "schibsted.dk";
+    };
+};
+export default config;
+export declare const ENDPOINTS: {
+    readonly SPiD: {
+        readonly LOCAL: "http://id.localhost";
+        readonly DEV: "https://identity-dev.schibsted.com";
+        readonly PRE: "https://identity-pre.schibsted.com";
+        readonly PRO: "https://login.schibsted.com";
+        readonly PRO_NO: "https://payment.schibsted.no";
+        readonly PRO_FI: "https://login.schibsted.fi";
+        readonly PRO_DK: "https://login.schibsted.dk";
+    };
+    readonly BFF: {
+        readonly LOCAL: "http://id.localhost/authn/";
+        readonly DEV: "https://identity-dev.schibsted.com/authn/";
+        readonly PRE: "https://identity-pre.schibsted.com/authn/";
+        readonly PRO: "https://login.schibsted.com/authn/";
+        readonly PRO_NO: "https://payment.schibsted.no/authn/";
+        readonly PRO_FI: "https://login.schibsted.fi/authn/";
+        readonly PRO_DK: "https://login.schibsted.dk/authn/";
+    };
+    readonly SESSION_SERVICE: {
+        readonly LOCAL: "http://session-service.id.localhost";
+        readonly DEV: "https://session-service.identity-dev.schibsted.com";
+        readonly PRE: "https://session-service.identity-pre.schibsted.com";
+        readonly PRO: "https://session-service.login.schibsted.com";
+        readonly PRO_NO: "https://session-service.payment.schibsted.no";
+        readonly PRO_FI: "https://session-service.login.schibsted.fi";
+        readonly PRO_DK: "https://session-service.login.schibsted.dk";
+    };
+};
+export declare const NAMESPACE: {
+    readonly LOCAL: "id.localhost";
+    readonly DEV: "schibsted.com";
+    readonly PRE: "schibsted.com";
+    readonly PRO: "schibsted.com";
+    readonly PRO_NO: "spid.no";
+    readonly PRO_FI: "schibsted.fi";
+    readonly PRO_DK: "schibsted.dk";
+};

package/dist/get-account-sdk.d.ts

@@ -0,0 +1,3 @@
+import { Account } from './account.js';
+import { AccountConfig } from './types/account.js';
+export declare function getAccountSdk(config?: AccountConfig): Promise<Account>;

package/dist/global-registry.d.ts

@@ -0,0 +1,23 @@
+/**
+ * Names of the SDK instance properties that can be registered on the global {@link Window} object.
+ */
+type Property = 'schAccount' | 'schIdentity' | 'schMonetization';
+/**
+ * Registers an SDK instance on the global {@link Window} object's given property and dispatches a ready event.
+ *
+ * The dispatched event is a {@link CustomEvent} fired on `global` (i.e. `window`) with:
+ * - name: `${property}:ready` (e.g. `"schIdentity:ready"` or `"schMonetization:ready"`)
+ * - `detail.instance`: the registered SDK instance
+ *
+ * @typeParam T - Constrained to {@link Property}; inferred from the `property` argument.
+ * @param global - The `Window` object to register on.
+ * @param property - The window property name to assign the instance to, 'schIdentity' or 'schMonetization'.
+ * @param instance - The SDK instance to register. Must be non-nullable.
+ *
+ * @example
+ * registerAndDispatchInGlobal(window, 'schIdentity', identityInstance);
+ * / window.schIdentity === identityInstance
+ * / CustomEvent 'schIdentity:ready' has been dispatched on window
+ */
+export declare const registerAndDispatchInGlobal: <T extends Property>(global: Window, property: T, instance: NonNullable<Window[T]>) => void;
+export {};

package/dist/globals.d.ts

@@ -0,0 +1,15 @@
+import { Account } from './account.js';
+import { Identity } from './identity.js';
+import { Monetization } from './monetization.js';
+declare global {
+    interface Window {
+        schAccount?: Account;
+        schIdentity?: Identity;
+        schMonetization?: Monetization;
+        SPiD?: {
+            Talk?: {
+                response?: (callbackName: string, data: unknown) => unknown;
+            };
+        };
+    }
+}

package/dist/has-access-response.d.ts

@@ -0,0 +1,2 @@
+import { HasAccessResult } from './types/monetization.js';
+export declare function parseHasAccessResult(value: unknown): HasAccessResult;