Important: This documentation covers Yarn 1 (Classic).
For Yarn 2+ docs and migration guide, see yarnpkg.com.

Package detail

@lobehub/ui

lobehub151.8kMIT1.164.3TypeScript support: included

Lobe UI is an open-source UI component library for building AIGC web apps

lobehub, components, chatbot components, react components, react ui

readme

Lobe UI

Lobe UI is an open-source UI component library for building AIGC web apps

Documents · Changelog · Report Bug · Request Feature


<summary><kbd>Table of contents</kbd></summary>

TOC

#

📦 Installation

[!IMPORTANT]\ This package is ESM only.

To install Lobe UI, run the following command:

$ bun add @lobehub/ui

Compile with NextJS

[!NOTE]\ By work correct with nextjs page router SSR, add transpilePackages: ['@lobehub/ui'] to next.config.js. For example:

// next.config.js
const nextConfig = {
  // ...other config

  transpilePackages: ['@lobehub/ui'],
};

🤯 Usage

[!NOTE]\ The LobeUI components are developed based on Antd, fully compatible with Antd components, and it is recommended to use antd-style as the default css-in-js styling solution.

import { ThemeProvider, Button } from '@lobehub/ui'
import { Button } from 'antd'

export default () => (
  <ThemeProvider>
    <Button>Hello AIGC</Button>
  </ThemeProvider>
)

⌨️ Local Development

You can use Github Codespaces for online development:

Or clone it for local development:

$ git clone https://github.com/lobehub/lobe-ui.git
$ cd lobe-ui
$ bun install
$ bun start

🤝 Contributing

Contributions of all types are more than welcome, if you are interested in contributing code, feel free to check out our GitHub Issues to get stuck in to show us what you’re made of.

🩷 Sponsor

Every bit counts and your one-time donation sparkles in our galaxy of support! You're a shooting star, making a swift and bright impact on our journey. Thank you for believing in us – your generosity guides us toward our mission, one brilliant flash at a time.

<picture> <source media="(prefers-color-scheme: dark)" srcset="https://github.com/lobehub/.github/blob/main/static/sponsor-dark.png?raw=true"> </picture>

More Products

  • 🤯 Lobe Chat - An open-source, extensible (Function Calling), high-performance chatbot framework. It supports one-click free deployment of your private ChatGPT/LLM web application.
  • 🅰️ Lobe Theme - The modern theme for stable diffusion webui, exquisite interface design, highly customizable UI, and efficiency boosting features.
  • 🧸 Lobe Vidol - Experience the magic of virtual idol creation with Lobe Vidol, enjoy the elegance of our Exquisite UI Design, dance along using MMD Dance Support, and engage in Smooth Conversations.

Design Resources

  • 🍭 Lobe UI - An open-source UI component library for building AIGC web apps.
  • 🥨 Lobe Icons - Popular AI / LLM Model Brand SVG Logo and Icon Collection.
  • 📊 Lobe Charts - React modern charts components built on recharts

Development Resources

  • 🎤 Lobe TTS - A high-quality & reliable TTS/STT library for Server and Browser
  • 🌏 Lobe i18n - Automation ai tool for the i18n (internationalization) translation process.

More Resources


<summary>

📝 License

</summary>

Copyright © 2023 LobeHub.
This project is MIT licensed.

changelog

Changelog

Version 1.164.3

Released on 2025-01-14

🐛 Bug Fixes

  • misc: Mark SyntaxHighlighter client component.

<summary><kbd>Improvements and Fixes</kbd></summary>

What's fixed

  • misc: Mark SyntaxHighlighter client component, closes #248 (a1dc587)

Version 1.164.2

Released on 2025-01-10

🐛 Bug Fixes

  • misc: Fix file type icon.

<summary><kbd>Improvements and Fixes</kbd></summary>

What's fixed

Version 1.164.1

Released on 2025-01-10

💄 Styles

  • misc: Improve brand text loading.

<summary><kbd>Improvements and Fixes</kbd></summary>

Styles

  • misc: Improve brand text loading, closes #239 (f0ed033)

Version 1.164.0

Released on 2025-01-09

✨ Features

  • misc: Add Auth Icons.

<summary><kbd>Improvements and Fixes</kbd></summary>

What's improved

Version 1.163.2

Released on 2025-01-08

