GitHub — ant-design/x: готовый партнер для создания приложений Copilot ?

• ? На основе лучших практик ИИ-продуктов корпоративного уровня.: создан на основе парадигмы взаимодействия RICH, обеспечивающей исключительные возможности взаимодействия с искусственным интеллектом.
• ? Гибкие и разнообразные атомные компоненты: охватывает большинство сценариев диалога с ИИ, позволяя быстро создавать собственные интерфейсы взаимодействия с ИИ.
• ⚡ Интеграция готовых шаблонов: Легкое подключение к сервисам вывода, совместимым со стандартами OpenAI.
• ? Эффективное управление потоками данных разговоров: Предоставляет мощные инструменты для управления потоками данных, повышая эффективность разработки.
• ? Поддержка расширенных моделей: предлагает несколько шаблонов для быстрого начала разработки приложений LUI.
• ? Полная поддержка TypeScript: разработан с использованием TypeScript, обеспечивающего надежное покрытие типов для улучшения опыта и надежности разработки.
• ? Расширенная настройка темы: поддерживает точную настройку стиля для различных случаев использования и потребностей в настройке.

npm install @ant-design/x --save

Добавлять script И link теги в вашем браузере и используйте глобальную переменную antd.

Мы предоставляем antdx.js, antdx.min.jsИ antdx.min.js.map в dist каталог пакетов npm.

Основываясь на парадигме взаимодействия RICH, мы предоставляем множество атомарных компонентов для разных этапов взаимодействия, которые помогут вам гибко создавать диалоговые приложения ИИ:

• Общий: Bubble — Пузырь сообщений, Conversations — Управление разговорами
• Проснуться: Welcome — Приветственные сообщения, Prompts — Наборы подсказок
• Выражение: Sender — Входная зона, Attachment — Вложения, Suggestion — Быстрые заказы
• Подтверждение: ThoughtChain — Цепочки мыслей

Ниже приведен пример использования атомарных компонентов для создания простого интерфейса чат-бота:

import React from 'react';
import {
  // Message bubble
  Bubble,
  // Input box
  Sender,
} from '@ant-design/x';

const messages = [
  {
    content: 'Hello, Ant Design X!',
    role: 'user',
  },
];

const App = () => (
  div>
    Bubble.List items={messages} />
    Sender />
  /div>
);

export default App;

С useXAgent инструмент времени выполнения, мы упрощаем подключение к сервисам вывода моделей, которые соответствуют стандартам OpenAI.

Вот пример использования useXAgent:

import React from 'react';
import { useXAgent, Sender } from '@ant-design/x';

const App = () => {
  const [agent] = useXAgent({
    // Model inference service URL
    baseURL: 'https://your.api.host',
    // Model name
    model: 'gpt-3.5',
  });

  function chatRequest(text: string) {
    agent.request({
      // Message
      messages: [
        {
          content: text,
          role: 'user',
        },
      ],
      // Enable streaming
      stream: true,
    });
  }

  return Sender onSubmit={chatRequest} />;
};

export default App;

Используя useXChat инструмент времени выполнения, вы можете легко управлять потоками данных в диалоговых приложениях AI:

import React from 'react';
import { useXChat, useXAgent } from '@ant-design/x';

const App = () => {
  const [agent] = useXAgent({
    // Model inference service URL
    baseURL: 'https://your.api.host',
    // Model name
    model: 'gpt-3.5',
  });

  const {
    // Initiate a chat request
    onRequest,
    // Message list
    messages,
  } = useXChat({ agent });

  return (
    div>
      Bubble.List items={messages} />
      Sender onSubmit={onRequest} />
    /div>
  );
};

export default App;

@ant-design/x поддерживает дерево модулей ES по умолчанию.

@ant-design/x предоставляет встроенное определение ts.

Добро пожаловать, чтобы внести свой вклад!

Ant Design X широко используется в пользовательских интерфейсах на основе искусственного интеллекта в Ant Group. Если ваш бизнес и продукты используют Ant Design X, оставьте комментарий здесь.

Пожалуйста, сначала прочтите наш CONTRIBUTING.md.

Если вы хотите помочь нам улучшить antd, просто создайте запрос на включение. Не стесняйтесь сообщать об ошибках и проблемах здесь.

Если вы новичок в издательских вопросах, мы просим вас прочитать Как грамотно задавать вопросы и как задать вопрос в сообществе открытого исходного кода и Как эффективно сообщать об ошибках перед публикацией. Хорошо написанные отчеты об ошибках помогут нам помочь вам!

Если у вас возникнут какие-либо проблемы при использовании Ant Design X, вы можете запросить поддержку по следующим каналам. Мы также призываем опытных пользователей помогать новичкам через эти платформы.

Задавая вопросы в обсуждениях GitHub, рекомендуется использовать Q&A этикетка.

1. Обсуждения на GitHub
2. Проблемы с GitHub