f1ow 0.1.0

package/dist/components/Canvas/LinearElementHandles.d.ts

@@ -0,0 +1,17 @@
+import { default as React } from 'react';
+import { ArrowElement, LineElement, CanvasElement, SnapTarget } from '../../types';
+interface Props {
+    element: LineElement | ArrowElement;
+    /** All elements — needed for snap/binding detection on endpoint drag */
+    allElements: CanvasElement[];
+    /** Callback to update the element's points, position, bindings */
+    onPointsChange: (id: string, updates: Partial<LineElement | ArrowElement>) => void;
+    /** Callback for lightweight drag-move (no history) */
+    onPointDragMove?: (id: string, updates: Partial<LineElement | ArrowElement>) => void;
+    /** Callback when snap target changes during endpoint drag */
+    onSnapTargetChange?: (target: SnapTarget | null) => void;
+    /** Accent color */
+    color?: string;
+}
+declare const _default: React.NamedExoticComponent<Props>;
+export default _default;

package/dist/components/Canvas/SelectionBox.d.ts

@@ -0,0 +1,12 @@
+import { default as React } from 'react';
+interface Props {
+    box: {
+        x: number;
+        y: number;
+        width: number;
+        height: number;
+    } | null;
+    selectionColor?: string;
+}
+declare const _default: React.NamedExoticComponent<Props>;
+export default _default;

package/dist/components/Canvas/SelectionTransformer.d.ts

@@ -0,0 +1,7 @@
+import { default as React } from 'react';
+interface Props {
+    selectedIds: string[];
+    selectionColor?: string;
+}
+declare const _default: React.NamedExoticComponent<Props>;
+export default _default;

package/dist/components/ContextMenu/ContextMenu.d.ts

@@ -0,0 +1,23 @@
+import { default as React } from 'react';
+export interface ContextMenuItem {
+    label: string;
+    shortcut?: string;
+    action: () => void;
+    disabled?: boolean;
+    divider?: boolean;
+}
+interface ContextMenuProps {
+    x: number;
+    y: number;
+    items: ContextMenuItem[];
+    onClose: () => void;
+    theme: {
+        panelBg: string;
+        toolbarBorder: string;
+        textColor: string;
+        mutedTextColor: string;
+        activeToolColor: string;
+    };
+}
+declare const _default: React.NamedExoticComponent<ContextMenuProps>;
+export default _default;

package/dist/components/StylePanel/StylePanel.d.ts

@@ -0,0 +1,7 @@
+import { default as React } from 'react';
+import { FlowCanvasTheme } from '../../lib/FlowCanvasProps';
+interface Props {
+    theme: FlowCanvasTheme;
+}
+declare const StylePanel: React.FC<Props>;
+export default StylePanel;

package/dist/components/Toolbar/Toolbar.d.ts

@@ -0,0 +1,9 @@
+import { default as React } from 'react';
+import { ToolConfig } from '../../constants';
+import { FlowCanvasTheme } from '../../lib/FlowCanvasProps';
+interface Props {
+    visibleTools: ToolConfig[];
+    theme: FlowCanvasTheme;
+}
+declare const Toolbar: React.FC<Props>;
+export default Toolbar;

package/dist/components/shapes/ArrowShape.d.ts

@@ -0,0 +1,18 @@
+import { default as React } from 'react';
+import { ArrowElement, CanvasElement } from '../../types';
+interface Props {
+    element: ArrowElement;
+    isSelected: boolean;
+    isEditing?: boolean;
+    /** When true, individual drag is disabled — the parent KonvaGroup handles dragging */
+    isGrouped?: boolean;
+    onSelect: (id: string) => void;
+    onChange: (id: string, updates: Partial<ArrowElement>) => void;
+    onDragMove?: (id: string, updates: Partial<ArrowElement>) => void;
+    onDoubleClick?: (id: string) => void;
+    gridSnap?: number;
+    /** All elements — needed for elbow routing to resolve shape bboxes */
+    allElements?: CanvasElement[];
+}
+declare const _default: React.NamedExoticComponent<Props>;
+export default _default;

package/dist/components/shapes/DiamondShape.d.ts

