Tooltip: Add classes option

Ref #7053
Ref gh-1411

1 files changed, 30 insertions, 11 deletions

diff --git a/ui/tooltip.js b/ui/tooltip.js
index 2c28cc073..5708015d9 100644
--- a/ui/tooltip.js
+++ b/ui/tooltip.js
@@ -33,9 +33,12 @@
 	}
 }(function( $ ) {
 
-return $.widget( "ui.tooltip", {
+$.widget( "ui.tooltip", {
 	version: "@VERSION",
 	options: {
+		classes: {
+			"ui-tooltip": "ui-corner-all ui-widget-shadow"
+		},
 		content: function() {
 			// support: IE<9, Opera in jQuery <1.7
 			// .text() can't accept undefined, so coerce to a string
@@ -52,7 +55,6 @@ return $.widget( "ui.tooltip", {
 			collision: "flipfit flip"
 		},
 		show: true,
-		tooltipClass: null,
 		track: false,
 
 		// callbacks
@@ -109,8 +111,8 @@ return $.widget( "ui.tooltip", {
 				"aria-live": "assertive",
 				"aria-relevant": "additions"
 			})
-			.addClass( "ui-helper-hidden-accessible" )
 			.appendTo( this.document[ 0 ].body );
+		this._addClass( this.liveRegion, null, "ui-helper-hidden-accessible" );
 	},
 
 	_setOption: function( key, value ) {
@@ -419,16 +421,12 @@ return $.widget( "ui.tooltip", {
 	},
 
 	_tooltip: function( element ) {
-		var tooltip = $( "<div>" )
-				.attr( "role", "tooltip" )
-				// TODO move to classes option
-				.addClass( "ui-tooltip ui-widget ui-widget-shadow ui-corner-all ui-widget-content " +
-					( this.options.tooltipClass || "" ) ),
+		var tooltip = $( "<div>" ).attr( "role", "tooltip" ),
+			content = $( "<div>" ).appendTo( tooltip ),
 			id = tooltip.uniqueId().attr( "id" );
 
-		$( "<div>" )
-			.addClass( "ui-tooltip-content" )
-			.appendTo( tooltip );
+		this._addClass( content, "ui-tooltip-content" );
+		this._addClass( tooltip, "ui-tooltip", "ui-widget ui-widget-content" );
 
 		tooltip.appendTo( this.document[0].body );
 
@@ -476,4 +474,25 @@ return $.widget( "ui.tooltip", {
 	}
 });
 
+// DEPRECATED
+// TODO: Switch return back to widget declaration at top of file when this is removed
+if ( $.uiBackCompat !== false ) {
+
+	// Backcompat for tooltipClass option
+	$.widget( "ui.tooltip", $.ui.tooltip, {
+		options: {
+			tooltipClass: null
+		},
+		_tooltip: function() {
+			var tooltipData = this._superApply( arguments );
+			if ( this.options.tooltipClass ) {
+				tooltipData.tooltip.addClass( this.options.tooltipClass );
+			}
+			return tooltipData;
+		}
+	});
+}
+
+return $.ui.tooltip;
+
 }));