@aurora-ds/theme 2.0.1 → 3.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 +506 -546
- package/dist/index.cjs +1 -1
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.cts +277 -415
- package/dist/index.d.ts +277 -415
- package/dist/index.js +1 -1
- package/dist/index.js.map +1 -1
- package/package.json +1 -1
- package/README.dev.md +0 -424
package/README.dev.md
DELETED
|
@@ -1,424 +0,0 @@
|
|
|
1
|
-
# Aurora Theme - Developer Guide
|
|
2
|
-
|
|
3
|
-
This document contains development notes and guidelines for maintaining the Aurora Theme library.
|
|
4
|
-
|
|
5
|
-
## Current Version & Branch Status
|
|
6
|
-
|
|
7
|
-
- **Stable (v1.x):** `master` branch - v1.6.0
|
|
8
|
-
- **Next Major (v2.0):** `v2` branch - Breaking changes for simplification
|
|
9
|
-
|
|
10
|
-
### v2.0 Major Changes (Breaking)
|
|
11
|
-
|
|
12
|
-
The v2 branch introduces significant simplifications:
|
|
13
|
-
|
|
14
|
-
1. **Removed Pre-built Palettes** (~40% bundle reduction)
|
|
15
|
-
- Removed 10+ palette exports (`indigoPalette`, `bluePalette`, etc.)
|
|
16
|
-
- Removed `defaultDarkTheme`
|
|
17
|
-
- Users build their own themes for better tree-shaking
|
|
18
|
-
|
|
19
|
-
2. **Restricted Color Scale Imports** (better tree-shaking)
|
|
20
|
-
- Direct imports removed: `import { indigo } from '@aurora-ds/theme'`
|
|
21
|
-
- Only via colors object: `import { colors } from '@aurora-ds/theme'`
|
|
22
|
-
|
|
23
|
-
3. **Removed WCAG Contrast Utilities** (bundle size)
|
|
24
|
-
- Removed `getContrastRatio`, `meetsWCAG`, `checkContrast`, etc.
|
|
25
|
-
- Users should use dedicated accessibility tools
|
|
26
|
-
|
|
27
|
-
4. **Simplified Color Tokens** (60% reduction: 83 → 33 tokens)
|
|
28
|
-
- Removed accent, tertiary, and many state variations
|
|
29
|
-
- Focused on core tokens only
|
|
30
|
-
- Users can extend themes with custom tokens
|
|
31
|
-
|
|
32
|
-
See [CHANGELOG.md](./CHANGELOG.md#200---2026-01-04) for full migration guide.
|
|
33
|
-
|
|
34
|
-
---
|
|
35
|
-
|
|
36
|
-
## Prerequisites
|
|
37
|
-
|
|
38
|
-
- **Node.js** >= 18.0.0
|
|
39
|
-
- **npm** >= 10.9.0
|
|
40
|
-
- **React** >= 18.0.0 (peer dependency)
|
|
41
|
-
|
|
42
|
-
## Project Setup
|
|
43
|
-
|
|
44
|
-
```bash
|
|
45
|
-
# Clone the repository
|
|
46
|
-
git clone https://github.com/LilianMrzt/Aurora.git
|
|
47
|
-
cd Aurora
|
|
48
|
-
|
|
49
|
-
# Install dependencies
|
|
50
|
-
npm install
|
|
51
|
-
```
|
|
52
|
-
|
|
53
|
-
---
|
|
54
|
-
|
|
55
|
-
## Available Scripts
|
|
56
|
-
|
|
57
|
-
| Script | Command | Description |
|
|
58
|
-
|--------|---------|-------------|
|
|
59
|
-
| `dev` | `npm run dev` | Build in watch mode (development) |
|
|
60
|
-
| `build` | `npm run build` | Production build |
|
|
61
|
-
| `test` | `npm test` | Run tests in watch mode |
|
|
62
|
-
| `test:run` | `npm run test:run` | Run tests once |
|
|
63
|
-
| `test:coverage` | `npm run test:coverage` | Tests with coverage report |
|
|
64
|
-
| `lint` | `npm run lint` | ESLint check |
|
|
65
|
-
| `lint:fix` | `npm run lint:fix` | Auto-fix ESLint issues |
|
|
66
|
-
| `typecheck` | `npm run typecheck` | TypeScript check |
|
|
67
|
-
| `size` | `npm run size` | Bundle size check |
|
|
68
|
-
| `audit` | `npm run audit` | Dependency security audit |
|
|
69
|
-
| `audit:fix` | `npm run audit:fix` | Auto-fix vulnerabilities |
|
|
70
|
-
| `validate` | `npm run validate` | Lint + TypeCheck + Tests |
|
|
71
|
-
| `ci` | `npm run ci` | Full CI pipeline |
|
|
72
|
-
|
|
73
|
-
---
|
|
74
|
-
|
|
75
|
-
## Project Structure
|
|
76
|
-
|
|
77
|
-
```
|
|
78
|
-
aurora/
|
|
79
|
-
├── src/ # Source code
|
|
80
|
-
│ ├── index.ts # Main entry point (exports)
|
|
81
|
-
│ ├── providers/ # React Context providers
|
|
82
|
-
│ │ ├── ThemeProvider.tsx
|
|
83
|
-
│ │ └── index.ts
|
|
84
|
-
│ ├── types/ # TypeScript types
|
|
85
|
-
│ │ ├── colors/ # Color types
|
|
86
|
-
│ │ ├── palettes/ # Palette types
|
|
87
|
-
│ │ └── theme/ # Theme types
|
|
88
|
-
│ └── utils/ # Utilities
|
|
89
|
-
│ ├── styles/ # CSS-in-JS style utilities
|
|
90
|
-
│ └── theme/ # Theme creation utilities
|
|
91
|
-
├── tests/ # Unit tests
|
|
92
|
-
│ ├── setup.ts # Vitest configuration
|
|
93
|
-
│ ├── providers/ # Provider tests
|
|
94
|
-
│ └── utils/ # Utility tests
|
|
95
|
-
├── dist/ # Production build (generated)
|
|
96
|
-
├── coverage/ # Coverage report (generated)
|
|
97
|
-
├── tsconfig.json # Main TS config
|
|
98
|
-
├── tsconfig.build.json # Build TS config
|
|
99
|
-
├── tsconfig.test.json # Test TS config
|
|
100
|
-
├── tsup.config.ts # Bundler config
|
|
101
|
-
├── vitest.config.ts # Test config
|
|
102
|
-
└── package.json
|
|
103
|
-
```
|
|
104
|
-
|
|
105
|
-
---
|
|
106
|
-
|
|
107
|
-
## Development
|
|
108
|
-
|
|
109
|
-
### Start Development Mode
|
|
110
|
-
|
|
111
|
-
```bash
|
|
112
|
-
npm run dev
|
|
113
|
-
```
|
|
114
|
-
|
|
115
|
-
This launches `tsup` in watch mode which automatically recompiles on every change.
|
|
116
|
-
|
|
117
|
-
### Run Tests
|
|
118
|
-
|
|
119
|
-
```bash
|
|
120
|
-
# Watch mode (development)
|
|
121
|
-
npm test
|
|
122
|
-
|
|
123
|
-
# Single run
|
|
124
|
-
npm run test:run
|
|
125
|
-
|
|
126
|
-
# With coverage
|
|
127
|
-
npm run test:coverage
|
|
128
|
-
```
|
|
129
|
-
|
|
130
|
-
### Code Verification
|
|
131
|
-
|
|
132
|
-
```bash
|
|
133
|
-
# Check everything at once
|
|
134
|
-
npm run validate
|
|
135
|
-
|
|
136
|
-
# Or separately
|
|
137
|
-
npm run lint # ESLint
|
|
138
|
-
npm run typecheck # TypeScript
|
|
139
|
-
npm run test:run # Tests
|
|
140
|
-
```
|
|
141
|
-
|
|
142
|
-
---
|
|
143
|
-
|
|
144
|
-
## Build & Publishing
|
|
145
|
-
|
|
146
|
-
### Production Build
|
|
147
|
-
|
|
148
|
-
```bash
|
|
149
|
-
npm run build
|
|
150
|
-
```
|
|
151
|
-
|
|
152
|
-
The build generates in `dist/`:
|
|
153
|
-
- `index.js` - ESM module
|
|
154
|
-
- `index.cjs` - CommonJS module
|
|
155
|
-
- `index.d.ts` - TypeScript types
|
|
156
|
-
- `index.d.cts` - CommonJS types
|
|
157
|
-
|
|
158
|
-
### Pre-publish Verification
|
|
159
|
-
|
|
160
|
-
```bash
|
|
161
|
-
# Full CI pipeline
|
|
162
|
-
npm run ci
|
|
163
|
-
```
|
|
164
|
-
|
|
165
|
-
This command runs:
|
|
166
|
-
1. `lint` - Code verification
|
|
167
|
-
2. `typecheck` - Type checking
|
|
168
|
-
3. `test:run` - Test execution
|
|
169
|
-
4. `build` - Production build
|
|
170
|
-
5. `size` - Size check (< 10 KB gzipped)
|
|
171
|
-
6. `audit` - Security audit
|
|
172
|
-
|
|
173
|
-
### Publishing to npm
|
|
174
|
-
|
|
175
|
-
#### For Patch/Minor Releases
|
|
176
|
-
|
|
177
|
-
```bash
|
|
178
|
-
# 1. Update version in package.json
|
|
179
|
-
# 2. Move changes from [Unreleased] to new version in CHANGELOG.md
|
|
180
|
-
# 3. Commit and tag
|
|
181
|
-
|
|
182
|
-
npm version patch # or minor
|
|
183
|
-
git push --follow-tags
|
|
184
|
-
|
|
185
|
-
# 4. Publish
|
|
186
|
-
npm publish --access public
|
|
187
|
-
```
|
|
188
|
-
|
|
189
|
-
#### For Major Releases (Breaking Changes)
|
|
190
|
-
|
|
191
|
-
**Current Version:** v1.6.0 → **v2.0.0** (current branch: `v2`)
|
|
192
|
-
|
|
193
|
-
Major releases with breaking changes require extra care:
|
|
194
|
-
|
|
195
|
-
**1. Finalize Breaking Changes**
|
|
196
|
-
- Review all changes in `[Unreleased]` section of CHANGELOG.md
|
|
197
|
-
- Ensure migration guide is complete and accurate
|
|
198
|
-
- Update README.md with migration summary
|
|
199
|
-
|
|
200
|
-
**2. Update Version**
|
|
201
|
-
```bash
|
|
202
|
-
npm version major # 1.6.0 → 2.0.0
|
|
203
|
-
```
|
|
204
|
-
|
|
205
|
-
**3. Documentation Updates**
|
|
206
|
-
- Move `[Unreleased]` to `[2.0.0] - YYYY-MM-DD` in CHANGELOG.md
|
|
207
|
-
- Ensure migration guide is comprehensive
|
|
208
|
-
- Update any affected code examples
|
|
209
|
-
|
|
210
|
-
**4. Thorough Testing**
|
|
211
|
-
```bash
|
|
212
|
-
npm run ci # Full CI pipeline
|
|
213
|
-
npm run test:coverage # Ensure >80% coverage
|
|
214
|
-
```
|
|
215
|
-
|
|
216
|
-
**5. Create Release Branch/PR**
|
|
217
|
-
- Title: `Release v2.0.0`
|
|
218
|
-
- Include summary of breaking changes
|
|
219
|
-
- Link to migration guide
|
|
220
|
-
- Get review if working in a team
|
|
221
|
-
|
|
222
|
-
**6. Merge and Publish**
|
|
223
|
-
```bash
|
|
224
|
-
# After merge to main:
|
|
225
|
-
git checkout main
|
|
226
|
-
git pull
|
|
227
|
-
git tag -a v2.0.0 -m "Release v2.0.0 - Major simplification"
|
|
228
|
-
git push origin v2.0.0
|
|
229
|
-
npm publish --access public
|
|
230
|
-
```
|
|
231
|
-
|
|
232
|
-
**7. Post-Release Communication**
|
|
233
|
-
- Create GitHub Release with full changelog
|
|
234
|
-
- Announce breaking changes in GitHub Discussions
|
|
235
|
-
- Update any example repositories
|
|
236
|
-
- Consider writing a blog post explaining the changes
|
|
237
|
-
|
|
238
|
-
> Note: `prepublishOnly` automatically runs `npm run ci` before publishing.
|
|
239
|
-
|
|
240
|
-
---
|
|
241
|
-
|
|
242
|
-
## Updating the Library
|
|
243
|
-
|
|
244
|
-
### Updating Dependencies
|
|
245
|
-
|
|
246
|
-
```bash
|
|
247
|
-
# View available updates
|
|
248
|
-
npm outdated
|
|
249
|
-
|
|
250
|
-
# Update dependencies
|
|
251
|
-
npm update
|
|
252
|
-
|
|
253
|
-
# Or to update to latest major versions
|
|
254
|
-
npx npm-check-updates -u
|
|
255
|
-
npm install
|
|
256
|
-
```
|
|
257
|
-
|
|
258
|
-
### After an Update
|
|
259
|
-
|
|
260
|
-
1. **Run full validation:**
|
|
261
|
-
```bash
|
|
262
|
-
npm run validate
|
|
263
|
-
```
|
|
264
|
-
|
|
265
|
-
2. **Check bundle size:**
|
|
266
|
-
```bash
|
|
267
|
-
npm run size
|
|
268
|
-
```
|
|
269
|
-
|
|
270
|
-
3. **Check for vulnerabilities:**
|
|
271
|
-
```bash
|
|
272
|
-
npm run audit
|
|
273
|
-
```
|
|
274
|
-
|
|
275
|
-
---
|
|
276
|
-
|
|
277
|
-
## Adding a New Feature
|
|
278
|
-
|
|
279
|
-
### 1. Create Types (if needed)
|
|
280
|
-
|
|
281
|
-
Add in `src/types/`:
|
|
282
|
-
|
|
283
|
-
```typescript
|
|
284
|
-
// src/types/theme/NewFeature.ts
|
|
285
|
-
export interface NewFeature {
|
|
286
|
-
// ...
|
|
287
|
-
}
|
|
288
|
-
```
|
|
289
|
-
|
|
290
|
-
Export in `src/types/index.ts`.
|
|
291
|
-
|
|
292
|
-
### 2. Create the Utility
|
|
293
|
-
|
|
294
|
-
Add in `src/utils/`:
|
|
295
|
-
|
|
296
|
-
```typescript
|
|
297
|
-
// src/utils/newFeature.ts
|
|
298
|
-
export const newFeature = () => {
|
|
299
|
-
// ...
|
|
300
|
-
}
|
|
301
|
-
```
|
|
302
|
-
|
|
303
|
-
Export in `src/utils/index.ts` and `src/index.ts`.
|
|
304
|
-
|
|
305
|
-
### 3. Write Tests
|
|
306
|
-
|
|
307
|
-
```typescript
|
|
308
|
-
// tests/utils/newFeature.test.ts
|
|
309
|
-
import { describe, it, expect } from 'vitest'
|
|
310
|
-
import { newFeature } from '@/utils/newFeature'
|
|
311
|
-
|
|
312
|
-
describe('newFeature', () => {
|
|
313
|
-
it('should ...', () => {
|
|
314
|
-
expect(newFeature()).toBe(...)
|
|
315
|
-
})
|
|
316
|
-
})
|
|
317
|
-
```
|
|
318
|
-
|
|
319
|
-
### 4. Update Documentation
|
|
320
|
-
|
|
321
|
-
- Update `README.md` with the public API
|
|
322
|
-
- Update `CHANGELOG.md` in the `[Unreleased]` section
|
|
323
|
-
|
|
324
|
-
---
|
|
325
|
-
|
|
326
|
-
## Code Conventions
|
|
327
|
-
|
|
328
|
-
### Commits
|
|
329
|
-
|
|
330
|
-
Use the [Conventional Commits](https://www.conventionalcommits.org/) format:
|
|
331
|
-
|
|
332
|
-
```
|
|
333
|
-
feat: add new color palette
|
|
334
|
-
fix: resolve caching issue
|
|
335
|
-
docs: update README
|
|
336
|
-
test: add unit tests for createTheme
|
|
337
|
-
refactor: improve style engine performance
|
|
338
|
-
chore: update dependencies
|
|
339
|
-
```
|
|
340
|
-
|
|
341
|
-
### Code Style
|
|
342
|
-
|
|
343
|
-
- **Indentation**: 4 spaces
|
|
344
|
-
- **Quotes**: Single `'`
|
|
345
|
-
- **Semicolons**: No
|
|
346
|
-
- **Trailing comma**: Yes
|
|
347
|
-
|
|
348
|
-
ESLint and TypeScript are configured to validate these rules.
|
|
349
|
-
|
|
350
|
-
### Exports
|
|
351
|
-
|
|
352
|
-
All public exports must be in `src/index.ts`:
|
|
353
|
-
|
|
354
|
-
```typescript
|
|
355
|
-
// Types
|
|
356
|
-
export type { Theme, BaseColors, ... } from './types'
|
|
357
|
-
|
|
358
|
-
// Providers
|
|
359
|
-
export { ThemeProvider, useTheme } from './providers'
|
|
360
|
-
|
|
361
|
-
// Utils
|
|
362
|
-
export { createStyles, createTheme, ... } from './utils'
|
|
363
|
-
```
|
|
364
|
-
|
|
365
|
-
---
|
|
366
|
-
|
|
367
|
-
## Size Limits
|
|
368
|
-
|
|
369
|
-
The bundle must stay under **10 KB gzipped** for each format:
|
|
370
|
-
|
|
371
|
-
```json
|
|
372
|
-
"size-limit": [
|
|
373
|
-
{ "path": "dist/index.js", "limit": "10 KB", "gzip": true },
|
|
374
|
-
{ "path": "dist/index.cjs", "limit": "10 KB", "gzip": true }
|
|
375
|
-
]
|
|
376
|
-
```
|
|
377
|
-
|
|
378
|
-
If the limit is exceeded:
|
|
379
|
-
- Optimize the code
|
|
380
|
-
- Use tree-shaking
|
|
381
|
-
- Avoid unnecessary dependencies
|
|
382
|
-
|
|
383
|
-
---
|
|
384
|
-
|
|
385
|
-
## Test Coverage
|
|
386
|
-
|
|
387
|
-
Target: **> 80%** coverage.
|
|
388
|
-
|
|
389
|
-
Reports are generated in `coverage/`:
|
|
390
|
-
- `coverage/index.html` - Interactive HTML report
|
|
391
|
-
- `coverage/coverage-final.json` - Raw data
|
|
392
|
-
|
|
393
|
-
---
|
|
394
|
-
|
|
395
|
-
## Security
|
|
396
|
-
|
|
397
|
-
See [SECURITY.md](./SECURITY.md) for:
|
|
398
|
-
- Supported versions
|
|
399
|
-
- How to report a vulnerability
|
|
400
|
-
- Project security practices
|
|
401
|
-
|
|
402
|
-
### Key Points
|
|
403
|
-
|
|
404
|
-
- **No `eval()`** or `Function()` constructor
|
|
405
|
-
- **CSS sanitization** to prevent injections
|
|
406
|
-
- **Regular auditing** of dependencies
|
|
407
|
-
|
|
408
|
-
---
|
|
409
|
-
|
|
410
|
-
## Resources
|
|
411
|
-
|
|
412
|
-
- [TypeScript Handbook](https://www.typescriptlang.org/docs/)
|
|
413
|
-
- [Vitest Documentation](https://vitest.dev/)
|
|
414
|
-
- [tsup Documentation](https://tsup.egoist.dev/)
|
|
415
|
-
- [ESLint Rules](https://eslint.org/docs/rules/)
|
|
416
|
-
|
|
417
|
-
---
|
|
418
|
-
|
|
419
|
-
## Contact
|
|
420
|
-
|
|
421
|
-
For any development questions:
|
|
422
|
-
- Email: lilian.marzet@gmail.com
|
|
423
|
-
- Issues: [GitHub Issues](https://github.com/LilianMrzt/Aurora/issues)
|
|
424
|
-
|