Luna UI Design

Luna UI是一个优雅、简洁的React组件库，专注于现代化的用户界面设计和良好的开发体验。

特性

• 🌈 优雅的设计风格
• 📦 开箱即用的高质量React组件
• 🛡 使用TypeScript开发，提供完整的类型定义
• 🎨 可定制的主题
• 🌍 国际化支持
• 🧪 严格的测试保证组件质量

安装

npm install luna-ui-design
# 或
yarn add luna-ui-design

使用

import React from 'react';
import { Button, Input } from 'luna-ui-design';

const App = () => (
  <>
    <Button type="primary">点击我</Button>
    <Input placeholder="请输入..." />
  </>
);

export default App;

AI对话组件

Luna UI提供了两个AI对话组件：

• AIChat：传统AI对话组件
• LunaChat：新一代AI对话界面，支持更多自定义选项

基本使用

import React from 'react';
import { LunaChat } from 'luna-ui-design';

const App = () => (
  <LunaChat 
    apiKey="your-api-key"
    provider="openai"
    endpoint="https://api.openai.com/v1/chat/completions"
    defaultModel="gpt-3.5-turbo"
    height="600px"
  />
);

export default App;

自定义主题

import React from 'react';
import { LunaChat } from 'luna-ui-design';

const customTheme = {
  token: {
    colorPrimary: '#9254de',
    borderRadius: 8,
    fontSize: 14
  }
};

const App = () => (
  <LunaChat 
    apiKey="your-api-key"
    customTheme={customTheme}
  />
);

export default App;

组件列表

• 基础组件
  • Button 按钮
  • Icon 图标
  • Input 输入框
• 数据展示
  • Table 表格
• 表单
  • Checkbox 复选框
  • Select 选择器
• AI组件
  • AIChat AI对话组件
  • LunaChat 新一代AI对话组件

许可证

Luna UI Design使用MIT许可证。