Popularity
7.6
Growing
Activity
3.4
Growing
2,431
39
267
Programming language: TypeScript
License: MIT License
Tags:
UI Frameworks
Responsive
Latest version: v2.4.2
ChatUI alternatives and similar libraries
Based on the "Responsive" category.
Alternatively, view ChatUI alternatives based on common mentions on social networks and blogs.
-
office-ui-fabric-react
Fluent UI web represents a collection of utilities, React components, and web components for building web applications. -
grommet
a react-based framework that provides accessibility, modularity, responsiveness, and theming in a tidy package -
semi-design
🚀A modern, comprehensive, flexible design system and React UI library. 🎨 Provide more than 2800+ Design Tokens, easy to build your design system. Make Semi Design to Any Design. 🧑🏻💻 Design to Code in one click -
searchkit
Search UI for Elasticsearch & Opensearch. Compatible with Algolia's Instantsearch and Autocomplete components. React & Vue support -
CoreUI for React
CoreUI React.js UI Components. CoreUI for React.js replaces and extends the Bootstrap javascript. Components have been built from scratch as true React.js hook components, without jQuery and unneeded dependencies. -
AgnosticUI
AgnosticUI is a set of UI primitives that start their lives in clean HTML and CSS. These standards compliant components are then copied to our framework implementations in: React, Vue 3, Angular, and Svelte. -
cdbreact
Contrast Design Bootstrap : Elegant UI Kit and reusable components for building mobile-first, responsive websites and web apps -
insites-ui
DISCONTINUED. An opinionated UI components library for React. Based on Styled Components and Styled System.
SurveyJS - Open-Source JSON Form Builder to Create Dynamic Forms Right in Your App
With SurveyJS form UI libraries, you can build and style forms in a fully-integrated drag & drop form builder, render them in your JS app, and store form submission data in any backend, inc. PHP, ASP.NET Core, and Node.js.
Promo
surveyjs.io
Do you think we are missing an alternative of ChatUI or a related project?
README
The UI design language and React library for Conversational UI
Website:https://chatui.io
English | [简体中文](./README.zh-CN.md)
Features
- 😎 Best Practices: The best practice for chat interaction based on our experience of Alime Chatbot
- 🛡 TypeScript: Written in TypeScript with predictable static types
- 📱 Responsive: Responsive design to adapt automatically to whatever device
- ♿ Accessibility: Accessibility support and get the certification from Accessibility Research Association
- 🎨 Theming: Powerful theme customization in every detail
- 🌍 International: Internationalization support for dozens of languages
Environment Support
- Modern browsers (support CSS Variables)
- Internet Explorer 11 (with polyfills and CSS Variables Polyfill / css-vars-ponyfill)
Edge | Firefox | Chrome | Safari | iOS Safari | Android WebView |
---|---|---|---|---|---|
16+ | 31+ | 49+ | 9.1+ | 9.3+ | 6+ |
Install
npm install @chatui/core --save
yarn add @chatui/core
Usage
import Chat, { Bubble, useMessages } from '@chatui/core';
import '@chatui/core/dist/index.css';
const App = () => {
const { messages, appendMsg, setTyping } = useMessages([]);
function handleSend(type, val) {
if (type === 'text' && val.trim()) {
appendMsg({
type: 'text',
content: { text: val },
position: 'right',
});
setTyping(true);
setTimeout(() => {
appendMsg({
type: 'text',
content: { text: 'Bala bala' },
});
}, 1000);
}
}
function renderMessageContent(msg) {
const { content } = msg;
return <Bubble content={content.text} />;
}
return (
<Chat
navbar={{ title: 'Assistant' }}
messages={messages}
renderMessageContent={renderMessageContent}
onSend={handleSend}
/>
);
};
Development
cd storybook
npm i
npm run storybook
Theme
Visit Customize Theme for detail
Internationalization
Visit i18n for detail
Discussion
License
MIT
*Note that all licence references and agreements mentioned in the ChatUI README section above
are relevant to that project's source code only.