open-index/open-npm huggingface dataset:
npm package: @jaspero/ng-select
Description: [![Build Status](https://travis-ci.org/Jaspero/ng-select.svg?branch=master)](https://travis-ci.org/jaspero/ng-select) [![NPM Version](https://img.shields.io/npm/v/@jaspero/ng-select.svg)](https://www.npmjs.com/package/@jaspero/ng-select) # NG2 Select A
Author: Jaspero co.
Latest version: 0.2.0

[![Build Status](https://travis-ci.org/Jaspero/ng-select.svg?branch=master)](https://travis-ci.org/jaspero/ng-select)
[![NPM Version](https://img.shields.io/npm/v/@jaspero/ng-select.svg)](https://www.npmjs.com/package/@jaspero/ng-select)
# NG2 Select
A select library for Angular, with single and multiple functionality.
```
npm install --save @jaspero/ng-select
```
A demo can be found [here](https://jaspero.co/resources/projects/ng-select)

## Setup
Import `JasperoSelectModule` in your `@NgModule`:

```ts
@NgModule({
    imports: [
        JasperoSelectModule
    ],
    declarations: [AppComponent],
    bootstrap: [AppComponent]
})
export class AppModule {}
```

## How To Use
To use the library simply add the component in your templates:
```typescript
<jaspero-select></jaspero-select>
```

## Options

You can pass the following inputs to the component:

|Name|Type|Description|Default|
|---|---|---|---|
|options|An array of options for the select dropdown|any[]|[]|
|key|The key from the options object to be used as the name of the option|string|name|
|multi|Should more options be selectable at once|boolean|false|

This component also support template driven and reactive forms.
npm package: @jaspero/ng-tabs
Description: [![Build Status](https://travis-ci.org/Jaspero/ng-tabs.svg?branch=master)](https://travis-ci.org/jaspero/ng-tabs) [![NPM Version](https://img.shields.io/npm/v/@jaspero/ng-tabs.svg)](https://www.npmjs.com/package/@jaspero/ng-tabs)
Author: Jaspero co.
Latest version: 0.0.4

[![Build Status](https://travis-ci.org/Jaspero/ng-tabs.svg?branch=master)](https://travis-ci.org/jaspero/ng-tabs)
[![NPM Version](https://img.shields.io/npm/v/@jaspero/ng-tabs.svg)](https://www.npmjs.com/package/@jaspero/ng-tabs)

# NG Tabs
An easy tabs implementation for Angular.

A demo can be found [here](https://jaspero.co/resources/projects/ng-tabs)

## Installation

To install this library, run:

```bash
$ npm install --save @jaspero/ng-tabs
```

## Setup
Import `JasperoTabsModule` in your `@NgModule`:

```ts
@NgModule({
    imports: [
        JasperoTabsModule
    ],
    declarations: [AppComponent],
    bootstrap: [AppComponent]
})
export class AppModule {}
```

Then create the component in a root component (you can create it anywhere but you can only use it in that component on any lower ones).

## How To Use
You can use any of a following will approaches:
```html
<jaspero-tabs>
  <jaspero-tab [tabTitle]="templateRef">Content 1</jaspero-tab>
  <jaspero-tab [tabTitle]="'<p>example 2</p>'">Content 2</jaspero-tab>
  <jaspero-tab tabTitle="example 3">Content 3</jaspero-tab>
</jaspero-tabs>
<ng-template #templateRef>
  <p>This is an example</p>
</ng-template>
```
### Options

Available inputs: 

```typescript
tabTitle: string | TemplateRef<any> = 'Tab'; // default value is 'Tab'
active: boolean // defaults to the first if no tabs are active
disabled: boolean // default value is false. Prevents tab from being toggled
```

**Note:**

The `tabTitle` input can be a string or a TemplateRef.

### FAQ

**Does this library support AoT?**

Yes AoT is supported. 

## Development

To generate all `*.js`, `*.d.ts` and `*.metadata.json` files:

```bash
$ npm run build
```

To lint all `*.ts` files:

```bash
$ npm run lint
```

## License

MIT © [Jaspero co.](mailto:info@jaspero.co)
npm package: @jaspero/ng2-alerts
Description: An easy to use alert library for Angular 2
Author: Jaspero co.
Latest version: 0.0.7
Deprecated: WARNING: This project has been renamed to NG-Alerts. Install using @jaspero/ng-alerts instead.

[![Build Status](https://travis-ci.org/Jaspero/ng2-alerts.svg?branch=master)](https://travis-ci.org/jaspero/ng2-alerts)
[![NPM Version](https://img.shields.io/npm/v/@jaspero/ng2-alerts.svg)](https://www.npmjs.com/package/@jaspero/ng2-alerts)
# NG2 Alerts
An easy to use alert library for Angular 2.

```
npm install --save @jaspero/ng2-alerts
```

A demo can be found [here](http://open-source.jaspero.co/ng/ng-alerts)


## Setup
Import `JasperoAlertsModule` in your `@NgModule`: 

```ts
@NgModule({
    imports: [
        JasperoAlertsModule
    ],
    declarations: [AppComponent],
    bootstrap: [AppComponent]
})
export class AppModule {}
```

Then create the component in a root component (you can create it anywhere but you can only use it in that component on any lower ones).

```html
<jaspero-alerts [defaultSettings]="options"></jaspero-alerts>
```

## How To Use 
You need to import the `AlertsService` in your component:
 
```typescript
constructor(private _alert: AlertsService) {}
```

Then use the `create(type: 'success' | 'error' | 'wearning', 'info', message: string, settings: AlertSettings)` method to initiate an alert.

```typescript
open(type: AlertType) {
    this._alert.create(type, 'This is a message');
}
```

## Options

Available settings: 

```typescript
export interface AlertSettings {
    overlay?: boolean;
    overlayClickToClose?: boolean;
    showCloseButton?: boolean;
    duration?: number;
}
```

You can provide the settings as input to the `<jaspero-alerts></jaspero-alerts>` component.
Making the settings default for each created alert. However you can also override the settings by
passing them in the `create()` method.
npm package: @jaspero/ng2-chips
Description: A chip library for Angular 2
Author: Jaspero co.
Latest version: 0.0.5
Deprecated: WARNING: This project has been renamed to ng-chips. Install using @jaspero/ng-chips.

[![Build Status](https://travis-ci.org/Jaspero/ng2-chips.svg?branch=master)](https://travis-ci.org/jaspero/ng2-chips)
[![NPM Version](https://img.shields.io/npm/v/@jaspero/ng2-chips.svg)](https://www.npmjs.com/package/@jaspero/ng2-chips)
# NG2 Chips
A chip library for Angular 2

```
npm install --save @jaspero/ng2-chips
```

A demo can be found [here.](http://open-source.jaspero.co/ng/ng-chips)

## Setup
Import `JasperoChipsModule` in your `@NgModule`:

```ts
@NgModule({
    imports: [
        JasperoChipsModule
    ],
    declarations: [AppComponent],
    bootstrap: [AppComponent]
})
export class AppModule {}
```

## How To Use 
To use the library simply add the component in your templates:
```typescript
<jaspero-chips></jaspero-chips>
```

## Options

You can pass the following inputs to the component:

|Name|Type|Description|Default|
|---|---|---|---|
|type|Type of the chip input.|text,number,password,date|text|
|duplicates|Should adding duplicates be allowed.|boolean|false|

This component also support Angular 2 template driven and reactive forms.
npm package: @jaspero/ng2-confirmations
Description: A confirmation library for Angular 2
Author: Jaspero co.
Latest version: 0.3.3
Deprecated: WARNING: This project has been renamed to  ng-confirmations. Install using @jaspero/ng-confirmations instead.

[![Build Status](https://travis-ci.org/Jaspero/ng2-confirmations.svg?branch=master)](https://travis-ci.org/jaspero/ng2-confirmations)
[![NPM Version](https://img.shields.io/npm/v/@jaspero/ng2-confirmations.svg)](https://www.npmjs.com/package/@jaspero/ng2-confirmations)
# NG2 Confirmations
An easy to use alert library for Angular 2.

```
npm install --save @jaspero/ng2-confirmations
```

A demo can be found [here](https://jaspero.co/resources/projects/ng-confirmations)

## Setup
Import `JasperoConfirmationsModule` in your `@NgModule`: 

```ts
@NgModule({
    imports: [
        JasperoConfirmationsModule
    ],
    declarations: [AppComponent],
    bootstrap: [AppComponent]
})
export class AppModule {}
```

Then create the component in a root component (you can create it anywhere but you can only use it in that component on any lower ones).

```html
<jaspero-confirmations [defaultSettings]="options"></jaspero-confirmations>
```


## How To Use 
You need to import the `ConfirmationService` in your component:
 
```typescript
constructor(private _confirmation: ConfirmationService) {}
```

Then use the `create(title: string, message: string, settings: ConfirmSettings)` method to initiate thr confirmation modal.

```typescript
open() {
    this._confirmation.create('Do something?', 'You should really just do it.')
        // The confirmation returns an Observable Subject which will notify you about the outcome
        .subscribe((ans: ResolveEmit) => console.log(ans))
}
```

### ResolveEmit

This is returned by the `create()` method.

```typescript
export interface ResolveEmit {
    // Returns this if modal resolved with yes or no
    resolved?: boolean;
    // If the modal was closed in some other way this is removed
    closedWithOutResolving?: string;
}
```

If the modal was closed by clicking on yes/no this is returned: 
```typescript
{resolved: true // false if no was pressed}
```

If the modal was closed in any other way:
 ```typescript
{closedWithOutResolving: 'overlayClick' // reason for closing}
```

### Options

Available settings: 

```typescript
export interface ConfirmSettings {
    overlay?: boolean; // Default: true
    overlayClickToClose?: boolean; // Default: true
    showCloseButton?: boolean; // Default: true
    confirmText?: string; // Default: 'Yes'
    declineText?: string; // Default: 'No'
}
```

You can provide the settings as input to the `<jaspero-confirmations></jaspero-confirmations>` component.
Making the settings default for each created alert. However you can also override the settings by
passing them in the `create()` method.

### FAQ

**Does this library support AoT?**

Yes AoT is supported. 

**Does the `defaultSettings` input need to be provided?**

No, if none was provided the defaults are used.
npm package: @jaspero/ng2-form-builder
Description: A decorator implementation for Angular 2 Reactive Forms
Author: Jaspero co.
Latest version: 0.0.9

[![Build Status](https://travis-ci.org/Jaspero/ng2-form-builder.svg?branch=master)](https://travis-ci.org/flauc/angular2-notifications)
[![NPM Version](https://img.shields.io/npm/v/@jaspero/ng2-form-builder.svg)](https://www.npmjs.com/package/@jaspero/ng2-form-builder)
# NG2 Form-Builder
This library provides a faster and cleaner way to use Angular 2 Reactive Forms through typescript decorators.

## Setup
Import `FormBuilderModule` in your `@NgModule` and you're good to go: 

```ts
@NgModule({
    imports: [
        FormBuilderModule
    ],
    declarations: [AppComponent],
    bootstrap: [AppComponent]
})
export class AppModule {}
```

## How to use
To use this library simply create a class and add `@JasperoBuilder.dec()` decorators to each property:
```ts
export class User {
    @JasperoBuilder.dec({initial: ''})
    username: string;
    @JasperoBuilder.dec({initial: ''})
    password: string;
}
```
The `dec()` method accepts the same arguments as `new FormControl()` does and creates the `FormControl` 
 in the background.
 
Then in your component create the `FormGroup` like this: 
 
```ts
export class AppComponent {
    constructor(private _jb: JasperoBuilder) {}
    
    userForm: any;

    ngOnInit() {
        // You can also instantiate the class with values
        this.useForm = this._jb.createForm(new User());
    }
}
```
npm package: @jaspero/ng2-select
Description: A select library for Angular 2, with both single and multiple functionality.
Author: Jaspero co.
Latest version: 0.1.2

[![Build Status](https://travis-ci.org/Jaspero/ng2-select.svg?branch=master)](https://travis-ci.org/jaspero/ng2-select)
[![NPM Version](https://img.shields.io/npm/v/@jaspero/ng2-select.svg)](https://www.npmjs.com/package/@jaspero/ng2-select)
# NG2 Select
A select library for Angular 2, with both single and multiple functionality.

```
npm install --save @jaspero/ng2-select
```

## Setup
Import `JasperoSelectModule` in your `@NgModule`:

```ts
@NgModule({
    imports: [
        JasperoSelectModule
    ],
    declarations: [AppComponent],
    bootstrap: [AppComponent]
})
export class AppModule {}
```

## How To Use
To use the library simply add the component in your templates:
```typescript
<jaspero-select></jaspero-select>
```

## Options

You can pass the following inputs to the component:

|Name|Type|Description|Default|
|---|---|---|---|
|options|An array of options for the select dropdown|any[]|[]|
|key|The key from the options object to be used as the name of the option|string|name|
|multi|Should more options be selectable at once|boolean|false|

This component also support Angular 2 template driven and reactive forms.
npm package: @jaspero/quick-remote
Description: Command line tool for quick set up of remotes
Author: Jaspero Ltd
Latest version: 1.0.0

[![semantic-release](https://img.shields.io/badge/%20%20%F0%9F%93%A6%F0%9F%9A%80-semantic--release-e10079.svg)](https://github.com/semantic-release/semantic-release)
[![NPM Version](https://img.shields.io/npm/v/@jaspero/quick-remote.svg)](https://www.npmjs.com/package/@jaspero/quick-remote)

# Quick Remote

Quickly clone a project and add a remote to it, pulling in source from a selected branch of the remote.
This is most useful for starting new projects. 

## Install

```
npm i -g @jaspero/quick-remote
```

## Example

```
qr r Jaspero/jms -p example
```

## Options

| Param | Description | Type | Default |
| ---- | ---- | ---- | ---- |
| p/project | Project to clone | string | - |
| n/name | Name for the created remote | string | defaults to repo url |
| b/branch | Branch from the remote to use | string | master |
| f/force | Adds --allow-unrelated-histories when merging remote | boolean | true |
npm package: @jaspero/utils
Description: Collection of Jaspero utils
Author: Jaspero Ltd
Latest version: 1.17.1

# Jaspero Utils

> Collection of useful utilities used by Jaspero Ltd

<img align="left" width="60" src="https://jaspero.co/assets/logo.svg">

This package encapsulates functions that are commonly used in Web development. The fundamental goal of this package is to improve development efficiency and code quality.
npm package: @jaspero/web-components
Description: A collection of web-components
Latest version: 1.204.2

[![npm version](https://badge.fury.io/js/@jaspero%2Fweb-components.svg)](https://badge.fury.io/js/@jaspero%2Fweb-components)

# @Jaspero/web-components

A collection of web components.

```
npm i --save-exact @jaspero/web-components
```

Visit our documentation site for more details.

[Documentation](https://jaspero.github.io/web-components/)