🐛 Bug Fixes

  • misc: Fix type ColorScaleItem export.

<summary><kbd>Improvements and Fixes</kbd></summary>

What's fixed

  • misc: Fix type ColorScaleItem export (98e6915)

Version 1.163.1

Released on 2025-01-08

🐛 Bug Fixes

  • misc: Fix @splinetool/runtime.

<summary><kbd>Improvements and Fixes</kbd></summary>

What's fixed

  • misc: Fix @splinetool/runtime (a6ecb39)

Version 1.163.0

Released on 2025-01-08

✨ Features

  • misc: Update remark.

<summary><kbd>Improvements and Fixes</kbd></summary>

What's improved

Version 1.162.0

Released on 2025-01-07

✨ Features

  • misc: Publish @lobehub/ui/color.

<summary><kbd>Improvements and Fixes</kbd></summary>

What's improved

  • misc: Publish @lobehub/ui/color (48fb8dc)

Version 1.161.0

Released on 2025-01-07

✨ Features

  • misc: Update antd.

<summary><kbd>Improvements and Fixes</kbd></summary>

What's improved

Version 1.160.0

Released on 2025-01-06

✨ Features

  • misc: Fix tsconfig.

<summary><kbd>Improvements and Fixes</kbd></summary>

What's improved

Version 1.159.0

Released on 2025-01-06

✨ Features

  • misc: Add clean-package.

<summary><kbd>Improvements and Fixes</kbd></summary>

What's improved

  • misc: Add clean-package (b710351)

Version 1.158.1

Released on 2025-01-06

💄 Styles

  • misc: Add clean-publish.

<summary><kbd>Improvements and Fixes</kbd></summary>

Styles

  • misc: Add clean-publish (fc3d7a6)

Version 1.158.0

Released on 2025-01-06

✨ Features

  • misc: Support React 19.

🐛 Bug Fixes

  • misc: Fix deps.

<summary><kbd>Improvements and Fixes</kbd></summary>

What's improved

What's fixed

Version 1.157.1

Released on 2025-01-05

💄 Styles

  • misc: Update Mdx style.

<summary><kbd>Improvements and Fixes</kbd></summary>

Styles

Version 1.157.0

Released on 2025-01-05

✨ Features

  • misc: Add Mdx.

<summary><kbd>Improvements and Fixes</kbd></summary>

What's improved

Version 1.156.4

Released on 2025-01-05

💄 Styles

  • misc: Fix CodeEditor.

<summary><kbd>Improvements and Fixes</kbd></summary>

Styles

Version 1.156.3

Released on 2025-01-03

💄 Styles

  • misc: Fix BrandLoading size.

<summary><kbd>Improvements and Fixes</kbd></summary>

Styles

  • misc: Fix BrandLoading size (ccb9c4f)

Version 1.156.2

Released on 2025-01-03

💄 Styles

  • misc: Fix form group style.

<summary><kbd>Improvements and Fixes</kbd></summary>

Styles

  • misc: Fix form group style (69ec600)

Version 1.156.1

Released on 2025-01-03

🐛 Bug Fixes

  • misc: Fix sideEffects.

<summary><kbd>Improvements and Fixes</kbd></summary>

What's fixed

Version 1.156.0

Released on 2025-01-03

✨ Features

  • misc: Add BrandLoading.

<summary><kbd>Improvements and Fixes</kbd></summary>

What's improved

Version 1.155.8

Released on 2025-01-01

💄 Styles

  • misc: Fix FormModal Footer.

<summary><kbd>Improvements and Fixes</kbd></summary>

Styles

  • misc: Fix FormModal Footer (e513e31)

Version 1.155.7

Released on 2024-12-31

💄 Styles

  • misc: Update Form.

<summary><kbd>Improvements and Fixes</kbd></summary>

Styles

Version 1.155.6

Released on 2024-12-27

💄 Styles

  • misc: Add FormModal Demo.

<summary><kbd>Improvements and Fixes</kbd></summary>

Styles

  • misc: Add FormModal Demo (fda8f94)

Version 1.155.5

Released on 2024-12-27

💄 Styles

  • misc: Update Form Props.

<summary><kbd>Improvements and Fixes</kbd></summary>

Styles

  • misc: Update Form Props (47fe030)

Version 1.155.4

Released on 2024-12-27

💄 Styles

  • misc: Update Form footer style.

