@ghchinoy/litflow 0.1.1 → 0.2.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1 +1 @@
1
- {"version":3,"file":"litflow.js","sources":["../src/store.ts","../src/lit-node.ts","../src/lit-edge.ts","../src/lit-flow.ts","../src/lit-handle.ts","../src/lit-controls.ts","../src/lit-minimap.ts"],"sourcesContent":["import { signal } from '@lit-labs/signals';\nimport {\n type NodeBase,\n type EdgeBase,\n type InternalNodeBase,\n type CoordinateExtent,\n type NodeOrigin,\n type SnapGrid,\n type Transform,\n type PanZoomInstance,\n type ConnectionInProgress,\n infiniteExtent,\n} from '@xyflow/system';\n\nexport interface FlowState {\n nodes: ReturnType<typeof signal<NodeBase[]>>;\n edges: ReturnType<typeof signal<EdgeBase[]>>;\n nodeLookup: Map<string, InternalNodeBase>;\n parentLookup: Map<string, Map<string, InternalNodeBase>>;\n nodeExtent: CoordinateExtent;\n snapGrid: SnapGrid;\n snapToGrid: boolean;\n nodeOrigin: NodeOrigin;\n multiSelectionActive: boolean;\n transform: ReturnType<typeof signal<Transform>>;\n autoPanOnNodeDrag: boolean;\n nodesDraggable: boolean;\n selectNodesOnDrag: boolean;\n nodeDragThreshold: number;\n panZoom: PanZoomInstance | null;\n domNode: Element | null;\n connectionInProgress: ReturnType<typeof signal<ConnectionInProgress | null>>;\n}\n\nexport function createInitialState(): FlowState {\n return {\n nodes: signal([]),\n edges: signal([]),\n nodeLookup: new Map(),\n parentLookup: new Map(),\n nodeExtent: infiniteExtent,\n snapGrid: [15, 15],\n snapToGrid: false,\n nodeOrigin: [0, 0],\n multiSelectionActive: false,\n transform: signal([0, 0, 1]),\n autoPanOnNodeDrag: true,\n nodesDraggable: true,\n selectNodesOnDrag: true,\n nodeDragThreshold: 0,\n panZoom: null,\n domNode: null,\n connectionInProgress: signal(null),\n };\n}\n","import { LitElement, html } from 'lit';\nimport { customElement, property } from 'lit/decorators.js';\nimport { SignalWatcher } from '@lit-labs/signals';\n\ntype Constructor<T> = new (...args: any[]) => T;\n\n@customElement('lit-node')\nexport class LitNode extends (SignalWatcher as <T extends Constructor<LitElement>>(base: T) => T)(LitElement) {\n createRenderRoot() {\n return this;\n }\n\n @property({ type: String })\n label = '';\n\n @property({ type: String, reflect: true })\n type = 'default';\n\n @property({ type: Object })\n data: any = {};\n\n @property({ type: Boolean, reflect: true })\n selected = false;\n\n @property({ type: String, attribute: 'data-id', reflect: true })\n nodeId = '';\n\n render() {\n return html`\n <div class=\"label\" style=\"font-size: var(--md-sys-typescale-body-medium-size); color: var(--md-sys-color-on-surface); pointer-events: none; font-family: var(--md-sys-typescale-body-medium-font);\">${this.label}</div>\n <slot></slot>\n ${this.type === 'input' || this.type === 'default'\n ? html`<lit-handle type=\"source\" data-handlepos=\"bottom\" data-nodeid=\"${this.nodeId}\"></lit-handle>`\n : ''}\n ${this.type === 'output' || this.type === 'default'\n ? html`<lit-handle type=\"target\" data-handlepos=\"top\" data-nodeid=\"${this.nodeId}\"></lit-handle>`\n : ''}\n `;\n }\n}\n","import { LitElement, css, svg } from 'lit';\nimport { customElement, property } from 'lit/decorators.js';\nimport { SignalWatcher } from '@lit-labs/signals';\nimport { getBezierPath, Position } from '@xyflow/system';\n\ntype Constructor<T> = new (...args: any[]) => T;\n\n@customElement('lit-edge')\nexport class LitEdge extends (SignalWatcher as <T extends Constructor<LitElement>>(base: T) => T)(LitElement) {\n static styles = css`\n :host {\n display: contents;\n }\n\n path {\n fill: none;\n stroke: #b1b1b7;\n stroke-width: 2;\n }\n\n :host([selected]) path {\n stroke: #555;\n }\n `;\n\n @property({ type: Number }) sourceX = 0;\n @property({ type: Number }) sourceY = 0;\n @property({ type: Number }) targetX = 0;\n @property({ type: Number }) targetY = 0;\n @property({ type: String }) sourcePosition = Position.Right;\n @property({ type: String }) targetPosition = Position.Left;\n @property({ type: Boolean, reflect: true }) selected = false;\n\n render() {\n const [path] = getBezierPath({\n sourceX: this.sourceX,\n sourceY: this.sourceY,\n sourcePosition: this.sourcePosition as Position,\n targetX: this.targetX,\n targetY: this.targetY,\n targetPosition: this.targetPosition as Position,\n });\n\n return svg`\n <path d=\"${path}\" />\n `;\n }\n}\n","import { LitElement, css, svg } from 'lit';\nimport { html, unsafeStatic } from 'lit/static-html.js';\nimport { customElement, property, query, state } from 'lit/decorators.js';\nimport { SignalWatcher } from '@lit-labs/signals';\nimport {\n XYPanZoom,\n XYDrag,\n XYHandle,\n ConnectionMode,\n PanOnScrollMode,\n Position,\n type PanZoomInstance,\n type XYDragInstance,\n type Viewport,\n type NodeBase,\n adoptUserNodes,\n updateAbsolutePositions,\n getHandlePosition,\n getBezierPath,\n getSmoothStepPath,\n getStraightPath,\n} from '@xyflow/system';\nimport { createInitialState, type FlowState } from './store';\nimport { m3Tokens } from './theme';\nimport './lit-node';\nimport './lit-edge';\n\ntype Constructor<T> = new (...args: any[]) => T;\n\nconst boolConverter = {\n fromAttribute: (value: string | null) => value !== 'false' && value !== null,\n toAttribute: (value: boolean) => (value ? '' : null),\n};\n\n@customElement('lit-flow')\nexport class LitFlow extends (SignalWatcher as <T extends Constructor<LitElement>>(base: T) => T)(LitElement) {\n static styles = [\n m3Tokens,\n css`\n :host {\n display: block;\n width: 100%;\n height: 100%;\n overflow: hidden;\n position: relative;\n background-color: var(--md-sys-color-background);\n color: var(--md-sys-color-on-background);\n font-family: var(--md-sys-typescale-body-medium-font);\n }\n\n .xyflow__renderer {\n width: 100%;\n height: 100%;\n position: absolute;\n top: 0;\n left: 0;\n }\n\n .xyflow__renderer.has-grid {\n background-image: radial-gradient(var(--md-sys-color-outline-variant) 1px, transparent 0);\n background-size: 20px 20px;\n }\n\n .xyflow__viewport {\n transform-origin: 0 0;\n width: 100%;\n height: 100%;\n }\n\n .xyflow__edges {\n position: absolute;\n width: 100%;\n height: 100%;\n pointer-events: none;\n overflow: visible;\n }\n\n .xyflow__nodes {\n position: absolute;\n width: 100%;\n height: 100%;\n pointer-events: none;\n }\n\n .xyflow__node {\n position: absolute;\n pointer-events: all;\n cursor: grab;\n user-select: none;\n display: block;\n background: var(--lit-flow-node-bg);\n border: 1px solid var(--lit-flow-node-border);\n padding: 12px;\n border-radius: var(--md-sys-shape-corner-small);\n min-width: 120px;\n text-align: center;\n box-shadow: var(--md-sys-elevation-1);\n box-sizing: border-box;\n color: var(--lit-flow-node-text);\n font-size: var(--md-sys-typescale-body-medium-size);\n transition: box-shadow 0.2s ease-in-out, border-color 0.2s ease-in-out;\n }\n\n .xyflow__node[type=\"group\"] {\n padding: 0;\n background: none;\n border: none;\n box-shadow: none;\n pointer-events: none;\n }\n\n .xyflow__node[type=\"group\"] > * {\n pointer-events: all;\n }\n\n .xyflow__node[selected] {\n border-color: var(--lit-flow-node-selected-border);\n border-width: 2px;\n box-shadow: var(--md-sys-elevation-2);\n }\n\n .xyflow__node[type=\"input\"] {\n border-top: 4px solid var(--md-sys-color-primary);\n }\n\n .xyflow__node[type=\"output\"] {\n border-bottom: 4px solid var(--md-sys-color-secondary);\n }\n\n .xyflow__node:active {\n cursor: grabbing;\n }\n\n .lit-flow__handle {\n display: block;\n position: absolute;\n width: 10px;\n height: 10px;\n border-radius: 50%;\n z-index: 10;\n pointer-events: all;\n cursor: pointer;\n border: 2px solid var(--lit-flow-handle-outline);\n background-clip: padding-box;\n box-sizing: border-box;\n transition: transform 0.1s ease-in-out;\n }\n\n .lit-flow__handle:hover {\n transform: scale(1.2);\n }\n\n .lit-flow__handle.source {\n background-color: var(--lit-flow-handle-source);\n }\n\n .lit-flow__handle.target {\n background-color: var(--lit-flow-handle-target);\n }\n\n .lit-flow__handle[data-handlepos=\"top\"] {\n top: -5px;\n left: 50%;\n transform: translateX(-50%);\n }\n\n .lit-flow__handle[data-handlepos=\"bottom\"] {\n bottom: -5px;\n left: 50%;\n transform: translateX(-50%);\n }\n\n .lit-flow__handle[data-handlepos=\"left\"] {\n left: -5px;\n top: 50%;\n transform: translateY(-50%);\n }\n\n .lit-flow__handle[data-handlepos=\"right\"] {\n right: -5px;\n top: 50%;\n transform: translateY(-50%);\n }\n\n .xyflow__connection-path {\n fill: none;\n stroke: var(--md-sys-color-outline);\n stroke-width: 2;\n stroke-dasharray: 5,5;\n pointer-events: none;\n }\n `\n ];\n\n @query('.xyflow__renderer')\n _renderer?: HTMLElement;\n\n @query('.xyflow__viewport')\n _viewport?: HTMLElement;\n\n @state()\n private _panZoom?: PanZoomInstance;\n\n private _drags = new Map<string, XYDragInstance>();\n private _resizeObserver?: ResizeObserver;\n\n @state()\n private _state: FlowState = createInitialState();\n\n @property({ type: Object })\n nodeTypes: Record<string, string> = {\n default: 'lit-node',\n input: 'lit-node',\n output: 'lit-node',\n };\n\n @property({ type: Boolean, attribute: 'show-controls', reflect: true })\n showControls = false;\n\n @property({ type: Boolean, attribute: 'show-minimap', reflect: true, converter: boolConverter })\n showMinimap = false;\n\n @property({ type: Boolean, attribute: 'show-grid', reflect: true, converter: boolConverter })\n showGrid = true;\n\n @property({ type: Boolean, attribute: 'nodes-draggable', reflect: true, converter: boolConverter })\n nodesDraggable = true;\n\n @property({ type: Boolean, attribute: 'nodes-connectable', reflect: true, converter: boolConverter })\n nodesConnectable = true;\n\n @property({ type: Boolean, attribute: 'pan-on-drag', reflect: true, converter: boolConverter })\n panOnDrag = true;\n\n @property({ type: Boolean, attribute: 'zoom-on-scroll', reflect: true, converter: boolConverter })\n zoomOnScroll = true;\n\n @property({ type: Boolean, attribute: 'zoom-on-pinch', reflect: true, converter: boolConverter })\n zoomOnPinch = true;\n\n @property({ type: Boolean, attribute: 'zoom-on-double-click', reflect: true, converter: boolConverter })\n zoomOnDoubleClick = true;\n\n @state()\n private _width = 0;\n\n @state()\n private _height = 0;\n\n @property({ type: Array })\n set nodes(nodes: NodeBase[]) {\n this._state.nodes.set(nodes);\n adoptUserNodes(nodes, this._state.nodeLookup, this._state.parentLookup, {\n nodeOrigin: this._state.nodeOrigin,\n nodeExtent: this._state.nodeExtent,\n });\n updateAbsolutePositions(this._state.nodeLookup, this._state.parentLookup, {\n nodeOrigin: this._state.nodeOrigin,\n nodeExtent: this._state.nodeExtent,\n });\n }\n\n get nodes() {\n return this._state.nodes.get();\n }\n\n @property({ type: Array })\n set edges(edges: any[]) {\n this._state.edges.set(edges);\n }\n\n get edges() {\n return this._state.edges.get();\n }\n\n @property({ type: Object })\n viewport: Viewport = { x: 0, y: 0, zoom: 1 };\n\n connectedCallback() {\n super.connectedCallback();\n this._resizeObserver = new ResizeObserver((entries) => {\n for (const entry of entries) {\n if (entry.target === this) {\n this._width = entry.contentRect.width;\n this._height = entry.contentRect.height;\n } else if (entry.target === this._renderer) {\n // Handle renderer resize if needed\n } else {\n const id = (entry.target as HTMLElement).dataset.id;\n if (id) {\n this._updateNodeDimensions(id, entry.target as HTMLElement);\n }\n }\n }\n });\n this._resizeObserver.observe(this);\n }\n\n disconnectedCallback() {\n super.disconnectedCallback();\n this._resizeObserver?.disconnect();\n }\n\n private async _updateNodeDimensions(id: string, element: HTMLElement) {\n const node = this._state.nodeLookup.get(id);\n if (node) {\n // Wait for Lit element to finish rendering its shadow DOM\n if ('updateComplete' in element) {\n await (element as any).updateComplete;\n }\n\n const { width, height } = element.getBoundingClientRect();\n const zoom = this._state.transform.get()[2];\n node.measured = {\n width: width / zoom,\n height: height / zoom,\n };\n\n // Sync back to user node to preserve dimensions across adoptUserNodes calls\n const userNode = this.nodes.find((n) => n.id === id);\n if (userNode) {\n userNode.measured = node.measured;\n }\n\n // Update handle bounds\n // Since lit-node is now light-DOM, we look in the element itself, not shadowRoot\n const handles = element.querySelectorAll('lit-handle');\n if (handles && handles.length > 0) {\n const sourceBounds: any[] = [];\n const targetBounds: any[] = [];\n\n handles.forEach((h: any) => {\n const bounds = h.getBoundingClientRect();\n const nodeRect = element.getBoundingClientRect();\n const handleData = {\n id: h.handleId || null,\n type: h.type,\n position: h.position,\n x: (bounds.left - nodeRect.left) / zoom,\n y: (bounds.top - nodeRect.top) / zoom,\n width: bounds.width / zoom,\n height: bounds.height / zoom,\n };\n\n if (h.type === 'source') sourceBounds.push(handleData);\n else targetBounds.push(handleData);\n });\n\n node.internals.handleBounds = {\n source: sourceBounds,\n target: targetBounds,\n };\n console.log(`Node ${id} handleBounds:`, node.internals.handleBounds);\n }\n\n // Update absolute positions without clearing the lookup\n updateAbsolutePositions(this._state.nodeLookup, this._state.parentLookup, {\n nodeOrigin: this._state.nodeOrigin,\n nodeExtent: this._state.nodeExtent,\n });\n\n // Trigger update via signal\n this._state.nodes.set([...this.nodes]);\n }\n }\n\n private _selectNode(id: string, multi: boolean) {\n const newNodes = this.nodes.map((node) => {\n if (node.id === id) {\n return { ...node, selected: !node.selected };\n }\n return multi ? node : { ...node, selected: false };\n });\n this.nodes = newNodes;\n }\n\n firstUpdated() {\n if (this._renderer) {\n this._state.domNode = this._renderer;\n this._resizeObserver?.observe(this._renderer);\n\n // Clear selection on background click\n this._renderer.onclick = () => {\n this.nodes = this.nodes.map(n => ({ ...n, selected: false }));\n };\n\n this._panZoom = XYPanZoom({\n domNode: this._renderer,\n minZoom: 0.5,\n maxZoom: 2,\n translateExtent: this._state.nodeExtent,\n viewport: this.viewport,\n onDraggingChange: () => {},\n onPanZoom: (_, { x, y, zoom }) => {\n this.viewport = { x, y, zoom };\n this._state.transform.set([x, y, zoom]);\n if (this._viewport) {\n this._viewport.style.transform = `translate(${x}px,${y}px) scale(${zoom})`;\n }\n },\n });\n\n this._panZoom.update({\n noWheelClassName: 'nowheel',\n noPanClassName: 'nopan',\n preventScrolling: true,\n panOnScroll: false,\n panOnDrag: this.panOnDrag,\n panOnScrollMode: PanOnScrollMode.Free,\n panOnScrollSpeed: 0.5,\n userSelectionActive: false,\n zoomOnPinch: this.zoomOnPinch,\n zoomOnScroll: this.zoomOnScroll,\n zoomOnDoubleClick: this.zoomOnDoubleClick,\n zoomActivationKeyPressed: false,\n lib: 'lit',\n onTransformChange: () => {},\n connectionInProgress: false,\n paneClickDistance: 0,\n });\n\n this._state.panZoom = this._panZoom;\n }\n }\n\n updated(changedProperties: Map<string, any>) {\n if (changedProperties.has('nodes') || changedProperties.has('nodesDraggable')) {\n this._setupDrags();\n }\n\n if (this._panZoom && (\n changedProperties.has('panOnDrag') ||\n changedProperties.has('zoomOnScroll') ||\n changedProperties.has('zoomOnPinch') ||\n changedProperties.has('zoomOnDoubleClick')\n )) {\n this._panZoom.update({\n noWheelClassName: 'nowheel',\n noPanClassName: 'nopan',\n preventScrolling: true,\n panOnScroll: false,\n panOnDrag: this.panOnDrag,\n panOnScrollMode: PanOnScrollMode.Free,\n panOnScrollSpeed: 0.5,\n userSelectionActive: false,\n zoomOnPinch: this.zoomOnPinch,\n zoomOnScroll: this.zoomOnScroll,\n zoomOnDoubleClick: this.zoomOnDoubleClick,\n zoomActivationKeyPressed: false,\n lib: 'lit',\n onTransformChange: () => {},\n connectionInProgress: false,\n paneClickDistance: 0,\n });\n }\n }\n\n private _setupDrags() {\n const nodeElements = this.shadowRoot?.querySelectorAll('.xyflow__node');\n const currentIds = new Set<string>();\n\n nodeElements?.forEach((el) => {\n const id = (el as HTMLElement).dataset.id;\n if (id) {\n currentIds.add(id);\n this._resizeObserver?.observe(el);\n \n // Add click listener for selection\n (el as HTMLElement).onclick = (e) => {\n e.stopPropagation();\n this._selectNode(id, e.shiftKey || e.metaKey);\n };\n\n // Update cursor based on draggability\n (el as HTMLElement).style.cursor = this.nodesDraggable ? 'grab' : 'default';\n\n if (!this.nodesDraggable) {\n this._drags.delete(id);\n return;\n }\n\n let dragInstance = this._drags.get(id);\n if (!dragInstance) {\n dragInstance = XYDrag({\n getStoreItems: () => ({\n ...this._state,\n nodes: this._state.nodes.get(),\n edges: this._state.edges.get(),\n transform: this._state.transform.get(),\n panBy: async (delta) => {\n const { panZoom, nodeExtent } = this._state;\n const transform = this._state.transform.get();\n if (!panZoom) return false;\n const nextViewport = await panZoom.setViewportConstrained(\n {\n x: transform[0] + delta.x,\n y: transform[1] + delta.y,\n zoom: transform[2],\n },\n [[0, 0], [this.offsetWidth, this.offsetHeight]],\n nodeExtent\n );\n return !!nextViewport;\n },\n updateNodePositions: (dragItems) => {\n dragItems.forEach((item, id) => {\n const node = this._state.nodeLookup.get(id);\n if (node) {\n node.position = item.position;\n node.internals.positionAbsolute = item.internals.positionAbsolute;\n const userNode = this.nodes.find((n) => n.id === id);\n if (userNode) userNode.position = item.position;\n }\n });\n\n // Recalculate all absolute positions to ensure children follow parents\n updateAbsolutePositions(this._state.nodeLookup, this._state.parentLookup, {\n nodeOrigin: this._state.nodeOrigin,\n nodeExtent: this._state.nodeExtent,\n });\n\n // Trigger update via signal\n this._state.nodes.set([...this.nodes]);\n },\n unselectNodesAndEdges: () => {},\n }),\n });\n this._drags.set(id, dragInstance);\n }\n\n dragInstance.update({\n domNode: el as HTMLElement,\n nodeId: id,\n });\n }\n });\n\n // Clean up stale drag instances\n for (const id of this._drags.keys()) {\n if (!currentIds.has(id)) {\n this._drags.delete(id);\n }\n }\n }\n\n private _renderEdge(edge: any) {\n const sourceNode = this._state.nodeLookup.get(edge.source);\n const targetNode = this._state.nodeLookup.get(edge.target);\n if (!sourceNode || !targetNode) return null;\n\n // Check if either node is hidden in the user-facing nodes array\n const userSource = this.nodes.find(n => n.id === edge.source);\n const userTarget = this.nodes.find(n => n.id === edge.target);\n if (userSource?.hidden || userTarget?.hidden) return null;\n\n const sourceHandle = (sourceNode.internals.handleBounds?.source || []).find(\n (h: any) => h.id === (edge.sourceHandle || null)\n ) || sourceNode.internals.handleBounds?.source?.[0] || { \n id: null, \n type: 'source', \n nodeId: edge.source, \n position: Position.Bottom, \n x: (sourceNode.measured.width || 0) / 2, \n y: sourceNode.measured.height || 0, \n width: 1, \n height: 1 \n };\n\n const targetHandle = (targetNode.internals.handleBounds?.target || []).find(\n (h: any) => h.id === (edge.targetHandle || null)\n ) || targetNode.internals.handleBounds?.target?.[0] || { \n id: null, \n type: 'target', \n nodeId: edge.target, \n position: Position.Top, \n x: (targetNode.measured.width || 0) / 2, \n y: 0, \n width: 1, \n height: 1 \n };\n\n const sPos = getHandlePosition(sourceNode, sourceHandle, sourceHandle.position, true);\n const tPos = getHandlePosition(targetNode, targetHandle, targetHandle.position, true);\n\n let path = '';\n const pathParams = {\n sourceX: sPos.x,\n sourceY: sPos.y,\n sourcePosition: sourceHandle.position,\n targetX: tPos.x,\n targetY: tPos.y,\n targetPosition: targetHandle.position,\n };\n\n switch (edge.type) {\n case 'straight':\n [path] = getStraightPath(pathParams);\n break;\n case 'smoothstep':\n [path] = getSmoothStepPath(pathParams);\n break;\n case 'step':\n [path] = getSmoothStepPath({ ...pathParams, borderRadius: 0 });\n break;\n case 'bezier':\n default:\n [path] = getBezierPath(pathParams);\n break;\n }\n\n return svg`\n <path\n d=\"${path}\"\n fill=\"none\"\n stroke=\"${edge.selected ? 'var(--md-sys-color-primary)' : 'var(--md-sys-color-outline-variant)'}\"\n stroke-width=\"2\"\n style=\"pointer-events: none;\"\n />\n `;\n }\n\n private _onHandlePointerDown(e: CustomEvent) {\n const { event, handleId, nodeId, type, handleDomNode } = e.detail;\n const isTarget = type === 'target';\n\n // Prevent starting a new connection if one is already in progress or if connectable is false\n if (this._state.connectionInProgress.get() || !this.nodesConnectable) {\n return;\n }\n\n const bounds = handleDomNode.getBoundingClientRect();\n const nodeRect = handleDomNode.parentElement?.getBoundingClientRect();\n const zoom = this._state.transform.get()[2];\n\n const fromHandle = {\n id: handleId,\n nodeId,\n type,\n position: handleDomNode.position,\n x: (bounds.left - (nodeRect?.left ?? 0)) / zoom,\n y: (bounds.top - (nodeRect?.top ?? 0)) / zoom,\n width: bounds.width / zoom,\n height: bounds.height / zoom,\n };\n\n XYHandle.onPointerDown(event, {\n handleId,\n nodeId,\n isTarget,\n domNode: this._renderer as HTMLDivElement,\n handleDomNode,\n nodeLookup: this._state.nodeLookup,\n connectionMode: ConnectionMode.Strict,\n lib: 'lit',\n autoPanOnConnect: true,\n flowId: 'lit-flow',\n dragThreshold: 0,\n panBy: async (delta) => {\n const viewport = this._panZoom?.getViewport();\n if (!viewport) return false;\n await this._panZoom?.setViewport({\n x: viewport.x + delta.x,\n y: viewport.y + delta.y,\n zoom: viewport.zoom,\n });\n return true;\n },\n getTransform: () => this._state.transform.get(),\n getFromHandle: () => fromHandle,\n updateConnection: (conn) => {\n if (conn.inProgress) {\n this._state.connectionInProgress.set(conn);\n } else {\n this._state.connectionInProgress.set(null);\n }\n },\n cancelConnection: () => {\n this._state.connectionInProgress.set(null);\n },\n onConnect: (connection) => {\n this.dispatchEvent(new CustomEvent('connect', {\n detail: connection\n }));\n // Default behavior: add the edge\n const id = `e-${connection.source}${connection.sourceHandle || ''}-${connection.target}${connection.targetHandle || ''}`;\n this.edges = [...this.edges, { ...connection, id }];\n },\n connectionRadius: 20,\n });\n }\n\n private _renderConnectionLine(conn: any) {\n if (!conn) return null;\n\n const [path] = getBezierPath({\n sourceX: conn.from.x,\n sourceY: conn.from.y,\n sourcePosition: conn.fromPosition,\n targetX: conn.to.x,\n targetY: conn.to.y,\n targetPosition: conn.toPosition,\n });\n\n return svg`\n <path\n class=\"xyflow__connection-path\"\n d=\"${path}\"\n fill=\"none\"\n stroke=\"#b1b1b7\"\n stroke-width=\"2\"\n stroke-dasharray=\"5,5\"\n />\n `;\n }\n\n render() {\n const transform = this._state.transform.get();\n const connectionInProgress = this._state.connectionInProgress.get();\n\n return html`\n <div class=\"xyflow__renderer ${this.showGrid ? 'has-grid' : ''}\">\n <div\n class=\"xyflow__viewport\"\n style=\"transform: translate(${transform[0]}px, ${transform[1]}px) scale(${transform[2]})\"\n >\n <div class=\"xyflow__nodes\" @handle-pointer-down=\"${this._onHandlePointerDown}\">\n ${this.nodes.map((node) => {\n if (node.hidden) return null;\n const internalNode = this._state.nodeLookup.get(node.id);\n const pos = internalNode?.internals.positionAbsolute || node.position;\n const tagName = this.nodeTypes[node.type || 'default'] || this.nodeTypes.default;\n const tag = unsafeStatic(tagName);\n\n const style = (node as any).style || {};\n const styleString = Object.entries(style)\n .map(([k, v]) => `${k.replace(/([A-Z])/g, '-$1').toLowerCase()}: ${typeof v === 'number' ? `${v}px` : v}`)\n .join('; ');\n\n const width = (node as any).width || style.width;\n const height = (node as any).height || style.height;\n const widthStyle = width ? `width: ${typeof width === 'number' ? `${width}px` : width};` : '';\n const heightStyle = height ? `height: ${typeof height === 'number' ? `${height}px` : height};` : '';\n const zIndex = (node as any).zIndex ? `z-index: ${(node as any).zIndex};` : '';\n\n return html`\n <${tag}\n class=\"xyflow__node\"\n data-id=\"${node.id}\"\n type=\"${node.type || 'default'}\"\n .nodeId=\"${node.id}\"\n style=\"transform: translate(${pos.x}px, ${pos.y}px); ${styleString} ${widthStyle} ${heightStyle} ${zIndex}\"\n .data=\"${node.data}\"\n .label=\"${(node.data as any).label}\"\n .type=\"${node.type || 'default'}\"\n ?selected=\"${node.selected}\"\n >\n </${tag}>\n `;\n })}\n </div>\n <svg class=\"xyflow__edges\">\n ${this.edges.map((edge) => this._renderEdge(edge))}\n ${this._renderConnectionLine(connectionInProgress)}\n </svg>\n </div>\n </div>\n ${this.showControls\n ? html`<lit-controls .panZoom=\"${this._panZoom}\"></lit-controls>`\n : ''}\n ${this.showMinimap\n ? html`\n <lit-minimap\n .panZoom=\"${this._panZoom}\"\n .nodeLookup=\"${this._state.nodeLookup}\"\n .transform=\"${this._state.transform.get()}\"\n .translateExtent=\"${this._state.nodeExtent}\"\n .width=\"${this._width}\"\n .height=\"${this._height}\"\n ></lit-minimap>\n `\n : ''}\n `;\n }\n}","import { LitElement, html } from 'lit';\nimport { customElement, property } from 'lit/decorators.js';\nimport { Position } from '@xyflow/system';\n\n@customElement('lit-handle')\nexport class LitHandle extends LitElement {\n createRenderRoot() {\n return this;\n }\n\n @property({ type: String, reflect: true })\n type: 'source' | 'target' = 'source';\n\n @property({ type: String, reflect: true, attribute: 'data-handlepos' })\n position: Position = Position.Top;\n\n @property({ type: String, reflect: true, attribute: 'data-handleid' })\n handleId?: string;\n\n @property({ type: String, reflect: true, attribute: 'data-nodeid' })\n nodeId?: string;\n\n constructor() {\n super();\n this.addEventListener('mousedown', (e) => this._onPointerDown(e));\n this.addEventListener('touchstart', (e) => this._onPointerDown(e));\n }\n\n private _onPointerDown(e: MouseEvent | TouchEvent) {\n e.stopPropagation();\n const nodeId = this.getAttribute('data-nodeid');\n \n this.dispatchEvent(new CustomEvent('handle-pointer-down', {\n bubbles: true,\n composed: true,\n detail: {\n event: e,\n handleId: this.handleId,\n nodeId,\n type: this.type,\n handleDomNode: this,\n }\n }));\n }\n\n connectedCallback() {\n super.connectedCallback();\n this.classList.add('lit-flow__handle');\n this.classList.add(this.type);\n this.classList.add('connectable');\n this.classList.add('connectableend');\n }\n\n updated(changedProperties: Map<string, any>) {\n if (changedProperties.has('nodeId') || changedProperties.has('handleId') || changedProperties.has('type')) {\n this.setAttribute('data-id', `lit-flow-${this.nodeId || ''}-${this.handleId || ''}-${this.type}`);\n }\n }\n\n render() {\n return html`\n <div style=\"\n width: 100%;\n height: 100%;\n background: inherit;\n border-radius: inherit;\n pointer-events: none;\n \"></div>\n `;\n }\n}","import { LitElement, html, css } from 'lit';\nimport { customElement, property } from 'lit/decorators.js';\nimport { SignalWatcher } from '@lit-labs/signals';\nimport { type PanZoomInstance } from '@xyflow/system';\n\ntype Constructor<T> = new (...args: any[]) => T;\n\n@customElement('lit-controls')\nexport class LitControls extends (SignalWatcher as <T extends Constructor<LitElement>>(base: T) => T)(LitElement) {\n static styles = css`\n :host {\n display: block;\n position: absolute;\n left: 16px;\n bottom: 16px;\n z-index: 5;\n display: flex;\n flex-direction: column;\n gap: 2px;\n background: var(--md-sys-color-surface);\n padding: 4px;\n border-radius: var(--md-sys-shape-corner-small);\n box-shadow: var(--md-sys-elevation-1);\n border: 1px solid var(--md-sys-color-outline-variant);\n }\n\n button {\n width: 32px;\n height: 32px;\n display: flex;\n align-items: center;\n justify-content: center;\n background: none;\n border: none;\n border-radius: var(--md-sys-shape-corner-extra-small);\n cursor: pointer;\n padding: 0;\n color: var(--md-sys-color-on-surface-variant);\n transition: background-color 0.2s ease, color 0.2s ease;\n }\n\n button:hover {\n background: var(--md-sys-color-secondary-container);\n color: var(--md-sys-color-on-secondary-container);\n }\n\n button svg {\n width: 20px;\n height: 20px;\n fill: currentColor;\n }\n `;\n\n @property({ type: Object })\n panZoom?: PanZoomInstance;\n\n private _zoomIn() {\n this.panZoom?.scaleBy(1.2);\n }\n\n private _zoomOut() {\n this.panZoom?.scaleBy(1 / 1.2);\n }\n\n private _fitView() {\n // fitView implementation will need more data from the flow\n // for now just a placeholder or simple zoom reset\n this.panZoom?.setViewport({ x: 0, y: 0, zoom: 1 });\n }\n\n render() {\n return html`\n <button @click=\"${this._zoomIn}\" title=\"Zoom In\">\n <svg viewBox=\"0 0 24 24\"><path d=\"M19 13h-6v6h-2v-6H5v-2h6V5h2v6h6v2z\"/></svg>\n </button>\n <button @click=\"${this._zoomOut}\" title=\"Zoom Out\">\n <svg viewBox=\"0 0 24 24\"><path d=\"M19 13H5v-2h14v2z\"/></svg>\n </button>\n <button @click=\"${this._fitView}\" title=\"Reset View\">\n <svg viewBox=\"0 0 24 24\"><path d=\"M4 6h16v2H4zm0 5h16v2H4zm0 5h16v2H4z\"/></svg>\n </button>\n `;\n }\n}\n","import { LitElement, html, css, svg } from 'lit';\nimport { customElement, property, state } from 'lit/decorators.js';\nimport { SignalWatcher } from '@lit-labs/signals';\nimport {\n getInternalNodesBounds,\n getBoundsOfRects,\n XYMinimap,\n type Rect,\n type XYMinimapInstance,\n type PanZoomInstance,\n type InternalNodeBase,\n type Transform,\n} from '@xyflow/system';\n\ntype Constructor<T> = new (...args: any[]) => T;\n\n@customElement('lit-minimap')\nexport class LitMinimap extends (SignalWatcher as <T extends Constructor<LitElement>>(base: T) => T)(LitElement) {\n static styles = css`\n :host {\n display: block;\n position: absolute;\n right: 16px;\n bottom: 16px;\n z-index: 5;\n background: var(--md-sys-color-surface);\n border: 1px solid var(--md-sys-color-outline-variant);\n border-radius: var(--md-sys-shape-corner-small);\n box-shadow: var(--md-sys-elevation-1);\n overflow: hidden;\n }\n\n svg {\n display: block;\n }\n\n .minimap-node {\n fill: var(--md-sys-color-surface-variant);\n stroke: var(--md-sys-color-outline-variant);\n stroke-width: 0.5;\n }\n\n .minimap-mask {\n fill: var(--lit-flow-minimap-mask);\n fill-rule: evenodd;\n }\n `;\n\n @property({ type: Object })\n panZoom?: PanZoomInstance;\n\n @property({ type: Object })\n nodeLookup = new Map<string, InternalNodeBase>();\n\n @property({ type: Array })\n transform: Transform = [0, 0, 1];\n\n @property({ type: Array })\n translateExtent: [[number, number], [number, number]] = [[-Infinity, -Infinity], [Infinity, Infinity]];\n\n @property({ type: Number })\n width = 0;\n\n @property({ type: Number })\n height = 0;\n\n @state()\n private _minimapInstance?: XYMinimapInstance;\n\n updated(changedProperties: Map<string, any>) {\n if (!this._minimapInstance && this.panZoom) {\n const svgEl = this.shadowRoot?.querySelector('svg');\n if (svgEl) {\n this._minimapInstance = XYMinimap({\n domNode: svgEl,\n panZoom: this.panZoom,\n getTransform: () => this.transform,\n getViewScale: () => {\n const boundingRect = this._getBoundingRect();\n return Math.max(boundingRect.width / 200, boundingRect.height / 150);\n },\n });\n }\n }\n\n if (this._minimapInstance && (changedProperties.has('width') || changedProperties.has('height') || changedProperties.has('translateExtent'))) {\n this._minimapInstance.update({\n width: this.width,\n height: this.height,\n translateExtent: this.translateExtent,\n });\n }\n }\n\n private _getBoundingRect(): Rect {\n const viewBB: Rect = {\n x: -this.transform[0] / this.transform[2],\n y: -this.transform[1] / this.transform[2],\n width: this.width / this.transform[2],\n height: this.height / this.transform[2],\n };\n\n return this.nodeLookup.size > 0\n ? getBoundsOfRects(getInternalNodesBounds(this.nodeLookup), viewBB)\n : viewBB;\n }\n\n render() {\n const boundingRect = this._getBoundingRect();\n const viewBB: Rect = {\n x: -this.transform[0] / this.transform[2],\n y: -this.transform[1] / this.transform[2],\n width: this.width / this.transform[2],\n height: this.height / this.transform[2],\n };\n\n const elementWidth = 200;\n const elementHeight = 150;\n const scaledWidth = boundingRect.width / elementWidth;\n const scaledHeight = boundingRect.height / elementHeight;\n const viewScale = Math.max(scaledWidth, scaledHeight);\n const viewWidth = viewScale * elementWidth;\n const viewHeight = viewScale * elementHeight;\n const offset = 5 * viewScale;\n\n const x = boundingRect.x - (viewWidth - boundingRect.width) / 2 - offset;\n const y = boundingRect.y - (viewHeight - boundingRect.height) / 2 - offset;\n const width = viewWidth + offset * 2;\n const height = viewHeight + offset * 2;\n\n return html`\n <svg\n width=\"${elementWidth}\"\n height=\"${elementHeight}\"\n viewBox=\"${x} ${y} ${width} ${height}\"\n >\n ${Array.from(this.nodeLookup.values()).map((node) => {\n const { x, y } = node.internals.positionAbsolute;\n const w = node.measured.width || 0;\n const h = node.measured.height || 0;\n return svg`\n <rect\n class=\"minimap-node\"\n x=\"${x}\"\n y=\"${y}\"\n width=\"${w}\"\n height=\"${h}\"\n rx=\"2\"\n ry=\"2\"\n />\n `;\n })}\n <path\n class=\"minimap-mask\"\n d=\"M${x - offset},${y - offset}h${width + offset * 2}v${height + offset * 2}h${-width - offset * 2}z\n M${viewBB.x},${viewBB.y}h${viewBB.width}v${viewBB.height}h${-viewBB.width}z\"\n />\n </svg>\n `;\n }\n}\n"],"names":["createInitialState","signal","infiniteExtent","LitNode","SignalWatcher","LitElement","html","__decorateClass","property","customElement","LitEdge","Position","path","getBezierPath","svg","css","boolConverter","value","LitFlow","nodes","adoptUserNodes","updateAbsolutePositions","edges","entries","entry","id","element","node","width","height","zoom","userNode","n","handles","sourceBounds","targetBounds","h","bounds","nodeRect","handleData","multi","newNodes","XYPanZoom","_","x","y","PanOnScrollMode","changedProperties","nodeElements","currentIds","el","e","dragInstance","XYDrag","delta","panZoom","nodeExtent","transform","dragItems","item","edge","sourceNode","targetNode","userSource","userTarget","sourceHandle","targetHandle","sPos","getHandlePosition","tPos","pathParams","getStraightPath","getSmoothStepPath","event","handleId","nodeId","type","handleDomNode","isTarget","fromHandle","XYHandle","ConnectionMode","viewport","conn","connection","connectionInProgress","pos","tagName","tag","unsafeStatic","style","styleString","k","v","widthStyle","heightStyle","zIndex","m3Tokens","query","state","LitHandle","LitControls","LitMinimap","svgEl","XYMinimap","boundingRect","viewBB","getBoundsOfRects","getInternalNodesBounds","elementWidth","elementHeight","scaledWidth","scaledHeight","viewScale","viewWidth","viewHeight","offset","w"],"mappings":"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"}
1
+ {"version":3,"file":"litflow.js","sources":["../src/store.ts","../src/lit-node.ts","../src/lit-edge.ts","../src/lit-flow.ts","../src/lit-handle.ts","../src/lit-controls.ts","../src/lit-minimap.ts","../src/lit-sidebar.ts"],"sourcesContent":["import { signal } from '@lit-labs/signals';\nimport {\n type NodeBase,\n type EdgeBase,\n type InternalNodeBase,\n type CoordinateExtent,\n type NodeOrigin,\n type SnapGrid,\n type Transform,\n type PanZoomInstance,\n type ConnectionInProgress,\n infiniteExtent,\n} from '@xyflow/system';\n\nexport interface FlowState {\n nodes: ReturnType<typeof signal<NodeBase[]>>;\n edges: ReturnType<typeof signal<EdgeBase[]>>;\n nodeLookup: Map<string, InternalNodeBase>;\n parentLookup: Map<string, Map<string, InternalNodeBase>>;\n nodeExtent: CoordinateExtent;\n snapGrid: SnapGrid;\n snapToGrid: boolean;\n nodeOrigin: NodeOrigin;\n multiSelectionActive: boolean;\n transform: ReturnType<typeof signal<Transform>>;\n autoPanOnNodeDrag: boolean;\n nodesDraggable: boolean;\n selectNodesOnDrag: boolean;\n nodeDragThreshold: number;\n panZoom: PanZoomInstance | null;\n domNode: Element | null;\n connectionInProgress: ReturnType<typeof signal<ConnectionInProgress | null>>;\n}\n\nexport function createInitialState(): FlowState {\n return {\n nodes: signal([]),\n edges: signal([]),\n nodeLookup: new Map(),\n parentLookup: new Map(),\n nodeExtent: infiniteExtent,\n snapGrid: [15, 15],\n snapToGrid: false,\n nodeOrigin: [0, 0],\n multiSelectionActive: false,\n transform: signal([0, 0, 1]),\n autoPanOnNodeDrag: true,\n nodesDraggable: true,\n selectNodesOnDrag: true,\n nodeDragThreshold: 0,\n panZoom: null,\n domNode: null,\n connectionInProgress: signal(null),\n };\n}\n","import { LitElement, html } from 'lit';\nimport { customElement, property } from 'lit/decorators.js';\nimport { SignalWatcher } from '@lit-labs/signals';\n\ntype Constructor<T> = new (...args: any[]) => T;\n\n@customElement('lit-node')\nexport class LitNode extends (SignalWatcher as <T extends Constructor<LitElement>>(base: T) => T)(LitElement) {\n createRenderRoot() {\n return this;\n }\n\n @property({ type: String })\n label = '';\n\n @property({ type: String, reflect: true })\n type = 'default';\n\n @property({ type: Object })\n data: any = {};\n\n @property({ type: Boolean, reflect: true })\n selected = false;\n\n @property({ type: String, attribute: 'data-id', reflect: true })\n nodeId = '';\n\n @property({ type: Number, attribute: 'position-x' })\n positionX = 0;\n\n @property({ type: Number, attribute: 'position-y' })\n positionY = 0;\n\n render() {\n return html`\n <div class=\"label\" style=\"font-size: var(--md-sys-typescale-body-medium-size); color: var(--md-sys-color-on-surface); pointer-events: none; font-family: var(--md-sys-typescale-body-medium-font);\">${this.label}</div>\n <slot></slot>\n ${this.type === 'input' || this.type === 'default'\n ? html`<lit-handle type=\"source\" data-handlepos=\"bottom\" data-nodeid=\"${this.nodeId}\"></lit-handle>`\n : ''}\n ${this.type === 'output' || this.type === 'default'\n ? html`<lit-handle type=\"target\" data-handlepos=\"top\" data-nodeid=\"${this.nodeId}\"></lit-handle>`\n : ''}\n `;\n }\n}\n","import { LitElement, css, svg } from 'lit';\nimport { customElement, property } from 'lit/decorators.js';\nimport { SignalWatcher } from '@lit-labs/signals';\nimport { getBezierPath, Position } from '@xyflow/system';\n\ntype Constructor<T> = new (...args: any[]) => T;\n\n@customElement('lit-edge')\nexport class LitEdge extends (SignalWatcher as <T extends Constructor<LitElement>>(base: T) => T)(LitElement) {\n static styles = css`\n :host {\n display: contents;\n }\n\n path {\n fill: none;\n stroke: #b1b1b7;\n stroke-width: 2;\n }\n\n :host([selected]) path {\n stroke: #555;\n }\n `;\n\n @property({ type: Number }) sourceX = 0;\n @property({ type: Number }) sourceY = 0;\n @property({ type: Number }) targetX = 0;\n @property({ type: Number }) targetY = 0;\n @property({ type: String }) sourcePosition = Position.Right;\n @property({ type: String }) targetPosition = Position.Left;\n @property({ type: Boolean, reflect: true }) selected = false;\n\n render() {\n const [path] = getBezierPath({\n sourceX: this.sourceX,\n sourceY: this.sourceY,\n sourcePosition: this.sourcePosition as Position,\n targetX: this.targetX,\n targetY: this.targetY,\n targetPosition: this.targetPosition as Position,\n });\n\n return svg`\n <path d=\"${path}\" />\n `;\n }\n}\n","import { LitElement, css, svg } from 'lit';\nimport { html, unsafeStatic } from 'lit/static-html.js';\nimport { customElement, property, query, state } from 'lit/decorators.js';\nimport { SignalWatcher } from '@lit-labs/signals';\nimport {\n XYPanZoom,\n XYDrag,\n XYHandle,\n ConnectionMode,\n PanOnScrollMode,\n Position,\n type PanZoomInstance,\n type XYDragInstance,\n type Viewport,\n type NodeBase,\n adoptUserNodes,\n updateAbsolutePositions,\n getHandlePosition,\n getBezierPath,\n getSmoothStepPath,\n getStraightPath,\n} from '@xyflow/system';\nimport { createInitialState, type FlowState } from './store';\nimport { m3Tokens } from './theme';\nimport './lit-node';\nimport './lit-edge';\n\ntype Constructor<T> = new (...args: any[]) => T;\n\nconst boolConverter = {\n fromAttribute: (value: string | null) => value !== 'false' && value !== null,\n toAttribute: (value: boolean) => (value ? '' : null),\n};\n\n@customElement('lit-flow')\nexport class LitFlow extends (SignalWatcher as <T extends Constructor<LitElement>>(base: T) => T)(LitElement) {\n static styles = [\n m3Tokens,\n css`\n :host {\n display: block;\n width: 100%;\n height: 100%;\n overflow: hidden;\n position: relative;\n background-color: var(--md-sys-color-background);\n color: var(--md-sys-color-on-background);\n font-family: var(--md-sys-typescale-body-medium-font);\n }\n\n .xyflow__renderer {\n width: 100%;\n height: 100%;\n position: absolute;\n top: 0;\n left: 0;\n }\n\n .xyflow__renderer.has-grid {\n background-image: radial-gradient(var(--md-sys-color-outline-variant) 1px, transparent 0);\n background-size: 20px 20px;\n }\n\n .xyflow__viewport {\n transform-origin: 0 0;\n width: 100%;\n height: 100%;\n }\n\n .xyflow__edges {\n position: absolute;\n width: 100%;\n height: 100%;\n pointer-events: none;\n overflow: visible;\n }\n\n .xyflow__nodes {\n position: absolute;\n width: 100%;\n height: 100%;\n pointer-events: none;\n }\n\n .xyflow__node {\n position: absolute;\n pointer-events: all;\n cursor: grab;\n user-select: none;\n display: block;\n background: var(--lit-flow-node-bg);\n border: 1px solid var(--lit-flow-node-border);\n padding: 12px;\n border-radius: var(--md-sys-shape-corner-small);\n min-width: 120px;\n text-align: center;\n box-shadow: var(--md-sys-elevation-1);\n box-sizing: border-box;\n color: var(--lit-flow-node-text);\n font-size: var(--md-sys-typescale-body-medium-size);\n transition: box-shadow 0.2s ease-in-out, border-color 0.2s ease-in-out;\n }\n\n .xyflow__node[type=\"group\"] {\n padding: 0;\n background: none;\n border: none;\n box-shadow: none;\n pointer-events: none;\n }\n\n .xyflow__node[type=\"group\"] > * {\n pointer-events: all;\n }\n\n .xyflow__node[selected] {\n border-color: var(--lit-flow-node-selected-border);\n border-width: 2px;\n box-shadow: var(--md-sys-elevation-2);\n }\n\n .xyflow__node[type=\"input\"] {\n border-top: 4px solid var(--md-sys-color-primary);\n }\n\n .xyflow__node[type=\"output\"] {\n border-bottom: 4px solid var(--md-sys-color-secondary);\n }\n\n .xyflow__node:active {\n cursor: grabbing;\n }\n\n .lit-flow__handle {\n display: block;\n position: absolute;\n width: 10px;\n height: 10px;\n border-radius: 50%;\n z-index: 10;\n pointer-events: all;\n cursor: pointer;\n border: 2px solid var(--lit-flow-handle-outline);\n background-clip: padding-box;\n box-sizing: border-box;\n transition: transform 0.1s ease-in-out;\n }\n\n .lit-flow__handle:hover {\n transform: scale(1.2);\n }\n\n .lit-flow__handle.source {\n background-color: var(--lit-flow-handle-source);\n }\n\n .lit-flow__handle.target {\n background-color: var(--lit-flow-handle-target);\n }\n\n .lit-flow__handle[data-handlepos=\"top\"] {\n top: -5px;\n left: 50%;\n transform: translateX(-50%);\n }\n\n .lit-flow__handle[data-handlepos=\"bottom\"] {\n bottom: -5px;\n left: 50%;\n transform: translateX(-50%);\n }\n\n .lit-flow__handle[data-handlepos=\"left\"] {\n left: -5px;\n top: 50%;\n transform: translateY(-50%);\n }\n\n .lit-flow__handle[data-handlepos=\"right\"] {\n right: -5px;\n top: 50%;\n transform: translateY(-50%);\n }\n\n .xyflow__connection-path {\n fill: none;\n stroke: var(--md-sys-color-outline);\n stroke-width: 2;\n stroke-dasharray: 5,5;\n pointer-events: none;\n }\n `\n ];\n\n @query('.xyflow__renderer')\n _renderer?: HTMLElement;\n\n @query('.xyflow__viewport')\n _viewport?: HTMLElement;\n\n @state()\n private _panZoom?: PanZoomInstance;\n\n private _drags = new Map<string, XYDragInstance>();\n private _resizeObserver?: ResizeObserver;\n\n @state()\n private _state: FlowState = createInitialState();\n\n @property({ type: Object })\n nodeTypes: Record<string, string> = {\n default: 'lit-node',\n input: 'lit-node',\n output: 'lit-node',\n };\n\n @property({ type: Boolean, attribute: 'show-controls', reflect: true })\n showControls = false;\n\n @property({ type: Boolean, attribute: 'show-minimap', reflect: true, converter: boolConverter })\n showMinimap = false;\n\n @property({ type: Boolean, attribute: 'show-grid', reflect: true, converter: boolConverter })\n showGrid = true;\n\n @property({ type: Boolean, attribute: 'nodes-draggable', reflect: true, converter: boolConverter })\n nodesDraggable = true;\n\n @property({ type: Boolean, attribute: 'nodes-connectable', reflect: true, converter: boolConverter })\n nodesConnectable = true;\n\n @property({ type: Boolean, attribute: 'pan-on-drag', reflect: true, converter: boolConverter })\n panOnDrag = true;\n\n @property({ type: Boolean, attribute: 'zoom-on-scroll', reflect: true, converter: boolConverter })\n zoomOnScroll = true;\n\n @property({ type: Boolean, attribute: 'zoom-on-pinch', reflect: true, converter: boolConverter })\n zoomOnPinch = true;\n\n @property({ type: Boolean, attribute: 'zoom-on-double-click', reflect: true, converter: boolConverter })\n zoomOnDoubleClick = true;\n\n @property({ type: Boolean, attribute: 'prompt-on-drop', reflect: true, converter: boolConverter })\n promptOnDrop = false;\n\n @state()\n private _width = 0;\n\n @state()\n private _height = 0;\n\n @property({ type: Array })\n set nodes(nodes: NodeBase[]) {\n this._state.nodes.set(nodes);\n adoptUserNodes(nodes, this._state.nodeLookup, this._state.parentLookup, {\n nodeOrigin: this._state.nodeOrigin,\n nodeExtent: this._state.nodeExtent,\n });\n updateAbsolutePositions(this._state.nodeLookup, this._state.parentLookup, {\n nodeOrigin: this._state.nodeOrigin,\n nodeExtent: this._state.nodeExtent,\n });\n }\n\n get nodes() {\n return this._state.nodes.get();\n }\n\n private _discoverNodes() {\n if (this.nodes.length > 0) return;\n\n const childNodes = Array.from(this.querySelectorAll('lit-node')) as any[];\n if (childNodes.length > 0) {\n const nodes: NodeBase[] = childNodes.map((el) => ({\n id: el.id || el.getAttribute('id') || `node-${Math.random().toString(36).substr(2, 9)}`,\n type: el.type || el.getAttribute('type') || 'default',\n position: {\n x: parseFloat(el.getAttribute('position-x') || '0'),\n y: parseFloat(el.getAttribute('position-y') || '0'),\n },\n data: {\n label: el.label || el.getAttribute('label') || '',\n ...el.data,\n },\n }));\n this.nodes = nodes;\n // Force update of internal nodeId for child elements\n childNodes.forEach((el, i) => {\n el.nodeId = nodes[i].id;\n });\n }\n }\n\n @property({ type: Array })\n set edges(edges: any[]) {\n this._state.edges.set(edges);\n }\n\n get edges() {\n return this._state.edges.get();\n }\n\n @property({ type: Object })\n viewport: Viewport = { x: 0, y: 0, zoom: 1 };\n\n connectedCallback() {\n super.connectedCallback();\n this._discoverNodes();\n this._resizeObserver = new ResizeObserver((entries) => {\n for (const entry of entries) {\n if (entry.target === this) {\n this._width = entry.contentRect.width;\n this._height = entry.contentRect.height;\n } else if (entry.target === this._renderer) {\n // Handle renderer resize if needed\n } else {\n const id = (entry.target as HTMLElement).dataset.id;\n if (id) {\n this._updateNodeDimensions(id, entry.target as HTMLElement);\n }\n }\n }\n });\n this._resizeObserver.observe(this);\n }\n\n disconnectedCallback() {\n super.disconnectedCallback();\n this._resizeObserver?.disconnect();\n }\n\n private async _updateNodeDimensions(id: string, element: HTMLElement) {\n const node = this._state.nodeLookup.get(id);\n if (node) {\n // Wait for Lit element to finish rendering its shadow DOM\n if ('updateComplete' in element) {\n await (element as any).updateComplete;\n }\n\n const { width, height } = element.getBoundingClientRect();\n const zoom = this._state.transform.get()[2];\n node.measured = {\n width: width / zoom,\n height: height / zoom,\n };\n\n // Sync back to user node to preserve dimensions across adoptUserNodes calls\n const userNode = this.nodes.find((n) => n.id === id);\n if (userNode) {\n userNode.measured = node.measured;\n }\n\n // Update handle bounds\n // Since lit-node is now light-DOM, we look in the element itself, not shadowRoot\n const handles = element.querySelectorAll('lit-handle');\n if (handles && handles.length > 0) {\n const sourceBounds: any[] = [];\n const targetBounds: any[] = [];\n\n handles.forEach((h: any) => {\n const bounds = h.getBoundingClientRect();\n const nodeRect = element.getBoundingClientRect();\n const handleData = {\n id: h.handleId || null,\n type: h.type,\n position: h.position,\n x: (bounds.left - nodeRect.left) / zoom,\n y: (bounds.top - nodeRect.top) / zoom,\n width: bounds.width / zoom,\n height: bounds.height / zoom,\n };\n\n if (h.type === 'source') sourceBounds.push(handleData);\n else targetBounds.push(handleData);\n });\n\n node.internals.handleBounds = {\n source: sourceBounds,\n target: targetBounds,\n };\n console.log(`Node ${id} handleBounds:`, node.internals.handleBounds);\n }\n\n // Update absolute positions without clearing the lookup\n updateAbsolutePositions(this._state.nodeLookup, this._state.parentLookup, {\n nodeOrigin: this._state.nodeOrigin,\n nodeExtent: this._state.nodeExtent,\n });\n\n // Trigger update via signal\n this._state.nodes.set([...this.nodes]);\n }\n }\n\n private _selectNode(id: string, multi: boolean) {\n const newNodes = this.nodes.map((node) => {\n if (node.id === id) {\n return { ...node, selected: !node.selected };\n }\n return multi ? node : { ...node, selected: false };\n });\n this.nodes = newNodes;\n }\n\n /**\n * Projects a screen position (relative to the flow container) to canvas coordinates.\n * Useful for Drag & Drop and context menus.\n */\n project(position: { x: number; y: number }): { x: number; y: number } {\n const [tx, ty, zoom] = this._state.transform.get();\n return {\n x: (position.x - tx) / zoom,\n y: (position.y - ty) / zoom,\n };\n }\n\n firstUpdated() {\n if (this._renderer) {\n this._state.domNode = this._renderer;\n this._resizeObserver?.observe(this._renderer);\n\n // Clear selection on background click\n this._renderer.onclick = () => {\n this.nodes = this.nodes.map(n => ({ ...n, selected: false }));\n };\n\n this._panZoom = XYPanZoom({\n domNode: this._renderer,\n minZoom: 0.5,\n maxZoom: 2,\n translateExtent: this._state.nodeExtent,\n viewport: this.viewport,\n onDraggingChange: () => {},\n onPanZoom: (_, { x, y, zoom }) => {\n this.viewport = { x, y, zoom };\n this._state.transform.set([x, y, zoom]);\n if (this._viewport) {\n this._viewport.style.transform = `translate(${x}px,${y}px) scale(${zoom})`;\n }\n },\n });\n\n this._panZoom.update({\n noWheelClassName: 'nowheel',\n noPanClassName: 'nopan',\n preventScrolling: true,\n panOnScroll: false,\n panOnDrag: this.panOnDrag,\n panOnScrollMode: PanOnScrollMode.Free,\n panOnScrollSpeed: 0.5,\n userSelectionActive: false,\n zoomOnPinch: this.zoomOnPinch,\n zoomOnScroll: this.zoomOnScroll,\n zoomOnDoubleClick: this.zoomOnDoubleClick,\n zoomActivationKeyPressed: false,\n lib: 'lit',\n onTransformChange: () => {},\n connectionInProgress: false,\n paneClickDistance: 0,\n });\n\n this._state.panZoom = this._panZoom;\n }\n }\n\n updated(changedProperties: Map<string, any>) {\n if (changedProperties.has('nodes') || changedProperties.has('nodesDraggable')) {\n this._setupDrags();\n }\n\n if (this._panZoom && (\n changedProperties.has('panOnDrag') ||\n changedProperties.has('zoomOnScroll') ||\n changedProperties.has('zoomOnPinch') ||\n changedProperties.has('zoomOnDoubleClick')\n )) {\n this._panZoom.update({\n noWheelClassName: 'nowheel',\n noPanClassName: 'nopan',\n preventScrolling: true,\n panOnScroll: false,\n panOnDrag: this.panOnDrag,\n panOnScrollMode: PanOnScrollMode.Free,\n panOnScrollSpeed: 0.5,\n userSelectionActive: false,\n zoomOnPinch: this.zoomOnPinch,\n zoomOnScroll: this.zoomOnScroll,\n zoomOnDoubleClick: this.zoomOnDoubleClick,\n zoomActivationKeyPressed: false,\n lib: 'lit',\n onTransformChange: () => {},\n connectionInProgress: false,\n paneClickDistance: 0,\n });\n }\n }\n\n private _setupDrags() {\n const nodeElements = this.shadowRoot?.querySelectorAll('.xyflow__node');\n const currentIds = new Set<string>();\n\n nodeElements?.forEach((el) => {\n const id = (el as HTMLElement).dataset.id;\n if (id) {\n currentIds.add(id);\n this._resizeObserver?.observe(el);\n \n // Add click listener for selection\n (el as HTMLElement).onclick = (e) => {\n e.stopPropagation();\n this._selectNode(id, e.shiftKey || e.metaKey);\n };\n\n // Update cursor based on draggability\n (el as HTMLElement).style.cursor = this.nodesDraggable ? 'grab' : 'default';\n\n if (!this.nodesDraggable) {\n this._drags.delete(id);\n return;\n }\n\n let dragInstance = this._drags.get(id);\n if (!dragInstance) {\n dragInstance = XYDrag({\n getStoreItems: () => ({\n ...this._state,\n nodes: this._state.nodes.get(),\n edges: this._state.edges.get(),\n transform: this._state.transform.get(),\n panBy: async (delta) => {\n const { panZoom, nodeExtent } = this._state;\n const transform = this._state.transform.get();\n if (!panZoom) return false;\n const nextViewport = await panZoom.setViewportConstrained(\n {\n x: transform[0] + delta.x,\n y: transform[1] + delta.y,\n zoom: transform[2],\n },\n [[0, 0], [this.offsetWidth, this.offsetHeight]],\n nodeExtent\n );\n return !!nextViewport;\n },\n updateNodePositions: (dragItems) => {\n dragItems.forEach((item, id) => {\n const node = this._state.nodeLookup.get(id);\n if (node) {\n node.position = item.position;\n node.internals.positionAbsolute = item.internals.positionAbsolute;\n const userNode = this.nodes.find((n) => n.id === id);\n if (userNode) userNode.position = item.position;\n }\n });\n\n // Recalculate all absolute positions to ensure children follow parents\n updateAbsolutePositions(this._state.nodeLookup, this._state.parentLookup, {\n nodeOrigin: this._state.nodeOrigin,\n nodeExtent: this._state.nodeExtent,\n });\n\n // Trigger update via signal\n this._state.nodes.set([...this.nodes]);\n },\n unselectNodesAndEdges: () => {},\n }),\n });\n this._drags.set(id, dragInstance);\n }\n\n dragInstance.update({\n domNode: el as HTMLElement,\n nodeId: id,\n });\n }\n });\n\n // Clean up stale drag instances\n for (const id of this._drags.keys()) {\n if (!currentIds.has(id)) {\n this._drags.delete(id);\n }\n }\n }\n\n private _renderEdge(edge: any) {\n const sourceNode = this._state.nodeLookup.get(edge.source);\n const targetNode = this._state.nodeLookup.get(edge.target);\n if (!sourceNode || !targetNode) return null;\n\n // Check if either node is hidden in the user-facing nodes array\n const userSource = this.nodes.find(n => n.id === edge.source);\n const userTarget = this.nodes.find(n => n.id === edge.target);\n if (userSource?.hidden || userTarget?.hidden) return null;\n\n const sourceHandle = (sourceNode.internals.handleBounds?.source || []).find(\n (h: any) => h.id === (edge.sourceHandle || null)\n ) || sourceNode.internals.handleBounds?.source?.[0] || { \n id: null, \n type: 'source', \n nodeId: edge.source, \n position: Position.Bottom, \n x: (sourceNode.measured.width || 0) / 2, \n y: sourceNode.measured.height || 0, \n width: 1, \n height: 1 \n };\n\n const targetHandle = (targetNode.internals.handleBounds?.target || []).find(\n (h: any) => h.id === (edge.targetHandle || null)\n ) || targetNode.internals.handleBounds?.target?.[0] || { \n id: null, \n type: 'target', \n nodeId: edge.target, \n position: Position.Top, \n x: (targetNode.measured.width || 0) / 2, \n y: 0, \n width: 1, \n height: 1 \n };\n\n const sPos = getHandlePosition(sourceNode, sourceHandle, sourceHandle.position, true);\n const tPos = getHandlePosition(targetNode, targetHandle, targetHandle.position, true);\n\n let path = '';\n const pathParams = {\n sourceX: sPos.x,\n sourceY: sPos.y,\n sourcePosition: sourceHandle.position,\n targetX: tPos.x,\n targetY: tPos.y,\n targetPosition: targetHandle.position,\n };\n\n switch (edge.type) {\n case 'straight':\n [path] = getStraightPath(pathParams);\n break;\n case 'smoothstep':\n [path] = getSmoothStepPath(pathParams);\n break;\n case 'step':\n [path] = getSmoothStepPath({ ...pathParams, borderRadius: 0 });\n break;\n case 'bezier':\n default:\n [path] = getBezierPath(pathParams);\n break;\n }\n\n return svg`\n <path\n d=\"${path}\"\n fill=\"none\"\n stroke=\"${edge.selected ? 'var(--md-sys-color-primary)' : 'var(--md-sys-color-outline-variant)'}\"\n stroke-width=\"2\"\n style=\"pointer-events: none;\"\n />\n `;\n }\n\n private _onHandlePointerDown(e: CustomEvent) {\n const { event, handleId, nodeId, type, handleDomNode } = e.detail;\n const isTarget = type === 'target';\n\n // Prevent starting a new connection if one is already in progress or if connectable is false\n if (this._state.connectionInProgress.get() || !this.nodesConnectable) {\n return;\n }\n\n const bounds = handleDomNode.getBoundingClientRect();\n const nodeRect = handleDomNode.parentElement?.getBoundingClientRect();\n const zoom = this._state.transform.get()[2];\n\n const fromHandle = {\n id: handleId,\n nodeId,\n type,\n position: handleDomNode.position,\n x: (bounds.left - (nodeRect?.left ?? 0)) / zoom,\n y: (bounds.top - (nodeRect?.top ?? 0)) / zoom,\n width: bounds.width / zoom,\n height: bounds.height / zoom,\n };\n\n XYHandle.onPointerDown(event, {\n handleId,\n nodeId,\n isTarget,\n domNode: this._renderer as HTMLDivElement,\n handleDomNode,\n nodeLookup: this._state.nodeLookup,\n connectionMode: ConnectionMode.Strict,\n lib: 'lit',\n autoPanOnConnect: true,\n flowId: 'lit-flow',\n dragThreshold: 0,\n panBy: async (delta) => {\n const viewport = this._panZoom?.getViewport();\n if (!viewport) return false;\n await this._panZoom?.setViewport({\n x: viewport.x + delta.x,\n y: viewport.y + delta.y,\n zoom: viewport.zoom,\n });\n return true;\n },\n getTransform: () => this._state.transform.get(),\n getFromHandle: () => fromHandle,\n updateConnection: (conn) => {\n if (conn.inProgress) {\n this._state.connectionInProgress.set(conn);\n } else {\n this._state.connectionInProgress.set(null);\n }\n },\n cancelConnection: () => {\n this._state.connectionInProgress.set(null);\n },\n onConnect: (connection) => {\n this.dispatchEvent(new CustomEvent('connect', {\n detail: connection\n }));\n // Default behavior: add the edge\n const id = `e-${connection.source}${connection.sourceHandle || ''}-${connection.target}${connection.targetHandle || ''}`;\n this.edges = [...this.edges, { ...connection, id }];\n },\n connectionRadius: 20,\n });\n }\n\n private _onDragOver(e: DragEvent) {\n e.preventDefault();\n if (e.dataTransfer) {\n e.dataTransfer.dropEffect = 'move';\n }\n }\n\n private _onDrop(e: DragEvent) {\n e.preventDefault();\n\n const type = e.dataTransfer?.getData('application/litflow');\n\n // check if the dropped element is valid\n if (typeof type === 'undefined' || !type) {\n return;\n }\n\n // Get the position of the drop relative to the flow container\n const rect = this.getBoundingClientRect();\n const position = this.project({\n x: e.clientX - rect.left,\n y: e.clientY - rect.top,\n });\n\n let label = `${type} node`;\n if (this.promptOnDrop) {\n const userLabel = window.prompt('Enter node label:', label);\n if (userLabel === null) return; // Cancelled\n label = userLabel || label;\n }\n\n const newNode = {\n id: `node_${Date.now()}`,\n type,\n position,\n data: { label },\n };\n\n this.nodes = [...this.nodes, newNode];\n \n this.dispatchEvent(new CustomEvent('node-drop', {\n detail: { node: newNode, event: e }\n }));\n }\n\n private _renderConnectionLine(conn: any) {\n if (!conn) return null;\n\n const [path] = getBezierPath({\n sourceX: conn.from.x,\n sourceY: conn.from.y,\n sourcePosition: conn.fromPosition,\n targetX: conn.to.x,\n targetY: conn.to.y,\n targetPosition: conn.toPosition,\n });\n\n return svg`\n <path\n class=\"xyflow__connection-path\"\n d=\"${path}\"\n fill=\"none\"\n stroke=\"#b1b1b7\"\n stroke-width=\"2\"\n stroke-dasharray=\"5,5\"\n />\n `;\n }\n\n render() {\n const transform = this._state.transform.get();\n const connectionInProgress = this._state.connectionInProgress.get();\n\n return html`\n <div \n class=\"xyflow__renderer ${this.showGrid ? 'has-grid' : ''}\"\n @dragover=\"${this._onDragOver}\"\n @drop=\"${this._onDrop}\"\n >\n <div\n class=\"xyflow__viewport\"\n style=\"transform: translate(${transform[0]}px, ${transform[1]}px) scale(${transform[2]})\"\n >\n <div class=\"xyflow__nodes\" @handle-pointer-down=\"${this._onHandlePointerDown}\">\n ${this.nodes.map((node) => {\n if (node.hidden) return null;\n const internalNode = this._state.nodeLookup.get(node.id);\n const pos = internalNode?.internals.positionAbsolute || node.position;\n const tagName = this.nodeTypes[node.type || 'default'] || this.nodeTypes.default;\n const tag = unsafeStatic(tagName);\n\n const style = (node as any).style || {};\n const styleString = Object.entries(style)\n .map(([k, v]) => `${k.replace(/([A-Z])/g, '-$1').toLowerCase()}: ${typeof v === 'number' ? `${v}px` : v}`)\n .join('; ');\n\n const width = (node as any).width || style.width;\n const height = (node as any).height || style.height;\n const widthStyle = width ? `width: ${typeof width === 'number' ? `${width}px` : width};` : '';\n const heightStyle = height ? `height: ${typeof height === 'number' ? `${height}px` : height};` : '';\n const zIndex = (node as any).zIndex ? `z-index: ${(node as any).zIndex};` : '';\n\n return html`\n <${tag}\n class=\"xyflow__node\"\n data-id=\"${node.id}\"\n type=\"${node.type || 'default'}\"\n .nodeId=\"${node.id}\"\n style=\"transform: translate(${pos.x}px, ${pos.y}px); ${styleString} ${widthStyle} ${heightStyle} ${zIndex}\"\n .data=\"${node.data}\"\n .label=\"${(node.data as any).label}\"\n .type=\"${node.type || 'default'}\"\n ?selected=\"${node.selected}\"\n >\n </${tag}>\n `;\n })}\n </div>\n <svg class=\"xyflow__edges\">\n ${this.edges.map((edge) => this._renderEdge(edge))}\n ${this._renderConnectionLine(connectionInProgress)}\n </svg>\n </div>\n </div>\n ${this.showControls\n ? html`<lit-controls .panZoom=\"${this._panZoom}\"></lit-controls>`\n : ''}\n ${this.showMinimap\n ? html`\n <lit-minimap\n .panZoom=\"${this._panZoom}\"\n .nodeLookup=\"${this._state.nodeLookup}\"\n .transform=\"${this._state.transform.get()}\"\n .translateExtent=\"${this._state.nodeExtent}\"\n .width=\"${this._width}\"\n .height=\"${this._height}\"\n ></lit-minimap>\n `\n : ''}\n <slot style=\"display: none;\"></slot>\n `;\n }\n}","import { LitElement, html } from 'lit';\nimport { customElement, property } from 'lit/decorators.js';\nimport { Position } from '@xyflow/system';\n\n@customElement('lit-handle')\nexport class LitHandle extends LitElement {\n createRenderRoot() {\n return this;\n }\n\n @property({ type: String, reflect: true })\n type: 'source' | 'target' = 'source';\n\n @property({ type: String, reflect: true, attribute: 'data-handlepos' })\n position: Position = Position.Top;\n\n @property({ type: String, reflect: true, attribute: 'data-handleid' })\n handleId?: string;\n\n @property({ type: String, reflect: true, attribute: 'data-nodeid' })\n nodeId?: string;\n\n constructor() {\n super();\n this.addEventListener('mousedown', (e) => this._onPointerDown(e));\n this.addEventListener('touchstart', (e) => this._onPointerDown(e));\n }\n\n private _onPointerDown(e: MouseEvent | TouchEvent) {\n e.stopPropagation();\n const nodeId = this.getAttribute('data-nodeid');\n \n this.dispatchEvent(new CustomEvent('handle-pointer-down', {\n bubbles: true,\n composed: true,\n detail: {\n event: e,\n handleId: this.handleId,\n nodeId,\n type: this.type,\n handleDomNode: this,\n }\n }));\n }\n\n connectedCallback() {\n super.connectedCallback();\n this.classList.add('lit-flow__handle');\n this.classList.add(this.type);\n this.classList.add('connectable');\n this.classList.add('connectableend');\n }\n\n updated(changedProperties: Map<string, any>) {\n if (changedProperties.has('nodeId') || changedProperties.has('handleId') || changedProperties.has('type')) {\n this.setAttribute('data-id', `lit-flow-${this.nodeId || ''}-${this.handleId || ''}-${this.type}`);\n }\n }\n\n render() {\n return html`\n <div style=\"\n width: 100%;\n height: 100%;\n background: inherit;\n border-radius: inherit;\n pointer-events: none;\n \"></div>\n `;\n }\n}","import { LitElement, html, css } from 'lit';\nimport { customElement, property } from 'lit/decorators.js';\nimport { SignalWatcher } from '@lit-labs/signals';\nimport { type PanZoomInstance } from '@xyflow/system';\n\ntype Constructor<T> = new (...args: any[]) => T;\n\n@customElement('lit-controls')\nexport class LitControls extends (SignalWatcher as <T extends Constructor<LitElement>>(base: T) => T)(LitElement) {\n static styles = css`\n :host {\n display: block;\n position: absolute;\n left: 16px;\n bottom: 16px;\n z-index: 5;\n display: flex;\n flex-direction: column;\n gap: 2px;\n background: var(--md-sys-color-surface);\n padding: 4px;\n border-radius: var(--md-sys-shape-corner-small);\n box-shadow: var(--md-sys-elevation-1);\n border: 1px solid var(--md-sys-color-outline-variant);\n }\n\n button {\n width: 32px;\n height: 32px;\n display: flex;\n align-items: center;\n justify-content: center;\n background: none;\n border: none;\n border-radius: var(--md-sys-shape-corner-extra-small);\n cursor: pointer;\n padding: 0;\n color: var(--md-sys-color-on-surface-variant);\n transition: background-color 0.2s ease, color 0.2s ease;\n }\n\n button:hover {\n background: var(--md-sys-color-secondary-container);\n color: var(--md-sys-color-on-secondary-container);\n }\n\n button svg {\n width: 20px;\n height: 20px;\n fill: currentColor;\n }\n `;\n\n @property({ type: Object })\n panZoom?: PanZoomInstance;\n\n private _zoomIn() {\n this.panZoom?.scaleBy(1.2);\n }\n\n private _zoomOut() {\n this.panZoom?.scaleBy(1 / 1.2);\n }\n\n private _fitView() {\n // fitView implementation will need more data from the flow\n // for now just a placeholder or simple zoom reset\n this.panZoom?.setViewport({ x: 0, y: 0, zoom: 1 });\n }\n\n render() {\n return html`\n <button @click=\"${this._zoomIn}\" title=\"Zoom In\">\n <svg viewBox=\"0 0 24 24\"><path d=\"M19 13h-6v6h-2v-6H5v-2h6V5h2v6h6v2z\"/></svg>\n </button>\n <button @click=\"${this._zoomOut}\" title=\"Zoom Out\">\n <svg viewBox=\"0 0 24 24\"><path d=\"M19 13H5v-2h14v2z\"/></svg>\n </button>\n <button @click=\"${this._fitView}\" title=\"Reset View\">\n <svg viewBox=\"0 0 24 24\"><path d=\"M4 6h16v2H4zm0 5h16v2H4zm0 5h16v2H4z\"/></svg>\n </button>\n `;\n }\n}\n","import { LitElement, html, css, svg } from 'lit';\nimport { customElement, property, state } from 'lit/decorators.js';\nimport { SignalWatcher } from '@lit-labs/signals';\nimport {\n getInternalNodesBounds,\n getBoundsOfRects,\n XYMinimap,\n type Rect,\n type XYMinimapInstance,\n type PanZoomInstance,\n type InternalNodeBase,\n type Transform,\n} from '@xyflow/system';\n\ntype Constructor<T> = new (...args: any[]) => T;\n\n@customElement('lit-minimap')\nexport class LitMinimap extends (SignalWatcher as <T extends Constructor<LitElement>>(base: T) => T)(LitElement) {\n static styles = css`\n :host {\n display: block;\n position: absolute;\n right: 16px;\n bottom: 16px;\n z-index: 5;\n background: var(--md-sys-color-surface);\n border: 1px solid var(--md-sys-color-outline-variant);\n border-radius: var(--md-sys-shape-corner-small);\n box-shadow: var(--md-sys-elevation-1);\n overflow: hidden;\n }\n\n svg {\n display: block;\n }\n\n .minimap-node {\n fill: var(--md-sys-color-surface-variant);\n stroke: var(--md-sys-color-outline-variant);\n stroke-width: 0.5;\n }\n\n .minimap-mask {\n fill: var(--lit-flow-minimap-mask);\n fill-rule: evenodd;\n }\n `;\n\n @property({ type: Object })\n panZoom?: PanZoomInstance;\n\n @property({ type: Object })\n nodeLookup = new Map<string, InternalNodeBase>();\n\n @property({ type: Array })\n transform: Transform = [0, 0, 1];\n\n @property({ type: Array })\n translateExtent: [[number, number], [number, number]] = [[-Infinity, -Infinity], [Infinity, Infinity]];\n\n @property({ type: Number })\n width = 0;\n\n @property({ type: Number })\n height = 0;\n\n @state()\n private _minimapInstance?: XYMinimapInstance;\n\n updated(changedProperties: Map<string, any>) {\n if (!this._minimapInstance && this.panZoom) {\n const svgEl = this.shadowRoot?.querySelector('svg');\n if (svgEl) {\n this._minimapInstance = XYMinimap({\n domNode: svgEl,\n panZoom: this.panZoom,\n getTransform: () => this.transform,\n getViewScale: () => {\n const boundingRect = this._getBoundingRect();\n return Math.max(boundingRect.width / 200, boundingRect.height / 150);\n },\n });\n }\n }\n\n if (this._minimapInstance && (changedProperties.has('width') || changedProperties.has('height') || changedProperties.has('translateExtent'))) {\n this._minimapInstance.update({\n width: this.width,\n height: this.height,\n translateExtent: this.translateExtent,\n });\n }\n }\n\n private _getBoundingRect(): Rect {\n const viewBB: Rect = {\n x: -this.transform[0] / this.transform[2],\n y: -this.transform[1] / this.transform[2],\n width: this.width / this.transform[2],\n height: this.height / this.transform[2],\n };\n\n return this.nodeLookup.size > 0\n ? getBoundsOfRects(getInternalNodesBounds(this.nodeLookup), viewBB)\n : viewBB;\n }\n\n render() {\n const boundingRect = this._getBoundingRect();\n const viewBB: Rect = {\n x: -this.transform[0] / this.transform[2],\n y: -this.transform[1] / this.transform[2],\n width: this.width / this.transform[2],\n height: this.height / this.transform[2],\n };\n\n const elementWidth = 200;\n const elementHeight = 150;\n const scaledWidth = boundingRect.width / elementWidth;\n const scaledHeight = boundingRect.height / elementHeight;\n const viewScale = Math.max(scaledWidth, scaledHeight);\n const viewWidth = viewScale * elementWidth;\n const viewHeight = viewScale * elementHeight;\n const offset = 5 * viewScale;\n\n const x = boundingRect.x - (viewWidth - boundingRect.width) / 2 - offset;\n const y = boundingRect.y - (viewHeight - boundingRect.height) / 2 - offset;\n const width = viewWidth + offset * 2;\n const height = viewHeight + offset * 2;\n\n return html`\n <svg\n width=\"${elementWidth}\"\n height=\"${elementHeight}\"\n viewBox=\"${x} ${y} ${width} ${height}\"\n >\n ${Array.from(this.nodeLookup.values()).map((node) => {\n const { x, y } = node.internals.positionAbsolute;\n const w = node.measured.width || 0;\n const h = node.measured.height || 0;\n return svg`\n <rect\n class=\"minimap-node\"\n x=\"${x}\"\n y=\"${y}\"\n width=\"${w}\"\n height=\"${h}\"\n rx=\"2\"\n ry=\"2\"\n />\n `;\n })}\n <path\n class=\"minimap-mask\"\n d=\"M${x - offset},${y - offset}h${width + offset * 2}v${height + offset * 2}h${-width - offset * 2}z\n M${viewBB.x},${viewBB.y}h${viewBB.width}v${viewBB.height}h${-viewBB.width}z\"\n />\n </svg>\n `;\n }\n}\n","import { LitElement, html, css } from 'lit';\nimport { customElement, property } from 'lit/decorators.js';\nimport { m3Tokens } from './theme';\n\n@customElement('lit-sidebar')\nexport class LitSidebar extends LitElement {\n static styles = [\n m3Tokens,\n css`\n :host {\n display: block;\n width: 200px;\n background: var(--md-sys-color-surface);\n border-right: 1px solid var(--md-sys-color-outline-variant);\n padding: 16px;\n box-sizing: border-box;\n height: 100%;\n }\n\n .sidebar-title {\n font-family: var(--md-sys-typescale-body-medium-font);\n font-size: var(--md-sys-typescale-label-medium-size);\n color: var(--md-sys-color-on-surface-variant);\n text-transform: uppercase;\n font-weight: bold;\n margin-bottom: 16px;\n }\n\n .node-palette {\n display: flex;\n flex-direction: column;\n gap: 12px;\n }\n\n .palette-item {\n padding: 12px;\n background: var(--md-sys-color-surface-container-low);\n border: 1px solid var(--md-sys-color-outline-variant);\n border-radius: var(--md-sys-shape-corner-small);\n cursor: grab;\n font-family: var(--md-sys-typescale-body-medium-font);\n font-size: var(--md-sys-typescale-body-medium-size);\n color: var(--md-sys-color-on-surface);\n user-select: none;\n transition: background-color 0.2s ease;\n }\n\n .palette-item:hover {\n background: var(--md-sys-color-surface-container-high);\n }\n\n .palette-item:active {\n cursor: grabbing;\n }\n `\n ];\n\n @property({ type: Array })\n nodeTypes = [\n { type: 'default', label: 'Default Node' },\n { type: 'input', label: 'Input Node' },\n { type: 'output', label: 'Output Node' },\n ];\n\n private _onDragStart(e: DragEvent, nodeType: string) {\n if (e.dataTransfer) {\n e.dataTransfer.setData('application/litflow', nodeType);\n e.dataTransfer.effectAllowed = 'move';\n }\n }\n\n render() {\n return html`\n <div class=\"sidebar-title\">Node Palette</div>\n <div class=\"node-palette\">\n ${this.nodeTypes.map(\n (node) => html`\n <div\n class=\"palette-item\"\n draggable=\"true\"\n @dragstart=\"${(e: DragEvent) => this._onDragStart(e, node.type)}\"\n >\n ${node.label}\n </div>\n `\n )}\n </div>\n `;\n }\n}\n"],"names":["createInitialState","signal","infiniteExtent","LitNode","SignalWatcher","LitElement","html","__decorateClass","property","customElement","LitEdge","Position","path","getBezierPath","svg","css","boolConverter","value","LitFlow","nodes","adoptUserNodes","updateAbsolutePositions","childNodes","el","i","edges","entries","entry","id","element","node","width","height","zoom","userNode","n","handles","sourceBounds","targetBounds","h","bounds","nodeRect","handleData","multi","newNodes","position","tx","ty","XYPanZoom","_","x","y","PanOnScrollMode","changedProperties","nodeElements","currentIds","e","dragInstance","XYDrag","delta","panZoom","nodeExtent","transform","dragItems","item","edge","sourceNode","targetNode","userSource","userTarget","sourceHandle","targetHandle","sPos","getHandlePosition","tPos","pathParams","getStraightPath","getSmoothStepPath","event","handleId","nodeId","type","handleDomNode","isTarget","fromHandle","XYHandle","ConnectionMode","viewport","conn","connection","rect","label","userLabel","newNode","connectionInProgress","pos","tagName","tag","unsafeStatic","style","styleString","v","widthStyle","heightStyle","zIndex","m3Tokens","query","state","LitHandle","LitControls","LitMinimap","svgEl","XYMinimap","boundingRect","viewBB","getBoundsOfRects","getInternalNodesBounds","elementWidth","elementHeight","scaledWidth","scaledHeight","viewScale","viewWidth","viewHeight","offset","w","LitSidebar","nodeType"],"mappings":"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"}
package/dist/theme.js CHANGED
@@ -16,6 +16,10 @@ const r = o`
16
16
  --md-sys-color-on-surface: #1b1b1f;
17
17
  --md-sys-color-surface-variant: #e1e2ec;
18
18
  --md-sys-color-on-surface-variant: #44474f;
19
+
20
+ --md-sys-color-surface-container-low: #f7f2fa;
21
+ --md-sys-color-surface-container: #f3edf7;
22
+ --md-sys-color-surface-container-high: #ece6f0;
19
23
 
20
24
  --md-sys-color-outline: #74777f;
21
25
  --md-sys-color-outline-variant: #c4c6d0;
package/dist/theme.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"theme.js","sources":["../src/theme.ts"],"sourcesContent":["import { css } from 'lit';\n\nexport const m3Tokens = css`\n :host {\n /* Colors - Light Theme Defaults */\n --md-sys-color-primary: #005ac1;\n --md-sys-color-on-primary: #ffffff;\n --md-sys-color-primary-container: #d8e2ff;\n --md-sys-color-on-primary-container: #001a41;\n \n --md-sys-color-secondary: #575e71;\n --md-sys-color-on-secondary: #ffffff;\n --md-sys-color-secondary-container: #dbe2f9;\n --md-sys-color-on-secondary-container: #141b2c;\n \n --md-sys-color-surface: #fefbff;\n --md-sys-color-on-surface: #1b1b1f;\n --md-sys-color-surface-variant: #e1e2ec;\n --md-sys-color-on-surface-variant: #44474f;\n \n --md-sys-color-outline: #74777f;\n --md-sys-color-outline-variant: #c4c6d0;\n \n --md-sys-color-background: #fefbff;\n --md-sys-color-on-background: #1b1b1f;\n\n --md-sys-color-error: #ba1a1a;\n --md-sys-color-on-error: #ffffff;\n\n /* Typography */\n --md-sys-typescale-body-medium-font: Roboto, sans-serif;\n --md-sys-typescale-body-medium-size: 14px;\n --md-sys-typescale-label-small-size: 11px;\n --md-sys-typescale-label-medium-size: 12px;\n\n /* Elevation */\n --md-sys-elevation-1: 0px 1px 3px 1px rgba(0, 0, 0, 0.15), 0px 1px 2px 0px rgba(0, 0, 0, 0.3);\n --md-sys-elevation-2: 0px 2px 6px 2px rgba(0, 0, 0, 0.15), 0px 1px 2px 0px rgba(0, 0, 0, 0.3);\n \n /* Shape */\n --md-sys-shape-corner-small: 8px;\n --md-sys-shape-corner-medium: 12px;\n --md-sys-shape-corner-extra-small: 4px;\n\n /* LitFlow Specific Tokens (mapped to M3) */\n --lit-flow-node-bg: var(--md-sys-color-surface);\n --lit-flow-node-border: var(--md-sys-color-outline-variant);\n --lit-flow-node-selected-border: var(--md-sys-color-primary);\n --lit-flow-node-text: var(--md-sys-color-on-surface);\n \n --lit-flow-handle-source: var(--md-sys-color-secondary);\n --lit-flow-handle-target: var(--md-sys-color-primary);\n --lit-flow-handle-outline: var(--md-sys-color-surface);\n\n --lit-flow-controls-bg: var(--md-sys-color-surface);\n --lit-flow-controls-button-text: var(--md-sys-color-on-surface);\n \n --lit-flow-minimap-bg: var(--md-sys-color-surface);\n --lit-flow-minimap-mask: rgba(0, 0, 0, 0.08);\n }\n`;\n"],"names":["m3Tokens","css"],"mappings":";AAEO,MAAMA,IAAWC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;"}
1
+ {"version":3,"file":"theme.js","sources":["../src/theme.ts"],"sourcesContent":["import { css } from 'lit';\n\nexport const m3Tokens = css`\n :host {\n /* Colors - Light Theme Defaults */\n --md-sys-color-primary: #005ac1;\n --md-sys-color-on-primary: #ffffff;\n --md-sys-color-primary-container: #d8e2ff;\n --md-sys-color-on-primary-container: #001a41;\n \n --md-sys-color-secondary: #575e71;\n --md-sys-color-on-secondary: #ffffff;\n --md-sys-color-secondary-container: #dbe2f9;\n --md-sys-color-on-secondary-container: #141b2c;\n \n --md-sys-color-surface: #fefbff;\n --md-sys-color-on-surface: #1b1b1f;\n --md-sys-color-surface-variant: #e1e2ec;\n --md-sys-color-on-surface-variant: #44474f;\n\n --md-sys-color-surface-container-low: #f7f2fa;\n --md-sys-color-surface-container: #f3edf7;\n --md-sys-color-surface-container-high: #ece6f0;\n \n --md-sys-color-outline: #74777f;\n --md-sys-color-outline-variant: #c4c6d0;\n \n --md-sys-color-background: #fefbff;\n --md-sys-color-on-background: #1b1b1f;\n\n --md-sys-color-error: #ba1a1a;\n --md-sys-color-on-error: #ffffff;\n\n /* Typography */\n --md-sys-typescale-body-medium-font: Roboto, sans-serif;\n --md-sys-typescale-body-medium-size: 14px;\n --md-sys-typescale-label-small-size: 11px;\n --md-sys-typescale-label-medium-size: 12px;\n\n /* Elevation */\n --md-sys-elevation-1: 0px 1px 3px 1px rgba(0, 0, 0, 0.15), 0px 1px 2px 0px rgba(0, 0, 0, 0.3);\n --md-sys-elevation-2: 0px 2px 6px 2px rgba(0, 0, 0, 0.15), 0px 1px 2px 0px rgba(0, 0, 0, 0.3);\n \n /* Shape */\n --md-sys-shape-corner-small: 8px;\n --md-sys-shape-corner-medium: 12px;\n --md-sys-shape-corner-extra-small: 4px;\n\n /* LitFlow Specific Tokens (mapped to M3) */\n --lit-flow-node-bg: var(--md-sys-color-surface);\n --lit-flow-node-border: var(--md-sys-color-outline-variant);\n --lit-flow-node-selected-border: var(--md-sys-color-primary);\n --lit-flow-node-text: var(--md-sys-color-on-surface);\n \n --lit-flow-handle-source: var(--md-sys-color-secondary);\n --lit-flow-handle-target: var(--md-sys-color-primary);\n --lit-flow-handle-outline: var(--md-sys-color-surface);\n\n --lit-flow-controls-bg: var(--md-sys-color-surface);\n --lit-flow-controls-button-text: var(--md-sys-color-on-surface);\n \n --lit-flow-minimap-bg: var(--md-sys-color-surface);\n --lit-flow-minimap-mask: rgba(0, 0, 0, 0.08);\n }\n`;\n"],"names":["m3Tokens","css"],"mappings":";AAEO,MAAMA,IAAWC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@ghchinoy/litflow",
3
- "version": "0.1.1",
3
+ "version": "0.2.0",
4
4
  "description": "xyflow core integrated with Lit WebComponents",
5
5
  "license": "MIT",
6
6
  "author": "G. Hussain Chinoy",
@@ -45,6 +45,8 @@
45
45
  },
46
46
  "scripts": {
47
47
  "dev": "vite",
48
+ "docs:dev": "pnpm --dir docs dev",
49
+ "docs:build": "pnpm --dir docs build",
48
50
  "build": "vite build && pnpm build:types",
49
51
  "build:types": "tsc --project tsconfig.types.json",
50
52
  "preview": "vite preview"
package/src/index.ts CHANGED
@@ -4,5 +4,6 @@ export * from './lit-edge';
4
4
  export * from './lit-handle';
5
5
  export * from './lit-controls';
6
6
  export * from './lit-minimap';
7
+ export * from './lit-sidebar';
7
8
  export * from './store';
8
9
  export * from './theme';
package/src/lit-flow.ts CHANGED
@@ -241,6 +241,9 @@ export class LitFlow extends (SignalWatcher as <T extends Constructor<LitElement
241
241
  @property({ type: Boolean, attribute: 'zoom-on-double-click', reflect: true, converter: boolConverter })
242
242
  zoomOnDoubleClick = true;
243
243
 
244
+ @property({ type: Boolean, attribute: 'prompt-on-drop', reflect: true, converter: boolConverter })
245
+ promptOnDrop = false;
246
+
244
247
  @state()
245
248
  private _width = 0;
246
249
 
@@ -264,6 +267,31 @@ export class LitFlow extends (SignalWatcher as <T extends Constructor<LitElement
264
267
  return this._state.nodes.get();
265
268
  }
266
269
 
270
+ private _discoverNodes() {
271
+ if (this.nodes.length > 0) return;
272
+
273
+ const childNodes = Array.from(this.querySelectorAll('lit-node')) as any[];
274
+ if (childNodes.length > 0) {
275
+ const nodes: NodeBase[] = childNodes.map((el) => ({
276
+ id: el.id || el.getAttribute('id') || `node-${Math.random().toString(36).substr(2, 9)}`,
277
+ type: el.type || el.getAttribute('type') || 'default',
278
+ position: {
279
+ x: parseFloat(el.getAttribute('position-x') || '0'),
280
+ y: parseFloat(el.getAttribute('position-y') || '0'),
281
+ },
282
+ data: {
283
+ label: el.label || el.getAttribute('label') || '',
284
+ ...el.data,
285
+ },
286
+ }));
287
+ this.nodes = nodes;
288
+ // Force update of internal nodeId for child elements
289
+ childNodes.forEach((el, i) => {
290
+ el.nodeId = nodes[i].id;
291
+ });
292
+ }
293
+ }
294
+
267
295
  @property({ type: Array })
268
296
  set edges(edges: any[]) {
269
297
  this._state.edges.set(edges);
@@ -278,6 +306,7 @@ export class LitFlow extends (SignalWatcher as <T extends Constructor<LitElement
278
306
 
279
307
  connectedCallback() {
280
308
  super.connectedCallback();
309
+ this._discoverNodes();
281
310
  this._resizeObserver = new ResizeObserver((entries) => {
282
311
  for (const entry of entries) {
283
312
  if (entry.target === this) {
@@ -374,6 +403,18 @@ export class LitFlow extends (SignalWatcher as <T extends Constructor<LitElement
374
403
  this.nodes = newNodes;
375
404
  }
376
405
 
406
+ /**
407
+ * Projects a screen position (relative to the flow container) to canvas coordinates.
408
+ * Useful for Drag & Drop and context menus.
409
+ */
410
+ project(position: { x: number; y: number }): { x: number; y: number } {
411
+ const [tx, ty, zoom] = this._state.transform.get();
412
+ return {
413
+ x: (position.x - tx) / zoom,
414
+ y: (position.y - ty) / zoom,
415
+ };
416
+ }
417
+
377
418
  firstUpdated() {
378
419
  if (this._renderer) {
379
420
  this._state.domNode = this._renderer;
@@ -689,6 +730,51 @@ export class LitFlow extends (SignalWatcher as <T extends Constructor<LitElement
689
730
  });
690
731
  }
691
732
 
733
+ private _onDragOver(e: DragEvent) {
734
+ e.preventDefault();
735
+ if (e.dataTransfer) {
736
+ e.dataTransfer.dropEffect = 'move';
737
+ }
738
+ }
739
+
740
+ private _onDrop(e: DragEvent) {
741
+ e.preventDefault();
742
+
743
+ const type = e.dataTransfer?.getData('application/litflow');
744
+
745
+ // check if the dropped element is valid
746
+ if (typeof type === 'undefined' || !type) {
747
+ return;
748
+ }
749
+
750
+ // Get the position of the drop relative to the flow container
751
+ const rect = this.getBoundingClientRect();
752
+ const position = this.project({
753
+ x: e.clientX - rect.left,
754
+ y: e.clientY - rect.top,
755
+ });
756
+
757
+ let label = `${type} node`;
758
+ if (this.promptOnDrop) {
759
+ const userLabel = window.prompt('Enter node label:', label);
760
+ if (userLabel === null) return; // Cancelled
761
+ label = userLabel || label;
762
+ }
763
+
764
+ const newNode = {
765
+ id: `node_${Date.now()}`,
766
+ type,
767
+ position,
768
+ data: { label },
769
+ };
770
+
771
+ this.nodes = [...this.nodes, newNode];
772
+
773
+ this.dispatchEvent(new CustomEvent('node-drop', {
774
+ detail: { node: newNode, event: e }
775
+ }));
776
+ }
777
+
692
778
  private _renderConnectionLine(conn: any) {
693
779
  if (!conn) return null;
694
780
 
@@ -718,7 +804,11 @@ export class LitFlow extends (SignalWatcher as <T extends Constructor<LitElement
718
804
  const connectionInProgress = this._state.connectionInProgress.get();
719
805
 
720
806
  return html`
721
- <div class="xyflow__renderer ${this.showGrid ? 'has-grid' : ''}">
807
+ <div
808
+ class="xyflow__renderer ${this.showGrid ? 'has-grid' : ''}"
809
+ @dragover="${this._onDragOver}"
810
+ @drop="${this._onDrop}"
811
+ >
722
812
  <div
723
813
  class="xyflow__viewport"
724
814
  style="transform: translate(${transform[0]}px, ${transform[1]}px) scale(${transform[2]})"
@@ -779,6 +869,7 @@ export class LitFlow extends (SignalWatcher as <T extends Constructor<LitElement
779
869
  ></lit-minimap>
780
870
  `
781
871
  : ''}
872
+ <slot style="display: none;"></slot>
782
873
  `;
783
874
  }
784
875
  }
package/src/lit-node.ts CHANGED
@@ -25,6 +25,12 @@ export class LitNode extends (SignalWatcher as <T extends Constructor<LitElement
25
25
  @property({ type: String, attribute: 'data-id', reflect: true })
26
26
  nodeId = '';
27
27
 
28
+ @property({ type: Number, attribute: 'position-x' })
29
+ positionX = 0;
30
+
31
+ @property({ type: Number, attribute: 'position-y' })
32
+ positionY = 0;
33
+
28
34
  render() {
29
35
  return html`
30
36
  <div class="label" style="font-size: var(--md-sys-typescale-body-medium-size); color: var(--md-sys-color-on-surface); pointer-events: none; font-family: var(--md-sys-typescale-body-medium-font);">${this.label}</div>
@@ -0,0 +1,90 @@
1
+ import { LitElement, html, css } from 'lit';
2
+ import { customElement, property } from 'lit/decorators.js';
3
+ import { m3Tokens } from './theme';
4
+
5
+ @customElement('lit-sidebar')
6
+ export class LitSidebar extends LitElement {
7
+ static styles = [
8
+ m3Tokens,
9
+ css`
10
+ :host {
11
+ display: block;
12
+ width: 200px;
13
+ background: var(--md-sys-color-surface);
14
+ border-right: 1px solid var(--md-sys-color-outline-variant);
15
+ padding: 16px;
16
+ box-sizing: border-box;
17
+ height: 100%;
18
+ }
19
+
20
+ .sidebar-title {
21
+ font-family: var(--md-sys-typescale-body-medium-font);
22
+ font-size: var(--md-sys-typescale-label-medium-size);
23
+ color: var(--md-sys-color-on-surface-variant);
24
+ text-transform: uppercase;
25
+ font-weight: bold;
26
+ margin-bottom: 16px;
27
+ }
28
+
29
+ .node-palette {
30
+ display: flex;
31
+ flex-direction: column;
32
+ gap: 12px;
33
+ }
34
+
35
+ .palette-item {
36
+ padding: 12px;
37
+ background: var(--md-sys-color-surface-container-low);
38
+ border: 1px solid var(--md-sys-color-outline-variant);
39
+ border-radius: var(--md-sys-shape-corner-small);
40
+ cursor: grab;
41
+ font-family: var(--md-sys-typescale-body-medium-font);
42
+ font-size: var(--md-sys-typescale-body-medium-size);
43
+ color: var(--md-sys-color-on-surface);
44
+ user-select: none;
45
+ transition: background-color 0.2s ease;
46
+ }
47
+
48
+ .palette-item:hover {
49
+ background: var(--md-sys-color-surface-container-high);
50
+ }
51
+
52
+ .palette-item:active {
53
+ cursor: grabbing;
54
+ }
55
+ `
56
+ ];
57
+
58
+ @property({ type: Array })
59
+ nodeTypes = [
60
+ { type: 'default', label: 'Default Node' },
61
+ { type: 'input', label: 'Input Node' },
62
+ { type: 'output', label: 'Output Node' },
63
+ ];
64
+
65
+ private _onDragStart(e: DragEvent, nodeType: string) {
66
+ if (e.dataTransfer) {
67
+ e.dataTransfer.setData('application/litflow', nodeType);
68
+ e.dataTransfer.effectAllowed = 'move';
69
+ }
70
+ }
71
+
72
+ render() {
73
+ return html`
74
+ <div class="sidebar-title">Node Palette</div>
75
+ <div class="node-palette">
76
+ ${this.nodeTypes.map(
77
+ (node) => html`
78
+ <div
79
+ class="palette-item"
80
+ draggable="true"
81
+ @dragstart="${(e: DragEvent) => this._onDragStart(e, node.type)}"
82
+ >
83
+ ${node.label}
84
+ </div>
85
+ `
86
+ )}
87
+ </div>
88
+ `;
89
+ }
90
+ }