@sulesky/next-core 1.0.3

package/src/effects/useTranslateEffect.ts

@@ -0,0 +1,59 @@
+import { Engine, CursorDragType } from '../models'
+import { DragStartEvent, DragMoveEvent, DragStopEvent } from '../events'
+
+export const useTranslateEffect = (engine: Engine) => {
+  engine.subscribeTo(DragStartEvent, (event) => {
+    const target = event.data.target as HTMLElement
+    const currentWorkspace =
+      event.context?.workspace ?? engine.workbench.activeWorkspace
+    const handler = target?.closest(`*[${engine.props.nodeTranslateAttrName}]`)
+    if (!currentWorkspace) return
+    const helper = currentWorkspace.operation.transformHelper
+    if (handler) {
+      const type = handler.getAttribute(engine.props.nodeTranslateAttrName)
+      if (type) {
+        const selectionElement = handler.closest(
+          `*[${engine.props.nodeSelectionIdAttrName}]`
+        ) as HTMLElement
+        if (selectionElement) {
+          const nodeId = selectionElement.getAttribute(
+            engine.props.nodeSelectionIdAttrName
+          )
+          if (nodeId) {
+            const node = engine.findNodeById(nodeId)
+            if (node) {
+              helper.dragStart({ dragNodes: [node], type: 'translate' })
+            }
+          }
+        }
+      }
+    }
+  })
+  engine.subscribeTo(DragMoveEvent, (event) => {
+    if (engine.cursor.dragType !== CursorDragType.Translate) return
+    const currentWorkspace =
+      event.context?.workspace ?? engine.workbench.activeWorkspace
+    const helper = currentWorkspace?.operation.transformHelper
+    const dragNodes = helper.dragNodes
+    if (!dragNodes.length) return
+    helper.dragMove()
+    dragNodes.forEach((node) => {
+      const element = node.getElement()
+      helper.translate(node, (translate) => {
+        element.style.position = 'absolute'
+        element.style.left = '0px'
+        element.style.top = '0px'
+        element.style.transform = `translate3d(${translate.x}px,${translate.y}px,0)`
+      })
+    })
+  })
+  engine.subscribeTo(DragStopEvent, (event) => {
+    if (engine.cursor.dragType !== CursorDragType.Translate) return
+    const currentWorkspace =
+      event.context?.workspace ?? engine.workbench.activeWorkspace
+    const helper = currentWorkspace?.operation.transformHelper
+    if (helper) {
+      helper.dragEnd()
+    }
+  })
+}

package/src/effects/useViewportEffect.ts

@@ -0,0 +1,29 @@
+import { Engine } from '../models'
+import { ViewportResizeEvent, ViewportScrollEvent } from '../events'
+
+export const useViewportEffect = (engine: Engine) => {
+  engine.subscribeTo(ViewportResizeEvent, (event) => {
+    const currentWorkspace = event?.context?.workspace
+    if (!currentWorkspace) return
+    const viewport = currentWorkspace.viewport
+    const outline = currentWorkspace.outline
+    if (viewport.matchViewport(event.data.target)) {
+      viewport.digestViewport()
+    }
+    if (outline.matchViewport(event.data.target)) {
+      outline.digestViewport()
+    }
+  })
+  engine.subscribeTo(ViewportScrollEvent, (event) => {
+    const currentWorkspace = event?.context?.workspace
+    if (!currentWorkspace) return
+    const viewport = currentWorkspace.viewport
+    const outline = currentWorkspace.outline
+    if (viewport.matchViewport(event.data.target)) {
+      viewport.digestViewport()
+    }
+    if (outline.matchViewport(event.data.target)) {
+      outline.digestViewport()
+    }
+  })
+}

package/src/effects/useWorkspaceEffect.ts

