Nylon Pendulum Movement

    io-types
    TypeScript icon, indicating that this package has built-in type declarations

    1.0.0-alpha.1 • Public • Published

    io-types for Angular 2 Components

    Run Time Type Checking for Inputs/Outputs

    Please note that io-types is currently proof-of-concept.

    Like React's propTypes, io-types let you describe expected input and output for your Angular 2 components. Assertions are run in development mode letting you easily catch bad bindings.

    To use, install the dependency using npm:

    npm install io-types

    Then write assertions for your component's inputs:

    import {Compnent, Input} from 'angular2/core';
    import {CheckInput, check} from 'io-types';
     
    @Component({
      selector: 'my-component',
      template: `...`
    })
    class MyComponent{
      @Input() @CheckInput(check.isBoolean) active;
    }

    Now passing non-boolean values to active results in an error. For example:

    <my-component [active]="123"></my-component>

    Would throw:

    Invalid value for 'MyComponent.active':
    ↳ Expected '123' to be of type 'boolean'
    

    Similarly, you can use the same assertions to check function arguments. This helps you make assertions about event handler callbacks:

    import {Component} from 'angular2/core';
    import {CheckArgs, check} from 'io-types';
     
    @Component({
      selector: 'my-component',
      template: `
        <input (change)="handleChange($event.value)">
      `
    })
    class MyComponent{
      @CheckArgs(check.isString) handleChange(value: string){ }
    }

    To Do

    Right now io-types is basically a proof-of-concept. Future iterations may include an API similar to React's propTypes in addition to using Reflection for simple assertions.

    Keywords

    none

    Install

    npm i io-types

    DownloadsWeekly Downloads

    1

    Version

    1.0.0-alpha.1

    License

    ISC

    Last publish

    Collaborators

    • mikeryan52