@nocobase/flow-engine 2.0.0-alpha.4 → 2.0.0-alpha.41

package/lib/runjs-context/snippets/index.js

@@ -38,57 +38,179 @@ var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: tru
 var snippets_exports = {};
 __export(snippets_exports, {
   default: () => snippets_default,
-  engineSnippets: () => engineSnippets
+  getSnippetBody: () => getSnippetBody,
+  listSnippetsForContext: () => listSnippetsForContext
 });
 module.exports = __toCommonJS(snippets_exports);
-const engineSnippets = {
+var import_registry = require("../registry");
+const snippets = {
   // global
   "global/message-success": /* @__PURE__ */ __name(() => import("./global/message-success.snippet"), "global/message-success"),
   "global/message-error": /* @__PURE__ */ __name(() => import("./global/message-error.snippet"), "global/message-error"),
-  "global/copy-to-clipboard": /* @__PURE__ */ __name(() => import("./global/copy-to-clipboard.snippet"), "global/copy-to-clipboard"),
-  "global/copy-record-json": /* @__PURE__ */ __name(() => import("./global/copy-record-json.snippet"), "global/copy-record-json"),
-  "global/log-json-record": /* @__PURE__ */ __name(() => import("./global/log-json-record.snippet"), "global/log-json-record"),
-  "global/api-request-get": /* @__PURE__ */ __name(() => import("./global/api-request-get.snippet"), "global/api-request-get"),
-  "global/api-request-post": /* @__PURE__ */ __name(() => import("./global/api-request-post.snippet"), "global/api-request-post"),
-  "global/requireAsync": /* @__PURE__ */ __name(() => import("./global/requireAsync.snippet"), "global/requireAsync"),
-  "global/try-catch-async": /* @__PURE__ */ __name(() => import("./global/try-catch-async.snippet"), "global/try-catch-async"),
-  "global/sleep": /* @__PURE__ */ __name(() => import("./global/sleep.snippet"), "global/sleep"),
+  "global/api-request": /* @__PURE__ */ __name(() => import("./global/api-request.snippet"), "global/api-request"),
+  "global/require-amd": /* @__PURE__ */ __name(() => import("./global/require-amd.snippet"), "global/require-amd"),
+  "global/import-esm": /* @__PURE__ */ __name(() => import("./global/import-esm.snippet"), "global/import-esm"),
   "global/notification-open": /* @__PURE__ */ __name(() => import("./global/notification-open.snippet"), "global/notification-open"),
   "global/window-open": /* @__PURE__ */ __name(() => import("./global/window-open.snippet"), "global/window-open"),
-  "global/console-log-ctx": /* @__PURE__ */ __name(() => import("./global/console-log-ctx.snippet"), "global/console-log-ctx"),
   "global/open-view-drawer": /* @__PURE__ */ __name(() => import("./global/open-view-drawer.snippet"), "global/open-view-drawer"),
   "global/open-view-dialog": /* @__PURE__ */ __name(() => import("./global/open-view-dialog.snippet"), "global/open-view-dialog"),
-  "global/view-navigation-push": /* @__PURE__ */ __name(() => import("./global/view-navigation-push.snippet"), "global/view-navigation-push"),
+  "global/query-selector": /* @__PURE__ */ __name(() => import("./global/query-selector.snippet"), "global/query-selector"),
+  "global/clipboard-copy-text": /* @__PURE__ */ __name(() => import("./global/clipboard-copy-text.snippet"), "global/clipboard-copy-text"),
   // libs
-  "libs/echarts-init": /* @__PURE__ */ __name(() => import("./libs/echarts-init.snippet"), "libs/echarts-init"),
-  // scene/jsblock
-  "scene/jsblock/render-basic": /* @__PURE__ */ __name(() => import("./scene/jsblock/render-basic.snippet"), "scene/jsblock/render-basic"),
-  "scene/jsblock/render-react": /* @__PURE__ */ __name(() => import("./scene/jsblock/render-react.snippet"), "scene/jsblock/render-react"),
-  "scene/jsblock/render-card": /* @__PURE__ */ __name(() => import("./scene/jsblock/render-card.snippet"), "scene/jsblock/render-card"),
-  "scene/jsblock/render-button-handler": /* @__PURE__ */ __name(() => import("./scene/jsblock/render-button-handler.snippet"), "scene/jsblock/render-button-handler"),
-  "scene/jsblock/jsx-mount": /* @__PURE__ */ __name(() => import("./scene/jsblock/jsx-mount.snippet"), "scene/jsblock/jsx-mount"),
-  "scene/jsblock/jsx-unmount": /* @__PURE__ */ __name(() => import("./scene/jsblock/jsx-unmount.snippet"), "scene/jsblock/jsx-unmount"),
-  "scene/jsblock/add-event-listener": /* @__PURE__ */ __name(() => import("./scene/jsblock/add-event-listener.snippet"), "scene/jsblock/add-event-listener"),
-  "scene/jsblock/append-style": /* @__PURE__ */ __name(() => import("./scene/jsblock/append-style.snippet"), "scene/jsblock/append-style"),
-  // scene/jsfield
-  "scene/jsfield/innerHTML-value": /* @__PURE__ */ __name(() => import("./scene/jsfield/innerHTML-value.snippet"), "scene/jsfield/innerHTML-value"),
-  "scene/jsfield/format-number": /* @__PURE__ */ __name(() => import("./scene/jsfield/format-number.snippet"), "scene/jsfield/format-number"),
-  "scene/jsfield/color-by-value": /* @__PURE__ */ __name(() => import("./scene/jsfield/color-by-value.snippet"), "scene/jsfield/color-by-value"),
-  // scene/jsitem
-  "scene/jsitem/render-basic": /* @__PURE__ */ __name(() => import("./scene/jsitem/render-basic.snippet"), "scene/jsitem/render-basic"),
-  // scene/actions
-  "scene/actions/record-id-message": /* @__PURE__ */ __name(() => import("./scene/actions/record-id-message.snippet"), "scene/actions/record-id-message"),
-  "scene/actions/run-action-basic": /* @__PURE__ */ __name(() => import("./scene/actions/run-action-basic.snippet"), "scene/actions/run-action-basic"),
-  "scene/actions/collection-selected-count": /* @__PURE__ */ __name(() => import("./scene/actions/collection-selected-count.snippet"), "scene/actions/collection-selected-count"),
-  "scene/actions/iterate-selected-rows": /* @__PURE__ */ __name(() => import("./scene/actions/iterate-selected-rows.snippet"), "scene/actions/iterate-selected-rows"),
-  // scene/linkage
-  "scene/linkage/set-field-value": /* @__PURE__ */ __name(() => import("./scene/linkage/set-field-value.snippet"), "scene/linkage/set-field-value"),
-  "scene/linkage/toggle-visible": /* @__PURE__ */ __name(() => import("./scene/linkage/toggle-visible.snippet"), "scene/linkage/toggle-visible"),
-  "scene/linkage/set-disabled": /* @__PURE__ */ __name(() => import("./scene/linkage/set-disabled.snippet"), "scene/linkage/set-disabled"),
-  "scene/linkage/set-required": /* @__PURE__ */ __name(() => import("./scene/linkage/set-required.snippet"), "scene/linkage/set-required")
+  "scene/block/echarts-init": /* @__PURE__ */ __name(() => import("./scene/block/echarts-init.snippet"), "scene/block/echarts-init"),
+  // scene/block
+  "scene/block/render-react": /* @__PURE__ */ __name(() => import("./scene/block/render-react.snippet"), "scene/block/render-react"),
+  "scene/block/render-react-jsx": /* @__PURE__ */ __name(() => import("./scene/block/render-react-jsx.snippet"), "scene/block/render-react-jsx"),
+  "scene/block/render-antd-icons": /* @__PURE__ */ __name(() => import("./scene/block/render-antd-icons.snippet"), "scene/block/render-antd-icons"),
+  "scene/block/render-button-handler": /* @__PURE__ */ __name(() => import("./scene/block/render-button-handler.snippet"), "scene/block/render-button-handler"),
+  "scene/block/add-event-listener": /* @__PURE__ */ __name(() => import("./scene/block/add-event-listener.snippet"), "scene/block/add-event-listener"),
+  "scene/block/chartjs-bar": /* @__PURE__ */ __name(() => import("./scene/block/chartjs-bar.snippet"), "scene/block/chartjs-bar"),
+  "scene/block/vue-component": /* @__PURE__ */ __name(() => import("./scene/block/vue-component.snippet"), "scene/block/vue-component"),
+  "scene/block/resource-example": /* @__PURE__ */ __name(() => import("./scene/block/resource-example.snippet"), "scene/block/resource-example"),
+  "scene/block/api-fetch-render-list": /* @__PURE__ */ __name(() => import("./scene/block/api-fetch-render-list.snippet"), "scene/block/api-fetch-render-list"),
+  "scene/block/render-info-card": /* @__PURE__ */ __name(() => import("./scene/block/render-info-card.snippet"), "scene/block/render-info-card"),
+  "scene/block/render-statistics": /* @__PURE__ */ __name(() => import("./scene/block/render-statistics.snippet"), "scene/block/render-statistics"),
+  "scene/block/render-timeline": /* @__PURE__ */ __name(() => import("./scene/block/render-timeline.snippet"), "scene/block/render-timeline"),
+  "scene/block/render-iframe": /* @__PURE__ */ __name(() => import("./scene/block/render-iframe.snippet"), "scene/block/render-iframe"),
+  // scene/detail
+  "scene/detail/innerHTML-value": /* @__PURE__ */ __name(() => import("./scene/detail/innerHTML-value.snippet"), "scene/detail/innerHTML-value"),
+  "scene/detail/format-number": /* @__PURE__ */ __name(() => import("./scene/detail/format-number.snippet"), "scene/detail/format-number"),
+  "scene/detail/color-by-value": /* @__PURE__ */ __name(() => import("./scene/detail/color-by-value.snippet"), "scene/detail/color-by-value"),
+  "scene/detail/copy-to-clipboard": /* @__PURE__ */ __name(() => import("./scene/detail/copy-to-clipboard.snippet"), "scene/detail/copy-to-clipboard"),
+  "scene/detail/status-tag": /* @__PURE__ */ __name(() => import("./scene/detail/status-tag.snippet"), "scene/detail/status-tag"),
+  "scene/detail/relative-time": /* @__PURE__ */ __name(() => import("./scene/detail/relative-time.snippet"), "scene/detail/relative-time"),
+  "scene/detail/percentage-bar": /* @__PURE__ */ __name(() => import("./scene/detail/percentage-bar.snippet"), "scene/detail/percentage-bar"),
+  // scene/form
+  "scene/form/render-basic": /* @__PURE__ */ __name(() => import("./scene/form/render-basic.snippet"), "scene/form/render-basic"),
+  "scene/form/set-field-value": /* @__PURE__ */ __name(() => import("./scene/form/set-field-value.snippet"), "scene/form/set-field-value"),
+  "scene/form/toggle-visible": /* @__PURE__ */ __name(() => import("./scene/form/toggle-visible.snippet"), "scene/form/toggle-visible"),
+  "scene/form/set-disabled": /* @__PURE__ */ __name(() => import("./scene/form/set-disabled.snippet"), "scene/form/set-disabled"),
+  "scene/form/set-required": /* @__PURE__ */ __name(() => import("./scene/form/set-required.snippet"), "scene/form/set-required"),
+  "scene/form/calculate-total": /* @__PURE__ */ __name(() => import("./scene/form/calculate-total.snippet"), "scene/form/calculate-total"),
+  "scene/form/conditional-required": /* @__PURE__ */ __name(() => import("./scene/form/conditional-required.snippet"), "scene/form/conditional-required"),
+  "scene/form/cascade-select": /* @__PURE__ */ __name(() => import("./scene/form/cascade-select.snippet"), "scene/form/cascade-select"),
+  "scene/form/toggle-multiple-fields": /* @__PURE__ */ __name(() => import("./scene/form/toggle-multiple-fields.snippet"), "scene/form/toggle-multiple-fields"),
+  "scene/form/copy-field-values": /* @__PURE__ */ __name(() => import("./scene/form/copy-field-values.snippet"), "scene/form/copy-field-values"),
+  // scene/table
+  "scene/table/cell-open-dialog": /* @__PURE__ */ __name(() => import("./scene/table/cell-open-dialog.snippet"), "scene/table/cell-open-dialog"),
+  "scene/table/concat-fields": /* @__PURE__ */ __name(() => import("./scene/table/concat-fields.snippet"), "scene/table/concat-fields"),
+  "scene/table/collection-selected-count": /* @__PURE__ */ __name(() => import("./scene/table/collection-selected-count.snippet"), "scene/table/collection-selected-count"),
+  "scene/table/iterate-selected-rows": /* @__PURE__ */ __name(() => import("./scene/table/iterate-selected-rows.snippet"), "scene/table/iterate-selected-rows"),
+  "scene/table/destroy-selected": /* @__PURE__ */ __name(() => import("./scene/table/destroy-selected.snippet"), "scene/table/destroy-selected"),
+  "scene/table/export-selected-json": /* @__PURE__ */ __name(() => import("./scene/table/export-selected-json.snippet"), "scene/table/export-selected-json")
 };
-var snippets_default = engineSnippets;
+var snippets_default = snippets;
+function deriveNameFromKey(key) {
+  const parts = key.split("/");
+  return parts[parts.length - 1] || key;
+}
+__name(deriveNameFromKey, "deriveNameFromKey");
+function normalizeScenes(def, key) {
+  if (Array.isArray(def == null ? void 0 : def.scenes) && def.scenes.length) {
+    return def.scenes.map((scene) => String(scene).trim()).filter((scene) => scene.length > 0);
+  }
+  const parts = key.split("/");
+  if (parts[0] === "scene" && parts[1]) {
+    return [parts[1]];
+  }
+  return [];
+}
+__name(normalizeScenes, "normalizeScenes");
+function computeGroups(def, key) {
+  const scenes = normalizeScenes(def, key);
+  if (scenes.length) {
+    return scenes.map((scene) => `scene/${scene}`);
+  }
+  const parts = key.split("/");
+  if (!parts.length) return [];
+  const first = parts[0];
+  if (first === "global" || first === "libs") return [first];
+  if (first === "scene" && parts.length >= 2) return [`${first}/${parts[1]}`];
+  if (parts.length >= 2) return [`${parts[0]}/${parts[1]}`];
+  return [parts[0]];
+}
+__name(computeGroups, "computeGroups");
+function resolveLocaleMeta(def, locale) {
+  if (!locale || !(def == null ? void 0 : def.locales)) return {};
+  const exact = def.locales[locale];
+  if (exact) return exact;
+  const normalized = locale.toLowerCase();
+  if (normalized !== locale && def.locales[normalized]) return def.locales[normalized];
+  const base = locale.split("-")[0];
+  if (base && def.locales[base]) return def.locales[base];
+  if (base) {
+    const lowerBase = base.toLowerCase();
+    if (def.locales[lowerBase]) return def.locales[lowerBase];
+  }
+  return {};
+}
+__name(resolveLocaleMeta, "resolveLocaleMeta");
+async function getSnippetBody(ref) {
+  const loader = snippets[ref];
+  if (!loader) throw new Error(`[flow-engine] snippet not found: ${ref}`);
+  const mod = await loader();
+  const def = mod == null ? void 0 : mod.default;
+  const content = (def == null ? void 0 : def.content) ?? (mod == null ? void 0 : mod.content) ?? (mod == null ? void 0 : mod.body) ?? "";
+  return typeof content === "string" ? content : String(content ?? "");
+}
+__name(getSnippetBody, "getSnippetBody");
+async function listSnippetsForContext(ctxClassName, version = "v1", locale) {
+  const entries = [];
+  const allowedContextNames = /* @__PURE__ */ new Set();
+  if (typeof ctxClassName === "string" && ctxClassName) allowedContextNames.add(ctxClassName);
+  try {
+    const resolvedCtor = import_registry.RunJSContextRegistry["resolve"](version, ctxClassName);
+    if (resolvedCtor == null ? void 0 : resolvedCtor.name) allowedContextNames.add(resolvedCtor.name);
+  } catch (_) {
+  }
+  await Promise.all(
+    Object.entries(snippets).map(async ([key, loader]) => {
+      const mod = await loader();
+      const def = (mod == null ? void 0 : mod.default) || {};
+      const body = (def == null ? void 0 : def.content) ?? (mod == null ? void 0 : mod.content);
+      if (typeof body !== "string") return;
+      let ok = true;
+      if (Array.isArray(def == null ? void 0 : def.contexts) && def.contexts.length) {
+        const ctxNames = def.contexts.map((item) => {
+          if (item === "*") return "*";
+          if (typeof item === "string") return item;
+          if (typeof item === "function") return item.name || "*";
+          if (item && typeof item === "object" && typeof item.name === "string") return item.name;
+          return String(item ?? "");
+        });
+        if (ctxClassName === "*") {
+          ok = true;
+        } else {
+          ok = ctxNames.includes("*") || ctxNames.some((name2) => allowedContextNames.has(name2));
+        }
+      }
+      if (ok && Array.isArray(def == null ? void 0 : def.versions) && def.versions.length) {
+        ok = def.versions.includes("*") || def.versions.includes(version);
+      }
+      if (!ok) return;
+      const localeMeta = resolveLocaleMeta(def, locale);
+      const name = localeMeta.label || (def == null ? void 0 : def.label) || deriveNameFromKey(key);
+      const description = localeMeta.description ?? (def == null ? void 0 : def.description);
+      const prefix = (def == null ? void 0 : def.prefix) || name;
+      const groups = computeGroups(def, key);
+      const scenes = normalizeScenes(def, key);
+      entries.push({
+        name,
+        prefix,
+        description,
+        body,
+        ref: key,
+        group: groups[0],
+        groups,
+        scenes
+      });
+    })
+  );
+  return entries;
+}
+__name(listSnippetsForContext, "listSnippetsForContext");
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
-  engineSnippets
+  getSnippetBody,
+  listSnippetsForContext
 });