@@ -0,0 +1,35 @@
+import { Engine } from '../models'
+import { ICustomEvent } from '@sulesky/next-shared'
+import { IEngineContext } from '../types'
+import { SelectNodeEvent } from '../events'
+
+export const useWorkspaceEffect = (engine: Engine) => {
+  engine.subscribeWith<ICustomEvent<any, IEngineContext>>(
+    [
+      'append:node',
+      'insert:after',
+      'insert:before',
+      'insert:children',
+      'drag:node',
+      'drop:node',
+      'prepend:node',
+      'remove:node',
+      'select:node',
+      'update:children',
+      'wrap:node',
+      'update:node:props',
+    ],
+    (event) => {
+      if (event.context?.workbench) {
+        engine.workbench.setActiveWorkspace(event.context.workspace)
+      }
+    }
+  )
+  engine.subscribeTo(SelectNodeEvent, (event) => {
+    engine.workbench.eachWorkspace((workspace) => {
+      if (workspace !== event.context.workspace) {
+        workspace.operation.selection.clear()
+      }
+    })
+  })
+}

package/src/events/cursor/AbstractCursorEvent.ts

@@ -0,0 +1,62 @@
+import { IEngineContext } from '../../types'
+import { globalThisPolyfill } from '@sulesky/next-shared'
+
+export interface ICursorEventOriginData {
+  clientX: number
+  clientY: number
+  pageX: number
+  pageY: number
+  target: EventTarget
+  view: Window
+}
+
+export interface ICursorEventData extends ICursorEventOriginData {
+  topClientX?: number
+  topClientY?: number
+  topPageX?: number
+  topPageY?: number
+}
+
+export class AbstractCursorEvent {
+  data: ICursorEventData
+
+  context: IEngineContext
+
+  constructor(data: ICursorEventOriginData) {
+    this.data = data || {
+      clientX: 0,
+      clientY: 0,
+      pageX: 0,
+      pageY: 0,
+      target: null,
+      view: globalThisPolyfill,
+    }
+    this.transformCoordinates()
+  }
+
+  transformCoordinates() {
+    const { frameElement } = this.data?.view || {}
+    if (frameElement && this.data.view !== globalThisPolyfill) {
+      const frameRect = frameElement.getBoundingClientRect()
+      const scale = frameRect.width / frameElement['offsetWidth']
+      this.data.topClientX = this.data.clientX * scale + frameRect.x
+      this.data.topClientY = this.data.clientY * scale + frameRect.y
+      this.data.topPageX =
+        this.data.pageX + frameRect.x - this.data.view.scrollX
+      this.data.topPageY =
+        this.data.pageY + frameRect.y - this.data.view.scrollY
+      const topElement = document.elementFromPoint(
+        this.data.topPageX,
+        this.data.topClientY
+      )
+      if (topElement !== frameElement) {
+        this.data.target = topElement
+      }
+    } else {
+      this.data.topClientX = this.data.clientX
+      this.data.topClientY = this.data.clientY
+      this.data.topPageX = this.data.pageX
+      this.data.topPageY = this.data.pageY
+    }
+  }
+}

package/src/events/cursor/DragMoveEvent.ts

@@ -0,0 +1,6 @@
+import { ICustomEvent } from '@sulesky/next-shared'
+import { AbstractCursorEvent } from './AbstractCursorEvent'
+
+export class DragMoveEvent extends AbstractCursorEvent implements ICustomEvent {
+  type = 'drag:move'
+}

package/src/events/cursor/DragStartEvent.ts

@@ -0,0 +1,9 @@
+import { ICustomEvent } from '@sulesky/next-shared'
+import { AbstractCursorEvent } from './AbstractCursorEvent'
+
+export class DragStartEvent
+  extends AbstractCursorEvent
+  implements ICustomEvent
+{
+  type = 'drag:start'
+}

package/src/events/cursor/DragStopEvent.ts

@@ -0,0 +1,6 @@
+import { ICustomEvent } from '@sulesky/next-shared'
+import { AbstractCursorEvent } from './AbstractCursorEvent'
+
+export class DragStopEvent extends AbstractCursorEvent implements ICustomEvent {
+  type = 'drag:stop'
+}

