@logto/core-kit 2.8.0 → 2.10.0

package/lib/custom-ui-csp.d.ts

@@ -0,0 +1,50 @@
+import { z } from 'zod';
+export declare const customUiCspDirectives: readonly ["scriptSrc", "connectSrc"];
+export type CustomUiCspDirective = (typeof customUiCspDirectives)[number];
+export type CustomUiCsp = {
+    scriptSrc?: string[];
+    connectSrc?: string[];
+};
+export declare const customUiCspGuard: z.ZodObject<{
+    scriptSrc: z.ZodOptional<z.ZodArray<z.ZodString, "many">>;
+    connectSrc: z.ZodOptional<z.ZodArray<z.ZodString, "many">>;
+}, "strict", z.ZodTypeAny, {
+    scriptSrc?: string[] | undefined;
+    connectSrc?: string[] | undefined;
+}, {
+    scriptSrc?: string[] | undefined;
+    connectSrc?: string[] | undefined;
+}>;
+export declare enum CustomUiCspSourceValidationErrorCode {
+    EmptySource = "empty_source",
+    SemicolonNotAllowed = "semicolon_not_allowed",
+    CspKeywordNotSupported = "csp_keyword_not_supported",
+    MalformedUrl = "malformed_url",
+    DisallowedUrlParts = "disallowed_url_parts",
+    UnsupportedScheme = "unsupported_scheme",
+    MalformedWildcardHost = "malformed_wildcard_host",
+    MalformedHost = "malformed_host"
+}
+export type CustomUiCspSourceValidationError = {
+    readonly directive: CustomUiCspDirective;
+    readonly source: string;
+    readonly code: CustomUiCspSourceValidationErrorCode;
+};
+export type CustomUiCspSourceValidationResult = {
+    readonly isValid: true;
+    readonly value: string;
+} | {
+    readonly isValid: false;
+    readonly code: CustomUiCspSourceValidationErrorCode;
+};
+type CustomUiCspValidationOptions = {
+    readonly isProduction?: boolean;
+};
+export type NormalizeCustomUiCspResult = {
+    readonly customUiCsp: CustomUiCsp;
+    readonly errors: CustomUiCspSourceValidationError[];
+};
+export declare const normalizeCustomUiCspSourceExpression: (directive: CustomUiCspDirective, rawSource: string, options?: CustomUiCspValidationOptions) => CustomUiCspSourceValidationResult;
+export declare const normalizeCustomUiCsp: (customUiCsp: CustomUiCsp, options?: CustomUiCspValidationOptions) => NormalizeCustomUiCspResult;
+export declare const hasCustomUiCspSources: (customUiCsp?: CustomUiCsp) => boolean;
+export {};

package/lib/custom-ui-csp.js

