@nocobase/flow-engine 2.0.0-alpha.10

package/lib/components/FormItem.js

@@ -0,0 +1,151 @@
+/**
+ * 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 __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __name = (target, value) => __defProp(target, "name", { value, configurable: true });
+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 __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var FormItem_exports = {};
+__export(FormItem_exports, {
+  FormItem: () => FormItem
+});
+module.exports = __toCommonJS(FormItem_exports);
+var import_react = __toESM(require("react"));
+var import_antd = require("antd");
+const formItemPropKeys = [
+  "colon",
+  "dependencies",
+  "extra",
+  "getValueFromEvent",
+  "getValueProps",
+  "hasFeedback",
+  "help",
+  "htmlFor",
+  "initialValue",
+  "label",
+  "labelAlign",
+  "labelCol",
+  "messageVariables",
+  "name",
+  "normalize",
+  "noStyle",
+  "preserve",
+  "rules",
+  "tooltip",
+  "trigger",
+  "validateStatus",
+  "validateTrigger",
+  "valuePropName",
+  "wrapperCol",
+  "labelWidth",
+  "labelWrap",
+  "layout",
+  "required",
+  "showLabel"
+];
+const FormItem = /* @__PURE__ */ __name(({
+  children,
+  showLabel = true,
+  labelWidth,
+  ...rest
+}) => {
+  const childProps = Object.fromEntries(
+    Object.entries(rest).filter(([key]) => !formItemPropKeys.includes(key))
+  );
+  const processedChildren = typeof children === "function" ? children : import_react.default.Children.map(children, (child) => {
+    if (import_react.default.isValidElement(child)) {
+      return import_react.default.cloneElement(child, { ...childProps });
+    }
+    return child;
+  });
+  const { label, labelWrap, colon = true, layout } = rest;
+  const effectiveLabelWrap = !layout || layout === "vertical" ? true : labelWrap;
+  const renderLabel = /* @__PURE__ */ __name(() => {
+    if (!showLabel) return null;
+    if (effectiveLabelWrap) {
+      return /* @__PURE__ */ import_react.default.createElement(
+        "div",
+        {
+          style: {
+            width: "100%",
+            whiteSpace: "normal",
+            wordBreak: "break-word",
+            display: "flex",
+            alignItems: "center",
+            justifyContent: "flex-start",
+            fontWeight: 600
+          }
+        },
+        /* @__PURE__ */ import_react.default.createElement("span", { style: { flex: 1 } }, label),
+        colon && /* @__PURE__ */ import_react.default.createElement("span", { style: { marginLeft: 4, flexShrink: 0 } }, ":")
+      );
+    }
+    return /* @__PURE__ */ import_react.default.createElement(import_antd.Tooltip, { title: label }, /* @__PURE__ */ import_react.default.createElement(
+      "div",
+      {
+        style: {
+          display: "inline-flex",
+          alignItems: "center",
+          maxWidth: (typeof labelWidth === "number" ? labelWidth : 120) - 20,
+          whiteSpace: "nowrap",
+          overflow: "hidden",
+          textOverflow: "ellipsis",
+          verticalAlign: "middle",
+          fontWeight: 600
+        }
+      },
+      /* @__PURE__ */ import_react.default.createElement("span", { style: { flexShrink: 1, overflow: "hidden", textOverflow: "ellipsis" } }, label),
+      colon && /* @__PURE__ */ import_react.default.createElement("span", { style: { marginLeft: 4, flexShrink: 0 } }, ":")
+    ));
+  }, "renderLabel");
+  return /* @__PURE__ */ import_react.default.createElement(
+    import_antd.Form.Item,
+    {
+      ...rest,
+      labelCol: { style: { width: labelWidth } },
+      layout,
+      label: renderLabel(),
+      colon: false,
+      extra: rest.extra && /* @__PURE__ */ import_react.default.createElement("span", { style: { whiteSpace: "pre-wrap" } }, rest.extra),
+      tooltip: {
+        title: rest.tooltip,
+        overlayInnerStyle: { whiteSpace: "pre-line" }
+      }
+    },
+    processedChildren
+  );
+}, "FormItem");
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  FormItem
+});

package/lib/components/common/FlowSettingsButton.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 { ButtonProps } from 'antd';
+import React from 'react';
+export declare const FlowSettingsButton: React.MemoExoticComponent<import("@formily/reactive-react").ReactFC<ButtonProps>>;

package/lib/components/common/FlowSettingsButton.js

