@nocobase/flow-engine 2.0.0-alpha.7 → 2.0.0-alpha.71

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;

package/lib/runjs-context/snippets/scene/block/render-iframe.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-iframe.snippet.js

@@ -0,0 +1,57 @@
+/**
+ * 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_iframe_snippet_exports = {};
+__export(render_iframe_snippet_exports, {
+  default: () => render_iframe_snippet_default
+});
+module.exports = __toCommonJS(render_iframe_snippet_exports);
+var import_JSBlockRunJSContext = require("../../../contexts/JSBlockRunJSContext");
+const snippet = {
+  contexts: [import_JSBlockRunJSContext.JSBlockRunJSContext],
+  prefix: "sn-jsb-iframe",
+  label: "Render iframe",
+  description: "Embed example.com as a sandboxed iframe inside the block element",
+  locales: {
+    "zh-CN": {
+      label: "\u6E32\u67D3 iframe",
+      description: "\u5728\u533A\u5757\u4E2D\u4EE5 sandbox \u9650\u5236\u5D4C\u5165 example.com \u9875\u9762"
+    }
+  },
+  content: `
+// Create an iframe that fills the current block container
+const iframe = document.createElement('iframe');
+iframe.src = 'https://example.com';
+iframe.setAttribute('sandbox', 'allow-scripts');
+iframe.style.width = '100%';
+iframe.style.height = '100%';
+iframe.style.border = 'none';
+
+// Replace existing children so the iframe is the only content
+ctx.element.replaceChildren(iframe);
+`
+};
+var render_iframe_snippet_default = snippet;

package/lib/runjs-context/snippets/scene/block/render-info-card.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-info-card.snippet.js

@@ -0,0 +1,71 @@
+/**
+ * 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_info_card_snippet_exports = {};
+__export(render_info_card_snippet_exports, {
+  default: () => render_info_card_snippet_default
+});
+module.exports = __toCommonJS(render_info_card_snippet_exports);
+var import_JSBlockRunJSContext = require("../../../contexts/JSBlockRunJSContext");
+const snippet = {
+  contexts: [import_JSBlockRunJSContext.JSBlockRunJSContext],
+  prefix: "sn-jsb-info-card",
+  label: "Render record info card",
+  description: "Display current record information in an Ant Design card",
+  locales: {
+    "zh-CN": {
+      label: "\u6E32\u67D3\u8BB0\u5F55\u4FE1\u606F\u5361\u7247",
+      description: "\u4F7F\u7528 Ant Design \u5361\u7247\u663E\u793A\u5F53\u524D\u8BB0\u5F55\u7684\u5173\u952E\u4FE1\u606F"
+    }
+  },
+  content: `
+const { Card, Descriptions, Tag } = ctx.libs.antd;
+
+if (!ctx.record) {
+  ctx.render('<div style="padding:16px;color:#999;">' + ctx.t('No record data') + '</div>');
+  return;
+}
+
+const record = ctx.record;
+
+ctx.render(
+  <Card title={ctx.t('Record Details')} bordered style={{ margin: 0 }}>
+    <Descriptions column={2} size="small">
+      <Descriptions.Item label={ctx.t('ID')}>{record.id || '-'}</Descriptions.Item>
+      <Descriptions.Item label={ctx.t('Status')}>
+        <Tag color={record.status === 'active' ? 'green' : 'default'}>{record.status || '-'}</Tag>
+      </Descriptions.Item>
+      <Descriptions.Item label={ctx.t('Title')}>{record.title || '-'}</Descriptions.Item>
+      <Descriptions.Item label={ctx.t('Created At')}>
+        {record.createdAt ? new Date(record.createdAt).toLocaleString() : '-'}
+      </Descriptions.Item>
+    </Descriptions>
+  </Card>
+);
+
+`
+};
+var render_info_card_snippet_default = snippet;

package/lib/runjs-context/snippets/scene/block/render-react-jsx.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/render-card.snippet.js → block/render-react-jsx.snippet.js}

@@ -24,22 +24,35 @@ var __copyProps = (to, from, except, desc) => {
   return to;
 };
 var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
-var render_card_snippet_exports = {};
-__export(render_card_snippet_exports, {
-  default: () => render_card_snippet_default
+var render_react_jsx_snippet_exports = {};
+__export(render_react_jsx_snippet_exports, {
+  default: () => render_react_jsx_snippet_default
 });
-module.exports = __toCommonJS(render_card_snippet_exports);
+module.exports = __toCommonJS(render_react_jsx_snippet_exports);
+var import_JSBlockRunJSContext = require("../../../contexts/JSBlockRunJSContext");
 const snippet = {
-  contexts: ["JSBlockRunJSContext"],
-  prefix: "sn-jsb-card",
-  label: "Render card",
+  contexts: [import_JSBlockRunJSContext.JSBlockRunJSContext],
+  prefix: "sn-react-jsx",
+  label: "Render React (JSX)",
+  description: "Render a simple React component using JSX syntax",
+  locales: {
+    "zh-CN": {
+      label: "\u6E32\u67D3 React\uFF08JSX\uFF09",
+      description: "\u4F7F\u7528 JSX \u8BED\u6CD5\u6E32\u67D3\u4E00\u4E2A\u7B80\u5355\u7684 React \u7EC4\u4EF6"
+    }
+  },
   content: `
-ctx.element.innerHTML = \`
-  <div style="border:1px solid #ddd;border-radius:8px;padding:16px;">
-    <h3 style="margin:0 0 8px;">\${ctx.t('Title')}</h3>
-    <div>\${ctx.t('Card content')}</div>
+// Render a React component with JSX
+const { React } = ctx.libs;
+
+const App = () => (
+  <div style={{ padding: 12 }}>
+    <h3 style={{ margin: 0, color: '#1890ff' }}>Hello JSX</h3>
+    <div style={{ color: '#555' }}>This block is rendered by JSX.</div>
   </div>
-\`;
+);
+
+ctx.render(<App />);
 `
 };
-var render_card_snippet_default = snippet;
+var render_react_jsx_snippet_default = snippet;

package/lib/runjs-context/snippets/scene/block/render-react.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-react.snippet.js

@@ -29,28 +29,29 @@ __export(render_react_snippet_exports, {
   default: () => render_react_snippet_default
 });
 module.exports = __toCommonJS(render_react_snippet_exports);
-var render_react_snippet_default = {
-  contexts: ["JSBlockRunJSContext"],
+var import_JSBlockRunJSContext = require("../../../contexts/JSBlockRunJSContext");
+const snippet = {
+  contexts: [import_JSBlockRunJSContext.JSBlockRunJSContext],
   prefix: "sn-jsb-react",
   label: "Render React",
+  description: "Render a React element inside the block container",
+  locales: {
+    "zh-CN": {
+      label: "\u6E32\u67D3 React",
+      description: "\u5728\u533A\u5757\u5BB9\u5668\u4E2D\u6E32\u67D3 React \u7EC4\u4EF6"
+    }
+  },
   content: `
 // Render a React element into ctx.element via ReactDOM
-const { React, ReactDOM, antd } = ctx;
-const { Button } = antd;
+const { Button } = ctx.libs.antd;
 
-// Unmount previous render to allow repeated runs
-if (ctx.__reactRoot?.unmount) {
-  try { ctx.__reactRoot.unmount(); } catch(_) {}
-  ctx.__reactRoot = undefined;
-}
-
-const node = React.createElement(
-  'div',
-  { style: { padding: 12 } },
-  React.createElement(Button, { type: 'primary', onClick: () => ctx.message.success(ctx.t('Clicked!')) }, ctx.t('Click')),
+ctx.render(
+  <div style={{ padding: 12 }}>
+    <Button type="primary" onClick={() => ctx.message.success(ctx.t('Clicked!'))}>
+      {ctx.t('Click')}
+    </Button>
+  </div>
 );
-const root = ReactDOM.createRoot(ctx.element);
-root.render(node);
-ctx.__reactRoot = root;
 `
 };
+var render_react_snippet_default = snippet;

package/lib/runjs-context/snippets/scene/block/render-statistics.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-statistics.snippet.js

@@ -0,0 +1,95 @@
+/**
+ * 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_statistics_snippet_exports = {};
+__export(render_statistics_snippet_exports, {
+  default: () => render_statistics_snippet_default
+});
+module.exports = __toCommonJS(render_statistics_snippet_exports);
+var import_JSBlockRunJSContext = require("../../../contexts/JSBlockRunJSContext");
+const snippet = {
+  contexts: [import_JSBlockRunJSContext.JSBlockRunJSContext],
+  prefix: "sn-jsb-stats",
+  label: "Render statistics cards",
+  description: "Display multiple statistic cards with numbers from API",
+  locales: {
+    "zh-CN": {
+      label: "\u6E32\u67D3\u7EDF\u8BA1\u5361\u7247",
+      description: "\u663E\u793A\u591A\u4E2A\u7EDF\u8BA1\u6570\u5B57\u5361\u7247\uFF08\u4ECE API \u83B7\u53D6\u6570\u636E\uFF09"
+    }
+  },
+  content: `
+const { Card, Statistic, Row, Col } = ctx.libs.antd;
+
+const res = await ctx.api.request({
+  url: 'users:list',
+  method: 'get',
+  params: {
+    pageSize: 100,
+    appends: ['roles'],
+  },
+});
+
+const users = res?.data?.data || [];
+
+const total = users.length;
+const adminCount = users.filter((user) =>
+  Array.isArray(user?.roles) && user.roles.some((role) => role?.name === 'admin')
+).length;
+const withEmail = users.filter((user) => !!user?.email).length;
+const distinctRoles = new Set(
+  users
+    .flatMap((user) => (Array.isArray(user?.roles) ? user.roles.map((role) => role?.name) : []))
+    .filter(Boolean),
+).size;
+
+ctx.render(
+  <Row gutter={16}>
+    <Col span={6}>
+      <Card>
+        <Statistic title={ctx.t('Total users')} value={total} valueStyle={{ color: '#3f8600' }} />
+      </Card>
+    </Col>
+    <Col span={6}>
+      <Card>
+        <Statistic title={ctx.t('Administrators')} value={adminCount} valueStyle={{ color: '#1890ff' }} />
+      </Card>
+    </Col>
+    <Col span={6}>
+      <Card>
+        <Statistic title={ctx.t('Users with email')} value={withEmail} valueStyle={{ color: '#faad14' }} />
+      </Card>
+    </Col>
+    <Col span={6}>
+      <Card>
+        <Statistic title={ctx.t('Distinct roles')} value={distinctRoles} valueStyle={{ color: '#cf1322' }} />
+      </Card>
+    </Col>
+  </Row>
+);
+`
+};
+var render_statistics_snippet_default = snippet;

package/lib/runjs-context/snippets/scene/block/render-timeline.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;