@@ -0,0 +1,121 @@
+import { z } from 'zod';
+export const customUiCspDirectives = Object.freeze(['scriptSrc', 'connectSrc']);
+export const customUiCspGuard = z
+    .object({
+    scriptSrc: z.string().array().optional(),
+    connectSrc: z.string().array().optional(),
+})
+    .strict();
+export var CustomUiCspSourceValidationErrorCode;
+(function (CustomUiCspSourceValidationErrorCode) {
+    CustomUiCspSourceValidationErrorCode["EmptySource"] = "empty_source";
+    CustomUiCspSourceValidationErrorCode["SemicolonNotAllowed"] = "semicolon_not_allowed";
+    CustomUiCspSourceValidationErrorCode["CspKeywordNotSupported"] = "csp_keyword_not_supported";
+    CustomUiCspSourceValidationErrorCode["MalformedUrl"] = "malformed_url";
+    CustomUiCspSourceValidationErrorCode["DisallowedUrlParts"] = "disallowed_url_parts";
+    CustomUiCspSourceValidationErrorCode["UnsupportedScheme"] = "unsupported_scheme";
+    CustomUiCspSourceValidationErrorCode["MalformedWildcardHost"] = "malformed_wildcard_host";
+    CustomUiCspSourceValidationErrorCode["MalformedHost"] = "malformed_host";
+})(CustomUiCspSourceValidationErrorCode || (CustomUiCspSourceValidationErrorCode = {}));
+const validHostLabelRegEx = /^[\da-z](?:[\da-z-]{0,61}[\da-z])?$/;
+const isValidHostLabel = (label) => validHostLabelRegEx.test(label);
+const validateHostname = (hostname) => {
+    if (hostname === 'localhost') {
+        return;
+    }
+    const labels = hostname.split('.');
+    const wildcardCount = labels.filter((label) => label === '*').length;
+    if (wildcardCount > 0) {
+        return labels[0] === '*' &&
+            wildcardCount === 1 &&
+            labels.length >= 3 &&
+            labels.slice(1).every((label) => isValidHostLabel(label))
+            ? undefined
+            : CustomUiCspSourceValidationErrorCode.MalformedWildcardHost;
+    }
+    return labels.length >= 2 && labels.every((label) => isValidHostLabel(label))
+        ? undefined
+        : CustomUiCspSourceValidationErrorCode.MalformedHost;
+};
+const validateScheme = (directive, url, { isProduction = false }) => {
+    const isLocalhostHttpSource = !isProduction && url.protocol === 'http:' && url.hostname === 'localhost' && url.port;
+    if (isLocalhostHttpSource) {
+        return;
+    }
+    const allowedSchemes = directive === 'connectSrc' ? ['https:', 'wss:'] : ['https:'];
+    return allowedSchemes.includes(url.protocol)
+        ? undefined
+        : CustomUiCspSourceValidationErrorCode.UnsupportedScheme;
+};
+const getInvalidPlainSourceCode = (source) => {
+    if (!source) {
+        return CustomUiCspSourceValidationErrorCode.EmptySource;
+    }
+    if (source.includes(';')) {
+        return CustomUiCspSourceValidationErrorCode.SemicolonNotAllowed;
+    }
+    return source.includes("'")
+        ? CustomUiCspSourceValidationErrorCode.CspKeywordNotSupported
+        : undefined;
+};
+const hasDisallowedUrlParts = (url) => Boolean(url.username || url.password || url.search || url.hash);
+const normalizeParsedSourceExpression = (directive, url, options) => {
+    if (hasDisallowedUrlParts(url)) {
+        return {
+            isValid: false,
+            code: CustomUiCspSourceValidationErrorCode.DisallowedUrlParts,
+        };
+    }
+    const invalidSchemeCode = validateScheme(directive, url, options ?? {});
+    if (invalidSchemeCode) {
+        return { isValid: false, code: invalidSchemeCode };
+    }
+    const invalidHostCode = validateHostname(url.hostname);
+    if (invalidHostCode) {
+        return { isValid: false, code: invalidHostCode };
+    }
+    return {
+        isValid: true,
+        value: `${url.protocol}//${url.host}${url.pathname === '/' ? '' : url.pathname}`,
+    };
+};
+export const normalizeCustomUiCspSourceExpression = (directive, rawSource, options) => {
+    const source = rawSource.trim();
+    const invalidSourceCode = getInvalidPlainSourceCode(source);
+    if (invalidSourceCode) {
+        return { isValid: false, code: invalidSourceCode };
+    }
+    try {
+        return normalizeParsedSourceExpression(directive, new URL(source), options);
+    }
+    catch {
+        return { isValid: false, code: CustomUiCspSourceValidationErrorCode.MalformedUrl };
+    }
+};
+const normalizeDirectiveSources = (directive, sources, options) => {
+    const results = sources.map((source) => ({
+        source,
+        result: normalizeCustomUiCspSourceExpression(directive, source, options),
+    }));
+    return {
+        sources: [...new Set(results.flatMap(({ result }) => (result.isValid ? [result.value] : [])))],
+        errors: results.flatMap(({ source, result }) => result.isValid ? [] : [{ directive, source, code: result.code }]),
+    };
+};
+export const normalizeCustomUiCsp = (customUiCsp, options) => customUiCspDirectives.reduce(({ customUiCsp: normalizedCustomUiCsp, errors }, directive) => {
+    const sources = customUiCsp[directive];
+    if (!sources?.length) {
+        return { customUiCsp: normalizedCustomUiCsp, errors };
+    }
+    const result = normalizeDirectiveSources(directive, sources, options);
+    return {
+        customUiCsp: result.sources.length > 0
+            ? {
+                ...normalizedCustomUiCsp,
+                [directive]: result.sources,
+            }
+            : normalizedCustomUiCsp,
+        errors: [...errors, ...result.errors],
+    };
+}, { customUiCsp: {}, errors: [] });
+export const hasCustomUiCspSources = (customUiCsp) => Boolean(customUiCsp && customUiCspDirectives.some((directive) => customUiCsp[directive]?.length));

package/lib/index.d.ts

@@ -1,4 +1,5 @@
 export * from './utils/index.js';
+export * from './custom-ui-csp.js';
 export * from './regex.js';
 export * from './openid.js';
 export * from './models/index.js';

package/lib/index.js

@@ -1,4 +1,5 @@
 export * from './utils/index.js';
+export * from './custom-ui-csp.js';
 export * from './regex.js';
 export * from './openid.js';
 export * from './models/index.js';

package/lib/openid.d.ts

@@ -122,6 +122,7 @@ export declare const idTokenClaims: Readonly<Record<UserScope, UserClaim[]>>;
  * @see {@link userClaims} for all possible claims (used by userinfo endpoint).
  */
 export declare const extendedIdTokenClaimsByScope: Readonly<Partial<Record<UserScope, ExtendedIdTokenClaim[]>>>;
+export declare const protectedAppAdditionalScopes: readonly [UserScope.CustomData, UserScope.Identities, UserScope.Roles, UserScope.Organizations, UserScope.OrganizationRoles];
 /**
  * All possible claims for each scope, combining base ID token claims and extended claims.
  *

package/lib/openid.js

@@ -194,6 +194,13 @@ export const extendedIdTokenClaimsByScope = Object.freeze({
     [UserScope.Organizations]: ['organizations', 'organization_data'],
     [UserScope.OrganizationRoles]: ['organization_roles'],
 });
+export const protectedAppAdditionalScopes = [
+    UserScope.CustomData,
+    UserScope.Identities,
+    UserScope.Roles,
+    UserScope.Organizations,
+    UserScope.OrganizationRoles,
+];
 /**
  * All possible claims for each scope, combining base ID token claims and extended claims.
  *

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@logto/core-kit",
-  "version": "2.8.0",
+  "version": "2.10.0",
   "author": "Silverhand Inc. <contact@silverhand.io>",
   "homepage": "https://github.com/logto-io/toolkit#readme",
   "repository": {
@@ -36,7 +36,7 @@
     "@silverhand/essentials": "^2.9.1",
     "color": "^4.2.3",
     "@logto/language-kit": "^1.3.0",
-    "@logto/shared": "^3.3.1"
+    "@logto/shared": "^3.4.0"
   },
   "optionalDependencies": {
     "zod": "3.24.3"

package/scss/_console-themes.scss

@@ -166,6 +166,7 @@
   --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-subtle: rgba(93, 52, 242, 4%); // 4% Primary-40
   --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
@@ -390,6 +391,7 @@
   --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-subtle: rgba(202, 190, 255, 4%); // 4% Primary-40
   --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