@@ -0,0 +1,66 @@
+/**
+ * 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 __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __name = (target, value) => __defProp(target, "name", { value, configurable: true });
+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 __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var FlowSettingsButton_exports = {};
+__export(FlowSettingsButton_exports, {
+  FlowSettingsButton: () => FlowSettingsButton
+});
+module.exports = __toCommonJS(FlowSettingsButton_exports);
+var import_antd = require("antd");
+var import_react = __toESM(require("react"));
+var import_withFlowDesignMode = require("./withFlowDesignMode");
+const FlowSettingsButtonCore = /* @__PURE__ */ __name((props) => {
+  return /* @__PURE__ */ import_react.default.createElement(
+    import_antd.Button,
+    {
+      ...props,
+      type: "dashed",
+      style: {
+        ...props.style,
+        borderColor: "var(--colorSettings)",
+        color: "var(--colorSettings)",
+        alignSelf: "flex-start"
+      }
+    }
+  );
+}, "FlowSettingsButtonCore");
+const FlowSettingsButton = (0, import_withFlowDesignMode.withFlowDesignMode)(FlowSettingsButtonCore);
+FlowSettingsButton.displayName = "FlowSettingsButton";
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  FlowSettingsButton
+});

package/lib/components/common/index.d.ts

@@ -0,0 +1,9 @@
+/**
+ * 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.
+ */
+export * from './FlowSettingsButton';

package/lib/components/common/index.js

@@ -0,0 +1,30 @@
+/**
+ * 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 __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 __reExport = (target, mod, secondTarget) => (__copyProps(target, mod, "default"), secondTarget && __copyProps(secondTarget, mod, "default"));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var common_exports = {};
+module.exports = __toCommonJS(common_exports);
+__reExport(common_exports, require("./FlowSettingsButton"), module.exports);
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  ...require("./FlowSettingsButton")
+});

package/lib/components/common/withFlowDesignMode.d.ts

@@ -0,0 +1,26 @@
+/**
+ * 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 React from 'react';
+/**
+ * 高阶组件：仅在设计模式启用时渲染子组件
+ *
+ * @param WrappedComponent 要包装的组件
+ * @returns 包装后的组件，只在 flowSettings.enabled 为 true 时渲染
+ *
+ * @example
+ * ```tsx
+ * const MyComponent = withFlowDesignMode(({ model, ...props }) => {
+ *   // 这些计算只在设计模式启用时才会执行
+ *   const expensiveData = useMemo(() => complexCalculation(), []);
+ *
+ *   return <div>{expensiveData}</div>;
+ * });
+ * ```
+ */
+export declare function withFlowDesignMode<P extends Record<string, any>>(WrappedComponent: React.ComponentType<P>): React.MemoExoticComponent<import("@formily/reactive-react").ReactFC<React.PropsWithoutRef<P>>>;

package/lib/components/common/withFlowDesignMode.js

@@ -0,0 +1,61 @@
+/**
+ * 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 __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __name = (target, value) => __defProp(target, "name", { value, configurable: true });
+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 __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var withFlowDesignMode_exports = {};
+__export(withFlowDesignMode_exports, {
+  withFlowDesignMode: () => withFlowDesignMode
+});
+module.exports = __toCommonJS(withFlowDesignMode_exports);
+var import_react = __toESM(require("react"));
+var import_reactive_react = require("@formily/reactive-react");
+var import_provider = require("../../provider");
+function withFlowDesignMode(WrappedComponent) {
+  const WithFlowDesignModeComponent = (0, import_reactive_react.observer)((props) => {
+    const flowEngine = (0, import_provider.useFlowEngine)();
+    if (!flowEngine.flowSettings.enabled) {
+      return null;
+    }
+    return /* @__PURE__ */ import_react.default.createElement(WrappedComponent, { ...props });
+  });
+  WithFlowDesignModeComponent.displayName = `withFlowDesignMode(${WrappedComponent.displayName || WrappedComponent.name || "Component"})`;
+  return WithFlowDesignModeComponent;
+}
+__name(withFlowDesignMode, "withFlowDesignMode");
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  withFlowDesignMode
+});

package/lib/components/dnd/findModelUidPosition.d.ts

@@ -0,0 +1,13 @@
+/**
+ * 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.
+ */
+export declare const findModelUidPosition: (uid: string, rows: Record<string, string[][]>) => {
+    rowId: string;
+    columnIndex: number;
+    itemIndex: number;
+};

package/lib/components/dnd/findModelUidPosition.js

@@ -0,0 +1,50 @@
+/**
+ * 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 __name = (target, value) => __defProp(target, "name", { value, configurable: true });
+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 findModelUidPosition_exports = {};
+__export(findModelUidPosition_exports, {
+  findModelUidPosition: () => findModelUidPosition
+});
+module.exports = __toCommonJS(findModelUidPosition_exports);
+const findModelUidPosition = /* @__PURE__ */ __name((uid, rows) => {
+  let result = null;
+  for (const [rowId, columns] of Object.entries(rows)) {
+    for (let columnIndex = 0; columnIndex < columns.length; columnIndex++) {
+      const column = columns[columnIndex];
+      for (let itemIndex = 0; itemIndex < column.length; itemIndex++) {
+        if (column[itemIndex] === uid) {
+          result = { rowId, columnIndex, itemIndex };
+        }
+      }
+    }
+  }
+  return result;
+}, "findModelUidPosition");
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  findModelUidPosition
+});

