@01.software/sdk 0.4.3 → 0.5.0

package/dist/server-B80o7igg.d.cts

@@ -0,0 +1,242 @@
+import { QueryClient } from '@tanstack/react-query';
+import React from 'react';
+
+interface DynamicNodeData {
+    nodeTypeSlug: string;
+    label: string;
+    fields: Record<string, unknown>;
+}
+type FlowNodeData = (DynamicNodeData | FrameNodeData) & Record<string, unknown>;
+interface FlowNodePosition {
+    x: number;
+    y: number;
+}
+interface FlowNode {
+    id: string;
+    type?: string;
+    position: FlowNodePosition;
+    data: FlowNodeData;
+    parentId?: string;
+    style?: React.CSSProperties;
+    width?: number;
+    height?: number;
+    measured?: {
+        width?: number;
+        height?: number;
+    };
+    draggable?: boolean;
+    selectable?: boolean;
+    [key: string]: unknown;
+}
+interface FlowEdge {
+    id: string;
+    source: string;
+    target: string;
+    sourceHandle?: string | null;
+    targetHandle?: string | null;
+    type?: string;
+    style?: React.CSSProperties;
+    animated?: boolean;
+    markerStart?: unknown;
+    markerEnd?: unknown;
+    edgeTypeSlug?: string;
+    fields?: Record<string, unknown>;
+    [key: string]: unknown;
+}
+interface FlowViewport {
+    x: number;
+    y: number;
+    zoom: number;
+}
+interface CanvasData {
+    nodes: FlowNode[];
+    edges: FlowEdge[];
+    viewport: FlowViewport;
+}
+interface NodeTypeFieldDef {
+    name: string;
+    label: string;
+    fieldType: 'text' | 'textarea' | 'number' | 'url' | 'color' | 'image' | 'select' | 'toggle';
+    options?: {
+        label: string;
+        value: string;
+    }[];
+    defaultValue?: string;
+    required?: boolean;
+}
+interface NodeTypeDef {
+    slug: string;
+    name: string;
+    color: string;
+    defaultSize: {
+        width: number;
+        height: number;
+    };
+    fields: NodeTypeFieldDef[];
+    transparentBackground?: boolean;
+    template?: string | null;
+    customCSS?: string | null;
+}
+interface EdgeTypeDef {
+    slug: string;
+    name: string;
+    color: string;
+    strokeWidth: number;
+    animated: boolean;
+    lineStyle: string;
+    markerStart: string;
+    markerEnd: string;
+    fields: NodeTypeFieldDef[];
+}
+declare function isDynamicNode(node: FlowNode): node is FlowNode & {
+    data: DynamicNodeData;
+};
+declare function isFrameNode(node: FlowNode): node is FlowNode & {
+    data: FrameNodeData;
+};
+interface DynamicNodeSlotProps {
+    id: string;
+    nodeTypeSlug: string;
+    label: string;
+    fields: Record<string, unknown>;
+    nodeTypeDef?: NodeTypeDef;
+    /** Whether this node is currently selected */
+    selected?: boolean;
+    /** Measured node width (undefined before first measurement) */
+    width?: number;
+    /** Measured node height (undefined before first measurement) */
+    height?: number;
+    /** The default rendering (template or field-based). Allows custom renderers to wrap/extend instead of replacing entirely. */
+    defaultRender?: React.ReactElement;
+}
+interface FrameNodeData {
+    label: string;
+    color?: string;
+    padding?: number;
+    borderStyle?: 'dashed' | 'solid' | 'none';
+    opacity?: number;
+}
+interface FrameNodeSlotProps {
+    id: string;
+    label: string;
+    color?: string;
+    padding?: number;
+    borderStyle?: 'dashed' | 'solid' | 'none';
+    opacity?: number;
+    width?: number;
+    height?: number;
+    children?: React.ReactNode;
+}
+interface EdgeSlotProps {
+    id: string;
+    edgeTypeSlug?: string;
+    source: string;
+    target: string;
+    label?: string;
+    fields?: Record<string, unknown>;
+    edgeTypeDef?: EdgeTypeDef;
+    style?: React.CSSProperties;
+}
+interface NodeWrapperSlotProps {
+    id: string;
+    nodeTypeSlug: string;
+    label: string;
+    selected?: boolean;
+    nodeTypeDef?: NodeTypeDef;
+    children: React.ReactNode;
+}
+interface FlowBounds {
+    x: number;
+    y: number;
+    width: number;
+    height: number;
+}
+
+type FlowCollection = 'flows' | 'flow-node-types' | 'flow-edge-types';
+type AnyFn = (...args: any[]) => any;
+interface SDKClient {
+    from(collection: FlowCollection): {
+        find: AnyFn;
+        findById: AnyFn;
+    };
+    queryClient: QueryClient;
+}
+interface UseFlowOptions {
+    /** SDK client instance (Client or ServerClient) */
+    client: SDKClient;
+    /** Flow slug (URL-friendly identifier) */
+    slug?: string;
+    /** Flow document ID (UUID) */
+    id?: string;
+    /** Enable/disable data fetching (default: true) */
+    enabled?: boolean;
+}
+interface UseFlowResult {
+    data: CanvasData | undefined;
+    nodeTypeDefs: NodeTypeDef[];
+    edgeTypeDefs: EdgeTypeDef[];
+    flow: Record<string, unknown> | undefined;
+    isLoading: boolean;
+    error: Error | null;
+}
+declare function useFlow(options: UseFlowOptions): UseFlowResult;
+
+interface PrefetchFlowOptions {
+    /** SDK client instance (Client or ServerClient) */
+    client: SDKClient;
+    /** Flow slug (URL-friendly identifier) */
+    slug?: string;
+    /** Flow document ID (UUID) */
+    id?: string;
+}
+/**
+ * Prefetch flow data into the query cache.
+ * Call in route loaders or server components to eliminate loading states on mount.
+ *
+ * ```ts
+ * // React Router loader / Server Component
+ * await prefetchFlow({ client, slug: 'Home' })
+ * ```
+ */
+declare function prefetchFlow(options: PrefetchFlowOptions): Promise<void>;
+
+/**
+ * Calculate bounding box for given node IDs.
+ * Pure function — usable in SSR, server components, or outside React.
+ */
+declare function getNodeBounds(nodes: FlowNode[], nodeIds: string[]): FlowBounds | undefined;
+/**
+ * Get all frame nodes with their bounds.
+ * Sorted by position (top-left to bottom-right).
+ */
+declare function getFrames(nodes: FlowNode[]): Array<{
+    id: string;
+    label: string;
+    bounds: FlowBounds;
+}>;
+/** Result of getFrameData — contains filtered canvas + dual bounds. */
+interface FrameData {
+    /** Canvas data containing only the frame's descendants (nodes have draggable: false). */
+    data: CanvasData;
+    /** Bounding box of child content nodes — use for initial viewport fit (centering). */
+    fitBounds: FlowBounds;
+    /** Bounding box of the frame itself — use for panning/zoom restriction (clamp). */
+    clampBounds: FlowBounds;
+    /** @deprecated Use fitBounds instead. Alias for clampBounds for backward compatibility. */
+    bounds: FlowBounds;
+}
+/**
+ * Extract a frame's descendants and related edges from canvas data.
+ * Recursively collects all nested children (supports nested frames).
+ * Returns undefined if frameId is not found or is not a frame node.
+ *
+ * Child nodes are marked `draggable: false` to prevent interfering with canvas panning.
+ * The frame node itself is included (use `frameRenderer={() => null}` to hide it).
+ *
+ * Returns dual bounds:
+ * - `fitBounds`: child content bounding box (for centering the viewport)
+ * - `clampBounds`: frame area bounding box (for panning restriction)
+ */
+declare function getFrameData(data: CanvasData, frameId: string): FrameData | undefined;
+
+export { type CanvasData as C, type DynamicNodeSlotProps as D, type EdgeTypeDef as E, type FlowNode as F, type NodeTypeDef as N, type PrefetchFlowOptions as P, type SDKClient as S, type UseFlowOptions as U, type FlowEdge as a, type FrameNodeSlotProps as b, type EdgeSlotProps as c, type NodeWrapperSlotProps as d, type FlowViewport as e, type FlowBounds as f, type FlowNodePosition as g, type FlowNodeData as h, type DynamicNodeData as i, type FrameNodeData as j, type NodeTypeFieldDef as k, isDynamicNode as l, isFrameNode as m, type UseFlowResult as n, getNodeBounds as o, prefetchFlow as p, getFrames as q, getFrameData as r, type FrameData as s, useFlow as u };

