https://github.com/techwithty/ai-avatar-dropdown
AI Avatar voice and recipient dropdown components for React/Next.js. Accessible UX, keyboard-friendly, and themeable with design tokens.
https://github.com/techwithty/ai-avatar-dropdown
a11y accessibility ai design-system dropdown frontend nextjs react tailwind typescript ui-components voice
Last synced: 4 months ago
JSON representation
AI Avatar voice and recipient dropdown components for React/Next.js. Accessible UX, keyboard-friendly, and themeable with design tokens.
- Host: GitHub
- URL: https://github.com/techwithty/ai-avatar-dropdown
- Owner: TechWithTy
- Created: 2025-08-30T15:06:02.000Z (6 months ago)
- Default Branch: master
- Last Pushed: 2025-08-30T15:07:59.000Z (6 months ago)
- Last Synced: 2025-08-30T17:22:21.518Z (6 months ago)
- Topics: a11y, accessibility, ai, design-system, dropdown, frontend, nextjs, react, tailwind, typescript, ui-components, voice
- Language: TypeScript
- Homepage: https://www.cybershoptech.com
- Size: 3.91 KB
- Stars: 0
- Watchers: 0
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# AI Avatar Dropdown
Accessible AI Avatar voice and recipient dropdown components for React/Next.js.
- Themeable via Tailwind design tokens (see `_docs/features/ui/theming.md`)
- Keyboard and screen-reader friendly
- TypeScript-first
Website: https://www.cybershoptech.com
## Exports
```ts
import { AgentVoiceDropdown, AllRecipientDropdown } from "@/external/ai-avatar-dropdown";
```
## Usage
```tsx
import { AgentVoiceDropdown, AllRecipientDropdown } from "@/external/ai-avatar-dropdown";
export default function Example() {
return (
console.log(voiceId)} />
console.log(id)} />
);
}
```
## Development
- Follows Biome linting/formatting rules.
- Uses Radix UI primitives and Tailwind tokens (`bg-card`, `border-border`, etc.).
## License
MIT