@logicflow/core 2.0.0-beta.4 → 2.0.0-beta.6

package/src/util/edge.ts

@@ -1,10 +1,13 @@
-import { forEach, pick } from 'lodash-es'
+import { pick, forEach } from 'lodash-es'
 import { getNodeBBox, isInNode, distance, sampleCubic } from '.'
 import LogicFlow from '../LogicFlow'
 import { Options } from '../options'
 import { SegmentDirection } from '../constant'
-import { getVerticalPointOfLine } from '../algorithm'
-import { getCrossPointOfLine, isInSegment } from '../algorithm/edge'
+import {
+  getVerticalPointOfLine,
+  getCrossPointOfLine,
+  isInSegment,
+} from '../algorithm'
 import {
   Model,
   BaseNodeModel,
@@ -397,7 +400,7 @@ export const getNextNeighborPoints = (
   return filterRepeatPoints(neighbors)
 }
 
-/* 路径查找,Astart查找+曼哈顿距离
+/* 路径查找,AStar查找+曼哈顿距离
  * 算法wiki:https://zh.wikipedia.org/wiki/A*%E6%90%9C%E5%B0%8B%E6%BC%94%E7%AE%97%E6%B3%95
  * 方法无法复用，且调用了很多polyline相关的方法，暂不抽离到src/algorithm中
  */
@@ -590,10 +593,10 @@ export const getPolylinePoints = (
  * @param pointsList 多个点组成的数组
  */
 export const getLongestEdge = (pointsList: Point[]): [Point, Point] => {
-  let points
   if (pointsList.length === 1) {
-    points = [pointsList[0], pointsList[0]]
-  } else if (pointsList.length >= 2) {
+    const [point] = pointsList
+    return [point, point]
+  } else {
     let point1 = pointsList[0]
     let point2 = pointsList[1]
     let edgeLength = distance(point1.x, point1.y, point2.x, point2.y)
@@ -612,9 +615,8 @@ export const getLongestEdge = (pointsList: Point[]): [Point, Point] => {
         point2 = newPoint2
       }
     }
-    points = [point1, point2]
+    return [point1, point2]
   }
-  return points
 }
 
 /* 线段是否在节点内部，被包含了 */
@@ -650,8 +652,7 @@ export const getCrossPointInRect = (
   start: Point,
   end: Point,
   node: BaseNodeModel,
-): Point => {
-  let point
+): Point | false | undefined => {
   let crossSegments: [Point, Point] | undefined = undefined
   const nodeBox = getNodeBBox(node)
   const points = getPointsFromBBox(nodeBox)
@@ -667,9 +668,8 @@ export const getCrossPointInRect = (
     }
   }
   if (crossSegments) {
-    point = getCrossPointOfLine(start, end, crossSegments[0], crossSegments[1])
+    return getCrossPointOfLine(start, end, crossSegments[0], crossSegments[1])
   }
-  return point
 }
 /* 判断线段的方向 */
 export const segmentDirection = (
@@ -915,6 +915,7 @@ export const getEndTangent = (
  * 获取移动边后，文本位置距离边上的最近的一点
  * @param point 边上文本的位置
  * @param points 边的各个拐点
+ * TODO: Label实验没问题后统一改成新的计算方式，把这个方法废弃
  */
 export const getClosestPointOfPolyline = (
   point: Point,

package/src/util/node.ts

@@ -19,6 +19,7 @@ import Direction = LogicFlow.Direction
 import NodeConfig = LogicFlow.NodeConfig
 import LineSegment = LogicFlow.LineSegment
 import AnchorInfo = Model.AnchorInfo
+import BoxBoundsPoint = Model.BoxBoundsPoint
 
 /* 获取所有锚点 */
 export const getAnchors = (data: BaseNodeModel) => {
@@ -145,13 +146,9 @@ export type NodeBBox = {
   y: number
   width: number
   height: number
-  minX: number
-  minY: number
-  maxX: number
-  maxY: number
   centerX: number
   centerY: number
-}
+} & BoxBoundsPoint
 
 /* 获取节点bbox */
 export const getNodeBBox = (node: BaseNodeModel): NodeBBox => {
@@ -412,6 +409,7 @@ export const pickNodeConfig = (data: NodeConfig): NodeConfig => {
     'x',
     'y',
     'text',
+    'label',
     'properties',
     'virtual', // 区域节点是否为dnd添加的虚拟节点
     'rotate',

package/src/view/Anchor.tsx

@@ -116,7 +116,7 @@ class Anchor extends Component<IProps, IState> {
       endY: anchorData.y,
     })
   }
-  onDragging = ({ event }) => {
+  onDragging = ({ event }: IDragParams) => {
     const { graphModel, nodeModel, anchorData } = this.props
     const {
       transformModel,
@@ -125,6 +125,8 @@ class Anchor extends Component<IProps, IState> {
       height,
       editConfigModel: { autoExpand, stopMoveGraph },
     } = graphModel
+    // TODO：确认该方法是否有影响！理论上 onDragging 时 event 必有值
+    if (!event) return
     const { clientX, clientY } = event
     const {
       domOverlayPosition: { x, y },

package/src/view/Control.tsx

@@ -103,11 +103,13 @@ export class ResizeControl extends Component<
 
   triggerResizeEvent = (
     preNodeData: ResizeNodeData,
-    nextNodeData: ResizeNodeData,
+    curNodeData: ResizeNodeData,
+    nodeModel: BaseNodeModel,
   ) => {
     this.graphModel.eventCenter.emit(EventType.NODE_RESIZE, {
-      preNodeData,
-      nextNodeData,
+      preData: preNodeData,
+      data: curNodeData,
+      model: nodeModel,
     })
   }
 
@@ -282,14 +284,12 @@ export class ResizeControl extends Component<
     nextSize.deltaY = isFreezeWidth ? 0 : nextSize.deltaY
 
     const preNodeData = this.nodeModel.getData()
-    const nextNodeData = this.nodeModel.resize(nextSize)
-
-    console.log('nextNodeData ===>>>', nextNodeData)
+    const curNodeData = this.nodeModel.resize(nextSize)
 
     // 更新边
     this.updateEdgePointByAnchors()
     // 触发 resize 事件
-    this.triggerResizeEvent(preNodeData, nextNodeData)
+    this.triggerResizeEvent(preNodeData, curNodeData, this.nodeModel)
   }
 
   onDragging = ({ deltaX, deltaY }: IDragParams) => {
@@ -330,6 +330,15 @@ export class ResizeControl extends Component<
           width={width ?? 7}
           height={height ?? 7}
           {...restStyle}
+        />
+        <Rect
+          className="lf-resize-control-content"
+          x={x}
+          y={y}
+          width={30}
+          height={30}
+          fill="transparent"
+          stroke="transparent"
           onMouseDown={this.dragHandler.handleMouseDown}
         />
       </g>

package/src/view/Graph.tsx

@@ -12,8 +12,8 @@ import {
 } from './overlay'
 import DnD from './behavior/dnd'
 import { observer } from '..'
+import Tool from '../tool'
 import { Options as LFOptions } from '../options'
-import Tool from '../tool/tool'
 import {
   GraphModel,
   BaseEdgeModel,

package/src/view/Rotate.tsx

@@ -83,7 +83,8 @@ class RotateControlPoint extends Component<IRotateControlProps> {
 
     eventCenter.emit(EventType.NODE_ROTATE, {
       e: event,
-      nodeModel,
+      model: nodeModel,
+      data: nodeModel.getData(),
     })
   }
 

package/src/view/behavior/index.ts

@@ -0,0 +1,2 @@
+export * from './dnd'
+export * from './snapline'

package/src/{tool → view/behavior}/snapline.ts

@@ -1,13 +1,12 @@
-import EventEmitter from '../event/eventEmitter'
-import SnaplineModel from '../model/SnaplineModel'
+import EventEmitter from '../../event/eventEmitter'
+import SnaplineModel from '../../model/SnaplineModel'
 
 export function snapline(
   eventCenter: EventEmitter,
   snaplineModel: SnaplineModel,
 ): void {
   // 节点拖动时启动对齐线计算
-  eventCenter.on('node:mousemove', ({ data }: any) => {
-    // TODO: 取消注释，定义 data 类型，解决编译问题
+  eventCenter.on('node:mousemove', ({ data }) => {
     snaplineModel.setNodeSnapLine(data)
   })
   // 节点拖动结束时，对齐线消失

package/src/view/edge/AdjustPoint.tsx

@@ -125,54 +125,40 @@ export class AdjustPoint extends Component<IProps, IState> {
     )
     // 如果一定的坐标能够找到目标节点，预结算当前节点与目标节点的路径进行展示
     if (info && info.node && this.isAllowAdjust(info).pass) {
-      let params: {
-        startPoint: Point
-        endPoint: Point
-        sourceNode: BaseNodeModel
-        targetNode: BaseNodeModel
-      }
       const { startPoint, endPoint, sourceNode, targetNode } = edgeModel
-      if (type === AdjustType.SOURCE) {
-        params = {
-          startPoint: {
-            x: info.anchor.x,
-            y: info.anchor.y,
-          },
-          endPoint: {
-            x: endPoint.x,
-            y: endPoint.y,
-          },
-          sourceNode: info.node,
-          targetNode,
-        }
-      } else if (type === AdjustType.TARGET) {
-        params = {
-          startPoint: {
-            x: startPoint.x,
-            y: startPoint.y,
-          },
-          endPoint: {
-            x: info.anchor.x,
-            y: info.anchor.y,
-          },
-          sourceNode,
-          targetNode: info.node,
-        }
-      }
-      edgeModel.updateAfterAdjustStartAndEnd(params!)
-    } else if (type === AdjustType.SOURCE) {
-      // 如果没有找到目标节点，更显起终点为当前坐标
-      edgeModel.updateStartPoint({
-        x,
-        y,
-      })
-    } else if (type === AdjustType.TARGET) {
-      edgeModel.updateEndPoint({
-        x,
-        y,
-      })
+      const params =
+        type === AdjustType.SOURCE
+          ? {
+              startPoint: {
+                x: info.anchor.x,
+                y: info.anchor.y,
+              },
+              endPoint: {
+                x: endPoint.x,
+                y: endPoint.y,
+              },
+              sourceNode: info.node,
+              targetNode,
+            }
+          : {
+              startPoint: {
+                x: startPoint.x,
+                y: startPoint.y,
+              },
+              endPoint: {
+                x: info.anchor.x,
+                y: info.anchor.y,
+              },
+              sourceNode,
+              targetNode: info.node,
+            }
+      edgeModel.updateAfterAdjustStartAndEnd(params)
+    } else {
+      // 如果没有找到目标节点，更新起终点为当前坐标
+      type === AdjustType.SOURCE
+        ? edgeModel.updateStartPoint({ x, y })
+        : edgeModel.updateEndPoint({ x, y })
     }
-
     if (edgeModel.text.value && editConfigModel.adjustEdge) {
       edgeModel.setText(
         Object.assign({}, edgeModel.text, edgeModel.textPosition),

package/src/view/edge/BaseEdge.tsx

@@ -3,7 +3,7 @@ import { Circle } from '../shape'
 import { LineText } from '../text'
 import LogicFlow from '../../LogicFlow'
 import { GraphModel, BaseEdgeModel, PolylineEdgeModel } from '../../model'
-import { ElementState, EventType, ModelType } from '../../constant'
+import { ElementState, EventType, ModelType, TextMode } from '../../constant'
 import {
   isMultipleSelect,
   getClosestPointOfPolyline,
@@ -56,24 +56,31 @@ export abstract class BaseEdge<P extends IProps> extends Component<
    */
   getText(): h.JSX.Element | null {
     const { model, graphModel } = this.props
-    // 文本被编辑的时候，显示编辑框，不显示文本。
-    if (model.state === ElementState.TEXT_EDIT) {
-      return null
-    }
-    let draggable = false
     const { editConfigModel } = graphModel
-    if (model.text.draggable || editConfigModel.edgeTextDraggable) {
-      draggable = true
+
+    // 当 边文本模式非 TEXT 时，不显示文本
+    if (editConfigModel.edgeTextMode !== TextMode.TEXT) return null
+    // 文本被编辑的时候，显示编辑框，不显示文本。
+    if (model.state === ElementState.TEXT_EDIT) return null
+
+    if (model.text) {
+      let draggable = false
+      if (editConfigModel.edgeTextDraggable && model.text.draggable) {
+        draggable = true
+      }
+      return (
+        <LineText
+          ref={this.textRef}
+          editable={
+            editConfigModel.edgeTextEdit && (model.text.editable ?? true)
+          }
+          model={model}
+          graphModel={graphModel}
+          draggable={draggable}
+        />
+      )
     }
-    return (
-      <LineText
-        ref={this.textRef}
-        editable={editConfigModel.edgeTextEdit && model.text.editable}
-        model={model}
-        graphModel={graphModel}
-        draggable={draggable}
-      />
-    )
+    return null
   }
 
   /**
@@ -240,24 +247,36 @@ export abstract class BaseEdge<P extends IProps> extends Component<
    */
   private getAdjustPoints() {
     const { model, graphModel } = this.props
+    const {
+      editConfigModel: {
+        adjustEdgeStartAndEnd,
+        adjustEdgeStart,
+        adjustEdgeEnd,
+      },
+    } = graphModel
     const start = model.getAdjustStart()
     const end = model.getAdjustEnd()
+
     return (
       <g>
-        <AdjustPoint
-          type={AdjustType.SOURCE}
-          {...start}
-          getAdjustPointShape={this.getAdjustPointShape}
-          edgeModel={model}
-          graphModel={graphModel}
-        />
-        <AdjustPoint
-          type={AdjustType.TARGET}
-          {...end}
-          getAdjustPointShape={this.getAdjustPointShape}
-          edgeModel={model}
-          graphModel={graphModel}
-        />
+        {adjustEdgeStartAndEnd && adjustEdgeStart && (
+          <AdjustPoint
+            type={AdjustType.SOURCE}
+            {...start}
+            getAdjustPointShape={this.getAdjustPointShape}
+            edgeModel={model}
+            graphModel={graphModel}
+          />
+        )}
+        {adjustEdgeStartAndEnd && adjustEdgeEnd && (
+          <AdjustPoint
+            type={AdjustType.TARGET}
+            {...end}
+            getAdjustPointShape={this.getAdjustPointShape}
+            edgeModel={model}
+            graphModel={graphModel}
+          />
+        )}
       </g>
     )
   }
@@ -385,15 +404,17 @@ export abstract class BaseEdge<P extends IProps> extends Component<
     })
     if (isDoubleClick) {
       const { editConfigModel, textEditElement } = graphModel
+      const { id, text, modelType } = model
       // 当前边正在编辑，需要先重置状态才能变更文本框位置
-      if (textEditElement && textEditElement.id === model.id) {
-        graphModel.setElementStateById(model.id, ElementState.DEFAULT)
+      if (textEditElement && textEditElement.id === id) {
+        graphModel.setElementStateById(id, ElementState.DEFAULT)
       }
       // 边文案可编辑状态，才可以进行文案编辑
-      if (editConfigModel.edgeTextEdit && model.text.editable) {
-        graphModel.setElementStateById(model.id, ElementState.TEXT_EDIT)
+      if (editConfigModel.edgeTextEdit && text.editable) {
+        model.setSelected(false)
+        graphModel.setElementStateById(id, ElementState.TEXT_EDIT)
       }
-      if (model.modelType === ModelType.POLYLINE_EDGE) {
+      if (modelType === ModelType.POLYLINE_EDGE) {
         const polylineEdgeModel = model as PolylineEdgeModel
         const {
           canvasOverlayPosition: { x, y },
@@ -401,14 +422,13 @@ export abstract class BaseEdge<P extends IProps> extends Component<
           x: e.x,
           y: e.y,
         })
-        const crossPoint = getClosestPointOfPolyline(
+        polylineEdgeModel.dbClickPosition = getClosestPointOfPolyline(
           {
             x,
             y,
           },
           polylineEdgeModel.points,
         )
-        polylineEdgeModel.dbClickPosition = crossPoint
       }
       graphModel.eventCenter.emit(EventType.EDGE_DBCLICK, {
         data: edgeData,

package/src/view/node/BaseNode.tsx

@@ -5,7 +5,7 @@ import Anchor from '../Anchor'
 import { BaseText } from '../text'
 import LogicFlow from '../../LogicFlow'
 import { GraphModel, BaseNodeModel, Model } from '../../model'
-import { ElementState, EventType } from '../../constant'
+import { ElementState, EventType, TextMode } from '../../constant'
 import {
   StepDrag,
   snapToGrid,
@@ -148,14 +148,16 @@ export abstract class BaseNode<P extends IProps> extends Component<P, IState> {
 
   getText(): h.JSX.Element | null {
     const { model, graphModel } = this.props
+    const { editConfigModel } = graphModel
+
+    // 当 节点文本模式非 TEXT 时，不显示文本
+    if (editConfigModel.nodeTextMode !== TextMode.TEXT) return null
     // 文本被编辑的时候，显示编辑框，不显示文本。
-    if (model.state === ElementState.TEXT_EDIT) {
-      return null
-    }
+    if (model.state === ElementState.TEXT_EDIT) return null
+
     if (model.text) {
-      const { editConfigModel } = graphModel
       let draggable = false
-      if (model.text.draggable || editConfigModel.nodeTextDraggable) {
+      if (editConfigModel.nodeTextDraggable && model.text.draggable) {
         draggable = true
       }
       return (
@@ -189,7 +191,7 @@ export abstract class BaseNode<P extends IProps> extends Component<P, IState> {
         break
     }
     if (isDragging) {
-      className += ' lf-isDragging'
+      className += ' lf-dragging'
     }
     if (isSelected) {
       className += ' lf-node-selected'
@@ -212,6 +214,7 @@ export abstract class BaseNode<P extends IProps> extends Component<P, IState> {
       }
     }
   }
+
   onDragging = ({ event }: IDragParams) => {
     const { model, graphModel } = this.props
     // const { isDragging } = model;
@@ -294,6 +297,7 @@ export abstract class BaseNode<P extends IProps> extends Component<P, IState> {
       graphModel.moveNodes(moveNodes, x - model.x, y - model.y)
     }
   }
+
   onDragEnd = () => {
     if (this.t) {
       cancelRaf(this.t)
@@ -301,10 +305,12 @@ export abstract class BaseNode<P extends IProps> extends Component<P, IState> {
     const { model } = this.props
     model.isDragging = false
   }
+
   handleMouseUp = () => {
     const { model } = this.props
     this.mouseUpDrag = model.isDragging
   }
+
   handleClick = (e: MouseEvent) => {
     // 节点拖拽进画布之后，不触发click事件相关emit
     // 点拖拽进画布没有触发mousedown事件，没有startTime，用这个值做区分
@@ -350,9 +356,11 @@ export abstract class BaseNode<P extends IProps> extends Component<P, IState> {
 
     // 不是双击的，默认都是单击
     if (isDoubleClick) {
-      if (editConfigModel.nodeTextEdit && model.text.editable) {
-        model.setSelected(false)
-        graphModel.setElementStateById(model.id, ElementState.TEXT_EDIT)
+      if (editConfigModel.nodeTextEdit) {
+        if (model.text.editable) {
+          model.setSelected(false)
+          graphModel.setElementStateById(model.id, ElementState.TEXT_EDIT)
+        }
       }
       graphModel.eventCenter.emit(EventType.NODE_DBCLICK, eventOptions)
     } else {
@@ -360,6 +368,7 @@ export abstract class BaseNode<P extends IProps> extends Component<P, IState> {
       graphModel.eventCenter.emit(EventType.NODE_CLICK, eventOptions)
     }
   }
+
   handleContextMenu = (ev: MouseEvent) => {
     ev.preventDefault()
     const { model, graphModel } = this.props
@@ -385,6 +394,7 @@ export abstract class BaseNode<P extends IProps> extends Component<P, IState> {
     })
     this.toFront()
   }
+
   handleMouseDown = (ev: MouseEvent) => {
     const { model, graphModel } = this.props
     this.startTime = new Date().getTime()
@@ -393,6 +403,7 @@ export abstract class BaseNode<P extends IProps> extends Component<P, IState> {
       this.stepDrag && this.stepDrag.handleMouseDown(ev)
     }
   }
+
   // 为什么将hover状态放到model中？
   // 因为自定义节点的时候，可能会基于hover状态自定义不同的样式。
   setHoverOn = (ev: MouseEvent) => {
@@ -405,9 +416,11 @@ export abstract class BaseNode<P extends IProps> extends Component<P, IState> {
       e: ev,
     })
   }
+
   setHoverOff = (ev: MouseEvent) => {
     const { model, graphModel } = this.props
     const nodeData = model.getData()
+    // 文本focus时，关联的元素也需要高亮，所以元素失焦时还要判断下是否有文本处于focus状态
     if (!model.isHovered) return
     model.setHovered(false)
     graphModel.eventCenter.emit(EventType.NODE_MOUSELEAVE, {
@@ -415,6 +428,7 @@ export abstract class BaseNode<P extends IProps> extends Component<P, IState> {
       e: ev,
     })
   }
+
   onMouseOut = (ev: MouseEvent) => {
     if (isIe) {
       this.setHoverOff(ev)

package/src/view/node/HtmlNode.tsx

@@ -52,14 +52,14 @@ export class HtmlNode extends BaseNode<IHtmlNodeProps> {
   }
 
   componentDidMount() {
-    console.log('HtmlNode --->>> componentDidMount - 初始化内容')
+    // console.log('HtmlNode --->>> componentDidMount - 初始化内容')
     if (this.shouldUpdate() && this.rootEl) {
       this.setHtml(this.rootEl)
     }
   }
 
   componentDidUpdate() {
-    console.log('HtmlNode --->>> componentDidUpdate - 更新节点内容')
+    // console.log('HtmlNode --->>> componentDidUpdate - 更新节点内容')
     // DONE: 将 componentDidMount 和 componentDidUpdate 区分开，如果写在一次，渲染 React 组件会重复初始化，消耗过多资源
     // 为了保证历史兼容性，先将默认 HTML 节点的 setHtml 和 confirmUpdate 保持一直，用户可通过自定义的方式重新定义
     if (this.shouldUpdate() && this.rootEl) {

package/src/view/overlay/CanvasOverlay.tsx

@@ -123,6 +123,7 @@ export class CanvasOverlay extends Component<IProps, IState> {
       })
     }
   }
+  // 鼠标、触摸板 按下
   mouseDownHandler = (ev: MouseEvent) => {
     const {
       graphModel: {

package/src/view/overlay/ToolOverlay.tsx

@@ -35,7 +35,7 @@ export class ToolOverlay extends Component<IProps> {
       h(t, {
         textEditElement,
         graphModel,
-        logicFlow: tool.instance,
+        lf: tool.instance,
       }),
     )
     tool.components = components

package/src/view/text/BaseText.tsx

@@ -1,6 +1,6 @@
 import classNames from 'classnames'
 import { createElement as h, Component } from 'preact/compat'
-import { ElementState } from '../../constant'
+import { ElementState, EventType } from '../../constant'
 import { GraphModel, BaseNodeModel, BaseEdgeModel } from '../../model'
 import { Text } from '../shape'
 import { IDragParams, StepDrag } from '../../util'
@@ -30,6 +30,7 @@ export class BaseText<
       onDragging: this.onDragging,
       step: 1,
       // model,
+      eventType: 'TEXT',
       isStopPropagation: draggable,
     })
   }
@@ -98,11 +99,18 @@ export class BaseText<
 
   dbClickHandler = () => {
     // 静默模式下，双击不更改状态，不可编辑
-    const { editable } = this.props
+    const {
+      editable,
+      graphModel: { eventCenter },
+      model,
+    } = this.props
     if (editable) {
-      const { model } = this.props
       model.setElementState(ElementState.TEXT_EDIT)
     }
+    eventCenter.emit(EventType.TEXT_DBCLICK, {
+      data: model.text,
+      model,
+    })
   }
 
   render(): h.JSX.Element | undefined {

package/tsconfig.json

@@ -14,5 +14,5 @@
     }
   },
   "include": ["src/**/*", "**/*.d.ts"],
-  "exclude": ["node_modules", "**/*.spec.ts", "es", "lib"]
+  "exclude": ["node_modules", "**/*.spec.ts", "es", "lib", "__tests__"]
 }

package/es/tool/snapline.d.ts

@@ -1,3 +0,0 @@
-import EventEmitter from '../event/eventEmitter';
-import SnaplineModel from '../model/SnaplineModel';
-export declare function snapline(eventCenter: EventEmitter, snaplineModel: SnaplineModel): void;

package/es/tool/snapline.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"snapline.js","sourceRoot":"","sources":["../../src/tool/snapline.ts"],"names":[],"mappings":"AAGA,MAAM,UAAU,QAAQ,CACtB,WAAyB,EACzB,aAA4B;IAE5B,eAAe;IACf,WAAW,CAAC,EAAE,CAAC,gBAAgB,EAAE,UAAC,EAAa;YAAX,IAAI,UAAA;QACtC,+BAA+B;QAC/B,aAAa,CAAC,eAAe,CAAC,IAAI,CAAC,CAAA;IACrC,CAAC,CAAC,CAAA;IACF,gBAAgB;IAChB,WAAW,CAAC,EAAE,CAAC,cAAc,EAAE;QAC7B,aAAa,CAAC,aAAa,EAAE,CAAA;IAC/B,CAAC,CAAC,CAAA;AACJ,CAAC"}