avt-rct-lib 1.0.0
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 +82 -0
- package/dist/index.cjs +1341 -0
- package/dist/index.d.cts +298 -0
- package/dist/index.d.ts +298 -0
- package/dist/index.js +1266 -0
- package/package.json +54 -0
- package/src/styles/base.css +57 -0
package/README.md
ADDED
|
@@ -0,0 +1,82 @@
|
|
|
1
|
+
# avt-rct-lib
|
|
2
|
+
|
|
3
|
+
React component library dengan desain macOS/iOS. **Hanya butuh Tailwind CSS** — tanpa Radix UI, tanpa library komponen lain.
|
|
4
|
+
|
|
5
|
+
## Komponen
|
|
6
|
+
|
|
7
|
+
| Komponen | Deskripsi |
|
|
8
|
+
|---|---|
|
|
9
|
+
| `Button` | 6 variant, 5 ukuran, loading state, icon support |
|
|
10
|
+
| `Badge` | 7 variant warna + dot indicator |
|
|
11
|
+
| `Input` / `Textarea` | Label, hint, error, addons |
|
|
12
|
+
| `Card` | Padding variant, hover, glass morphism |
|
|
13
|
+
| `Tabs` | 3 variant: pills, underline, segment |
|
|
14
|
+
| `MenuRoot` | Dropdown — `createPortal`, auto-position |
|
|
15
|
+
| `Sheet` / `Drawer` | Slide panel right/left/bottom — `createPortal` |
|
|
16
|
+
| `Toast` | Singleton store, bisa dipanggil di luar React |
|
|
17
|
+
| `Table` | Toolbar, pagination, responsive |
|
|
18
|
+
| `Navbar` | Left/center/right slots, search, icon buttons |
|
|
19
|
+
| `Sidebar` | Push mode (desktop) + overlay mode (mobile) |
|
|
20
|
+
| `Scrollbar` | Thin macOS-style scrollbar wrapper |
|
|
21
|
+
|
|
22
|
+
## Setup
|
|
23
|
+
|
|
24
|
+
### 1. Tailwind Config
|
|
25
|
+
|
|
26
|
+
```js
|
|
27
|
+
// tailwind.config.js
|
|
28
|
+
export default {
|
|
29
|
+
content: [
|
|
30
|
+
'./src/**/*.{ts,tsx}',
|
|
31
|
+
'./node_modules/avt-rct-lib/dist/**/*.js',
|
|
32
|
+
],
|
|
33
|
+
}
|
|
34
|
+
```
|
|
35
|
+
|
|
36
|
+
### 2. Import CSS (animasi & scrollbar)
|
|
37
|
+
|
|
38
|
+
```ts
|
|
39
|
+
// main.tsx
|
|
40
|
+
import 'avt-rct-lib/styles'
|
|
41
|
+
```
|
|
42
|
+
|
|
43
|
+
### 3. Gunakan komponen
|
|
44
|
+
|
|
45
|
+
```tsx
|
|
46
|
+
import { Button, Badge, Card, toast, Sidebar } from 'avt-rct-lib'
|
|
47
|
+
|
|
48
|
+
<Button variant="primary">Simpan</Button>
|
|
49
|
+
<Badge variant="success" dot>Online</Badge>
|
|
50
|
+
toast({ title: 'Berhasil!', variant: 'success' })
|
|
51
|
+
```
|
|
52
|
+
|
|
53
|
+
## Development (sumber lokal)
|
|
54
|
+
|
|
55
|
+
```js
|
|
56
|
+
// vite.config.ts — alias untuk dev tanpa npm install
|
|
57
|
+
resolve: {
|
|
58
|
+
alias: {
|
|
59
|
+
'avt-rct-lib': path.resolve(__dirname, '../avt-rct-lib/src/index.ts'),
|
|
60
|
+
},
|
|
61
|
+
}
|
|
62
|
+
|
|
63
|
+
// tailwind.config.js — scan source langsung
|
|
64
|
+
content: [
|
|
65
|
+
'../avt-rct-lib/src/**/*.{ts,tsx}',
|
|
66
|
+
]
|
|
67
|
+
|
|
68
|
+
// main.tsx — import CSS langsung dari source
|
|
69
|
+
import '../avt-rct-lib/src/styles/base.css'
|
|
70
|
+
```
|
|
71
|
+
|
|
72
|
+
## Build & Publish
|
|
73
|
+
|
|
74
|
+
```bash
|
|
75
|
+
bun run build # kompilasi ke dist/
|
|
76
|
+
npm version patch # bump versi
|
|
77
|
+
npm publish # upload ke npm registry
|
|
78
|
+
```
|
|
79
|
+
|
|
80
|
+
## License
|
|
81
|
+
|
|
82
|
+
MIT
|