package/lib/components/dnd/gridDragPlanner.d.ts

@@ -0,0 +1,130 @@
+/**
+ * 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.
+ */
+/** 栅格系统常量 */
+export declare const DEFAULT_GRID_COLUMNS = 24;
+/** 最小 slot 厚度 */
+export declare const MIN_SLOT_THICKNESS = 16;
+/** 最大 slot 厚度 */
+export declare const MAX_SLOT_THICKNESS = 48;
+/** 列边缘最小宽度 */
+export declare const COLUMN_EDGE_MIN_WIDTH = 12;
+/** 列边缘最大宽度 */
+export declare const COLUMN_EDGE_MAX_WIDTH = 28;
+/** 列边缘宽度占列宽的比例（原来是 1/5） */
+export declare const COLUMN_EDGE_WIDTH_RATIO = 0.2;
+export interface Rect {
+    top: number;
+    left: number;
+    width: number;
+    height: number;
+}
+export interface Point {
+    x: number;
+    y: number;
+}
+export interface GridLayoutData {
+    rows: Record<string, string[][]>;
+    sizes: Record<string, number[]>;
+}
+export interface ColumnSlot {
+    type: 'column';
+    rowId: string;
+    columnIndex: number;
+    insertIndex: number;
+    position: 'before' | 'after';
+    rect: Rect;
+}
+export interface ColumnEdgeSlot {
+    type: 'column-edge';
+    rowId: string;
+    columnIndex: number;
+    direction: 'left' | 'right';
+    rect: Rect;
+}
+export interface RowGapSlot {
+    type: 'row-gap';
+    targetRowId: string;
+    position: 'above' | 'below';
+    rect: Rect;
+}
+export interface EmptyRowSlot {
+    type: 'empty-row';
+    rect: Rect;
+}
+export interface EmptyColumnSlot {
+    type: 'empty-column';
+    rowId: string;
+    columnIndex: number;
+    rect: Rect;
+}
+export type LayoutSlot = ColumnSlot | ColumnEdgeSlot | RowGapSlot | EmptyRowSlot | EmptyColumnSlot;
+/**
+ * 列内插入的配置
+ */
+export interface ColumnInsertConfig {
+    /** 高亮区域的高度（像素） */
+    height?: number;
+    /** 垂直偏移（像素），正数向下，负数向上 */
+    offsetTop?: number;
+}
+/**
+ * 列边缘的配置
+ */
+export interface ColumnEdgeConfig {
+    /** 高亮区域的宽度（像素） */
+    width?: number;
+    /** 水平偏移（像素），正数向右，负数向左 */
+    offsetLeft?: number;
+}
+/**
+ * 行间隙的配置
+ */
+export interface RowGapConfig {
+    /** 高亮区域的高度（像素） */
+    height?: number;
+    /** 垂直偏移（像素），正数向下，负数向上 */
+    offsetTop?: number;
+}
+/**
+ * 拖拽高亮区域的全局配置
+ */
+export interface DragOverlayConfig {
+    /** 列内插入（before 表示在区块上方插入，after 表示在区块下方插入） */
+    columnInsert?: {
+        before?: ColumnInsertConfig;
+        after?: ColumnInsertConfig;
+    };
+    /** 列边缘（left 表示在左侧新建列，right 表示在右侧新建列） */
+    columnEdge?: {
+        left?: ColumnEdgeConfig;
+        right?: ColumnEdgeConfig;
+    };
+    /** 行间隙（above 表示在行上方插入，below 表示在行下方插入） */
+    rowGap?: {
+        above?: RowGapConfig;
+        below?: RowGapConfig;
+    };
+}
+export interface LayoutSnapshot {
+    slots: LayoutSlot[];
+    containerRect: Rect;
+}
+export interface BuildLayoutSnapshotOptions {
+    container: HTMLElement | null;
+}
+export declare const buildLayoutSnapshot: ({ container }: BuildLayoutSnapshotOptions) => LayoutSnapshot;
+export declare const getSlotKey: (slot: LayoutSlot) => string;
+export declare const resolveDropIntent: (point: Point, slots: LayoutSlot[]) => LayoutSlot | null;
+export interface SimulateLayoutOptions {
+    slot: LayoutSlot;
+    sourceUid: string;
+    layout: GridLayoutData;
+    generateRowId?: () => string;
+}
+export declare const simulateLayoutForSlot: ({ slot, sourceUid, layout, generateRowId, }: SimulateLayoutOptions) => GridLayoutData;