License	BSD3-style (see the file LICENSE)
Safe Haskell	None
Language	Haskell2010

Miso.Flow.Internal.Bridge

Contents

Store handle
Options
Callbacks out of the gesture system
Wire types (JS -> Haskell payloads)
Store lifecycle
Graph sync
Viewport control
Node measurement
Dragging
Connections
Resizer
Minimap

Description

Low-level bindings to the miso-flow JavaScript bridge (js/miso-flow.js, built from ts/miso-flow.ts), which drives the imperative @xyflow/system modules (XYPanZoom, XYDrag, XYHandle, XYResizer, XYMinimap) against the DOM rendered by miso.

Everything crossing the boundary is JSON. Higher layers (Miso.Flow.Component and the Miso.Flow.* instance modules) wrap this into MVU-friendly interfaces.

Synopsis

newtype FlowStore = FlowStore JSVal
data StoreOptions = StoreOptions {
- soFlowId :: MisoString
- soLib :: MisoString
- soMinZoom :: Double
- soMaxZoom :: Double
- soTranslateExtent :: Maybe CoordinateExtent
- soNodeExtent :: Maybe CoordinateExtent
- soNodeOrigin :: NodeOrigin
- soDefaultViewport :: Viewport
- soSnapToGrid :: Bool
- soSnapGrid :: SnapGrid
- soElevateNodesOnSelect :: Bool
- soZIndexMode :: ZIndexMode
- soNodesDraggable :: Bool
- soAutoPanOnNodeDrag :: Bool
- soAutoPanOnConnect :: Bool
- soAutoPanSpeed :: Double
- soNodeDragThreshold :: Double
- soNodeClickDistance :: Double
- soSelectNodesOnDrag :: Bool
- soConnectionMode :: ConnectionMode
- soConnectionRadius :: Double
- soConnectionDragThreshold :: Double
- soPanOnDrag :: PanOnDrag
- soPanOnScroll :: Bool
- soPanOnScrollMode :: PanOnScrollMode
- soPanOnScrollSpeed :: Double
- soZoomOnScroll :: Bool
- soZoomOnPinch :: Bool
- soZoomOnDoubleClick :: Bool
- soPreventScrolling :: Bool
- soPaneClickDistance :: Double
}
defaultStoreOptions :: StoreOptions
data BridgeCallbacks = BridgeCallbacks {
- bcViewport :: Viewport -> IO ()
- bcViewportStart :: Viewport -> IO ()
- bcViewportEnd :: Viewport -> IO ()
- bcNodeChanges :: [WireNodeChange] -> IO ()
- bcConnectionUpdate :: ConnectionStateWire -> IO ()
- bcConnectStart :: OnConnectStartParams -> IO ()
- bcConnect :: Connection -> IO ()
- bcConnectEnd :: ConnectionStateWire -> IO ()
- bcNodeMouseDown :: NodeId -> Bool -> IO ()
- bcUnselectAll :: IO ()
- bcPaneClick :: IO ()
- bcNodeDragStart :: NodeId -> IO ()
- bcNodeDragStop :: NodeId -> IO ()
- bcResizeChanges :: [WireNodeChange] -> IO ()
- bcDimensions :: Dimensions -> IO ()
- bcSelectionRect :: Rect -> IO ()
- bcSelectionEnd :: Rect -> IO ()
- bcReconnect :: EdgeId -> Connection -> IO ()
- bcResizeStart :: NodeId -> IO ()
- bcResizeEnd :: NodeId -> IO ()
- bcMinimapClick :: XYPosition -> IO ()
- bcDeleteKey :: IO ()
- bcError :: MisoString -> MisoString -> IO ()
}
emptyBridgeCallbacks :: BridgeCallbacks
data WireNodeChange
- = WirePositionChange NodeId (Maybe XYPosition) (Maybe XYPosition) (Maybe Bool)
- | WireDimensionChange NodeId (Maybe Dimensions) (Maybe Bool) SetAttributes (Maybe NodeHandleBounds) (Maybe XYPosition)
- | WireSelectionChange NodeId Bool
- | WireRemoveChange NodeId
data ConnectionStateWire = ConnectionStateWire {
- cwInProgress :: Bool
- cwIsValid :: Maybe Bool
- cwFrom :: Maybe XYPosition
- cwFromHandle :: Maybe Handle
- cwFromPosition :: Maybe Position
- cwFromNode :: Maybe NodeId
- cwTo :: Maybe XYPosition
- cwToHandle :: Maybe Handle
- cwToPosition :: Maybe Position
- cwToNode :: Maybe NodeId
- cwPointer :: Maybe XYPosition
}
wireConnectionState :: (NodeId -> Maybe (InternalNode n)) -> ConnectionStateWire -> ConnectionState n
createFlowStore :: DOMRef -> StoreOptions -> Maybe (Connection -> Bool) -> BridgeCallbacks -> IO FlowStore
storeDestroy :: FlowStore -> IO ()
storeSetNodes :: FlowStore -> [Node n] -> IO ()
storeSetEdges :: FlowStore -> [Edge e] -> IO ()
storeUpdateOptions :: FlowStore -> StoreOptions -> IO ()
storeGetViewport :: FlowStore -> IO (Maybe Viewport)
storeSetViewport :: FlowStore -> Viewport -> ViewportHelperOptions -> IO ()
storeSyncViewport :: FlowStore -> Viewport -> IO ()
storeZoomIn :: FlowStore -> ViewportHelperOptions -> IO ()
storeZoomOut :: FlowStore -> ViewportHelperOptions -> IO ()
storeZoomTo :: FlowStore -> Double -> ViewportHelperOptions -> IO ()
storeScaleBy :: FlowStore -> Double -> ViewportHelperOptions -> IO ()
storeSetCenter :: FlowStore -> Double -> Double -> SetCenterOptions -> IO ()
storeFitView :: FlowStore -> FitViewOptions -> IO ()
storeFitBounds :: FlowStore -> Rect -> FitBoundsOptions -> IO ()
storePanBy :: FlowStore -> XYPosition -> IO ()
storeObserveNode :: FlowStore -> DOMRef -> IO ()
storeUnobserveNode :: FlowStore -> DOMRef -> IO ()
storeRequestNodeMeasure :: FlowStore -> NodeId -> IO ()
storeAttachNodeDrag :: FlowStore -> DOMRef -> NodeId -> IO ()
storeUpdateNodeDrag :: FlowStore -> DOMRef -> NodeId -> IO ()
storeDetachNodeDrag :: FlowStore -> NodeId -> IO ()
storeAttachHandle :: FlowStore -> DOMRef -> IO ()
storeAttachReconnectAnchor :: FlowStore -> DOMRef -> IO ()
storeAttachResizer :: FlowStore -> DOMRef -> NodeId -> Value -> IO ()
storeUpdateResizer :: FlowStore -> NodeId -> DOMRef -> Value -> IO ()
storeDetachResizer :: FlowStore -> NodeId -> DOMRef -> IO ()
storeAttachMinimap :: FlowStore -> DOMRef -> Value -> IO ()
storeUpdateMinimap :: FlowStore -> Value -> IO ()

