<!-- source-hash: 9f5009b34317d5970b3bb61aa96ef597 -->
SVG icon component representing a vendor directory with a magnifying glass overlay, used for navigation or labeling in the OpenFrame UI.

> **⚠️ Deprecated:** Use icons from `icons-v2-generated` instead.

## Key Components

### `VendorDirectoryIcon`

A React functional component rendering an inline SVG icon composed of two paths:
- A 3D box/package shape representing a vendor directory
- A search/magnifying glass overlay indicating lookup functionality

**Props (`VendorDirectoryIconProps`):**

| Prop | Type | Default | Description |
|------|------|---------|-------------|
| `color` | `string` | `'white'` | SVG fill color |
| `className` | `string` | `''` | Additional CSS classes |
| `width` | `number` | `20` | Icon width in pixels |
| `height` | `number` | `20` | Icon height in pixels |

## Usage Example

```typescript
import { VendorDirectoryIcon } from './vendor-directory-icon';

// Default white icon
<VendorDirectoryIcon />

// Custom color and size
<VendorDirectoryIcon
  color="#6366f1"
  width={24}
  height={24}
  className="mr-2"
/>
```

## Notes

- Renders a `20×20` viewBox SVG regardless of `width`/`height` — dimensions scale the output without distorting paths.
- The `fill` on both SVG paths is driven by the `color` prop, making it straightforward to theme via a single value.
- Source: [`src/.../vendor-directory-icon.tsx`](https://github.com/flamingo-stack/openframe-oss-lib/blob/main/src/vendor-directory-icon.tsx)