@witchcraft/layout
    Preparing search index...

    Class DragActionHandler<TRawDragActions, TDragActions>

    Handles the lifecycle of a drag actions IDragAction and provides additional hooks.

    The first action instance that can handle the request is passed control of the event handlers until the request changes.

    Type Parameters

    Index

    Constructors

    constructor

    Properties

    actions activeAction? boundCancel defaultOnDragChange eventCanceller hooks shapes textHints

    Methods

    cancel eventHandler onDragApply onDragChange setTextHints debugState

    Constructors

    • Type Parameters

      Parameters

      • actions: TRawDragActions
      • hooks: {
            onEnd?: (context: { applied: boolean; cancelled: boolean }) => void;
            onEvent?: (
                e: PointerEvent | KeyboardEvent | undefined,
                cancel: () => void,
            ) => void;
            onRecalculate?: () => void;
            onRequestChange?: (type: keyof TDragActions | undefined) => void;
        } = {}
        • OptionalonEnd?: (context: { applied: boolean; cancelled: boolean }) => void

          Called when the drag action ends either because it was completed or cancelled.

        • OptionalonEvent?: (e: PointerEvent | KeyboardEvent | undefined, cancel: () => void) => void

          Called before searching for a matching action. Useful for re-initializing state.

          Is passed a cancel function if you want to cancel the current drag action.

        • OptionalonRecalculate?: () => void

          Called while dragging during dragChange events. You can use this to update the dragging edges.

        • OptionalonRequestChange?: (type: keyof TDragActions | undefined) => void

          Called when the action requested changes.

      • OptionaldefaultOnDragChange: DragChangeHandler

        Default onDragChange handler for when no action can handle the request.

        Should return true to allow the edges to be moved, or false to prevent it.

      Returns DragActionHandler<TRawDragActions, TDragActions>

    Properties

    actions: TDragActions
    activeAction?: keyof TDragActions
    boundCancel: (
        e: PointerEvent | KeyboardEvent | undefined,
        state: DragState,
    ) => void
    defaultOnDragChange: DragChangeHandler = ...
    eventCanceller:
        | (
            (e: PointerEvent | KeyboardEvent | undefined, state: DragState) => void
        )
        | undefined = undefined
    hooks: {
        onEnd?: (context: { applied: boolean; cancelled: boolean }) => void;
        onEvent?: (
            e: PointerEvent | KeyboardEvent | undefined,
            cancel: () => void,
        ) => void;
        onRecalculate?: () => void;
        onRequestChange?: (type: keyof TDragActions | undefined) => void;
    }

    Type Declaration

    • OptionalonEnd?: (context: { applied: boolean; cancelled: boolean }) => void

      Called when the drag action ends either because it was completed or cancelled.

    • OptionalonEvent?: (e: PointerEvent | KeyboardEvent | undefined, cancel: () => void) => void

      Called before searching for a matching action. Useful for re-initializing state.

      Is passed a cancel function if you want to cancel the current drag action.

    • OptionalonRecalculate?: () => void

      Called while dragging during dragChange events. You can use this to update the dragging edges.

    • OptionalonRequestChange?: (type: keyof TDragActions | undefined) => void

      Called when the action requested changes.

    shapes: (
        | {
            attrs?: Record<string, string>;
            data: { height: number; width: number; x: number; y: number };
            type: "square";
        }
        | {
            attrs?: Record<string, string>;
            data: { endX: number; endY: number; startX: number; startY: number };
            type: "edge";
        }
    )[] = []

    All action shapes merged into a single array. If using vue you can set this to a reactive array for reactivity.

    textHints: { actions: string[]; errors: string[] } = ...

    All hint/error text from all actions, updated on every onDragChange. If using vue you can set this to a reactive object for reactivity.

    Methods

    • Parameters

      • e: PointerEvent | KeyboardEvent
      • state: DragState
      • forceRecalculateEdges: () => void

      Returns undefined

    • Type Parameters

      • T extends "start" | "move" | "end"

      Parameters

      • type: T
      • e: T extends "end" ? PointerEvent | undefined : PointerEvent
      • state: DragState
      • forceRecalculateEdges: () => void
      • cancel: (e: PointerEvent | KeyboardEvent | undefined, state: DragState) => void

      Returns DragChangeResult

    • Parameters

      • pluginName: string
      • type: string
      • state: DragState
      • pluginState: Record<string, any> = {}
      • Optionalkey: string | boolean

        Object key to filter the state by, e.g. state.win.frames. If boolean is ignored. The idea is you pass this.debug and users can set this.debug to a string to filter.

      Returns void

    Settings

    Member Visibility

    On This Page

    Constructors
    Properties
    Methods