package/src/events/cursor/MouseClickEvent.ts

@@ -0,0 +1,16 @@
+import { ICustomEvent } from '@sulesky/next-shared'
+import { AbstractCursorEvent } from './AbstractCursorEvent'
+
+export class MouseClickEvent
+  extends AbstractCursorEvent
+  implements ICustomEvent
+{
+  type = 'mouse:click'
+}
+
+export class MouseDoubleClickEvent
+  extends AbstractCursorEvent
+  implements ICustomEvent
+{
+  type = 'mouse:dblclick'
+}

package/src/events/cursor/MouseMoveEvent.ts

@@ -0,0 +1,9 @@
+import { ICustomEvent } from '@sulesky/next-shared'
+import { AbstractCursorEvent } from './AbstractCursorEvent'
+
+export class MouseMoveEvent
+  extends AbstractCursorEvent
+  implements ICustomEvent
+{
+  type = 'mouse:move'
+}

package/src/events/cursor/index.ts

@@ -0,0 +1,5 @@
+export * from './DragMoveEvent'
+export * from './DragStartEvent'
+export * from './DragStopEvent'
+export * from './MouseClickEvent'
+export * from './MouseMoveEvent'

package/src/events/history/AbstractHistoryEvent.ts

@@ -0,0 +1,9 @@
+import { IEngineContext } from '../../types'
+
+export class AbstractHistoryEvent {
+  data: any
+  context: IEngineContext
+  constructor(data: any) {
+    this.data = data
+  }
+}

package/src/events/history/HistoryGotoEvent.ts

@@ -0,0 +1,9 @@
+import { ICustomEvent } from '@sulesky/next-shared'
+import { AbstractHistoryEvent } from './AbstractHistoryEvent'
+
+export class HistoryGotoEvent
+  extends AbstractHistoryEvent
+  implements ICustomEvent
+{
+  type = 'history:goto'
+}

package/src/events/history/HistoryPushEvent.ts

@@ -0,0 +1,9 @@
+import { ICustomEvent } from '@sulesky/next-shared'
+import { AbstractHistoryEvent } from './AbstractHistoryEvent'
+
+export class HistoryPushEvent
+  extends AbstractHistoryEvent
+  implements ICustomEvent
+{
+  type = 'history:push'
+}

package/src/events/history/HistoryRedoEvent.ts

@@ -0,0 +1,9 @@
+import { ICustomEvent } from '@sulesky/next-shared'
+import { AbstractHistoryEvent } from './AbstractHistoryEvent'
+
+export class HistoryUndoEvent
+  extends AbstractHistoryEvent
+  implements ICustomEvent
+{
+  type = 'history:undo'
+}

package/src/events/history/HistoryUndoEvent.ts

@@ -0,0 +1,9 @@
+import { ICustomEvent } from '@sulesky/next-shared'
+import { AbstractHistoryEvent } from './AbstractHistoryEvent'
+
+export class HistoryRedoEvent
+  extends AbstractHistoryEvent
+  implements ICustomEvent
+{
+  type = 'history:redo'
+}

package/src/events/history/index.ts

@@ -0,0 +1,4 @@
+export * from './HistoryRedoEvent'
+export * from './HistoryUndoEvent'
+export * from './HistoryGotoEvent'
+export * from './HistoryPushEvent'

package/src/events/index.ts

@@ -0,0 +1,6 @@
+export * from './cursor'
+export * from './keyboard'
+export * from './mutation'
+export * from './viewport'
+export * from './workbench'
+export * from './history'

package/src/events/keyboard/AbstractKeyboardEvent.ts

