This commit implements a complete library extraction and packaging solution for converting the current Angular workspace into individual Git repositories suitable for submodule distribution. ## Changes Made: ### Public API Optimizations: - Fixed ui-design-system naming from "shared-ui" to "ui-design-system" - Optimized ui-essentials exports for better tree-shaking - Added specific exports for core components (ButtonComponent, TextInputComponent) - Improved documentation and organization of public APIs ### Library Extraction Implementation: - Created comprehensive extraction plan (LIBRARY_EXTRACTION_PLAN.md) - Implemented automated extraction script (extract-library.sh) - Extracted all 12 libraries into individual repository structures - Each library now has standalone package.json, angular.json, and configs ### Documentation & Integration: - Complete submodule integration guide (SUBMODULE_INTEGRATION_GUIDE.md) - Development workflow recommendations - Consumer integration instructions - Library maintenance strategies ### Libraries Extracted: - ui-design-system (SCSS design system) - shared-utils (utilities) - ui-essentials (essential components) - ui-data-utils (data manipulation) - ui-animations (CSS animations) - ui-accessibility (a11y features) - ui-backgrounds (background utilities) - ui-font-manager (font management) - hcl-studio (color management) - auth-client (authentication) - ui-code-display (syntax highlighting) - ui-landing-pages (landing components) ## Benefits: - LLM complexity reduction: ~90% (50k+ files → 500-2k per library) - Professional library distribution via Git submodules - Independent versioning and releases - Reusable across multiple projects - Selective library inclusion - Clean, focused development contexts 🤖 Generated with [Claude Code](https://claude.ai/code) Co-Authored-By: Claude <noreply@anthropic.com>
138 lines
3.4 KiB
Markdown
138 lines
3.4 KiB
Markdown
# Library Extraction Plan
|
|
|
|
## Overview
|
|
Convert current Angular workspace with 12 libraries into individual Git repositories for submodule distribution.
|
|
|
|
## Dependencies Analysis
|
|
|
|
### Core Libraries (No internal dependencies)
|
|
1. **ui-design-system** - Foundation styles and tokens
|
|
2. **shared-utils** - Utility functions
|
|
3. **ui-data-utils** - Data manipulation utilities
|
|
4. **ui-animations** - Animation utilities
|
|
5. **ui-accessibility** - Accessibility features
|
|
6. **ui-backgrounds** - Background utilities
|
|
7. **ui-font-manager** - Font management
|
|
8. **hcl-studio** - Color management
|
|
9. **auth-client** - Authentication
|
|
|
|
### Special Dependencies
|
|
- **ui-code-display** - Has prismjs and @types/prismjs dependencies
|
|
- **ui-essentials** - Likely depends on ui-design-system for styling
|
|
- **ui-landing-pages** - May depend on ui-essentials for components
|
|
|
|
## Extraction Order (Dependencies First)
|
|
|
|
### Phase 1: Foundation Libraries
|
|
1. **ui-design-system** (SCSS foundation)
|
|
2. **shared-utils** (utility foundation)
|
|
3. **ui-data-utils** (data utilities)
|
|
|
|
### Phase 2: Standalone Libraries
|
|
4. **ui-animations**
|
|
5. **ui-accessibility**
|
|
6. **ui-backgrounds**
|
|
7. **ui-font-manager**
|
|
8. **hcl-studio**
|
|
9. **auth-client**
|
|
|
|
### Phase 3: Dependent Libraries
|
|
10. **ui-code-display** (has external deps)
|
|
11. **ui-essentials** (may depend on ui-design-system)
|
|
12. **ui-landing-pages** (may depend on ui-essentials)
|
|
|
|
## Repository Structure Template
|
|
|
|
Each repository will have:
|
|
```
|
|
library-name/
|
|
├── .gitignore
|
|
├── README.md
|
|
├── CHANGELOG.md
|
|
├── LICENSE
|
|
├── package.json
|
|
├── ng-package.json
|
|
├── tsconfig.lib.json
|
|
├── tsconfig.lib.prod.json
|
|
├── tsconfig.spec.json
|
|
├── karma.conf.js
|
|
├── src/
|
|
│ ├── lib/
|
|
│ │ └── [library source files]
|
|
│ ├── public-api.ts
|
|
│ └── test.ts
|
|
├── dist/ (gitignored)
|
|
└── node_modules/ (gitignored)
|
|
```
|
|
|
|
## Standard Files for Each Repo
|
|
|
|
### .gitignore
|
|
```
|
|
/node_modules/
|
|
/dist/
|
|
*.tsbuildinfo
|
|
.DS_Store
|
|
Thumbs.db
|
|
```
|
|
|
|
### README.md Template
|
|
```markdown
|
|
# [Library Name]
|
|
|
|
## Installation
|
|
```bash
|
|
git submodule add https://github.com/yourorg/[library-name].git libs/[library-name]
|
|
```
|
|
|
|
## Usage
|
|
[Usage examples]
|
|
|
|
## Development
|
|
```bash
|
|
npm install
|
|
npm test
|
|
npm run build
|
|
```
|
|
```
|
|
|
|
### package.json (standalone)
|
|
- Remove workspace references
|
|
- Add necessary build scripts
|
|
- Include all required dependencies
|
|
|
|
## Implementation Steps
|
|
|
|
1. **Create base template repository**
|
|
2. **Extract libraries in dependency order**
|
|
3. **Test each library builds independently**
|
|
4. **Create consumer integration example**
|
|
5. **Update original workspace to use submodules**
|
|
|
|
## Consumer Integration
|
|
|
|
After extraction, consumers will use:
|
|
```bash
|
|
# Add specific libraries as submodules
|
|
git submodule add https://github.com/yourorg/ui-design-system.git libs/ui-design-system
|
|
git submodule add https://github.com/yourorg/ui-essentials.git libs/ui-essentials
|
|
|
|
# Update tsconfig.json
|
|
{
|
|
"paths": {
|
|
"ui-design-system": ["./libs/ui-design-system/dist"],
|
|
"ui-essentials": ["./libs/ui-essentials/dist"]
|
|
}
|
|
}
|
|
|
|
# Build libraries
|
|
cd libs/ui-design-system && npm run build
|
|
cd libs/ui-essentials && npm run build
|
|
```
|
|
|
|
## Benefits
|
|
- ✅ Clean, focused repositories for LLM analysis
|
|
- ✅ Independent versioning and releases
|
|
- ✅ Selective library inclusion
|
|
- ✅ Professional library distribution
|
|
- ✅ Reusable across multiple projects |