@@ -0,0 +1,24 @@
+import { default as React } from 'react';
+import { DiamondElement } from '../../types';
+interface Props {
+    element: DiamondElement;
+    isSelected: boolean;
+    /** When true, individual drag is disabled — the parent KonvaGroup handles dragging */
+    isGrouped?: boolean;
+    onSelect: (id: string) => void;
+    onChange: (id: string, updates: Partial<DiamondElement>) => void;
+    onDragMove?: (id: string, updates: Partial<DiamondElement>) => void;
+    onDoubleClick?: (id: string) => void;
+    gridSnap?: number;
+    onDragSnap?: (id: string, bounds: {
+        x: number;
+        y: number;
+        width: number;
+        height: number;
+    }) => {
+        x: number;
+        y: number;
+    } | null;
+}
+declare const _default: React.NamedExoticComponent<Props>;
+export default _default;

package/dist/components/shapes/EllipseShape.d.ts

@@ -0,0 +1,24 @@
+import { default as React } from 'react';
+import { EllipseElement } from '../../types';
+interface Props {
+    element: EllipseElement;
+    isSelected: boolean;
+    /** When true, individual drag is disabled — the parent KonvaGroup handles dragging */
+    isGrouped?: boolean;
+    onSelect: (id: string) => void;
+    onChange: (id: string, updates: Partial<EllipseElement>) => void;
+    onDragMove?: (id: string, updates: Partial<EllipseElement>) => void;
+    onDoubleClick?: (id: string) => void;
+    gridSnap?: number;
+    onDragSnap?: (id: string, bounds: {
+        x: number;
+        y: number;
+        width: number;
+        height: number;
+    }) => {
+        x: number;
+        y: number;
+    } | null;
+}
+declare const _default: React.NamedExoticComponent<Props>;
+export default _default;

package/dist/components/shapes/FreeDrawShape.d.ts

@@ -0,0 +1,24 @@
+import { default as React } from 'react';
+import { FreeDrawElement } from '../../types';
+interface Props {
+    element: FreeDrawElement;
+    isSelected: boolean;
+    /** When true, individual drag is disabled — the parent KonvaGroup handles dragging */
+    isGrouped?: boolean;
+    onSelect: (id: string) => void;
+    onChange: (id: string, updates: Partial<FreeDrawElement>) => void;
+    onDragMove?: (id: string, updates: Partial<FreeDrawElement>) => void;
+    onDoubleClick?: (id: string) => void;
+    gridSnap?: number;
+    onDragSnap?: (id: string, bounds: {
+        x: number;
+        y: number;
+        width: number;
+        height: number;
+    }) => {
+        x: number;
+        y: number;
+    } | null;
+}
+declare const _default: React.NamedExoticComponent<Props>;
+export default _default;

package/dist/components/shapes/ImageShape.d.ts

@@ -0,0 +1,24 @@
+import { default as React } from 'react';
+import { ImageElement } from '../../types';
+interface Props {
+    element: ImageElement;
+    isSelected: boolean;
+    /** When true, individual drag is disabled — the parent KonvaGroup handles dragging */
+    isGrouped?: boolean;
+    onSelect: (id: string) => void;
+    onChange: (id: string, updates: Partial<ImageElement>) => void;
+    onDragMove?: (id: string, updates: Partial<ImageElement>) => void;
+    onDoubleClick?: (id: string) => void;
+    gridSnap?: number;
+    onDragSnap?: (id: string, bounds: {
+        x: number;
+        y: number;
+        width: number;
+        height: number;
+    }) => {
+        x: number;
+        y: number;
+    } | null;
+}
+declare const _default: React.NamedExoticComponent<Props>;
+export default _default;

package/dist/components/shapes/LineShape.d.ts

