Files
ui-essentials/LIBRARY_EXTRACTION_PLAN.md
Giuliano Silvestro 8e10244086 Implement Git submodule packaging strategy for Angular libraries
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>
2025-09-11 16:15:13 +10:00

3.4 KiB

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

  1. ui-animations
  2. ui-accessibility
  3. ui-backgrounds
  4. ui-font-manager
  5. hcl-studio
  6. auth-client

Phase 3: Dependent Libraries

  1. ui-code-display (has external deps)
  2. ui-essentials (may depend on ui-design-system)
  3. 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

# [Library Name]

## Installation
```bash
git submodule add https://github.com/yourorg/[library-name].git libs/[library-name]

Usage

[Usage examples]

Development

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