A Ember Component wrapper for zurb/tribute

demo

• Ember.js v2.18 or above
• Ember CLI v2.13 or above

ember install ember-tribute

You can simply wrap any textarea, input, or contenteditable element with ui-tribute component:

{{#ui-tribute options=options}}
  <input type="text">
{{/ui-tribute}}

// where options will be the tribute collection object
options: {
    values: [
    { key: 'Jordan Humphreys', value: 'Jordan Humphreys', email: '[email protected]' },
    { key: 'Sir Walter Riley', value: 'Sir Walter Riley', email: '[email protected]' }
  ]
},

The ui-tribute component will bind tributejs to the textarea that you pass it as children. The ui-tribute component takes all options that zurb/tribute expects.

You can pass a action tributeReplaced to like {{#ui-tribute tributeReplaced=(action 'someaction')}} to the component which acts as the callback for tribute-replaced event emitted by Tribute.

Similarly you can pass a action tributeNoMatch to like {{#ui-tribute tributeNoMatch=(action 'someaction')}} to the component which acts as the callback for tributeNoMatch event emitted by Tribute.

If you wish to get the Tribute instance itself, pass an action registerTributeInstance to the component like {{#ui-tribute registerTributeInstance=(action 'someaction')}} and the action will be called with the Tribute instance object as its parameter.

For nested components in yield use target to pass the query selector string for the elment for Tribute to be attached to.

This project is licensed under the MIT License.