ghetolay

export interface Action<T> {
	type: T;
}

export interface PayloadAction<T, R> {
	readonly type: T;
	payload: R;
}

export interface ActionFactory<T> {

ghetolay

##feature

1. @Until() : less restrictive @Host()
2. ngStyle allows array as value so we can do 'padding.px': [10 20]
3. Define pure function inside component to act like local Pipe. avoid the hassle to create Pipe when it's non-reusable/component specific.
4. Typings of RendererV2.listen() should be false | void done => boolean | void
5. Provide non-singleton service on modules (maybe breaking the design and purpose of injection). when we want service tied to component we need to provide it inside @Component({ providers: )} This is a bit boilerplate and error prone because if you inject the service and forget to provide it on your component you may get one of the parent's instance. Would be good to add the possibility to define per-component service at module which will create a new instance for each injection (not meant to be shared with children or else). Current need if for extending component so if something comes up in the meantime it won't be needed
6. Define which controls aff

ghetolay

/*
  This function allows you to create singleton service that'll stay singleton throughout all the app.
  Even(especially) if you use lazy module.
  This covers that problem : https://angular.io/docs/ts/latest/guide/ngmodule.html#!#why-_userservice_-isn-t-shared

  Idea isn't mine, it's how they handle it on Angular Material. I'm just creating an helper function for it.

  Basically we create a factory provider instead of a plain class provider and inject the service into the factory function.
  If the service is present it means it has already been instantiated somewhere in the injector tree and we can return it.
  If injection fails and service is nulll this means we are the first provider so we can instantiate and return the service.

ghetolay

//Example of a custom decorator
import { forwardRef } from '@angular/core';
import { NG_VALUE_ACCESSOR } from '@angular/forms';

import { ExtendsComponent, ExtendsComponentMetadata } from './extendscomponent';

export var DatePicker = function( metadata: ExtendsComponentMetadata ): (cls: any) => any {

  return (target: Function) => {
    metadata.providers = metadata.providers || [];

ghetolay

/* http://codepen.io/Ghetolay/pen/PNLKpO */
.container{
  position: relative;
  z-index: 0;
}

$borderSize: 2px;
/* 1px bigger only needed when sizes are float */
$coverBorderSize: $borderSize + 1px;
$bgColor: #f1f1f1;