npm package discovery and stats viewer.

Discover Tips

  • General search

    [free text search, go nuts!]

  • Package details

    pkg:[package-name]

  • User packages

    @[username]

Sponsor

Optimize Toolset

I’ve always been into building performant and accessible sites, but lately I’ve been taking it extremely seriously. So much so that I’ve been building a tool to help me optimize and monitor the sites that I build to make sure that I’m making an attempt to offer the best experience to those who visit them. If you’re into performant, accessible and SEO friendly sites, you might like it too! You can check it out at Optimize Toolset.

About

Hi, 👋, I’m Ryan Hefner  and I built this site for me, and you! The goal of this site was to provide an easy way for me to check the stats on my npm packages, both for prioritizing issues and updates, and to give me a little kick in the pants to keep up on stuff.

As I was building it, I realized that I was actually using the tool to build the tool, and figured I might as well put this out there and hopefully others will find it to be a fast and useful way to search and browse npm packages as I have.

If you’re interested in other things I’m working on, follow me on Twitter or check out the open source projects I’ve been publishing on GitHub.

I am also working on a Twitter bot for this site to tweet the most popular, newest, random packages from npm. Please follow that account now and it will start sending out packages soon–ish.

Open Software & Tools

This site wouldn’t be possible without the immense generosity and tireless efforts from the people who make contributions to the world and share their work via open source initiatives. Thank you 🙏

© 2024 – Pkg Stats / Ryan Hefner

manageiq-ui-components

v0.0.16

Published

UI components for ManageIQ project

Downloads

6

Readme

Angular UI Components for ManageIQ

score dependencies bitHound Dev Dependencies Known Vulnerabilities Build Status Coverage Status

Chat

Purpose

The purpose of this repository is to provide reusable components for the ManageIQ project. These are not general purpose components, but specific to ManageIQ, however, reusable across all of ManageIQ (providers). The intention is to provide components that are reusable in various ways. Many of these components are 'Smart Components' that know how to communicate to backend endpoints(data-driven by provider) and retrieve relevant data for the component's configuration.

As we achieve greater reuse, the idea is to move more and more components to this repository. Creating a repository for smart reusable components (specific to a domain) across providers.

Architectural Goals

  • Separate git repository from ManageIQ
  • Components communicate via REST with ManageIQ API
  • Maintain routing inside ManageIQ (routes.rb)

Technologies

  • Angular 1.5+ (soon to be Angular 2.x)
  • Typescript
  • Webpack
  • Yarn

Architecture

ManageIQ UI Components Architecture

Angular 1.5 Components

We are recommending Angular 1.5 Components instead of Angular Directives for better compatibility and easier upgrade to Angular 2.0.

For a great overview of using Angular 1.5.x Components please see: NG-Conf 2016: Components, Components, Components!...and Angular 1.5 - Pete Bacon Darwin

Development Environment

You need to have installed Node.js >= 6 and npm >= 3 on your system. It is recommended to use a node version manager such as n. If you have node installed then it is just yarn global add n and then n lts to use the latest LTS version of node (see the doces for switching versions).

Install these node packages globally in the system

npm install -g yarn
yarn global add webpack wiredep-cli typescript typescript-formatter

After yarn is installed, it is pretty much a replacement for npm, with faster, more dependable builds but still utilizing the npm packages.

See comparison: npm vs. yarn commands

Install local node dependencies

yarn

Create library dependencies (run this every time you make any changes to vendor.ts) - no need to worry about any TS errors. Also, if you are pushing some changes please run this command so you will push minifed version of JS and CSS.

yarn run build

To run:

yarn start

To run tests:

yarn run tests

Before submitting code, run the following command to format the code according to the tslint rules:

tsmft -r

This formats the code according to the tslint rules.

Documentation

If you want to see documentation for each component, controller, filter, etc. run

yarn run-script build-docs

This will generate docs from JS docs and after running yarn start this documentation will be available on localhost:4000/docs