---

Magary is an Angular UI library and documentation workspace built for teams that care about consistency, maintainability, release discipline, and delivery quality. The repository includes the published ng-magary package, the public demo/documentation app, and the validation tooling used to keep the library stable.

At a glance

Area	Purpose
projects/ng-magary	Published Angular UI library distributed on npm as ng-magary
projects/demo-app	Documentation and live demos used for product review, QA, and accessibility verification
e2e/playwright	Visual and accessibility smoke coverage for critical flows
tools/ci	Contract, compatibility, compliance, and quality-gate tooling
docs	Supporting guidance, recipes, and release-facing documentation

Why Magary

• Standalone-first API designed for modern Angular applications.
• Curated public root API with stable naming and explicit exports.
• Components shaped for real dashboards, product surfaces, and internal tools.
• Documentation, smoke tests, accessibility checks, and release governance in the same workspace.
• Consumer compatibility checks across Angular 17 through 21.

Quick path

pnpm install
pnpm run build
pnpm run qa:all

Expected outcome:

• the library builds
• the demo app builds
• unit, visual smoke, and accessibility smoke gates pass

Daily commands

Command	What it does
pnpm run build:lib	Build the published ng-magary package
pnpm run build:demo	Build the documentation and demo application
pnpm run lint	Lint TypeScript and Angular templates
pnpm run test:unit	Run all Angular unit tests
pnpm run test:unit:ci	Run the CI unit gate with warning checks
pnpm run test:visual:smoke	Run Playwright smoke coverage for key UI flows
pnpm run test:a11y:smoke	Run Playwright + AXE accessibility smoke coverage
pnpm run check:consumer-matrix	Validate compatibility against Angular 17-21 consumer apps
pnpm run qa:all	Run the full local release gate

Quality model

Magary is maintained with explicit release controls rather than informal best effort.

Gate	Intent
API contract	Prevent accidental public API drift
No-any check	Keep library and spec surfaces type-safe
Third-party compliance	Validate notices and license inventory
Unit tests	Protect component behavior and contracts
Visual smoke	Catch critical UX regressions quickly
A11y smoke	Catch serious and critical accessibility regressions
Consumer matrix	Validate real install/build scenarios across Angular majors

For library consumers

If you want to install and use the package in an Angular application, start here:

• npm package README: projects/ng-magary/README.md
• public docs and demos: magary.pages.dev

The package README is copied into dist/ng-magary during publish and becomes the README shown on npm.

Release-facing docs

• CHANGELOG.md
• docs/MIGRATION_COMPATIBILITY.md
• docs/RELEASE_WORKFLOW.md
• docs/SEMVER_POLICY.md

Compliance and third-party notices

License copies and attribution records live here:

• THIRD_PARTY_NOTICES.md
• third_party/licenses/

Validation command:

pnpm run check:third-party

Tooltip stylesheet requirement

Components such as magaryTooltip render overlays at document.body level to escape stacking contexts. Consumers must load the shared tooltip stylesheet in their global styles:

@use 'ng-magary/styles/tooltip.scss';

---

Built for Angular teams shipping real products.