@arronqzy/abuilder 1.1.4 → 1.1.6

package/README.md

@@ -1,6 +1,13 @@
 # @arronqzy/abuilder
 
-Abuilder 可视化编辑器 npm 包。安装后在 React 应用中引入 `App` 即可渲染完整编辑器（含蓝图、工作区、在线预览）。
+Abuilder **一站式可视化编辑器** npm 包。安装后在 React 应用中引入 `App` 即可渲染完整应用（视图画布 + 蓝图 + 工作区 + 在线预览）。
+
+## 功能概览
+
+- **视图编辑**：拖拽物料、图层、缩放平移、多选、图表与 Scope 配置
+- **蓝图编辑**：节点连线、调试执行、蓝图库与执行日志
+- **工作区**：多项目、IndexedDB 持久化、导入导出
+- **在线预览**：独立预览页，支持 URL 参数打开指定工作区
 
 ## 安装
 
@@ -32,22 +39,40 @@ createRoot(document.getElementById("root")!).render(<App />);
 
 ### 在线预览
 
-URL 带 `?preview=online&projectId=<工作区ID>` 时自动进入预览模式。也可手动传入：
+URL 带 `?preview=online&projectId=<工作区ID>` 时自动进入预览模式：
 
 ```tsx
 <App previewSearch="?preview=online&projectId=xxx" />
 ```
 
-## 高级导出
+### 高级导出
 
-除 `App` 外，也可直接使用底层组件：
+除 `App` 外，也可单独使用底层组件：
 
 ```tsx
-import { ReactViewPanel, ReactViewOnlinePreview } from "@arronqzy/abuilder";
+import {
+  ReactViewPanel,
+  ReactViewOnlinePreview,
+} from "@arronqzy/abuilder";
 ```
 
+## Monorepo 包结构
+
+| 包 | 职责 |
+|----|------|
+| `@arronqzy/abuilder` | 聚合入口（本包） |
+| `@arronqzy/react-view` | 视图画布与工作区 |
+| `@arronqzy/react-blueprint` | 蓝图编辑器 UI |
+| `@arronqzy/blueprint-dsl` | 蓝图 DSL 与运行时 |
+| `@arronqzy/rx-store` | 画布状态与 Undo/Redo |
+| `@arronqzy/ui` | 共享 UI 组件 |
+
 ## 宿主应用要求
 
 - React 18+
 - 构建工具需支持 CSS 导入（Vite / Webpack 5 等）
 - 根节点容器建议 `height: 100%`（样式已包含 `#root` / `#app` 规则）
+
+## 许可证
+
+MIT

package/dist/styles.css

@@ -754,14 +754,14 @@ body {
   z-index: 10000;
 }
 
-.z-\[100\] {
-  z-index: 100;
-}
-
 .z-\[1\] {
   z-index: 1;
 }
 
