# New Feature: Perspective Tooltips **URL:** \ **Category:** Ignition Early Access\ **Tags:** perspective\ **Created:** [August 5, 2021, 11:30pm UTC](https://forum.inductiveautomation.com/t/new-feature-perspective-tooltips/49630 "2021-08-05T23:30:49Z")\ **Posts on this page:** 20\ **Page:** 1
**Author:** ![cmallonee](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/cmallonee/32/6416_2.png) [@cmallonee](https://forum.inductiveautomation.com/u/cmallonee)\ **Post date:** [August 5, 2021, 11:30pm UTC](https://forum.inductiveautomation.com/t/new-feature-perspective-tooltips/49630/1 "2021-08-05T23:30:49Z")
I’m happy to announce that tooltips are now available for every Perspective component as of the August 5th nightly build. You can find the configuration properties for this feature in the `meta` category of each component. ![ezgif-4-41862bbf1f65](https://us1.discourse-cdn.com/inductiveautomation/original/3X/3/8/384c2928c8c4043b862bb6e2cacaafe74cb836bb.gif) Some important properties: - `enabled`: Controls whether the tooltip will be displayed on hover or if requested via scripting. - `delay`: How long to delay before displaying the tooltip after hover begins or after a scripting request. - `sustain`: How long to display the tooltip before removing it from view. - `location`: Where to display the tooltip in relation to the associated component - as space allows.\* - `tail`: Controls a decorative triangle which points to the associated component. This tail does not accept direct styling at this point, but will use the background color of the tooltip. The `text` and `style` properties are very straight-forward. Tooltips with various styles applied, and with/without the `tail` enabled: ![Screen Shot 2021-08-05 at 10.05.44 AM](https://us1.discourse-cdn.com/inductiveautomation/original/3X/2/5/2555dcb3212dab7d616af578d89878a23777965a.png) ![Screen Shot 2021-08-05 at 10.08.34 AM](https://us1.discourse-cdn.com/inductiveautomation/original/3X/f/c/fcf7511288d5b4077f860aa8012c10f394c84b47.png) In addition to these properties, we wanted to accommodate use-cases where a tooltip is desired when a user is NOT hovering over a component. Some examples include mobile sessions and directive/progressive tooltips. To manage this extra functionality, we implemented new component methods which allow for requesting a tooltip be displayed for a component as well as for removing the tooltip from a component. `requestTooltip()`: Requests a tooltip be displayed with the currently configured properties. If the `enabled` property for the tooltip is `false`, then this function call will have no effect because the tooltip is not enabled. Example: `self.getSibling(‘PasswordField’).requestTooltip()` `removeTooltip()`: Removes the displayed tooltip for the component. For pointers on how to properly use tooltips within your own project, I recommend reading this helpful guide: [Tooltip Guidelines](https://www.nngroup.com/articles/tooltip-guidelines/) \* The “locations” available might appear misleading at first, but follow these guidelines, where the pink lines determine the boundaries available to the tooltip; this means that the tooltip will expand or determine its width _away from_ the pink guidelines: ![tooltip-positions](https://us1.discourse-cdn.com/inductiveautomation/original/3X/b/0/b00148c6211e0e3c15bcbda452629ef4a67dcc5b.png) ---
**Author:** ![cmallonee](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/cmallonee/32/6416_2.png) [@cmallonee](https://forum.inductiveautomation.com/u/cmallonee)\ **Post date:** [August 5, 2021, 11:31pm UTC](https://forum.inductiveautomation.com/t/new-feature-perspective-tooltips/49630/2 "2021-08-05T23:31:24Z")
Pinned on August 5, 2021, 11:31pm UTC ---
**Author:** ![nader.chinichian](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/nader.chinichian/32/9261_2.png) [@nader.chinichian](https://forum.inductiveautomation.com/u/nader.chinichian)\ **Post date:** [August 6, 2021, 7:16am UTC](https://forum.inductiveautomation.com/t/new-feature-perspective-tooltips/49630/3 "2021-08-06T07:16:35Z")
Hi @cmallonee Thanks for this great news. I have some questions regarding this: 1. Does this tooltip functionality add automatically in SDK for custom perspective component as well? Or we should add it or import to our code to have this on our own component? 2. Is it possible the tail and tooltip box share same border line and this this border line continues from box area to tail? (Like both is same shape not two separate shapes) 3. If object near edge of browser, does tooltip smart enough to change location? This important because of nature of responsiveness of view the object location can vary in different screen size so the location of appearing tooltip can’t be fixed and should be dynamic. This problem is happend before in popup for date picker. 4. Does tooltip show if I put component in a container with overflow to hidden? Because tooltip expose out side of container it may cause scroll bar if I don’t set overflow to hide. ---
**Author:** ![victordcq](https://avatars.discourse-cdn.com/v4/letter/v/f6c823/32.png) [@victordcq](https://forum.inductiveautomation.com/u/victordcq)\ **Post date:** [August 6, 2021, 9:15am UTC](https://forum.inductiveautomation.com/t/new-feature-perspective-tooltips/49630/4 "2021-08-06T09:15:52Z")
Ah great! Yesterday my boss asked about tool tips 😃 Seems like i wont have to make them from scratch! Seems like it would be usefull for form validation too. Being able to force it to popup from script is very nice for this. ---
**Author:** ![victordcq](https://avatars.discourse-cdn.com/v4/letter/v/f6c823/32.png) [@victordcq](https://forum.inductiveautomation.com/u/victordcq)\ **Post date:** [August 6, 2021, 12:22pm UTC](https://forum.inductiveautomation.com/t/new-feature-perspective-tooltips/49630/5 "2021-08-06T12:22:15Z")
Played around with it a bit 1. Seems it works on my custom components out of the bat, nice:D 2. It seems to be two seperate shapes, the tail doesnt seem to get any custom styling (yet) 3. The tooltip gets pushed with the edge of the screen causing it to overlap with the object if set on the wrong side. So i guess avoid using center-right, and the 3 bottoms (unless its for a button on the top of the screen/left on the screen) 4. The tooltip gets its own container (just like the popup) so will not be affected by overflows ---
**Author:** ![cmallonee](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/cmallonee/32/6416_2.png) [@cmallonee](https://forum.inductiveautomation.com/u/cmallonee)\ **Post date:** [August 6, 2021, 2:15pm UTC](https://forum.inductiveautomation.com/t/new-feature-perspective-tooltips/49630/6 "2021-08-06T14:15:19Z")
> [@nader.chinichian](#): > > Does this tooltip functionality add automatically in SDK for custom perspective component as well? It should, and it looks like @victordcq confirmed this. > [@nader.chinichian](#): > > Is it possible the tail and tooltip box share same border line and this this border line continues from box area to tail? (Like both is same shape not two separate shapes) Not at this time. They are two separate shapes. The tail does not accept styling (including border). We will change that in the future, but it will probably be quite some time. > [@nader.chinichian](#): > > If object near edge of browser, does tooltip smart enough to change location? Yes, the tooltip will remain in the screen if opened near the edge of the viewport. As noted by @victordcq above, this can cause the tooltip to obscure the element in some conditions. We verified internally that even in those conditions the tooltip does not interfere with the component being covered, ie: if obscuring a TextField, the TextField may still be used and is fully functional. > [@nader.chinichian](#): > > Does tooltip show if I put component in a container with overflow to hidden? Because tooltip expose out side of container it may cause scroll bar if I don’t set overflow to hide. The tooltip is not rendered in the same container as the associated component, so the tooltip will display regardless of overflow settings. ---
**Author:** ![bmusson](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/bmusson/32/87530_2.png) [@bmusson](https://forum.inductiveautomation.com/u/bmusson)\ **Post date:** [August 7, 2021, 7:36pm UTC](https://forum.inductiveautomation.com/t/new-feature-perspective-tooltips/49630/7 "2021-08-07T19:36:58Z")
Would it be possible to allow specifying a view instead of text, with some way to pass in properties from the component? ---
**Author:** ![cmallonee](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/cmallonee/32/6416_2.png) [@cmallonee](https://forum.inductiveautomation.com/u/cmallonee)\ **Post date:** [August 7, 2021, 9:53pm UTC](https://forum.inductiveautomation.com/t/new-feature-perspective-tooltips/49630/8 "2021-08-07T21:53:51Z")
In the far future, possibly, but for now we concentrated on keeping this as simple as possible from a rendering point-of-view to prevent any possible impact on performance. If you need something as complicated as a View, then you should look into using a relatively-positioned Popup. ---
**Author:** ![MAz123](https://avatars.discourse-cdn.com/v4/letter/m/4da419/32.png) [@MAz123](https://forum.inductiveautomation.com/u/MAz123)\ **Post date:** [August 11, 2021, 7:28pm UTC](https://forum.inductiveautomation.com/t/new-feature-perspective-tooltips/49630/9 "2021-08-11T19:28:39Z")
@cmallonee I added a “numeric entry field” component to my view and was hoping to see the tooltip options under the meta properties but it is not there. ![image](https://us1.discourse-cdn.com/inductiveautomation/original/3X/1/9/1927d73c30c90414a1748d3046a9ff1dd2d56654.png) Could you please direct me to where I can find the tooltip options? I am running the following versions: ![image](https://us1.discourse-cdn.com/inductiveautomation/original/3X/f/a/fad1cd0e952d07912e6f60f316b293b9c4473c6a.png) Thanks in advance ---
**Author:** ![WillMT10](https://avatars.discourse-cdn.com/v4/letter/w/7feea3/32.png) [@WillMT10](https://forum.inductiveautomation.com/u/WillMT10)\ **Post date:** [August 11, 2021, 7:31pm UTC](https://forum.inductiveautomation.com/t/new-feature-perspective-tooltips/49630/10 "2021-08-11T19:31:43Z")
![Screen Shot 2021-08-11 at 3.30.24 PM](https://us1.discourse-cdn.com/inductiveautomation/original/3X/f/d/fdf1b43d6722631603b009edec2cc88f0136dbde.png) ---
**Author:** ![MAz123](https://avatars.discourse-cdn.com/v4/letter/m/4da419/32.png) [@MAz123](https://forum.inductiveautomation.com/u/MAz123)\ **Post date:** [August 11, 2021, 7:34pm UTC](https://forum.inductiveautomation.com/t/new-feature-perspective-tooltips/49630/11 "2021-08-11T19:34:47Z")
thank you. But that does not answer my question. The "tooltipText’ existed in previous versions of Ignition. Apparently, version 8.1.9 has more options for the tooltip which I cannot find. ---
**Author:** ![WillMT10](https://avatars.discourse-cdn.com/v4/letter/w/7feea3/32.png) [@WillMT10](https://forum.inductiveautomation.com/u/WillMT10)\ **Post date:** [August 11, 2021, 7:40pm UTC](https://forum.inductiveautomation.com/t/new-feature-perspective-tooltips/49630/12 "2021-08-11T19:40:50Z")
Sorry, wasn’t sure what you meant by options. These might have been pushed to 8.1.10 due to 8.1.9 being changed to an emergency patch release for a regression in 8.1.8. @cmallonee? ---
**Author:** ![Kevin.Herron](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/kevin.herron/32/7259_2.png) [@Kevin.Herron](https://forum.inductiveautomation.com/u/Kevin.Herron)\ **Post date:** [August 11, 2021, 7:44pm UTC](https://forum.inductiveautomation.com/t/new-feature-perspective-tooltips/49630/13 "2021-08-11T19:44:14Z")
> [@WillMT10](#): > > These might have been pushed to 8.1.10 due to 8.1.9 being changed to an emergency patch release for a regression in 8.1.8. Yes, that's what it looks like. Tooltips were a part of the 8.1.9 nightly release, and that is now the 8.1.10 nightly release. ---
**Author:** ![cmallonee](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/cmallonee/32/6416_2.png) [@cmallonee](https://forum.inductiveautomation.com/u/cmallonee)\ **Post date:** [August 11, 2021, 7:50pm UTC](https://forum.inductiveautomation.com/t/new-feature-perspective-tooltips/49630/14 "2021-08-11T19:50:13Z")
Yes, this feature is part of 8.1.10. In addition, some of you have pointed out the "legacy" tooltip properties for some components. These legacy tooltips will continue to behave as they have in the past, and will not utilize any of the functionality in the META category. This was done in order to make sure that existing tooltips continued to behave as they have in the past. The last thing we wanted to do with this feature was force changes onto users already using tooltips. So if you already have a tooltip for a Numeric Entry Field via `NumericEntryField.props.tooltipText`, that tooltip will remain in place and it will look identical to how it did previously. If you want to change the tooltip to use the new features you will need to set `NumericEntryField.props.tooltipText` to an empty string before you can use the new features. ---
**Author:** ![MAz123](https://avatars.discourse-cdn.com/v4/letter/m/4da419/32.png) [@MAz123](https://forum.inductiveautomation.com/u/MAz123)\ **Post date:** [August 11, 2021, 7:54pm UTC](https://forum.inductiveautomation.com/t/new-feature-perspective-tooltips/49630/15 "2021-08-11T19:54:39Z")
Thank you! When will the stable version be released? Also, is there a way to add a newline ("\n") for the tooltipText? ---
**Author:** ![cmallonee](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/cmallonee/32/6416_2.png) [@cmallonee](https://forum.inductiveautomation.com/u/cmallonee)\ **Post date:** [August 11, 2021, 7:59pm UTC](https://forum.inductiveautomation.com/t/new-feature-perspective-tooltips/49630/16 "2021-08-11T19:59:40Z")
The stable release is slated for… early-mid September. As for line-breaks in the tooltip, there is no way to force a new line at a given point; the text is sent as one block. The tooltip does honor the width property if used, so a long sentence can be broken up into multiple lines if it is “longer” than the width allows - but there is no way to force the tooltip to line-break at a desired position. ---
**Author:** ![victordcq](https://avatars.discourse-cdn.com/v4/letter/v/f6c823/32.png) [@victordcq](https://forum.inductiveautomation.com/u/victordcq)\ **Post date:** [August 12, 2021, 8:50am UTC](https://forum.inductiveautomation.com/t/new-feature-perspective-tooltips/49630/17 "2021-08-12T08:50:54Z")
> [@cmallonee](#): > > no way to force the tooltip to line-break at a desired position you can tho with style: `white-space: pre` ![image](https://us1.discourse-cdn.com/inductiveautomation/original/3X/5/a/5a7a5c07d1f1a1791a0449a860cfeb1ce83814ff.png) ![image](https://us1.discourse-cdn.com/inductiveautomation/original/3X/1/7/17e2b9b8a2648657d88a77fb7632639c1fb3e51d.png) you will need to enter the editlong/multi text tho ![image](https://us1.discourse-cdn.com/inductiveautomation/original/3X/8/e/8e728c5065cba05393203d41e4fe8b5b699ad5c6.png) ---
**Author:** ![cmallonee](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/cmallonee/32/6416_2.png) [@cmallonee](https://forum.inductiveautomation.com/u/cmallonee)\ **Post date:** [August 12, 2021, 2:33pm UTC](https://forum.inductiveautomation.com/t/new-feature-perspective-tooltips/49630/18 "2021-08-12T14:33:23Z")
CSS to the rescue AGAIN. ---
**Author:** ![mperkins](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/mperkins/32/71722_2.png) [@mperkins](https://forum.inductiveautomation.com/u/mperkins)\ **Post date:** [August 12, 2021, 6:39pm UTC](https://forum.inductiveautomation.com/t/new-feature-perspective-tooltips/49630/19 "2021-08-12T18:39:22Z")
Pinned on August 12, 2021, 6:39pm UTC ---
**Author:** ![nminchin](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/nminchin/32/6911_2.png) [@nminchin](https://forum.inductiveautomation.com/u/nminchin)\ **Post date:** [August 13, 2021, 10:01am UTC](https://forum.inductiveautomation.com/t/new-feature-perspective-tooltips/49630/20 "2021-08-13T10:01:30Z")
I really need to go through every css property available and learn all the good ones. I thought I was almost there, but clearly not! 😅 Thanks for the share [Next page](https://forum.inductiveautomation.com/t/new-feature-perspective-tooltips/49630.md?page=2)