@logto/browser 2.0.0 → 2.1.1

package/README.md

@@ -1,9 +1,9 @@
-# Logto JS (Core) SDK
-[![Version](https://img.shields.io/npm/v/@logto/js)](https://www.npmjs.com/package/@logto/js)
+# Logto JS Browser SDK
+[![Version](https://img.shields.io/npm/v/@logto/browser)](https://www.npmjs.com/package/@logto/browser)
 [![Build Status](https://github.com/logto-io/js/actions/workflows/main.yml/badge.svg)](https://github.com/logto-io/js/actions/workflows/main.yml)
 [![Codecov](https://img.shields.io/codecov/c/github/logto-io/js)](https://app.codecov.io/gh/logto-io/js?branch=master)
 
-The Logto JavaScript Core SDK written in TypeScript. Check out our [docs](https://docs.logto.io/JavaScript/browser/) for more information.
+The Logto JavaScript Browser SDK written in TypeScript. Check out our [docs](https://docs.logto.io/JavaScript/browser/) for more information.
 
 We also provide [文档](https://docs.logto.io/zh-cn/sdk/JavaScript/browser/) in Simplified Chinese.
 
@@ -42,4 +42,4 @@ If Logto does not support your front-end framework and you want to create your o
 
 [![Website](https://img.shields.io/badge/website-logto.io-8262F8.svg)](https://logto.io/)
 [![Docs](https://img.shields.io/badge/docs-logto.io-green.svg)](https://docs.logto.io/sdk/JavaScript/browser/)
-[![Discord](https://img.shields.io/discord/965845662535147551?logo=discord&logoColor=ffffff&color=7389D8&cacheSeconds=600)](https://discord.gg/UEPaF3j5e6)
+[![Discord](https://img.shields.io/discord/965845662535147551?logo=discord&logoColor=ffffff&color=7389D8&cacheSeconds=600)](https://discord.gg/UEPaF3j5e6)

package/lib/cache.cjs

@@ -0,0 +1,25 @@
+'use strict';
+
+const keyPrefix = `logto_cache`;
+class CacheStorage {
+    constructor(appId) {
+        this.appId = appId;
+    }
+    getKey(item) {
+        if (item === undefined) {
+            return `${keyPrefix}:${this.appId}`;
+        }
+        return `${keyPrefix}:${this.appId}:${item}`;
+    }
+    async getItem(key) {
+        return sessionStorage.getItem(this.getKey(key));
+    }
+    async setItem(key, value) {
+        sessionStorage.setItem(this.getKey(key), value);
+    }
+    async removeItem(key) {
+        sessionStorage.removeItem(`${this.getKey(key)}`);
+    }
+}
+
+exports.CacheStorage = CacheStorage;

package/lib/cache.d.ts

@@ -0,0 +1,10 @@
+import type { Storage, CacheKey } from '@logto/client';
+import type { Nullable } from '@silverhand/essentials';
+export declare class CacheStorage implements Storage<CacheKey> {
+    readonly appId: string;
+    constructor(appId: string);
+    getKey(item?: string): string;
+    getItem(key: CacheKey): Promise<Nullable<string>>;
+    setItem(key: CacheKey, value: string): Promise<void>;
+    removeItem(key: CacheKey): Promise<void>;
+}

package/lib/cache.js

@@ -0,0 +1,23 @@
+const keyPrefix = `logto_cache`;
+class CacheStorage {
+    constructor(appId) {
+        this.appId = appId;
+    }
+    getKey(item) {
+        if (item === undefined) {
+            return `${keyPrefix}:${this.appId}`;
+        }
+        return `${keyPrefix}:${this.appId}:${item}`;
+    }
+    async getItem(key) {
+        return sessionStorage.getItem(this.getKey(key));
+    }
+    async setItem(key, value) {
+        sessionStorage.setItem(this.getKey(key), value);
+    }
+    async removeItem(key) {
+        sessionStorage.removeItem(`${this.getKey(key)}`);
+    }
+}
+
+export { CacheStorage };

package/lib/cache.test.d.ts

@@ -0,0 +1 @@
+export {};

package/lib/index.cjs

@@ -3,6 +3,8 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 var BaseClient = require('@logto/client');
+var essentials = require('@silverhand/essentials');
+var cache = require('./cache.cjs');
 var storage = require('./storage.cjs');
 var generators = require('./utils/generators.cjs');
 
@@ -14,12 +16,18 @@ const navigate = (url) => {
     window.location.assign(url);
 };
 class LogtoClient extends BaseClient__default.default {
-    constructor(config) {
+    /**
+     * @param config The configuration object for the client.
+     * @param [unstable_enableCache=false] Whether to enable cache for well-known data.
+     * Use sessionStorage by default.
+     */
+    constructor(config, unstable_enableCache = false) {
         const requester = BaseClient.createRequester(fetch);
         super(config, {
             requester,
             navigate,
             storage: new storage.BrowserStorage(config.appId),
+            unstable_cache: essentials.conditional(unstable_enableCache && new cache.CacheStorage(config.appId)),
             generateCodeChallenge: generators.generateCodeChallenge,
             generateCodeVerifier: generators.generateCodeVerifier,
             generateState: generators.generateState,
@@ -27,6 +35,10 @@ class LogtoClient extends BaseClient__default.default {
     }
 }
 
+Object.defineProperty(exports, 'BaseClient', {
+    enumerable: true,
+    get: function () { return BaseClient__default.default; }
+});
 Object.defineProperty(exports, 'LogtoClientError', {
     enumerable: true,
     get: function () { return BaseClient.LogtoClientError; }
@@ -55,4 +67,11 @@ Object.defineProperty(exports, 'UserScope', {
     enumerable: true,
     get: function () { return BaseClient.UserScope; }
 });
+Object.defineProperty(exports, 'createRequester', {
+    enumerable: true,
+    get: function () { return BaseClient.createRequester; }
+});
+exports.generateCodeChallenge = generators.generateCodeChallenge;
+exports.generateCodeVerifier = generators.generateCodeVerifier;
+exports.generateState = generators.generateState;
 exports.default = LogtoClient;

package/lib/index.d.ts

@@ -1,7 +1,14 @@
 import type { LogtoConfig } from '@logto/client';
 import BaseClient from '@logto/client';
-export type { IdTokenClaims, LogtoErrorCode, LogtoConfig, LogtoClientErrorCode, UserInfoResponse, InteractionMode, } from '@logto/client';
+export { createRequester, default as BaseClient } from '@logto/client';
+export { generateCodeChallenge, generateCodeVerifier, generateState } from './utils/generators.js';
+export type { IdTokenClaims, LogtoErrorCode, LogtoConfig, LogtoClientErrorCode, UserInfoResponse, InteractionMode, ClientAdapter, } from '@logto/client';
 export { LogtoError, OidcError, Prompt, LogtoRequestError, LogtoClientError, ReservedScope, UserScope, } from '@logto/client';
 export default class LogtoClient extends BaseClient {
-    constructor(config: LogtoConfig);
+    /**
+     * @param config The configuration object for the client.
+     * @param [unstable_enableCache=false] Whether to enable cache for well-known data.
+     * Use sessionStorage by default.
+     */
+    constructor(config: LogtoConfig, unstable_enableCache?: boolean);
 }

package/lib/index.js

@@ -1,5 +1,7 @@
 import BaseClient, { createRequester } from '@logto/client';
-export { LogtoClientError, LogtoError, LogtoRequestError, OidcError, Prompt, ReservedScope, UserScope } from '@logto/client';
+export { default as BaseClient, LogtoClientError, LogtoError, LogtoRequestError, OidcError, Prompt, ReservedScope, UserScope, createRequester } from '@logto/client';
+import { conditional } from '@silverhand/essentials';
+import { CacheStorage } from './cache.js';
 import { BrowserStorage } from './storage.js';
 import { generateCodeChallenge, generateCodeVerifier, generateState } from './utils/generators.js';
 
@@ -7,12 +9,18 @@ const navigate = (url) => {
     window.location.assign(url);
 };
 class LogtoClient extends BaseClient {
-    constructor(config) {
+    /**
+     * @param config The configuration object for the client.
+     * @param [unstable_enableCache=false] Whether to enable cache for well-known data.
+     * Use sessionStorage by default.
+     */
+    constructor(config, unstable_enableCache = false) {
         const requester = createRequester(fetch);
         super(config, {
             requester,
             navigate,
             storage: new BrowserStorage(config.appId),
+            unstable_cache: conditional(unstable_enableCache && new CacheStorage(config.appId)),
             generateCodeChallenge,
             generateCodeVerifier,
             generateState,
@@ -20,4 +28,4 @@ class LogtoClient extends BaseClient {
     }
 }
 
-export { LogtoClient as default };
+export { LogtoClient as default, generateCodeChallenge, generateCodeVerifier, generateState };

package/lib/storage.cjs

@@ -1,31 +1,37 @@
 'use strict';
 
-const logtoStorageItemKeyPrefix = `logto`;
+const keyPrefix = `logto`;
 class BrowserStorage {
     constructor(appId) {
-        this.storageKey = `${logtoStorageItemKeyPrefix}:${appId}`;
+        this.appId = appId;
+    }
+    getKey(item) {
+        if (item === undefined) {
+            return `${keyPrefix}:${this.appId}`;
+        }
+        return `${keyPrefix}:${this.appId}:${item}`;
     }
     async getItem(key) {
         if (key === 'signInSession') {
-            return sessionStorage.getItem(this.storageKey);
+            // The latter `getItem()` is for backward compatibility. Can be removed when major bump.
+            return sessionStorage.getItem(this.getKey(key)) ?? sessionStorage.getItem(this.getKey());
         }
-        return localStorage.getItem(`${this.storageKey}:${key}`);
+        return localStorage.getItem(this.getKey(key));
     }
     async setItem(key, value) {
         if (key === 'signInSession') {
-            sessionStorage.setItem(this.storageKey, value);
+            sessionStorage.setItem(this.getKey(key), value);
             return;
         }
-        localStorage.setItem(`${this.storageKey}:${key}`, value);
+        localStorage.setItem(this.getKey(key), value);
     }
     async removeItem(key) {
         if (key === 'signInSession') {
-            sessionStorage.removeItem(this.storageKey);
+            sessionStorage.removeItem(this.getKey(key));
             return;
         }
-        localStorage.removeItem(`${this.storageKey}:${key}`);
+        localStorage.removeItem(this.getKey(key));
     }
 }
 
 exports.BrowserStorage = BrowserStorage;
-exports.logtoStorageItemKeyPrefix = logtoStorageItemKeyPrefix;

package/lib/storage.d.ts

@@ -1,9 +1,9 @@
 import type { Storage, StorageKey } from '@logto/client';
 import type { Nullable } from '@silverhand/essentials';
-export declare const logtoStorageItemKeyPrefix = "logto";
-export declare class BrowserStorage implements Storage {
-    private readonly storageKey;
+export declare class BrowserStorage implements Storage<StorageKey> {
+    readonly appId: string;
     constructor(appId: string);
+    getKey(item?: string): string;
     getItem(key: StorageKey): Promise<Nullable<string>>;
     setItem(key: StorageKey, value: string): Promise<void>;
     removeItem(key: StorageKey): Promise<void>;

package/lib/storage.js

@@ -1,28 +1,35 @@
-const logtoStorageItemKeyPrefix = `logto`;
+const keyPrefix = `logto`;
 class BrowserStorage {
     constructor(appId) {
-        this.storageKey = `${logtoStorageItemKeyPrefix}:${appId}`;
+        this.appId = appId;
+    }
+    getKey(item) {
+        if (item === undefined) {
+            return `${keyPrefix}:${this.appId}`;
+        }
+        return `${keyPrefix}:${this.appId}:${item}`;
     }
     async getItem(key) {
         if (key === 'signInSession') {
-            return sessionStorage.getItem(this.storageKey);
+            // The latter `getItem()` is for backward compatibility. Can be removed when major bump.
+            return sessionStorage.getItem(this.getKey(key)) ?? sessionStorage.getItem(this.getKey());
         }
-        return localStorage.getItem(`${this.storageKey}:${key}`);
+        return localStorage.getItem(this.getKey(key));
     }
     async setItem(key, value) {
         if (key === 'signInSession') {
-            sessionStorage.setItem(this.storageKey, value);
+            sessionStorage.setItem(this.getKey(key), value);
             return;
         }
-        localStorage.setItem(`${this.storageKey}:${key}`, value);
+        localStorage.setItem(this.getKey(key), value);
     }
     async removeItem(key) {
         if (key === 'signInSession') {
-            sessionStorage.removeItem(this.storageKey);
+            sessionStorage.removeItem(this.getKey(key));
             return;
         }
-        localStorage.removeItem(`${this.storageKey}:${key}`);
+        localStorage.removeItem(this.getKey(key));
     }
 }
 
-export { BrowserStorage, logtoStorageItemKeyPrefix };
+export { BrowserStorage };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@logto/browser",
-  "version": "2.0.0",
+  "version": "2.1.1",
   "type": "module",
   "main": "./lib/index.cjs",
   "module": "./lib/index.js",
@@ -21,22 +21,22 @@
     "directory": "packages/browser"
   },
   "dependencies": {
-    "@logto/client": "^2.0.0",
+    "@logto/client": "^2.2.2",
     "@silverhand/essentials": "^2.6.2",
     "js-base64": "^3.7.4"
   },
   "devDependencies": {
-    "@silverhand/eslint-config": "^3.0.1",
-    "@silverhand/ts-config": "^3.0.0",
+    "@silverhand/eslint-config": "^4.0.1",
+    "@silverhand/ts-config": "^4.0.0",
     "@swc/core": "^1.3.50",
     "@swc/jest": "^0.2.24",
     "@types/jest": "^29.5.0",
-    "eslint": "^8.38.0",
+    "eslint": "^8.44.0",
     "jest": "^29.5.0",
     "jest-environment-jsdom": "^29.5.0",
     "jest-matcher-specific-error": "^1.0.0",
     "lint-staged": "^13.0.0",
-    "prettier": "^2.8.7",
+    "prettier": "^3.0.0",
     "text-encoder": "^0.0.4",
     "typescript": "^5.0.0"
   },