package/lib/runjs-context/snippets/scene/block/add-event-listener.snippet.d.ts

@@ -0,0 +1,11 @@
+/**
+ * This file is part of the NocoBase (R) project.
+ * Copyright (c) 2020-2024 NocoBase Co., Ltd.
+ * Authors: NocoBase Team.
+ *
+ * This project is dual-licensed under AGPL-3.0 and NocoBase Commercial License.
+ * For more information, please refer to: https://www.nocobase.com/agreement.
+ */
+import type { SnippetModule } from '../../types';
+declare const snippet: SnippetModule;
+export default snippet;

package/lib/runjs-context/snippets/scene/{jsblock → block}/add-event-listener.snippet.js

@@ -29,10 +29,18 @@ __export(add_event_listener_snippet_exports, {
   default: () => add_event_listener_snippet_default
 });
 module.exports = __toCommonJS(add_event_listener_snippet_exports);
-var add_event_listener_snippet_default = {
-  contexts: ["JSBlockRunJSContext"],
+var import_JSBlockRunJSContext = require("../../../contexts/JSBlockRunJSContext");
+const snippet = {
+  contexts: [import_JSBlockRunJSContext.JSBlockRunJSContext],
   prefix: "sn-jsb-click",
   label: "Add click listener",
+  description: "Render a button and bind a click event handler",
+  locales: {
+    "zh-CN": {
+      label: "\u6DFB\u52A0\u70B9\u51FB\u76D1\u542C",
+      description: "\u6E32\u67D3\u6309\u94AE\u5E76\u7ED1\u5B9A\u70B9\u51FB\u4E8B\u4EF6\u5904\u7406"
+    }
+  },
   content: `
 // Render a button and bind a click handler
 ctx.element.innerHTML = \`
@@ -44,3 +52,4 @@ if (btn) {
 }
 `
 };
+var add_event_listener_snippet_default = snippet;

package/lib/runjs-context/snippets/scene/block/api-fetch-render-list.snippet.d.ts

@@ -0,0 +1,11 @@
+/**
+ * This file is part of the NocoBase (R) project.
+ * Copyright (c) 2020-2024 NocoBase Co., Ltd.
+ * Authors: NocoBase Team.
+ *
+ * This project is dual-licensed under AGPL-3.0 and NocoBase Commercial License.
+ * For more information, please refer to: https://www.nocobase.com/agreement.
+ */
+import type { SnippetModule } from '../../types';
+declare const snippet: SnippetModule;
+export default snippet;

package/lib/runjs-context/snippets/scene/block/api-fetch-render-list.snippet.js

@@ -0,0 +1,64 @@
+/**
+ * This file is part of the NocoBase (R) project.
+ * Copyright (c) 2020-2024 NocoBase Co., Ltd.
+ * Authors: NocoBase Team.
+ *
+ * This project is dual-licensed under AGPL-3.0 and NocoBase Commercial License.
+ * For more information, please refer to: https://www.nocobase.com/agreement.
+ */
+
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var api_fetch_render_list_snippet_exports = {};
+__export(api_fetch_render_list_snippet_exports, {
+  default: () => api_fetch_render_list_snippet_default
+});
+module.exports = __toCommonJS(api_fetch_render_list_snippet_exports);
+var import_JSBlockRunJSContext = require("../../../contexts/JSBlockRunJSContext");
+const snippet = {
+  contexts: [import_JSBlockRunJSContext.JSBlockRunJSContext],
+  prefix: "sn-jsb-fetch-list",
+  label: "Fetch & render list",
+  description: "Fetch a small list via ctx.api and render basic HTML",
+  locales: {
+    "zh-CN": {
+      label: "\u62C9\u53D6\u5E76\u6E32\u67D3\u5217\u8868",
+      description: "\u4F7F\u7528 ctx.api \u62C9\u53D6\u5C11\u91CF\u6570\u636E\uFF0C\u5E76\u6E32\u67D3\u57FA\u7840 HTML \u5217\u8868"
+    }
+  },
+  content: `
+// Fetch users
+const { data } = await ctx.api.request({
+  url: 'users:list',
+  method: 'get',
+  params: { pageSize: 5 },
+});
+const rows = Array.isArray(data?.data) ? data.data : (Array.isArray(data) ? data : []);
+
+// Render as a simple HTML list
+ctx.element.innerHTML = [
+  '<div style="padding:12px">',
+  '<h4 style="margin:0 0 8px">' + ctx.t('Users') + '</h4>',
+  '<ul style="margin:0; padding-left:20px">',
+  ...rows.map((r, i) => '<li>#' + (i + 1) + ': ' + String((r && (r.nickname ?? r.username ?? r.id)) ?? '') + '</li>'),
+  '</ul>',
+  '</div>'
+].join('');
+`
+};
+var api_fetch_render_list_snippet_default = snippet;

package/lib/runjs-context/snippets/scene/block/chartjs-bar.snippet.d.ts

@@ -0,0 +1,11 @@
+/**
+ * This file is part of the NocoBase (R) project.
+ * Copyright (c) 2020-2024 NocoBase Co., Ltd.
+ * Authors: NocoBase Team.
+ *
+ * This project is dual-licensed under AGPL-3.0 and NocoBase Commercial License.
+ * For more information, please refer to: https://www.nocobase.com/agreement.
+ */
+import type { SnippetModule } from '../../types';
+declare const snippet: SnippetModule;
+export default snippet;

package/lib/runjs-context/snippets/scene/block/chartjs-bar.snippet.js

@@ -0,0 +1,99 @@
+/**
+ * This file is part of the NocoBase (R) project.
+ * Copyright (c) 2020-2024 NocoBase Co., Ltd.
+ * Authors: NocoBase Team.
+ *
+ * This project is dual-licensed under AGPL-3.0 and NocoBase Commercial License.
+ * For more information, please refer to: https://www.nocobase.com/agreement.
+ */
+
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var chartjs_bar_snippet_exports = {};
+__export(chartjs_bar_snippet_exports, {
+  default: () => chartjs_bar_snippet_default
+});
+module.exports = __toCommonJS(chartjs_bar_snippet_exports);
+var import_JSBlockRunJSContext = require("../../../contexts/JSBlockRunJSContext");
+const snippet = {
+  contexts: [import_JSBlockRunJSContext.JSBlockRunJSContext],
+  prefix: "sn-jsb-chartjs",
+  label: "Render Chart.js bar chart",
+  description: "Load Chart.js from CDN and render a basic bar chart inside the block",
+  locales: {
+    "zh-CN": {
+      label: "\u6E32\u67D3 Chart.js \u67F1\u72B6\u56FE",
+      description: "\u901A\u8FC7 CDN \u5F15\u5165 Chart.js \u5E76\u5728\u533A\u5757\u4E2D\u6E32\u67D3\u57FA\u7840\u67F1\u72B6\u56FE"
+    }
+  },
+  content: `
+const wrapper = document.createElement('div');
+wrapper.style.padding = '16px';
+wrapper.style.background = '#fff';
+wrapper.style.borderRadius = '8px';
+wrapper.style.boxShadow = '0 2px 8px rgba(0,0,0,0.05)';
+
+const canvas = document.createElement('canvas');
+canvas.width = 480;
+canvas.height = 320;
+wrapper.appendChild(canvas);
+ctx.element.replaceChildren(wrapper);
+
+async function renderChart() {
+  const loaded = await ctx.requireAsync('https://cdn.jsdelivr.net/npm/chart.js@4.4.0/dist/chart.umd.min.js');
+  const Chart = loaded?.Chart || loaded?.default?.Chart || loaded?.default;
+  if (!Chart) {
+    throw new Error('Chart.js is not available');
+  }
+
+  const labels = ['Mon', 'Tue', 'Wed', 'Thu', 'Fri'];
+  const data = [12, 18, 9, 15, 22];
+
+  new Chart(canvas.getContext('2d'), {
+    type: 'bar',
+    data: {
+      labels,
+      datasets: [
+        {
+          label: ctx.t('Daily visits'),
+          data,
+          backgroundColor: 'rgba(24, 144, 255, 0.6)',
+          borderColor: '#1890ff',
+          borderWidth: 1,
+        },
+      ],
+    },
+    options: {
+      plugins: {
+        legend: { display: true },
+        title: {
+          display: true,
+          text: ctx.t('Weekly overview'),
+        },
+      },
+    },
+  });
+}
+
+renderChart().catch((error) => {
+  console.error('[RunJS] failed to render chart', error);
+  wrapper.innerHTML = '<div style="color:#c00;">' + (error?.message || ctx.t('Chart initialization failed')) + '</div>';
+});
+`
+};
+var chartjs_bar_snippet_default = snippet;

package/lib/runjs-context/snippets/{libs → scene/block}/echarts-init.snippet.js

@@ -29,18 +29,35 @@ __export(echarts_init_snippet_exports, {
   default: () => echarts_init_snippet_default
 });
 module.exports = __toCommonJS(echarts_init_snippet_exports);
-var echarts_init_snippet_default = {
-  contexts: ["JSBlockRunJSContext"],
+var import_JSBlockRunJSContext = require("../../../contexts/JSBlockRunJSContext");
+const snippet = {
+  contexts: [import_JSBlockRunJSContext.JSBlockRunJSContext],
   prefix: "sn-echarts",
   label: "Init ECharts",
+  description: "Load ECharts and render a simple chart inside the block",
+  locales: {
+    "zh-CN": {
+      label: "\u521D\u59CB\u5316 ECharts",
+      description: "\u52A0\u8F7D ECharts \u5E76\u5728\u533A\u5757\u5185\u6E32\u67D3\u793A\u4F8B\u56FE\u8868"
+    }
+  },
   content: `
-ctx.element.style.height = '400px';
+const container = document.createElement('div');
+container.style.height = '400px';
+container.style.width = '100%';
+ctx.element.replaceChildren(container);
 const echarts = await ctx.requireAsync('https://cdn.jsdelivr.net/npm/echarts@5/dist/echarts.min.js');
 if (!echarts) {
-  ctx.message.error(ctx.t('Failed to load ECharts'));
-} else {
-  const chart = echarts.init(ctx.element);
-  chart.setOption({ title: { text: ctx.t('ECharts') }, series: [{ type: 'pie', data: [{ value: 1, name: ctx.t('A') }] }] });
+  throw new Error('ECharts library not loaded');
 }
+
+const chart = echarts.init(container);
+chart.setOption({
+  title: { text: ctx.t('ECharts') },
+  series: [{ type: 'pie', data: [{ value: 1, name: ctx.t('A') }] }],
+});
+
+chart.resize();
 `
 };
+var echarts_init_snippet_default = snippet;

package/lib/runjs-context/snippets/scene/block/render-antd-icons.snippet.d.ts

@@ -0,0 +1,11 @@
+/**
+ * This file is part of the NocoBase (R) project.
+ * Copyright (c) 2020-2024 NocoBase Co., Ltd.
+ * Authors: NocoBase Team.
+ *
+ * This project is dual-licensed under AGPL-3.0 and NocoBase Commercial License.
+ * For more information, please refer to: https://www.nocobase.com/agreement.
+ */
+import type { SnippetModule } from '../../types';
+declare const snippet: SnippetModule;
+export default snippet;

package/lib/runjs-context/snippets/scene/block/render-antd-icons.snippet.js

@@ -0,0 +1,65 @@
+/**
+ * This file is part of the NocoBase (R) project.
+ * Copyright (c) 2020-2024 NocoBase Co., Ltd.
+ * Authors: NocoBase Team.
+ *
+ * This project is dual-licensed under AGPL-3.0 and NocoBase Commercial License.
+ * For more information, please refer to: https://www.nocobase.com/agreement.
+ */
+
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var render_antd_icons_snippet_exports = {};
+__export(render_antd_icons_snippet_exports, {
+  default: () => render_antd_icons_snippet_default
+});
+module.exports = __toCommonJS(render_antd_icons_snippet_exports);
+var import_JSBlockRunJSContext = require("../../../contexts/JSBlockRunJSContext");
+const snippet = {
+  contexts: [import_JSBlockRunJSContext.JSBlockRunJSContext],
+  prefix: "sn-jsb-antd-icons",
+  label: "Render Ant Design icons",
+  description: "Render Ant Design icons with buttons inside the block container",
+  locales: {
+    "zh-CN": {
+      label: "\u6E32\u67D3 Ant Design \u56FE\u6807",
+      description: "\u5728\u533A\u5757\u5BB9\u5668\u4E2D\u4F7F\u7528 Ant Design \u56FE\u6807\u4E0E\u6309\u94AE\u8FDB\u884C\u6E32\u67D3"
+    }
+  },
+  content: `
+// Render Ant Design icons with buttons via ctx.libs
+const { React, antd, antdIcons } = ctx.libs;
+const { Button, Space } = antd;
+const { PlusOutlined, EditOutlined, DeleteOutlined } = antdIcons;
+
+const IconButtons = () => (
+  <Space style={{ padding: 12 }}>
+    <Button type="primary" icon={<PlusOutlined />}>
+      {ctx.t('Add')}
+    </Button>
+    <Button icon={<EditOutlined />}>{ctx.t('Edit')}</Button>
+    <Button danger icon={<DeleteOutlined />}>
+      {ctx.t('Delete')}
+    </Button>
+  </Space>
+);
+
+ctx.render(<IconButtons />);
+`
+};
+var render_antd_icons_snippet_default = snippet;

package/lib/runjs-context/snippets/scene/block/render-button-handler.snippet.d.ts

@@ -0,0 +1,11 @@
+/**
+ * This file is part of the NocoBase (R) project.
+ * Copyright (c) 2020-2024 NocoBase Co., Ltd.
+ * Authors: NocoBase Team.
+ *
+ * This project is dual-licensed under AGPL-3.0 and NocoBase Commercial License.
+ * For more information, please refer to: https://www.nocobase.com/agreement.
+ */
+import type { SnippetModule } from '../../types';
+declare const snippet: SnippetModule;
+export default snippet;

package/lib/runjs-context/snippets/scene/{jsblock → block}/render-button-handler.snippet.js

@@ -29,18 +29,26 @@ __export(render_button_handler_snippet_exports, {
   default: () => render_button_handler_snippet_default
 });
 module.exports = __toCommonJS(render_button_handler_snippet_exports);
-var render_button_handler_snippet_default = {
-  contexts: ["JSBlockRunJSContext"],
+var import_JSBlockRunJSContext = require("../../../contexts/JSBlockRunJSContext");
+const snippet = {
+  contexts: [import_JSBlockRunJSContext.JSBlockRunJSContext],
   prefix: "sn-jsb-button",
   label: "Render button handler",
+  description: "Render a button and handle click events inside the block",
+  locales: {
+    "zh-CN": {
+      label: "\u6309\u94AE\u4E8B\u4EF6\u5904\u7406",
+      description: "\u5728\u533A\u5757\u4E2D\u6E32\u67D3\u6309\u94AE\u5E76\u7ED1\u5B9A\u70B9\u51FB\u5904\u7406\u903B\u8F91"
+    }
+  },
   content: `
-const { React, ReactDOM, antd } = ctx;
-const { Button } = antd;
+const { Button } = ctx.libs.antd;
 
-if (ctx.__reactRoot?.unmount) { try { ctx.__reactRoot.unmount(); } catch(_) {} ctx.__reactRoot = undefined; }
-const node = React.createElement(Button, { type: 'primary', onClick: () => ctx.message.success(ctx.t('Clicked!')) }, ctx.t('Button'));
-const root = ReactDOM.createRoot(ctx.element);
-root.render(node);
-ctx.__reactRoot = root;
+ctx.render(
+  <Button type="primary" onClick={() => ctx.message.success(ctx.t('Clicked!'))}>
+    {ctx.t('Button')}
+  </Button>
+);
 `
 };
+var render_button_handler_snippet_default = snippet;