@@ -0,0 +1,48 @@
+import { getKeyCodeFromEvent, KeyCode } from '@sulesky/next-shared'
+import { IEngineContext } from '../../types'
+
+export class AbstractKeyboardEvent {
+  data: KeyCode
+  context: IEngineContext
+  originEvent: KeyboardEvent
+  constructor(e: KeyboardEvent) {
+    this.data = getKeyCodeFromEvent(e)
+    this.originEvent = e
+  }
+
+  get eventType() {
+    return this.originEvent.type
+  }
+
+  get ctrlKey() {
+    return this.originEvent.ctrlKey
+  }
+
+  get shiftKey() {
+    return this.originEvent.shiftKey
+  }
+
+  get metaKey() {
+    return this.originEvent.metaKey
+  }
+
+  get altkey() {
+    return this.originEvent.altKey
+  }
+
+  preventDefault() {
+    if (this.originEvent.preventDefault) {
+      this.originEvent.preventDefault()
+    } else {
+      this.originEvent.returnValue = false
+    }
+  }
+
+  stopPropagation() {
+    if (this.originEvent?.stopPropagation) {
+      this.originEvent.stopPropagation()
+    } else {
+      this.originEvent.cancelBubble = true
+    }
+  }
+}

package/src/events/keyboard/KeyDownEvent.ts

@@ -0,0 +1,9 @@
+import { ICustomEvent } from '@sulesky/next-shared'
+import { AbstractKeyboardEvent } from './AbstractKeyboardEvent'
+
+export class KeyDownEvent
+  extends AbstractKeyboardEvent
+  implements ICustomEvent
+{
+  type = 'key:down'
+}

package/src/events/keyboard/KeyUpEvent.ts

@@ -0,0 +1,6 @@
+import { ICustomEvent } from '@sulesky/next-shared'
+import { AbstractKeyboardEvent } from './AbstractKeyboardEvent'
+
+export class KeyUpEvent extends AbstractKeyboardEvent implements ICustomEvent {
+  type = 'key:up'
+}

package/src/events/keyboard/index.ts

@@ -0,0 +1,2 @@
+export * from './KeyDownEvent'
+export * from './KeyUpEvent'

package/src/events/mutation/AbstractMutationNodeEvent.ts

@@ -0,0 +1,21 @@
+import { TreeNode } from '../../models'
+import { IEngineContext } from '../../types'
+
+export interface IMutationNodeEventData {
+  //事件发生的数据源
+  source: TreeNode | TreeNode[]
+  //事件发生的目标对象
+  target: TreeNode | TreeNode[]
+  // 事件发生的来源对象
+  originSourceParents?: TreeNode | TreeNode[]
+  //扩展数据
+  extra?: any
+}
+
+export class AbstractMutationNodeEvent {
+  data: IMutationNodeEventData
+  context: IEngineContext
+  constructor(data: IMutationNodeEventData) {
+    this.data = data
+  }
+}

package/src/events/mutation/AppendNodeEvent.ts

@@ -0,0 +1,9 @@
+import { ICustomEvent } from '@sulesky/next-shared'
+import { AbstractMutationNodeEvent } from './AbstractMutationNodeEvent'
+
+export class AppendNodeEvent
+  extends AbstractMutationNodeEvent
+  implements ICustomEvent
+{
+  type = 'append:node'
+}

package/src/events/mutation/CloneNodeEvent.ts

@@ -0,0 +1,9 @@
+import { ICustomEvent } from '@sulesky/next-shared'
+import { AbstractMutationNodeEvent } from './AbstractMutationNodeEvent'
+
+export class CloneNodeEvent
+  extends AbstractMutationNodeEvent
+  implements ICustomEvent
+{
+  type = 'clone:node'
+}

package/src/events/mutation/DragNodeEvent.ts

@@ -0,0 +1,9 @@
+import { ICustomEvent } from '@sulesky/next-shared'
+import { AbstractMutationNodeEvent } from './AbstractMutationNodeEvent'
+
+export class DragNodeEvent
+  extends AbstractMutationNodeEvent
+  implements ICustomEvent
+{
+  type = 'drag:node'
+}

package/src/events/mutation/DropNodeEvent.ts

@@ -0,0 +1,9 @@
+import { ICustomEvent } from '@sulesky/next-shared'
+import { AbstractMutationNodeEvent } from './AbstractMutationNodeEvent'
+
+export class DropNodeEvent
+  extends AbstractMutationNodeEvent
+  implements ICustomEvent
+{
+  type = 'drop:node'
+}