package/dist/server-B80o7igg.d.ts

@@ -0,0 +1,242 @@
+import { QueryClient } from '@tanstack/react-query';
+import React from 'react';
+
+interface DynamicNodeData {
+    nodeTypeSlug: string;
+    label: string;
+    fields: Record<string, unknown>;
+}
+type FlowNodeData = (DynamicNodeData | FrameNodeData) & Record<string, unknown>;
+interface FlowNodePosition {
+    x: number;
+    y: number;
+}
+interface FlowNode {
+    id: string;
+    type?: string;
+    position: FlowNodePosition;
+    data: FlowNodeData;
+    parentId?: string;
+    style?: React.CSSProperties;
+    width?: number;
+    height?: number;
+    measured?: {
+        width?: number;
+        height?: number;
+    };
+    draggable?: boolean;
+    selectable?: boolean;
+    [key: string]: unknown;
+}
+interface FlowEdge {
+    id: string;
+    source: string;
+    target: string;
+    sourceHandle?: string | null;
+    targetHandle?: string | null;
+    type?: string;
+    style?: React.CSSProperties;
+    animated?: boolean;
+    markerStart?: unknown;
+    markerEnd?: unknown;
+    edgeTypeSlug?: string;
+    fields?: Record<string, unknown>;
+    [key: string]: unknown;
+}
+interface FlowViewport {
+    x: number;
+    y: number;
+    zoom: number;
+}
+interface CanvasData {
+    nodes: FlowNode[];
+    edges: FlowEdge[];
+    viewport: FlowViewport;
+}
+interface NodeTypeFieldDef {
+    name: string;
+    label: string;
+    fieldType: 'text' | 'textarea' | 'number' | 'url' | 'color' | 'image' | 'select' | 'toggle';
+    options?: {
+        label: string;
+        value: string;
+    }[];
+    defaultValue?: string;
+    required?: boolean;
+}
+interface NodeTypeDef {
+    slug: string;
+    name: string;
+    color: string;
+    defaultSize: {
+        width: number;
+        height: number;
+    };
+    fields: NodeTypeFieldDef[];
+    transparentBackground?: boolean;
+    template?: string | null;
+    customCSS?: string | null;
+}
+interface EdgeTypeDef {
+    slug: string;
+    name: string;
+    color: string;
+    strokeWidth: number;
+    animated: boolean;
+    lineStyle: string;
+    markerStart: string;
+    markerEnd: string;
+    fields: NodeTypeFieldDef[];
+}
+declare function isDynamicNode(node: FlowNode): node is FlowNode & {
+    data: DynamicNodeData;
+};
+declare function isFrameNode(node: FlowNode): node is FlowNode & {
+    data: FrameNodeData;
+};
+interface DynamicNodeSlotProps {
+    id: string;
+    nodeTypeSlug: string;
+    label: string;
+    fields: Record<string, unknown>;
+    nodeTypeDef?: NodeTypeDef;
+    /** Whether this node is currently selected */
+    selected?: boolean;
+    /** Measured node width (undefined before first measurement) */
+    width?: number;
+    /** Measured node height (undefined before first measurement) */
+    height?: number;
+    /** The default rendering (template or field-based). Allows custom renderers to wrap/extend instead of replacing entirely. */
+    defaultRender?: React.ReactElement;
+}
+interface FrameNodeData {
+    label: string;
+    color?: string;
+    padding?: number;
+    borderStyle?: 'dashed' | 'solid' | 'none';
+    opacity?: number;
+}
+interface FrameNodeSlotProps {
+    id: string;
+    label: string;
+    color?: string;
+    padding?: number;
+    borderStyle?: 'dashed' | 'solid' | 'none';
+    opacity?: number;
+    width?: number;
+    height?: number;
+    children?: React.ReactNode;
+}
+interface EdgeSlotProps {
+    id: string;
+    edgeTypeSlug?: string;
+    source: string;
+    target: string;
+    label?: string;
+    fields?: Record<string, unknown>;
+    edgeTypeDef?: EdgeTypeDef;
+    style?: React.CSSProperties;
+}
+interface NodeWrapperSlotProps {
+    id: string;
+    nodeTypeSlug: string;
+    label: string;
+    selected?: boolean;
+    nodeTypeDef?: NodeTypeDef;
+    children: React.ReactNode;
+}
+interface FlowBounds {
+    x: number;
+    y: number;
+    width: number;
+    height: number;
+}
+
+type FlowCollection = 'flows' | 'flow-node-types' | 'flow-edge-types';
+type AnyFn = (...args: any[]) => any;
+interface SDKClient {
+    from(collection: FlowCollection): {
+        find: AnyFn;
+        findById: AnyFn;
+    };
+    queryClient: QueryClient;
+}
+interface UseFlowOptions {
+    /** SDK client instance (Client or ServerClient) */
+    client: SDKClient;
+    /** Flow slug (URL-friendly identifier) */
+    slug?: string;
+    /** Flow document ID (UUID) */
+    id?: string;
+    /** Enable/disable data fetching (default: true) */
+    enabled?: boolean;
+}
+interface UseFlowResult {
+    data: CanvasData | undefined;
+    nodeTypeDefs: NodeTypeDef[];
+    edgeTypeDefs: EdgeTypeDef[];
+    flow: Record<string, unknown> | undefined;
+    isLoading: boolean;
+    error: Error | null;
+}
+declare function useFlow(options: UseFlowOptions): UseFlowResult;
+
+interface PrefetchFlowOptions {
+    /** SDK client instance (Client or ServerClient) */
+    client: SDKClient;
+    /** Flow slug (URL-friendly identifier) */
+    slug?: string;
+    /** Flow document ID (UUID) */
+    id?: string;
+}
+/**
+ * Prefetch flow data into the query cache.
+ * Call in route loaders or server components to eliminate loading states on mount.
+ *
+ * ```ts
+ * // React Router loader / Server Component
+ * await prefetchFlow({ client, slug: 'Home' })
+ * ```
+ */
+declare function prefetchFlow(options: PrefetchFlowOptions): Promise<void>;
+
+/**
+ * Calculate bounding box for given node IDs.
+ * Pure function — usable in SSR, server components, or outside React.
+ */
+declare function getNodeBounds(nodes: FlowNode[], nodeIds: string[]): FlowBounds | undefined;
+/**
+ * Get all frame nodes with their bounds.
+ * Sorted by position (top-left to bottom-right).
+ */
+declare function getFrames(nodes: FlowNode[]): Array<{
+    id: string;
+    label: string;
+    bounds: FlowBounds;
+}>;
+/** Result of getFrameData — contains filtered canvas + dual bounds. */
+interface FrameData {
+    /** Canvas data containing only the frame's descendants (nodes have draggable: false). */
+    data: CanvasData;
+    /** Bounding box of child content nodes — use for initial viewport fit (centering). */
+    fitBounds: FlowBounds;
+    /** Bounding box of the frame itself — use for panning/zoom restriction (clamp). */
+    clampBounds: FlowBounds;
+    /** @deprecated Use fitBounds instead. Alias for clampBounds for backward compatibility. */
+    bounds: FlowBounds;
+}
+/**
+ * Extract a frame's descendants and related edges from canvas data.
+ * Recursively collects all nested children (supports nested frames).
+ * Returns undefined if frameId is not found or is not a frame node.
+ *
+ * Child nodes are marked `draggable: false` to prevent interfering with canvas panning.
+ * The frame node itself is included (use `frameRenderer={() => null}` to hide it).
+ *
+ * Returns dual bounds:
+ * - `fitBounds`: child content bounding box (for centering the viewport)
+ * - `clampBounds`: frame area bounding box (for panning restriction)
+ */
+declare function getFrameData(data: CanvasData, frameId: string): FrameData | undefined;
+
+export { type CanvasData as C, type DynamicNodeSlotProps as D, type EdgeTypeDef as E, type FlowNode as F, type NodeTypeDef as N, type PrefetchFlowOptions as P, type SDKClient as S, type UseFlowOptions as U, type FlowEdge as a, type FrameNodeSlotProps as b, type EdgeSlotProps as c, type NodeWrapperSlotProps as d, type FlowViewport as e, type FlowBounds as f, type FlowNodePosition as g, type FlowNodeData as h, type DynamicNodeData as i, type FrameNodeData as j, type NodeTypeFieldDef as k, isDynamicNode as l, isFrameNode as m, type UseFlowResult as n, getNodeBounds as o, prefetchFlow as p, getFrames as q, getFrameData as r, type FrameData as s, useFlow as u };