@nocobase/flow-engine 2.0.0-alpha.3 → 2.0.0-alpha.30

package/src/runjs-context/contexts/base.ts

@@ -0,0 +1,171 @@
+/**
+ * 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 { FlowRunJSContext } from '../../flowContext';
+
+export function defineBaseContextMeta() {
+  FlowRunJSContext.define({
+    label: 'RunJS base',
+    properties: {
+      logger: 'Pino logger instance for structured logging. Example: `ctx.logger.info({ foo: 1 }, "message")`',
+      message:
+        'Ant Design global message API for displaying temporary messages. Example: `ctx.message.success("Operation completed")`',
+      notification:
+        'Ant Design notification API for displaying notification boxes. Example: `ctx.notification.open({ message: "Title", description: "Content" })`',
+      resource: 'Data resource accessible based on current user permissions',
+      urlSearchParams: 'URLSearchParams object containing query parameters from the current URL',
+      token: 'API authentication token for the current session',
+      role: 'Current user role information',
+      auth: 'Authentication context containing locale, role, user, and token information',
+      api: {
+        description: 'APIClient instance for making HTTP requests.',
+        detail: 'APIClient',
+        properties: {
+          request: {
+            description:
+              'Make an HTTP request using the APIClient instance. Parameters: (options: RequestOptions) => Promise<any>.',
+            detail: 'Promise<any>',
+            completion: {
+              insertText: `await ctx.api.request({ url: '', method: 'get', params: {} })`,
+            },
+          },
+        },
+      },
+      i18n: {
+        description: 'An instance of i18next for managing internationalization.',
+        detail: 'i18next',
+        properties: {
+          language: 'Current active language code.',
+        },
+      },
+      React: 'React namespace providing React library functions and hooks (available in RunJS environment)',
+      ReactDOM: 'ReactDOM client API including createRoot for rendering React components',
+      antd: 'Ant Design component library',
+    },
+    methods: {
+      t: 'Internationalization function for translating text. Parameters: (key: string, variables?: object) => string. Example: `ctx.t("Hello {name}", { name: "World" })`',
+      render: {
+        description:
+          'Render into container. Accepts ReactElement, DOM Node/Fragment, or HTML string. Parameters: (vnode: ReactElement | Node | DocumentFragment | string, container?: HTMLElement|ElementProxy) => Root|null. Example: `ctx.render(<div>Hello</div>)` or `ctx.render("<b>hi</b>")`',
+        detail: 'ReactDOM Root',
+        completion: {
+          insertText: `ctx.render(<div />)`,
+        },
+      },
+      requireAsync:
+        'Asynchronously load external libraries from URL. Parameters: (url: string) => Promise<any>. Example: `const lodash = await ctx.requireAsync("https://cdn.jsdelivr.net/npm/lodash")`',
+      importAsync:
+        'Dynamically import ESM module by URL. Parameters: (url: string) => Promise<Module>. Example: `const mod = await ctx.importAsync("https://cdn.jsdelivr.net/npm/lit-html@2/+esm")`',
+      resolveJsonTemplate:
+        'Resolve JSON templates containing variable expressions with {{ }} syntax. Parameters: (template: any, context?: object) => any',
+      runAction: {
+        description:
+          'Execute a data action on the current resource. Parameters: (actionName: string, params: object) => Promise<any>. Example: `await ctx.runAction("create", { values: { name: "test" } })`',
+        detail: 'Promise<any>',
+        completion: {
+          insertText: `await ctx.runAction('create', { values: {} })`,
+        },
+      },
+      openView: {
+        description: `Open a view component (page, modal, or drawer) by its unique identifier.
+      Parameters: (viewId: string, options?: OpenViewOptions) => Promise<void>
+      Options:
+        - params: Record<string, any> - Parameters passed to the view component
+        - mode: "page" | "modal" | "drawer" - Display mode (default: "drawer")
+        - title: string - Modal/drawer title
+        - width: number | string - Modal/drawer width
+        - navigation: boolean - Whether to use route navigation
+        - preventClose: boolean - Prevent closing the view
+        - viewUid: string - Custom view UID for routing
+        - isMobileLayout: boolean - Use mobile layout (displays as embed)
+      Examples:
+       - Modal with params: await ctx.openView("user-detail", { params: { id: 123 }, mode: "modal", title: "User Details", width: 800 })
+       - Drawer (default): await ctx.openView("settings-page")
+        - Page navigation: await ctx.openView("dashboard", { mode: "page" })`,
+        detail: 'Promise<void>',
+        completion: {
+          insertText: `await ctx.openView('view-id', { mode: 'drawer', params: {} })`,
+        },
+      },
+    },
+  });
+
+  FlowRunJSContext.define(
+    {
+      label: 'RunJS 基础',
+      properties: {
+        logger: 'Pino 日志实例（结构化日志）。示例：`ctx.logger.info({ foo: 1 }, "message")`',
+        message: 'Ant Design 全局消息 API，用于显示临时提示。示例：`ctx.message.success("操作成功")`',
+        notification:
+          'Ant Design 通知 API，用于显示通知框。示例：`ctx.notification.open({ message: "标题", description: "内容" })`',
+        resource: '基于当前用户权限可访问的数据资源',
+        urlSearchParams: '当前 URL 的查询参数（URLSearchParams 对象）',
+        token: '当前会话的 API 认证 token',
+        role: '当前用户角色信息',
+        auth: '认证上下文，包含 locale、role、user、token 等信息',
+        api: {
+          description: '用于发起 HTTP 请求的 APIClient 实例',
+          detail: 'APIClient',
+          properties: {
+            request: {
+              description: '通过 ctx.api.request 发起 HTTP 请求，入参为 RequestOptions，返回 Promise。',
+              detail: 'Promise<any>',
+              completion: {
+                insertText: `await ctx.api.request({ url: '', method: 'get', params: {} })`,
+              },
+            },
+          },
+        },
+        i18n: {
+          description: 'i18next 实例，可用于管理国际化',
+          detail: 'i18next',
+          properties: {
+            language: '当前激活的语言代码',
+          },
+        },
+        React: 'React 命名空间，提供 React 函数与 hooks（RunJS 环境中可用）',
+        ReactDOM: 'ReactDOM 客户端 API，含 createRoot 等渲染方法',
+        antd: 'Ant Design 组件库（RunJS 环境中可用）',
+      },
+      methods: {
+        t: '国际化函数，用于翻译文案。参数：(key: string, variables?: object) => string。示例：`ctx.t("你好 {name}", { name: "世界" })`',
+        render: {
+          description:
+            '渲染到容器。vnode 支持 ReactElement、DOM 节点/片段、或 HTML 字符串。参数：(vnode: ReactElement | Node | DocumentFragment | string, container?: HTMLElement|ElementProxy) => Root|null。示例：`ctx.render(<div />)` 或 `ctx.render("<b>hi</b>")`',
+          detail: 'ReactDOM Root',
+          completion: {
+            insertText: `ctx.render(<div />)`,
+          },
+        },
+        requireAsync:
+          '按 URL 异步加载外部库。参数：(url: string) => Promise<any>。示例：`const lodash = await ctx.requireAsync("https://cdn.jsdelivr.net/npm/lodash")`',
+        importAsync:
+          '按 URL 动态导入 ESM 模块（开发/生产均可用）。参数：(url: string) => Promise<Module>。示例：`const mod = await ctx.importAsync("https://cdn.jsdelivr.net/npm/lit-html@2/+esm")`',
+        resolveJsonTemplate: '解析含 {{ }} 变量表达式的 JSON 模板。参数：(template: any, context?: object) => any',
+        runAction: {
+          description:
+            '对当前资源执行数据动作。参数：(actionName: string, params: object) => Promise<any>。示例：`await ctx.runAction("create", { values: { name: "test" } })`',
+          detail: 'Promise<any>',
+          completion: {
+            insertText: `await ctx.runAction('create', { values: {} })`,
+          },
+        },
+        openView: {
+          description:
+            '根据唯一标识打开视图（页面/弹窗/抽屉）。参数：(viewId: string, options?: OpenViewOptions) => Promise<void>`，常用选项：params、mode、title、width、navigation、preventClose、viewUid、isMobileLayout。',
+          detail: 'Promise<void>',
+          completion: {
+            insertText: `await ctx.openView('view-id', { mode: 'drawer', params: {} })`,
+          },
+        },
+      },
+    },
+    { locale: 'zh-CN' },
+  );
+}

package/src/runjs-context/helpers.ts

@@ -10,47 +10,49 @@
 import type { FlowContext } from '../flowContext';
 import { JSRunner } from '../JSRunner';
 import type { JSRunnerOptions } from '../JSRunner';
-import { FlowRunJSContext, RunJSVersion } from './contexts/FlowRunJSContext';
-import { RunJSContextRegistry, getModelClassName } from './registry';
-import { JSBlockRunJSContext } from './contexts/JSBlockRunJSContext';
-import { JSFieldRunJSContext } from './contexts/JSFieldRunJSContext';
-import { JSItemRunJSContext } from './contexts/JSItemRunJSContext';
-import { FormJSFieldItemRunJSContext } from './contexts/FormJSFieldItemRunJSContext';
-import { JSRecordActionRunJSContext } from './contexts/JSRecordActionRunJSContext';
-import { JSCollectionActionRunJSContext } from './contexts/JSCollectionActionRunJSContext';
-import { LinkageRunJSContext } from './contexts/LinkageRunJSContext';
+import { RunJSContextRegistry, getModelClassName, type RunJSVersion } from './registry';
+
+function getLocale(ctx: any): string | undefined {
+  return ctx?.api?.auth?.locale || ctx?.i18n?.language || ctx?.locale;
+}
 
 export function getRunJSDocFor(ctx: FlowContext, { version = 'v1' as RunJSVersion } = {}) {
   const modelClass = getModelClassName(ctx);
-  const ctor =
-    RunJSContextRegistry.resolve(version, modelClass) ||
-    RunJSContextRegistry.resolve('latest' as RunJSVersion, modelClass) ||
-    FlowRunJSContext;
-  return (ctor as any).getDoc?.() || {};
+  const ctor = RunJSContextRegistry.resolve(version, modelClass) || RunJSContextRegistry.resolve(version, '*');
+  const locale = getLocale(ctx);
+  if ((ctor as any)?.getDoc?.length) {
+    // prefer getDoc(locale)
+    return (ctor as any).getDoc(locale) || {};
+  }
+  return (ctor as any)?.getDoc?.() || {};
 }
 
 export function createJSRunnerWithVersion(this: FlowContext, options?: JSRunnerOptions) {
   const version = (options?.version as RunJSVersion) || ('v1' as RunJSVersion);
   const modelClass = getModelClassName(this);
-  const Ctor =
-    RunJSContextRegistry.resolve(version, modelClass) ||
-    RunJSContextRegistry.resolve('latest' as RunJSVersion, modelClass) ||
-    FlowRunJSContext;
-  const runCtx = new Ctor((this as any).createProxy ? (this as any).createProxy() : (this as any));
-  const def = (Ctor as any).injectDefaultGlobals?.() || {};
-  const globals = { ctx: runCtx, ...def, ...(options?.globals || {}) };
+  const ensureFlowContext = (obj: any): FlowContext => obj as FlowContext;
+  const Ctor = RunJSContextRegistry.resolve(version, modelClass) || RunJSContextRegistry.resolve(version, '*');
+  if (!Ctor) {
+    throw new Error('[RunJS] No RunJSContext registered for version/model.');
+  }
+  const runCtx = new (Ctor as any)(ensureFlowContext(this));
+  const globals: Record<string, any> = { ctx: runCtx, ...(options?.globals || {}) };
+  // 对字段/区块类上下文，默认注入 window/document 以支持在沙箱中访问 DOM API
+  if (modelClass === 'JSFieldModel' || modelClass === 'JSBlockModel') {
+    if (typeof window !== 'undefined') globals.window = window as any;
+    if (typeof document !== 'undefined') globals.document = document as any;
+  }
   // 透传 JSRunnerOptions 其余配置（如 timeoutMs）
   const { timeoutMs } = options || {};
   return new JSRunner({ globals, timeoutMs });
 }
 
-export function registerDefaultMappings() {
-  const v: RunJSVersion = 'v1';
-  RunJSContextRegistry.register(v, 'JSBlockModel', JSBlockRunJSContext);
-  RunJSContextRegistry.register(v, 'JSFieldModel', JSFieldRunJSContext);
-  RunJSContextRegistry.register(v, 'JSItemModel', JSItemRunJSContext);
-  RunJSContextRegistry.register(v, 'FormJSFieldItemModel', FormJSFieldItemRunJSContext);
-  RunJSContextRegistry.register(v, 'JSRecordActionModel', JSRecordActionRunJSContext);
-  RunJSContextRegistry.register(v, 'JSCollectionActionModel', JSCollectionActionRunJSContext);
-  RunJSContextRegistry.register(v, '*', FlowRunJSContext);
+export function getRunJSScenesForModel(modelClass: string, version: RunJSVersion = 'v1'): string[] {
+  const meta = RunJSContextRegistry.getMeta(version, modelClass);
+  return Array.isArray(meta?.scenes) ? [...meta!.scenes!] : [];
+}
+
+export function getRunJSScenesForContext(ctx: FlowContext, { version = 'v1' as RunJSVersion } = {}): string[] {
+  const modelClass = getModelClassName(ctx);
+  return getRunJSScenesForModel(modelClass, version);
 }

package/src/runjs-context/registry.ts

@@ -7,59 +7,28 @@
  * For more information, please refer to: https://www.nocobase.com/agreement.
  */
 
