@blocklet/sdk 1.16.44-beta-20250528-003415-7a5e5d90 → 1.16.44-beta-20250529-223630-10e16ac8

package/lib/config.d.ts

@@ -76,9 +76,20 @@ declare const _handleComponentInstalled: (data: {
 }) => void;
 declare const _handleConfigUpdate: (data: any) => void;
 declare const _handleComponentConfigUpdate: (data: any) => void;
+declare const getBlockletSettings: () => {
+    theme: {
+        prefer: "light";
+        light: {
+            palette: import("@mui/material").PaletteOptions;
+        };
+        dark: {
+            palette: import("@mui/material").PaletteOptions;
+        };
+    };
+};
 declare const getBlockletJs: (pageGroup?: string, pathPrefix?: string, source?: string) => string;
 export { logger, setLogger, env, componentStore as components, MountPoint, // @deprecated, for backward compatibility
-TComponent, events, Events, getBlockletJs, _handleComponentUpdateOld, _handleConfigUpdate, _handleComponentInstalled, _handleComponentUpdated, _handleComponentStarted, _handleComponentStopped, _handleComponentRemoved, _handleComponentConfigUpdate, };
+TComponent, events, Events, getBlockletJs, _handleComponentUpdateOld, _handleConfigUpdate, _handleComponentInstalled, _handleComponentUpdated, _handleComponentStarted, _handleComponentStopped, _handleComponentRemoved, _handleComponentConfigUpdate, getBlockletSettings, };
 declare const _default: {
     logger: {
         info: {
@@ -131,7 +142,18 @@ declare const _default: {
         componentRemoved: string;
         envUpdate: string;
     };
-    fetchBlockletJs: () => Promise<string>;
+    fetchBlockletJs: (type?: "js" | "json") => Promise<any>;
     getBlockletJs: (pageGroup?: string, pathPrefix?: string, source?: string) => string;
+    getBlockletSettings: () => {
+        theme: {
+            prefer: "light";
+            light: {
+                palette: import("@mui/material").PaletteOptions;
+            };
+            dark: {
+                palette: import("@mui/material").PaletteOptions;
+            };
+        };
+    };
 };
 export default _default;

package/lib/config.js

@@ -3,7 +3,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports._handleComponentConfigUpdate = exports._handleComponentRemoved = exports._handleComponentStopped = exports._handleComponentStarted = exports._handleComponentUpdated = exports._handleComponentInstalled = exports._handleConfigUpdate = exports._handleComponentUpdateOld = exports.getBlockletJs = exports.Events = exports.events = exports.components = exports.env = exports.setLogger = exports.logger = void 0;
+exports.getBlockletSettings = exports._handleComponentConfigUpdate = exports._handleComponentRemoved = exports._handleComponentStopped = exports._handleComponentStarted = exports._handleComponentUpdated = exports._handleComponentInstalled = exports._handleConfigUpdate = exports._handleComponentUpdateOld = exports.getBlockletJs = exports.Events = exports.events = exports.components = exports.env = exports.setLogger = exports.logger = void 0;
 /* eslint-disable prettier/prettier */
 /* eslint-disable no-console */
 const path_1 = __importDefault(require("path"));
@@ -14,6 +14,7 @@ const axios_1 = __importDefault(require("axios"));
 const debug_1 = __importDefault(require("debug"));
 const cloneDeep_1 = __importDefault(require("lodash/cloneDeep"));
 const throttle_1 = __importDefault(require("lodash/throttle"));
+const theme_1 = require("@blocklet/theme");
 const env_1 = __importDefault(require("@blocklet/env"));
 const constant_1 = require("@blocklet/constant");
 const util_1 = require("@blocklet/env/lib/util");
@@ -263,29 +264,66 @@ const _handleComponentConfigUpdate = (data) => {
     }
 };
 exports._handleComponentConfigUpdate = _handleComponentConfigUpdate;
+const DEFAULT_THEME_SETTINGS = {
+    prefer: 'light',
+    light: {
+        palette: theme_1.BLOCKLET_THEME_LIGHT.palette,
+    },
+    dark: {
+        palette: theme_1.BLOCKLET_THEME_DARK.palette,
+    },
+};
 let blockletJs = '';
-const fetchBlockletJs = async () => {
+let blockletSettings = { theme: DEFAULT_THEME_SETTINGS };
+const fetchBlockletJs = async (type = 'js') => {
     const componentDid = process.env.BLOCKLET_COMPONENT_DID;
     try {
         const { mountPoint } = componentStore.find((x) => x.did === componentDid);
-        const res = await axios_1.default.get((0, ufo_1.joinURL)(env.appUrl, mountPoint === '/' ? '' : mountPoint, `__blocklet__.js?nocache=1&t=${Date.now()}`), {
+        const url = (0, ufo_1.joinURL)(env.appUrl, mountPoint === '/' ? '' : mountPoint, `__blocklet__.js?nocache=1&t=${Date.now()}${type === 'json' ? '&type=json' : ''}`);
+        const res = await axios_1.default.get(url, {
             timeout: 8000,
             headers: {
                 'User-Agent': `BlockletSDK/${version_1.version}`,
             },
         });
-        if (typeof res.data === 'string' && res.data.startsWith('window.blocklet')) {
-            blockletJs = res.data;
-            logger.info(`Fetch blocklet.js succeed: ${env.appPid}/${componentDid}`);
-            return res.data;
+        if (type === 'js') {
+            if (typeof res.data === 'string' && res.data.startsWith('window.blocklet')) {
+                blockletJs = res.data;
+                logger.info(`Fetch blocklet.js succeed: ${env.appPid}/${componentDid}`);
+                return res.data;
+            }
+            throw new Error('Invalid blocklet.js');
+        }
+        else {
+            let data;
+            try {
+                data = typeof res.data === 'string' ? JSON.parse(res.data) : res.data;
+            }
+            catch (e) {
+                throw new Error('Invalid blocklet.json response');
+            }
+            if (typeof data === 'object') {
+                blockletSettings = {
+                    theme: (0, theme_1.merge)(DEFAULT_THEME_SETTINGS, data.theme || {}),
+                };
+                logger.info(`Fetch blocklet.json succeed: ${env.appPid}/${componentDid}`);
+                return data;
+            }
+            throw new Error('Invalid blocklet.json data');
         }
-        throw new Error('Invalid blocklet.js');
     }
     catch (err) {
-        logger.error(`Fetch blocklet.js failed: ${env.appPid}/${componentDid}`, err.message);
-        return '';
+        logger.error(`Fetch blocklet.${type} failed: ${env.appPid}/${componentDid}`, err.message);
+        return type === 'js' ? '' : {};
     }
 };
+const getBlockletSettings = () => {
+    return blockletSettings;
+};
+exports.getBlockletSettings = getBlockletSettings;
+const refreshBlockletContext = (0, throttle_1.default)(async () => {
+    await Promise.all([fetchBlockletJs('js'), fetchBlockletJs('json')]);
+}, 3000, { trailing: true });
 // Page group is dynamic, so we need to create it on the fly
 const normalize = (prefix) => `/${prefix}/`.replace(/\/+/g, '/');
 const getBlockletJs = (pageGroup = '', pathPrefix = '', source = blockletJs) => {
@@ -303,7 +341,7 @@ const getBlockletJs = (pageGroup = '', pathPrefix = '', source = blockletJs) =>
     return copy;
 };
 exports.getBlockletJs = getBlockletJs;
-const refreshBlockletJs = (0, throttle_1.default)(fetchBlockletJs, 3000, { trailing: true });
+// prettier-ignore
 const runInServer = (fn, type) => 
 // eslint-disable-next-line consistent-return
 (...args) => {
@@ -321,23 +359,23 @@ if (inRuntimeEnv && !process.env.BLOCKLET_HOOK_NAME && process.env.BLOCKLET_MODE
     notification_1.default.on(constant_1.BlockletInternalEvents.appConfigChanged, _handleConfigUpdate);
     notification_1.default.on(constant_1.BlockletInternalEvents.componentConfigChanged, _handleComponentConfigUpdate);
     // Reactive fetch
-    notification_1.default.on(constant_1.BlockletInternalEvents.appConfigChanged, refreshBlockletJs);
-    notification_1.default.on(constant_1.BlockletInternalEvents.appSettingChanged, refreshBlockletJs);
-    notification_1.default.on(constant_1.BlockletInternalEvents.componentConfigChanged, refreshBlockletJs);
+    notification_1.default.on(constant_1.BlockletInternalEvents.appConfigChanged, refreshBlockletContext);
+    notification_1.default.on(constant_1.BlockletInternalEvents.appSettingChanged, refreshBlockletContext);
+    notification_1.default.on(constant_1.BlockletInternalEvents.componentConfigChanged, refreshBlockletContext);
     notification_1.default.on(constant_1.BlockletInternalEvents.componentInstalled, runInServer(_handleComponentInstalled, 'new'));
     notification_1.default.on(constant_1.BlockletInternalEvents.componentUpgraded, runInServer(_handleComponentUpdated, 'new'));
     notification_1.default.on(constant_1.BlockletInternalEvents.componentUpdated, runInServer(_handleComponentUpdated, 'new'));
     notification_1.default.on(constant_1.BlockletInternalEvents.componentStarted, runInServer(_handleComponentStarted, 'new'));
     notification_1.default.on(constant_1.BlockletInternalEvents.componentStopped, runInServer(_handleComponentStopped, 'new'));
     notification_1.default.on(constant_1.BlockletInternalEvents.componentRemoved, runInServer(_handleComponentRemoved, 'new'));
-    notification_1.default.on(constant_1.BlockletInternalEvents.componentInstalled, runInServer(refreshBlockletJs, 'new'));
-    notification_1.default.on(constant_1.BlockletInternalEvents.componentUpgraded, runInServer(refreshBlockletJs, 'new'));
-    notification_1.default.on(constant_1.BlockletInternalEvents.componentUpdated, runInServer(refreshBlockletJs, 'new'));
-    notification_1.default.on(constant_1.BlockletInternalEvents.componentStarted, runInServer(refreshBlockletJs, 'new'));
-    notification_1.default.on(constant_1.BlockletInternalEvents.componentStopped, runInServer(refreshBlockletJs, 'new'));
-    notification_1.default.on(constant_1.BlockletInternalEvents.componentRemoved, runInServer(refreshBlockletJs, 'new'));
+    notification_1.default.on(constant_1.BlockletInternalEvents.componentInstalled, runInServer(refreshBlockletContext, 'new'));
+    notification_1.default.on(constant_1.BlockletInternalEvents.componentUpgraded, runInServer(refreshBlockletContext, 'new'));
+    notification_1.default.on(constant_1.BlockletInternalEvents.componentUpdated, runInServer(refreshBlockletContext, 'new'));
+    notification_1.default.on(constant_1.BlockletInternalEvents.componentStarted, runInServer(refreshBlockletContext, 'new'));
+    notification_1.default.on(constant_1.BlockletInternalEvents.componentStopped, runInServer(refreshBlockletContext, 'new'));
+    notification_1.default.on(constant_1.BlockletInternalEvents.componentRemoved, runInServer(refreshBlockletContext, 'new'));
     // Do an initial fetch
-    fetchBlockletJs();
+    refreshBlockletContext();
 }
 exports.default = {
     logger,
@@ -348,4 +386,5 @@ exports.default = {
     Events,
     fetchBlockletJs,
     getBlockletJs,
+    getBlockletSettings,
 };

package/lib/middlewares/fallback.d.ts

@@ -11,6 +11,7 @@ type FallbackOptions = {
     timeout?: number;
     maxLength?: number;
     cacheTtl?: number;
+    injectBlockletJs?: boolean;
 };
 declare const fallback: (file: string, options?: FallbackOptions) => (req: Request, res: Response, next: NextFunction) => Promise<void>;
 export = fallback;

package/lib/middlewares/fallback.js

@@ -8,6 +8,7 @@ const ufo_1 = require("ufo");
 const escape_1 = __importDefault(require("lodash/escape"));
 const crypto_1 = __importDefault(require("crypto"));
 const constant_1 = require("@blocklet/constant");
+const theme_1 = require("@blocklet/theme");
 const config_1 = require("../config");
 // Cache configurations
 const DEFAULT_CACHE_TTL = 1 * 60 * 1000; // 1 minute
@@ -66,6 +67,49 @@ const tryWithTimeout = (asyncFn, timeout) => {
         }
     });
 };
+const buildThemeStyles = (theme) => {
+    const { light, dark } = theme;
+    return `
+    <style id="blocklet-theme-style">
+      :root {
+        --blocklet-background-default-color: ${light.palette?.background?.default ?? '#fff'};
+        --blocklet-text-primary-color: ${light.palette?.text?.primary ?? '#000'};
+      }
+
+      [data-theme='dark'] {
+        --blocklet-background-default-color: ${dark.palette?.background?.default ?? '#000'};
+        --blocklet-text-primary-color: ${dark.palette?.text?.primary ?? '#fff'};
+      }
+
+      html, body {
+        background-color: var(--blocklet-background-default-color);
+        color: var(--blocklet-text-primary-color);
+      }
+    </style>
+  `;
+};
+const buildThemeScript = (theme) => {
+    return `
+    <script id="blocklet-theme-script">
+      (function() {
+        try {
+          const BLOCKLET_THEME_PREFER_KEY = '${theme_1.BLOCKLET_THEME_PREFER_KEY}';
+          ${theme_1.isValidThemeMode.toString()}
+          ${theme_1.getDefaultThemePrefer.toString()}
+
+          const prefer = getDefaultThemePrefer(${JSON.stringify({ theme: { prefer: theme.prefer } })});
+          if(prefer === 'dark') {
+            document.documentElement.setAttribute('data-theme', 'dark');
+          } else {
+            document.documentElement.removeAttribute('data-theme');
+          }
+        } catch (e) {
+          console.error('Theme init error:', e);
+        }
+      })();
+    </script>
+  `;
+};
 const fallback = (file, options = {}) => {
     const filePath = options.root ? (0, path_1.join)(options.root, file) : file;
     // Check file existence during initialization
@@ -82,6 +126,7 @@ const fallback = (file, options = {}) => {
             const pageGroup = req.headers['x-page-group'] || '';
             const pathPrefix = req.headers['x-path-prefix'] || '';
             const cacheKey = getCacheKey(req.path, filePath, pageGroup, pathPrefix);
+            const { theme } = (0, config_1.getBlockletSettings)();
             if (cacheEnabled) {
                 // Check cache first
                 const cached = cache.get(cacheKey);
@@ -125,11 +170,22 @@ const fallback = (file, options = {}) => {
                 source = source.replace(HEAD_END_TAG, `<link rel="blocklet-open-embed" type="application/json" href="${pageData.embed}" />${HEAD_END_TAG}`);
             }
             const blockletJs = (0, config_1.getBlockletJs)(pageGroup, pathPrefix);
-            if (blockletJs) {
+            if (blockletJs && options.injectBlockletJs !== false) {
                 source = source
                     .replace('<script src="__blocklet__.js"></script>', `<script>${blockletJs}</script>`)
                     .replace('<script src="__meta__.js"></script>', `<script>${blockletJs}</script>`);
             }
+            // Inject theme styles and script
+            const themeStyles = buildThemeStyles(theme);
+            const themeScript = buildThemeScript(theme);
+            // 注入主题样式
+            if (!source.includes('<style id="blocklet-theme">')) {
+                source = source.replace(HEAD_END_TAG, `${themeStyles}${HEAD_END_TAG}`);
+            }
+            // 注入主题切换脚本
+            if (!source.includes('<script id="blocklet-theme-script">')) {
+                source = source.replace(HEAD_END_TAG, `${themeScript}${HEAD_END_TAG}`);
+            }
             // Cache the processed response
             const etag = generateETag(source);
             cache.set(cacheKey, {

package/lib/middlewares/index.d.ts

@@ -41,6 +41,7 @@ declare const _default: {
         timeout?: number;
         maxLength?: number;
         cacheTtl?: number;
+        injectBlockletJs?: boolean;
     }) => (req: import("express").Request, res: import("express").Response, next: import("express").NextFunction) => Promise<void>;
     sitemap: (generatorFn: (fn: (item: {
         url: string;

package/package.json

@@ -3,7 +3,7 @@
   "publishConfig": {
     "access": "public"
   },
-  "version": "1.16.44-beta-20250528-003415-7a5e5d90",
+  "version": "1.16.44-beta-20250529-223630-10e16ac8",
   "description": "graphql client to read/write data on abt node",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -27,17 +27,18 @@
   "author": "linchen1987 <linchen.1987@foxmail.com> (http://github.com/linchen1987)",
   "license": "Apache-2.0",
   "dependencies": {
-    "@abtnode/client": "1.16.44-beta-20250528-003415-7a5e5d90",
-    "@abtnode/constant": "1.16.44-beta-20250528-003415-7a5e5d90",
-    "@abtnode/util": "1.16.44-beta-20250528-003415-7a5e5d90",
+    "@abtnode/client": "1.16.44-beta-20250529-223630-10e16ac8",
+    "@abtnode/constant": "1.16.44-beta-20250529-223630-10e16ac8",
+    "@abtnode/util": "1.16.44-beta-20250529-223630-10e16ac8",
     "@arcblock/did": "1.20.11",
     "@arcblock/did-auth": "1.20.11",
     "@arcblock/jwt": "1.20.11",
     "@arcblock/ws": "1.20.11",
-    "@blocklet/constant": "1.16.44-beta-20250528-003415-7a5e5d90",
-    "@blocklet/env": "1.16.44-beta-20250528-003415-7a5e5d90",
+    "@blocklet/constant": "1.16.44-beta-20250529-223630-10e16ac8",
+    "@blocklet/env": "1.16.44-beta-20250529-223630-10e16ac8",
     "@blocklet/error": "^0.2.4",
-    "@blocklet/meta": "1.16.44-beta-20250528-003415-7a5e5d90",
+    "@blocklet/meta": "1.16.44-beta-20250529-223630-10e16ac8",
+    "@blocklet/theme": "^2.13.55",
     "@did-connect/authenticator": "^2.2.8",
     "@did-connect/handler": "^2.2.8",
     "@nedb/core": "^2.1.5",
@@ -83,5 +84,5 @@
     "ts-node": "^10.9.1",
     "typescript": "^5.6.3"
   },
-  "gitHead": "095d89d3b8e40dc1d956203cac94a45a4a843024"
+  "gitHead": "381ba5459e32dd7bc94f7ea62df65b72644d6d16"
 }