@@ -0,0 +1,18 @@
+import { default as React } from 'react';
+import { LineElement, CanvasElement } from '../../types';
+interface Props {
+    element: LineElement;
+    isSelected: boolean;
+    isEditing?: boolean;
+    /** When true, individual drag is disabled — the parent KonvaGroup handles dragging */
+    isGrouped?: boolean;
+    onSelect: (id: string) => void;
+    onChange: (id: string, updates: Partial<LineElement>) => void;
+    onDragMove?: (id: string, updates: Partial<LineElement>) => void;
+    onDoubleClick?: (id: string) => void;
+    gridSnap?: number;
+    /** All elements — needed for elbow routing to resolve shape bboxes */
+    allElements?: CanvasElement[];
+}
+declare const _default: React.NamedExoticComponent<Props>;
+export default _default;

package/dist/components/shapes/RectangleShape.d.ts

@@ -0,0 +1,24 @@
+import { default as React } from 'react';
+import { RectangleElement } from '../../types';
+interface Props {
+    element: RectangleElement;
+    isSelected: boolean;
+    /** When true, individual drag is disabled — the parent KonvaGroup handles dragging */
+    isGrouped?: boolean;
+    onSelect: (id: string) => void;
+    onChange: (id: string, updates: Partial<RectangleElement>) => void;
+    onDragMove?: (id: string, updates: Partial<RectangleElement>) => void;
+    onDoubleClick?: (id: string) => void;
+    gridSnap?: number;
+    onDragSnap?: (id: string, bounds: {
+        x: number;
+        y: number;
+        width: number;
+        height: number;
+    }) => {
+        x: number;
+        y: number;
+    } | null;
+}
+declare const _default: React.NamedExoticComponent<Props>;
+export default _default;

package/dist/components/shapes/TextShape.d.ts

@@ -0,0 +1,23 @@
+import { default as React } from 'react';
+import { TextElement, CanvasElement } from '../../types';
+interface Props {
+    element: TextElement;
+    isSelected: boolean;
+    /** When true, individual drag is disabled — the parent KonvaGroup handles dragging */
+    isGrouped?: boolean;
+    onSelect: (id: string) => void;
+    onChange: (id: string, updates: Partial<TextElement>) => void;
+    onDragMove?: (id: string, updates: Partial<TextElement>) => void;
+    /** If true, auto-opens the textarea editor immediately after mount */
+    autoEdit?: boolean;
+    /** Called to notify parent that text editing started */
+    onEditStart?: (id: string) => void;
+    /** Called to notify parent that text editing ended */
+    onEditEnd?: (id: string, isEmpty: boolean) => void;
+    /** All elements (for resolving containerId position) */
+    allElements?: CanvasElement[];
+    /** Grid snap size (0 or undefined = no snap) */
+    gridSnap?: number;
+}
+declare const _default: React.NamedExoticComponent<Props>;
+export default _default;

package/dist/constants/index.d.ts

@@ -0,0 +1,44 @@
+import { ElementStyle, ToolType, Arrowhead, LineType } from '../types';
+export declare const DEFAULT_STYLE: ElementStyle;
+export declare const STROKE_COLORS: string[];
+export declare const FILL_COLORS: string[];
+export declare const STROKE_WIDTHS: number[];
+export interface ToolConfig {
+    type: ToolType;
+    label: string;
+    shortcut: string;
+    icon: string;
+}
+export declare const TOOLS: ToolConfig[];
+export declare const MIN_ZOOM = 0.1;
+export declare const MAX_ZOOM = 5;
+export declare const ZOOM_STEP = 0.1;
+export declare const FONT_SIZES: number[];
+export declare const FONT_FAMILIES: {
+    label: string;
+    value: string;
+}[];
+export declare const SELECTION_SHADOW: {
+    readonly color: "#4f8df7";
+    readonly blur: 6;
+    readonly opacity: 0.5;
+};
+export declare const GRID_SIZE = 20;
+export interface ArrowheadConfig {
+    type: Arrowhead | null;
+    label: string;
+    /** Small SVG-like preview character for UI */
+    preview: string;
+}
+export declare const ARROWHEAD_TYPES: ArrowheadConfig[];
+export interface LineTypeConfig {
+    type: LineType;
+    label: string;
+    preview: string;
+}
+export declare const LINE_TYPES: LineTypeConfig[];
+export interface RoughnessConfig {
+    value: number;
+    label: string;
+}
+export declare const ROUGHNESS_CONFIGS: RoughnessConfig[];