+.z-toast {
+  z-index: 99999;
+}
+
 .-mx-1 {
   margin-left: -0.25rem;
   margin-right: -0.25rem;
@@ -2300,6 +2300,10 @@ body {
   pointer-events: none;
 }
 
+.data-\[state\=closed\]\:pointer-events-none[data-state="closed"] {
+  pointer-events: none;
+}
+
 .data-\[panel-group-direction\=vertical\]\:h-px[data-panel-group-direction="vertical"] {
   height: 1px;
 }
@@ -2769,18 +2773,6 @@ body {
 }
 
 @media (min-width: 640px) {
-  .sm\:bottom-0 {
-    bottom: 0px;
-  }
-
-  .sm\:right-0 {
-    right: 0px;
-  }
-
-  .sm\:top-auto {
-    top: auto;
-  }
-
   .sm\:mt-0 {
     margin-top: 0px;
   }
@@ -2793,10 +2785,6 @@ body {
     flex-direction: row;
   }
 
-  .sm\:flex-col {
-    flex-direction: column;
-  }
-
   .sm\:justify-end {
     justify-content: flex-end;
   }
@@ -2818,10 +2806,6 @@ body {
   .sm\:text-left {
     text-align: left;
   }
-
-  .data-\[state\=open\]\:sm\:slide-in-from-bottom-full[data-state="open"] {
-    --tw-enter-translate-y: 100%;
-  }
 }
 
 @media (min-width: 768px) {
@@ -3689,10 +3673,6 @@ video {
   pointer-events: none;
 }
 
-.visible {
-  visibility: visible;
-}
-
 .collapse {
   visibility: collapse;
 }
@@ -3872,10 +3852,6 @@ video {
   margin-top: 0.25rem;
 }
 
-.mt-1\.5 {
-  margin-top: 0.375rem;
-}
-
 .mt-2 {
   margin-top: 0.5rem;
 }
@@ -3995,6 +3971,10 @@ video {
   height: 100%;
 }
 
+.max-h-28 {
+  max-height: 7rem;
+}
+
 .max-h-44 {
   max-height: 11rem;
 }
@@ -4135,14 +4115,14 @@ video {
   max-width: 200px;
 }
 
-.max-w-\[260px\] {
-  max-width: 260px;
-}
-
 .max-w-\[360px\] {
   max-width: 360px;
 }
 
+.max-w-\[380px\] {
+  max-width: 380px;
+}
+
 .max-w-\[420px\] {
   max-width: 420px;
 }
@@ -4383,10 +4363,18 @@ video {
   white-space: nowrap;
 }
 
+.whitespace-pre-wrap {
+  white-space: pre-wrap;
+}
+
 .break-words {
   overflow-wrap: break-word;
 }
 
+.break-all {
+  word-break: break-all;
+}
+
 .rounded {
   border-radius: 0.25rem;
 }
@@ -5115,6 +5103,10 @@ video {
   color: hsl(var(--foreground));
 }
 
+.text-foreground\/80 {
+  color: hsl(var(--foreground) / 0.8);
+}
+
 .text-foreground\/90 {
   color: hsl(var(--foreground) / 0.9);
 }
@@ -5416,34 +5408,48 @@ video {
 
 .rv-moveable-layer {
   --moveable-color: #1990ff;
+  z-index: 9999 !important;
 }
 
-.rv-moveable-layer .moveable-control {
-  width: 14px !important;
-  height: 14px !important;
-  margin-top: -7px !important;
-  margin-left: -7px !important;
-  border-radius: 50% !important;
-  box-sizing: border-box !important;
-  border: 2px solid hsl(var(--background)) !important;
-  background: #1990ff !important;
+.rv-moveable-layer.moveable-group,
+.rv-moveable-layer .moveable-group,
+.rv-moveable-layer.moveable-control-box,
+.rv-moveable-layer .moveable-control-box {
+  z-index: 1 !important;
+}
+
+.rv-moveable-layer .moveable-line {
+  --moveable-color: #1990ff;
   background: var(--moveable-color) !important;
 }
 
+/* 组选/单边控制线：厚度由 moveable zoom 补偿，保持屏幕 1px */
+
 .rv-moveable-layer .moveable-line.moveable-direction {
-  width: 1px !important;
-  height: 1px !important;
-  margin: 0 !important;
+  background: var(--moveable-color) !important;
 }
 
-.rv-moveable-layer .moveable-line {
-  --moveable-color: #1990ff;
+.rv-moveable-layer .moveable-group .moveable-control-box,
+.rv-moveable-layer.moveable-group .moveable-control-box {
+  z-index: 2 !important;
 }
 
 .rv-moveable-layer .moveable-around-control {
   background: transparent !important;
 }
 
+.rv-moveable-layer .moveable-control {
+  width: 14px !important;
+  height: 14px !important;
+  margin-top: -7px !important;
+  margin-left: -7px !important;
+  border-radius: 50% !important;
+  box-sizing: border-box !important;
+  border: 2px solid hsl(var(--background)) !important;
+  background: #1990ff !important;
+  background: var(--moveable-color) !important;
+}
+
 .hover\:border-border:hover {
   border-color: hsl(var(--border));
 }
@@ -5680,10 +5686,18 @@ video {
   width: 0.5rem;
 }
 
+.\[\&_\.moveable-area\]\:pointer-events-auto .moveable-area {
+  pointer-events: auto;
+}
+
 .\[\&_\.moveable-control-box\]\:pointer-events-auto .moveable-control-box {
   pointer-events: auto;
 }
 
+.\[\&_\.moveable-group\]\:pointer-events-auto .moveable-group {
+  pointer-events: auto;
+}
+
 .\[\&_\.scope-field--highlight\]\:rounded-md .scope-field--highlight {
   border-radius: calc(var(--radius) - 2px);
 }
@@ -6486,6 +6500,8 @@ svg.react-flow__connectionline {
   --xy-edge-stroke-selected: #1d4ed8;
   --xy-connectionline-stroke: #2563eb;
   --xy-connectionline-stroke-width: 2.5;
+  --xy-handle-background-color: hsl(var(--primary));
+  --xy-handle-border-color: hsl(var(--background));
   background-color: transparent;
 }
 
@@ -6646,11 +6662,11 @@ svg.react-flow__connectionline {
   height: 10px;
   min-width: 10px;
   min-height: 10px;
-  border: 2px solid hsl(var(--background));
+  border: 2px solid hsl(var(--background)) !important;
   border-radius: 9999px;
-  background: hsl(var(--muted-foreground) / 0.45);
+  background-color: hsl(var(--foreground) / 0.42) !important;
   transition:
-    background 0.15s ease,
+    background-color 0.15s ease,
     border-color 0.15s ease,
     box-shadow 0.15s ease;
 }
@@ -6658,30 +6674,34 @@ svg.react-flow__connectionline {
 .bp-canvas .react-flow__handle.bp-flow-handle:hover,
 .bp-flow .react-flow__handle.bp-flow-handle:hover,
 [data-workspace-region="blueprint"] .react-flow__handle.bp-flow-handle:hover {
-  background: hsl(var(--primary));
-  border-color: hsl(var(--background));
+  background-color: hsl(var(--primary)) !important;
+  border-color: hsl(var(--background)) !important;
   box-shadow: 0 0 0 3px hsl(var(--primary) / 0.28);
 }
 
 .bp-canvas .react-flow__handle.bp-flow-handle--target,
 .bp-flow .react-flow__handle.bp-flow-handle--target,
 [data-workspace-region="blueprint"] .react-flow__handle.bp-flow-handle--target {
-  background: hsl(var(--muted-foreground) / 0.35);
+  background-color: hsl(var(--foreground) / 0.48) !important;
 }
 
 .bp-canvas .react-flow__handle.bp-flow-handle--source,
 .bp-flow .react-flow__handle.bp-flow-handle--source,
 [data-workspace-region="blueprint"] .react-flow__handle.bp-flow-handle--source {
-  background: hsl(var(--primary) / 0.55);
+  background-color: hsl(var(--primary) / 0.72) !important;
 }
 
 .bp-node--selected .bp-flow-handle {
-  border-color: hsl(var(--card));
+  border-color: hsl(var(--card)) !important;
   box-shadow: 0 0 0 2px hsl(var(--primary) / 0.35);
 }
 
+.bp-node--selected .bp-flow-handle--target {
+  background-color: hsl(var(--foreground) / 0.55) !important;
+}
+
 .bp-node--selected .bp-flow-handle--source {
-  background: hsl(var(--primary));
+  background-color: hsl(var(--primary)) !important;
 }
 
 .bp-node--execution-true .bp-node-card {
@@ -6697,11 +6717,11 @@ svg.react-flow__connectionline {
 }
 
 .bp-node--execution-true .bp-flow-handle--source {
-  background: #16a34a;
+  background-color: #16a34a !important;
 }
 
 .bp-node--execution-true .bp-flow-handle--target {
-  background: rgb(22 163 74 / 0.55);
+  background-color: rgb(22 163 74 / 0.55) !important;
 }
 
 .bp-node--execution-false .bp-node-card {
@@ -6717,11 +6737,11 @@ svg.react-flow__connectionline {
 }
 
 .bp-node--execution-false .bp-flow-handle--source {
-  background: hsl(var(--destructive));
+  background-color: hsl(var(--destructive)) !important;
 }
 
 .bp-node--execution-false .bp-flow-handle--target {
-  background: hsl(var(--destructive) / 0.55);
+  background-color: hsl(var(--destructive) / 0.55) !important;
 }
 
 /* 生命周期节点无输入口：隐藏任何左侧/目标连接点（含旧数据产生的幽灵 handle） */
@@ -6740,13 +6760,13 @@ svg.react-flow__connectionline {
 .bp-canvas .react-flow__handle.bp-flow-handle--signal,
 .bp-flow .react-flow__handle.bp-flow-handle--signal,
 [data-workspace-region="blueprint"] .react-flow__handle.bp-flow-handle--signal {
-  background: hsl(38 92% 50% / 0.75);
+  background-color: hsl(38 92% 50% / 0.75) !important;
   width: 8px;
   height: 8px;
 }
 
 .bp-node--selected .bp-flow-handle--signal {
-  background: hsl(38 92% 50%);
+  background-color: hsl(38 92% 50%) !important;
 }
 
 /* 右键菜单 */

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@arronqzy/abuilder",
-  "version": "1.1.4",
+  "version": "1.1.6",
   "description": "Abuilder 可视化编辑器 — 安装后即可通过 <App /> 渲染完整应用",
   "license": "MIT",
   "type": "module",
@@ -23,11 +23,11 @@
     "./styles.css": "./dist/styles.css"
   },
   "dependencies": {
-    "@arronqzy/blueprint-dsl": "1.0.1",
-    "@arronqzy/react-view": "1.0.3",
-    "@arronqzy/react-blueprint": "1.0.1",
-    "@arronqzy/rx-store": "1.0.1",
-    "@arronqzy/ui": "1.0.0"
+    "@arronqzy/blueprint-dsl": "1.0.3",
+    "@arronqzy/react-view": "1.0.5",
+    "@arronqzy/react-blueprint": "1.0.3",
+    "@arronqzy/rx-store": "1.0.2",
+    "@arronqzy/ui": "1.0.2"
   },
   "peerDependencies": {
     "react": ">=18",