package/src/events/mutation/FromNodeEvent.ts

@@ -0,0 +1,19 @@
+import { ICustomEvent } from '@sulesky/next-shared'
+import { ITreeNode, TreeNode } from '../../models'
+import { IEngineContext } from '../../types'
+
+export interface IFromNodeEventData {
+  //事件发生的数据源
+  source: ITreeNode
+  //事件发生的目标对象
+  target: TreeNode
+}
+
+export class FromNodeEvent implements ICustomEvent {
+  type = 'from:node'
+  data: IFromNodeEventData
+  context: IEngineContext
+  constructor(data: IFromNodeEventData) {
+    this.data = data
+  }
+}

package/src/events/mutation/HoverNodeEvent.ts

@@ -0,0 +1,9 @@
+import { ICustomEvent } from '@sulesky/next-shared'
+import { AbstractMutationNodeEvent } from './AbstractMutationNodeEvent'
+
+export class HoverNodeEvent
+  extends AbstractMutationNodeEvent
+  implements ICustomEvent
+{
+  type = 'hover:node'
+}

package/src/events/mutation/InsertAfterEvent.ts

@@ -0,0 +1,9 @@
+import { ICustomEvent } from '@sulesky/next-shared'
+import { AbstractMutationNodeEvent } from './AbstractMutationNodeEvent'
+
+export class InsertAfterEvent
+  extends AbstractMutationNodeEvent
+  implements ICustomEvent
+{
+  type = 'insert:after'
+}

package/src/events/mutation/InsertBeforeEvent.ts

@@ -0,0 +1,9 @@
+import { ICustomEvent } from '@sulesky/next-shared'
+import { AbstractMutationNodeEvent } from './AbstractMutationNodeEvent'
+
+export class InsertBeforeEvent
+  extends AbstractMutationNodeEvent
+  implements ICustomEvent
+{
+  type = 'insert:before'
+}

package/src/events/mutation/InsertChildrenEvent.ts

@@ -0,0 +1,9 @@
+import { ICustomEvent } from '@sulesky/next-shared'
+import { AbstractMutationNodeEvent } from './AbstractMutationNodeEvent'
+
+export class InsertChildrenEvent
+  extends AbstractMutationNodeEvent
+  implements ICustomEvent
+{
+  type = 'insert:children'
+}

package/src/events/mutation/PrependNodeEvent.ts

@@ -0,0 +1,9 @@
+import { ICustomEvent } from '@sulesky/next-shared'
+import { AbstractMutationNodeEvent } from './AbstractMutationNodeEvent'
+
+export class PrependNodeEvent
+  extends AbstractMutationNodeEvent
+  implements ICustomEvent
+{
+  type = 'prepend:node'
+}

package/src/events/mutation/RemoveNodeEvent.ts

@@ -0,0 +1,9 @@
+import { ICustomEvent } from '@sulesky/next-shared'
+import { AbstractMutationNodeEvent } from './AbstractMutationNodeEvent'
+
+export class RemoveNodeEvent
+  extends AbstractMutationNodeEvent
+  implements ICustomEvent
+{
+  type = 'remove:node'
+}

package/src/events/mutation/SelectNodeEvent.ts

@@ -0,0 +1,9 @@
+import { ICustomEvent } from '@sulesky/next-shared'
+import { AbstractMutationNodeEvent } from './AbstractMutationNodeEvent'
+
+export class SelectNodeEvent
+  extends AbstractMutationNodeEvent
+  implements ICustomEvent
+{
+  type = 'select:node'
+}

package/src/events/mutation/UnSelectNodeEvent.ts

@@ -0,0 +1,9 @@
+import { ICustomEvent } from '@sulesky/next-shared'
+import { AbstractMutationNodeEvent } from './AbstractMutationNodeEvent'
+
+export class UnSelectNodeEvent
+  extends AbstractMutationNodeEvent
+  implements ICustomEvent
+{
+  type = 'unselect:node'
+}

