diff --git a/.editorconfig b/.editorconfig
index f699a73..857d858 100644
--- a/.editorconfig
+++ b/.editorconfig
@@ -1,6 +1,7 @@
 *
 indent_style = space
 indent_size = 2
+trim_trailing_whitespace = true
 
 [*.{ts,tsx}]
 quote_type = single
diff --git a/demo/demos/AllDemo.tsx b/demo/demos/AllDemo.tsx
index 6947bfd..bec6fa2 100644
--- a/demo/demos/AllDemo.tsx
+++ b/demo/demos/AllDemo.tsx
@@ -1,10 +1,10 @@
 import * as React from 'react';
 import { withState } from '../../src/lib/withState';
-import { all } from '../../src/ChainableComponent';
+import { ChainableComponent } from '../../src/ChainableComponent';
 import Step from '../Step';
 
-export const WithStateDemo =
-  all([
+export const AllDemo =
+  ChainableComponent.all([
     withState({initial: 'string value'}),
     withState({initial: 1}),
     withState({initial: 2}),
@@ -12,7 +12,7 @@ export const WithStateDemo =
     withState({initial: 5}),
     withState({initial: 8})
   ])
-  .ap(([a, b, c, d, e, f]) => (
+  .render(([a, b, c, d, e, f]) => (
     <div>
       {/* a.value is inferred as a string */}
       <div>a: {a.value} <button onClick={() => a.update(a.value + 1)}>+</button></div>
@@ -27,11 +27,11 @@ export const WithStateDemo =
   ));
 
 export default () => (
-  <Step title="withState Demo">
+  <Step title="all Demo">
     <pre className='code-sample'>
-      {`import { withState, all } from 'chainable-components';
+      {`import { withState, ChainableComponent } from 'chainable-components';
 
-all([
+ChainableComponent.all([
   withState({initial: 'string value'}),
   withState({initial: 1}),
   withState({initial: 2}),
@@ -39,7 +39,7 @@ all([
   withState({initial: 5}),
   withState({initial: 8})
 ])
-.ap(([a, b, c, d, e, f]) => (
+.render(([a, b, c, d, e, f]) => (
   <div>
     {/* a.value is inferred as a string */}
     <div>a: {a.value} <button onClick={() => a.update(a.value + 1)}>+</button></div>
@@ -53,8 +53,6 @@ all([
   </div>
 ));`}
     </pre>
-    {WithStateDemo}
+    {AllDemo}
   </Step>
 );
-  
-
diff --git a/demo/demos/ContextDemo.tsx b/demo/demos/ContextDemo.tsx
index cba90f2..eaa46af 100644
--- a/demo/demos/ContextDemo.tsx
+++ b/demo/demos/ContextDemo.tsx
@@ -7,7 +7,7 @@ const { Consumer, Provider } = React.createContext("Default Value");
 const withContext = fromRenderProp(Consumer);
 
 const DisplayContext =
-  withContext({ children: () => 'hmm, this should be necessary' }).ap(
+  withContext({ children: () => 'hmm, this should be necessary' }).render(
     context => {
       return (
         <span>
@@ -35,7 +35,7 @@ const { Consumer, Provider } = React.createContext("Default Value");
 const withStringContext = fromRenderProp(Consumer);
 
 const DisplayContext =
-withStringContext({ children: a => '' }).ap(
+withStringContext({ children: a => '' }).render(
   context => {
     return (
       <span>
diff --git a/demo/demos/DoDemo.tsx b/demo/demos/DoDemo.tsx
deleted file mode 100644
index cfec38b..0000000
--- a/demo/demos/DoDemo.tsx
+++ /dev/null
@@ -1,31 +0,0 @@
-import * as React from 'react';
-import { withState } from '../../src/lib/withState';
-import { all, Do, ChainableComponent } from '../../src/ChainableComponent';
-import Step from '../Step';
-
-export const DoDemo = () =>
-  Do(function*() {
-    const a = yield withState({initial: 'string value'});
-    const b = yield withState({initial: 8432});
-    return [a, b];
-  })
-  .ap(([a, b]) => (
-    <div>
-      {/* a.value is inferred as a string */}
-      <div>a: {a.value} <button onClick={() => a.update(a.value + 1)}>+</button></div>
-      
-      {/* b.value through f.value is inferred as a number */}
-      <div>b: {b.value} <button onClick={() => b.update(b.value + 1)}>+</button></div>
-    </div>
-  ));
-
-export default () => (
-  <Step title="Do Demo">
-    <pre className='code-sample'>
-      {`import { withState, all } from 'chainable-components';`}
-    </pre>
-    <DoDemo />
-  </Step>
-);
-  
-
diff --git a/demo/demos/FromApDemo.tsx b/demo/demos/FromRenderDemo.tsx
similarity index 50%
rename from demo/demos/FromApDemo.tsx
rename to demo/demos/FromRenderDemo.tsx
index ea3d26c..f9fabdc 100644
--- a/demo/demos/FromApDemo.tsx
+++ b/demo/demos/FromRenderDemo.tsx
@@ -1,25 +1,24 @@
 import * as React from 'react';
-import { withState } from '../../src/lib/withState';
-import { all, fromAp } from '../../src/ChainableComponent';
+import { fromRender } from '../../src/ChainableComponent';
 import Step from '../Step';
 
-export const WithStateDemo =
-  fromAp((ap: (a: number) => React.ReactNode) => (
-    function() {
+export const FromRenderDemo =
+  fromRender((ap: (a: number) => React.ReactNode) => (
+    function () {
       return <div>Applied: {ap(5)}</div>
     }
   ))
-  .ap(a => (
-    <div>wait, wuuuut: {a}</div>
-  ));
+    .render(a => (
+      <div>test: {a}</div>
+    ));
 
 export default () => (
   <Step title="FromAp Demo">
     <pre className='code-sample'>
       {`import { withState, all } from 'chainable-components';`}
     </pre>
-    {WithStateDemo}
+    {FromRenderDemo}
   </Step>
 );
-  
+
 
diff --git a/demo/demos/ReactRouterDemo.tsx b/demo/demos/ReactRouterDemo.tsx
index fb6a7c3..2893f76 100644
--- a/demo/demos/ReactRouterDemo.tsx
+++ b/demo/demos/ReactRouterDemo.tsx
@@ -15,7 +15,7 @@ const ReactRouterDemoInner: React.SFC = () => (
       {`import { Route } from 'react-router';
 const withRoute = fromRenderProp(Route);
 
-withRoute({}).ap(
+withRoute({}).render(
   route => {
     return (
       <span>
@@ -27,7 +27,7 @@ withRoute({}).ap(
 )`}
     </pre>
     <Router history={customHistory}>
-      {withRoute({}).ap(
+      {withRoute({}).render(
         route => {
           return (
             <span>
diff --git a/demo/demos/WithStateDemo.tsx b/demo/demos/WithStateDemo.tsx
index 5b05b36..5183407 100644
--- a/demo/demos/WithStateDemo.tsx
+++ b/demo/demos/WithStateDemo.tsx
@@ -1,14 +1,13 @@
 import * as React from 'react';
 import { withState } from '../../src/lib/withState';
 import Step from '../Step';
-// import { all } from '../src/ChainableComponent';
 
 export const WithStateDemo =
   withState({ initial: 0 }).chain(outer =>
     withState({ initial: 16 }).map(inner =>
       ({ inner, outer })
     )
-  ).ap(({ inner, outer }) => (
+  ).render(({ inner, outer }) => (
       <div>
         <div>Outer: {outer.value} <button onClick={() => outer.update(outer.value + 1)}>+</button></div>
         <div>Inner: {inner.value} <button onClick={() => inner.update(inner.value + 1)}>+</button></div>
@@ -25,7 +24,7 @@ withState({initial: 0}).chain(outer =>
     ({inner, outer})
   )
 )
-.ap(({inner, outer}) => (
+.render(({inner, outer}) => (
   <div>
     <div>Outer: {outer.value} <button onClick={() => outer.update(outer.value + 1)}>+</button></div>
     <div>Inner: {inner.value} <button onClick={() => inner.update(inner.value + 1)}>+</button></div>
@@ -35,14 +34,4 @@ withState({initial: 0}).chain(outer =>
     {WithStateDemo}
   </Step>
 );
-  //   all([
-  //     withState({initial: 'yo'}),
-  //     withState({initial: 16})
-  //   ])
-  // .ap(([outer, inner]) => (
-  //   <div>
-  //     <div>Outer: {outer.value} <button onClick={() => outer.update(outer.value + 1)}></button></div>
-  //     <div>Inner: {inner.value} <button onClick={() => inner.update(inner.value + 1)}></button></div>
-  //   </div>
-  // ));
 
diff --git a/package.json b/package.json
index 6f5af24..9c5fe5b 100644
--- a/package.json
+++ b/package.json
@@ -11,6 +11,8 @@
     "url": "https://paulgray.net/"
   },
   "scripts": {
+    "lint": "tslint --project tsconfig-build.json",
+    "lint-fix": "tslint --project tsconfig-build.json --fix",
     "build": "npm-run-all clean build:ts",
     "build:ts": "tsc -p tsconfig-build.json",
     "bundle": "rm -rf docs/ && webpack --config webpack/bundle.ts",
diff --git a/src/ChainableComponent.ts b/src/ChainableComponent.ts
index ebf3df7..a614ac0 100644
--- a/src/ChainableComponent.ts
+++ b/src/ChainableComponent.ts
@@ -1,21 +1,19 @@
 import { createFactory, ReactNode } from 'react';
 
-// export type ComponentLike<P = {}> = React.ComponentClass<P, any> | React.StatelessComponent<P>;
-
 /**
  * A composable wrapper around React effects.
- * 
+ *
  */
 export type ChainableComponent<A> = {
 
   /**
    * Renders this chainable into a ReactNode, which can be embedded inside the render
    * method of another component.
-   * @param f A function which is used to render the contextual value. 
+   * @param f A function which is used to render the contextual value.
    *          This method returns another ReactNode, possibly wrapped with
    *          additional functionality.
    */
-  ap(f: (a: A) => ReactNode): ReactNode;
+  render(f: (a: A) => ReactNode): ReactNode;
 
   /**
    * Converts the value inside this Chainable Component.
@@ -24,6 +22,12 @@ export type ChainableComponent<A> = {
    */
   map<B>(f: (a: A) => B): ChainableComponent<B>;
 
+  /**
+   * Converts the value inside this Chainable Component.
+   * @param c Apply the function inside of c to the value inside of this Chainable Component
+   */
+  ap<B>(c: ChainableComponent<(a: A) => B>): ChainableComponent<B>;
+
   /**
    * Composes or 'chains' another Chainable Component along with this one.
    * @param f A function which is provided the contextual value, and returns a chainable component
@@ -38,7 +42,7 @@ export type ChainableComponent<A> = {
  * @type A represents the type of the contextual value of the Render Props component.
  */
 export type RenderPropsProps<P, A> = P & {
-  children: (a: A) => ReactNode
+  children: (a: A) => ReactNode,
 };
 
 /**
@@ -54,11 +58,11 @@ export type RenderPropsComponent<P, A> = React.ComponentType<RenderPropsProps<P,
 type Applied<A> = (f: (a: A) => ReactNode) => ReactNode;
 
 export function fromRenderProp<P extends object, A>(Inner: RenderPropsComponent<P, A>): (p: P) => ChainableComponent<A> {
-  return p => fromAp(f => {
+  return p => fromRender(f => {
     const apply = createFactory<RenderPropsProps<P, A>>(Inner as any);
     return apply({
       ...(p as any), // todo: we have any until https://github.com/Microsoft/TypeScript/pull/13288 is merged
-      children: f
+      children: f,
     });
   });
 }
@@ -70,64 +74,68 @@ export function fromRenderProp<P extends object, A>(Inner: RenderPropsComponent<
  */
 export function fromNonStandardRenderProp<P extends object, A>(
   renderMethod: string,
-  Inner: React.ComponentClass<P & {[render: string]: (a:A) => ReactNode}>
+  Inner: React.ComponentClass<P & { [render: string]: (a: A) => ReactNode }>,
 ): (p: P) => ChainableComponent<A> {
-  return p => fromAp(f => {
-    const apply = createFactory<P & {[renderMethod: string]: (a:A) => ReactNode}>(Inner);
+  return p => fromRender(f => {
+    const apply = createFactory<P & { [renderMethod: string]: (a: A) => ReactNode }>(Inner);
     return apply({
       ...(p as any),
-      [renderMethod]: f
+      [renderMethod]: f,
     });
   });
 }
 
 /**
  * Converts an apply function to a ChainableComponent
- * @param ap
+ * @param render
  */
-export function fromAp<A>(ap: (f: (a: A) => ReactNode) => ReactNode): ChainableComponent<A> {
+export function fromRender<A>(render: (f: (a: A) => ReactNode) => ReactNode): ChainableComponent<A> {
   return {
-    ap,
+    render,
     map<B>(f: (a: A) => B): ChainableComponent<B> {
-      const Mapped: Applied<B> = g => this.ap(a => g(f(a)));
-      return fromAp(Mapped);
+      const Mapped: Applied<B> = g => this.render(a => g(f(a)));
+      return fromRender(Mapped);
+    },
+    ap<B>(c: ChainableComponent<(a: A) => B>): ChainableComponent<B> {
+      const Apped: Applied<B> = g => this.render(a => c.render(f => g(f(a))));
+      return fromRender(Apped);
     },
     chain<B>(f: (a: A) => ChainableComponent<B>): ChainableComponent<B> {
-      const FlatMapped: Applied<B> = g => this.ap(a => f(a).ap(g));
-      return fromAp(FlatMapped);
-    }
+      const FlatMapped: Applied<B> = g => this.render(a => f(a).render(g));
+      return fromRender(FlatMapped);
+    },
   };
 }
 
 type CC<A> = ChainableComponent<A>;
 
+function all<T1, T2, T3, T4, T5, T6, T7, T8, T9>(
+  values: [CC<T1>, CC<T2>, CC<T3>, CC<T4>, CC<T5>, CC<T6>, CC<T7>, CC<T8>, CC<T9>]): CC<[T1, T2, T3, T4, T5, T6, T7, T8, T9]>;
+function all<T1, T2, T3, T4, T5, T6, T7, T8>(
+  values: [CC<T1>, CC<T2>, CC<T3>, CC<T4>, CC<T5>, CC<T6>, CC<T7>, CC<T8>]): CC<[T1, T2, T3, T4, T5, T6, T7, T8]>;
+function all<T1, T2, T3, T4, T5, T6, T7>(values: [CC<T1>, CC<T2>, CC<T3>, CC<T4>, CC<T5>, CC<T6>, CC<T7>]): CC<[T1, T2, T3, T4, T5, T6, T7]>;
+function all<T1, T2, T3, T4, T5, T6>(values: [CC<T1>, CC<T2>, CC<T3>, CC<T4>, CC<T5>, CC<T6>]): CC<[T1, T2, T3, T4, T5, T6]>;
+function all<T1, T2, T3, T4, T5>(values: [CC<T1>, CC<T2>, CC<T3>, CC<T4>, CC<T5>]): CC<[T1, T2, T3, T4, T5]>;
+function all<T1, T2, T3, T4>(values: [CC<T1>, CC<T2>, CC<T3>, CC<T4>]): CC<[T1, T2, T3, T4]>;
+function all<T1, T2, T3>(values: [CC<T1>, CC<T2>, CC<T3>]): CC<[T1, T2, T3]>;
+function all<T1, T2>(values: [CC<T1>, CC<T2>]): CC<[T1, T2]>;
+function all<T>(values: (CC<T>)[]): CC<T[]>;
+function all(values: CC<any>[]) {
+  return values.reduce((aggOp: CC<any[]>, aOp: CC<any>) => {
+    return aggOp.ap(aOp.map(a => {
+      const g: (a: any[]) => any = agg => agg.concat([a]);
+      return g;
+    }));
+  }, ChainableComponent.of([]));
+}
+
 export const ChainableComponent = {
   /**
    * Wraps any value 'A' into a chainable component.
    * @param a the value that provides the context.
    */
   of<A>(a: A): ChainableComponent<A> {
-    return fromAp(f => f(a));
-  }
-
+    return fromRender(f => f(a));
+  },
+  all,
 };
-
-export function all<T1, T2, T3, T4, T5, T6, T7, T8, T9>(values: [CC<T1>, CC<T2>, CC<T3>, CC<T4>, CC<T5>, CC<T6>, CC<T7>, CC<T8>, CC<T9>]): CC<[T1, T2, T3, T4, T5, T6, T7, T8, T9]>
-export function all<T1, T2, T3, T4, T5, T6, T7, T8>(values: [CC<T1>, CC<T2>, CC<T3>, CC<T4>, CC<T5>, CC<T6>, CC<T7>, CC<T8>]): CC<[T1, T2, T3, T4, T5, T6, T7, T8]>
-export function all<T1, T2, T3, T4, T5, T6, T7>(values: [CC<T1>, CC<T2>, CC<T3>, CC<T4>, CC<T5>, CC<T6>, CC<T7>]): CC<[T1, T2, T3, T4, T5, T6, T7]>
-export function all<T1, T2, T3, T4, T5, T6>(values: [CC<T1>, CC<T2>, CC<T3>, CC<T4>, CC<T5>, CC<T6>]): CC<[T1, T2, T3, T4, T5, T6]>
-export function all<T1, T2, T3, T4, T5>(values: [CC<T1>, CC<T2>, CC<T3>, CC<T4>, CC<T5>]): CC<[T1, T2, T3, T4, T5]>
-export function all<T1, T2, T3, T4>(values: [CC<T1>, CC<T2>, CC<T3>, CC<T4>]): CC<[T1, T2, T3, T4]>
-export function all<T1, T2, T3>(values: [CC<T1>, CC<T2>, CC<T3>]): CC<[T1, T2, T3]>
-export function all<T1, T2>(values: [CC<T1>, CC<T2>]): CC<[T1, T2]>
-export function all<T>(values: (CC<T>)[]): CC<T[]>
-export function all(values: CC<any>[]) {
-  return values.reduce((aggOp: CC<any[]>, aOp: CC<any>) =>
-    aggOp.chain((agg: any[]) => (
-      aOp.map(a => agg.concat([a]))
-    )
-  ), ChainableComponent.of([]));
-}
-
-
-// [].concat()
\ No newline at end of file
diff --git a/src/index.ts b/src/index.ts
index fd4596b..4ac844b 100644
--- a/src/index.ts
+++ b/src/index.ts
@@ -1,21 +1,19 @@
-import { 
+import {
   ChainableComponent,
-  RenderPropsProps,
-  RenderPropsComponent,
+  fromRender,
   fromRenderProp,
-  fromAp,
-  all,
+  RenderPropsComponent,
+  RenderPropsProps,
 } from './ChainableComponent';
-import { withState, WithState } from './lib/withState';
 import { withPromise, WithPromise } from './lib/withPromise';
+import { withState, WithState } from './lib/withState';
 
 export {
   ChainableComponent,
   RenderPropsProps,
   RenderPropsComponent,
   fromRenderProp,
-  fromAp,
-  all,
+  fromRender,
   withState, WithState,
   withPromise, WithPromise,
-};
\ No newline at end of file
+};
diff --git a/src/lib/withPromise.tsx b/src/lib/withPromise.tsx
index 89d7b81..304f33c 100644
--- a/src/lib/withPromise.tsx
+++ b/src/lib/withPromise.tsx
@@ -1,25 +1,25 @@
-import { fromRenderProp, ChainableComponent, RenderPropsProps } from '../ChainableComponent';
 import * as React from 'react';
+import { ChainableComponent, fromRenderProp, RenderPropsProps } from '../ChainableComponent';
 
 /**
  * The state of the WithProps component.
  * It can either be loading, or have data available.
  */
 export type WithPromiseState<A> = {
-  loading: true
+  loading: true,
 } | {
   loading: false,
-  data: A
+  data: A,
 };
 
 /**
- * The type of options that WithPromise expects 
+ * The type of options that WithPromise expects
  */
 export type WithPromiseOptions<A> = {
   /**
    * A method that returns a Promise. this method will be invoked once when the component is mounted.
    */
-  get: () => Promise<A>
+  get: () => Promise<A>,
 };
 
 /**
@@ -28,19 +28,19 @@ export type WithPromiseOptions<A> = {
 export type WithPromiseProps<A> = RenderPropsProps<WithPromiseOptions<A>, WithPromiseState<A>>;
 
 /**
- * A Render Prop component that encapsulates the state around resolving a Promise which is 
+ * A Render Prop component that encapsulates the state around resolving a Promise which is
  * requested when this component mounts.
  */
 export class WithPromise<A> extends React.Component<WithPromiseProps<A>, WithPromiseState<A>> {
   state: WithPromiseState<A> = {
-    loading: true
+    loading: true,
   };
 
   componentDidMount() {
     this.props.get().then(data => {
       this.setState(() => ({
         loading: false,
-        data
+        data,
       }));
     });
   }
@@ -48,13 +48,13 @@ export class WithPromise<A> extends React.Component<WithPromiseProps<A>, WithPro
   render() {
     return this.props.children(this.state);
   }
-};
+}
 
 /**
- * Builds a chainable component that encapsulates the state around resolving a Promise which is 
+ * Builds a chainable component that encapsulates the state around resolving a Promise which is
  * requested when this component mounts.
  * @param opts Options for this chainable component which provide a method that returns
  */
 export function withPromise<A>(opts: WithPromiseOptions<A>): ChainableComponent<WithPromiseState<A>> {
   return fromRenderProp<WithPromiseOptions<A>, WithPromiseState<A>>(WithPromise)(opts);
-};
+}
diff --git a/src/lib/withState.ts b/src/lib/withState.ts
index ea93161..5b6c773 100644
--- a/src/lib/withState.ts
+++ b/src/lib/withState.ts
@@ -1,11 +1,11 @@
 import * as React from 'react';
-import { fromRenderProp, ChainableComponent, RenderPropsProps } from '../ChainableComponent';
+import { ChainableComponent, fromRenderProp, RenderPropsProps } from '../ChainableComponent';
 
 /**
  * The state used by the WithState render prop.
  */
 export type WithStateState<A> = {
-  value: A
+  value: A,
 };
 
 /**
@@ -13,21 +13,21 @@ export type WithStateState<A> = {
  */
 export type WithStateContext<A> = {
   value: A,
-  update: (a: A) => void
+  update: (a: A) => void,
 };
 
 /**
- * The options to pass 
+ * The options to pass
  */
 export type WithStateOptions<A> = {
-  initial: A
+  initial: A,
 };
 
 export type WithStateProps<A> = RenderPropsProps<WithStateOptions<A>, WithStateContext<A>>;
 
 export class WithState<A> extends React.Component<WithStateProps<A>, WithStateState<A>> {
   state: WithStateState<A> = {
-    value: this.props.initial
+    value: this.props.initial,
   };
 
   constructor(props: WithStateProps<A>) {
@@ -37,14 +37,14 @@ export class WithState<A> extends React.Component<WithStateProps<A>, WithStateSt
 
   update(a: A) {
     this.setState({
-      value: a
+      value: a,
     });
   }
 
   render() {
     return this.props.children({
       value: this.state.value,
-      update: this.update
+      update: this.update,
     });
   }
 }
diff --git a/tslint.json b/tslint.json
index 20d18f6..8e38ac9 100644
--- a/tslint.json
+++ b/tslint.json
@@ -5,7 +5,9 @@
   ],
   "jsRules": {},
   "rules": {
+    "interface-over-type-literal": false,
     "array-type": false,
+    "arrow-parens": false,
     "interface-name": {
       "options": "never-prefix"
     },