beca-ui 2.1.0 → 2.1.1-beta.10
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +89 -20
- package/dist/beca-ui.js +24732 -24545
- package/dist/components/Grid/index.d.ts +2 -0
- package/dist/components/TextEditor/Suggestions/Suggestions.d.ts +1 -1
- package/dist/components/TextEditor/TableTools/TableTools.component.d.ts +1 -1
- package/dist/components/TextEditor/TextEditor.types.d.ts +12 -5
- package/dist/components/index.d.ts +1 -0
- package/dist/main.css +1 -1
- package/package.json +1 -1
package/README.md
CHANGED
|
@@ -1,31 +1,100 @@
|
|
|
1
|
-
|
|
1
|
+
# Beca UI - Thư viện React Component Library
|
|
2
2
|
|
|
3
|
-
|
|
3
|
+
Beca UI là bộ thư viện React Component chính thức được phát triển bởi đội ngũ Becawork. Thư viện này kế thừa sức mạnh của Ant Design (antd) và được tinh chỉnh, mở rộng các component UI cao cấp để phù hợp với hệ sinh thái sản phẩm Becawork.
|
|
4
4
|
|
|
5
|
-
|
|
5
|
+
## 🚀 Tính năng nổi bật
|
|
6
6
|
|
|
7
|
-
-
|
|
8
|
-
-
|
|
7
|
+
- **Tích hợp sẵn TypeScript**: Hỗ trợ kiểu dữ liệu (type) đầy đủ và an toàn.
|
|
8
|
+
- **Tối ưu hóa UI/UX**: Thiết kế hiện đại, hỗ trợ tùy biến giao diện linh hoạt (Light/Dark mode, Custom Themes).
|
|
9
|
+
- **Component đa dạng**: Hỗ trợ đầy đủ các component từ cơ bản (Buttons, Inputs, Forms...) đến nâng cao (TextEditor, Layouts, Media Players...).
|
|
10
|
+
- **Storybook tích hợp**: Giúp dễ dàng xem trước và kiểm thử các component trong quá trình phát triển.
|
|
9
11
|
|
|
10
|
-
|
|
12
|
+
---
|
|
11
13
|
|
|
12
|
-
|
|
14
|
+
## 📦 Cài đặt
|
|
13
15
|
|
|
14
|
-
|
|
16
|
+
Sử dụng `npm` hoặc `yarn` để cài đặt thư viện vào dự án của bạn:
|
|
15
17
|
|
|
16
|
-
```
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
project: ['./tsconfig.json', './tsconfig.node.json'],
|
|
21
|
-
tsconfigRootDir: __dirname,
|
|
22
|
-
},
|
|
18
|
+
```bash
|
|
19
|
+
yarn add beca-ui
|
|
20
|
+
# hoặc
|
|
21
|
+
npm install beca-ui
|
|
23
22
|
```
|
|
24
23
|
|
|
25
|
-
|
|
26
|
-
- Optionally add `plugin:@typescript-eslint/stylistic-type-checked`
|
|
27
|
-
- Install [eslint-plugin-react](https://github.com/jsx-eslint/eslint-plugin-react) and add `plugin:react/recommended` & `plugin:react/jsx-runtime` to the `extends` list
|
|
24
|
+
---
|
|
28
25
|
|
|
29
|
-
|
|
26
|
+
## 💻 Cách sử dụng
|
|
30
27
|
|
|
31
|
-
|
|
28
|
+
Import trực tiếp file CSS và các Component cần thiết vào dự án của bạn:
|
|
29
|
+
|
|
30
|
+
```tsx
|
|
31
|
+
import React from "react";
|
|
32
|
+
import { Button, Tooltip } from "beca-ui";
|
|
33
|
+
import "beca-ui/dist/main.css";
|
|
34
|
+
|
|
35
|
+
const App = () => {
|
|
36
|
+
return (
|
|
37
|
+
<Tooltip title="Đây là Tooltip từ beca-ui">
|
|
38
|
+
<Button type="primary">Beca UI Button</Button>
|
|
39
|
+
</Tooltip>
|
|
40
|
+
);
|
|
41
|
+
};
|
|
42
|
+
|
|
43
|
+
export default App;
|
|
44
|
+
```
|
|
45
|
+
|
|
46
|
+
---
|
|
47
|
+
|
|
48
|
+
## 🛠️ Phát triển & Đóng góp (Development)
|
|
49
|
+
|
|
50
|
+
Nếu bạn muốn chỉnh sửa hoặc thêm component mới vào thư viện:
|
|
51
|
+
|
|
52
|
+
### 1. Cài đặt các gói phụ thuộc (Dependencies)
|
|
53
|
+
|
|
54
|
+
```bash
|
|
55
|
+
yarn install
|
|
56
|
+
```
|
|
57
|
+
|
|
58
|
+
### 2. Chạy Storybook để phát triển UI
|
|
59
|
+
|
|
60
|
+
```bash
|
|
61
|
+
yarn dev
|
|
62
|
+
# hoặc
|
|
63
|
+
yarn storybook
|
|
64
|
+
```
|
|
65
|
+
|
|
66
|
+
Storybook sẽ được khởi chạy trên trình duyệt của bạn.
|
|
67
|
+
|
|
68
|
+
### 3. Kiểm tra mã nguồn (Linter)
|
|
69
|
+
|
|
70
|
+
```bash
|
|
71
|
+
yarn lint
|
|
72
|
+
```
|
|
73
|
+
|
|
74
|
+
### 4. Build thư viện phục vụ cho việc release
|
|
75
|
+
|
|
76
|
+
```bash
|
|
77
|
+
yarn build
|
|
78
|
+
```
|
|
79
|
+
|
|
80
|
+
Lệnh này sẽ biên dịch TypeScript và đóng gói các component bằng Vite sang thư mục `dist/`.
|
|
81
|
+
|
|
82
|
+
---
|
|
83
|
+
|
|
84
|
+
## 📋 Nhật ký thay đổi (Changelog)
|
|
85
|
+
|
|
86
|
+
Chi tiết các thay đổi qua các phiên bản được ghi nhận tại file [CHANGELOG.md](file:///Users/hautp/Work/beca-ui/CHANGELOG.md).
|
|
87
|
+
|
|
88
|
+
### Phiên bản gần đây:
|
|
89
|
+
- **`2.1.1-beta.9` (2026-07-15)**:
|
|
90
|
+
- Cập nhật tài liệu hướng dẫn và lược bỏ thông tin cấu hình nhạy cảm.
|
|
91
|
+
- Bổ sung Tooltip hiển thị tên tài khoản (username) trên thanh Header.
|
|
92
|
+
- Tự động hóa quy trình nâng phiên bản và cập nhật changelog.
|
|
93
|
+
- **`2.1.1-beta.8` (2026-07-15)**:
|
|
94
|
+
- Nâng cấp toàn diện component `TextEditor` (hỗ trợ Fullscreen và Compact mode).
|
|
95
|
+
|
|
96
|
+
---
|
|
97
|
+
|
|
98
|
+
## ⚖️ Giấy phép (License)
|
|
99
|
+
|
|
100
|
+
Dự án được phân phối dưới giấy phép **MIT**.
|