@flowgram-vue/group-plugin 0.2.0

package/LICENSE

@@ -0,0 +1,22 @@
+MIT License
+
+Copyright (c) 2025 Bytedance Ltd. and/or its affiliates
+Copyright (c) 2026 Crayon
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/dist/index.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/layer-vue-provide.ts","../src/constant.ts","../src/components/group-render.vue","../src/composables/use-hover.ts","../src/components/group-box.vue","../src/groups-layer.ts","../src/registers/register-render.ts","../src/registers/register-layer.ts","../src/group-node-register.ts","../src/registers/register-group-node.ts","../src/registers/register-clean-groups.ts","../src/registers/index.ts","../src/create-group-plugin.ts"],"names":["defineComponent","provide","PlaygroundVueContainerKey","PlaygroundVueRefKey","Playground","h","GroupRenderer","GroupPluginRegister","useEntityFromContext","FlowNodeRenderData","document","useService","FlowDocument","computed","FlowGroupController","ref","delay","onMounted","onBeforeUnmount","watch","_openBlock","_createBlock","_resolveDynamicComponent","_createCommentVNode","_createElementBlock","_createElementVNode","_normalizeStyle","GroupsLayer","Layer","domUtils","Fragment","inject","FlowRendererRegistry","FlowGroupService","PlaygroundContainerFactory","observeEntity","FlowDocumentTransformerEntity","observeEntityDatas","FlowNodeEntity","FlowNodeTransformData","injectable","renderer","FlowNodeBaseType","FlowTransitionLineEnum","Point","FlowTransitionLabelEnum","definePluginCreator"],"mappings":"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","file":"index.cjs","sourcesContent":["/**\n * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates\n * SPDX-License-Identifier: MIT\n */\n\nimport { defineComponent, h, provide, type VNodeChild } from 'vue';\nimport type { interfaces } from 'inversify';\nimport {\n  Playground,\n  PlaygroundVueContainerKey,\n  PlaygroundVueRefKey,\n  type PlaygroundContainerFactory,\n} from '@flowgram-vue/core';\n\n/**\n * 给 Layer 独立 createApp 注入 playground 容器，使子组件里的 useService / usePlayground 可用。\n */\nexport const LayerVueProvide = defineComponent({\n  name: 'LayerVueProvide',\n  props: {\n    factory: {\n      type: Object,\n      required: true,\n    },\n  },\n  setup(props) {\n    const factory = props.factory as PlaygroundContainerFactory;\n    provide(PlaygroundVueContainerKey, factory as unknown as interfaces.Container);\n    try {\n      provide(PlaygroundVueRefKey, factory.get(Playground));\n    } catch {\n      // 测试容器可能重复 bind PlaygroundConfig，此时仅 provide container\n    }\n  },\n  render() {\n    return this.$slots.default?.();\n  },\n});\n\nexport function wrapLayerRender(factory: PlaygroundContainerFactory, children: VNodeChild) {\n  return h(LayerVueProvide, { factory }, () => children);\n}\n","/**\n * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates\n * SPDX-License-Identifier: MIT\n */\n\nexport enum GroupRenderer {\n  GroupRender = 'group_render',\n  GroupBox = 'group_box',\n}\n\nexport const PositionConfig = {\n  paddingWithNote: 50, // note 留白大小\n  padding: 10, // 无 label 的 padding\n  paddingWithAddLabel: 20, // 有 label 的padding，如要放添加按钮\n  headerHeight: 20, // 基础头部高度\n};\n\nexport enum GroupPluginRegister {\n  GroupNode = 'registerGroupNode',\n  Render = 'registerRender',\n  Layer = 'registerLayer',\n  CleanGroups = 'registerCleanGroups',\n}\n","<script setup lang=\"ts\">\n/**\n * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates\n * SPDX-License-Identifier: MIT\n */\n\nimport { computed, onBeforeUnmount, onMounted, ref, watch } from 'vue';\n\nimport { delay, type Disposable, type Rectangle } from '@flowgram-vue/utils';\nimport {\n  FlowDocument,\n  FlowGroupController,\n  FlowNodeEntity,\n  FlowNodeRenderData,\n} from '@flowgram-vue/document';\nimport { useEntityFromContext, useService } from '@flowgram-vue/core';\n\nimport type { IGroupBoxHeader, IGroupNode } from '../type';\n\nconst props = defineProps<{\n  groupNode: FlowNodeEntity;\n  GroupNode: IGroupNode;\n  GroupBoxHeader: IGroupBoxHeader;\n}>();\n\nfunction useCurrentDomNode(): HTMLDivElement {\n  const entity = useEntityFromContext<FlowNodeEntity>();\n  const renderData = entity.getData<FlowNodeRenderData>(FlowNodeRenderData);\n  return renderData.node;\n}\n\nconst container = useCurrentDomNode();\nconst document = useService<FlowDocument>(FlowDocument);\nconst groupController = computed(() => FlowGroupController.create(props.groupNode));\n\nconst renderKey = ref(0);\nconst rendering = ref(true);\nconst collapsedCache = ref(groupController.value?.collapsed ?? false);\nlet disposer: Disposable | undefined;\n\nasync function rerender() {\n  rendering.value = true;\n  renderKey.value += 1;\n  await delay(50);\n  renderKey.value += 1;\n  rendering.value = false;\n}\n\nonMounted(() => {\n  disposer = document.renderTree.onTreeChange(() => {\n    if (groupController.value?.collapsed !== collapsedCache.value) {\n      collapsedCache.value = groupController.value?.collapsed ?? false;\n      void rerender();\n    }\n  });\n\n  if (groupController.value && !groupController.value.collapsed) {\n    void rerender();\n  }\n});\n\nonBeforeUnmount(() => {\n  disposer?.dispose();\n});\n\nwatch(\n  [() => groupController.value?.collapsed, rendering],\n  () => {\n    const controller = groupController.value;\n    if (!controller) {\n      return;\n    }\n    if (controller.collapsed) {\n      Object.assign(container.style, {\n        display: 'block',\n        zIndex: '0',\n        width: 'auto',\n        height: 'auto',\n      });\n      return;\n    }\n    if (!rendering.value) {\n      const bounds: Rectangle = controller.bounds;\n      Object.assign(container.style, {\n        width: `${bounds.width}px`,\n      });\n    }\n  },\n  { immediate: true }\n);\n</script>\n\n<template>\n  <component\n    :is=\"GroupNode\"\n    v-if=\"groupController && groupController.collapsed\"\n    :key=\"renderKey\"\n    :group-node=\"groupNode\"\n    :group-controller=\"groupController\"\n  />\n  <component\n    :is=\"GroupBoxHeader\"\n    v-else-if=\"groupController && !rendering\"\n    :key=\"renderKey\"\n    :group-controller=\"groupController\"\n    :group-node=\"groupNode\"\n  />\n</template>\n","/**\n * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates\n * SPDX-License-Identifier: MIT\n */\n\nimport { onBeforeUnmount, onMounted, ref } from 'vue';\n\nexport function useHover() {\n  const elRef = ref<HTMLDivElement | null>(null);\n  const hover = ref(false);\n\n  const checkMouseOver = (event: MouseEvent) => {\n    if (!elRef.value) {\n      return;\n    }\n    const { left, top, right, bottom } = elRef.value.getBoundingClientRect();\n    const isOver =\n      event.clientX >= left &&\n      event.clientX <= right &&\n      event.clientY >= top &&\n      event.clientY <= bottom;\n\n    hover.value = isOver;\n  };\n\n  onMounted(() => {\n    window.addEventListener('mousemove', checkMouseOver);\n  });\n\n  onBeforeUnmount(() => {\n    window.removeEventListener('mousemove', checkMouseOver);\n  });\n\n  return {\n    hover,\n    elRef,\n  };\n}\n","<script setup lang=\"ts\">\n/**\n * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates\n * SPDX-License-Identifier: MIT\n */\n\nimport { computed, watch, type CSSProperties } from 'vue';\n\nimport type { Rectangle } from '@flowgram-vue/utils';\nimport { FlowGroupController, type FlowNodeEntity } from '@flowgram-vue/document';\n\nimport { useHover } from '../composables/use-hover';\n\nconst props = defineProps<{\n  groupNode: FlowNodeEntity;\n  backgroundStyle?: (groupController: FlowGroupController) => CSSProperties;\n}>();\n\nconst groupController = computed(() => FlowGroupController.create(props.groupNode));\nconst { hover, elRef } = useHover();\n\nconst positionStyle = computed<CSSProperties>(() => {\n  const bounds: Rectangle | undefined = groupController.value?.bounds;\n  if (!bounds) {\n    return {};\n  }\n  return {\n    position: 'absolute',\n    left: bounds.left,\n    top: bounds.top,\n    width: bounds.width,\n    height: bounds.height,\n  };\n});\n\nconst defaultBackgroundStyle = computed<CSSProperties>(() => ({\n  borderRadius: 10,\n  zIndex: -1,\n  outline: `${hover.value ? 2 : 1}px solid rgb(97, 69, 211)`,\n  backgroundColor: 'rgb(236 233 247)',\n}));\n\nconst backgroundStyle = computed(() =>\n  props.backgroundStyle && groupController.value\n    ? props.backgroundStyle(groupController.value)\n    : defaultBackgroundStyle.value\n);\n\nwatch(hover, (value) => {\n  if (groupController.value) {\n    groupController.value.hovered = value;\n  }\n});\n</script>\n\n<template>\n  <div\n    v-if=\"groupController && !groupController.collapsed\"\n    class=\"gedit-group-box\"\n    :data-group-id=\"groupNode.id\"\n  >\n    <div\n      ref=\"elRef\"\n      class=\"gedit-group-background\"\n      :style=\"{ ...positionStyle, ...backgroundStyle }\"\n    />\n  </div>\n</template>\n","/**\n * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates\n * SPDX-License-Identifier: MIT\n */\n\nimport { Fragment, h, type Component } from 'vue';\nimport { inject, injectable } from 'inversify';\nimport { FlowRendererRegistry } from '@flowgram-vue/renderer';\nimport {\n  FlowDocument,\n  FlowDocumentTransformerEntity,\n  FlowGroupController,\n  FlowGroupService,\n  FlowNodeEntity,\n  FlowNodeRenderData,\n  FlowNodeTransformData,\n} from '@flowgram-vue/document';\nimport { Layer, observeEntity, observeEntityDatas, PlaygroundContainerFactory } from '@flowgram-vue/core';\nimport { domUtils } from '@flowgram-vue/utils';\n\nimport { wrapLayerRender } from './layer-vue-provide';\nimport { GroupsLayerOptions, IGroupBox } from './type';\nimport { GroupRenderer } from './constant';\nimport { GroupBox } from './components';\n\n@injectable()\nexport class GroupsLayer extends Layer<GroupsLayerOptions> {\n  public readonly node: HTMLElement;\n\n  @inject(FlowDocument) protected document: FlowDocument;\n\n  @inject(FlowRendererRegistry)\n  protected readonly rendererRegistry: FlowRendererRegistry;\n\n  @inject(FlowGroupService)\n  protected readonly groupService: FlowGroupService;\n\n  @inject(PlaygroundContainerFactory)\n  protected readonly playgroundContainer: PlaygroundContainerFactory;\n\n  @observeEntity(FlowDocumentTransformerEntity)\n  readonly documentTransformer: FlowDocumentTransformerEntity;\n\n  @observeEntityDatas(FlowNodeEntity, FlowNodeRenderData) _renderStates: FlowNodeRenderData[];\n\n  @observeEntityDatas(FlowNodeEntity, FlowNodeTransformData) _transforms: FlowNodeTransformData[];\n\n  private readonly className = 'gedit-groups-layer';\n\n  constructor() {\n    super();\n    this.node = domUtils.createDivWithClass(this.className);\n    this.node.style.zIndex = '0';\n  }\n\n  /** 缩放 */\n  public onZoom(scale: number): void {\n    this.node!.style.transform = `scale(${scale})`;\n  }\n\n  public render() {\n    if (this.documentTransformer.loading) return null;\n    this.documentTransformer.refresh();\n\n    return wrapLayerRender(this.playgroundContainer, this.renderGroups());\n  }\n\n  /** 渲染分组 */\n  protected renderGroups() {\n    const Box = (this.renderer || GroupBox) as Component;\n    return h(\n      Fragment,\n      null,\n      this.groups.map((group) =>\n        h(Box, {\n          key: group.groupNode.id,\n          groupNode: group.groupNode,\n          backgroundStyle: this.options.groupBoxStyle,\n        })\n      )\n    );\n  }\n\n  /** 所有分组 */\n  protected get groups(): FlowGroupController[] {\n    return this.groupService.getAllGroups();\n  }\n\n  protected get renderer(): IGroupBox | undefined {\n    return this.rendererRegistry.tryToGetRendererComponent(GroupRenderer.GroupBox)\n      ?.renderer as IGroupBox | undefined;\n  }\n}\n","/**\n * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates\n * SPDX-License-Identifier: MIT\n */\n\nimport { defineComponent, h } from 'vue';\n\nimport { FlowRendererRegistry } from '@flowgram-vue/renderer';\nimport { FlowNodeEntity } from '@flowgram-vue/document';\n\nimport { IGroupPluginRegister } from '../type';\nimport { GroupRenderer } from '../constant';\nimport { GroupRender } from '../components';\n\n/** 注册渲染组件 */\nexport const registerRender: IGroupPluginRegister = (ctx, opts) => {\n  const rendererRegistry = ctx.get<FlowRendererRegistry>(FlowRendererRegistry);\n  const renderer = defineComponent({\n    name: 'GroupNodeRenderer',\n    props: {\n      node: {\n        type: Object as () => FlowNodeEntity,\n        required: true,\n      },\n    },\n    setup(props) {\n      return () =>\n        h(GroupRender, {\n          groupNode: props.node,\n          GroupNode: opts.components!.GroupNode,\n          GroupBoxHeader: opts.components!.GroupBoxHeader,\n        });\n    },\n  });\n  rendererRegistry.registerVueComponent(GroupRenderer.GroupRender, renderer);\n};\n","/**\n * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates\n * SPDX-License-Identifier: MIT\n */\n\nimport { IGroupPluginRegister } from '../type';\nimport { GroupsLayer } from '../groups-layer';\n\n/** 注册背景层 */\nexport const registerLayer: IGroupPluginRegister = (ctx, opts) => {\n  ctx.playground.registerLayer(GroupsLayer, opts);\n};\n","/**\n * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates\n * SPDX-License-Identifier: MIT\n */\n\nimport { h } from 'vue';\n\nimport { IPoint, PaddingSchema, Point } from '@flowgram-vue/utils';\nimport {\n  FlowGroupController,\n  FlowNodeBaseType,\n  FlowNodeRegistry,\n  FlowNodeTransformData,\n  FlowTransitionLabelEnum,\n  type FlowTransitionLine,\n  FlowTransitionLineEnum,\n} from '@flowgram-vue/document';\n\nimport { GroupRenderer, PositionConfig } from './constant';\n\nexport const GroupRegister: FlowNodeRegistry = {\n  type: FlowNodeBaseType.GROUP,\n  meta: {\n    exportJSON: true,\n    renderKey: GroupRenderer.GroupRender,\n    positionConfig: PositionConfig,\n    padding: (transform: FlowNodeTransformData): PaddingSchema => {\n      const groupController = FlowGroupController.create(transform.entity);\n      if (!groupController || groupController.collapsed || groupController.nodes.length === 0) {\n        return {\n          top: 0,\n          bottom: 0,\n          left: 0,\n          right: 0,\n        };\n      }\n      if (transform.entity.isVertical) {\n        return {\n          top: PositionConfig.paddingWithNote,\n          bottom: PositionConfig.paddingWithAddLabel,\n          left: PositionConfig.padding,\n          right: PositionConfig.padding,\n        };\n      }\n      return {\n        top: PositionConfig.paddingWithNote,\n        bottom: PositionConfig.padding,\n        left: PositionConfig.padding,\n        right: PositionConfig.paddingWithAddLabel,\n      };\n    },\n  },\n  formMeta: {\n    render: () => h('div'),\n  },\n  getLines(transition) {\n    const { transform } = transition;\n    const lines: FlowTransitionLine[] = [];\n    if (transform.firstChild) {\n      lines.push({\n        type: FlowTransitionLineEnum.STRAIGHT_LINE,\n        from: transform.inputPoint,\n        to: transform.firstChild.inputPoint,\n      });\n    }\n    if (transform.next) {\n      lines.push({\n        type: FlowTransitionLineEnum.STRAIGHT_LINE,\n        from: transform.outputPoint,\n        to: transform.next.inputPoint,\n      });\n    } else {\n      lines.push({\n        type: FlowTransitionLineEnum.STRAIGHT_LINE,\n        from: transform.outputPoint,\n        to: transform.parent!.outputPoint,\n      });\n    }\n    return lines;\n  },\n  getDelta(transform: FlowNodeTransformData): IPoint | undefined {\n    const groupController = FlowGroupController.create(transform.entity);\n    if (!groupController || groupController.collapsed) {\n      return;\n    }\n    if (transform.entity.isVertical) {\n      return {\n        x: 0,\n        y: PositionConfig.paddingWithNote,\n      };\n    }\n    return {\n      x: PositionConfig.padding,\n      y: 0,\n    };\n  },\n  getInputPoint(transform: FlowNodeTransformData): IPoint {\n    const child = transform.firstChild;\n    if (!child) return transform.defaultInputPoint;\n    if (transform.entity.isVertical) {\n      return {\n        x: child.inputPoint.x,\n        y: transform.bounds.topCenter.y,\n      };\n    }\n    return {\n      x: transform.bounds.leftCenter.x,\n      y: child.inputPoint.y,\n    };\n  },\n  getOutputPoint(transform: FlowNodeTransformData): IPoint {\n    const child = transform.lastChild;\n    if (!child) return transform.defaultOutputPoint;\n    if (transform.entity.isVertical) {\n      return {\n        x: child.outputPoint.x,\n        y: child.outputPoint.y + PositionConfig.paddingWithAddLabel / 2,\n      };\n    }\n    return {\n      x: child.outputPoint.x + PositionConfig.paddingWithAddLabel / 2,\n      y: child.outputPoint.y,\n    };\n  },\n  getLabels(transition) {\n    const { transform } = transition;\n    if (transform.next) {\n      if (transform.entity.isVertical) {\n        return [\n          {\n            offset: Point.getMiddlePoint(\n              Point.move(transform.outputPoint, {\n                x: 0,\n                y: PositionConfig.paddingWithAddLabel / 2,\n              }),\n              transform.next.inputPoint\n            ),\n            type: FlowTransitionLabelEnum.ADDER_LABEL,\n          },\n        ];\n      }\n      return [\n        {\n          offset: Point.getMiddlePoint(\n            Point.move(transform.outputPoint, { x: PositionConfig.paddingWithAddLabel / 2, y: 0 }),\n            transform.next.inputPoint\n          ),\n          type: FlowTransitionLabelEnum.ADDER_LABEL,\n        },\n      ];\n    }\n    return [\n      {\n        offset: transform.parent!.outputPoint,\n        type: FlowTransitionLabelEnum.ADDER_LABEL,\n      },\n    ];\n  },\n  getOriginDeltaY(transform): number {\n    const { children } = transform;\n    if (children.length === 0) {\n      return -transform.size.height * transform.origin.y;\n    }\n    // 这里要加上 y 轴的偏移\n    return -transform.size.height * transform.origin.y - PositionConfig.paddingWithNote;\n  },\n};\n","/**\n * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates\n * SPDX-License-Identifier: MIT\n */\n\nimport { FlowDocument } from '@flowgram-vue/document';\n\nimport { IGroupPluginRegister } from '../type';\nimport { GroupRegister } from '../group-node-register';\n\n/** 注册分组节点 */\nexport const registerGroupNode: IGroupPluginRegister = ctx => {\n  const document = ctx.get<FlowDocument>(FlowDocument);\n  document.registerFlowNodes(GroupRegister);\n};\n","/**\n * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates\n * SPDX-License-Identifier: MIT\n */\n\nimport { FlowDocument } from '@flowgram-vue/document';\nimport { FlowGroupService } from '@flowgram-vue/document';\n\nimport { IGroupPluginRegister } from '../type';\n\n/** 注册清理分组逻辑 */\nexport const registerCleanGroups: IGroupPluginRegister = (ctx, _opts) => {\n  const groupService = ctx.get<FlowGroupService>(FlowGroupService);\n  const document = ctx.get<FlowDocument>(FlowDocument);\n\n  const clearInvalidGroups = () => {\n    groupService.getAllGroups().forEach(group => {\n      if (group?.nodes.length !== 0) {\n        return;\n      }\n      if (!group.groupNode.pre) {\n        return;\n      }\n      groupService.deleteGroup(group.groupNode);\n    });\n  };\n\n  document.originTree.onTreeChange(() => {\n    setTimeout(() => {\n      clearInvalidGroups();\n    }, 0);\n  });\n};\n","/**\n * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates\n * SPDX-License-Identifier: MIT\n */\n\nimport { IGroupPluginRegister } from '../type';\nimport { GroupPluginRegister } from '../constant';\nimport { registerRender } from './register-render';\nimport { registerLayer } from './register-layer';\nimport { registerGroupNode } from './register-group-node';\nimport { registerCleanGroups } from './register-clean-groups';\n\nexport const groupRegisters: Record<GroupPluginRegister, IGroupPluginRegister> = {\n  [GroupPluginRegister.GroupNode]: registerGroupNode,\n  [GroupPluginRegister.Render]: registerRender,\n  [GroupPluginRegister.Layer]: registerLayer,\n  [GroupPluginRegister.CleanGroups]: registerCleanGroups,\n};\n","/**\n * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates\n * SPDX-License-Identifier: MIT\n */\n\nimport { definePluginCreator, PluginContext } from '@flowgram-vue/core';\n\nimport { CreateGroupPluginOptions } from './type';\nimport { groupRegisters } from './registers';\nimport { GroupPluginRegister } from './constant';\n\n/**\n * 分组插件\n */\nexport const createGroupPlugin = definePluginCreator<CreateGroupPluginOptions>({\n  onInit: (ctx: PluginContext, opts: CreateGroupPluginOptions) => {\n    const { registers: registerConfs = {} } = opts;\n    Object.entries(groupRegisters).forEach(([key, register]) => {\n      const registerName = key as GroupPluginRegister;\n      const registerConf = registerConfs[registerName];\n      if (registerConf === false) {\n        return;\n      }\n      if (typeof registerConf === 'function') {\n        registerConf(ctx, opts);\n        return;\n      }\n      register(ctx, opts);\n    });\n  },\n});\n"]}

package/dist/index.d.ts

@@ -0,0 +1 @@
+export * from '../src/index';

package/dist/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/layer-vue-provide.ts","../src/constant.ts","../src/components/group-render.vue","../src/composables/use-hover.ts","../src/components/group-box.vue","../src/groups-layer.ts","../src/registers/register-render.ts","../src/registers/register-layer.ts","../src/group-node-register.ts","../src/registers/register-group-node.ts","../src/registers/register-clean-groups.ts","../src/registers/index.ts","../src/create-group-plugin.ts"],"names":["GroupRenderer","GroupPluginRegister","_openBlock","_createBlock","_resolveDynamicComponent","_createCommentVNode","ref","onMounted","onBeforeUnmount","computed","FlowGroupController","watch","_createElementBlock","_createElementVNode","_normalizeStyle","h","FlowDocument","FlowNodeRenderData","FlowRendererRegistry","defineComponent","FlowGroupService"],"mappings":"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","file":"index.js","sourcesContent":["/**\n * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates\n * SPDX-License-Identifier: MIT\n */\n\nimport { defineComponent, h, provide, type VNodeChild } from 'vue';\nimport type { interfaces } from 'inversify';\nimport {\n  Playground,\n  PlaygroundVueContainerKey,\n  PlaygroundVueRefKey,\n  type PlaygroundContainerFactory,\n} from '@flowgram-vue/core';\n\n/**\n * 给 Layer 独立 createApp 注入 playground 容器，使子组件里的 useService / usePlayground 可用。\n */\nexport const LayerVueProvide = defineComponent({\n  name: 'LayerVueProvide',\n  props: {\n    factory: {\n      type: Object,\n      required: true,\n    },\n  },\n  setup(props) {\n    const factory = props.factory as PlaygroundContainerFactory;\n    provide(PlaygroundVueContainerKey, factory as unknown as interfaces.Container);\n    try {\n      provide(PlaygroundVueRefKey, factory.get(Playground));\n    } catch {\n      // 测试容器可能重复 bind PlaygroundConfig，此时仅 provide container\n    }\n  },\n  render() {\n    return this.$slots.default?.();\n  },\n});\n\nexport function wrapLayerRender(factory: PlaygroundContainerFactory, children: VNodeChild) {\n  return h(LayerVueProvide, { factory }, () => children);\n}\n","/**\n * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates\n * SPDX-License-Identifier: MIT\n */\n\nexport enum GroupRenderer {\n  GroupRender = 'group_render',\n  GroupBox = 'group_box',\n}\n\nexport const PositionConfig = {\n  paddingWithNote: 50, // note 留白大小\n  padding: 10, // 无 label 的 padding\n  paddingWithAddLabel: 20, // 有 label 的padding，如要放添加按钮\n  headerHeight: 20, // 基础头部高度\n};\n\nexport enum GroupPluginRegister {\n  GroupNode = 'registerGroupNode',\n  Render = 'registerRender',\n  Layer = 'registerLayer',\n  CleanGroups = 'registerCleanGroups',\n}\n","<script setup lang=\"ts\">\n/**\n * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates\n * SPDX-License-Identifier: MIT\n */\n\nimport { computed, onBeforeUnmount, onMounted, ref, watch } from 'vue';\n\nimport { delay, type Disposable, type Rectangle } from '@flowgram-vue/utils';\nimport {\n  FlowDocument,\n  FlowGroupController,\n  FlowNodeEntity,\n  FlowNodeRenderData,\n} from '@flowgram-vue/document';\nimport { useEntityFromContext, useService } from '@flowgram-vue/core';\n\nimport type { IGroupBoxHeader, IGroupNode } from '../type';\n\nconst props = defineProps<{\n  groupNode: FlowNodeEntity;\n  GroupNode: IGroupNode;\n  GroupBoxHeader: IGroupBoxHeader;\n}>();\n\nfunction useCurrentDomNode(): HTMLDivElement {\n  const entity = useEntityFromContext<FlowNodeEntity>();\n  const renderData = entity.getData<FlowNodeRenderData>(FlowNodeRenderData);\n  return renderData.node;\n}\n\nconst container = useCurrentDomNode();\nconst document = useService<FlowDocument>(FlowDocument);\nconst groupController = computed(() => FlowGroupController.create(props.groupNode));\n\nconst renderKey = ref(0);\nconst rendering = ref(true);\nconst collapsedCache = ref(groupController.value?.collapsed ?? false);\nlet disposer: Disposable | undefined;\n\nasync function rerender() {\n  rendering.value = true;\n  renderKey.value += 1;\n  await delay(50);\n  renderKey.value += 1;\n  rendering.value = false;\n}\n\nonMounted(() => {\n  disposer = document.renderTree.onTreeChange(() => {\n    if (groupController.value?.collapsed !== collapsedCache.value) {\n      collapsedCache.value = groupController.value?.collapsed ?? false;\n      void rerender();\n    }\n  });\n\n  if (groupController.value && !groupController.value.collapsed) {\n    void rerender();\n  }\n});\n\nonBeforeUnmount(() => {\n  disposer?.dispose();\n});\n\nwatch(\n  [() => groupController.value?.collapsed, rendering],\n  () => {\n    const controller = groupController.value;\n    if (!controller) {\n      return;\n    }\n    if (controller.collapsed) {\n      Object.assign(container.style, {\n        display: 'block',\n        zIndex: '0',\n        width: 'auto',\n        height: 'auto',\n      });\n      return;\n    }\n    if (!rendering.value) {\n      const bounds: Rectangle = controller.bounds;\n      Object.assign(container.style, {\n        width: `${bounds.width}px`,\n      });\n    }\n  },\n  { immediate: true }\n);\n</script>\n\n<template>\n  <component\n    :is=\"GroupNode\"\n    v-if=\"groupController && groupController.collapsed\"\n    :key=\"renderKey\"\n    :group-node=\"groupNode\"\n    :group-controller=\"groupController\"\n  />\n  <component\n    :is=\"GroupBoxHeader\"\n    v-else-if=\"groupController && !rendering\"\n    :key=\"renderKey\"\n    :group-controller=\"groupController\"\n    :group-node=\"groupNode\"\n  />\n</template>\n","/**\n * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates\n * SPDX-License-Identifier: MIT\n */\n\nimport { onBeforeUnmount, onMounted, ref } from 'vue';\n\nexport function useHover() {\n  const elRef = ref<HTMLDivElement | null>(null);\n  const hover = ref(false);\n\n  const checkMouseOver = (event: MouseEvent) => {\n    if (!elRef.value) {\n      return;\n    }\n    const { left, top, right, bottom } = elRef.value.getBoundingClientRect();\n    const isOver =\n      event.clientX >= left &&\n      event.clientX <= right &&\n      event.clientY >= top &&\n      event.clientY <= bottom;\n\n    hover.value = isOver;\n  };\n\n  onMounted(() => {\n    window.addEventListener('mousemove', checkMouseOver);\n  });\n\n  onBeforeUnmount(() => {\n    window.removeEventListener('mousemove', checkMouseOver);\n  });\n\n  return {\n    hover,\n    elRef,\n  };\n}\n","<script setup lang=\"ts\">\n/**\n * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates\n * SPDX-License-Identifier: MIT\n */\n\nimport { computed, watch, type CSSProperties } from 'vue';\n\nimport type { Rectangle } from '@flowgram-vue/utils';\nimport { FlowGroupController, type FlowNodeEntity } from '@flowgram-vue/document';\n\nimport { useHover } from '../composables/use-hover';\n\nconst props = defineProps<{\n  groupNode: FlowNodeEntity;\n  backgroundStyle?: (groupController: FlowGroupController) => CSSProperties;\n}>();\n\nconst groupController = computed(() => FlowGroupController.create(props.groupNode));\nconst { hover, elRef } = useHover();\n\nconst positionStyle = computed<CSSProperties>(() => {\n  const bounds: Rectangle | undefined = groupController.value?.bounds;\n  if (!bounds) {\n    return {};\n  }\n  return {\n    position: 'absolute',\n    left: bounds.left,\n    top: bounds.top,\n    width: bounds.width,\n    height: bounds.height,\n  };\n});\n\nconst defaultBackgroundStyle = computed<CSSProperties>(() => ({\n  borderRadius: 10,\n  zIndex: -1,\n  outline: `${hover.value ? 2 : 1}px solid rgb(97, 69, 211)`,\n  backgroundColor: 'rgb(236 233 247)',\n}));\n\nconst backgroundStyle = computed(() =>\n  props.backgroundStyle && groupController.value\n    ? props.backgroundStyle(groupController.value)\n    : defaultBackgroundStyle.value\n);\n\nwatch(hover, (value) => {\n  if (groupController.value) {\n    groupController.value.hovered = value;\n  }\n});\n</script>\n\n<template>\n  <div\n    v-if=\"groupController && !groupController.collapsed\"\n    class=\"gedit-group-box\"\n    :data-group-id=\"groupNode.id\"\n  >\n    <div\n      ref=\"elRef\"\n      class=\"gedit-group-background\"\n      :style=\"{ ...positionStyle, ...backgroundStyle }\"\n    />\n  </div>\n</template>\n","/**\n * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates\n * SPDX-License-Identifier: MIT\n */\n\nimport { Fragment, h, type Component } from 'vue';\nimport { inject, injectable } from 'inversify';\nimport { FlowRendererRegistry } from '@flowgram-vue/renderer';\nimport {\n  FlowDocument,\n  FlowDocumentTransformerEntity,\n  FlowGroupController,\n  FlowGroupService,\n  FlowNodeEntity,\n  FlowNodeRenderData,\n  FlowNodeTransformData,\n} from '@flowgram-vue/document';\nimport { Layer, observeEntity, observeEntityDatas, PlaygroundContainerFactory } from '@flowgram-vue/core';\nimport { domUtils } from '@flowgram-vue/utils';\n\nimport { wrapLayerRender } from './layer-vue-provide';\nimport { GroupsLayerOptions, IGroupBox } from './type';\nimport { GroupRenderer } from './constant';\nimport { GroupBox } from './components';\n\n@injectable()\nexport class GroupsLayer extends Layer<GroupsLayerOptions> {\n  public readonly node: HTMLElement;\n\n  @inject(FlowDocument) protected document: FlowDocument;\n\n  @inject(FlowRendererRegistry)\n  protected readonly rendererRegistry: FlowRendererRegistry;\n\n  @inject(FlowGroupService)\n  protected readonly groupService: FlowGroupService;\n\n  @inject(PlaygroundContainerFactory)\n  protected readonly playgroundContainer: PlaygroundContainerFactory;\n\n  @observeEntity(FlowDocumentTransformerEntity)\n  readonly documentTransformer: FlowDocumentTransformerEntity;\n\n  @observeEntityDatas(FlowNodeEntity, FlowNodeRenderData) _renderStates: FlowNodeRenderData[];\n\n  @observeEntityDatas(FlowNodeEntity, FlowNodeTransformData) _transforms: FlowNodeTransformData[];\n\n  private readonly className = 'gedit-groups-layer';\n\n  constructor() {\n    super();\n    this.node = domUtils.createDivWithClass(this.className);\n    this.node.style.zIndex = '0';\n  }\n\n  /** 缩放 */\n  public onZoom(scale: number): void {\n    this.node!.style.transform = `scale(${scale})`;\n  }\n\n  public render() {\n    if (this.documentTransformer.loading) return null;\n    this.documentTransformer.refresh();\n\n    return wrapLayerRender(this.playgroundContainer, this.renderGroups());\n  }\n\n  /** 渲染分组 */\n  protected renderGroups() {\n    const Box = (this.renderer || GroupBox) as Component;\n    return h(\n      Fragment,\n      null,\n      this.groups.map((group) =>\n        h(Box, {\n          key: group.groupNode.id,\n          groupNode: group.groupNode,\n          backgroundStyle: this.options.groupBoxStyle,\n        })\n      )\n    );\n  }\n\n  /** 所有分组 */\n  protected get groups(): FlowGroupController[] {\n    return this.groupService.getAllGroups();\n  }\n\n  protected get renderer(): IGroupBox | undefined {\n    return this.rendererRegistry.tryToGetRendererComponent(GroupRenderer.GroupBox)\n      ?.renderer as IGroupBox | undefined;\n  }\n}\n","/**\n * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates\n * SPDX-License-Identifier: MIT\n */\n\nimport { defineComponent, h } from 'vue';\n\nimport { FlowRendererRegistry } from '@flowgram-vue/renderer';\nimport { FlowNodeEntity } from '@flowgram-vue/document';\n\nimport { IGroupPluginRegister } from '../type';\nimport { GroupRenderer } from '../constant';\nimport { GroupRender } from '../components';\n\n/** 注册渲染组件 */\nexport const registerRender: IGroupPluginRegister = (ctx, opts) => {\n  const rendererRegistry = ctx.get<FlowRendererRegistry>(FlowRendererRegistry);\n  const renderer = defineComponent({\n    name: 'GroupNodeRenderer',\n    props: {\n      node: {\n        type: Object as () => FlowNodeEntity,\n        required: true,\n      },\n    },\n    setup(props) {\n      return () =>\n        h(GroupRender, {\n          groupNode: props.node,\n          GroupNode: opts.components!.GroupNode,\n          GroupBoxHeader: opts.components!.GroupBoxHeader,\n        });\n    },\n  });\n  rendererRegistry.registerVueComponent(GroupRenderer.GroupRender, renderer);\n};\n","/**\n * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates\n * SPDX-License-Identifier: MIT\n */\n\nimport { IGroupPluginRegister } from '../type';\nimport { GroupsLayer } from '../groups-layer';\n\n/** 注册背景层 */\nexport const registerLayer: IGroupPluginRegister = (ctx, opts) => {\n  ctx.playground.registerLayer(GroupsLayer, opts);\n};\n","/**\n * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates\n * SPDX-License-Identifier: MIT\n */\n\nimport { h } from 'vue';\n\nimport { IPoint, PaddingSchema, Point } from '@flowgram-vue/utils';\nimport {\n  FlowGroupController,\n  FlowNodeBaseType,\n  FlowNodeRegistry,\n  FlowNodeTransformData,\n  FlowTransitionLabelEnum,\n  type FlowTransitionLine,\n  FlowTransitionLineEnum,\n} from '@flowgram-vue/document';\n\nimport { GroupRenderer, PositionConfig } from './constant';\n\nexport const GroupRegister: FlowNodeRegistry = {\n  type: FlowNodeBaseType.GROUP,\n  meta: {\n    exportJSON: true,\n    renderKey: GroupRenderer.GroupRender,\n    positionConfig: PositionConfig,\n    padding: (transform: FlowNodeTransformData): PaddingSchema => {\n      const groupController = FlowGroupController.create(transform.entity);\n      if (!groupController || groupController.collapsed || groupController.nodes.length === 0) {\n        return {\n          top: 0,\n          bottom: 0,\n          left: 0,\n          right: 0,\n        };\n      }\n      if (transform.entity.isVertical) {\n        return {\n          top: PositionConfig.paddingWithNote,\n          bottom: PositionConfig.paddingWithAddLabel,\n          left: PositionConfig.padding,\n          right: PositionConfig.padding,\n        };\n      }\n      return {\n        top: PositionConfig.paddingWithNote,\n        bottom: PositionConfig.padding,\n        left: PositionConfig.padding,\n        right: PositionConfig.paddingWithAddLabel,\n      };\n    },\n  },\n  formMeta: {\n    render: () => h('div'),\n  },\n  getLines(transition) {\n    const { transform } = transition;\n    const lines: FlowTransitionLine[] = [];\n    if (transform.firstChild) {\n      lines.push({\n        type: FlowTransitionLineEnum.STRAIGHT_LINE,\n        from: transform.inputPoint,\n        to: transform.firstChild.inputPoint,\n      });\n    }\n    if (transform.next) {\n      lines.push({\n        type: FlowTransitionLineEnum.STRAIGHT_LINE,\n        from: transform.outputPoint,\n        to: transform.next.inputPoint,\n      });\n    } else {\n      lines.push({\n        type: FlowTransitionLineEnum.STRAIGHT_LINE,\n        from: transform.outputPoint,\n        to: transform.parent!.outputPoint,\n      });\n    }\n    return lines;\n  },\n  getDelta(transform: FlowNodeTransformData): IPoint | undefined {\n    const groupController = FlowGroupController.create(transform.entity);\n    if (!groupController || groupController.collapsed) {\n      return;\n    }\n    if (transform.entity.isVertical) {\n      return {\n        x: 0,\n        y: PositionConfig.paddingWithNote,\n      };\n    }\n    return {\n      x: PositionConfig.padding,\n      y: 0,\n    };\n  },\n  getInputPoint(transform: FlowNodeTransformData): IPoint {\n    const child = transform.firstChild;\n    if (!child) return transform.defaultInputPoint;\n    if (transform.entity.isVertical) {\n      return {\n        x: child.inputPoint.x,\n        y: transform.bounds.topCenter.y,\n      };\n    }\n    return {\n      x: transform.bounds.leftCenter.x,\n      y: child.inputPoint.y,\n    };\n  },\n  getOutputPoint(transform: FlowNodeTransformData): IPoint {\n    const child = transform.lastChild;\n    if (!child) return transform.defaultOutputPoint;\n    if (transform.entity.isVertical) {\n      return {\n        x: child.outputPoint.x,\n        y: child.outputPoint.y + PositionConfig.paddingWithAddLabel / 2,\n      };\n    }\n    return {\n      x: child.outputPoint.x + PositionConfig.paddingWithAddLabel / 2,\n      y: child.outputPoint.y,\n    };\n  },\n  getLabels(transition) {\n    const { transform } = transition;\n    if (transform.next) {\n      if (transform.entity.isVertical) {\n        return [\n          {\n            offset: Point.getMiddlePoint(\n              Point.move(transform.outputPoint, {\n                x: 0,\n                y: PositionConfig.paddingWithAddLabel / 2,\n              }),\n              transform.next.inputPoint\n            ),\n            type: FlowTransitionLabelEnum.ADDER_LABEL,\n          },\n        ];\n      }\n      return [\n        {\n          offset: Point.getMiddlePoint(\n            Point.move(transform.outputPoint, { x: PositionConfig.paddingWithAddLabel / 2, y: 0 }),\n            transform.next.inputPoint\n          ),\n          type: FlowTransitionLabelEnum.ADDER_LABEL,\n        },\n      ];\n    }\n    return [\n      {\n        offset: transform.parent!.outputPoint,\n        type: FlowTransitionLabelEnum.ADDER_LABEL,\n      },\n    ];\n  },\n  getOriginDeltaY(transform): number {\n    const { children } = transform;\n    if (children.length === 0) {\n      return -transform.size.height * transform.origin.y;\n    }\n    // 这里要加上 y 轴的偏移\n    return -transform.size.height * transform.origin.y - PositionConfig.paddingWithNote;\n  },\n};\n","/**\n * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates\n * SPDX-License-Identifier: MIT\n */\n\nimport { FlowDocument } from '@flowgram-vue/document';\n\nimport { IGroupPluginRegister } from '../type';\nimport { GroupRegister } from '../group-node-register';\n\n/** 注册分组节点 */\nexport const registerGroupNode: IGroupPluginRegister = ctx => {\n  const document = ctx.get<FlowDocument>(FlowDocument);\n  document.registerFlowNodes(GroupRegister);\n};\n","/**\n * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates\n * SPDX-License-Identifier: MIT\n */\n\nimport { FlowDocument } from '@flowgram-vue/document';\nimport { FlowGroupService } from '@flowgram-vue/document';\n\nimport { IGroupPluginRegister } from '../type';\n\n/** 注册清理分组逻辑 */\nexport const registerCleanGroups: IGroupPluginRegister = (ctx, _opts) => {\n  const groupService = ctx.get<FlowGroupService>(FlowGroupService);\n  const document = ctx.get<FlowDocument>(FlowDocument);\n\n  const clearInvalidGroups = () => {\n    groupService.getAllGroups().forEach(group => {\n      if (group?.nodes.length !== 0) {\n        return;\n      }\n      if (!group.groupNode.pre) {\n        return;\n      }\n      groupService.deleteGroup(group.groupNode);\n    });\n  };\n\n  document.originTree.onTreeChange(() => {\n    setTimeout(() => {\n      clearInvalidGroups();\n    }, 0);\n  });\n};\n","/**\n * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates\n * SPDX-License-Identifier: MIT\n */\n\nimport { IGroupPluginRegister } from '../type';\nimport { GroupPluginRegister } from '../constant';\nimport { registerRender } from './register-render';\nimport { registerLayer } from './register-layer';\nimport { registerGroupNode } from './register-group-node';\nimport { registerCleanGroups } from './register-clean-groups';\n\nexport const groupRegisters: Record<GroupPluginRegister, IGroupPluginRegister> = {\n  [GroupPluginRegister.GroupNode]: registerGroupNode,\n  [GroupPluginRegister.Render]: registerRender,\n  [GroupPluginRegister.Layer]: registerLayer,\n  [GroupPluginRegister.CleanGroups]: registerCleanGroups,\n};\n","/**\n * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates\n * SPDX-License-Identifier: MIT\n */\n\nimport { definePluginCreator, PluginContext } from '@flowgram-vue/core';\n\nimport { CreateGroupPluginOptions } from './type';\nimport { groupRegisters } from './registers';\nimport { GroupPluginRegister } from './constant';\n\n/**\n * 分组插件\n */\nexport const createGroupPlugin = definePluginCreator<CreateGroupPluginOptions>({\n  onInit: (ctx: PluginContext, opts: CreateGroupPluginOptions) => {\n    const { registers: registerConfs = {} } = opts;\n    Object.entries(groupRegisters).forEach(([key, register]) => {\n      const registerName = key as GroupPluginRegister;\n      const registerConf = registerConfs[registerName];\n      if (registerConf === false) {\n        return;\n      }\n      if (typeof registerConf === 'function') {\n        registerConf(ctx, opts);\n        return;\n      }\n      register(ctx, opts);\n    });\n  },\n});\n"]}

package/package.json

@@ -0,0 +1,61 @@
+{
+  "name": "@flowgram-vue/group-plugin",
+  "version": "0.2.0",
+  "type": "module",
+  "homepage": "https://flowgram.ai/",
+  "repository": "https://github.com/Crayon-hua/flowgram-vue",
+  "license": "MIT",
+  "exports": {
+    ".": {
+      "types": "./dist/index.d.ts",
+      "import": "./dist/index.js",
+      "require": "./dist/index.cjs"
+    }
+  },
+  "main": "./dist/index.cjs",
+  "module": "./dist/index.js",
+  "types": "./dist/index.d.ts",
+  "files": [
+    "src",
+    "dist"
+  ],
+  "dependencies": {
+    "inversify": "^6.0.1",
+    "reflect-metadata": "~0.2.2",
+    "@flowgram-vue/core": "0.2.0",
+    "@flowgram-vue/renderer": "0.2.0",
+    "@flowgram-vue/utils": "0.2.0",
+    "@flowgram-vue/document": "0.2.0"
+  },
+  "peerDependencies": {
+    "vue": "^3.3.0"
+  },
+  "devDependencies": {
+    "@types/node": "^20",
+    "@vitejs/plugin-vue": "^6.0.1",
+    "@vitest/coverage-v8": "^3.2.4",
+    "@vue/test-utils": "^2.4.6",
+    "eslint": "^9.0.0",
+    "jsdom": "^26.1.0",
+    "typescript": "^5.8.3",
+    "vitest": "^3.2.4",
+    "vue": "^3.5.18",
+    "@flowgram-vue/build-config": "0.2.0",
+    "@flowgram-vue/eslint-config": "0.2.0",
+    "@flowgram-vue/ts-config": "0.2.0"
+  },
+  "publishConfig": {
+    "access": "public",
+    "registry": "https://registry.npmjs.org/"
+  },
+  "scripts": {
+    "build": "flowgram-build",
+    "test": "vitest run --passWithNoTests",
+    "test:cov": "vitest run --coverage --passWithNoTests",
+    "lint": "eslint .",
+    "ts-check": "tsc --noEmit",
+    "type-check": "tsc --noEmit",
+    "build:fast": "flowgram-build --fast",
+    "build:watch": "flowgram-build --watch"
+  }
+}

package/src/components/group-box.vue

@@ -0,0 +1,68 @@
+<script setup lang="ts">
+/**
+ * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates
+ * SPDX-License-Identifier: MIT
+ */
+
+import { computed, watch, type CSSProperties } from 'vue';
+
+import type { Rectangle } from '@flowgram-vue/utils';
+import { FlowGroupController, type FlowNodeEntity } from '@flowgram-vue/document';
+
+import { useHover } from '../composables/use-hover';
+
+const props = defineProps<{
+  groupNode: FlowNodeEntity;
+  backgroundStyle?: (groupController: FlowGroupController) => CSSProperties;
+}>();
+
+const groupController = computed(() => FlowGroupController.create(props.groupNode));
+const { hover, elRef } = useHover();
+
+const positionStyle = computed<CSSProperties>(() => {
+  const bounds: Rectangle | undefined = groupController.value?.bounds;
+  if (!bounds) {
+    return {};
+  }
+  return {
+    position: 'absolute',
+    left: bounds.left,
+    top: bounds.top,
+    width: bounds.width,
+    height: bounds.height,
+  };
+});
+
+const defaultBackgroundStyle = computed<CSSProperties>(() => ({
+  borderRadius: 10,
+  zIndex: -1,
+  outline: `${hover.value ? 2 : 1}px solid rgb(97, 69, 211)`,
+  backgroundColor: 'rgb(236 233 247)',
+}));
+
+const backgroundStyle = computed(() =>
+  props.backgroundStyle && groupController.value
+    ? props.backgroundStyle(groupController.value)
+    : defaultBackgroundStyle.value
+);
+
+watch(hover, (value) => {
+  if (groupController.value) {
+    groupController.value.hovered = value;
+  }
+});
+</script>
+
+<template>
+  <div
+    v-if="groupController && !groupController.collapsed"
+    class="gedit-group-box"
+    :data-group-id="groupNode.id"
+  >
+    <div
+      ref="elRef"
+      class="gedit-group-background"
+      :style="{ ...positionStyle, ...backgroundStyle }"
+    />
+  </div>
+</template>

package/src/components/group-render.vue

@@ -0,0 +1,108 @@
+<script setup lang="ts">
+/**
+ * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates
+ * SPDX-License-Identifier: MIT
+ */
+
+import { computed, onBeforeUnmount, onMounted, ref, watch } from 'vue';
+
+import { delay, type Disposable, type Rectangle } from '@flowgram-vue/utils';
+import {
+  FlowDocument,
+  FlowGroupController,
+  FlowNodeEntity,
+  FlowNodeRenderData,
+} from '@flowgram-vue/document';
+import { useEntityFromContext, useService } from '@flowgram-vue/core';
+
+import type { IGroupBoxHeader, IGroupNode } from '../type';
+
+const props = defineProps<{
+  groupNode: FlowNodeEntity;
+  GroupNode: IGroupNode;
+  GroupBoxHeader: IGroupBoxHeader;
+}>();
+
+function useCurrentDomNode(): HTMLDivElement {
+  const entity = useEntityFromContext<FlowNodeEntity>();
+  const renderData = entity.getData<FlowNodeRenderData>(FlowNodeRenderData);
+  return renderData.node;
+}
+
+const container = useCurrentDomNode();
+const document = useService<FlowDocument>(FlowDocument);
+const groupController = computed(() => FlowGroupController.create(props.groupNode));
+
+const renderKey = ref(0);
+const rendering = ref(true);
+const collapsedCache = ref(groupController.value?.collapsed ?? false);
+let disposer: Disposable | undefined;
+
+async function rerender() {
+  rendering.value = true;
+  renderKey.value += 1;
+  await delay(50);
+  renderKey.value += 1;
+  rendering.value = false;
+}
+
+onMounted(() => {
+  disposer = document.renderTree.onTreeChange(() => {
+    if (groupController.value?.collapsed !== collapsedCache.value) {
+      collapsedCache.value = groupController.value?.collapsed ?? false;
+      void rerender();
+    }
+  });
+
+  if (groupController.value && !groupController.value.collapsed) {
+    void rerender();
+  }
+});
+
+onBeforeUnmount(() => {
+  disposer?.dispose();
+});
+
+watch(
+  [() => groupController.value?.collapsed, rendering],
+  () => {
+    const controller = groupController.value;
+    if (!controller) {
+      return;
+    }
+    if (controller.collapsed) {
+      Object.assign(container.style, {
+        display: 'block',
+        zIndex: '0',
+        width: 'auto',
+        height: 'auto',
+      });
+      return;
+    }
+    if (!rendering.value) {
+      const bounds: Rectangle = controller.bounds;
+      Object.assign(container.style, {
+        width: `${bounds.width}px`,
+      });
+    }
+  },
+  { immediate: true }
+);
+</script>
+
+<template>
+  <component
+    :is="GroupNode"
+    v-if="groupController && groupController.collapsed"
+    :key="renderKey"
+    :group-node="groupNode"
+    :group-controller="groupController"
+  />
+  <component
+    :is="GroupBoxHeader"
+    v-else-if="groupController && !rendering"
+    :key="renderKey"
+    :group-controller="groupController"
+    :group-node="groupNode"
+  />
+</template>

package/src/components/index.ts

@@ -0,0 +1,7 @@
+/**
+ * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates
+ * SPDX-License-Identifier: MIT
+ */
+
+export { default as GroupRender } from './group-render.vue';
+export { default as GroupBox } from './group-box.vue';

package/src/composables/use-hover.ts

@@ -0,0 +1,38 @@
+/**
+ * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates
+ * SPDX-License-Identifier: MIT
+ */
+
+import { onBeforeUnmount, onMounted, ref } from 'vue';
+
+export function useHover() {
+  const elRef = ref<HTMLDivElement | null>(null);
+  const hover = ref(false);
+
+  const checkMouseOver = (event: MouseEvent) => {
+    if (!elRef.value) {
+      return;
+    }
+    const { left, top, right, bottom } = elRef.value.getBoundingClientRect();
+    const isOver =
+      event.clientX >= left &&
+      event.clientX <= right &&
+      event.clientY >= top &&
+      event.clientY <= bottom;
+
+    hover.value = isOver;
+  };
+
+  onMounted(() => {
+    window.addEventListener('mousemove', checkMouseOver);
+  });
+
+  onBeforeUnmount(() => {
+    window.removeEventListener('mousemove', checkMouseOver);
+  });
+
+  return {
+    hover,
+    elRef,
+  };
+}

package/src/constant.ts

@@ -0,0 +1,23 @@
+/**
+ * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates
+ * SPDX-License-Identifier: MIT
+ */
+
+export enum GroupRenderer {
+  GroupRender = 'group_render',
+  GroupBox = 'group_box',
+}
+
+export const PositionConfig = {
+  paddingWithNote: 50, // note 留白大小
+  padding: 10, // 无 label 的 padding
+  paddingWithAddLabel: 20, // 有 label 的padding，如要放添加按钮
+  headerHeight: 20, // 基础头部高度
+};
+
+export enum GroupPluginRegister {
+  GroupNode = 'registerGroupNode',
+  Render = 'registerRender',
+  Layer = 'registerLayer',
+  CleanGroups = 'registerCleanGroups',
+}

package/src/create-group-plugin.ts

@@ -0,0 +1,31 @@
+/**
+ * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates
+ * SPDX-License-Identifier: MIT
+ */
+
+import { definePluginCreator, PluginContext } from '@flowgram-vue/core';
+
+import { CreateGroupPluginOptions } from './type';
+import { groupRegisters } from './registers';
+import { GroupPluginRegister } from './constant';
+
+/**
+ * 分组插件
+ */
+export const createGroupPlugin = definePluginCreator<CreateGroupPluginOptions>({
+  onInit: (ctx: PluginContext, opts: CreateGroupPluginOptions) => {
+    const { registers: registerConfs = {} } = opts;
+    Object.entries(groupRegisters).forEach(([key, register]) => {
+      const registerName = key as GroupPluginRegister;
+      const registerConf = registerConfs[registerName];
+      if (registerConf === false) {
+        return;
+      }
+      if (typeof registerConf === 'function') {
+        registerConf(ctx, opts);
+        return;
+      }
+      register(ctx, opts);
+    });
+  },
+});

package/src/env.d.ts

@@ -0,0 +1,10 @@
+/**
+ * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates
+ * SPDX-License-Identifier: MIT
+ */
+
+declare module '*.vue' {
+  import type { DefineComponent } from 'vue';
+  const component: DefineComponent<object, object, unknown>;
+  export default component;
+}

package/src/group-node-register.ts

@@ -0,0 +1,167 @@
+/**
+ * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates
+ * SPDX-License-Identifier: MIT
+ */
+
+import { h } from 'vue';
+
+import { IPoint, PaddingSchema, Point } from '@flowgram-vue/utils';
+import {
+  FlowGroupController,
+  FlowNodeBaseType,
+  FlowNodeRegistry,
+  FlowNodeTransformData,
+  FlowTransitionLabelEnum,
+  type FlowTransitionLine,
+  FlowTransitionLineEnum,
+} from '@flowgram-vue/document';
+
+import { GroupRenderer, PositionConfig } from './constant';
+
+export const GroupRegister: FlowNodeRegistry = {
+  type: FlowNodeBaseType.GROUP,
+  meta: {
+    exportJSON: true,
+    renderKey: GroupRenderer.GroupRender,
+    positionConfig: PositionConfig,
+    padding: (transform: FlowNodeTransformData): PaddingSchema => {
+      const groupController = FlowGroupController.create(transform.entity);
+      if (!groupController || groupController.collapsed || groupController.nodes.length === 0) {
+        return {
+          top: 0,
+          bottom: 0,
+          left: 0,
+          right: 0,
+        };
+      }
+      if (transform.entity.isVertical) {
+        return {
+          top: PositionConfig.paddingWithNote,
+          bottom: PositionConfig.paddingWithAddLabel,
+          left: PositionConfig.padding,
+          right: PositionConfig.padding,
+        };
+      }
+      return {
+        top: PositionConfig.paddingWithNote,
+        bottom: PositionConfig.padding,
+        left: PositionConfig.padding,
+        right: PositionConfig.paddingWithAddLabel,
+      };
+    },
+  },
+  formMeta: {
+    render: () => h('div'),
+  },
+  getLines(transition) {
+    const { transform } = transition;
+    const lines: FlowTransitionLine[] = [];
+    if (transform.firstChild) {
+      lines.push({
+        type: FlowTransitionLineEnum.STRAIGHT_LINE,
+        from: transform.inputPoint,
+        to: transform.firstChild.inputPoint,
+      });
+    }
+    if (transform.next) {
+      lines.push({
+        type: FlowTransitionLineEnum.STRAIGHT_LINE,
+        from: transform.outputPoint,
+        to: transform.next.inputPoint,
+      });
+    } else {
+      lines.push({
+        type: FlowTransitionLineEnum.STRAIGHT_LINE,
+        from: transform.outputPoint,
+        to: transform.parent!.outputPoint,
+      });
+    }
+    return lines;
+  },
+  getDelta(transform: FlowNodeTransformData): IPoint | undefined {
+    const groupController = FlowGroupController.create(transform.entity);
+    if (!groupController || groupController.collapsed) {
+      return;
+    }
+    if (transform.entity.isVertical) {
+      return {
+        x: 0,
+        y: PositionConfig.paddingWithNote,
+      };
+    }
+    return {
+      x: PositionConfig.padding,
+      y: 0,
+    };
+  },
+  getInputPoint(transform: FlowNodeTransformData): IPoint {
+    const child = transform.firstChild;
+    if (!child) return transform.defaultInputPoint;
+    if (transform.entity.isVertical) {
+      return {
+        x: child.inputPoint.x,
+        y: transform.bounds.topCenter.y,
+      };
+    }
+    return {
+      x: transform.bounds.leftCenter.x,
+      y: child.inputPoint.y,
+    };
+  },
+  getOutputPoint(transform: FlowNodeTransformData): IPoint {
+    const child = transform.lastChild;
+    if (!child) return transform.defaultOutputPoint;
+    if (transform.entity.isVertical) {
+      return {
+        x: child.outputPoint.x,
+        y: child.outputPoint.y + PositionConfig.paddingWithAddLabel / 2,
+      };
+    }
+    return {
+      x: child.outputPoint.x + PositionConfig.paddingWithAddLabel / 2,
+      y: child.outputPoint.y,
+    };
+  },
+  getLabels(transition) {
+    const { transform } = transition;
+    if (transform.next) {
+      if (transform.entity.isVertical) {
+        return [
+          {
+            offset: Point.getMiddlePoint(
+              Point.move(transform.outputPoint, {
+                x: 0,
+                y: PositionConfig.paddingWithAddLabel / 2,
+              }),
+              transform.next.inputPoint
+            ),
+            type: FlowTransitionLabelEnum.ADDER_LABEL,
+          },
+        ];
+      }
+      return [
+        {
+          offset: Point.getMiddlePoint(
+            Point.move(transform.outputPoint, { x: PositionConfig.paddingWithAddLabel / 2, y: 0 }),
+            transform.next.inputPoint
+          ),
+          type: FlowTransitionLabelEnum.ADDER_LABEL,
+        },
+      ];
+    }
+    return [
+      {
+        offset: transform.parent!.outputPoint,
+        type: FlowTransitionLabelEnum.ADDER_LABEL,
+      },
+    ];
+  },
+  getOriginDeltaY(transform): number {
+    const { children } = transform;
+    if (children.length === 0) {
+      return -transform.size.height * transform.origin.y;
+    }
+    // 这里要加上 y 轴的偏移
+    return -transform.size.height * transform.origin.y - PositionConfig.paddingWithNote;
+  },
+};

package/src/groups-layer.ts

@@ -0,0 +1,93 @@
+/**
+ * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates
+ * SPDX-License-Identifier: MIT
+ */
+
+import { Fragment, h, type Component } from 'vue';
+import { inject, injectable } from 'inversify';
+import { FlowRendererRegistry } from '@flowgram-vue/renderer';
+import {
+  FlowDocument,
+  FlowDocumentTransformerEntity,
+  FlowGroupController,
+  FlowGroupService,
+  FlowNodeEntity,
+  FlowNodeRenderData,
+  FlowNodeTransformData,
+} from '@flowgram-vue/document';
+import { Layer, observeEntity, observeEntityDatas, PlaygroundContainerFactory } from '@flowgram-vue/core';
+import { domUtils } from '@flowgram-vue/utils';
+
+import { wrapLayerRender } from './layer-vue-provide';
+import { GroupsLayerOptions, IGroupBox } from './type';
+import { GroupRenderer } from './constant';
+import { GroupBox } from './components';
+
+@injectable()
+export class GroupsLayer extends Layer<GroupsLayerOptions> {
+  public readonly node: HTMLElement;
+
+  @inject(FlowDocument) protected document: FlowDocument;
+
+  @inject(FlowRendererRegistry)
+  protected readonly rendererRegistry: FlowRendererRegistry;
+
+  @inject(FlowGroupService)
+  protected readonly groupService: FlowGroupService;
+
+  @inject(PlaygroundContainerFactory)
+  protected readonly playgroundContainer: PlaygroundContainerFactory;
+
+  @observeEntity(FlowDocumentTransformerEntity)
+  readonly documentTransformer: FlowDocumentTransformerEntity;
+
+  @observeEntityDatas(FlowNodeEntity, FlowNodeRenderData) _renderStates: FlowNodeRenderData[];
+
+  @observeEntityDatas(FlowNodeEntity, FlowNodeTransformData) _transforms: FlowNodeTransformData[];
+
+  private readonly className = 'gedit-groups-layer';
+
+  constructor() {
+    super();
+    this.node = domUtils.createDivWithClass(this.className);
+    this.node.style.zIndex = '0';
+  }
+
+  /** 缩放 */
+  public onZoom(scale: number): void {
+    this.node!.style.transform = `scale(${scale})`;
+  }
+
+  public render() {
+    if (this.documentTransformer.loading) return null;
+    this.documentTransformer.refresh();
+
+    return wrapLayerRender(this.playgroundContainer, this.renderGroups());
+  }
+
+  /** 渲染分组 */
+  protected renderGroups() {
+    const Box = (this.renderer || GroupBox) as Component;
+    return h(
+      Fragment,
+      null,
+      this.groups.map((group) =>
+        h(Box, {
+          key: group.groupNode.id,
+          groupNode: group.groupNode,
+          backgroundStyle: this.options.groupBoxStyle,
+        })
+      )
+    );
+  }
+
+  /** 所有分组 */
+  protected get groups(): FlowGroupController[] {
+    return this.groupService.getAllGroups();
+  }
+
+  protected get renderer(): IGroupBox | undefined {
+    return this.rendererRegistry.tryToGetRendererComponent(GroupRenderer.GroupBox)
+      ?.renderer as IGroupBox | undefined;
+  }
+}

package/src/index.ts

@@ -0,0 +1,12 @@
+/**
+ * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates
+ * SPDX-License-Identifier: MIT
+ */
+
+export { FlowGroupController } from '@flowgram-vue/document';
+export * from './groups-layer';
+export * from './create-group-plugin';
+export * from './type';
+export * from './constant';
+export * from './group-node-register';
+export * from './components';

package/src/layer-vue-provide.ts

@@ -0,0 +1,42 @@
+/**
+ * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates
+ * SPDX-License-Identifier: MIT
+ */
+
+import { defineComponent, h, provide, type VNodeChild } from 'vue';
+import type { interfaces } from 'inversify';
+import {
+  Playground,
+  PlaygroundVueContainerKey,
+  PlaygroundVueRefKey,
+  type PlaygroundContainerFactory,
+} from '@flowgram-vue/core';
+
+/**
+ * 给 Layer 独立 createApp 注入 playground 容器，使子组件里的 useService / usePlayground 可用。
+ */
+export const LayerVueProvide = defineComponent({
+  name: 'LayerVueProvide',
+  props: {
+    factory: {
+      type: Object,
+      required: true,
+    },
+  },
+  setup(props) {
+    const factory = props.factory as PlaygroundContainerFactory;
+    provide(PlaygroundVueContainerKey, factory as unknown as interfaces.Container);
+    try {
+      provide(PlaygroundVueRefKey, factory.get(Playground));
+    } catch {
+      // 测试容器可能重复 bind PlaygroundConfig，此时仅 provide container
+    }
+  },
+  render() {
+    return this.$slots.default?.();
+  },
+});
+
+export function wrapLayerRender(factory: PlaygroundContainerFactory, children: VNodeChild) {
+  return h(LayerVueProvide, { factory }, () => children);
+}

package/src/registers/index.ts

@@ -0,0 +1,18 @@
+/**
+ * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates
+ * SPDX-License-Identifier: MIT
+ */
+
+import { IGroupPluginRegister } from '../type';
+import { GroupPluginRegister } from '../constant';
+import { registerRender } from './register-render';
+import { registerLayer } from './register-layer';
+import { registerGroupNode } from './register-group-node';
+import { registerCleanGroups } from './register-clean-groups';
+
+export const groupRegisters: Record<GroupPluginRegister, IGroupPluginRegister> = {
+  [GroupPluginRegister.GroupNode]: registerGroupNode,
+  [GroupPluginRegister.Render]: registerRender,
+  [GroupPluginRegister.Layer]: registerLayer,
+  [GroupPluginRegister.CleanGroups]: registerCleanGroups,
+};

package/src/registers/register-clean-groups.ts

@@ -0,0 +1,33 @@
+/**
+ * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates
+ * SPDX-License-Identifier: MIT
+ */
+
+import { FlowDocument } from '@flowgram-vue/document';
+import { FlowGroupService } from '@flowgram-vue/document';
+
+import { IGroupPluginRegister } from '../type';
+
+/** 注册清理分组逻辑 */
+export const registerCleanGroups: IGroupPluginRegister = (ctx, _opts) => {
+  const groupService = ctx.get<FlowGroupService>(FlowGroupService);
+  const document = ctx.get<FlowDocument>(FlowDocument);
+
+  const clearInvalidGroups = () => {
+    groupService.getAllGroups().forEach(group => {
+      if (group?.nodes.length !== 0) {
+        return;
+      }
+      if (!group.groupNode.pre) {
+        return;
+      }
+      groupService.deleteGroup(group.groupNode);
+    });
+  };
+
+  document.originTree.onTreeChange(() => {
+    setTimeout(() => {
+      clearInvalidGroups();
+    }, 0);
+  });
+};

package/src/registers/register-group-node.ts

@@ -0,0 +1,15 @@
+/**
+ * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates
+ * SPDX-License-Identifier: MIT
+ */
+
+import { FlowDocument } from '@flowgram-vue/document';
+
+import { IGroupPluginRegister } from '../type';
+import { GroupRegister } from '../group-node-register';
+
+/** 注册分组节点 */
+export const registerGroupNode: IGroupPluginRegister = ctx => {
+  const document = ctx.get<FlowDocument>(FlowDocument);
+  document.registerFlowNodes(GroupRegister);
+};

package/src/registers/register-layer.ts

@@ -0,0 +1,12 @@
+/**
+ * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates
+ * SPDX-License-Identifier: MIT
+ */
+
+import { IGroupPluginRegister } from '../type';
+import { GroupsLayer } from '../groups-layer';
+
+/** 注册背景层 */
+export const registerLayer: IGroupPluginRegister = (ctx, opts) => {
+  ctx.playground.registerLayer(GroupsLayer, opts);
+};

package/src/registers/register-render.ts

@@ -0,0 +1,36 @@
+/**
+ * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates
+ * SPDX-License-Identifier: MIT
+ */
+
+import { defineComponent, h } from 'vue';
+
+import { FlowRendererRegistry } from '@flowgram-vue/renderer';
+import { FlowNodeEntity } from '@flowgram-vue/document';
+
+import { IGroupPluginRegister } from '../type';
+import { GroupRenderer } from '../constant';
+import { GroupRender } from '../components';
+
+/** 注册渲染组件 */
+export const registerRender: IGroupPluginRegister = (ctx, opts) => {
+  const rendererRegistry = ctx.get<FlowRendererRegistry>(FlowRendererRegistry);
+  const renderer = defineComponent({
+    name: 'GroupNodeRenderer',
+    props: {
+      node: {
+        type: Object as () => FlowNodeEntity,
+        required: true,
+      },
+    },
+    setup(props) {
+      return () =>
+        h(GroupRender, {
+          groupNode: props.node,
+          GroupNode: opts.components!.GroupNode,
+          GroupBoxHeader: opts.components!.GroupBoxHeader,
+        });
+    },
+  });
+  rendererRegistry.registerVueComponent(GroupRenderer.GroupRender, renderer);
+};

package/src/type.ts

@@ -0,0 +1,49 @@
+/**
+ * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates
+ * SPDX-License-Identifier: MIT
+ */
+
+import type { Component, CSSProperties } from 'vue';
+
+import type { FlowNodeEntity } from '@flowgram-vue/document';
+import type { FlowGroupController } from '@flowgram-vue/document';
+import type { LayerOptions, PluginContext } from '@flowgram-vue/core';
+
+import type { GroupPluginRegister } from './constant';
+
+export type IGroupBox = Component<{
+  groupNode: FlowNodeEntity;
+  backgroundStyle?: (groupController: FlowGroupController) => CSSProperties;
+}>;
+
+export type IGroupRender = Component<{
+  groupNode: FlowNodeEntity;
+  GroupNode: IGroupNode;
+  GroupBoxHeader: IGroupBoxHeader;
+}>;
+
+export type IGroupNode = Component<{
+  groupNode: FlowNodeEntity;
+  groupController: FlowGroupController;
+}>;
+
+export type IGroupBoxHeader = Component<{
+  groupNode: FlowNodeEntity;
+  groupController: FlowGroupController;
+}>;
+
+export interface GroupsLayerOptions extends LayerOptions {
+  groupBoxStyle?: (groupController: FlowGroupController) => CSSProperties;
+}
+
+export type IGroupPluginRegister = (ctx: PluginContext, opts: CreateGroupPluginOptions) => void;
+
+export type CreateGroupPluginOptions = GroupsLayerOptions & {
+  components?: {
+    GroupNode: IGroupNode;
+    GroupBoxHeader: IGroupBoxHeader;
+  };
+  registers?: {
+    [key in GroupPluginRegister]?: IGroupPluginRegister | boolean;
+  };
+};