A list of tools with search, category Tabs and Connect, Configure or a Connected Badge.
FreeWeb and MobileMotion
Preview
npx shadcn add @fetaui/integrationsPlayground
Integrations
Connect the tools your team already works in.
⌘ K
- ChatCommunicationPost release notes and approvals to the channels you pick.Connected
- DriveStorageAttach docs and keep shared folders in step with projects.Connected
- AnalyticsAnalyticsSend product events and funnels as they happen.
- MailCommunicationTurn customer emails into tracked requests.
- ArchiveStorageArchive nightly exports and audit logs to a bucket you own.
- WarehouseAnalyticsSync projects, tasks and time entries every night.
Connecting
Integrations
Connect the tools your team already works in.
⌘ K
- ChatCommunicationPost release notes and approvals to the channels you pick.Connected
- DriveStorageAttach docs and keep shared folders in step with projects.Connected
- AnalyticsAnalyticsSend product events and funnels as they happen.
- MailCommunicationTurn customer emails into tracked requests.
- ArchiveStorageArchive nightly exports and audit logs to a bucket you own.
- WarehouseAnalyticsSync projects, tasks and time entries every night.
Icons animation
Fail next action
Motion
Installation
Terminal· bash
npx shadcn add @fetaui/integrations
Accessibility
- Tabs and search use finished components.
- Connecting announces through the Button state.
- Logos are decorative. Names are text.
Motion
- Connect holds its width and shows Connecting with a spinner.
- The panel fades in and rises 8 px over 400 ms, once.
- Rows fade in over 240 ms with a 40 ms stagger.
- Numbers and bars tween over 240 ms by writing text and transforms, so React does not render per frame.
- With reduced motion, the panel appears in place and values swap at once.
Responsive behavior
- 760 wide on Web and 358 on Mobile, filling narrower parents.
- Collapses by its own width with a container query, so it adapts in a sidebar too.
- Touch targets stay at 44 on Mobile.
Performance
- Categories are memoized from items, and rows fade in with a CSS animation 40 ms apart.
- Search filters in render and only checks each item's name and category.
Note for AI
Give your coding assistant the Markdown reference instead of screenshots.
- Import Integrations from @/components/fetaui/integrations. It composes Search, Tabs and Button with Panel, Body and Tag from data-kit.
- onConnect can return a promise. The row stays loading until it resolves, then shows Connected. A rejection returns the row to Connect and shows failedMessage.
- items[].connected seeds local state once. Pass a fetaUI icon as icon, at size 18.
- connecting starts a row in progress, for previews. The demo's onConnect waits 1.2 s and connects nothing.
Related
WebhooksComponentEndpoints with health, a delivery histogram, recent deliveries with Retry, and an open delivery with its payload.API KeyComponentA key on a well with reveal and copy. Copied confirms for 2 s and Revoked removes the actions.SearchComponentA search field and a command palette for finding anything and running commands.TabsComponentSwitch between views of the same thing. Panels swipe with the finger and the indicator follows.