@logto/core-kit 2.2.1 → 2.4.0

package/lib/openid.d.ts

@@ -12,7 +12,7 @@ export declare enum ReservedResource {
      */
     Organization = "urn:logto:resource:organizations"
 }
-export type UserClaim = 'name' | 'picture' | 'username' | 'email' | 'email_verified' | 'phone_number' | 'phone_number_verified' | 'roles' | 'organizations' | 'organization_data' | 'organization_roles' | 'custom_data' | 'identities';
+export type UserClaim = 'name' | 'given_name' | 'family_name' | 'middle_name' | 'nickname' | 'preferred_username' | 'profile' | 'picture' | 'website' | 'email' | 'email_verified' | 'gender' | 'birthdate' | 'zoneinfo' | 'locale' | 'phone_number' | 'phone_number_verified' | 'address' | 'updated_at' | 'username' | 'roles' | 'organizations' | 'organization_data' | 'organization_roles' | 'custom_data' | 'identities' | 'created_at';
 /**
  * Scopes for ID Token and Userinfo Endpoint.
  */
@@ -35,6 +35,12 @@ export declare enum UserScope {
      * See {@link idTokenClaims} for mapped claims in ID Token and {@link userinfoClaims} for additional claims in Userinfo Endpoint.
      */
     Phone = "phone",
+    /**
+     * Scope for user address.
+     *
+     * See {@link idTokenClaims} for mapped claims in ID Token and {@link userinfoClaims} for additional claims in Userinfo Endpoint.
+     */
+    Address = "address",
     /**
      * Scope for user's custom data.
      *
@@ -68,6 +74,8 @@ export declare enum UserScope {
 }
 /**
  * Mapped claims that ID Token includes.
+ *
+ * @see {@link https://openid.net/specs/openid-connect-core-1_0.html#ScopeClaims | OpenID Connect Core 1.0} for standard scope - claim mapping.
  */
 export declare const idTokenClaims: Readonly<Record<UserScope, UserClaim[]>>;
 /**

package/lib/openid.js

@@ -37,6 +37,12 @@ export var UserScope;
      * See {@link idTokenClaims} for mapped claims in ID Token and {@link userinfoClaims} for additional claims in Userinfo Endpoint.
      */
     UserScope["Phone"] = "phone";
+    /**
+     * Scope for user address.
+     *
+     * See {@link idTokenClaims} for mapped claims in ID Token and {@link userinfoClaims} for additional claims in Userinfo Endpoint.
+     */
+    UserScope["Address"] = "address";
     /**
      * Scope for user's custom data.
      *
@@ -70,11 +76,33 @@ export var UserScope;
 })(UserScope || (UserScope = {}));
 /**
  * Mapped claims that ID Token includes.
+ *
+ * @see {@link https://openid.net/specs/openid-connect-core-1_0.html#ScopeClaims | OpenID Connect Core 1.0} for standard scope - claim mapping.
  */
 export const idTokenClaims = Object.freeze({
-    [UserScope.Profile]: ['name', 'picture', 'username'],
+    [UserScope.Profile]: [
+        // Standard claims
+        'name',
+        'family_name',
+        'given_name',
+        'middle_name',
+        'nickname',
+        'preferred_username',
+        'profile',
+        'picture',
+        'website',
+        'gender',
+        'birthdate',
+        'zoneinfo',
+        'locale',
+        'updated_at',
+        // Custom claims
+        'username',
+        'created_at',
+    ],
     [UserScope.Email]: ['email', 'email_verified'],
     [UserScope.Phone]: ['phone_number', 'phone_number_verified'],
+    [UserScope.Address]: ['address'],
     [UserScope.Roles]: ['roles'],
     [UserScope.Organizations]: ['organizations'],
     [UserScope.OrganizationRoles]: ['organization_roles'],
@@ -88,6 +116,7 @@ export const userinfoClaims = Object.freeze({
     [UserScope.Profile]: [],
     [UserScope.Email]: [],
     [UserScope.Phone]: [],
+    [UserScope.Address]: [],
     [UserScope.Roles]: [],
     [UserScope.Organizations]: ['organization_data'],
     [UserScope.OrganizationRoles]: [],

package/lib/password-policy.d.ts

@@ -1,3 +1,5 @@
+/// <reference types="node" resolution-mode="require"/>
+import { type webcrypto } from 'node:crypto';
 import { type DeepPartial } from '@silverhand/essentials';
 import { z } from 'zod';
 /** Password policy configuration type. */
@@ -137,7 +139,7 @@ export type UserInfo = Partial<{
  */
 export declare class PasswordPolicyChecker {
     /** The Web Crypto API to use. By default, the global `crypto.subtle` will be used. */
-    protected readonly subtle: SubtleCrypto;
+    protected readonly subtle: webcrypto.SubtleCrypto | SubtleCrypto;
     static symbols: "!\"#$%&'()*+,-./:;<=>?@[\\]^_`{|}~ ";
     /** A set of characters that are considered as sequential. */
     static sequence: readonly ["0123456789", "abcdefghijklmnopqrstuvwxyz", "qwertyuiop", "asdfghjkl", "zxcvbnm", "1qaz", "2wsx", "3edc", "4rfv", "5tgb", "6yhn", "7ujm", "8ik", "9ol"];
@@ -153,7 +155,7 @@ export declare class PasswordPolicyChecker {
     readonly policy: PasswordPolicy;
     constructor(policy: DeepPartial<PasswordPolicy>, 
     /** The Web Crypto API to use. By default, the global `crypto.subtle` will be used. */
-    subtle?: SubtleCrypto);
+    subtle?: webcrypto.SubtleCrypto | SubtleCrypto);
     /**
      * Check if a password meets all the policy requirements.
      *

package/lib/password-policy.js

@@ -1,4 +1,5 @@
 import { z } from 'zod';
+import { getPwnPasswordsForTest, isIntegrationTest } from './utils/integration-test.js';
 /** Password policy configuration guard. */
 export const passwordPolicyGuard = z.object({
     length: z
@@ -43,7 +44,7 @@ export const passwordPolicyGuard = z.object({
  * // ]
  * ```
  */
-class PasswordPolicyChecker {
+export class PasswordPolicyChecker {
     static { this.symbols = Object.freeze('!"#$%&\'()*+,-./:;<=>?@[\\]^_`{|}~ '); }
     /** A set of characters that are considered as sequential. */
     static { this.sequence = Object.freeze([
@@ -213,6 +214,9 @@ class PasswordPolicyChecker {
      * @returns Whether the password has been pwned.
      */
     async hasBeenPwned(password) {
+        if (isIntegrationTest()) {
+            return getPwnPasswordsForTest().includes(password);
+        }
         const hash = await this.subtle.digest('SHA-1', new TextEncoder().encode(password));
         const hashHex = Array.from(new Uint8Array(hash))
             .map((binary) => binary.toString(16).padStart(2, '0'))
@@ -356,4 +360,3 @@ class PasswordPolicyChecker {
         return false;
     }
 }
-export { PasswordPolicyChecker };

package/lib/regex.d.ts

@@ -7,3 +7,5 @@ export declare const mobileUriSchemeProtocolRegEx: RegExp;
 export declare const hexColorRegEx: RegExp;
 export declare const dateRegex: RegExp;
 export declare const noSpaceRegEx: RegExp;
+/** Full domain that consists of at least 3 parts, e.g. foo.bar.com or example-foo.bar.com */
+export declare const domainRegEx: RegExp;

package/lib/regex.js

@@ -7,3 +7,5 @@ export const mobileUriSchemeProtocolRegEx = /^[a-z][\d+_a-z-]*(\.[\d+_a-z-]+)+:$
 export const hexColorRegEx = /^#[\da-f]{3}([\da-f]{3})?$/i;
 export const dateRegex = /^\d{4}(-\d{2}){2}/;
 export const noSpaceRegEx = /^\S+$/;
+/** Full domain that consists of at least 3 parts, e.g. foo.bar.com or example-foo.bar.com */
+export const domainRegEx = /^[\dA-Za-z](?:[\dA-Za-z-]*[\dA-Za-z])?(?:\.[\dA-Za-z](?:[\dA-Za-z-]*[\dA-Za-z])?){2,}$/;

package/lib/utils/index.d.ts

@@ -1,2 +1,3 @@
 export * from './color.js';
+export * from './regex.js';
 export * from './url.js';

package/lib/utils/index.js

@@ -1,2 +1,3 @@
 export * from './color.js';
+export * from './regex.js';
 export * from './url.js';

package/lib/utils/integration-test.d.ts

@@ -0,0 +1,2 @@
+export declare const isIntegrationTest: () => boolean;
+export declare const getPwnPasswordsForTest: () => readonly string[];

package/lib/utils/integration-test.js

@@ -0,0 +1,8 @@
+import { yes } from '@silverhand/essentials';
+export const isIntegrationTest = () => yes(process.env.INTEGRATION_TEST);
+export const getPwnPasswordsForTest = () => {
+    if (!isIntegrationTest()) {
+        throw new Error('This function should only be called in integration tests');
+    }
+    return Object.freeze(['123456aA', 'test_password']);
+};

package/lib/utils/regex.d.ts

@@ -0,0 +1 @@
+export declare const isValidRegEx: (regEx?: string) => boolean;

package/lib/utils/regex.js

@@ -0,0 +1,8 @@
+export const isValidRegEx = (regEx) => {
+    try {
+        return Boolean(regEx && new RegExp(regEx));
+    }
+    catch {
+        return false;
+    }
+};

package/lib/utils/url.d.ts

@@ -1,2 +1,7 @@
 export declare const validateRedirectUrl: (url: string, type: 'web' | 'mobile') => boolean;
 export declare const validateUriOrigin: (url: string) => boolean;
+export declare const isValidUrl: (url?: string) => boolean;
+/**
+ * Check if the given URL is localhost
+ */
+export declare const isLocalhost: (url: string) => boolean;

package/lib/utils/url.js

@@ -17,3 +17,18 @@ export const validateUriOrigin = (url) => {
         return false;
     }
 };
+export const isValidUrl = (url) => {
+    try {
+        return Boolean(url && new URL(url));
+    }
+    catch {
+        return false;
+    }
+};
+/**
+ * Check if the given URL is localhost
+ */
+export const isLocalhost = (url) => {
+    const parsedUrl = new URL(url);
+    return ['localhost', '127.0.0.1', '::1'].includes(parsedUrl.hostname);
+};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@logto/core-kit",
-  "version": "2.2.1",
+  "version": "2.4.0",
   "author": "Silverhand Inc. <contact@silverhand.io>",
   "homepage": "https://github.com/logto-io/toolkit#readme",
   "repository": {
@@ -26,34 +26,32 @@
     "scss"
   ],
   "engines": {
-    "node": "^18.12.0"
+    "node": "^20.9.0"
   },
   "dependencies": {
-    "@logto/language-kit": "^1.0.0",
-    "@logto/shared": "^3.0.0",
+    "@logto/language-kit": "^1.1.0",
+    "@logto/shared": "^3.1.0",
+    "@silverhand/essentials": "^2.9.0",
     "color": "^4.2.3"
   },
   "optionalDependencies": {
     "zod": "^3.22.4"
   },
   "devDependencies": {
-    "@jest/types": "^29.0.3",
-    "@silverhand/eslint-config": "4.0.1",
-    "@silverhand/essentials": "^2.8.4",
-    "@silverhand/ts-config": "4.0.0",
-    "@silverhand/ts-config-react": "4.0.0",
+    "@silverhand/eslint-config": "5.0.0",
+    "@silverhand/ts-config": "5.0.0",
+    "@silverhand/ts-config-react": "5.0.0",
     "@types/color": "^3.0.3",
-    "@types/jest": "^29.4.0",
-    "@types/node": "^18.11.18",
+    "@types/node": "^20.9.5",
     "@types/react": "^18.0.31",
+    "@vitest/coverage-v8": "^1.4.0",
     "eslint": "^8.44.0",
-    "jest": "^29.5.0",
     "lint-staged": "^15.0.0",
     "postcss": "^8.4.31",
     "prettier": "^3.0.0",
     "stylelint": "^15.0.0",
-    "tslib": "^2.4.1",
-    "typescript": "^5.0.0"
+    "typescript": "^5.3.3",
+    "vitest": "^1.4.0"
   },
   "eslintConfig": {
     "extends": "@silverhand"
@@ -69,13 +67,11 @@
     "precommit": "lint-staged",
     "dev": "tsc -p tsconfig.build.json --watch --preserveWatchOutput --incremental",
     "build": "rm -rf lib/ && tsc -p tsconfig.build.json",
-    "build:test": "pnpm build -p tsconfig.test.json --sourcemap",
+    "build:test": "pnpm build",
     "lint": "eslint --ext .ts src",
     "lint:report": "pnpm lint --format json --output-file report.json",
     "stylelint": "stylelint \"scss/**/*.scss\"",
-    "test:only": "NODE_OPTIONS=--experimental-vm-modules jest",
-    "test": "pnpm build:test && pnpm test:only",
-    "test:ci": "pnpm test:only",
-    "test:coverage": "pnpm test:only --silent --coverage"
+    "test": "vitest src",
+    "test:ci": "pnpm run test --silent --coverage"
   }
 }

package/scss/_console-themes.scss

@@ -92,6 +92,7 @@
   --color-alert-99: #fff5eb;
 
   // color aliases
+  --color-static-white: #fff;
   --color-primary: var(--color-primary-40);
   --color-on-primary: var(--color-all-100);
   --color-primary-container: var(--color-primary-90);
@@ -160,6 +161,18 @@
   --color-env-tag-production: rgba(131, 218, 133, 35%);
   --color-specific-icon-bg: #f3effa;
   --color-specific-toggle-off-enable: var(--color-neutral-90);
+  --color-specific-unselected-disabled: var(--color-hover); // 8% Neutral-10
+  --color-specific-selected-disabled: var(--color-primary-80);
+  --color-specific-focused-inside: var(--color-primary-30);
+  --color-specific-focused-outside: var(--color-primary-40);
+  --color-specific-button-icon: rgba(255, 255, 255, 70%); // 70% static white
+  --color-overlay-primary-hover: rgba(93, 52, 242, 8%); // 8% Primary-40
+  --color-overlay-primary-pressed: rgba(93, 52, 242, 12%); // 12% Primary-40
+  --color-function-n-overlay-primary-focused: rgba(93, 52, 242, 16%); // 16% Primary-40
+  --color-overlay-danger-hover: rgba(186, 27, 27, 8%); // 8% Error-40
+  --color-overlay-dark-bg-hover: rgba(255, 255, 255, 12%); // 12% static white
+  --color-overlay-dark-bg-pressed: rgba(255, 255, 255, 18%); // 18% static white
+  --color-overlay-dark-bg-focused: rgba(255, 255, 255, 24%); // 24% static white
 
   // Shadows
   --shadow-1: 0 4px 8px rgba(0, 0, 0, 8%);
@@ -187,7 +200,7 @@
   // Background
   --color-bg-body-base: var(--color-neutral-95);
   --color-bg-body: var(--color-neutral-100);
-  --color-bg-layer-1: var(--color-static-white);
+  --color-bg-layer-1: var(--color-all-100);
   --color-bg-layer-2: var(--color-neutral-95);
   --color-bg-body-overlay: var(--color-neutral-100);
   --color-bg-float-base: var(--color-neutral-variant-90);
@@ -198,6 +211,15 @@
   --color-bg-state-unselected: var(--color-neutral-90);
   --color-bg-state-disabled: rgba(25, 28, 29, 8%); // 8% --color-neutral-10
   --color-bg-info-tag: rgba(229, 225, 236, 80%); // 80% --color-neutral-variant-90
+
+  // code editor
+  --color-code-bg: #181133;
+  --color-code-bg-float: #30314e;
+  --color-code-white: #f7f8f8;
+  --color-code-grey: #adaab4;
+  --color-code-dark-bg-focused: rgba(255, 255, 255, 24%);
+  --color-code-dark-bg-hover: rgba(255, 255, 255, 12%);
+  --color-code-dark-bg-pressed: rgba(255, 255, 255, 18%);
 }
 
 @mixin dark {
@@ -294,6 +316,7 @@
   --color-alert-99: #2b1700;
 
   // color aliases
+  --color-static-white: #fff;
   --color-primary: var(--color-primary-70);
   --color-on-primary: var(--color-all-0);
   --color-primary-container: var(--color-primary-30);
@@ -362,6 +385,18 @@
   --color-env-tag-production: rgba(104, 190, 108, 36%);
   --color-specific-icon-bg: rgba(247, 248, 248, 12%);
   --color-specific-toggle-off-enable: var(--color-neutral-90);
+  --color-specific-unselected-disabled: var(--color-hover); // 8% Neutral-10
+  --color-specific-selected-disabled: var(--color-primary-80);
+  --color-specific-focused-inside: var(--color-primary-40);
+  --color-specific-focused-outside: rgba(#cabeff, 32%); // 32% Primary-40
+  --color-specific-button-icon: rgba(255, 255, 255, 60%); // 60% static white
+  --color-overlay-primary-hover: rgba(202, 190, 255, 8%); // 8% Primary-40
+  --color-overlay-primary-pressed: rgba(202, 190, 255, 12%); // 12% Primary-40
+  --color-function-n-overlay-primary-focused: rgba(202, 190, 255, 16%); // 16% Primary-40
+  --color-overlay-danger-hover: rgba(186, 27, 27, 8%); // 8% Error-40
+  --color-overlay-dark-bg-hover: rgba(255, 255, 255, 12%); // 12% static white
+  --color-overlay-dark-bg-pressed: rgba(255, 255, 255, 18%); // 18% static white
+  --color-overlay-dark-bg-focused: rgba(255, 255, 255, 24%); // 24% static white
 
   // Shadows
   --shadow-1: 0 4px 8px rgba(0, 0, 0, 8%);
@@ -403,4 +438,11 @@
   --color-bg-state-unselected: var(--color-neutral-90);
   --color-bg-state-disabled: rgba(247, 248, 248, 8%); // 8% --color-neutral-10
   --color-bg-info-tag: var(--color-neutral-variant-90);
+
+  // code editor
+  --color-code-bg: #090613;
+  --color-code-bg-float: #232439;
+  --color-code-white: #f7f8f8;
+  --color-code-grey: #adaab4;
+  --color-code-dark-bg-focused: rgba(255, 255, 255, 24%);
 }

package/scss/_fonts.scss

@@ -30,4 +30,5 @@ $font-family:
   --font-body-3: 400 12px/16px #{$font-family};
   --font-section-head-1: 700 12px/16px #{$font-family};
   --font-section-head-2: 700 10px/16px #{$font-family};
+  --font-code: 500 14px/20px 'Roboto Mono', monospace;
 }