Store handle

newtype FlowStore Source #

Handle to a JavaScript-side MisoFlowStore.

Constructors

FlowStore JSVal

Instances

Instances details

Eq FlowStore Source #	A component holds at most one store for its whole lifetime, so all handles are interchangeable; this lets models containing a `FlowStore` satisfy the `Eq model` constraint of the miso runtime.
Instance details Defined in Miso.Flow.Internal.Bridge Methods (==) :: FlowStore -> FlowStore -> Bool # (/=) :: FlowStore -> FlowStore -> Bool #

Options

data StoreOptions Source #

Options handed to the JavaScript store; mirrors the union of pane, drag and connection settings across @xyflow/system's modules.

Constructors

StoreOptions

Fields

soFlowId :: MisoString
soLib :: MisoString
soMinZoom :: Double
soMaxZoom :: Double
soTranslateExtent :: Maybe CoordinateExtent
soNodeExtent :: Maybe CoordinateExtent
soNodeOrigin :: NodeOrigin
soDefaultViewport :: Viewport
soSnapToGrid :: Bool
soSnapGrid :: SnapGrid
soElevateNodesOnSelect :: Bool
soZIndexMode :: ZIndexMode
soNodesDraggable :: Bool
soAutoPanOnNodeDrag :: Bool
soAutoPanOnConnect :: Bool
soAutoPanSpeed :: Double
soNodeDragThreshold :: Double
soNodeClickDistance :: Double
soSelectNodesOnDrag :: Bool
soConnectionMode :: ConnectionMode
soConnectionRadius :: Double
soConnectionDragThreshold :: Double
soPanOnDrag :: PanOnDrag
soPanOnScroll :: Bool
soPanOnScrollMode :: PanOnScrollMode
soPanOnScrollSpeed :: Double
soZoomOnScroll :: Bool
soZoomOnPinch :: Bool
soZoomOnDoubleClick :: Bool
soPreventScrolling :: Bool
soPaneClickDistance :: Double