package/src/events/mutation/UpdateChildrenEvent.ts

@@ -0,0 +1,9 @@
+import { ICustomEvent } from '@sulesky/next-shared'
+import { AbstractMutationNodeEvent } from './AbstractMutationNodeEvent'
+
+export class UpdateChildrenEvent
+  extends AbstractMutationNodeEvent
+  implements ICustomEvent
+{
+  type = 'update:children'
+}

package/src/events/mutation/UpdateNodePropsEvent.ts

@@ -0,0 +1,9 @@
+import { ICustomEvent } from '@sulesky/next-shared'
+import { AbstractMutationNodeEvent } from './AbstractMutationNodeEvent'
+
+export class UpdateNodePropsEvent
+  extends AbstractMutationNodeEvent
+  implements ICustomEvent
+{
+  type = 'update:node:props'
+}

package/src/events/mutation/UserSelectNodeEvent.ts

@@ -0,0 +1,9 @@
+import { ICustomEvent } from '@sulesky/next-shared'
+import { AbstractMutationNodeEvent } from './AbstractMutationNodeEvent'
+
+export class SelectNodeEvent
+  extends AbstractMutationNodeEvent
+  implements ICustomEvent
+{
+  type = 'user:select:node'
+}

package/src/events/mutation/WrapNodeEvent.ts

@@ -0,0 +1,9 @@
+import { ICustomEvent } from '@sulesky/next-shared'
+import { AbstractMutationNodeEvent } from './AbstractMutationNodeEvent'
+
+export class WrapNodeEvent
+  extends AbstractMutationNodeEvent
+  implements ICustomEvent
+{
+  type = 'wrap:node'
+}

package/src/events/mutation/index.ts

@@ -0,0 +1,16 @@
+export * from './DragNodeEvent'
+export * from './DropNodeEvent'
+export * from './HoverNodeEvent'
+export * from './InsertAfterEvent'
+export * from './InsertBeforeEvent'
+export * from './InsertChildrenEvent'
+export * from './PrependNodeEvent'
+export * from './RemoveNodeEvent'
+export * from './SelectNodeEvent'
+export * from './UnSelectNodeEvent'
+export * from './UpdateChildrenEvent'
+export * from './UpdateNodePropsEvent'
+export * from './WrapNodeEvent'
+export * from './CloneNodeEvent'
+export * from './AppendNodeEvent'
+export * from './FromNodeEvent'

package/src/events/viewport/AbstractViewportEvent.ts

@@ -0,0 +1,30 @@
+import { IEngineContext } from '../../types'
+import { globalThisPolyfill } from '@sulesky/next-shared'
+
+export interface IViewportEventData {
+  scrollX: number
+  scrollY: number
+  width: number
+  height: number
+  view: Window
+  innerWidth: number
+  innerHeight: number
+  target: EventTarget
+}
+
+export class AbstractViewportEvent {
+  data: IViewportEventData
+  context: IEngineContext
+  constructor(data: IViewportEventData) {
+    this.data = data || {
+      scrollX: globalThisPolyfill.scrollX,
+      scrollY: globalThisPolyfill.scrollY,
+      width: globalThisPolyfill.innerWidth,
+      height: globalThisPolyfill.innerHeight,
+      innerWidth: globalThisPolyfill.innerWidth,
+      innerHeight: globalThisPolyfill.innerHeight,
+      view: globalThisPolyfill,
+      target: globalThisPolyfill,
+    }
+  }
+}

package/src/events/viewport/ViewportResizeEvent.ts

@@ -0,0 +1,9 @@
+import { ICustomEvent } from '@sulesky/next-shared'
+import { AbstractViewportEvent } from './AbstractViewportEvent'
+
+export class ViewportResizeEvent
+  extends AbstractViewportEvent
+  implements ICustomEvent
+{
+  type = 'viewport:resize'
+}