/**
 * @module ember-paper
 */
import Ember from 'ember';

const { Component, computed } = Ember;

/**
 * @class PaperAutocompleteHighlight
 * @extends Ember.Component
 */
export default Component.extend({
  tagName: 'span',
  flags: '',

  highlight: computed('searchText', 'label', 'flags', function() {
    let text = Ember.Handlebars.Utils.escapeExpression(this.get('label'));
    let flags = this.get('flags');
    let regex = this.getRegExp(this.get('searchText'), flags);
    let html  = text.replace(regex, '<span class="highlight">$&</span>');
    return new Ember.Handlebars.SafeString(html);
  }),

  sanitize(term) {
    if (!term) {
      return term;
    }
    return term.replace(/[\\\^\$\*\+\?\.\(\)\|\{}\[\]]/g, '\\$&');
  },

  getRegExp(text, flags) {
    let str = '';
    if (flags.indexOf('^') >= 1) {
      str += '^';
    }
    str += text;
    if (flags.indexOf('$') >= 1) {
      str += '$';
    }
    return new RegExp(this.sanitize(str), flags.replace(/[\$\^]/g, ''));
  }

});

@@ -561,39 +561,29 @@
 urn 
-new 
 Ember.
-Handlebars.SafeString
+String.htmlSafe
 (htm

Use String.htmlSafe in highlight