school-erp-ui-shared 1.0.2 → 1.0.3
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 +129 -0
- package/dist/{index-xR4ZXjOI.mjs → index-CJUARMtQ.mjs} +159 -154
- package/dist/{index-DSxfA1Nt.js → index-Ce5Df-M6.js} +2 -2
- package/dist/index.cjs +1 -1
- package/dist/{index.es-DBu5ruo0.js → index.es-2fp9b2oD.js} +1 -1
- package/dist/{index.es-DSVJOpFn.mjs → index.es-3hz-kvpT.mjs} +1 -1
- package/dist/index.mjs +1 -1
- package/package.json +4 -4
package/README.md
ADDED
|
@@ -0,0 +1,129 @@
|
|
|
1
|
+
# school-erp-ui-shared
|
|
2
|
+
|
|
3
|
+
Shared Tailwind CSS + Lucide icons React component library used by the School ERP Admin, Teacher, and Student portals.
|
|
4
|
+
|
|
5
|
+
**npm:** https://www.npmjs.com/package/school-erp-ui-shared
|
|
6
|
+
|
|
7
|
+
## Installation
|
|
8
|
+
|
|
9
|
+
```bash
|
|
10
|
+
npm install school-erp-ui-shared
|
|
11
|
+
```
|
|
12
|
+
|
|
13
|
+
### Peer Dependencies
|
|
14
|
+
|
|
15
|
+
These must be installed in your consuming app:
|
|
16
|
+
|
|
17
|
+
```bash
|
|
18
|
+
npm install react react-dom react-router-dom lucide-react
|
|
19
|
+
```
|
|
20
|
+
|
|
21
|
+
## Usage
|
|
22
|
+
|
|
23
|
+
### Import components
|
|
24
|
+
|
|
25
|
+
```js
|
|
26
|
+
import { Button, Modal, Badge, Sidebar, Topbar } from 'school-erp-ui-shared';
|
|
27
|
+
```
|
|
28
|
+
|
|
29
|
+
### Tailwind config
|
|
30
|
+
|
|
31
|
+
In your app's `tailwind.config.js`:
|
|
32
|
+
|
|
33
|
+
```js
|
|
34
|
+
import sharedConfig from 'school-erp-ui-shared/tailwind.shared.js';
|
|
35
|
+
|
|
36
|
+
export default {
|
|
37
|
+
content: [
|
|
38
|
+
'./index.html',
|
|
39
|
+
'./src/**/*.{js,jsx}',
|
|
40
|
+
'./node_modules/school-erp-ui-shared/dist/**/*.{js,mjs,cjs}',
|
|
41
|
+
],
|
|
42
|
+
theme: {
|
|
43
|
+
extend: {
|
|
44
|
+
...sharedConfig.theme.extend,
|
|
45
|
+
},
|
|
46
|
+
},
|
|
47
|
+
plugins: [],
|
|
48
|
+
};
|
|
49
|
+
```
|
|
50
|
+
|
|
51
|
+
## Available Exports
|
|
52
|
+
|
|
53
|
+
### Components
|
|
54
|
+
|
|
55
|
+
Button, Card, CardHeader, CardContent, CardTitle, Badge, Breadcrumb, Input, SearchInput, Select, Modal, DataTable, Sidebar, Topbar, Skeleton, SkeletonCard, SkeletonDashboard, SkeletonTable, ProtectedRoute, RecentActivities, ToastProvider, ConfirmDialog, SearchableSelect, Tabs, Checkbox, FilterBar, DateInput, TimeInput, ErrorBoundary, NetworkStatus, SortableHeader, HoverCard, EmptyState, SectionCard, SessionTimeout
|
|
56
|
+
|
|
57
|
+
### Hooks
|
|
58
|
+
|
|
59
|
+
useLocalStorage, useKeyboardShortcuts, useFormDraft, useRecentlyViewed, useTabState, useSortableData, useToast
|
|
60
|
+
|
|
61
|
+
### Utilities
|
|
62
|
+
|
|
63
|
+
cn, exportToCsv, exportToExcel, exportMultiSheetExcel, generatePdf, generateStudentReportCard, generateFeeReceipt, generateAttendanceReport
|
|
64
|
+
|
|
65
|
+
## Development
|
|
66
|
+
|
|
67
|
+
```bash
|
|
68
|
+
# Install dependencies
|
|
69
|
+
npm install
|
|
70
|
+
|
|
71
|
+
# Build the library
|
|
72
|
+
npm run build
|
|
73
|
+
```
|
|
74
|
+
|
|
75
|
+
## Publishing to npm
|
|
76
|
+
|
|
77
|
+
### First-time setup
|
|
78
|
+
|
|
79
|
+
1. Login to npm:
|
|
80
|
+
```bash
|
|
81
|
+
npm login
|
|
82
|
+
```
|
|
83
|
+
|
|
84
|
+
2. Configure access token (required for 2FA-enabled accounts):
|
|
85
|
+
- Go to https://www.npmjs.com → Avatar → **Access Tokens**
|
|
86
|
+
- Generate a **Granular Access Token** with Read & Write permissions
|
|
87
|
+
- Set the token:
|
|
88
|
+
```bash
|
|
89
|
+
npm config set //registry.npmjs.org/:_authToken=YOUR_TOKEN
|
|
90
|
+
```
|
|
91
|
+
|
|
92
|
+
### Publishing a new version
|
|
93
|
+
|
|
94
|
+
```bash
|
|
95
|
+
# Bump version (patch/minor/major)
|
|
96
|
+
npm version patch
|
|
97
|
+
|
|
98
|
+
# Publish (auto-builds via prepublishOnly script)
|
|
99
|
+
npm publish --access public
|
|
100
|
+
```
|
|
101
|
+
|
|
102
|
+
### After publishing, update consuming apps
|
|
103
|
+
|
|
104
|
+
```bash
|
|
105
|
+
cd School_ERP_UI_Admin && npm update school-erp-ui-shared
|
|
106
|
+
cd School_ERP_UI_Student && npm update school-erp-ui-shared
|
|
107
|
+
cd School_ERP_UI_Teachers && npm update school-erp-ui-shared
|
|
108
|
+
```
|
|
109
|
+
|
|
110
|
+
## Project Structure
|
|
111
|
+
|
|
112
|
+
```
|
|
113
|
+
school-erp-ui-shared/
|
|
114
|
+
├── src/
|
|
115
|
+
│ ├── components/ # React components
|
|
116
|
+
│ ├── hooks/ # Custom hooks
|
|
117
|
+
│ ├── utils/ # Utility functions
|
|
118
|
+
│ └── index.js # Main entry (all exports)
|
|
119
|
+
├── dist/ # Built output (published to npm)
|
|
120
|
+
├── tailwind.shared.js # Shared Tailwind theme config
|
|
121
|
+
├── vite.config.js # Vite library mode build config
|
|
122
|
+
└── package.json
|
|
123
|
+
```
|
|
124
|
+
|
|
125
|
+
## Notes
|
|
126
|
+
|
|
127
|
+
- Only the `dist/` folder and `tailwind.shared.js` are published to npm (not source code)
|
|
128
|
+
- `react`, `react-dom`, `react-router-dom`, and `lucide-react` are peer dependencies — they are NOT bundled, the consuming app provides them
|
|
129
|
+
- The `prepublishOnly` script auto-runs `vite build` before every publish
|