<summary><kbd>Improvements and Fixes</kbd></summary>

Styles

  • misc: Update Form footer style (9f58c9a)

Version 1.155.3

Released on 2024-12-27

💄 Styles

  • misc: Support Multi Form.

<summary><kbd>Improvements and Fixes</kbd></summary>

Styles

  • misc: Support Multi Form (c941be4)

Version 1.155.2

Released on 2024-12-27

🐛 Bug Fixes

  • misc: Fix FormModal.

<summary><kbd>Improvements and Fixes</kbd></summary>

What's fixed

Version 1.155.1

Released on 2024-12-27

🐛 Bug Fixes

  • misc: Fix FormModal.

<summary><kbd>Improvements and Fixes</kbd></summary>

What's fixed

Version 1.155.0

Released on 2024-12-27

✨ Features

  • misc: Add FormModal.

<summary><kbd>Improvements and Fixes</kbd></summary>

What's improved

Version 1.154.1

Released on 2024-12-23

💄 Styles

  • misc: Update Modal props.

<summary><kbd>Improvements and Fixes</kbd></summary>

Styles

  • misc: Update Modal props (383d343)

Version 1.154.0

Released on 2024-12-20

✨ Features

  • misc: Parkles: highlighter supports setting default folding of code blocks.

<summary><kbd>Improvements and Fixes</kbd></summary>

What's improved

  • misc: Parkles: highlighter supports setting default folding of code blocks, closes #236 (e18d1f8)

Version 1.153.18

Released on 2024-12-17

💄 Styles

  • misc: Update CopyButton.

<summary><kbd>Improvements and Fixes</kbd></summary>

Styles

  • misc: Update CopyButton (e492790)

Version 1.153.17

Released on 2024-12-15

♻ Code Refactoring

  • misc: Rm StyleProvider.

<summary><kbd>Improvements and Fixes</kbd></summary>

Code refactoring

Version 1.153.16

Released on 2024-12-13

💄 Styles

  • misc: Add error output when shiki failed to highlight.

<summary><kbd>Improvements and Fixes</kbd></summary>

Styles

  • misc: Add error output when shiki failed to highlight, closes #234 (ef6729e)

Version 1.153.15

Released on 2024-12-13

🐛 Bug Fixes

  • misc: Fix useHighlight.

<summary><kbd>Improvements and Fixes</kbd></summary>

What's fixed

Version 1.153.14

Released on 2024-12-12

🐛 Bug Fixes

  • misc: Fix shiki.

<summary><kbd>Improvements and Fixes</kbd></summary>

What's fixed

Version 1.153.13

Released on 2024-12-10

🐛 Bug Fixes

  • misc: Fix files in package.json.

<summary><kbd>Improvements and Fixes</kbd></summary>

What's fixed

  • misc: Fix files in package.json (b187ad1)

Version 1.153.12

Released on 2024-12-10

♻ Code Refactoring

  • misc: Split package.

<summary><kbd>Improvements and Fixes</kbd></summary>

Code refactoring

Version 1.153.11

Released on 2024-12-07

💄 Styles

  • misc: Opt peerDependencies.

<summary><kbd>Improvements and Fixes</kbd></summary>

Styles

  • misc: Opt peerDependencies (d7cc3e6)

Version 1.153.10

Released on 2024-12-06

🐛 Bug Fixes

  • misc: Fix shiki, Fix shiki.

💄 Styles

  • misc: Update useHighlight.

<summary><kbd>Improvements and Fixes</kbd></summary>

What's fixed

Styles

  • misc: Update useHighlight (8bf4b29)

Version 1.153.9

Released on 2024-11-29

💄 Styles

  • misc: Update deps.

<summary><kbd>Improvements and Fixes</kbd></summary>

Styles

Version 1.153.8

Released on 2024-11-26

💄 Styles

  • misc: Update Modal props.

<summary><kbd>Improvements and Fixes</kbd></summary>

Styles

  • misc: Update Modal props (2c8dfd2)

Version 1.153.7

Released on 2024-11-26

💄 Styles

  • misc: Update Modal props.

<summary><kbd>Improvements and Fixes</kbd></summary>

Styles

  • misc: Update Modal props (8f88fed)

Version 1.153.6

Released on 2024-11-26

💄 Styles

  • misc: Update list item style.

