diff --git a/src/Lexer/index.js b/src/Lexer/index.js
index 24f2948..1ac09f2 100644
--- a/src/Lexer/index.js
+++ b/src/Lexer/index.js
@@ -140,6 +140,19 @@ class Lexer {
     return 'this.runTimeRender'
   }
 
+  /**
+   * The method to be used for rendering
+   * the template with pre-existing
+   * context.
+   *
+   * @attribute renderWithContextFn
+   *
+   * @return {String}
+   */
+  get renderWithContextFn () {
+    return 'this.renderWithContext'
+  }
+
   /**
    * Validates the current type against the allowed types.
    * It calls the callback instead of throwing exception
diff --git a/src/Tags/ComponentTag.js b/src/Tags/ComponentTag.js
index b0e6416..ec61f31 100644
--- a/src/Tags/ComponentTag.js
+++ b/src/Tags/ComponentTag.js
@@ -185,7 +185,7 @@ class ComponentTag extends BaseTag {
      * Render the component in runtime, since component name can
      * be dynamic aswell.
      */
-    buffer.writeToOutput(`$\{this.renderWithContext(${name})}`, false)
+    buffer.writeToOutput(`$\{${lexer.renderWithContextFn}(${name})}`, false)
 
     /**
      * End the isolation
diff --git a/src/Template/index.js b/src/Template/index.js
index 984dc99..a59497c 100644
--- a/src/Template/index.js
+++ b/src/Template/index.js
@@ -368,12 +368,18 @@ class Template {
     /**
      * Convert props array to data object
      */
+    let presenter = null
     const data = _.transform(props, (result, prop) => {
-      _.merge(result, prop)
+      if (prop.presenter) {
+        presenter = prop.presenter
+      } else {
+        _.merge(result, prop)
+      }
       return result
     }, {})
 
     const template = new Template(this._tags, this._globals, this._loader)
+    template.presenter(presenter)
     template._makeContext(data)
     return template
   }
diff --git a/test/unit/tags/component.spec.js b/test/unit/tags/component.spec.js
index d6341ea..1e3af01 100644
--- a/test/unit/tags/component.spec.js
+++ b/test/unit/tags/component.spec.js
@@ -16,7 +16,8 @@ const Context = require('../../../src/Context')
 const Template = require('../../../src/Template')
 const Loader = require('../../../src/Loader')
 const dedent = require('dedent-js')
-const loader = new Loader(require('path').join(__dirname, '../../../test-helpers/views'))
+const path = require('path')
+const loader = new Loader(path.join(__dirname, '../../../test-helpers/views'))
 
 test.group('Tags | Component ', (group) => {
   group.beforeEach(() => {
@@ -322,4 +323,16 @@ test.group('Tags | Component ', (group) => {
     assert.equal($('.col-lg-6:first-child h4').text().trim(), 'foo')
     assert.equal($('.col-lg-6:last-child h4').text().trim(), 'bar')
   })
+
+  test('pass presenter to component', (assert) => {
+    loader.presentersPath = path.join(__dirname, '../../../test-helpers/presenters')
+    const template = new Template(this.tags, {}, loader)
+    const statement = dedent`
+    @!component('components.user', presenter = 'User', username = 'virk')
+    `
+    this.tags.each.run(Context)
+    const output = template.renderString(statement)
+    const $ = cheerio.load(output)
+    assert.equal($('h2').text().trim(), 'Hello VIRK')
+  })
 })