Astro components
Integration list
Displays a grid of integration cards.
A component that renders a grid of available integrations with ratings and install counts.
Usage
---
import IntegrationList from '@/components/IntegrationList.astro';
---
const integrations = [
{
title: 'Slack',
desc: 'Connect your Slack workspace.',
link: '/integrations/slack',
logo: '/assets/slack.svg',
stars: 5,
install: 1000,
reviews: 50
}
];
<IntegrationList contents={integrations} />Props
| Prop | Type | Default | Description |
|---|---|---|---|
contents | IntegrationsItem[] | - | Array of integration items. |
class | string | - | Additional CSS classes for the grid container. |
IntegrationsItem Interface
interface IntegrationsItem {
title: string;
desc: string;
link: string;
logo: string | Function; // Path string or imported component
stars: number;
install: number;
reviews: number;
author?: string;
}