# code-snippets/3.10.1/js/components/ImportMenu/common/ImportCard.tsx

Code Snippets, version 3.10.1. 30 lines.

- Page: https://pluginprobe.com/plugins/code-snippets/3.10.1/code/js/components/ImportMenu/common/ImportCard.tsx
- Raw: https://pluginprobe.com/plugins/code-snippets/3.10.1/raw/js/components/ImportMenu/common/ImportCard.tsx
- Modified: 2026-06-19T15:56:12+00:00

Line numbers below start at 1. Link to a line or a range by appending a fragment to the
page URL, for example `https://pluginprobe.com/plugins/code-snippets/3.10.1/code/js/components/ImportMenu/common/ImportCard.tsx#L10-L20`.

```tsx
import React, { forwardRef } from 'react'
import classnames from 'classnames'
import type { HTMLAttributes, ReactNode } from 'react'

export interface ImportCardProps extends Omit<HTMLAttributes<HTMLDivElement>, 'className'> {
	children: ReactNode
	className?: string
	variant?: 'default' | 'controls'
}

export const ImportCard = forwardRef<HTMLDivElement, ImportCardProps>(({
	children,
	className,
	variant = 'default',
	...props
}, ref) =>
	<div
		ref={ref}
		className={classnames(
			'import-snippets-card',
			{ 'import-controls': 'controls' === variant },
			className
		)}
		{...props}
	>
		{children}
	</div>)

ImportCard.displayName = 'ImportCard'

```
