diff --git a/.eslintrc.yml b/.eslintrc.yml
index 923a5e8..830b359 100644
--- a/.eslintrc.yml
+++ b/.eslintrc.yml
@@ -192,6 +192,7 @@ rules:
   quotes: 'off'
   radix: error
   "react/jsx-uses-react": 1
+  "react/jsx-uses-vars": 1
   require-jsdoc: 'off'
   require-yield: error
   rest-spread-spacing: error
diff --git a/ComponentInterpolator.js b/ComponentInterpolator.js
index d6ec36e..980baca 100644
--- a/ComponentInterpolator.js
+++ b/ComponentInterpolator.js
@@ -1,6 +1,6 @@
 var React = require('react');
 var invariant = require('invariant');
-var { string, object } = React.PropTypes;
+var { string, object } = require('prop-types');
 
 var WRAPPER_PATTERN = /(\*+)/;
 var PLACEHOLDER_PATTERN = /(%\{.*?\})/;
@@ -47,79 +47,85 @@ var getInjectIndex = function(children, containerName) {
   return index;
 };
 
-var ComponentInterpolator = React.createClass({
-  propTypes: {
-    string: string.isRequired,
-    wrappers: object
-  },
-
-  inferChildren() {
-    var tokens = (this.props.string || '').split(WRAPPER_PATTERN);
-    this.keyCounter = 0;
-    var inferredChildren = this.interpolateAllComponents(tokens);
-
-    var currentChildren = toArray(this.props.children);
-
-    var index = getInjectIndex(currentChildren, '<ComponentInterpolator>');
-    invariant(index >= 0, '<ComponentInterpolator> must have a "$1" text child"');
-    currentChildren.splice.apply(currentChildren, [index, 1].concat(inferredChildren));
-    return currentChildren;
-  },
-
-  interpolateAllComponents(tokens, eof) {
-    var token, child;
-    var children = [];
-    var wrappers = this.props.wrappers || {};
-    while (tokens.length) {
-      token = tokens.shift();
-      if (token === eof) break;
-      if (token.match(WRAPPER_PATTERN)) {
-        invariant(
-          child = wrappers[token],
-          `<ComponentInterpolator> expected '${token}' wrapper, none found`
-        );
-
-        child = injectNewDescendants(
-          child,
-          this.interpolateAllComponents(tokens, token),
-          { key: this.keyCounter++ },
-          true
-        );
-        children.push(child);
-      }
-      else {
-        children.push.apply(children, this.interpolatePlaceholders(token));
-      }
+var Counter = function() {
+  this.count = 0;
+  this.next = function() {
+    return this.count++;
+  };
+};
+
+var inferChildren = function(props) {
+  var tokens = (props.string || '').split(WRAPPER_PATTERN);
+  var inferredChildren = interpolateAllComponents(tokens, props);
+
+  var currentChildren = toArray(props.children);
+
+  var index = getInjectIndex(currentChildren, '<ComponentInterpolator>');
+  invariant(index >= 0, '<ComponentInterpolator> must have a "$1" text child"');
+  currentChildren.splice.apply(currentChildren, [index, 1].concat(inferredChildren));
+  return currentChildren;
+};
+
+var interpolateAllComponents = function(tokens, props, keyCounter, eof) {
+  var token, child;
+  var children = [];
+  var wrappers = props.wrappers || {};
+  if (!keyCounter) {
+    keyCounter = new Counter();
+  }
+  while (tokens.length) {
+    token = tokens.shift();
+    if (token === eof) break;
+    if (token.match(WRAPPER_PATTERN)) {
+      invariant(
+        child = wrappers[token],
+        `<ComponentInterpolator> expected '${token}' wrapper, none found`
+      );
+
+      child = injectNewDescendants(
+        child,
+        interpolateAllComponents(tokens, props, keyCounter, token),
+        { key: keyCounter.next() },
+        true
+      );
+      children.push(child);
     }
-    return children;
-  },
-
-  interpolatePlaceholders(string) {
-    var token, child;
-    var tokens = string.split(PLACEHOLDER_PATTERN);
-    var children = [];
-    while (tokens.length) {
-      token = tokens.shift();
-      if (token.match(PLACEHOLDER_PATTERN)) {
-        token = token.slice(2, -1);
-        invariant(
-          this.props.hasOwnProperty(token),
-          `<ComponentInterpolator> expected '${token}' placeholder value, none found`
-        );
-        child = this.props[token];
-        child = child && child.type ? React.cloneElement(child, {key: this.keyCounter++}) : child;
-        children.push(child);
-      } else {
-        children.push(token);
-      }
+    else {
+      children.push.apply(children, interpolatePlaceholders(token, props, keyCounter));
     }
-    return children;
-  },
+  }
+  return children;
+};
 
-  render() {
-    return React.createElement('span', {}, this.inferChildren());
+var interpolatePlaceholders = function(string, props, keyCounter) {
+  var token, child;
+  var tokens = string.split(PLACEHOLDER_PATTERN);
+  var children = [];
+  while (tokens.length) {
+    token = tokens.shift();
+    if (token.match(PLACEHOLDER_PATTERN)) {
+      token = token.slice(2, -1);
+      invariant(
+        props.hasOwnProperty(token),
+        `<ComponentInterpolator> expected '${token}' placeholder value, none found`
+      );
+      child = props[token];
+      child = child && child.type ? React.cloneElement(child, {key: keyCounter.next()}) : child;
+      children.push(child);
+    } else {
+      children.push(token);
+    }
   }
-});
+  return children;
+};
 
-module.exports = ComponentInterpolator;
+var ComponentInterpolator = function(props) {
+  return React.createElement('span', {}, inferChildren(props));
+};
+
+ComponentInterpolator.propTypes = {
+  string: string.isRequired,
+  wrappers: object
+};
 
+module.exports = ComponentInterpolator;
diff --git a/__tests__/ComponentInterpolator.test.js b/__tests__/ComponentInterpolator.test.js
index 89d7fdf..54b4431 100644
--- a/__tests__/ComponentInterpolator.test.js
+++ b/__tests__/ComponentInterpolator.test.js
@@ -1,55 +1,49 @@
-var subjector = require('../test_utils/subjector');
-var Subject = subjector(__dirname + '/../ComponentInterpolator');
 var React = require('react');
-var ReactDOM = require('react-dom');
-
-var removeNoise = function(string) {
-  return string.replace(/<!--.*?-->/g, '')
-               .replace(/ data-reactid=".*?"/g, '');
-};
+var { shallow } = require('enzyme');
+var CI = require('../ComponentInterpolator');
 
 describe('ComponentInterpolator', function() {
   it('renders', function() {
-    var subject = Subject({
-      string: 'Hello World',
-      wrappers: {}
-    }, ["$1"]);
-    expect(subject.isMounted()).toEqual(true);
-    expect(ReactDOM.findDOMNode(subject).textContent).toEqual('Hello World');
+    var component = <CI string='Hello World'>$1</CI>;
+    expect(shallow(component).text()).toEqual('Hello World');
+  });
+
+  it('wraps content in a <span>', function() {
+    var component = <CI string='Howdy!'>$1</CI>;
+    expect(shallow(component).html()).toEqual('<span>Howdy!</span>');
   });
 
   it('escapes html in the string', function() {
-    var subject = Subject({
-      string: 'My favorite tag is <script />',
-      wrappers: {}
-    }, ["$1"]);
-    expect(ReactDOM.findDOMNode(subject).textContent).toEqual('My favorite tag is <script />');
+    var component = <CI string='My favorite tag is <script />'>$1</CI>;
+    expect(shallow(component).text()).toEqual('My favorite tag is <script />');
   });
 
   it('interpolates wrapper components', function() {
-    var subject = Subject({
+    var props = {
       string: 'Ohai, Jane, click *here* right ***now **please** ***',
       wrappers: {
         '*': <a href='/'><img />$1</a>,
         '**': <i>$1</i>,
         '***': <b><em>$1</em></b>
       }
-    }, [<hr />, "$1"]);
-    expect(removeNoise(ReactDOM.findDOMNode(subject).innerHTML)).toEqual(
-      '<hr>Ohai, Jane, click <a href="/"><img>here</a> right <b><em>now <i>please</i> </em></b>'
+    };
+    var component = <CI {...props}><hr />$1</CI>;
+    expect(shallow(component).html()).toEqual(
+      '<span><hr/>Ohai, Jane, click <a href="/"><img/>here</a> right <b><em>now <i>please</i> </em></b></span>'
     );
   });
 
   it('interpolates placeholder components', function() {
-    var subject = Subject({
+    var props = {
       string: 'Hi %{user} (%{user_id}), create %{count} new accounts',
       wrappers: {},
       user: "Jane",
       user_id: 0,
       count: <input />
-    }, ["$1"]);
-    expect(removeNoise(ReactDOM.findDOMNode(subject).innerHTML)).toEqual(
-      'Hi Jane (0), create <input> new accounts'
+  };
+    var component = <CI {...props}>$1</CI>;
+    expect(shallow(component).html()).toEqual(
+      '<span>Hi Jane (0), create <input/> new accounts</span>'
     );
   });
 });
diff --git a/dist/ComponentInterpolator.js b/dist/ComponentInterpolator.js
index d658d2e..58c4097 100644
--- a/dist/ComponentInterpolator.js
+++ b/dist/ComponentInterpolator.js
@@ -2,10 +2,10 @@
 
 var React = require('react');
 var invariant = require('invariant');
-var _React$PropTypes = React.PropTypes;
-var string = _React$PropTypes.string;
-var object = _React$PropTypes.object;
 
+var _require = require('prop-types'),
+    string = _require.string,
+    object = _require.object;
 
 var WRAPPER_PATTERN = /(\*+)/;
 var PLACEHOLDER_PATTERN = /(%\{.*?\})/;
@@ -53,65 +53,73 @@ var getInjectIndex = function getInjectIndex(children, containerName) {
   return index;
 };
 
-var ComponentInterpolator = React.createClass({
-  displayName: 'ComponentInterpolator',
-
-  propTypes: {
-    string: string.isRequired,
-    wrappers: object
-  },
-
-  inferChildren: function inferChildren() {
-    var tokens = (this.props.string || '').split(WRAPPER_PATTERN);
-    this.keyCounter = 0;
-    var inferredChildren = this.interpolateAllComponents(tokens);
-
-    var currentChildren = toArray(this.props.children);
-
-    var index = getInjectIndex(currentChildren, '<ComponentInterpolator>');
-    invariant(index >= 0, '<ComponentInterpolator> must have a "$1" text child"');
-    currentChildren.splice.apply(currentChildren, [index, 1].concat(inferredChildren));
-    return currentChildren;
-  },
-  interpolateAllComponents: function interpolateAllComponents(tokens, eof) {
-    var token, child;
-    var children = [];
-    var wrappers = this.props.wrappers || {};
-    while (tokens.length) {
-      token = tokens.shift();
-      if (token === eof) break;
-      if (token.match(WRAPPER_PATTERN)) {
-        invariant(child = wrappers[token], '<ComponentInterpolator> expected \'' + token + '\' wrapper, none found');
-
-        child = injectNewDescendants(child, this.interpolateAllComponents(tokens, token), { key: this.keyCounter++ }, true);
-        children.push(child);
-      } else {
-        children.push.apply(children, this.interpolatePlaceholders(token));
-      }
+var Counter = function Counter() {
+  this.count = 0;
+  this.next = function () {
+    return this.count++;
+  };
+};
+
+var inferChildren = function inferChildren(props) {
+  var tokens = (props.string || '').split(WRAPPER_PATTERN);
+  var inferredChildren = interpolateAllComponents(tokens, props);
+
+  var currentChildren = toArray(props.children);
+
+  var index = getInjectIndex(currentChildren, '<ComponentInterpolator>');
+  invariant(index >= 0, '<ComponentInterpolator> must have a "$1" text child"');
+  currentChildren.splice.apply(currentChildren, [index, 1].concat(inferredChildren));
+  return currentChildren;
+};
+
+var interpolateAllComponents = function interpolateAllComponents(tokens, props, keyCounter, eof) {
+  var token, child;
+  var children = [];
+  var wrappers = props.wrappers || {};
+  if (!keyCounter) {
+    keyCounter = new Counter();
+  }
+  while (tokens.length) {
+    token = tokens.shift();
+    if (token === eof) break;
+    if (token.match(WRAPPER_PATTERN)) {
+      invariant(child = wrappers[token], '<ComponentInterpolator> expected \'' + token + '\' wrapper, none found');
+
+      child = injectNewDescendants(child, interpolateAllComponents(tokens, props, keyCounter, token), { key: keyCounter.next() }, true);
+      children.push(child);
+    } else {
+      children.push.apply(children, interpolatePlaceholders(token, props, keyCounter));
     }
-    return children;
-  },
-  interpolatePlaceholders: function interpolatePlaceholders(string) {
-    var token, child;
-    var tokens = string.split(PLACEHOLDER_PATTERN);
-    var children = [];
-    while (tokens.length) {
-      token = tokens.shift();
-      if (token.match(PLACEHOLDER_PATTERN)) {
-        token = token.slice(2, -1);
-        invariant(this.props.hasOwnProperty(token), '<ComponentInterpolator> expected \'' + token + '\' placeholder value, none found');
-        child = this.props[token];
-        child = child && child.type ? React.cloneElement(child, { key: this.keyCounter++ }) : child;
-        children.push(child);
-      } else {
-        children.push(token);
-      }
+  }
+  return children;
+};
+
+var interpolatePlaceholders = function interpolatePlaceholders(string, props, keyCounter) {
+  var token, child;
+  var tokens = string.split(PLACEHOLDER_PATTERN);
+  var children = [];
+  while (tokens.length) {
+    token = tokens.shift();
+    if (token.match(PLACEHOLDER_PATTERN)) {
+      token = token.slice(2, -1);
+      invariant(props.hasOwnProperty(token), '<ComponentInterpolator> expected \'' + token + '\' placeholder value, none found');
+      child = props[token];
+      child = child && child.type ? React.cloneElement(child, { key: keyCounter.next() }) : child;
+      children.push(child);
+    } else {
+      children.push(token);
     }
-    return children;
-  },
-  render: function render() {
-    return React.createElement('span', {}, this.inferChildren());
   }
-});
+  return children;
+};
+
+var ComponentInterpolator = function ComponentInterpolator(props) {
+  return React.createElement('span', {}, inferChildren(props));
+};
+
+ComponentInterpolator.propTypes = {
+  string: string.isRequired,
+  wrappers: object
+};
 
 module.exports = ComponentInterpolator;
\ No newline at end of file
diff --git a/package.json b/package.json
index d42b9d2..06d7fd4 100644
--- a/package.json
+++ b/package.json
@@ -11,18 +11,20 @@
   "license": "MIT",
   "devDependencies": {
     "babel-cli": "^6.10.1",
-    "babel-jest": "^12.1.0",
+    "babel-jest": "^20.0.3",
     "babel-plugin-transform-react-jsx": "^6.8.0",
     "babel-polyfill": "^6.9.1",
     "babel-preset-es2015": "^6.9.0",
     "babel-preset-react": "^6.5.0",
-    "eslint": "^2.12.0",
-    "eslint-plugin-react": "^5.1.1",
+    "enzyme": "^2.9.1",
+    "eslint": "^4.1.1",
+    "eslint-plugin-react": "^7.1.0",
     "i18nliner": "~0.2.1",
-    "jest-cli": "^12.1.1",
+    "jest-cli": "^20.0.4",
     "react": "^15.0.0",
     "react-addons-test-utils": "^15.1.0",
-    "react-dom": "^15.1.0"
+    "react-dom": "^15.1.0",
+    "react-test-renderer": "^15.6.1"
   },
   "peerDependencies": {
     "i18nliner": "~0.2.2",
@@ -36,6 +38,7 @@
   },
   "dependencies": {
     "invariant": "2.2.1",
+    "prop-types": "^15.5.10",
     "recast": "^0.11.12",
     "through2": "^0.6.3"
   }
diff --git a/test_utils/subjector.js b/test_utils/subjector.js
deleted file mode 100644
index b6f9875..0000000
--- a/test_utils/subjector.js
+++ /dev/null
@@ -1,16 +0,0 @@
-module.exports = function(path) {
-  jest.dontMock(path);
-
-  var React = require('react');
-  var TestUtils = require('react-addons-test-utils');
-  var Component = require(path);
-
-  return function(props, children) {
-    children = children || [];
-    var args = [Component, props].concat(children);
-    return TestUtils.renderIntoDocument(
-      React.createElement.apply(React, args)
-    );
-  };
-};
-
diff --git a/util/escapeRegExp.js b/util/escapeRegExp.js
index b082b19..e5bc5c8 100644
--- a/util/escapeRegExp.js
+++ b/util/escapeRegExp.js
@@ -1,3 +1,3 @@
 module.exports = function(str) {
-  return str.replace(/[\-\[\]\/\{\}\(\)\*\+\?\.\\\^\$\|]/g, "\\$&");
+  return str.replace(/[-[\]/{}()*+?.\\^$|]/g, "\\$&");
 };