NIconButton: added native tooltip handling

Modules/Bar/Bar.qml

@@ -83,8 +83,8 @@ Variants {
 
         NIconButton {
           id: demoPanelToggle
-
           icon: "experiment"
+          tooltipText: "Open demo panel"
           anchors.verticalCenter: parent.verticalCenter
           onClicked: function () {
             demoPanel.isLoaded = !demoPanel.isLoaded
@@ -93,8 +93,8 @@ Variants {
 
         NIconButton {
           id: sidePanelToggle
-
           icon: "widgets"
+          tooltipText: "Open side panel"
           anchors.verticalCenter: parent.verticalCenter
           onClicked: function () {
             // Map this button's center to the screen and open the side panel below it

Modules/Bar/Battery.qml

@@ -60,7 +60,7 @@ NPill {
 
     if (testMode) {
       lines.push("Time left: " + Time.formatVagueHumanReadableDuration(12345))
-      return lines.join("\n");
+      return lines.join("\n")
     }
 
     if (!root.isReady) {

Modules/DemoPanel/DemoPanel.qml

@@ -52,18 +52,6 @@ NLoader {
             NIconButton {
               id: myIconButton
               icon: "refresh"
-              onEntered: function () {
-                myTooltip.show()
-              }
-              onExited: function () {
-                myTooltip.hide()
-              }
-            }
-            NTooltip {
-              id: myTooltip
-              target: myIconButton
-              positionAbove: false
-              text: "Hello world"
             }
 
             NDivider {
@@ -74,9 +62,8 @@ NLoader {
           // NToggle
           ColumnLayout {
             spacing: Style.marginLarge * scaling
-            uniformCellSizes: true
             NText {
-              text: "NToggle + NTooltip"
+              text: "NToggle"
               color: Colors.accentSecondary
             }
 

Widgets/NIconButton.qml

@@ -11,6 +11,7 @@ Rectangle {
   property real sizeMultiplier: 0.8
   property real size: Style.baseWidgetSize * sizeMultiplier * scaling
   property string icon
+  property string tooltipText
   property bool enabled: true
   property bool hovering: false
   property var onEntered: function () {}
@@ -37,16 +38,29 @@ Rectangle {
     opacity: root.enabled ? Style.opacityFull : Style.opacityMedium
   }
 
+  NTooltip {
+    id: tooltip
+    target: root
+    positionAbove: false
+    text: root.tooltipText
+  }
+
   MouseArea {
     anchors.fill: parent
     cursorShape: Qt.PointingHandCursor
     hoverEnabled: true
     onEntered: {
       hovering = true
+      if (tooltipText) {
+        tooltip.show()
+      }
       root.onEntered()
     }
     onExited: {
       hovering = false
+      if (tooltipText) {
+        tooltip.hide()
+      }
       root.onExited()
     }
     onClicked: {