diff --git a/README.md b/README.md index 5e09573d..6a9ebd14 100644 --- a/README.md +++ b/README.md @@ -40,7 +40,7 @@ Default values can be set [on the `ember-tooltips` mixin](#customizing-the-mixin ### Using on Helpers -The most common way to use a tooltip is on a helper. Examples of such helpers are `{{#link-to}}`, `{{#some-component}}`, or `{{view 'table'}}`. +The most common way to use a tooltip is on a helper. Examples of such helpers are `{{#link-to}}`, `{{some-component}}`, or `{{view 'table'}}`. All supported properties should be prefixed by `tooltip` and should be camelCased. @@ -82,7 +82,7 @@ Or with dynamic content: {{/each}} ``` -To manually set the tooltip's state: +To manually set the tooltip's visibility with a boolean property: ```hbs {{#some-component @@ -94,14 +94,14 @@ To manually set the tooltip's state: {{/some-component}} ``` -Tooltips can be automatically closed: +Tooltips can be automatically closed after a specified duration: ```hbs -{{input type="text" - tooltipEvent="focus" - tooltipContent="Helpful form tip" - tooltipDuration="1000" - tooltipPlace="right" +{{input type='text' + tooltipEvent='focus' + tooltipContent='Helpful form tip' + tooltipDuration='1000' + tooltipPlace='right' }} ``` @@ -109,6 +109,8 @@ Tooltips can be automatically closed: If you want to use HTMLBars in your tooltip, then the `{{tooltip-on-parent}}` component is your friend. +*Please note, normal HTML can be passed with the `tooltipContent` param.* + This component registers itself on the parent view and the content of the `{{tooltip-on-parent}}` component will be rendered inside the tooltip. The tooltip is automatically attached to the parent view's element. ```hbs @@ -194,6 +196,8 @@ export default Ember.Component.extend({ }); ``` +**Warning:** Using HTML `data-x` attributes has limitations. Durations and manual triggers are not supported. + ### Customizing the Mixin By default the `ember-tooltips` mixin is added to all views and components. This mixin contains the helper methods to render tooltips. @@ -254,7 +258,7 @@ import EmberTooltipsMixin from 'ember-tooltips/mixins/components/tooltips'; export default Ember.Mixin.create( EmberTooltipsMixin, { - + tooltipPlace: 'right', tooltipSpacing: 20, }); @@ -265,3 +269,9 @@ export default Ember.Mixin.create( - `git clone https://github.com/sir-dunxalot/ember-tooltips.git` - `ember s` - `ember test` or `/tests` route + +A huge thank you to those who have identified and opened issues, in particular the contributors: + +- @davidgovea +- @kmiyashiro +- @cdl diff --git a/package.json b/package.json index 407861c7..48673e8a 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "ember-tooltips", - "version": "0.3.0", + "version": "0.4.0", "description": "Renders and positions plain text tooltips and HTMLBars tooltips on any Ember view or component", "directories": { "doc": "doc",