Instances

Instances details

Show StoreOptions Source #
Instance details Defined in Miso.Flow.Internal.Bridge Methods showsPrec :: Int -> StoreOptions -> ShowS # show :: StoreOptions -> String # showList :: [StoreOptions] -> ShowS #
Eq StoreOptions Source #
Instance details Defined in Miso.Flow.Internal.Bridge Methods (==) :: StoreOptions -> StoreOptions -> Bool # (/=) :: StoreOptions -> StoreOptions -> Bool #
ToJSON StoreOptions Source #
Instance details Defined in Miso.Flow.Internal.Bridge Methods toJSON :: StoreOptions -> Value Source # toJSONList :: [StoreOptions] -> Value Source #

defaultStoreOptions :: StoreOptions Source #

Defaults matching xyflow's.

Callbacks out of the gesture system

data BridgeCallbacks Source #

Haskell handlers for events raised by the gesture system. Payloads arrive parsed; hook the ones you need and leave the rest as no-ops (see emptyBridgeCallbacks).

Constructors

BridgeCallbacks

Fields

bcViewport :: Viewport -> IO ()
bcViewportStart :: Viewport -> IO ()
bcViewportEnd :: Viewport -> IO ()
bcNodeChanges :: [WireNodeChange] -> IO ()
bcConnectionUpdate :: ConnectionStateWire -> IO ()
bcConnectStart :: OnConnectStartParams -> IO ()
bcConnect :: Connection -> IO ()
bcConnectEnd :: ConnectionStateWire -> IO ()
bcNodeMouseDown :: NodeId -> Bool -> IO ()
id and whether a multi-selection modifier was held
bcUnselectAll :: IO ()
bcPaneClick :: IO ()
bcNodeDragStart :: NodeId -> IO ()
bcNodeDragStop :: NodeId -> IO ()
bcResizeChanges :: [WireNodeChange] -> IO ()
bcDimensions :: Dimensions -> IO ()
container size, on creation and on resize
bcSelectionRect :: Rect -> IO ()
selection box changed (container coordinates)
bcSelectionEnd :: Rect -> IO ()
selection box released
bcReconnect :: EdgeId -> Connection -> IO ()
an edge anchor was dragged onto a new valid handle
bcResizeStart :: NodeId -> IO ()
bcResizeEnd :: NodeId -> IO ()
bcMinimapClick :: XYPosition -> IO ()
click on the minimap, in flow coordinates
bcDeleteKey :: IO ()
Delete/Backspace pressed outside an input
bcError :: MisoString -> MisoString -> IO ()

emptyBridgeCallbacks :: BridgeCallbacks Source #

