@ghchinoy/litflow 0.1.1 → 0.2.1

package/README.md

@@ -1,5 +1,8 @@
 # LitFlow: xyflow + Lit WebComponents
 
+[![npm version](https://img.shields.io/npm/v/@ghchinoy/litflow.svg)](https://www.npmjs.com/package/@ghchinoy/litflow)
+[![license](https://img.shields.io/npm/l/@ghchinoy/litflow.svg)](https://github.com/ghchinoy/litflow/blob/main/LICENSE)
+
 LitFlow is a demonstration and starter kit for using the [xyflow](https://xyflow.com/) core system with [Lit](https://lit.dev/) WebComponents. It provides a lightweight, framework-agnostic way to build node-based UIs.
 
 ## 🚀 Quick Start
@@ -123,6 +126,7 @@ LitFlow leverages `@xyflow/system`, the same headless core that powers React Flo
 ## 🛠️ Key Features
 - **Panning & Zooming**: Full support for viewport manipulation via d3-zoom (via xyflow).
 - **Node Dragging**: Individual nodes can be dragged, with positions synced back to the state.
+- **Edge Markers**: Support for arrowheads and other markers on edges.
 - **Manual Connections**: Drag-to-connect functionality between handles with a live connection line.
 - **Controls & MiniMap**: Built-in utility components for navigation and overview.
 - **Reactive Updates**: Powered by `@lit-labs/signals` for efficient, targeted re-renders.
@@ -130,9 +134,16 @@ LitFlow leverages `@xyflow/system`, the same headless core that powers React Flo
 - **Custom Node Support**: Easily build complex nodes with internal state and custom Lit templates.
 
 ## 📖 Documentation
-- [Lit vs React for xyflow](./LIT_VS_REACT.md): A comparison of using Lit WebComponents vs React for building flow-based UIs.
-- [Creating Custom Nodes](./CUSTOM_NODES.md): A primer on building complex, data-driven nodes in LitFlow.
-- [GEMINI.md](./GEMINI.md): Project conventions and technical insights for AI agents.
+
+Explore our comprehensive documentation following the [Diataxis](https://diataxis.fr/) framework:
+
+- **[Tutorials](./docs/src/tutorials/index.md)**: Step-by-step guides to get you started.
+- **[Guides](./docs/src/guides/index.md)**: Practical instructions for common tasks.
+- **[Explanation](./docs/src/explanation/index.md)**: Deep dives into the architecture and concepts.
+- **[Reference](./docs/src/reference/index.md)**: Technical API documentation.
+- **[Examples](./docs/src/examples/index.md)**: Live interactive showcases.
+
+- [GEMINI.md](./GEMINI.md): 🤖 Project conventions and technical insights for AI agents.
 
 ## 🛠️ Development & Publishing
 
@@ -160,4 +171,8 @@ The package is published under the `@ghchinoy` scope. To publish a new version:
    ```
 
 ## 🤝 Contributing
-This project is an exploration of xyflow's headless capabilities. Feel free to open issues or submit PRs to improve the Lit integration!
+This project is an exploration of xyflow's headless capabilities. Feel free to open issues or submit PRs to improve the Lit integration!
+
+## License
+
+LitFlow is [MIT licensed](./LICENSE).

package/dist/index.d.ts

@@ -4,5 +4,6 @@ export * from './lit-edge';
 export * from './lit-handle';
 export * from './lit-controls';
 export * from './lit-minimap';
+export * from './lit-sidebar';
 export * from './store';
 export * from './theme';

package/dist/lit-flow.d.ts

@@ -21,10 +21,12 @@ export declare class LitFlow extends LitFlow_base {
     zoomOnScroll: boolean;
     zoomOnPinch: boolean;
     zoomOnDoubleClick: boolean;
+    promptOnDrop: boolean;
     private _width;
     private _height;
     set nodes(nodes: NodeBase[]);
     get nodes(): NodeBase[];
+    private _discoverNodes;
     set edges(edges: any[]);
     get edges(): any[];
     viewport: Viewport;
@@ -32,11 +34,24 @@ export declare class LitFlow extends LitFlow_base {
     disconnectedCallback(): void;
     private _updateNodeDimensions;
     private _selectNode;
+    /**
+     * Projects a screen position (relative to the flow container) to canvas coordinates.
+     * Useful for Drag & Drop and context menus.
+     */
+    project(position: {
+        x: number;
+        y: number;
+    }): {
+        x: number;
+        y: number;
+    };
     firstUpdated(): void;
     updated(changedProperties: Map<string, any>): void;
     private _setupDrags;
     private _renderEdge;
     private _onHandlePointerDown;
+    private _onDragOver;
+    private _onDrop;
     private _renderConnectionLine;
     render(): import("lit").TemplateResult;
 }

package/dist/lit-node.d.ts

@@ -7,6 +7,8 @@ export declare class LitNode extends LitNode_base {
     data: any;
     selected: boolean;
     nodeId: string;
+    positionX: number;
+    positionY: number;
     render(): import("lit").TemplateResult<1>;
 }
 export {};

package/dist/lit-sidebar.d.ts

@@ -0,0 +1,10 @@
+import { LitElement } from 'lit';
+export declare class LitSidebar extends LitElement {
+    static styles: import("lit").CSSResult[];
+    nodeTypes: {
+        type: string;
+        label: string;
+    }[];
+    private _onDragStart;
+    render(): import("lit").TemplateResult<1>;
+}