<summary><kbd>Improvements and Fixes</kbd></summary>

Styles

  • misc: Update list item style (613c42a)

Version 1.153.5

Released on 2024-11-25

🐛 Bug Fixes

  • misc: Fix build.

<summary><kbd>Improvements and Fixes</kbd></summary>

What's fixed

Version 1.153.4

Released on 2024-11-25

🐛 Bug Fixes

  • misc: Fix ssrInline.

<summary><kbd>Improvements and Fixes</kbd></summary>

What's fixed

Version 1.153.3

Released on 2024-11-24

🐛 Bug Fixes

  • misc: Fix ssr.

<summary><kbd>Improvements and Fixes</kbd></summary>

What's fixed

Version 1.153.2

Released on 2024-11-24

💄 Styles

  • misc: Update Hero.

<summary><kbd>Improvements and Fixes</kbd></summary>

Styles

Version 1.153.1

Released on 2024-11-24

💄 Styles

  • misc: Update og.

<summary><kbd>Improvements and Fixes</kbd></summary>

Styles

Version 1.153.0

Released on 2024-11-22

✨ Features

  • misc: Add AuroraBackground.

<summary><kbd>Improvements and Fixes</kbd></summary>

What's improved

  • misc: Add AuroraBackground (dfcc635)

Version 1.152.3

Released on 2024-11-22

♻ Code Refactoring

  • misc: Update dumi.

<summary><kbd>Improvements and Fixes</kbd></summary>

Code refactoring

Version 1.152.2

Released on 2024-11-20

🐛 Bug Fixes

  • misc: Fix type in ChatMessage (fix.

<summary><kbd>Improvements and Fixes</kbd></summary>

What's fixed

  • misc: Fix type in ChatMessage (fix, closes #221 (d3fe658)

Version 1.152.1

Released on 2024-11-20

🐛 Bug Fixes

  • misc: Fix InnerContainer in MobileChatInputArea (fix.

<summary><kbd>Improvements and Fixes</kbd></summary>

What's fixed

  • misc: Fix InnerContainer in MobileChatInputArea (fix, closes #222 (e8919fa)

Version 1.152.0

Released on 2024-10-28

✨ Features

  • misc: Support custom fonts in ThemeProvider.

<summary><kbd>Improvements and Fixes</kbd></summary>

What's improved

  • misc: Support custom fonts in ThemeProvider, closes #216 (f80adf4)

Version 1.151.6

Released on 2024-10-21

💄 Styles

  • misc: Fix latex style.

<summary><kbd>Improvements and Fixes</kbd></summary>

Styles

Version 1.151.5

Released on 2024-10-14

💄 Styles

  • misc: Fix markdown styles in safari.

<summary><kbd>Improvements and Fixes</kbd></summary>

Styles

  • misc: Fix markdown styles in safari, closes #210 (00060e4)

Version 1.151.4

Released on 2024-09-23

💄 Styles

  • misc: Rollback chat header style.

<summary><kbd>Improvements and Fixes</kbd></summary>

Styles

  • misc: Rollback chat header style (3129afc)

Version 1.151.3

Released on 2024-09-23

💄 Styles

  • misc: Update Card style.

<summary><kbd>Improvements and Fixes</kbd></summary>

Styles

  • misc: Update Card style (5a4dbfd)

Version 1.151.2

Released on 2024-09-23

💄 Styles

  • misc: Add new card style.

<summary><kbd>Improvements and Fixes</kbd></summary>

Styles

  • misc: Add new card style (38778e6)

Version 1.151.1

Released on 2024-09-23

🐛 Bug Fixes

  • misc: Ignore ** in code blocks, Lock umi.

💄 Styles

  • misc: Fallback some style.

<summary><kbd>Improvements and Fixes</kbd></summary>

What's fixed

Styles

  • misc: Fallback some style (7b0dbc1)

Version 1.151.0

Released on 2024-09-20

✨ Features

  • misc: Add sitemap.

<summary><kbd>Improvements and Fixes</kbd></summary>

What's improved

Version 1.150.5

Released on 2024-09-15

🐛 Bug Fixes

  • misc: Improve rehypePlugins and remarkPlugins props.

<summary><kbd>Improvements and Fixes</kbd></summary>

What's fixed

  • misc: Improve rehypePlugins and remarkPlugins props (2b15328)