@megaphonenpm/mpng

mpng - Megaphone TV Angular UI Library

mpng is an internal Angular UI Library developed for Megaphone TV projects. Built with Angular 17+, it encompasses a curated set of components, directives, pipes, and services designed to streamline the development of user interfaces across our web applications. By leveraging Angular Material components, mpng ensures a consistent and modern user experience.

What's Inside?

mpng offers a variety of UI elements and utilities:

• Components: From user input elements like CopyButtonComponent and SearchBarComponent to display components like ToastComponent and LoadingScreenComponent, mpng provides a wide range of UI elements.
• Pipes: Utilities for sorting, formatting, and filtering data, including AlphabeticalSortPipe and FormatBytesPipe.
• Directives: Enhance your templates with functionalities like drag-and-drop and text validation.
• Services: Simplify common tasks like API communication, configuration management, and data storage with services like ConfigService and ApiService.

Getting Started

Prerequisites

Ensure you have Angular 17+ installed in your project. mpng is built to work seamlessly with the latest versions of Angular.

Installation

• To include mpng in your project, install it via npm:

  npm install @megaphonenpm/mpng
  

Demo

Explore the capabilities of mpng and see our components in action on our demo site.

Publishing to NPM

• Change directory to /projects/mpng:

  cd /projects/mpng
  

• Run the npm version command. You can specify major, minor, or patch as per your requirement:

  npm version <major|minor|patch>
  

• Commit your changes and push them to the repository:

  git commit -am "VersionNumber"
  git push
  

• Tag your repository. Replace <tagname> with your desired tag:

  git tag <tagname>
  

• Run the build-mpng command:

  npm run build-mpng
  

• Change directory to /dist/mpng:

  cd /dist/mpng
  

• Publish your package to npm:

  npm publish