A modern monorepo containing ngx-lift and clr-lift - two powerful Angular libraries designed to enhance and simplify your development experience. Built with Angular 20, TypeScript 5.9, and modern best practices.

A comprehensive Angular utility library that provides essential tools for modern Angular development:

• 🚀 RxJS Operators - Specialized operators for async state management, polling, and reactive patterns
• ⚡ Signal Utilities - Powerful signal-based utilities for Angular's Signals API
• 🔧 Pipes - Ready-to-use pipes for common transformations (bytes, masking, arrays)
• ✅ Validators - Advanced form validators (date ranges, URLs, unique values)
• 🛠️ Utilities - Helper functions for forms, dates, objects, and more

📦 View on npm • 📖 Documentation • 💻 Source Code

An Angular component library built on top of VMware Clarity Design System:

• 🧩 15+ Production-Ready Components - Alerts, toasts, spinners, wizards, and more
• 🔧 Clarity Utilities - Enhanced datagrid state management and helpers
• 🎯 Type-Safe - Full TypeScript support with strict mode
• ♿ Accessible - Built with accessibility in mind
• 🌓 Theme Support - Light and dark mode support

📦 View on npm • 📖 Documentation • 💻 Source Code

A fully-featured showcase application demonstrating all capabilities of both libraries with live examples, code snippets, and interactive demos.

🎮 Live Demo • 💻 Source Code

# Install ngx-lift
npm install ngx-lift

# Install clr-lift (includes ngx-lift as peer dependency)
npm install clr-lift @clr/angular @cds/core ngx-lift

// ngx-lift - RxJS Operators
import {createAsyncState, poll} from 'ngx-lift';

// ngx-lift - Signal Utilities
import {injectParams, injectQueryParams, combineFrom} from 'ngx-lift';

// clr-lift - Components
import {AlertComponent, ToastService} from 'clr-lift';

Prerequisites:

• Node.js 22.x or higher
• npm 10.x or higher

# Clone the repository
git clone https://github.com/wghglory/ngx-lift-workspace.git
cd ngx-lift-workspace

# Install dependencies
npm install

# Start the demo application
npm start

The demo app will be available at http://localhost:4200.

ngx-lift-workspace/
├── apps/
│   └── demo/              # Demo application
├── libs/
│   ├── ngx-lift/          # ngx-lift library
│   └── clr-lift/          # clr-lift library
├── dist/                  # Build outputs
└── .github/workflows/     # CI/CD workflows

# Start demo app
npm start

# Build all projects
npm run build

# Build only libraries
npm run build:libs

# Build specific library
npm run build:ngx
npm run build:clr

# Watch mode for development
npm run watch:ngx
npm run watch:clr

# Run all tests
npm test

# Test specific library
npm run test:ngx
npm run test:clr

# Run tests with coverage
npm run test:coverage

# Lint all projects
npm run lint

# Lint and fix
npm run lint:fix

# Format code
npm run format

# Check formatting
npm run format:check

# View project graph
npm run graph

# Run affected tests
npm run affected:test

# Build affected projects
npm run affected:build

# Lint affected projects
npm run affected:lint

1. Go to Actions tab in GitHub
2. Select "Publish Libraries" workflow
3. Click "Run workflow"
4. Choose version type (major, minor, patch)

# Create and push a version tag
git tag v1.10.4
git push origin v1.10.4

# Version bump
npm run release:version

# Build and publish
npm run release:publish

# Publish ngx-lift only
npm run publish:ngx

# Publish clr-lift only
npm run publish:clr

# Publish both
npm run publish:all

Note: You need to be logged in to npm (npm login) and have publish permissions.

• Push to main branch triggers automatic deployment
• Pull requests get preview deployments

# Install Netlify CLI
npm install -g netlify-cli

# Build and deploy
npm run build:demo
netlify deploy --prod --dir=dist/apps/demo/browser

The netlify.toml file contains all deployment settings. Required secrets:

• NETLIFY_AUTH_TOKEN
• NETLIFY_SITE_ID