-import type { RunJSVersion, RunJSContextCtor } from './contexts/FlowRunJSContext';
-import { FlowRunJSContext } from './contexts/FlowRunJSContext';
-import { JSBlockRunJSContext } from './contexts/JSBlockRunJSContext';
-import { JSFieldRunJSContext } from './contexts/JSFieldRunJSContext';
-import { JSItemRunJSContext } from './contexts/JSItemRunJSContext';
-import { FormJSFieldItemRunJSContext } from './contexts/FormJSFieldItemRunJSContext';
-import { JSRecordActionRunJSContext } from './contexts/JSRecordActionRunJSContext';
-import { JSCollectionActionRunJSContext } from './contexts/JSCollectionActionRunJSContext';
+// 为避免在模块初始化阶段引入 FlowContext（从而触发循环依赖），不要在顶层导入各类 RunJSContext。
+// 在需要默认映射时（首次 resolve）再使用 createRequire 同步加载对应模块。
+
+export type RunJSVersion = 'v1' | (string & {});
+export type RunJSContextCtor = new (delegate: any) => any;
+export type RunJSContextMeta = {
+  scenes?: string[];
+};
 
 export class RunJSContextRegistry {
-  private static map = new Map<string, RunJSContextCtor>();
-  private static defaultsRegistered = false;
-  private static ensureDefaults() {
-    if (this.defaultsRegistered) return;
-    // v1 默认映射（延迟注册：首次访问时再注册）
-    const v = 'v1' as RunJSVersion;
-    try {
-      const ensure = (model: string, ctor: RunJSContextCtor) => {
-        const key = `${v}:${model}`;
-        if (!this.map.has(key)) this.map.set(key, ctor);
-      };
-      ensure('JSBlockModel', JSBlockRunJSContext as any);
-      ensure('JSFieldModel', JSFieldRunJSContext as any);
-      ensure('JSItemModel', JSItemRunJSContext as any);
-      ensure('FormJSFieldItemModel', FormJSFieldItemRunJSContext as any);
-      ensure('JSRecordActionModel', JSRecordActionRunJSContext as any);
-      ensure('JSCollectionActionModel', JSCollectionActionRunJSContext as any);
-      ensure('*', FlowRunJSContext as any);
-    } finally {
-      this.defaultsRegistered = true;
-    }
-  }
-  static register(version: RunJSVersion, modelClass: string, ctor: RunJSContextCtor) {
-    this.map.set(`${version}:${modelClass}`, ctor);
+  private static map = new Map<string, { ctor: RunJSContextCtor; meta?: RunJSContextMeta }>();
+  static register(version: RunJSVersion, modelClass: string, ctor: RunJSContextCtor, meta?: RunJSContextMeta) {
+    this.map.set(`${version}:${modelClass}`, { ctor, meta });
   }
   static resolve(version: RunJSVersion, modelClass: string) {
-    this.ensureDefaults();
-    return this.map.get(`${version}:${modelClass}`) || this.map.get(`${version}:*`);
+    return this.map.get(`${version}:${modelClass}`)?.ctor || this.map.get(`${version}:*`)?.ctor;
+  }
+  static getMeta(version: RunJSVersion, modelClass: string): RunJSContextMeta | undefined {
+    return this.map.get(`${version}:${modelClass}`)?.meta || this.map.get(`${version}:*`)?.meta;
   }
 }
 
 export function getModelClassName(ctx: any): string {
-  const model = ctx?.model;
-  if (!model) return '*';
-  // 1) 优先使用类 meta 中声明的 createModelOptions.use（构建后稳定，不受构造函数名压缩影响）
-  try {
-    const Ctor = model.constructor as any;
-    const use = Ctor?.meta?.createModelOptions?.use;
-    if (typeof use === 'string' && use) return use;
-  } catch (_) {
-    // ignore
-  }
-  // 2) 回退到构造函数名（开发模式可靠，生产模式可能被压缩）
-  const byName = model?.constructor?.name;
-  return byName || '*';
+  return ctx?.model?.constructor?.name || '*';
 }

package/src/runjs-context/setup.ts

@@ -0,0 +1,51 @@
+/**
+ * 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.
+ */
+
+/**
+ * RunJS context registration entry. No side-effects by default.
+ */
+import { RunJSContextRegistry } from './registry';
+import { FlowRunJSContext } from '../flowContext';
+import { defineBaseContextMeta } from './contexts/base';
+
+let done = false;
+export async function setupRunJSContexts() {
+  if (done) return;
+  defineBaseContextMeta();
+
+  // Lazy import to avoid circular dependencies during module initialization
+  const [
+    { JSBlockRunJSContext },
+    { JSFieldRunJSContext },
+    { JSItemRunJSContext },
+    { JSColumnRunJSContext },
+    { FormJSFieldItemRunJSContext },
+    { JSRecordActionRunJSContext },
+    { JSCollectionActionRunJSContext },
+  ] = await Promise.all([
+    import('./contexts/JSBlockRunJSContext'),
+    import('./contexts/JSFieldRunJSContext'),
+    import('./contexts/JSItemRunJSContext'),
+    import('./contexts/JSColumnRunJSContext'),
+    import('./contexts/FormJSFieldItemRunJSContext'),
+    import('./contexts/JSRecordActionRunJSContext'),
+    import('./contexts/JSCollectionActionRunJSContext'),
+  ]);
+
+  const v1 = 'v1';
+  RunJSContextRegistry.register(v1, '*', FlowRunJSContext);
+  RunJSContextRegistry.register(v1, 'JSBlockModel', JSBlockRunJSContext, { scenes: ['block'] });
+  RunJSContextRegistry.register(v1, 'JSFieldModel', JSFieldRunJSContext, { scenes: ['detail'] });
+  RunJSContextRegistry.register(v1, 'JSItemModel', JSItemRunJSContext, { scenes: ['form'] });
+  RunJSContextRegistry.register(v1, 'JSColumnModel', JSColumnRunJSContext, { scenes: ['table'] });
+  RunJSContextRegistry.register(v1, 'FormJSFieldItemModel', FormJSFieldItemRunJSContext, { scenes: ['form'] });
+  RunJSContextRegistry.register(v1, 'JSRecordActionModel', JSRecordActionRunJSContext, { scenes: ['table'] });
+  RunJSContextRegistry.register(v1, 'JSCollectionActionModel', JSCollectionActionRunJSContext, { scenes: ['table'] });
+  done = true;
+}

package/src/runjs-context/snippets/global/api-request.snippet.ts

@@ -0,0 +1,38 @@
+/**
+ * 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';
+
+const snippet: SnippetModule = {
+  contexts: ['*'],
+  prefix: 'sn-api-request',
+  label: 'API request template',
+  description: 'Basic template to send HTTP requests via ctx.api.request',
+  locales: {
+    'zh-CN': {
+      label: 'API 请求模板',
+      description: '使用 ctx.api.request 发送 HTTP 请求的基础模板',
+    },
+  },
+  content: `
+// Replace url/method/params/data as needed
+const response = await ctx.api.request({
+  url: 'users:list',
+  method: 'get',
+  params: {
+    pageSize: 10,
+  },
+});
+
+ctx.message.success(ctx.t('Request finished'));
+console.log(ctx.t('Response data:'), response?.data);
+`,
+};
+
+export default snippet;

package/src/runjs-context/snippets/global/clipboard-copy-text.snippet.ts

@@ -0,0 +1,42 @@
+/**
+ * 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';
+
+const snippet: SnippetModule = {
+  contexts: ['*'],
+  prefix: 'sn-clipboard-copy',
+  label: 'Copy text to clipboard (function)',
+  description: 'A reusable function that copies a given string to the clipboard.',
+  locales: {
+    'zh-CN': {
+      label: '复制文本到剪贴板（函数）',
+      description: '通用函数：接受一个字符串参数并复制到剪贴板。',
+    },
+  },
+  content: `
+// A general utility function that copies text to clipboard.
+// Usage:
+//   const ok = await copyTextToClipboard('Hello');
+//   if (ok) { /* success */ } else { /* handle failure */ }
+async function copyTextToClipboard(text) {
+  const s = String(text ?? '');
+  try {
+    if (navigator?.clipboard?.writeText) {
+      await navigator.clipboard.writeText(s);
+      return true;
+    }
+  } catch (_) {
+    // Fallback below
+  }
+}
+`,
+};
+
+export default snippet;

package/src/runjs-context/snippets/global/import-esm.snippet.ts

@@ -0,0 +1,39 @@
+/**
+ * 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';
+
+const snippet: SnippetModule = {
+  contexts: ['*'],
+  prefix: 'sn-import',
+  label: 'Import ESM module',
+  description: 'Dynamically import an ESM module by URL',
+  locales: {
+    'zh-CN': {
+      label: '导入 ESM 模块',
+      description: '按 URL 动态导入 ESM 模块',
+    },
+  },
+  content: `
+// Import an ESM module by URL
+// Works in yarn dev and yarn start
+const mod = await ctx.importAsync('https://cdn.jsdelivr.net/npm/lit-html@2/+esm');
+const { html, render } = mod;
+
+ctx.element.innerHTML = '';
+const container = document.createElement('div');
+container.style.padding = '8px';
+container.style.border = '1px dashed #999';
+ctx.element.append(container);
+
+render(html\`<span style="color:#52c41a;">lit-html loaded and rendered</span>\`, container);
+`,
+};
+
+export default snippet;

