ngPeach

This package is written to integrate the $peach service library with Angular. The package is written in ES6 compiled into ES5 via Webpack with Babel.

ngPeach Module

This is the primary package that exposes the $peach providers.

ngPeach.ui Module

This module can be used in place of ngPeach and exposes Angular UI enhancements, such as our standard toolbar and sidenav directives.

You will likely want to use this module in place of standard ngPeach unless you're writing a UI completely custom.

API Interceptor

The included interceptor will handle 401 redirects back to login.

To include the interceptor, you must manually opt in by modifying your config block with:

$httpProvider.interceptors.push('peachInterceptorAPI');

Directives

App-Launcher

The App Launcher can be used by included 'peach-app-launcher' as either an element or attribute. It will replace the item it is attached to. The app-launcher will accept an object into the property peachApp. From there, it will render out the icon and handle a user attempting to launch an app.

Apps-Menu

The Apps Menu is used when a user has a smaller screen and the App Launcher's in the toolbar need a place to overflow. If a single app overflows, all apps will show in the Apps Menu.

Page-Header

The Page Header is used to construct a common menu of appearance and functionality. It uses a series of child directives to build itself.

Page-Header-Left

The Page Header Left directive is used as a child of Page Header to group all objects within it and keep them floating to the left.

Page-Header-Right

The Page Header Left directive is used as a child of Page Header to group all objects within it and keep them floating to the right.

Page-Header-Link

The Page Header link directive is used as a child of Page Header to ensure that links are built with the proper syntax.

Locations Autocomplete

The Locations Autocomplete directive provides a locations multiselect with chips. Locations are provided through the ng-model attribute. Listening to changes can be done through the ng-change attribute. The directive initializes in an asychronous manner, a listener can be attached to on-ready to be notified once it is ready.

Date Range

The Date Range directive provides date inputs with a combo containing preset values such as 'Yesterday', 'Last Weeek' etc.

ngTable

This HTML template is built into ngPeach.ui in order to get a Peach built pagination system for the popular ngTable plugin.

Sidenav

The Sidenav is an extension of the ngMaterial sidenav, customized to populate itself based off of account and app settings. You can use it as either an element or attribute by including 'peach-sidenav'. It will replace the item it is attached to.

Toolbar

The Toolbar builds upon the ngMaterial toolbar, and builds itself with user info. It will also control the sidenav, so there is a dependency to use peach-sidenav or md-sidenav. It will also populate the app toolbar with the app-launcher directive.

Usermenu

The Usermenu is a dropdown style menu with the users most basic functions, as well as the ability to view their most recent alerts.

Dependencies

ngPeach has been written to supplement existing libraries.

You must include these libraries in your Peach-App in order for ngPeach to work. They have been left out on purpose in order to allow for CDN and other optimization tools. These libraries will come pre-loaded as a dependency with the Peach-App scaffold, so do not remove them!

Commands