chore(types): cleanup comments

packages/react/src/additional-components/Background/types.ts

@@ -8,27 +8,27 @@ export enum BackgroundVariant {
 
 export type BackgroundProps = {
   id?: string;
-  /** color of the pattern */
+  /** Color of the pattern */
   color?: string;
-  /** color of the background */
+  /** Color of the background */
   bgColor?: string;
-  /** class applied to the container */
+  /** Class applied to the container */
   className?: string;
-  /** class applied to the pattern */
+  /** Class applied to the pattern */
   patternClassName?: string;
-  /** gap between repetitions of the pattern */
+  /** Gap between repetitions of the pattern */
   gap?: number | [number, number];
-  /** size of a single pattern element */
+  /** Size of a single pattern element */
   size?: number;
-  /** offset of the pattern */
+  /** Offset of the pattern */
   offset?: number;
-  /** line width of the Line pattern */
+  /** Line width of the Line pattern */
   lineWidth?: number;
-  /** variant of the pattern
+  /** Variant of the pattern
    * @example BackgroundVariant.Lines, BackgroundVariant.Dots, BackgroundVariant.Cross
    * 'lines', 'dots', 'cross'
    */
   variant?: BackgroundVariant;
-  /** style applied to the container */
+  /** Style applied to the container */
   style?: CSSProperties;
 };

packages/react/src/additional-components/Controls/types.ts

@@ -4,31 +4,31 @@ import type { PanelPosition } from '@xyflow/system';
 import type { FitViewOptions } from '../../types';
 
 export type ControlProps = {
-  /** show button for zoom in/out */
+  /** Show button for zoom in/out */
   showZoom?: boolean;
-  /** show button for fit view */
+  /** Show button for fit view */
   showFitView?: boolean;
-  /** show button for toggling interactivity */
+  /** Show button for toggling interactivity */
   showInteractive?: boolean;
-  /** options being used when fit view button is clicked */
+  /** Options being used when fit view button is clicked */
   fitViewOptions?: FitViewOptions;
-  /** callback when zoom in button is clicked */
+  /** Callback when zoom in button is clicked */
   onZoomIn?: () => void;
-  /** callback when zoom out button is clicked */
+  /** Callback when zoom out button is clicked */
   onZoomOut?: () => void;
-  /** callback when fit view button is clicked */
+  /** Callback when fit view button is clicked */
   onFitView?: () => void;
-  /** callback when interactivity is toggled */
+  /** Callback when interactivity is toggled */
   onInteractiveChange?: (interactiveStatus: boolean) => void;
-  /** position of the controls on the pane
+  /** Position of the controls on the pane
    * @example PanelPosition.TopLeft, PanelPosition.TopRight,
    * PanelPosition.BottomLeft, PanelPosition.BottomRight
    */
   position?: PanelPosition;
   children?: ReactNode;
-  /** style applied to container */
+  /** Style applied to container */
   style?: React.CSSProperties;
-  /**className applied to container */
+  /** ClassName applied to container */
   className?: string;
   'aria-label'?: string;
 };

packages/react/src/additional-components/MiniMap/types.ts

@@ -7,41 +7,44 @@ import type { Node } from '../../types';
 export type GetMiniMapNodeAttribute<NodeType extends Node = Node> = (node: NodeType) => string;
 
 export type MiniMapProps<NodeType extends Node = Node> = Omit<HTMLAttributes<SVGSVGElement>, 'onClick'> & {
-  /** color of nodes on minimap */
+  /** Color of nodes on minimap */
   nodeColor?: string | GetMiniMapNodeAttribute<NodeType>;
-  /** stroke color of nodes on minimap */
+  /** Stroke color of nodes on minimap */
   nodeStrokeColor?: string | GetMiniMapNodeAttribute<NodeType>;
-  /** className applied to nodes on minimap */
+  /** ClassName applied to nodes on minimap */
   nodeClassName?: string | GetMiniMapNodeAttribute<NodeType>;
-  /** boder radius of nodes on minimap */
+  /** Border radius of nodes on minimap */
   nodeBorderRadius?: number;
-  /** stroke width of nodes on minimap */
+  /** Stroke width of nodes on minimap */
   nodeStrokeWidth?: number;
-  /** component used to render nodes on minimap */
+  /** Component used to render nodes on minimap */
   nodeComponent?: ComponentType<MiniMapNodeProps>;
-  /** color of mask representing viewport */
+  /** Color of mask representing viewport */
   maskColor?: string;
-  /** stroke color of mask representing viewport */
+  /** Stroke color of mask representing viewport */
   maskStrokeColor?: string;
-  /** stroke width of mask representing viewport */
+  /** Stroke width of mask representing viewport */
   maskStrokeWidth?: number;
-  /** position of minimap on pane
+  /** Position of minimap on pane
    * @example PanelPosition.TopLeft, PanelPosition.TopRight,
    * PanelPosition.BottomLeft, PanelPosition.BottomRight
    */
   position?: PanelPosition;
-  /** callback caled when minimap is clicked*/
+  /** Callback caled when minimap is clicked*/
   onClick?: (event: MouseEvent, position: XYPosition) => void;
-  /** callback called when node on minimap is clicked */
+  /** Callback called when node on minimap is clicked */
   onNodeClick?: (event: MouseEvent, node: NodeType) => void;
+  /** If true, viewport is pannable via mini map component */
   pannable?: boolean;
+  /** If true, viewport is zoomable via mini map component */
   zoomable?: boolean;
+  /** The aria-label attribute */
   ariaLabel?: string | null;
-  /** invert direction when panning the minimap viewport */
+  /** Invert direction when panning the minimap viewport */
   inversePan?: boolean;
-  /** step size for zooming in/out on minimap */
+  /** Step size for zooming in/out on minimap */
   zoomStep?: number;
-  /** offset the viewport on the minmap, acts like a padding */
+  /** Offset the viewport on the minmap, acts like a padding */
   offsetScale?: number;
 };
 

packages/react/src/additional-components/NodeResizer/types.ts

@@ -10,39 +10,39 @@ import type {
 } from '@xyflow/system';
 
 export type NodeResizerProps = {
-  /** id of the node it is resizing
+  /** Id of the node it is resizing
    * @remarks optional if used inside custom node
    */
   nodeId?: string;
-  /** color of the resize handle */
+  /** Color of the resize handle */
   color?: string;
-  /** className applied to handle */
+  /** ClassName applied to handle */
   handleClassName?: string;
-  /** style applied to handle */
+  /** Style applied to handle */
   handleStyle?: CSSProperties;
-  /** className applied to line */
+  /** ClassName applied to line */
   lineClassName?: string;
-  /** style applied to line */
+  /** Style applied to line */
   lineStyle?: CSSProperties;
-  /** are the controls visible */
+  /** Are the controls visible */
   isVisible?: boolean;
-  /** minimum width of node */
+  /** Minimum width of node */
   minWidth?: number;
-  /** minimum height of node */
+  /** Minimum height of node */
   minHeight?: number;
-  /** maximum width of node */
+  /** Maximum width of node */
   maxWidth?: number;
-  /** maximum height of node */
+  /** Maximum height of node */
   maxHeight?: number;
-  /** keep aspect ratio when resizing */
+  /** Keep aspect ratio when resizing */
   keepAspectRatio?: boolean;
-  /** callback to determine if node should resize */
+  /** Callback to determine if node should resize */
   shouldResize?: ShouldResize;
-  /** callback called when resizing starts */
+  /** Callback called when resizing starts */
   onResizeStart?: OnResizeStart;
-  /** callback called when resizing */
+  /** Callback called when resizing */
   onResize?: OnResize;
-  /** callback called when resizing ends */
+  /** Callback called when resizing ends */
   onResizeEnd?: OnResizeEnd;
 };
 
@@ -60,12 +60,12 @@ export type ResizeControlProps = Pick<
   | 'onResize'
   | 'onResizeEnd'
 > & {
-  /** position of the control
+  /** Position of the control
    * @example ControlPosition.TopLeft, ControlPosition.TopRight,
    * ControlPosition.BottomLeft, ControlPosition.BottomRight
    */
   position?: ControlPosition;
-  /** variant of the control
+  /** Variant of the control
    * @example ResizeControlVariant.Handle, ResizeControlVariant.Line
    */
   variant?: ResizeControlVariant;

packages/react/src/additional-components/NodeToolbar/types.ts

@@ -2,17 +2,18 @@ import type { HTMLAttributes } from 'react';
 import type { Position, Align } from '@xyflow/system';
 
 export type NodeToolbarProps = HTMLAttributes<HTMLDivElement> & {
-  /** id of the node, or array of ids the toolbar should be displayed at */
+  /** Id of the node, or array of ids the toolbar should be displayed at */
   nodeId?: string | string[];
+  /** If true, node toolbar is visible even if node is not selected */
   isVisible?: boolean;
-  /** position of the toolbar relative to the node
+  /** Position of the toolbar relative to the node
    * @example Position.TopLeft, Position.TopRight,
    * Position.BottomLeft, Position.BottomRight
    */
   position?: Position;
-  /** offset the toolbar from the node */
+  /** Offset the toolbar from the node */
   offset?: number;
-  /** align the toolbar relative to the node
+  /** Align the toolbar relative to the node
    * @example Align.Start, Align.Center, Align.End
    */
   align?: Align;