package/src/runjs-context/snippets/global/message-error.snippet.ts

@@ -13,6 +13,12 @@ const snippet: SnippetModule = {
   prefix: 'sn-msg-error',
   label: 'Message error',
   description: 'Show an error toast message',
+  locales: {
+    'zh-CN': {
+      label: '错误消息提示',
+      description: '显示一条错误提示消息',
+    },
+  },
   content: `
 ctx.message.error(ctx.t('Operation failed'));
 `,

package/src/runjs-context/snippets/global/message-success.snippet.ts

@@ -13,6 +13,12 @@ const snippet: SnippetModule = {
   prefix: 'sn-msg',
   label: 'Message success',
   description: 'Show a success toast message',
+  locales: {
+    'zh-CN': {
+      label: '成功消息提示',
+      description: '显示一条成功提示消息',
+    },
+  },
   content: `
 ctx.message.success(ctx.t('Operation succeeded'));
 `,

package/src/runjs-context/snippets/global/notification-open.snippet.ts

@@ -7,11 +7,19 @@
  * For more information, please refer to: https://www.nocobase.com/agreement.
  */
 
-export default {
+import type { SnippetModule } from '../types';
+
+const snippet: SnippetModule = {
   contexts: ['*'],
   prefix: 'sn-notify',
   label: 'Open notification',
   description: 'Open an AntD notification with custom content',
+  locales: {
+    'zh-CN': {
+      label: '打开通知',
+      description: '展示一条自定义内容的通知',
+    },
+  },
   content: `
 ctx.notification.open({
   message: ctx.t('Notification title'),
@@ -19,3 +27,5 @@ ctx.notification.open({
 });
 `,
 };
+
+export default snippet;

package/src/runjs-context/snippets/global/open-view-dialog.snippet.ts

@@ -14,12 +14,19 @@ const snippet: SnippetModule = {
   prefix: 'sn-open-dialog',
   label: 'Open view (dialog)',
   description: 'Open a view in dialog via ctx.openView',
+  locales: {
+    'zh-CN': {
+      label: '打开视图（对话框）',
+      description: '通过 ctx.openView 以对话框方式打开视图',
+    },
+  },
   content: `
-const popupUid = 'your-popup-uid';
+// Open a view as dialog and pass arguments at top-level
+const popupUid = ctx.model.uid + '-1'; // popupUid should be stable and better bound to ctx.model.uid
 await ctx.openView(popupUid, {
   mode: 'dialog',
-  viewUid: 'detail',
-  inputArgs: { foo: 'bar' },
+  title: ctx.t('Sample dialog'),
+  size: 'medium',
 });
 `,
 };

package/src/runjs-context/snippets/global/open-view-drawer.snippet.ts

@@ -14,12 +14,19 @@ const snippet: SnippetModule = {
   prefix: 'sn-open-drawer',
   label: 'Open view (drawer)',
   description: 'Open a view in drawer via ctx.openView',
+  locales: {
+    'zh-CN': {
+      label: '打开视图（抽屉）',
+      description: '通过 ctx.openView 以抽屉方式打开视图',
+    },
+  },
   content: `
-const popupUid = 'your-popup-uid';
+// Open a view as drawer and pass arguments at top-level
+const popupUid = ctx.model.uid + '-1'; // popupUid should be stable and better bound to ctx.model.uid
 await ctx.openView(popupUid, {
   mode: 'drawer',
-  viewUid: 'detail',
-  inputArgs: { foo: 'bar' },
+  title: ctx.t('Sample drawer'),
+  size: 'large',
 });
 `,
 };

package/src/runjs-context/snippets/global/query-selector.snippet.ts

@@ -0,0 +1,34 @@
+/**
+ * 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';
+import { JSBlockRunJSContext } from '../../contexts/JSBlockRunJSContext';
+import { JSFieldRunJSContext } from '../../contexts/JSFieldRunJSContext';
+import { FormJSFieldItemRunJSContext } from '../../contexts/FormJSFieldItemRunJSContext';
+
+const snippet: SnippetModule = {
+  contexts: [JSBlockRunJSContext, JSFieldRunJSContext, FormJSFieldItemRunJSContext],
+  prefix: 'sn-query-selector',
+  label: 'Query selector',
+  description: 'Find a child element inside ctx.element using querySelector',
+  locales: {
+    'zh-CN': {
+      label: '查询子元素',
+      description: '使用 querySelector 在 ctx.element 内查找子元素',
+    },
+  },
+  content: `
+const child = ctx.element.querySelector('.child-class');
+if (child) {
+  child.textContent = ctx.t('Hello from querySelector');
+}
+`,
+};
+
+export default snippet;