Display dependency information and version changes.

The PackageInfo component displays package dependency information including version changes and change type badges.

See scripts/package-info.tsx for this example.

npx ai-elements@latest add package-info

• Version change display (current → new)
• Color-coded change type badges
• Dependencies list
• Description support

Type	Color	Use Case
major	Red	Breaking changes
minor	Yellow	New features
patch	Green	Bug fixes
added	Blue	New dependency
removed	Gray	Removed dependency

Prop	Type	Default	Description
name	string	Required	Package name.
currentVersion	string	-	Current installed version.
newVersion	string	-	New version being installed.
changeType	unknown	-	Type of version change.
...props	React.HTMLAttributes<HTMLDivElement>	-	Spread to the container div.

Prop	Type	Default	Description
...props	React.HTMLAttributes<HTMLDivElement>	-	Spread to the header div.

Prop	Type	Default	Description
children	React.ReactNode	-	Custom name content. Defaults to the name from context.
...props	React.HTMLAttributes<HTMLDivElement>	-	Spread to the container div.

Prop	Type	Default	Description
children	React.ReactNode	-	Custom change type label. Defaults to the changeType from context.
...props	React.HTMLAttributes<HTMLDivElement>	-	Spread to the Badge component.

Prop	Type	Default	Description
children	React.ReactNode	-	Custom version content. Defaults to version transition display.
...props	React.HTMLAttributes<HTMLDivElement>	-	Spread to the container div.

Prop	Type	Default	Description
...props	React.HTMLAttributes<HTMLParagraphElement>	-	Spread to the p element.

Prop	Type	Default	Description
...props	React.HTMLAttributes<HTMLDivElement>	-	Spread to the container div.

Prop	Type	Default	Description
...props	React.HTMLAttributes<HTMLDivElement>	-	Spread to the container div.

Prop	Type	Default	Description
name	string	Required	Dependency name.
version	string	-	Dependency version.
...props	React.HTMLAttributes<HTMLDivElement>	-	Spread to the row div.