likec4 1.27.3 → 1.28.1

package/react/index.d.mts

@@ -21,6 +21,30 @@ type Tag<Token extends PropertyKey, TagMetadata> = TagContainer<{
 }>;
 type Tagged<Type, TagName extends PropertyKey, TagMetadata = never> = Type & Tag<TagName, TagMetadata>;
 type TupleToUnion<ArrayType> = ArrayType extends readonly unknown[] ? ArrayType[number] : never;
+type NonEmptyArray<T> = [
+	T,
+	...T[]
+];
+type Point = readonly [
+	x: number,
+	y: number
+];
+interface XYPoint {
+	x: number;
+	y: number;
+}
+type AllNever<Expressions> = UnionToIntersection<{
+	[Name in keyof Expressions]: {
+		-readonly [Key in keyof Expressions[Name]]?: never;
+	};
+}[keyof Expressions]>;
+type ExclusiveUnion<Expressions> = Expressions extends object ? {
+	[Name in keyof Expressions]: Simplify<Omit<AllNever<Expressions>, keyof Expressions[Name]> & Expressions[Name]>;
+}[keyof Expressions] : Expressions;
+type ProjectId = Tagged<string, "ProjectID">;
+type IconUrl = Tagged<string, "IconUrl"> | "none";
+type Fqn<Id extends string = string> = Tagged<Id, "Fqn">;
+type Tag$1<Tags extends string = string> = Tagged<Tags, "Tag">;
 declare const ThemeColors: readonly [
 	"amber",
 	"blue",
@@ -56,28 +80,6 @@ interface ThemeColorValues {
 	elements: ElementThemeColorValues;
 	relationships: RelationshipThemeColorValues;
 }
-type NonEmptyArray<T> = [
-	T,
-	...T[]
-];
-type IconUrl = Tagged<string, "IconUrl"> | "none";
-type Point = readonly [
-	x: number,
-	y: number
-];
-interface XYPoint {
-	x: number;
-	y: number;
-}
-type AllNever<Expressions> = UnionToIntersection<{
-	[Name in keyof Expressions]: {
-		-readonly [Key in keyof Expressions[Name]]?: never;
-	};
-}[keyof Expressions]>;
-type ExclusiveUnion<Expressions> = Expressions extends object ? {
-	[Name in keyof Expressions]: Simplify<Omit<AllNever<Expressions>, keyof Expressions[Name]> & Expressions[Name]>;
-}[keyof Expressions] : Expressions;
-type Fqn<Id extends string = string> = Tagged<Id, "Fqn">;
 declare const BorderStyles: readonly [
 	"solid",
 	"dashed",
@@ -121,7 +123,6 @@ interface ElementStyle {
 	readonly padding?: SpacingSize;
 	readonly textSize?: TextSize;
 }
-type Tag$1<Tags extends string = string> = Tagged<Tags, "Tag">;
 interface Link {
 	readonly title?: string;
 	readonly url: string;
@@ -163,109 +164,6 @@ type OrOperator<Tag, Kind> = Omit<AllNever$1, "or"> & {
 	or: NonEmptyArray<WhereOperator<Tag, Kind>>;
 };
 type WhereOperator<Tag, Kind> = TagEqual<Tag> | KindEqual<Kind> | ParticipantOperator<Tag, Kind> | NotOperator<Tag, Kind> | AndOperator<Tag, Kind> | OrOperator<Tag, Kind>;
-interface BaseExpr {
-	where?: never;
-	element?: never;
-	custom?: never;
-	expanded?: never;
-	elementKind?: never;
-	elementTag?: never;
-	isEqual?: never;
-	isChildren?: never;
-	isDescendants?: never;
-	wildcard?: never;
-	source?: never;
-	target?: never;
-	inout?: never;
-	incoming?: never;
-	outgoing?: never;
-	customRelation?: never;
-}
-interface ElementRefExpr extends Omit<BaseExpr, "element" | "isChildren" | "isDescendants"> {
-	element: Fqn;
-	isChildren?: boolean;
-	isDescendants?: boolean;
-}
-interface ExpandedElementExpr extends Omit<BaseExpr, "expanded"> {
-	expanded: Fqn;
-}
-interface CustomElementExpr extends Omit<BaseExpr, "custom"> {
-	custom: {
-		expr: ElementExpression | ElementWhereExpr;
-		title?: string;
-		description?: string;
-		technology?: string;
-		notation?: string;
-		shape?: ElementShape;
-		color?: Color;
-		icon?: IconUrl;
-		border?: BorderStyle;
-		opacity?: number;
-		navigateTo?: ViewId;
-		multiple?: boolean;
-		size?: ShapeSize;
-		padding?: ShapeSize;
-		textSize?: ShapeSize;
-	};
-}
-interface WildcardExpr extends Omit<BaseExpr, "wildcard"> {
-	wildcard: true;
-}
-interface ElementKindExpr extends Omit<BaseExpr, "elementKind" | "isEqual"> {
-	elementKind: ElementKind;
-	isEqual: boolean;
-}
-interface ElementTagExpr extends Omit<BaseExpr, "elementTag" | "isEqual"> {
-	elementTag: Tag$1;
-	isEqual: boolean;
-}
-type NonWilcard = ElementRefExpr | ElementKindExpr | ElementTagExpr | ExpandedElementExpr;
-type ElementExpression = NonWilcard | WildcardExpr;
-interface ElementWhereExpr extends Omit<BaseExpr, "where"> {
-	where: {
-		expr: ElementExpression;
-		condition: WhereOperator<string, string>;
-	};
-}
-type ElementPredicateExpression = ElementExpression | ElementWhereExpr | CustomElementExpr;
-interface DirectRelationExpr extends Omit<BaseExpr, "source" | "target"> {
-	source: ElementExpression;
-	target: ElementExpression;
-	isBidirectional?: boolean;
-}
-interface InOutExpr extends Omit<BaseExpr, "inout"> {
-	inout: ElementExpression;
-}
-interface IncomingExpr extends Omit<BaseExpr, "incoming"> {
-	incoming: ElementExpression;
-}
-interface OutgoingExpr extends Omit<BaseExpr, "outgoing"> {
-	outgoing: ElementExpression;
-}
-type RelationExpression = DirectRelationExpr | InOutExpr | IncomingExpr | OutgoingExpr;
-interface RelationWhereExpr extends Omit<BaseExpr, "where"> {
-	where: {
-		expr: RelationExpression;
-		condition: WhereOperator<string, string>;
-	};
-}
-interface CustomRelationExpr extends Omit<BaseExpr, "customRelation"> {
-	customRelation: {
-		relation: RelationExpression | RelationWhereExpr;
-		title?: string;
-		description?: string;
-		technology?: string;
-		notation?: string;
-		navigateTo?: ViewId;
-		notes?: string;
-		color?: Color;
-		line?: RelationshipLineType;
-		head?: RelationshipArrowType;
-		tail?: RelationshipArrowType;
-	};
-}
-type RelationPredicateExpression = RelationExpression | RelationWhereExpr | CustomRelationExpr;
-type Expression = ElementPredicateExpression | RelationPredicateExpression;
 declare namespace FqnRef {
 	/**
 	 * Represents a reference to an instance within a deployment.
@@ -300,85 +198,410 @@ declare namespace FqnRef {
 		model: F;
 	};
 	const isModelRef: (ref: FqnRef) => ref is ModelRef;
+	/**
+	 * Reference to imported logical model element
+	 */
+	type ImportRef<F = Fqn> = {
+		project: ProjectId;
+		model: F;
+	};
+	const isImportRef: (ref: FqnRef) => ref is ImportRef;
 	const toDeploymentRef: (ref: FqnRef) => DeploymentRef;
+	const toModelFqn: (ref: FqnRef) => Fqn;
 }
 type FqnRef<D = Fqn, M = Fqn> = ExclusiveUnion<{
 	InsideInstanceRef: FqnRef.InsideInstanceRef<D, M>;
 	DeploymentRef: FqnRef.DeploymentRef<D>;
 	ModelRef: FqnRef.ModelRef<M>;
+	ImportRef: FqnRef.ImportRef<M>;
 }>;
 declare namespace FqnExpr {
 	type Wildcard = {
 		wildcard: true;
 	};
-	const isWildcard: (expr: ExpressionV2) => expr is Wildcard;
+	const isWildcard: (expr: ExpressionV2) => expr is FqnExpr.Wildcard;
 	type ModelRef<M = Fqn> = {
-		ref: FqnRef.ModelRef<M>;
+		ref: FqnRef.ModelRef<M> | FqnRef.ImportRef<M>;
 		selector?: PredicateSelector;
 	};
-	const isModelRef: (ref: ExpressionV2) => ref is ModelRef;
+	const isModelRef: (ref: ExpressionV2) => ref is FqnExpr.ModelRef;
 	type DeploymentRef<D = Fqn, M = Fqn> = {
 		ref: FqnRef.DeploymentRef<D> | FqnRef.InsideInstanceRef<D, M>;
 		selector?: PredicateSelector;
 	};
 	const isDeploymentRef: (ref: ExpressionV2) => ref is FqnExpr.DeploymentRef;
+	type ElementKindExpr = {
+		elementKind: ElementKind;
+		isEqual: boolean;
+	};
+	function isElementKindExpr(expr: ExpressionV2): expr is ElementKindExpr;
+	type ElementTagExpr = {
+		elementTag: Tag$1;
+		isEqual: boolean;
+	};
+	function isElementTagExpr(expr: ExpressionV2): expr is ElementTagExpr;
 	type NonWildcard<D = Fqn, M = Fqn> = ExclusiveUnion<{
 		ModelRef: ModelRef<M>;
 		DeploymentRef: DeploymentRef<D, M>;
+		ElementKind: ElementKindExpr;
+		ElementTag: ElementTagExpr;
 	}>;
+	type Where<D = Fqn, M = Fqn> = {
+		where: {
+			expr: ExclusiveUnion<{
+				Wildcard: Wildcard;
+				ModelRef: ModelRef<M>;
+				DeploymentRef: DeploymentRef<D, M>;
+				ElementKind: ElementKindExpr;
+				ElementTag: ElementTagExpr;
+			}>;
+			condition: WhereOperator<string, string>;
+		};
+	};
+	const isWhere: (expr: ExpressionV2) => expr is FqnExpr.Where;
+	type Custom<D = Fqn, M = Fqn> = {
+		custom: {
+			expr: OrWhere<D, M>;
+			title?: string;
+			description?: string;
+			technology?: string;
+			notation?: string;
+			shape?: ElementShape;
+			color?: Color;
+			icon?: IconUrl;
+			border?: BorderStyle;
+			opacity?: number;
+			navigateTo?: ViewId;
+			multiple?: boolean;
+			size?: ShapeSize;
+			padding?: ShapeSize;
+			textSize?: ShapeSize;
+		};
+	};
+	const isCustom: (expr: ExpressionV2) => expr is Custom;
+	const is: (expr: ExpressionV2) => expr is FqnExpr;
+	type OrWhere<D = Fqn, M = Fqn> = ExclusiveUnion<{
+		Wildcard: FqnExpr.Wildcard;
+		ModelRef: FqnExpr.ModelRef<M>;
+		DeploymentRef: FqnExpr.DeploymentRef<D, M>;
+		ElementKind: ElementKindExpr;
+		ElementTag: ElementTagExpr;
+		Where: FqnExpr.Where<D, M>;
+	}>;
+	type Any<D = Fqn, M = Fqn> = ExclusiveUnion<{
+		Wildcard: Wildcard;
+		ModelRef: ModelRef<M>;
+		DeploymentRef: DeploymentRef<D, M>;
+		ElementKind: ElementKindExpr;
+		ElementTag: ElementTagExpr;
+		Where: Where<D, M>;
+		Custom: Custom<D, M>;
+	}>;
+	const unwrap: (expr: FqnExpr) => Wildcard | ModelRef | DeploymentRef | ElementKindExpr | ElementTagExpr;
 }
 type FqnExpr<D = Fqn, M = Fqn> = ExclusiveUnion<{
 	Wildcard: FqnExpr.Wildcard;
 	ModelRef: FqnExpr.ModelRef<M>;
 	DeploymentRef: FqnExpr.DeploymentRef<D, M>;
+	ElementKind: FqnExpr.ElementKindExpr;
+	ElementTag: FqnExpr.ElementTagExpr;
 }>;
 declare namespace RelationExpr {
+	type Endpoint<D = Fqn, M = Fqn> = FqnExpr.Where<D, M>["where"]["expr"];
 	type Direct<D = Fqn, M = Fqn> = {
-		source: FqnExpr<D, M>;
-		target: FqnExpr<D, M>;
+		source: Endpoint<D, M>;
+		target: Endpoint<D, M>;
 		isBidirectional?: boolean;
 	};
-	const isDirect: (expr: ExpressionV2) => expr is Direct;
+	const isDirect: (expr: ExpressionV2) => expr is RelationExpr.Direct;
 	type Incoming<D = Fqn, M = Fqn> = {
-		incoming: FqnExpr<D, M>;
+		incoming: Endpoint<D, M>;
 	};
-	const isIncoming: (expr: ExpressionV2) => expr is Incoming;
+	const isIncoming: (expr: ExpressionV2) => expr is RelationExpr.Incoming;
 	type Outgoing<D = Fqn, M = Fqn> = {
-		outgoing: FqnExpr<D, M>;
+		outgoing: Endpoint<D, M>;
 	};
-	const isOutgoing: (expr: ExpressionV2) => expr is Outgoing;
+	const isOutgoing: (expr: ExpressionV2) => expr is RelationExpr.Outgoing;
 	type InOut<D = Fqn, M = Fqn> = {
-		inout: FqnExpr<D, M>;
+		inout: Endpoint<D, M>;
 	};
-	const isInOut: (expr: ExpressionV2) => expr is InOut;
+	const isInOut: (expr: ExpressionV2) => expr is RelationExpr.InOut;
 	type Where<D = Fqn, M = Fqn> = {
 		where: {
-			expr: ExpressionV2<D, M>;
+			expr: ExclusiveUnion<{
+				Direct: RelationExpr.Direct<D, M>;
+				Incoming: RelationExpr.Incoming<D, M>;
+				Outgoing: RelationExpr.Outgoing<D, M>;
+				InOut: RelationExpr.InOut<D, M>;
+			}>;
 			condition: WhereOperator<string, string>;
 		};
 	};
-	const isWhere: (expr: ExpressionV2) => expr is Where;
+	const isWhere: (expr: ExpressionV2) => expr is RelationExpr.Where;
+	type Custom<D = Fqn, M = Fqn> = {
+		customRelation: {
+			expr: OrWhere<D, M>;
+			title?: string;
+			description?: string;
+			technology?: string;
+			notation?: string;
+			navigateTo?: ViewId;
+			notes?: string;
+			color?: Color;
+			line?: RelationshipLineType;
+			head?: RelationshipArrowType;
+			tail?: RelationshipArrowType;
+		};
+	};
+	const isCustom: (expr: ExpressionV2) => expr is Custom;
+	const is: (expr: ExpressionV2) => expr is RelationExpr;
+	type OrWhere<D = Fqn, M = Fqn> = ExclusiveUnion<{
+		Direct: Direct<D, M>;
+		Incoming: Incoming<D, M>;
+		Outgoing: Outgoing<D, M>;
+		InOut: InOut<D, M>;
+		Where: Where<D, M>;
+	}>;
+	type Any<D = Fqn, M = Fqn> = ExclusiveUnion<{
+		Direct: Direct<D, M>;
+		Incoming: Incoming<D, M>;
+		Outgoing: Outgoing<D, M>;
+		InOut: InOut<D, M>;
+		Where: Where<D, M>;
+		Custom: Custom<D, M>;
+	}>;
+	const unwrap: (expr: RelationExpr) => Direct | Incoming | Outgoing | InOut;
 }
 type RelationExpr<D = Fqn, M = Fqn> = ExclusiveUnion<{
 	Direct: RelationExpr.Direct<D, M>;
 	Incoming: RelationExpr.Incoming<D, M>;
 	Outgoing: RelationExpr.Outgoing<D, M>;
 	InOut: RelationExpr.InOut<D, M>;
-	Where: RelationExpr.Where<D, M>;
 }>;
 type ExpressionV2<D = Fqn, M = Fqn> = ExclusiveUnion<{
 	Wildcard: FqnExpr.Wildcard;
 	ModelRef: FqnExpr.ModelRef<M>;
 	DeploymentRef: FqnExpr.DeploymentRef<D, M>;
+	ElementKind: FqnExpr.ElementKindExpr;
+	ElementTag: FqnExpr.ElementTagExpr;
+	Custom: FqnExpr.Custom<D, M>;
 	Direct: RelationExpr.Direct<D, M>;
 	Incoming: RelationExpr.Incoming<D, M>;
 	Outgoing: RelationExpr.Outgoing<D, M>;
 	InOut: RelationExpr.InOut<D, M>;
-	RelationPredicateOrWhere: RelationExpr.Where<D, M>;
+	Where: ExpressionV2.Where<D, M>;
+	CustomRelation: RelationExpr.Custom<D, M>;
 }>;
 declare namespace ExpressionV2 {
-	const isFqnExpr: (expr: ExpressionV2) => expr is FqnExpr;
-	const isRelation: (expr: ExpressionV2) => expr is RelationExpr;
+	type Where<D = Fqn, M = Fqn> = FqnExpr.Where<D, M> | RelationExpr.Where<D, M>;
+	const isWhere: (expr: ExpressionV2) => expr is ExpressionV2.Where;
+	const isRelationWhere: (expr: ExpressionV2) => expr is RelationExpr.Where;
+	const isFqnExprWhere: (expr: ExpressionV2) => expr is FqnExpr.Where;
+	const isFqnExpr: (expr: ExpressionV2) => expr is FqnExpr.Any;
+	const isRelation: (expr: ExpressionV2) => expr is RelationExpr.Any;
+}
+declare namespace ModelLayer {
+	namespace FqnRef {
+		/**
+		 * Reference to logical model element
+		 */
+		type ModelRef<F = Fqn> = {
+			model: F;
+		};
+		const isModelRef: (ref: FqnRef) => ref is ModelRef;
+		/**
+		 * Reference to imported logical model element
+		 */
+		type ImportRef<F = Fqn> = {
+			project: ProjectId;
+			model: F;
+		};
+		const isImportRef: (ref: FqnRef) => ref is ImportRef;
+		const toFqn: (ref: FqnRef) => Fqn;
+	}
+	type FqnRef<M = Fqn> = ExclusiveUnion<{
+		ModelRef: FqnRef.ModelRef<M>;
+		ImportRef: FqnRef.ImportRef<M>;
+	}>;
+	namespace FqnExpr {
+		type Wildcard = {
+			wildcard: true;
+		};
+		const isWildcard: (expr: Expression) => expr is FqnExpr.Wildcard;
+		type ModelRef<M = Fqn> = {
+			ref: FqnRef.ModelRef<M> | FqnRef.ImportRef<M>;
+			selector?: PredicateSelector;
+		};
+		const isModelRef: (ref: Expression) => ref is FqnExpr.ModelRef;
+		type ElementKindExpr = {
+			elementKind: ElementKind;
+			isEqual: boolean;
+		};
+		function isElementKindExpr(expr: Expression): expr is ElementKindExpr;
+		type ElementTagExpr = {
+			elementTag: Tag$1;
+			isEqual: boolean;
+		};
+		function isElementTagExpr(expr: Expression): expr is ElementTagExpr;
+		type NonWildcard<M = Fqn> = ExclusiveUnion<{
+			ModelRef: ModelRef<M>;
+			ElementKind: ElementKindExpr;
+			ElementTag: ElementTagExpr;
+		}>;
+		type Where<M = Fqn> = {
+			where: {
+				expr: ExclusiveUnion<{
+					Wildcard: Wildcard;
+					ModelRef: ModelRef<M>;
+					ElementKind: ElementKindExpr;
+					ElementTag: ElementTagExpr;
+				}>;
+				condition: WhereOperator<string, string>;
+			};
+		};
+		const isWhere: (expr: Expression) => expr is FqnExpr.Where;
+		type Custom<M = Fqn> = {
+			custom: {
+				expr: FqnExprOrWhere<M>;
+				title?: string;
+				description?: string;
+				technology?: string;
+				notation?: string;
+				shape?: ElementShape;
+				color?: Color;
+				icon?: IconUrl;
+				border?: BorderStyle;
+				opacity?: number;
+				navigateTo?: ViewId;
+				multiple?: boolean;
+				size?: ShapeSize;
+				padding?: ShapeSize;
+				textSize?: ShapeSize;
+			};
+		};
+		const isCustom: (expr: Expression) => expr is FqnExpr.Custom;
+		const is: (expr: Expression) => expr is FqnExpr;
+	}
+	type FqnExpr<M = Fqn> = ExclusiveUnion<{
+		Wildcard: FqnExpr.Wildcard;
+		ModelRef: FqnExpr.ModelRef<M>;
+		ElementKind: FqnExpr.ElementKindExpr;
+		ElementTag: FqnExpr.ElementTagExpr;
+	}>;
+	type FqnExprOrWhere<M = Fqn> = ExclusiveUnion<{
+		Wildcard: FqnExpr.Wildcard;
+		ModelRef: FqnExpr.ModelRef<M>;
+		ElementKind: FqnExpr.ElementKindExpr;
+		ElementTag: FqnExpr.ElementTagExpr;
+		Where: FqnExpr.Where<M>;
+	}>;
+	type AnyFqnExpr<M = Fqn> = ExclusiveUnion<{
+		Wildcard: FqnExpr.Wildcard;
+		ModelRef: FqnExpr.ModelRef<M>;
+		ElementKind: FqnExpr.ElementKindExpr;
+		ElementTag: FqnExpr.ElementTagExpr;
+		Where: FqnExpr.Where<M>;
+		Custom: FqnExpr.Custom<M>;
+	}>;
+	function isAnyFqnExpr(expr: Expression): expr is AnyFqnExpr;
+	namespace RelationExpr {
+		type Direct<M = Fqn> = {
+			source: FqnExpr<M>;
+			target: FqnExpr<M>;
+			isBidirectional?: boolean;
+		};
+		const isDirect: (expr: Expression) => expr is RelationExpr.Direct;
+		type Incoming<M = Fqn> = {
+			incoming: FqnExpr<M>;
+		};
+		const isIncoming: (expr: Expression) => expr is RelationExpr.Incoming;
+		type Outgoing<M = Fqn> = {
+			outgoing: FqnExpr<M>;
+		};
+		const isOutgoing: (expr: Expression) => expr is RelationExpr.Outgoing;
+		type InOut<M = Fqn> = {
+			inout: FqnExpr<M>;
+		};
+		const isInOut: (expr: Expression) => expr is RelationExpr.InOut;
+		type Where<M = Fqn> = {
+			where: {
+				expr: ExclusiveUnion<{
+					Direct: RelationExpr.Direct<M>;
+					Incoming: RelationExpr.Incoming<M>;
+					Outgoing: RelationExpr.Outgoing<M>;
+					InOut: RelationExpr.InOut<M>;
+				}>;
+				condition: WhereOperator<string, string>;
+			};
+		};
+		const isWhere: (expr: Expression) => expr is RelationExpr.Where;
+		type Custom<M = Fqn> = {
+			customRelation: {
+				expr: RelationExprOrWhere<M>;
+				title?: string;
+				description?: string;
+				technology?: string;
+				notation?: string;
+				navigateTo?: ViewId;
+				notes?: string;
+				color?: Color;
+				line?: RelationshipLineType;
+				head?: RelationshipArrowType;
+				tail?: RelationshipArrowType;
+			};
+		};
+		const isCustom: (expr: Expression) => expr is Custom;
+		const is: (expr: Expression) => expr is RelationExpr;
+	}
+	type RelationExpr<M = Fqn> = ExclusiveUnion<{
+		Direct: RelationExpr.Direct<M>;
+		Incoming: RelationExpr.Incoming<M>;
+		Outgoing: RelationExpr.Outgoing<M>;
+		InOut: RelationExpr.InOut<M>;
+	}>;
+	type RelationExprOrWhere<M = Fqn> = ExclusiveUnion<{
+		Direct: RelationExpr.Direct<M>;
+		Incoming: RelationExpr.Incoming<M>;
+		Outgoing: RelationExpr.Outgoing<M>;
+		InOut: RelationExpr.InOut<M>;
+		Where: RelationExpr.Where<M>;
+	}>;
+	type AnyRelationExpr<M = Fqn> = ExclusiveUnion<{
+		Direct: RelationExpr.Direct<M>;
+		Incoming: RelationExpr.Incoming<M>;
+		Outgoing: RelationExpr.Outgoing<M>;
+		InOut: RelationExpr.InOut<M>;
+		Where: RelationExpr.Where<M>;
+		CustomRelation: RelationExpr.Custom<M>;
+	}>;
+	function isAnyRelationExpr(expr: Expression): expr is AnyRelationExpr;
+	/**
+	 * Represents a version 2 expression which can be one of several types.
+	 *
+	 * @template M - The type for the model FQN, defaults to `Fqn`.
+	 */
+	type Expression<M = Fqn> = ExclusiveUnion<{
+		Wildcard: FqnExpr.Wildcard;
+		ModelRef: FqnExpr.ModelRef<M>;
+		ElementKind: FqnExpr.ElementKindExpr;
+		ElementTag: FqnExpr.ElementTagExpr;
+		Custom: FqnExpr.Custom<M>;
+		Direct: RelationExpr.Direct<M>;
+		Incoming: RelationExpr.Incoming<M>;
+		Outgoing: RelationExpr.Outgoing<M>;
+		InOut: RelationExpr.InOut<M>;
+		CustomRelation: RelationExpr.Custom<M>;
+		Where: Expression.Where<M>;
+	}>;
+	function isExpression(expr: any): expr is Expression;
+	namespace Expression {
+		type Where<M = Fqn> = FqnExpr.Where<M> | RelationExpr.Where<M>;
+		const isWhere: (expr: Expression) => expr is Expression.Where;
+		const isCustomFqnExpr: (expr: Expression) => expr is FqnExpr.Custom;
+		const isCustomRelationExpr: (expr: Expression) => expr is RelationExpr.Custom;
+		const isFqnExpr: (expr: Expression) => expr is FqnExpr;
+		const isRelation: (expr: Expression) => expr is RelationExpr;
+	}
 }
 type GlobalPredicateId = Tagged<string, "GlobalPredicateId">;
 type GlobalStyleID = Tagged<string, "GlobalStyleID">;
@@ -390,17 +613,17 @@ type ElementNotation = {
 };
 type ViewId<Id extends string = string> = Tagged<Id, "ViewID">;
 type ViewRulePredicate = {
-	include: Expression[];
+	include: ModelLayer.Expression[];
 	exclude?: never;
 } | {
 	include?: never;
-	exclude: Expression[];
+	exclude: ModelLayer.Expression[];
 };
 interface ViewRuleGlobalPredicateRef {
 	predicateId: GlobalPredicateId;
 }
 interface ViewRuleStyle {
-	targets: ElementExpression[];
+	targets: ModelLayer.FqnExpr[];
 	notation?: string;
 	style: ElementStyle & {
 		color?: Color;
@@ -488,7 +711,7 @@ interface DynamicViewParallelSteps {
 }
 type DynamicViewStepOrParallel = DynamicViewStep | DynamicViewParallelSteps;
 type DynamicViewIncludeRule = {
-	include: ElementPredicateExpression[];
+	include: ModelLayer.AnyFqnExpr[];
 };
 type DynamicViewRule = DynamicViewIncludeRule | ViewRuleGlobalPredicateRef | ViewRuleStyle | ViewRuleGlobalStyle | ViewRuleAutoLayout;
 interface DynamicView<ViewIDs extends string = string, Tags extends string = string> extends BasicView<"dynamic", ViewIDs, Tags> {
@@ -804,52 +1027,62 @@ type CoordinateExtent = [
 ];
 type Optional<T, K extends keyof T> = Pick<Partial<T>, K> & Omit<T, K>;
 type NodeBase<NodeData extends Record<string, unknown> = Record<string, unknown>, NodeType extends string = string> = {
-	/** Unique id of a node */
+	/** Unique id of a node. */
 	id: string;
 	/**
-	 * Position of a node on the pane
+	 * Position of a node on the pane.
 	 * @example { x: 0, y: 0 }
 	 */
 	position: XYPosition;
-	/** Arbitrary data passed to a node */
+	/** Arbitrary data passed to a node. */
 	data: NodeData;
-	/** Type of node defined in nodeTypes */
+	/** Type of node defined in `nodeTypes`. */
 	type?: NodeType;
 	/**
-	 * Only relevant for default, source, target nodeType. controls source position
+	 * Only relevant for default, source, target nodeType. Controls source position.
 	 * @example 'right', 'left', 'top', 'bottom'
 	 */
 	sourcePosition?: Position;
 	/**
-	 * Only relevant for default, source, target nodeType. controls target position
+	 * Only relevant for default, source, target nodeType. Controls target position.
 	 * @example 'right', 'left', 'top', 'bottom'
 	 */
 	targetPosition?: Position;
+	/** Whether or not the node should be visible on the canvas. */
 	hidden?: boolean;
 	selected?: boolean;
-	/** True, if node is being dragged */
+	/** Whether or not the node is currently being dragged. */
 	dragging?: boolean;
+	/** Whether or not the node is able to be dragged. */
 	draggable?: boolean;
 	selectable?: boolean;
 	connectable?: boolean;
 	deletable?: boolean;
+	/**
+	 * A class name that can be applied to elements inside the node that allows those elements to act
+	 * as drag handles, letting the user drag the node by clicking and dragging on those elements.
+	 */
 	dragHandle?: string;
 	width?: number;
 	height?: number;
 	initialWidth?: number;
 	initialHeight?: number;
-	/** Parent node id, used for creating sub-flows */
+	/** Parent node id, used for creating sub-flows. */
 	parentId?: string;
 	zIndex?: number;
 	/**
-	 * Boundary a node can be moved in
+	 * Boundary a node can be moved in.
 	 * @example 'parent' or [[0, 0], [100, 100]]
 	 */
 	extent?: "parent" | CoordinateExtent;
+	/**
+	 * When `true`, the parent node will automatically expand if this node is dragged to the edge of
+	 * the parent node's bounds.
+	 */
 	expandParent?: boolean;
 	ariaLabel?: string;
 	/**
-	 * Origin of the node relative to it's position
+	 * Origin of the node relative to its position.
 	 * @example
 	 * [0.5, 0.5] // centers the node
 	 * [0, 0] // top left
@@ -862,7 +1095,7 @@ type NodeBase<NodeData extends Record<string, unknown> = Record<string, unknown>
 		height?: number;
 	};
 };
-type InternalNodeBase<NodeType extends NodeBase = NodeBase> = NodeType & {
+type InternalNodeBase<NodeType extends NodeBase = NodeBase> = Omit<NodeType, "measured"> & {
 	measured: {
 		width?: number;
 		height?: number;
@@ -880,11 +1113,11 @@ type InternalNodeBase<NodeType extends NodeBase = NodeBase> = NodeType & {
 	};
 };
 type NodeProps<NodeType extends NodeBase> = Pick<NodeType, "id" | "data" | "width" | "height" | "sourcePosition" | "targetPosition" | "dragHandle" | "parentId"> & Required<Pick<NodeType, "type" | "dragging" | "zIndex" | "selectable" | "deletable" | "selected" | "draggable">> & {
-	/** whether a node is connectable or not */
+	/** Whether a node is connectable or not. */
 	isConnectable: boolean;
-	/** position absolute x value */
+	/** Position absolute x value. */
 	positionAbsoluteX: number;
-	/** position absolute x value */
+	/** Position absolute y value. */
 	positionAbsoluteY: number;
 };
 type NodeHandleBounds = {
@@ -922,9 +1155,13 @@ type SetViewport = (viewport: Viewport, options?: ViewportHelperFunctionOptions)
 type SetCenter = (x: number, y: number, options?: SetCenterOptions) => Promise<boolean>;
 type FitBounds = (bounds: Rect, options?: FitBoundsOptions) => Promise<boolean>;
 type Connection = {
+	/** The id of the node this connection originates from. */
 	source: string;
+	/** The id of the node this connection terminates at. */
 	target: string;
+	/** When not `null`, the id of the handle on the source node that this connection originates from. */
 	sourceHandle: string | null;
+	/** When not `null`, the id of the handle on the target node that this connection terminates at. */
 	targetHandle: string | null;
 };
 type HandleConnection = Connection & {
@@ -1012,15 +1249,28 @@ type NoConnection = {
 	toNode: null;
 };
 type ConnectionInProgress<NodeType extends InternalNodeBase = InternalNodeBase> = {
+	/** Indicates whether a connection is currently in progress. */
 	inProgress: true;
+	/**
+	 * If an ongoing connection is above a handle or inside the connection radius, this will be `true`
+	 * or `false`, otherwise `null`.
+	 */
 	isValid: boolean | null;
+	/** Returns the xy start position or `null` if no connection is in progress. */
 	from: XYPosition;
+	/** Returns the start handle or `null` if no connection is in progress. */
 	fromHandle: Handle;
+	/** Returns the side (called position) of the start handle or `null` if no connection is in progress. */
 	fromPosition: Position;
+	/** Returns the start node or `null` if no connection is in progress. */
 	fromNode: NodeType;
+	/** Returns the xy end position or `null` if no connection is in progress. */
 	to: XYPosition;
+	/** Returns the end handle or `null` if no connection is in progress. */
 	toHandle: Handle | null;
+	/** Returns the side (called position) of the end handle or `null` if no connection is in progress. */
 	toPosition: Position;
+	/** Returns the end node or `null` if no connection is in progress. */
 	toNode: NodeType | null;
 };
 type ConnectionState<NodeType extends InternalNodeBase = InternalNodeBase> = ConnectionInProgress<NodeType> | NoConnection;
@@ -1035,44 +1285,41 @@ type OnBeforeDeleteBase<NodeType extends NodeBase = NodeBase, EdgeType extends E
 	edges: EdgeType[];
 }>;
 type EdgeBase<EdgeData extends Record<string, unknown> = Record<string, unknown>, EdgeType extends string | undefined = string | undefined> = {
-	/** Unique id of an edge */
+	/** Unique id of an edge. */
 	id: string;
-	/** Type of an edge defined in edgeTypes */
+	/** Type of edge defined in `edgeTypes`. */
 	type?: EdgeType;
-	/** Id of source node */
+	/** Id of source node. */
 	source: string;
-	/** Id of target node */
+	/** Id of target node. */
 	target: string;
-	/**
-	 * Id of source handle
-	 * only needed if there are multiple handles per node
-	 */
+	/** Id of source handle, only needed if there are multiple handles per node. */
 	sourceHandle?: string | null;
-	/**
-	 * Id of target handle
-	 * only needed if there are multiple handles per node
-	 */
+	/** Id of target handle, only needed if there are multiple handles per node. */
 	targetHandle?: string | null;
 	animated?: boolean;
 	hidden?: boolean;
 	deletable?: boolean;
 	selectable?: boolean;
-	/** Arbitrary data passed to an edge */
+	/** Arbitrary data passed to an edge. */
 	data?: EdgeData;
 	selected?: boolean;
 	/**
-	 * Set the marker on the beginning of an edge
+	 * Set the marker on the beginning of an edge.
 	 * @example 'arrow', 'arrowclosed' or custom marker
 	 */
 	markerStart?: EdgeMarkerType;
 	/**
-	 * Set the marker on the end of an edge
+	 * Set the marker on the end of an edge.
 	 * @example 'arrow', 'arrowclosed' or custom marker
 	 */
 	markerEnd?: EdgeMarkerType;
 	zIndex?: number;
 	ariaLabel?: string;
-	/** Padding around the edge where interaction is still possible */
+	/**
+	 * ReactFlow renders an invisible path around each edge to make them easier to click or tap on.
+	 * This property sets the width of that invisible path.
+	 */
 	interactionWidth?: number;
 };
 type DefaultEdgeOptionsBase<EdgeType extends EdgeBase> = Omit<EdgeType, "id" | "source" | "target" | "sourceHandle" | "targetHandle" | "selected">;
@@ -1143,14 +1390,15 @@ type ViewportHelperFunctions = {
 	 */
 	zoomOut: ZoomInOut;
 	/**
-	 * Sets the current zoom level.
+	 * Zoom the viewport to a given zoom level. Passing in a `duration` will animate the viewport to
+	 * the new zoom level.
 	 *
 	 * @param zoomLevel - the zoom level to set
 	 * @param options.duration - optional duration. If set, a transition will be applied
 	 */
 	zoomTo: ZoomTo;
 	/**
-	 * Returns the current zoom level.
+	 * Get the current zoom level of the viewport.
 	 *
 	 * @returns current zoom as a number
 	 */
@@ -1169,7 +1417,8 @@ type ViewportHelperFunctions = {
 	 */
 	getViewport: GetViewport;
 	/**
-	 * Sets the center of the view to the given position.
+	 * Center the viewport on a given position. Passing in a `duration` will animate the viewport to
+	 * the new position.
 	 *
 	 * @param x - x position
 	 * @param y - y position
@@ -1177,14 +1426,17 @@ type ViewportHelperFunctions = {
 	 */
 	setCenter: SetCenter;
 	/**
-	 * Fits the view to the given bounds .
+	 * A low-level utility function to fit the viewport to a given rectangle. By passing in a
+	 * `duration`, the viewport will animate from its current position to the new position. The
+	 * `padding` option can be used to add space around the bounds.
 	 *
 	 * @param bounds - the bounds ({ x: number, y: number, width: number, height: number }) to fit the view to
 	 * @param options.padding - optional padding
 	 */
 	fitBounds: FitBounds;
 	/**
-	 * Converts a screen / client position to a flow position.
+	 * With this function you can translate a screen pixel position to a flow position. It is useful
+	 * for implementing drag and drop from a sidebar for example.
 	 *
 	 * @param clientPosition - the screen / client position. When you are working with events you can use event.clientX and event.clientY
 	 * @param options.snapToGrid - if true, the converted position will be snapped to the grid
@@ -1197,7 +1449,7 @@ type ViewportHelperFunctions = {
 		snapToGrid: boolean;
 	}) => XYPosition;
 	/**
-	 * Converts a flow position to a screen / client position.
+	 * Translate a position inside the flow's canvas to a screen pixel position.
 	 *
 	 * @param flowPosition - the screen / client position. When you are working with events you can use event.clientX and event.clientY
 	 * @returns position as { x: number, y: number }
@@ -1241,6 +1493,11 @@ type EdgeLabelOptions = {
 type Edge<EdgeData extends Record<string, unknown> = Record<string, unknown>, EdgeType extends string | undefined = string | undefined> = EdgeBase<EdgeData, EdgeType> & EdgeLabelOptions & {
 	style?: CSSProperties;
 	className?: string;
+	/**
+	 * Determines whether the edge can be updated by dragging the source or target to a new node.
+	 * This property will override the default set by the `edgesReconnectable` prop on the
+	 * `<ReactFlow />` component.
+	 */
 	reconnectable?: boolean | HandleType;
 	focusable?: boolean;
 };
@@ -1258,7 +1515,9 @@ type OnReconnect<EdgeType extends Edge = Edge> = (oldEdge: EdgeType, newConnecti
 type ConnectionLineComponentProps<NodeType extends Node$1 = Node$1> = {
 	connectionLineStyle?: CSSProperties;
 	connectionLineType: ConnectionLineType;
+	/** The node the connection line originates from. */
 	fromNode: InternalNode<NodeType>;
+	/** The handle on the `fromNode` that the connection line originates from. */
 	fromHandle: Handle;
 	fromX: number;
 	fromY: number;
@@ -1266,6 +1525,10 @@ type ConnectionLineComponentProps<NodeType extends Node$1 = Node$1> = {
 	toY: number;
 	fromPosition: Position;
 	toPosition: Position;
+	/**
+	 * If there is an `isValidConnection` callback, this prop will be set to `"valid"` or `"invalid"`
+	 * based on the return value of that callback. Otherwise, it will be `null`.
+	 */
 	connectionStatus: "valid" | "invalid" | null;
 	toNode: InternalNode<NodeType> | null;
 	toHandle: Handle | null;
@@ -1274,6 +1537,7 @@ type ConnectionLineComponent<NodeType extends Node$1 = Node$1> = ComponentType<C
 interface ReactFlowProps<NodeType extends Node$1 = Node$1, EdgeType extends Edge = Edge> extends Omit<HTMLAttributes<HTMLDivElement>, "onError"> {
 	/**
 	 * An array of nodes to render in a controlled flow.
+	 * @default []
 	 * @example
 	 * const nodes = [
 	 *  {
@@ -1287,6 +1551,7 @@ interface ReactFlowProps<NodeType extends Node$1 = Node$1, EdgeType extends Edge
 	nodes?: NodeType[];
 	/**
 	 * An array of edges to render in a controlled flow.
+	 * @default []
 	 * @example
 	 * const edges = [
 	 *  {
@@ -1322,51 +1587,66 @@ interface ReactFlowProps<NodeType extends Node$1 = Node$1, EdgeType extends Edge
 	 * }
 	 */
 	defaultEdgeOptions?: DefaultEdgeOptions;
-	/** This event handler is called when a user clicks on a node */
+	/** This event handler is called when a user clicks on a node. */
 	onNodeClick?: NodeMouseHandler<NodeType>;
-	/** This event handler is called when a user double clicks on a node */
+	/** This event handler is called when a user double-clicks on a node. */
 	onNodeDoubleClick?: NodeMouseHandler<NodeType>;
-	/** This event handler is called when mouse of a user enters a node */
+	/** This event handler is called when mouse of a user enters a node. */
 	onNodeMouseEnter?: NodeMouseHandler<NodeType>;
-	/** This event handler is called when mouse of a user moves over a node */
+	/** This event handler is called when mouse of a user moves over a node. */
 	onNodeMouseMove?: NodeMouseHandler<NodeType>;
-	/** This event handler is called when mouse of a user leaves a node */
+	/** This event handler is called when mouse of a user leaves a node. */
 	onNodeMouseLeave?: NodeMouseHandler<NodeType>;
-	/** This event handler is called when a user right clicks on a node */
+	/** This event handler is called when a user right-clicks on a node. */
 	onNodeContextMenu?: NodeMouseHandler<NodeType>;
-	/** This event handler is called when a user starts to drag a node */
+	/** This event handler is called when a user starts to drag a node. */
 	onNodeDragStart?: OnNodeDrag<NodeType>;
-	/** This event handler is called when a user drags a node */
+	/** This event handler is called when a user drags a node. */
 	onNodeDrag?: OnNodeDrag<NodeType>;
-	/** This event handler is called when a user stops dragging a node */
+	/** This event handler is called when a user stops dragging a node. */
 	onNodeDragStop?: OnNodeDrag<NodeType>;
-	/** This event handler is called when a user clicks on an edge */
+	/** This event handler is called when a user clicks on an edge. */
 	onEdgeClick?: (event: ReactMouseEvent, edge: EdgeType) => void;
-	/** This event handler is called when a user right clicks on an edge */
+	/** This event handler is called when a user right-clicks on an edge. */
 	onEdgeContextMenu?: EdgeMouseHandler<EdgeType>;
-	/** This event handler is called when mouse of a user enters an edge */
+	/** This event handler is called when mouse of a user enters an edge. */
 	onEdgeMouseEnter?: EdgeMouseHandler<EdgeType>;
-	/** This event handler is called when mouse of a user moves over an edge */
+	/** This event handler is called when mouse of a user moves over an edge. */
 	onEdgeMouseMove?: EdgeMouseHandler<EdgeType>;
-	/** This event handler is called when mouse of a user leaves an edge */
+	/** This event handler is called when mouse of a user leaves an edge. */
 	onEdgeMouseLeave?: EdgeMouseHandler<EdgeType>;
-	/** This event handler is called when a user double clicks on an edge */
+	/** This event handler is called when a user double-clicks on an edge. */
 	onEdgeDoubleClick?: EdgeMouseHandler<EdgeType>;
+	/**
+	 * This handler is called when the source or target of a reconnectable edge is dragged from the
+	 * current node. It will fire even if the edge's source or target do not end up changing.
+	 *
+	 * You can use the `reconnectEdge` utility to convert the connection to a new edge.
+	 */
 	onReconnect?: OnReconnect<EdgeType>;
+	/**
+	 * This event fires when the user begins dragging the source or target of an editable edge.
+	 */
 	onReconnectStart?: (event: ReactMouseEvent, edge: EdgeType, handleType: HandleType) => void;
+	/**
+	 * This event fires when the user releases the source or target of an editable edge. It is called
+	 * even if an edge update does not occur.
+	 *
+	 */
 	onReconnectEnd?: (event: MouseEvent | TouchEvent, edge: EdgeType, handleType: HandleType) => void;
 	/**
-	 * This event handler is called when a Node is updated
+	 * Use this event handler to add interactivity to a controlled flow.
+	 * It is called on node drag, select, and move.
 	 * @example // Use NodesState hook to create edges and get onNodesChange handler
 	 * import ReactFlow, { useNodesState } from '@xyflow/react';
-	 * const [edges, setNodes, onNodesChange] = useNodesState(initialNodes);
+	 * const [nodes, setNodes, onNodesChange] = useNodesState(initialNodes);
 	 *
 	 * return (<ReactFlow onNodeChange={onNodeChange} {...rest} />)
-	 * @example // Use helper function to update edge
+	 * @example // Use helper function to update node
 	 * import ReactFlow, { applyNodeChanges } from '@xyflow/react';
 	 *
 	 * const onNodeChange = useCallback(
-	 *  (changes) => setNode((eds) => applyNodeChanges(changes, eds)),
+	 *  (changes) => setNode((nds) => applyNodeChanges(changes, nds)),
 	 *  [],
 	 * );
 	 *
@@ -1374,7 +1654,8 @@ interface ReactFlowProps<NodeType extends Node$1 = Node$1, EdgeType extends Edge
 	 */
 	onNodesChange?: OnNodesChange<NodeType>;
 	/**
-	 * This event handler is called when a Edge is updated
+	 * Use this event handler to add interactivity to a controlled flow. It is called on edge select
+	 * and remove.
 	 * @example // Use EdgesState hook to create edges and get onEdgesChange handler
 	 * import ReactFlow, { useEdgesState } from '@xyflow/react';
 	 * const [edges, setEdges, onEdgesChange] = useEdgesState(initialEdges);
@@ -1391,25 +1672,28 @@ interface ReactFlowProps<NodeType extends Node$1 = Node$1, EdgeType extends Edge
 	 * return (<ReactFlow onEdgesChange={onEdgesChange} {...rest} />)
 	 */
 	onEdgesChange?: OnEdgesChange<EdgeType>;
-	/** This event handler gets called when a Node is deleted */
+	/** This event handler gets called when a node is deleted. */
 	onNodesDelete?: OnNodesDelete<NodeType>;
-	/** This event handler gets called when a Edge is deleted */
+	/** This event handler gets called when an edge is deleted. */
 	onEdgesDelete?: OnEdgesDelete<EdgeType>;
-	/** This event handler gets called when a Node or Edge is deleted */
+	/** This event handler gets called when a node or edge is deleted. */
 	onDelete?: OnDelete<NodeType, EdgeType>;
-	/** This event handler gets called when a user starts to drag a selection box */
+	/** This event handler gets called when a user starts to drag a selection box. */
 	onSelectionDragStart?: SelectionDragHandler<NodeType>;
-	/** This event handler gets called when a user drags a selection box */
+	/** This event handler gets called when a user drags a selection box. */
 	onSelectionDrag?: SelectionDragHandler<NodeType>;
-	/** This event handler gets called when a user stops dragging a selection box */
+	/** This event handler gets called when a user stops dragging a selection box. */
 	onSelectionDragStop?: SelectionDragHandler<NodeType>;
 	onSelectionStart?: (event: ReactMouseEvent) => void;
 	onSelectionEnd?: (event: ReactMouseEvent) => void;
+	/**
+	 * This event handler is called when a user right-clicks on a node selection.
+	 */
 	onSelectionContextMenu?: (event: ReactMouseEvent, nodes: NodeType[]) => void;
 	/**
 	 * When a connection line is completed and two nodes are connected by the user, this event fires with the new connection.
 	 *
-	 * You can use the addEdge utility to convert the connection to a complete edge.
+	 * You can use the `addEdge` utility to convert the connection to a complete edge.
 	 * @example // Use helper function to update edges onConnect
 	 * import ReactFlow, { addEdge } from '@xyflow/react';
 	 *
@@ -1421,50 +1705,70 @@ interface ReactFlowProps<NodeType extends Node$1 = Node$1, EdgeType extends Edge
 	 * return (<ReactFlow onConnect={onConnect} {...rest} />)
 	 */
 	onConnect?: OnConnect;
-	/** This event handler gets called when a user starts to drag a connection line */
+	/** This event handler gets called when a user starts to drag a connection line. */
 	onConnectStart?: OnConnectStart;
-	/** This event handler gets called when a user stops dragging a connection line */
+	/**
+	 * This callback will fire regardless of whether a valid connection could be made or not. You can
+	 * use the second `connectionState` parameter to have different behavior when a connection was
+	 * unsuccessful.
+	 */
 	onConnectEnd?: OnConnectEnd;
 	onClickConnectStart?: OnConnectStart;
 	onClickConnectEnd?: OnConnectEnd;
-	/** This event handler gets called when a flow has finished initializing */
+	/**
+	 * The `onInit` callback is called when the viewport is initialized. At this point you can use the
+	 * instance to call methods like `fitView` or `zoomTo`.
+	 */
 	onInit?: OnInit<NodeType, EdgeType>;
 	/** This event handler is called while the user is either panning or zooming the viewport. */
 	onMove?: OnMove;
-	/** This event handler gets called when a user starts to pan or zoom the viewport */
+	/** This event handler is called when the user begins to pan or zoom the viewport. */
 	onMoveStart?: OnMoveStart;
-	/** This event handler gets called when a user stops panning or zooming the viewport */
+	/**
+	 * This event handler is called when panning or zooming viewport movement stops.
+	 * If the movement is not user-initiated, the event parameter will be `null`.
+	 */
 	onMoveEnd?: OnMoveEnd;
-	/** This event handler gets called when a user changes group of selected elements in the flow */
+	/** This event handler gets called when a user changes group of selected elements in the flow. */
 	onSelectionChange?: OnSelectionChangeFunc<NodeType, EdgeType>;
-	/** This event handler gets called when user scroll inside the pane */
+	/** This event handler gets called when user scroll inside the pane. */
 	onPaneScroll?: (event?: WheelEvent) => void;
-	/** This event handler gets called when user clicks inside the pane */
+	/** This event handler gets called when user clicks inside the pane. */
 	onPaneClick?: (event: ReactMouseEvent) => void;
-	/** This event handler gets called when user right clicks inside the pane */
+	/** This event handler gets called when user right clicks inside the pane. */
 	onPaneContextMenu?: (event: ReactMouseEvent | MouseEvent) => void;
-	/** This event handler gets called when mouse enters the pane */
+	/** This event handler gets called when mouse enters the pane. */
 	onPaneMouseEnter?: (event: ReactMouseEvent) => void;
-	/** This event handler gets called when mouse moves over the pane */
+	/** This event handler gets called when mouse moves over the pane. */
 	onPaneMouseMove?: (event: ReactMouseEvent) => void;
-	/** This event handler gets called when mouse leaves the pane */
+	/** This event handler gets called when mouse leaves the pane. */
 	onPaneMouseLeave?: (event: ReactMouseEvent) => void;
 	/**
-	 * Distance that the mouse can move between mousedown/up that will trigger a click
+	 * Distance that the mouse can move between mousedown/up that will trigger a click.
 	 * @default 0
 	 */
 	paneClickDistance?: number;
 	/**
-	 * Distance that the mouse can move between mousedown/up that will trigger a click
+	 * Distance that the mouse can move between mousedown/up that will trigger a click.
 	 * @default 0
 	 */
 	nodeClickDistance?: number;
-	/** This handler gets called before the user deletes nodes or edges and provides a way to abort the deletion by returning false. */
+	/**
+	 * This handler is called before nodes or edges are deleted, allowing the deletion to be aborted
+	 * by returning `false` or modified by returning updated nodes and edges.
+	 */
 	onBeforeDelete?: OnBeforeDelete<NodeType, EdgeType>;
 	/**
 	 * Custom node types to be available in a flow.
 	 *
-	 * React Flow matches a node's type to a component in the nodeTypes object.
+	 * React Flow matches a node's type to a component in the `nodeTypes` object.
+	 * @TODO check if @default is correct
+	 * @default {
+	 *   input: InputNode,
+	 *   default: DefaultNode,
+	 *   output: OutputNode,
+	 *   group: GroupNode
+	 * }
 	 * @example
 	 * import CustomNode from './CustomNode';
 	 *
@@ -1474,7 +1778,15 @@ interface ReactFlowProps<NodeType extends Node$1 = Node$1, EdgeType extends Edge
 	/**
 	 * Custom edge types to be available in a flow.
 	 *
-	 * React Flow matches an edge's type to a component in the edgeTypes object.
+	 * React Flow matches an edge's type to a component in the `edgeTypes` object.
+	 * @TODO check if @default is correct
+	 * @default {
+	 *   default: BezierEdge,
+	 *   straight: StraightEdge,
+	 *   step: StepEdge,
+	 *   smoothstep: SmoothStepEdge,
+	 *   simplebezier: SimpleBezier
+	 * }
 	 * @example
 	 * import CustomEdge from './CustomEdge';
 	 *
@@ -1485,91 +1797,110 @@ interface ReactFlowProps<NodeType extends Node$1 = Node$1, EdgeType extends Edge
 	 * The type of edge path to use for connection lines.
 	 *
 	 * Although created edges can be of any type, React Flow needs to know what type of path to render for the connection line before the edge is created!
+	 * @default ConnectionLineType.Bezier
 	 */
 	connectionLineType?: ConnectionLineType;
-	/** Styles to be applied to the connection line */
+	/** Styles to be applied to the connection line. */
 	connectionLineStyle?: CSSProperties;
-	/** React Component to be used as a connection line */
+	/** React Component to be used as a connection line. */
 	connectionLineComponent?: ConnectionLineComponent<NodeType>;
-	/** Styles to be applied to the container of the connection line */
+	/** Styles to be applied to the container of the connection line. */
 	connectionLineContainerStyle?: CSSProperties;
 	/**
-	 * 'strict' connection mode will only allow you to connect source handles to target handles.
-	 *
-	 * 'loose' connection mode will allow you to connect handles of any type to one another.
+	 * A loose connection mode will allow you to connect handles with differing types, including
+	 * source-to-source connections. However, it does not support target-to-target connections. Strict
+	 * mode allows only connections between source handles and target handles.
 	 * @default 'strict'
 	 */
 	connectionMode?: ConnectionMode;
 	/**
-	 * Pressing down this key deletes all selected nodes & edges.
+	 * If set, pressing the key or chord will delete any selected nodes and edges. Passing an array
+	 * represents multiple keys that can be pressed.
+	 *
+	 * For example, `["Delete", "Backspace"]` will delete selected elements when either key is pressed.
 	 * @default 'Backspace'
 	 */
 	deleteKeyCode?: KeyCode | null;
 	/**
-	 * If a key is set, you can pan the viewport while that key is held down even if panOnScroll is set to false.
+	 * If set, holding this key will let you click and drag to draw a selection box around multiple
+	 * nodes and edges. Passing an array represents multiple keys that can be pressed.
 	 *
-	 * By setting this prop to null you can disable this functionality.
-	 * @default 'Space'
+	 * For example, `["Shift", "Meta"]` will allow you to draw a selection box when either key is
+	 * pressed.
+	 * @default 'Shift'
 	 */
 	selectionKeyCode?: KeyCode | null;
-	/** Select multiple elements with a selection box, without pressing down selectionKey */
+	/**
+	 * Select multiple elements with a selection box, without pressing down `selectionKey`.
+	 * @default false
+	 */
 	selectionOnDrag?: boolean;
 	/**
-	 * When set to "partial", when the user creates a selection box by click and dragging nodes that are only partially in the box are still selected.
+	 * When set to `"partial"`, when the user creates a selection box by click and dragging nodes that
+	 * are only partially in the box are still selected.
 	 * @default 'full'
 	 */
 	selectionMode?: SelectionMode$1;
 	/**
-	 * If a key is set, you can pan the viewport while that key is held down even if panOnScroll is set to false.
+	 * If a key is set, you can pan the viewport while that key is held down even if `panOnScroll`
+	 * is set to `false`.
 	 *
-	 * By setting this prop to null you can disable this functionality.
+	 * By setting this prop to `null` you can disable this functionality.
 	 * @default 'Space'
 	 */
 	panActivationKeyCode?: KeyCode | null;
 	/**
 	 * Pressing down this key you can select multiple elements by clicking.
-	 * @default 'Meta' for macOS, "Ctrl" for other systems
+	 * @default "Meta" for macOS, "Control" for other systems
 	 */
 	multiSelectionKeyCode?: KeyCode | null;
 	/**
-	 * If a key is set, you can zoom the viewport while that key is held down even if panOnScroll is set to false.
+	 * If a key is set, you can zoom the viewport while that key is held down even if `panOnScroll`
+	 * is set to `false`.
 	 *
-	 * By setting this prop to null you can disable this functionality.
-	 * @default 'Meta' for macOS, "Ctrl" for other systems
+	 * By setting this prop to `null` you can disable this functionality.
+	 * @default "Meta" for macOS, "Control" for other systems
 	 *
 	 */
 	zoomActivationKeyCode?: KeyCode | null;
-	/** Set this prop to make the flow snap to the grid */
+	/** When enabled, nodes will snap to the grid when dragged. */
 	snapToGrid?: boolean;
 	/**
-	 * Grid all nodes will snap to
+	 * If `snapToGrid` is enabled, this prop configures the grid that nodes will snap to.
 	 * @example [20, 20]
 	 */
 	snapGrid?: SnapGrid;
 	/**
-	 * You can enable this optimisation to instruct Svelte Flow to only render nodes and edges that would be visible in the viewport.
+	 * You can enable this optimisation to instruct React Flow to only render nodes and edges that would be visible in the viewport.
 	 *
 	 * This might improve performance when you have a large number of nodes and edges but also adds an overhead.
 	 * @default false
 	 */
 	onlyRenderVisibleElements?: boolean;
 	/**
-	 * Controls if all nodes should be draggable
+	 * Controls whether all nodes should be draggable or not. Individual nodes can override this
+	 * setting by setting their `draggable` prop. If you want to use the mouse handlers on
+	 * non-draggable nodes, you need to add the `"nopan"` class to those nodes.
 	 * @default true
 	 */
 	nodesDraggable?: boolean;
 	/**
-	 * Controls if all nodes should be connectable to each other
+	 * Controls whether all nodes should be connectable or not. Individual nodes can override this
+	 * setting by setting their `connectable` prop.
 	 * @default true
 	 */
 	nodesConnectable?: boolean;
 	/**
-	 * Controls if all nodes should be focusable
+	 * When `true`, focus between nodes can be cycled with the `Tab` key and selected with the `Enter`
+	 * key. This option can be overridden by individual nodes by setting their `focusable` prop.
 	 * @default true
 	 */
 	nodesFocusable?: boolean;
 	/**
-	 * Defines nodes relative position to its coordinates
+	 * The origin of the node to use when placing it in the flow or looking up its `x` and `y`
+	 * position. An origin of `[0, 0]` means that a node's top left corner will be placed at the `x`
+	 * and `y` position.
+	 * @default [0, 0]
 	 * @example
 	 * [0, 0] // default, top left
 	 * [0.5, 0.5] // center
@@ -1577,49 +1908,57 @@ interface ReactFlowProps<NodeType extends Node$1 = Node$1, EdgeType extends Edge
 	 */
 	nodeOrigin?: NodeOrigin;
 	/**
-	 * Controls if all edges should be focusable
+	 * When `true`, focus between edges can be cycled with the `Tab` key and selected with the `Enter`
+	 * key. This option can be overridden by individual edges by setting their `focusable` prop.
 	 * @default true
 	 */
 	edgesFocusable?: boolean;
 	/**
-	 * Controls if all edges should be updateable
+	 * Whether edges can be updated once they are created. When both this prop is `true` and an
+	 * `onReconnect` handler is provided, the user can drag an existing edge to a new source or
+	 * target. Individual edges can override this value with their reconnectable property.
 	 * @default true
 	 */
 	edgesReconnectable?: boolean;
 	/**
-	 * Controls if all elements should (nodes & edges) be selectable
+	 * When `true`, elements (nodes and edges) can be selected by clicking on them. This option can be
+	 * overridden by individual elements by setting their `selectable` prop.
 	 * @default true
 	 */
 	elementsSelectable?: boolean;
 	/**
-	 * If true, nodes get selected on drag
+	 * If `true`, nodes get selected on drag.
 	 * @default true
 	 */
 	selectNodesOnDrag?: boolean;
 	/**
-	 * Enableing this prop allows users to pan the viewport by clicking and dragging.
+	 * Enabling this prop allows users to pan the viewport by clicking and dragging.
 	 *
 	 * You can also set this prop to an array of numbers to limit which mouse buttons can activate panning.
+	 * @default true
 	 * @example [0, 2] // allows panning with the left and right mouse buttons
 	 * [0, 1, 2, 3, 4] // allows panning with all mouse buttons
 	 */
 	panOnDrag?: boolean | number[];
 	/**
-	 * Minimum zoom level
+	 * Minimum zoom level.
 	 * @default 0.5
 	 */
 	minZoom?: number;
 	/**
-	 * Maximum zoom level
+	 * Maximum zoom level.
 	 * @default 2
 	 */
 	maxZoom?: number;
-	/** Controlled viewport to be used instead of internal one */
+	/**
+	 * When you pass a `viewport` prop, it's controlled, and you also need to pass `onViewportChange`
+	 * to handle internal changes.
+	 */
 	viewport?: Viewport;
 	/**
-	 * Sets the initial position and zoom of the viewport.
-	 *
-	 * If a default viewport is provided but fitView is enabled, the default viewport will be ignored.
+	 * Sets the initial position and zoom of the viewport. If a default viewport is provided but
+	 * `fitView` is enabled, the default viewport will be ignored.
+	 * @default { x: 0, y: 0, zoom: 1 }
 	 * @example
 	 * const initialViewport = {
 	 *  zoom: 0.5,
@@ -1628,13 +1967,14 @@ interface ReactFlowProps<NodeType extends Node$1 = Node$1, EdgeType extends Edge
 	 */
 	defaultViewport?: Viewport;
 	/**
-	 * Gets called when the viewport changes.
+	 * Used when working with a controlled viewport for updating the user viewport state.
 	 */
 	onViewportChange?: (viewport: Viewport) => void;
 	/**
-	 * By default the viewport extends infinitely. You can use this prop to set a boundary.
+	 * By default, the viewport extends infinitely. You can use this prop to set a boundary.
 	 *
 	 * The first pair of coordinates is the top left boundary and the second pair is the bottom right.
+	 * @default [[-∞, -∞], [+∞, +∞]]
 	 * @example [[-1000, -10000], [1000, 1000]]
 	 */
 	translateExtent?: CoordinateExtent;
@@ -1644,51 +1984,86 @@ interface ReactFlowProps<NodeType extends Node$1 = Node$1, EdgeType extends Edge
 	 */
 	preventScrolling?: boolean;
 	/**
-	 * By default nodes can be placed on an infinite flow. You can use this prop to set a boundary.
+	 * By default, nodes can be placed on an infinite flow. You can use this prop to set a boundary.
 	 *
 	 * The first pair of coordinates is the top left boundary and the second pair is the bottom right.
 	 * @example [[-1000, -10000], [1000, 1000]]
 	 */
 	nodeExtent?: CoordinateExtent;
 	/**
-	 * Color of edge markers
-	 * @example "#b1b1b7"
+	 * Color of edge markers.
+	 * @default '#b1b1b7'
 	 */
 	defaultMarkerColor?: string;
-	/** Controls if the viewport should zoom by scrolling inside the container */
+	/**
+	 * Controls if the viewport should zoom by scrolling inside the container.
+	 * @default true
+	 */
 	zoomOnScroll?: boolean;
-	/** Controls if the viewport should zoom by pinching on a touch screen */
+	/**
+	 * Controls if the viewport should zoom by pinching on a touch screen.
+	 * @default true
+	 */
 	zoomOnPinch?: boolean;
 	/**
-	 * Controls if the viewport should pan by scrolling inside the container
+	 * Controls if the viewport should pan by scrolling inside the container.
 	 *
-	 * Can be limited to a specific direction with panOnScrollMode
+	 * Can be limited to a specific direction with `panOnScrollMode`.
+	 * @default false
 	 */
 	panOnScroll?: boolean;
 	/**
 	 * Controls how fast viewport should be panned on scroll.
 	 *
-	 * Use togther with panOnScroll prop.
+	 * Use together with `panOnScroll` prop.
+	 * @default 0.5
 	 */
 	panOnScrollSpeed?: number;
 	/**
-	 * This prop is used to limit the direction of panning when panOnScroll is enabled.
+	 * This prop is used to limit the direction of panning when `panOnScroll` is enabled.
 	 *
-	 * The "free" option allows panning in any direction.
+	 * The `"free"` option allows panning in any direction.
 	 * @default "free"
 	 * @example "horizontal" | "vertical"
 	 */
 	panOnScrollMode?: PanOnScrollMode;
-	/** Controls if the viewport should zoom by double clicking somewhere on the flow */
+	/**
+	 * Controls if the viewport should zoom by double-clicking somewhere on the flow.
+	 * @default true
+	 */
 	zoomOnDoubleClick?: boolean;
+	/**
+	 * The radius around an edge connection that can trigger an edge reconnection.
+	 * @default 10
+	 */
 	reconnectRadius?: number;
+	/**
+	 * If a node is draggable, clicking and dragging that node will move it around the canvas. Adding
+	 * the `"nodrag"` class prevents this behavior and this prop allows you to change the name of that
+	 * class.
+	 * @default "nodrag"
+	 */
 	noDragClassName?: string;
+	/**
+	 * Typically, scrolling the mouse wheel when the mouse is over the canvas will zoom the viewport.
+	 * Adding the `"nowheel"` class to an element n the canvas will prevent this behavior and this prop
+	 * allows you to change the name of that class.
+	 * @default "nowheel"
+	 */
 	noWheelClassName?: string;
+	/**
+	 * If an element in the canvas does not stop mouse events from propagating, clicking and dragging
+	 * that element will pan the viewport. Adding the `"nopan"` class prevents this behavior and this
+	 * prop allows you to change the name of that class.
+	 * @default "nopan"
+	 */
 	noPanClassName?: string;
-	/** If set, initial viewport will show all nodes & edges */
+	/** When `true`, the flow will be zoomed and panned to fit all the nodes initially provided. */
 	fitView?: boolean;
 	/**
-	 * Options to be used in combination with fitView
+	 * When you typically call `fitView` on a `ReactFlowInstance`, you can provide an object of
+	 * options to customize its behavior. This prop lets you do the same for the initial `fitView`
+	 * call.
 	 * @example
 	 * const fitViewOptions = {
 	 *  padding: 0.1,
@@ -1701,15 +2076,18 @@ interface ReactFlowProps<NodeType extends Node$1 = Node$1, EdgeType extends Edge
 	 */
 	fitViewOptions?: FitViewOptions;
 	/**
-	 *The connectOnClick option lets you click or tap on a source handle to start a connection
+	 * The `connectOnClick` option lets you click or tap on a source handle to start a connection
 	 * and then click on a target handle to complete the connection.
 	 *
-	 * If you set this option to false, users will need to drag the connection line to the target
+	 * If you set this option to `false`, users will need to drag the connection line to the target
 	 * handle to create a connection.
+	 * @default true
 	 */
 	connectOnClick?: boolean;
 	/**
-	 * Set position of the attribution
+	 * By default, React Flow will render a small attribution in the bottom right corner of the flow.
+	 *
+	 * You can use this prop to change its position in case you want to place something else there.
 	 * @default 'bottom-right'
 	 * @example 'top-left' | 'top-center' | 'top-right' | 'bottom-left' | 'bottom-center' | 'bottom-right'
 	 */
@@ -1729,21 +2107,23 @@ interface ReactFlowProps<NodeType extends Node$1 = Node$1, EdgeType extends Edge
 	elevateNodesOnSelect?: boolean;
 	/**
 	 * Enabling this option will raise the z-index of edges when they are selected.
-	 * @default true
 	 */
 	elevateEdgesOnSelect?: boolean;
 	/**
-	 * Can be set true if built-in keyboard controls should be disabled.
+	 * You can use this prop to disable keyboard accessibility features such as selecting nodes or
+	 * moving selected nodes with the arrow keys.
 	 * @default false
 	 */
 	disableKeyboardA11y?: boolean;
 	/**
-	 * You can enable this prop to automatically pan the viewport while dragging a node.
+	 * When `true`, the viewport will pan automatically when the cursor moves to the edge of the
+	 * viewport while dragging a node.
 	 * @default true
 	 */
 	autoPanOnNodeDrag?: boolean;
 	/**
-	 * You can enable this prop to automatically pan the viewport while dragging a node.
+	 * When `true`, the viewport will pan automatically when the cursor moves to the edge of the
+	 * viewport while creating a connection.
 	 * @default true
 	 */
 	autoPanOnConnect?: boolean;
@@ -1753,12 +2133,12 @@ interface ReactFlowProps<NodeType extends Node$1 = Node$1, EdgeType extends Edge
 	 */
 	autoPanSpeed?: number;
 	/**
-	 * You can enable this prop to automatically pan the viewport while making a new connection.
-	 * @default true
+	 * The radius around a handle where you drop a connection line to create a new edge.
+	 * @default 20
 	 */
 	connectionRadius?: number;
 	/**
-	 * Ocassionally something may happen that causes Svelte Flow to throw an error.
+	 * Occasionally something may happen that causes React Flow to throw an error.
 	 *
 	 * Instead of exploding your application, we log a message to the console and then call this event handler.
 	 * You might use it for additional logging or to show a message to the user.
@@ -1767,32 +2147,33 @@ interface ReactFlowProps<NodeType extends Node$1 = Node$1, EdgeType extends Edge
 	/**
 	 * This callback can be used to validate a new connection
 	 *
-	 * If you return false, the edge will not be added to your flow.
-	 * If you have custom connection logic its preferred to use this callback over the isValidConnection prop on the handle component for performance reasons.
-	 * @default (connection: Connection) => true
+	 * If you return `false`, the edge will not be added to your flow.
+	 * If you have custom connection logic its preferred to use this callback over the
+	 * `isValidConnection` prop on the handle component for performance reasons.
 	 */
 	isValidConnection?: IsValidConnection<EdgeType>;
 	/**
-	 * With a threshold greater than zero you can control the distinction between node drag and click events.
+	 * With a threshold greater than zero you can delay node drag events.
 	 *
 	 * If threshold equals 1, you need to drag the node 1 pixel before a drag event is fired.
+	 *
+	 * 1 is the default value, so clicks don't trigger drag events.
 	 * @default 1
 	 */
 	nodeDragThreshold?: number;
-	/** Sets a fixed width for the flow */
+	/** Sets a fixed width for the flow. */
 	width?: number;
-	/** Sets a fixed height for the flow */
+	/** Sets a fixed height for the flow. */
 	height?: number;
 	/**
-	 * Controls color scheme used for styling the flow
-	 * @default 'system'
+	 * Controls color scheme used for styling the flow.
+	 * @default 'light'
 	 * @example 'system' | 'light' | 'dark'
 	 */
 	colorMode?: ColorMode;
 	/**
-	 * If set true, some debug information will be logged to the console like which events are fired.
-	 *
-	 * @default undefined
+	 * If set `true`, some debug information will be logged to the console like which events are fired.
+	 * @default false
 	 */
 	debug?: boolean;
 }
@@ -1817,13 +2198,17 @@ type GeneralHelpers<NodeType extends Node$1 = Node$1, EdgeType extends Edge = Ed
 	 */
 	getNodes: () => NodeType[];
 	/**
-	 * Sets nodes.
+	 * Set your nodes array to something else by either overwriting it with a new array or by passing
+	 * in a function to update the existing array. If using a function, it is important to make sure a
+	 * new array is returned instead of mutating the existing array. Calling this function will
+	 * trigger the `onNodesChange` handler in a controlled flow.
 	 *
 	 * @param payload - the nodes to set or a function that receives the current nodes and returns the new nodes
 	 */
 	setNodes: (payload: NodeType[] | ((nodes: NodeType[]) => NodeType[])) => void;
 	/**
-	 * Adds nodes.
+	 * Add one or many nodes to your existing nodes array. Calling this function will trigger the
+	 * `onNodesChange` handler in a controlled flow.
 	 *
 	 * @param payload - the nodes to add
 	 */
@@ -1849,13 +2234,17 @@ type GeneralHelpers<NodeType extends Node$1 = Node$1, EdgeType extends Edge = Ed
 	 */
 	getEdges: () => EdgeType[];
 	/**
-	 * Sets edges.
+	 * Set your edges array to something else by either overwriting it with a new array or by passing
+	 * in a function to update the existing array. If using a function, it is important to make sure a
+	 * new array is returned instead of mutating the existing array. Calling this function will
+	 * trigger the `onEdgesChange` handler in a controlled flow.
 	 *
 	 * @param payload - the edges to set or a function that receives the current edges and returns the new edges
 	 */
 	setEdges: (payload: EdgeType[] | ((edges: EdgeType[]) => EdgeType[])) => void;
 	/**
-	 * Adds edges.
+	 * Add one or many edges to your existing edges array. Calling this function will trigger the
+	 * `onEdgesChange` handler in a controlled flow.
 	 *
 	 * @param payload - the edges to add
 	 */
@@ -1886,7 +2275,8 @@ type GeneralHelpers<NodeType extends Node$1 = Node$1, EdgeType extends Edge = Ed
 		deletedEdges: Edge[];
 	}>;
 	/**
-	 * Returns all nodes that intersect with the given node or rect.
+	 * Find all the nodes currently intersecting with a given node or rectangle. The `partially`
+	 * parameter can be set to `true` to include nodes that are only partially intersecting.
 	 *
 	 * @param node - the node or rect to check for intersections
 	 * @param partially - if true, the node is considered to be intersecting if it partially overlaps with the passed node or rect
@@ -1898,7 +2288,8 @@ type GeneralHelpers<NodeType extends Node$1 = Node$1, EdgeType extends Edge = Ed
 		id: Node$1["id"];
 	} | Rect, partially?: boolean, nodes?: NodeType[]) => NodeType[];
 	/**
-	 * Checks if the given node or rect intersects with the passed rect.
+	 * Determine if a given node or rectangle is intersecting with another rectangle. The `partially`
+	 * parameter can be set to true return `true` even if the node is only partially intersecting.
 	 *
 	 * @param node - the node or rect to check for intersections
 	 * @param area - the rect to check for intersections
@@ -1970,7 +2361,8 @@ type GeneralHelpers<NodeType extends Node$1 = Node$1, EdgeType extends Edge = Ed
 	 */
 	getNodesBounds: (nodes: (NodeType | InternalNode | string)[]) => Rect;
 	/**
-	 * Gets all connections for a given handle belonging to a specific node.
+	 * Get all the connections of a handle belonging to a specific node. The type parameter be either
+	 * `'source'` or `'target'`.
 	 * @deprecated
 	 * @param type - handle type 'source' or 'target'
 	 * @param id - the handle id (this is only needed if you have multiple handles of the same type, meaning you have to provide a unique id for each handle)
@@ -1996,7 +2388,11 @@ type GeneralHelpers<NodeType extends Node$1 = Node$1, EdgeType extends Edge = Ed
 	}) => NodeConnection[];
 	fitView: FitView<NodeType>;
 };
-type ReactFlowInstance<NodeType extends Node$1 = Node$1, EdgeType extends Edge = Edge> = GeneralHelpers<NodeType, EdgeType> & Omit<ViewportHelperFunctions, "initialized"> & {
+type ReactFlowInstance<NodeType extends Node$1 = Node$1, EdgeType extends Edge = Edge> = GeneralHelpers<NodeType, EdgeType> & ViewportHelperFunctions & {
+	/**
+	 * React Flow needs to mount the viewport to the DOM and initialize its zoom and pan behavior.
+	 * This property tells you when viewport is initialized.
+	 */
 	viewportInitialized: boolean;
 };
 type ControlsCustomLayoutProps = {