openyida 2026.8.4 → 2026.8.5

package/README.md

@@ -8,7 +8,7 @@
 
 OpenYida connects AI coding agents with Yida's low-code platform, so developers can create apps, forms, workflows, custom pages, reports, integrations, and deployment configuration from a normal chat-driven development workflow.
 
-[Quick Start](#quick-start) · [Help Center](https://xmtrf1.aliwork.com/o/openyida/help) · [Capabilities](#capabilities) · [Full Capability List](./docs/capabilities.md) · [CLI Reference](#cli-reference) · [Examples](#examples) · [Contributing](./CONTRIBUTING.md) · [Changelog](./CHANGELOG.md)
+[Quick Start](#quick-start) · [Help Center](https://xmtrf1.aliwork.com/o/openyida/help?lang=en) · [Capabilities](#capabilities) · [Full Capability List](./docs/capabilities.md) · [CLI Reference](#cli-reference) · [Examples](#examples) · [Contributing](./CONTRIBUTING.md) · [Changelog](./CHANGELOG.md)
 
 [![npm version](https://img.shields.io/npm/v/openyida?color=brightgreen&label=npm)](https://www.npmjs.com/package/openyida)
 [![npm downloads](https://img.shields.io/npm/dm/openyida?color=blue)](https://www.npmjs.com/package/openyida)
@@ -16,7 +16,7 @@ OpenYida connects AI coding agents with Yida's low-code platform, so developers
 [![License: MIT](https://img.shields.io/badge/License-MIT-yellow.svg)](./LICENSE)
 [![Node.js >=18](https://img.shields.io/badge/node-%3E%3D18-brightgreen)](https://nodejs.org)
 
-**Help Center:** [English](https://xmtrf1.aliwork.com/o/openyida/help) · [简体中文](https://xmtrf1.aliwork.com/o/openyida/help) · [繁體中文](https://xmtrf1.aliwork.com/o/openyida/help) · [日本語](https://xmtrf1.aliwork.com/o/openyida/help) · [한국어](https://xmtrf1.aliwork.com/o/openyida/help) · [Français](https://xmtrf1.aliwork.com/o/openyida/help) · [Deutsch](https://xmtrf1.aliwork.com/o/openyida/help) · [Español](https://xmtrf1.aliwork.com/o/openyida/help) · [Português](https://xmtrf1.aliwork.com/o/openyida/help) · [Tiếng Việt](https://xmtrf1.aliwork.com/o/openyida/help) · [हिन्दी](https://xmtrf1.aliwork.com/o/openyida/help) · [العربية](https://xmtrf1.aliwork.com/o/openyida/help)
+**Help Center:** [简体中文](https://xmtrf1.aliwork.com/o/openyida/help?lang=zh) · [繁體中文(中國台灣)](https://xmtrf1.aliwork.com/o/openyida/help?lang=zh-Hant) · [繁體中文(中國香港)](https://xmtrf1.aliwork.com/o/openyida/help?lang=zh-HK) · [English](https://xmtrf1.aliwork.com/o/openyida/help?lang=en) · [日本語](https://xmtrf1.aliwork.com/o/openyida/help?lang=ja) · [한국어](https://xmtrf1.aliwork.com/o/openyida/help?lang=ko) · [Tiếng Việt](https://xmtrf1.aliwork.com/o/openyida/help?lang=vi) · [ไทย](https://xmtrf1.aliwork.com/o/openyida/help?lang=th) · [Bahasa Indonesia](https://xmtrf1.aliwork.com/o/openyida/help?lang=id) · [Bahasa Melayu](https://xmtrf1.aliwork.com/o/openyida/help?lang=ms) · [Français](https://xmtrf1.aliwork.com/o/openyida/help?lang=fr) · [Português](https://xmtrf1.aliwork.com/o/openyida/help?lang=pt) · [Türkçe](https://xmtrf1.aliwork.com/o/openyida/help?lang=tr) · [Español](https://xmtrf1.aliwork.com/o/openyida/help?lang=es) · [Русский](https://xmtrf1.aliwork.com/o/openyida/help?lang=ru)
 
 [English README](./README.md) · [简体中文 README](./README_zhCN.md)
 
@@ -155,7 +155,7 @@ openyida/
 │   ├── core/                   # Environment detection, i18n, diagnostics, data commands
 │   ├── process/                # Process form creation, configuration, preview
 │   ├── report/                 # Yida report and chart generation
-│   └── samples/                # Templates emitted by openyida sample
+│   └── samples/                # Sample skeletons emitted by openyida sample
 ├── project/                    # Default workspace template for generated Yida projects
 ├── yida-skills/                # Source skill docs and Yida API references
 └── scripts/                    # CI, packaging, and installation helpers
@@ -185,22 +185,14 @@ Form definitions support 19 business field types plus verified presentation/layo
 
 ```bash
 openyida create-page APP_XXX "Dashboard" --mode dashboard
-openyida generate-page product-homepage --scene workbench --theme-profile yida-app-theme --theme-scope page --spec .cache/openyida/page-specs/home.json --output pages/src/home.canvas.jsx --compile
-openyida generate-page official-homepage --theme-profile yida-app-theme --spec .cache/openyida/page-specs/official-home.json --resolve-assets --upload-assets --output pages/src/official-home.canvas.jsx --compile
-openyida generate-page data-screen --theme-profile yida-app-theme --output pages/src/data-screen.canvas.jsx --compile
-openyida generate-page split-pane-detail --theme-profile yida-app-theme --output pages/src/split-pane-detail.canvas.jsx --compile
-openyida generate-page portal-shell-home --theme-profile yida-app-theme --output pages/src/portal-shell-home.canvas.jsx --compile
-openyida sample yida-canvas-custom-page dashboard-starter --output pages/src/dashboard-starter.canvas.jsx
-openyida sample yida-canvas-custom-page native-components-smoke --output pages/src/native-components-smoke.canvas.jsx
-openyida sample yida-canvas-custom-page portal-native-components --output pages/src/portal-native-components.canvas.jsx
-openyida generate-page todo-mvc --output pages/src/todo-mvc.canvas.jsx --compile
+openyida check-page pages/src/home.canvas.jsx --json
+openyida compile pages/src/home.canvas.jsx
 openyida publish pages/src/home.canvas.jsx APP_XXX FORM_XXX
 ```
 
-`generate-page` turns a structured spec into a Page IR, renders a curated template, writes a `.openyida-page.json` manifest, and optionally compiles the result. Code Canvas is the default output (`.canvas.jsx`); pass `--native` or output `.oyd.jsx` only when the page must use the 普通自定义页面 JSX/Jsx 组件链路. Pass `--scene workbench|dashboard|list|detail|landing|screen` and `--theme-profile <name-or-json>` / `--visual-profile <name-or-json>` to preserve the visual direction decision in both source comments and the manifest. The user-facing default theme profile is `yida-app-theme`, which follows Yida application theme styling, compact business density, and layered 12/8/6/4 radii. `--theme-scope page` only injects theme variables into the generated page root; `--theme-scope app` additionally calls `window.__YIDA__.updateShellConfig({ themeConfig })` so the application shell can adopt the same theme. Landing pages should declare `spec.assets.heroImage` / `productImages`; use `--resolve-assets` to verify public image URLs and `--upload-assets` to mirror local or verified external images to CDN when CDN is configured. Use `--offline-assets` only for draft/offline gating. The manifest makes follow-up AI edits safer because agents can update known blocks and visual constraints instead of rewriting a large JSX file by hand.
-Built-in templates currently include `official-homepage` for brand/law-firm/product official sites, `data-screen` for immersive monitoring screens, `dashboard-overview` for business dashboards, `workbench-home` for task/entry workbenches, `business-list` for list management pages, `detail-profile` for single-object detail pages, `split-pane-detail` for left-list/right-detail processing consoles, `portal-shell-home` for in-page portal shells, `native-components-smoke` for runtime probing existing Yida host components through `window.Deep` / `window.DeepYida`, `portal-native-components` for runtime-bridged portal, member, department, and upload components, `product-homepage` for legacy workbench-style pages, and `todo-mvc` for a full interaction smoke page covering events, custom state, list rendering, editing, filtering, and localStorage persistence.
+Custom page source is authored directly from PRD and design guidance. Code Canvas is the default output (`.canvas.jsx`); use `.oyd.jsx` only when the page must use the 普通自定义页面 JSX/Jsx 组件链路.
 
-For member, department, attachment, and image upload components, choose the page chain first. Code Canvas pages should start with `native-components-smoke` or `portal-native-components` and follow `yida-canvas-custom-page/references/native-components-bridge.md` for feature detection, fallback, and value normalization. 普通自定义页面 JSX/Jsx pages should use `.oyd.jsx`, read `yida-custom-page/references/component-jsx-guide.md`, and read `attachment-upload-guide.md` when upload fields are involved.
+For member, department, attachment, and image upload components, choose the page chain first. Code Canvas pages should follow `yida-canvas-custom-page/references/native-components-bridge.md` for feature detection, fallback, and value normalization. 普通自定义页面 JSX/Jsx pages should use `.oyd.jsx`, read `yida-custom-page/references/component-jsx-guide.md`, and read `attachment-upload-guide.md` when upload fields are involved.
 
 ### Workflow, Data, and Permissions
 
@@ -401,13 +393,15 @@ Run `openyida --help` or `openyida <command> --help` for detailed usage.
 | `openyida get-schema <appType> <formUuid\|--all> [--summary-json\|--field-map-json]` | Get one form Schema or all form Schemas |
 | `openyida er <appType> [--format mermaid\|json] [--output file] [--include-system] [--include-pages]` | Export app entity relationship diagram |
 | `openyida create-page <appType> "<name>" [--mode dashboard] [--hide-nav] [--locale zh_CN\|en_US\|ja_JP] [--open\|--no-open]` | Create a custom display page |
-| `openyida generate-page <template>` | Generate page from curated template |
 | `openyida build-page <sourceFile> [--output file\|--write]` | Build Yida-compatible page source |
 | `openyida check-page <src> [--compat]` | Check custom page standards |
 | `openyida compile <src>` | Compile custom page locally |
 | `openyida publish <src> <appType> <formUuid> [--health-check] [--force] [--canvas] [--auto-nav-order] [--open\|--no-open]` | Compile and publish custom page |
 | `openyida update-form-config <appType> ...` | Update form configuration |
 | `openyida get-form-config <appType> <formUuid> [--json]` | Query form configuration |
+| `openyida form-detail-style apply <appType> <formUuid> [--css file\|--preset clean-card] [--json]` | Manage form detail page style |
+| `openyida form-detail-style remove <appType> <formUuid> [--json]` | Manage form detail page style |
+| `openyida form-detail-style check <appType> <formUuid> [--json]` | Manage form detail page style |
 
 ### Data & Permissions
 

package/bin/yida.js

@@ -750,12 +750,6 @@ async function main() {
       break;
     }
 
-    case 'generate-page': {
-      const { run } = require('../lib/app/generate-page');
-      await run(args);
-      break;
-    }
-
     case 'build-page': {
       const { run } = require('../lib/app/build-page');
       await run(args);
@@ -832,6 +826,12 @@ async function main() {
       break;
     }
 
+    case 'form-detail-style': {
+      const { run: runFormDetailStyle } = require('../lib/app/form-detail-style');
+      await runFormDetailStyle(args);
+      break;
+    }
+
     case 'update-app': {
       if (args.length < 2) {
         throwCliUsage(t('cli.update_app_usage'), t('cli.update_app_example'));

package/docs/capabilities.md

@@ -62,7 +62,6 @@
 |---|---|
 | 创建自定义页面 | `openyida create-page <appType> "<页面名称>"` |
 | 创建看板页 | `openyida create-page <appType> "<页面名称>" --mode dashboard` |
-| 从模板生成页面源码 | `openyida generate-page <template>` |
 | 构建宜搭兼容页面源码 | `openyida build-page <sourceFile> [--output file\|--write]` |
 | 检查普通自定义页面 JSX 规范 | `openyida check-page <src> [--compat]` |
 | 本地编译普通自定义页面 JSX | `openyida compile <src>` |
@@ -73,8 +72,8 @@
 | 更新页面/表单配置 | `openyida update-form-config <appType> ...` |
 | 查询页面/表单配置 | `openyida get-form-config <appType> <formUuid> [--json]` |
 | 开发高级自定义页面、看板、图表或幻灯片 | 默认优先使用 Code Canvas 链路；明确要求普通自定义页面 JSX/Jsx，或强依赖普通自定义页实例桥时使用 `.oyd.jsx` + `check-page` / `compile` / `publish` |
-| Code Canvas 页面使用成员/部门/上传等宜搭运行态组件 | `openyida sample yida-canvas-custom-page native-components-smoke --output pages/src/native-components-smoke.canvas.jsx`；再参考 `yida-canvas-custom-page/references/native-components-bridge.md` |
-| Code Canvas 门户 + 成员/部门/上传组件示例 | `openyida sample yida-canvas-custom-page portal-native-components --output pages/src/portal-native-components.canvas.jsx` |
+| Code Canvas 页面使用成员/部门/上传等宜搭运行态组件 | 使用 `yida-canvas-custom-page`，参考 `yida-canvas-custom-page/references/native-components-bridge.md` 做运行态组件探测、fallback 和值归一化 |
+| Code Canvas 门户 + 成员/部门/上传组件 | 使用 `yida-canvas-custom-page`，按业务页面结构接入运行态组件桥 |
 | 普通自定义页面 JSX/Jsx 使用成员/部门组件 | 使用 `.oyd.jsx`，参考 `yida-custom-page/references/component-jsx-guide.md` |
 | 普通自定义页面 JSX/Jsx 使用附件/图片上传 | 使用 `.oyd.jsx`，参考 `yida-custom-page/references/attachment-upload-guide.md` |
 

package/lib/app/canvas-compile.js

@@ -34,6 +34,22 @@ const {
   assertNoEmojiInText,
 } = require('../core/no-emoji-guard');
 const { CliError, isCliError } = require('../core/cli-error');
+const {
+  findBareCjkJsxTextIdentifiers,
+  formatBareCjkJsxTextMessage,
+} = require('./jsx-text-guard');
+const {
+  findDirectFormOpenIssues,
+  formatDirectFormOpenMessage,
+} = require('./form-open-guard');
+const {
+  findFormDetailLinkIssues,
+  formatFormDetailLinkMessage,
+} = require('./form-detail-link-guard');
+const {
+  findPageRichnessIssues,
+  formatPageRichnessMessage,
+} = require('./page-richness-guard');
 
 /**
  * 依赖 → window 别名白名单，用于把 import 改写到运行时全局对象。
@@ -58,6 +74,68 @@ const MODULE_ALIAS_MAP = {
   'framer-motion': 'FramerMotion',
 };
 
+const MANUAL_DEPENDENCY_GLOBALS = Object.freeze({
+  React: 'react',
+  antd: 'antd',
+  icons: '@ant-design/icons',
+  ahooks: 'ahooks',
+  d3: 'd3',
+  dayjs: 'dayjs',
+  Recharts: 'recharts',
+  Radix: '@radix-ui/themes',
+  DynamicIcon: 'lucide-react',
+  LucideReact: 'lucide-react',
+  FramerMotion: 'framer-motion',
+  YidaMarkdown: 'yida-plugin-markdown',
+});
+
+const BARE_DEPENDENCY_GLOBALS = Object.freeze({
+  antd: {
+    packageName: 'antd',
+    importExample: "import { Button, Drawer, ConfigProvider } from 'antd';",
+  },
+  icons: {
+    packageName: '@ant-design/icons',
+    importExample: "import { SearchOutlined, PlusOutlined } from '@ant-design/icons';",
+  },
+  lucideReact: {
+    packageName: 'lucide-react',
+    importExample: "import { Search, Plus, RefreshCw } from 'lucide-react';",
+  },
+  LucideReact: {
+    packageName: 'lucide-react',
+    importExample: "import { Search, Plus, RefreshCw } from 'lucide-react';",
+  },
+  DynamicIcon: {
+    packageName: 'lucide-react',
+    importExample: "import { DynamicIcon, Search } from 'lucide-react';",
+  },
+  ahooks: {
+    packageName: 'ahooks',
+    importExample: "import { useMemoizedFn } from 'ahooks';",
+  },
+  dayjs: {
+    packageName: 'dayjs',
+    importExample: "import dayjs from 'dayjs';",
+  },
+  Recharts: {
+    packageName: 'recharts',
+    importExample: "import { LineChart, Line } from 'recharts';",
+  },
+  FramerMotion: {
+    packageName: 'framer-motion',
+    importExample: "import { motion } from 'framer-motion';",
+  },
+  Radix: {
+    packageName: '@radix-ui/themes',
+    importExample: "import { Button } from '@radix-ui/themes';",
+  },
+  YidaMarkdown: {
+    packageName: 'yida-plugin-markdown',
+    importExample: "import Markdown from 'yida-plugin-markdown';",
+  },
+});
+
 const LUCIDE_REACT_PACKAGE = 'lucide-react';
 const LUCIDE_DYNAMIC_ICON_ALIAS = 'DynamicIcon';
 const LUCIDE_MODULE_ALIAS = 'LucideReact';
@@ -91,6 +169,108 @@ function stripJsComments(code) {
     .replace(/(^|[^:])\/\/.*$/gm, '$1');
 }
 
+function assertNoManualDependencyGlobals(source, options = {}) {
+  const stripped = stripJsComments(source);
+  const globals = Object.keys(MANUAL_DEPENDENCY_GLOBALS);
+  const pattern = new RegExp(`\\bwindow\\.(${globals.join('|')})\\b`);
+  const match = pattern.exec(stripped);
+  if (!match) {
+    return;
+  }
+  const globalName = match[1];
+  const pkg = MANUAL_DEPENDENCY_GLOBALS[globalName];
+  throw new CliError(
+    `Code Canvas 源码不能直接读取 window.${globalName}。请使用标准 import 从 "${pkg}" 引入，`
+    + '让编译器把依赖写入 importedModules；否则运行时不会加载该资源，页面会出现 window 依赖 undefined。',
+    {
+      code: 'OPENYIDA_CANVAS_MANUAL_DEPENDENCY_GLOBAL',
+      details: {
+        stage: 'canvas_compile',
+        sourcePath: options.sourcePath,
+        globalName,
+        packageName: pkg,
+      },
+    }
+  );
+}
+
+function findBareDependencyGlobalIssues(source) {
+  const issues = [];
+  const names = new Set(Object.keys(BARE_DEPENDENCY_GLOBALS));
+
+  const guardPlugin = ({ types: t }) => ({
+    name: 'yida-bare-dependency-global-guard',
+    visitor: {
+      ReferencedIdentifier(path) {
+        const name = path.node.name;
+        if (!names.has(name)) {
+          return;
+        }
+        if (path.scope.hasBinding(name)) {
+          return;
+        }
+        if (
+          path.parentPath &&
+          path.parentPath.isMemberExpression() &&
+          path.parent.object === path.node &&
+          t.isIdentifier(path.parent.property, { name: 'then' })
+        ) {
+          return;
+        }
+        const config = BARE_DEPENDENCY_GLOBALS[name];
+        issues.push({
+          name,
+          packageName: config.packageName,
+          importExample: config.importExample,
+          line: path.node.loc && path.node.loc.start ? path.node.loc.start.line : 0,
+          column: path.node.loc && path.node.loc.start ? path.node.loc.start.column : 0,
+        });
+      },
+    },
+  });
+
+  Babel.transform(source, {
+    filename: 'canvas.tsx',
+    presets: [
+      ['typescript', { allExtensions: true, isTSX: true, allowDeclareFields: true }],
+      ['react', { runtime: 'classic' }],
+    ],
+    plugins: [guardPlugin],
+    sourceType: 'module',
+    compact: false,
+    babelrc: false,
+    configFile: false,
+  });
+
+  return issues;
+}
+
+function formatBareDependencyGlobalMessage(issue) {
+  return `Code Canvas 源码不能直接使用未声明的依赖全局变量 ${issue.name}。`
+    + `请改用标准 import 从 "${issue.packageName}" 引入，例如：${issue.importExample} `
+    + '编译器会自动写入 importedModules 并映射到正确运行时资源；否则线上会出现 '
+    + `${issue.name} is not defined。`;
+}
+
+function assertNoBareDependencyGlobals(source, options = {}) {
+  const issues = findBareDependencyGlobalIssues(source);
+  if (issues.length === 0) {
+    return;
+  }
+  const firstIssue = issues[0];
+  throw new CliError(formatBareDependencyGlobalMessage(firstIssue), {
+    code: 'OPENYIDA_CANVAS_BARE_DEPENDENCY_GLOBAL',
+    details: {
+      stage: 'canvas_compile',
+      sourcePath: options.sourcePath || '',
+      line: firstIssue.line,
+      column: firstIssue.column,
+      globalName: firstIssue.name,
+      packageName: firstIssue.packageName,
+    },
+  });
+}
+
 /**
  * 从源码里正则抽取裸包名（过滤相对/绝对路径），去重排序。
  * 对齐画布运行时的依赖抽取行为。
@@ -402,6 +582,62 @@ function compileCanvasLocal(source, options = {}) {
     artifact: options.sourcePath || 'Code Canvas source',
     code: 'OPENYIDA_CANVAS_SOURCE_EMOJI_FORBIDDEN',
   });
+  const jsxTextIssues = findBareCjkJsxTextIdentifiers(source);
+  if (jsxTextIssues.length > 0) {
+    const firstIssue = jsxTextIssues[0];
+    throw new CliError(formatBareCjkJsxTextMessage(firstIssue.name), {
+      code: 'OPENYIDA_CANVAS_JSX_TEXT_IDENTIFIER',
+      details: {
+        stage: 'canvas_compile',
+        sourcePath: options.sourcePath || '',
+        line: firstIssue.line,
+        identifier: firstIssue.name,
+      },
+    });
+  }
+  const directFormOpenIssues = findDirectFormOpenIssues(source);
+  if (directFormOpenIssues.length > 0) {
+    const firstIssue = directFormOpenIssues[0];
+    throw new CliError(formatDirectFormOpenMessage(), {
+      code: 'OPENYIDA_CANVAS_FORM_OPEN_CONTAINER_REQUIRED',
+      details: {
+        stage: 'canvas_compile',
+        sourcePath: options.sourcePath || '',
+        line: firstIssue.line,
+        callee: firstIssue.callee,
+      },
+    });
+  }
+  const formDetailLinkIssues = findFormDetailLinkIssues(source);
+  if (formDetailLinkIssues.length > 0) {
+    const firstIssue = formDetailLinkIssues[0];
+    throw new CliError(formatFormDetailLinkMessage(firstIssue), {
+      code: 'OPENYIDA_CANVAS_FORM_DETAIL_LINK_INVALID',
+      details: {
+        stage: 'canvas_compile',
+        sourcePath: options.sourcePath || '',
+        line: firstIssue.line,
+        issueType: firstIssue.type,
+      },
+    });
+  }
+  const richnessIssues = findPageRichnessIssues(source);
+  if (richnessIssues.length > 0) {
+    const firstIssue = richnessIssues[0];
+    throw new CliError(formatPageRichnessMessage(firstIssue), {
+      code: 'OPENYIDA_CANVAS_CONTENT_BLOCKS_TOO_FEW',
+      details: {
+        stage: 'canvas_compile',
+        sourcePath: options.sourcePath || '',
+        line: firstIssue.line,
+        scene: firstIssue.scene,
+        count: firstIssue.count,
+        min: firstIssue.min,
+      },
+    });
+  }
+  assertNoBareDependencyGlobals(source, options);
+  assertNoManualDependencyGlobals(source, options);
 
   const importedModules = extractImportedModules(source);
 
@@ -517,5 +753,6 @@ module.exports = {
   resolveWindowAlias,
   shouldAllowUnsupportedBareImports,
   assertCanvasRuntimeParseable,
+  findBareDependencyGlobalIssues,
   MODULE_ALIAS_MAP,
 };