Wire types (JS -> Haskell payloads)

data WireNodeChange Source #

One node change as reported by the JavaScript side (drag steps, measurements, resizes). Unlike NodeChange this can carry the DOM-measured handle bounds and absolute position.

Constructors

WirePositionChange NodeId (Maybe XYPosition) (Maybe XYPosition) (Maybe Bool)	id, position, positionAbsolute, dragging
WireDimensionChange NodeId (Maybe Dimensions) (Maybe Bool) SetAttributes (Maybe NodeHandleBounds) (Maybe XYPosition)	id, dimensions, resizing, setAttributes, handleBounds, positionAbsolute
WireSelectionChange NodeId Bool
WireRemoveChange NodeId

Instances

Instances details

Show WireNodeChange Source #
Instance details Defined in Miso.Flow.Internal.Bridge Methods showsPrec :: Int -> WireNodeChange -> ShowS # show :: WireNodeChange -> String # showList :: [WireNodeChange] -> ShowS #
Eq WireNodeChange Source #
Instance details Defined in Miso.Flow.Internal.Bridge Methods (==) :: WireNodeChange -> WireNodeChange -> Bool # (/=) :: WireNodeChange -> WireNodeChange -> Bool #
FromJSON WireNodeChange Source #
Instance details Defined in Miso.Flow.Internal.Bridge Methods parseJSON :: Value -> Parser WireNodeChange Source #

data ConnectionStateWire Source #

Connection state as serialized by the bridge: nodes are referred to by id (resolve them against your NodeLookup via wireConnectionState). Mirroring @xyflow/system, cwFrom is in flow coordinates while cwTo and cwPointer arrive in pane (screen) coordinates — convert them with pointToRendererPoint before rendering.

Constructors

ConnectionStateWire
Fields cwInProgress :: Bool cwIsValid :: Maybe Bool cwFrom :: Maybe XYPosition cwFromHandle :: Maybe Handle cwFromPosition :: Maybe Position cwFromNode :: Maybe NodeId cwTo :: Maybe XYPosition cwToHandle :: Maybe Handle cwToPosition :: Maybe Position cwToNode :: Maybe NodeId cwPointer :: Maybe XYPosition

Instances

Instances details

Show ConnectionStateWire Source #
Instance details Defined in Miso.Flow.Internal.Bridge Methods showsPrec :: Int -> ConnectionStateWire -> ShowS # show :: ConnectionStateWire -> String # showList :: [ConnectionStateWire] -> ShowS #
Eq ConnectionStateWire Source #
Instance details Defined in Miso.Flow.Internal.Bridge Methods (==) :: ConnectionStateWire -> ConnectionStateWire -> Bool # (/=) :: ConnectionStateWire -> ConnectionStateWire -> Bool #
FromJSON ConnectionStateWire Source #
Instance details Defined in Miso.Flow.Internal.Bridge Methods parseJSON :: Value -> Parser ConnectionStateWire Source #

wireConnectionState :: (NodeId -> Maybe (InternalNode n)) -> ConnectionStateWire -> ConnectionState n Source #

Resolve a ConnectionStateWire into a ConnectionState using a node resolver (typically a lookup into your NodeLookup).

Store lifecycle

createFlowStore Source #

Arguments

:: DOMRef
-> StoreOptions
-> Maybe (Connection -> Bool)	synchronous connection validator (XYHandle consults it while the pointer moves, so it cannot go through the action queue)
-> BridgeCallbacks
-> IO FlowStore

Create a JavaScript store over the flow's root element. Expects the element to contain a pane (.<lib>-flow__pane) and a viewport (.xyflow__viewport), as rendered by flowView.

Requires js/miso-flow.js (it defines globalThis.MisoFlow). On the GHCJS/JS backends the library's js-sources links it into the compiled output; on WASM it is spliced in at compile time and evaluated here on first use.

storeDestroy :: FlowStore -> IO () Source #