• Connected to GitHub repository
• Deploys on push to main

# Install Vercel CLI
npm install -g vercel

# Build and deploy
npm run build:demo
vercel --prod --cwd dist/apps/demo/browser

The vercel.json file contains deployment settings. Required secrets:

• VERCEL_TOKEN
• VERCEL_ORG_ID
• VERCEL_PROJECT_ID

• Runs on: Push to main/develop, Pull Requests
• Actions:
  • Lint affected projects
  • Test affected projects with coverage
  • Build affected projects
  • Upload coverage reports

• Runs on: Manual trigger, Git tags
• Actions:
  • Build libraries
  • Run tests
  • Publish to npm
  • Create GitHub release

• Runs on: Push to main, Manual trigger
• Actions:
  • Build libraries and demo app
  • Deploy to Netlify
  • Deploy to Vercel

NPM_TOKEN              # npm authentication token
NETLIFY_AUTH_TOKEN     # Netlify authentication token
NETLIFY_SITE_ID        # Netlify site ID
VERCEL_TOKEN           # Vercel authentication token
VERCEL_ORG_ID          # Vercel organization ID
VERCEL_PROJECT_ID      # Vercel project ID

This project uses Vitest with @analogjs/vitest-angular for testing.

# Run all tests
nx run-many -t test

# Run tests for a specific library
nx test ngx-lift
nx test clr-lift

# Run tests in watch mode
nx test ngx-lift --watch

# Run tests with coverage
nx test ngx-lift --coverage

# Run tests with UI
nx test ngx-lift --ui

Each library has its own vite.config.mts with test configuration. The test setup is in src/test-setup.ts.

• nx.json: Nx workspace configuration
• tsconfig.base.json: TypeScript base configuration with path mappings
• package.json: Dependencies and scripts
• netlify.toml: Netlify deployment configuration
• vercel.json: Vercel deployment configuration
• .github/workflows/: CI/CD workflows

# Install ngx-lift
npm install ngx-lift

# Install clr-lift (requires ngx-lift)
npm install clr-lift ngx-lift @clr/angular

// Import from ngx-lift
import {createAsyncState, poll} from 'ngx-lift';

// Import from clr-lift
import {AlertComponent, ToastService} from 'clr-lift';

We welcome contributions! Whether you're fixing bugs, adding features, or improving documentation, your help makes this project better.

1. Fork the repository and clone it locally
2. Create a feature branch (git checkout -b feature/amazing-feature)
3. Make your changes following our coding standards
4. Write/update tests to ensure your changes work correctly
5. Commit your changes using Conventional Commits
6. Push to your fork (git push origin feature/amazing-feature)
7. Open a Pull Request with a clear description

This project follows Conventional Commits:

• feat: New features
• fix: Bug fixes
• docs: Documentation changes
• style: Code style changes (formatting, etc.)
• refactor: Code refactoring
• test: Test changes
• chore: Build process or auxiliary tool changes
• perf: Performance improvements
• ci: CI/CD changes

• ✅ All code must pass ESLint and TypeScript strict mode
• ✅ Tests are required for new features (60%+ coverage minimum)
• ✅ JSDoc comments required for all exported APIs
• ✅ Follow Angular 20 best practices (signals, standalone components, OnPush)
• ✅ Use Clarity Design System components where applicable

See CONTRIBUTING.md for detailed guidelines.

This project is licensed under the MIT License - see the LICENSE file for details.

• 🏠 Homepage: ngx-lift.netlify.app
• 📦 npm (ngx-lift): npmjs.com/package/ngx-lift
• 📦 npm (clr-lift): npmjs.com/package/clr-lift
• 🐛 Issues: GitHub Issues
• 💬 Discussions: GitHub Discussions
• 📝 Changelog: CHANGELOG.md

• 🐛 Found a bug? Open an issue
• 💡 Have a feature request? Request a feature
• ❓ Have a question? Start a discussion

If this project helped you, please consider giving it a ⭐ on GitHub!