jquery-ui-rails 5.0.5 → 6.0.1

data/app/assets/javascripts/jquery-ui/{dialog.js → widgets/dialog.js}

@@ -1,50 +1,74 @@
-//= require jquery-ui/core
-//= require jquery-ui/widget
-//= require jquery-ui/button
-//= require jquery-ui/draggable
+//= require jquery-ui/widgets/button
+//= require jquery-ui/widgets/draggable
+//= require jquery-ui/widgets/mouse
+//= require jquery-ui/widgets/resizable
+//= require jquery-ui/focusable
+//= require jquery-ui/keycode
 //= require jquery-ui/position
-//= require jquery-ui/resizable
+//= require jquery-ui/safe-active-element
+//= require jquery-ui/safe-blur
+//= require jquery-ui/tabbable
+//= require jquery-ui/unique-id
+//= require jquery-ui/version
+//= require jquery-ui/widget
 
 /*!
- * jQuery UI Dialog 1.11.4
+ * jQuery UI Dialog 1.12.1
  * http://jqueryui.com
  *
  * Copyright jQuery Foundation and other contributors
  * Released under the MIT license.
  * http://jquery.org/license
- *
- * http://api.jqueryui.com/dialog/
  */
-(function( factory ) {
+
+//>>label: Dialog
+//>>group: Widgets
+//>>description: Displays customizable dialog windows.
+//>>docs: http://api.jqueryui.com/dialog/
+//>>demos: http://jqueryui.com/dialog/
+//>>css.structure: ../../themes/base/core.css
+//>>css.structure: ../../themes/base/dialog.css
+//>>css.theme: ../../themes/base/theme.css
+
+( function( factory ) {
 	if ( typeof define === "function" && define.amd ) {
 
 		// AMD. Register as an anonymous module.
-		define([
+		define( [
 			"jquery",
-			"./core",
-			"./widget",
 			"./button",
 			"./draggable",
 			"./mouse",
-			"./position",
-			"./resizable"
+			"./resizable",
+			"../focusable",
+			"../keycode",
+			"../position",
+			"../safe-active-element",
+			"../safe-blur",
+			"../tabbable",
+			"../unique-id",
+			"../version",
+			"../widget"
 		], factory );
 	} else {
 
 		// Browser globals
 		factory( jQuery );
 	}
-}(function( $ ) {
+}( function( $ ) {
 
-return $.widget( "ui.dialog", {
-	version: "1.11.4",
+$.widget( "ui.dialog", {
+	version: "1.12.1",
 	options: {
 		appendTo: "body",
 		autoOpen: true,
 		buttons: [],
+		classes: {
+			"ui-dialog": "ui-corner-all",
+			"ui-dialog-titlebar": "ui-corner-all"
+		},
 		closeOnEscape: true,
 		closeText: "Close",
-		dialogClass: "",
 		draggable: true,
 		hide: null,
 		height: "auto",
@@ -58,6 +82,7 @@ return $.widget( "ui.dialog", {
 			at: "center",
 			of: window,
 			collision: "fit",
+
 			// Ensure the titlebar is always visible
 			using: function( pos ) {
 				var topOffset = $( this ).css( pos ).offset().top;
@@ -71,7 +96,7 @@ return $.widget( "ui.dialog", {
 		title: null,
 		width: 300,
 
-		// callbacks
+		// Callbacks
 		beforeClose: null,
 		close: null,
 		drag: null,
@@ -114,16 +139,24 @@ return $.widget( "ui.dialog", {
 			index: this.element.parent().children().index( this.element )
 		};
 		this.originalTitle = this.element.attr( "title" );
-		this.options.title = this.options.title || this.originalTitle;
+		if ( this.options.title == null && this.originalTitle != null ) {
+			this.options.title = this.originalTitle;
+		}
+
+		// Dialogs can't be disabled
+		if ( this.options.disabled ) {
+			this.options.disabled = false;
+		}
 
 		this._createWrapper();
 
 		this.element
 			.show()
 			.removeAttr( "title" )
-			.addClass( "ui-dialog-content ui-widget-content" )
 			.appendTo( this.uiDialog );
 
+		this._addClass( "ui-dialog-content", "ui-widget-content" );
+
 		this._createTitlebar();
 		this._createButtonPane();
 
@@ -147,7 +180,7 @@ return $.widget( "ui.dialog", {
 
 	_appendTo: function() {
 		var element = this.options.appendTo;
-		if ( element && (element.jquery || element.nodeType) ) {
+		if ( element && ( element.jquery || element.nodeType ) ) {
 			return $( element );
 		}
 		return this.document.find( element || "body" ).eq( 0 );
@@ -162,18 +195,19 @@ return $.widget( "ui.dialog", {
 
 		this.element
 			.removeUniqueId()
-			.removeClass( "ui-dialog-content ui-widget-content" )
 			.css( this.originalCss )
+
 			// Without detaching first, the following becomes really slow
 			.detach();
 
-		this.uiDialog.stop( true, true ).remove();
+		this.uiDialog.remove();
 
 		if ( this.originalTitle ) {
 			this.element.attr( "title", this.originalTitle );
 		}
 
 		next = originalPosition.parent.children().eq( originalPosition.index );
+
 		// Don't try to place the dialog next to itself (#8613)
 		if ( next.length && next[ 0 ] !== this.element[ 0 ] ) {
 			next.before( this.element );
@@ -190,8 +224,7 @@ return $.widget( "ui.dialog", {
 	enable: $.noop,
 
 	close: function( event ) {
-		var activeElement,
-			that = this;
+		var that = this;
 
 		if ( !this._isOpen || this._trigger( "beforeClose", event ) === false ) {
 			return;
@@ -202,28 +235,17 @@ return $.widget( "ui.dialog", {
 		this._destroyOverlay();
 		this._untrackInstance();
 
-		if ( !this.opener.filter( ":focusable" ).focus().length ) {
-
-			// support: IE9
-			// IE9 throws an "Unspecified error" accessing document.activeElement from an <iframe>
-			try {
-				activeElement = this.document[ 0 ].activeElement;
-
-				// Support: IE9, IE10
-				// If the <body> is blurred, IE will switch windows, see #4520
-				if ( activeElement && activeElement.nodeName.toLowerCase() !== "body" ) {
+		if ( !this.opener.filter( ":focusable" ).trigger( "focus" ).length ) {
 
-					// Hiding a focused element doesn't trigger blur in WebKit
-					// so in case we have nothing to focus on, explicitly blur the active element
-					// https://bugs.webkit.org/show_bug.cgi?id=47182
-					$( activeElement ).blur();
-				}
-			} catch ( error ) {}
+			// Hiding a focused element doesn't trigger blur in WebKit
+			// so in case we have nothing to focus on, explicitly blur the active element
+			// https://bugs.webkit.org/show_bug.cgi?id=47182
+			$.ui.safeBlur( $.ui.safeActiveElement( this.document[ 0 ] ) );
 		}
 
 		this._hide( this.uiDialog, this.options.hide, function() {
 			that._trigger( "close", event );
-		});
+		} );
 	},
 
 	isOpen: function() {
@@ -236,9 +258,9 @@ return $.widget( "ui.dialog", {
 
 	_moveToTop: function( event, silent ) {
 		var moved = false,
-			zIndices = this.uiDialog.siblings( ".ui-front:visible" ).map(function() {
+			zIndices = this.uiDialog.siblings( ".ui-front:visible" ).map( function() {
 				return +$( this ).css( "z-index" );
-			}).get(),
+			} ).get(),
 			zIndexMax = Math.max.apply( null, zIndices );
 
 		if ( zIndexMax >= +this.uiDialog.css( "z-index" ) ) {
@@ -262,7 +284,7 @@ return $.widget( "ui.dialog", {
 		}
 
 		this._isOpen = true;
-		this.opener = $( this.document[ 0 ].activeElement );
+		this.opener = $( $.ui.safeActiveElement( this.document[ 0 ] ) );
 
 		this._size();
 		this._position();
@@ -279,7 +301,7 @@ return $.widget( "ui.dialog", {
 		this._show( this.uiDialog, this.options.show, function() {
 			that._focusTabbable();
 			that._trigger( "focus" );
-		});
+		} );
 
 		// Track the dialog immediately upon openening in case a focus event
 		// somehow occurs outside of the dialog before an element inside the
@@ -290,6 +312,7 @@ return $.widget( "ui.dialog", {
 	},
 
 	_focusTabbable: function() {
+
 		// Set focus to the first match:
 		// 1. An element that was focused previously
 		// 2. First element inside the dialog matching [autofocus]
@@ -313,20 +336,21 @@ return $.widget( "ui.dialog", {
 		if ( !hasFocus.length ) {
 			hasFocus = this.uiDialog;
 		}
-		hasFocus.eq( 0 ).focus();
+		hasFocus.eq( 0 ).trigger( "focus" );
 	},
 
 	_keepFocus: function( event ) {
 		function checkFocus() {
-			var activeElement = this.document[0].activeElement,
-				isActive = this.uiDialog[0] === activeElement ||
-					$.contains( this.uiDialog[0], activeElement );
+			var activeElement = $.ui.safeActiveElement( this.document[ 0 ] ),
+				isActive = this.uiDialog[ 0 ] === activeElement ||
+					$.contains( this.uiDialog[ 0 ], activeElement );
 			if ( !isActive ) {
 				this._focusTabbable();
 			}
 		}
 		event.preventDefault();
 		checkFocus.call( this );
+
 		// support: IE
 		// IE <= 8 doesn't prevent moving focus even with event.preventDefault()
 		// so we check again later
@@ -334,17 +358,17 @@ return $.widget( "ui.dialog", {
 	},
 
 	_createWrapper: function() {
-		this.uiDialog = $("<div>")
-			.addClass( "ui-dialog ui-widget ui-widget-content ui-corner-all ui-front " +
-				this.options.dialogClass )
+		this.uiDialog = $( "<div>" )
 			.hide()
-			.attr({
+			.attr( {
+
 				// Setting tabIndex makes the div focusable
 				tabIndex: -1,
 				role: "dialog"
-			})
+			} )
 			.appendTo( this._appendTo() );
 
+		this._addClass( this.uiDialog, "ui-dialog", "ui-widget ui-widget-content ui-front" );
 		this._on( this.uiDialog, {
 			keydown: function( event ) {
 				if ( this.options.closeOnEscape && !event.isDefaultPrevented() && event.keyCode &&
@@ -354,7 +378,7 @@ return $.widget( "ui.dialog", {
 					return;
 				}
 
-				// prevent tabbing out of dialogs
+				// Prevent tabbing out of dialogs
 				if ( event.keyCode !== $.ui.keyCode.TAB || event.isDefaultPrevented() ) {
 					return;
 				}
@@ -362,15 +386,17 @@ return $.widget( "ui.dialog", {
 					first = tabbables.filter( ":first" ),
 					last = tabbables.filter( ":last" );
 
-				if ( ( event.target === last[0] || event.target === this.uiDialog[0] ) && !event.shiftKey ) {
-					this._delay(function() {
-						first.focus();
-					});
+				if ( ( event.target === last[ 0 ] || event.target === this.uiDialog[ 0 ] ) &&
+						!event.shiftKey ) {
+					this._delay( function() {
+						first.trigger( "focus" );
+					} );
 					event.preventDefault();
-				} else if ( ( event.target === first[0] || event.target === this.uiDialog[0] ) && event.shiftKey ) {
-					this._delay(function() {
-						last.focus();
-					});
+				} else if ( ( event.target === first[ 0 ] ||
+						event.target === this.uiDialog[ 0 ] ) && event.shiftKey ) {
+					this._delay( function() {
+						last.trigger( "focus" );
+					} );
 					event.preventDefault();
 				}
 			},
@@ -379,81 +405,84 @@ return $.widget( "ui.dialog", {
 					this._focusTabbable();
 				}
 			}
-		});
+		} );
 
 		// We assume that any existing aria-describedby attribute means
 		// that the dialog content is marked up properly
 		// otherwise we brute force the content as the description
 		if ( !this.element.find( "[aria-describedby]" ).length ) {
-			this.uiDialog.attr({
+			this.uiDialog.attr( {
 				"aria-describedby": this.element.uniqueId().attr( "id" )
-			});
+			} );
 		}
 	},
 
 	_createTitlebar: function() {
 		var uiDialogTitle;
 
-		this.uiDialogTitlebar = $( "<div>" )
-			.addClass( "ui-dialog-titlebar ui-widget-header ui-corner-all ui-helper-clearfix" )
-			.prependTo( this.uiDialog );
+		this.uiDialogTitlebar = $( "<div>" );
+		this._addClass( this.uiDialogTitlebar,
+			"ui-dialog-titlebar", "ui-widget-header ui-helper-clearfix" );
 		this._on( this.uiDialogTitlebar, {
 			mousedown: function( event ) {
+
 				// Don't prevent click on close button (#8838)
 				// Focusing a dialog that is partially scrolled out of view
 				// causes the browser to scroll it into view, preventing the click event
 				if ( !$( event.target ).closest( ".ui-dialog-titlebar-close" ) ) {
+
 					// Dialog isn't getting focus when dragging (#8063)
-					this.uiDialog.focus();
+					this.uiDialog.trigger( "focus" );
 				}
 			}
-		});
+		} );
 
-		// support: IE
+		// Support: IE
 		// Use type="button" to prevent enter keypresses in textboxes from closing the
 		// dialog in IE (#9312)
 		this.uiDialogTitlebarClose = $( "<button type='button'></button>" )
-			.button({
-				label: this.options.closeText,
-				icons: {
-					primary: "ui-icon-closethick"
-				},
-				text: false
-			})
-			.addClass( "ui-dialog-titlebar-close" )
+			.button( {
+				label: $( "<a>" ).text( this.options.closeText ).html(),
+				icon: "ui-icon-closethick",
+				showLabel: false
+			} )
 			.appendTo( this.uiDialogTitlebar );
+
+		this._addClass( this.uiDialogTitlebarClose, "ui-dialog-titlebar-close" );
 		this._on( this.uiDialogTitlebarClose, {
 			click: function( event ) {
 				event.preventDefault();
 				this.close( event );
 			}
-		});
+		} );
 
-		uiDialogTitle = $( "<span>" )
-			.uniqueId()
-			.addClass( "ui-dialog-title" )
-			.prependTo( this.uiDialogTitlebar );
+		uiDialogTitle = $( "<span>" ).uniqueId().prependTo( this.uiDialogTitlebar );
+		this._addClass( uiDialogTitle, "ui-dialog-title" );
 		this._title( uiDialogTitle );
 
-		this.uiDialog.attr({
+		this.uiDialogTitlebar.prependTo( this.uiDialog );
+
+		this.uiDialog.attr( {
 			"aria-labelledby": uiDialogTitle.attr( "id" )
-		});
+		} );
 	},
 
 	_title: function( title ) {
-		if ( !this.options.title ) {
+		if ( this.options.title ) {
+			title.text( this.options.title );
+		} else {
 			title.html( "&#160;" );
 		}
-		title.text( this.options.title );
 	},
 
 	_createButtonPane: function() {
-		this.uiDialogButtonPane = $( "<div>" )
-			.addClass( "ui-dialog-buttonpane ui-widget-content ui-helper-clearfix" );
+		this.uiDialogButtonPane = $( "<div>" );
+		this._addClass( this.uiDialogButtonPane, "ui-dialog-buttonpane",
+			"ui-widget-content ui-helper-clearfix" );
 
 		this.uiButtonSet = $( "<div>" )
-			.addClass( "ui-dialog-buttonset" )
 			.appendTo( this.uiDialogButtonPane );
+		this._addClass( this.uiButtonSet, "ui-dialog-buttonset" );
 
 		this._createButtons();
 	},
@@ -462,12 +491,12 @@ return $.widget( "ui.dialog", {
 		var that = this,
 			buttons = this.options.buttons;
 
-		// if we already have a button pane, remove it
+		// If we already have a button pane, remove it
 		this.uiDialogButtonPane.remove();
 		this.uiButtonSet.empty();
 
-		if ( $.isEmptyObject( buttons ) || ($.isArray( buttons ) && !buttons.length) ) {
-			this.uiDialog.removeClass( "ui-dialog-buttons" );
+		if ( $.isEmptyObject( buttons ) || ( $.isArray( buttons ) && !buttons.length ) ) {
+			this._removeClass( this.uiDialog, "ui-dialog-buttons" );
 			return;
 		}
 
@@ -476,24 +505,41 @@ return $.widget( "ui.dialog", {
 			props = $.isFunction( props ) ?
 				{ click: props, text: name } :
 				props;
+
 			// Default to a non-submitting button
 			props = $.extend( { type: "button" }, props );
+
 			// Change the context for the click callback to be the main element
 			click = props.click;
-			props.click = function() {
-				click.apply( that.element[ 0 ], arguments );
-			};
 			buttonOptions = {
+				icon: props.icon,
+				iconPosition: props.iconPosition,
+				showLabel: props.showLabel,
+
+				// Deprecated options
 				icons: props.icons,
-				text: props.showText
+				text: props.text
 			};
+
+			delete props.click;
+			delete props.icon;
+			delete props.iconPosition;
+			delete props.showLabel;
+
+			// Deprecated options
 			delete props.icons;
-			delete props.showText;
+			if ( typeof props.text === "boolean" ) {
+				delete props.text;
+			}
+
 			$( "<button></button>", props )
 				.button( buttonOptions )
-				.appendTo( that.uiButtonSet );
-		});
-		this.uiDialog.addClass( "ui-dialog-buttons" );
+				.appendTo( that.uiButtonSet )
+				.on( "click", function() {
+					click.apply( that.element[ 0 ], arguments );
+				} );
+		} );
+		this._addClass( this.uiDialog, "ui-dialog-buttons" );
 		this.uiDialogButtonPane.appendTo( this.uiDialog );
 	},
 
@@ -508,12 +554,12 @@ return $.widget( "ui.dialog", {
 			};
 		}
 
-		this.uiDialog.draggable({
+		this.uiDialog.draggable( {
 			cancel: ".ui-dialog-content, .ui-dialog-titlebar-close",
 			handle: ".ui-dialog-titlebar",
 			containment: "document",
 			start: function( event, ui ) {
-				$( this ).addClass( "ui-dialog-dragging" );
+				that._addClass( $( this ), "ui-dialog-dragging" );
 				that._blockFrames();
 				that._trigger( "dragStart", event, filteredUi( ui ) );
 			},
@@ -526,26 +572,27 @@ return $.widget( "ui.dialog", {
 
 				options.position = {
 					my: "left top",
-					at: "left" + (left >= 0 ? "+" : "") + left + " " +
-						"top" + (top >= 0 ? "+" : "") + top,
+					at: "left" + ( left >= 0 ? "+" : "" ) + left + " " +
+						"top" + ( top >= 0 ? "+" : "" ) + top,
 					of: that.window
 				};
-				$( this ).removeClass( "ui-dialog-dragging" );
+				that._removeClass( $( this ), "ui-dialog-dragging" );
 				that._unblockFrames();
 				that._trigger( "dragStop", event, filteredUi( ui ) );
 			}
-		});
+		} );
 	},
 
 	_makeResizable: function() {
 		var that = this,
 			options = this.options,
 			handles = options.resizable,
+
 			// .ui-resizable has position: relative defined in the stylesheet
 			// but dialogs have to use absolute or fixed positioning
-			position = this.uiDialog.css("position"),
+			position = this.uiDialog.css( "position" ),
 			resizeHandles = typeof handles === "string" ?
-				handles	:
+				handles :
 				"n,e,s,w,se,sw,ne,nw";
 
 		function filteredUi( ui ) {
@@ -557,7 +604,7 @@ return $.widget( "ui.dialog", {
 			};
 		}
 
-		this.uiDialog.resizable({
+		this.uiDialog.resizable( {
 			cancel: ".ui-dialog-content",
 			containment: "document",
 			alsoResize: this.element,
@@ -567,7 +614,7 @@ return $.widget( "ui.dialog", {
 			minHeight: this._minHeight(),
 			handles: resizeHandles,
 			start: function( event, ui ) {
-				$( this ).addClass( "ui-dialog-resizing" );
+				that._addClass( $( this ), "ui-dialog-resizing" );
 				that._blockFrames();
 				that._trigger( "resizeStart", event, filteredUi( ui ) );
 			},
@@ -583,16 +630,16 @@ return $.widget( "ui.dialog", {
 				options.width = that.uiDialog.width();
 				options.position = {
 					my: "left top",
-					at: "left" + (left >= 0 ? "+" : "") + left + " " +
-						"top" + (top >= 0 ? "+" : "") + top,
+					at: "left" + ( left >= 0 ? "+" : "" ) + left + " " +
+						"top" + ( top >= 0 ? "+" : "" ) + top,
 					of: that.window
 				};
-				$( this ).removeClass( "ui-dialog-resizing" );
+				that._removeClass( $( this ), "ui-dialog-resizing" );
 				that._unblockFrames();
 				that._trigger( "resizeStop", event, filteredUi( ui ) );
 			}
-		})
-		.css( "position", position );
+		} )
+			.css( "position", position );
 	},
 
 	_trackFocus: function() {
@@ -601,7 +648,7 @@ return $.widget( "ui.dialog", {
 				this._makeFocusTarget();
 				this._focusedElement = $( event.target );
 			}
-		});
+		} );
 	},
 
 	_makeFocusTarget: function() {
@@ -635,6 +682,7 @@ return $.widget( "ui.dialog", {
 	},
 
 	_position: function() {
+
 		// Need to show the dialog to get the actual offset in the position plugin
 		var isVisible = this.uiDialog.is( ":visible" );
 		if ( !isVisible ) {
@@ -660,7 +708,7 @@ return $.widget( "ui.dialog", {
 			if ( key in that.resizableRelatedOptions ) {
 				resizableOptions[ key ] = value;
 			}
-		});
+		} );
 
 		if ( resize ) {
 			this._size();
@@ -675,12 +723,6 @@ return $.widget( "ui.dialog", {
 		var isDraggable, isResizable,
 			uiDialog = this.uiDialog;
 
-		if ( key === "dialogClass" ) {
-			uiDialog
-				.removeClass( this.options.dialogClass )
-				.addClass( value );
-		}
-
 		if ( key === "disabled" ) {
 			return;
 		}
@@ -696,10 +738,11 @@ return $.widget( "ui.dialog", {
 		}
 
 		if ( key === "closeText" ) {
-			this.uiDialogTitlebarClose.button({
+			this.uiDialogTitlebarClose.button( {
+
 				// Ensure that we always pass a string
-				label: "" + value
-			});
+				label: $( "<a>" ).text( "" + this.options.closeText ).html()
+			} );
 		}
 
 		if ( key === "draggable" ) {
@@ -718,18 +761,19 @@ return $.widget( "ui.dialog", {
 		}
 
 		if ( key === "resizable" ) {
+
 			// currently resizable, becoming non-resizable
 			isResizable = uiDialog.is( ":data(ui-resizable)" );
 			if ( isResizable && !value ) {
 				uiDialog.resizable( "destroy" );
 			}
 
-			// currently resizable, changing handles
+			// Currently resizable, changing handles
 			if ( isResizable && typeof value === "string" ) {
 				uiDialog.resizable( "option", "handles", value );
 			}
 
-			// currently non-resizable, becoming resizable
+			// Currently non-resizable, becoming resizable
 			if ( !isResizable && value !== false ) {
 				this._makeResizable();
 			}
@@ -741,29 +785,30 @@ return $.widget( "ui.dialog", {
 	},
 
 	_size: function() {
+
 		// If the user has resized the dialog, the .ui-dialog and .ui-dialog-content
 		// divs will both have width and height set, so we need to reset them
 		var nonContentHeight, minContentHeight, maxContentHeight,
 			options = this.options;
 
 		// Reset content sizing
-		this.element.show().css({
+		this.element.show().css( {
 			width: "auto",
 			minHeight: 0,
 			maxHeight: "none",
 			height: 0
-		});
+		} );
 
 		if ( options.minWidth > options.width ) {
 			options.width = options.minWidth;
 		}
 
-		// reset wrapper sizing
+		// Reset wrapper sizing
 		// determine the height of all the non-content elements
-		nonContentHeight = this.uiDialog.css({
-				height: "auto",
-				width: options.width
-			})
+		nonContentHeight = this.uiDialog.css( {
+			height: "auto",
+			width: options.width
+		} )
 			.outerHeight();
 		minContentHeight = Math.max( 0, options.minHeight - nonContentHeight );
 		maxContentHeight = typeof options.maxHeight === "number" ?
@@ -771,11 +816,11 @@ return $.widget( "ui.dialog", {
 			"none";
 
 		if ( options.height === "auto" ) {
-			this.element.css({
+			this.element.css( {
 				minHeight: minContentHeight,
 				maxHeight: maxContentHeight,
 				height: "auto"
-			});
+			} );
 		} else {
 			this.element.height( Math.max( 0, options.height - nonContentHeight ) );
 		}
@@ -786,18 +831,18 @@ return $.widget( "ui.dialog", {
 	},
 
 	_blockFrames: function() {
-		this.iframeBlocks = this.document.find( "iframe" ).map(function() {
+		this.iframeBlocks = this.document.find( "iframe" ).map( function() {
 			var iframe = $( this );
 
 			return $( "<div>" )
-				.css({
+				.css( {
 					position: "absolute",
 					width: iframe.outerWidth(),
 					height: iframe.outerHeight()
-				})
+				} )
 				.appendTo( iframe.parent() )
-				.offset( iframe.offset() )[0];
-		});
+				.offset( iframe.offset() )[ 0 ];
+		} );
 	},
 
 	_unblockFrames: function() {
@@ -825,9 +870,9 @@ return $.widget( "ui.dialog", {
 		// We use a delay in case the overlay is created from an
 		// event that we're going to be cancelling (#2804)
 		var isOpening = true;
-		this._delay(function() {
+		this._delay( function() {
 			isOpening = false;
-		});
+		} );
 
 		if ( !this.document.data( "ui-dialog-overlays" ) ) {
 
@@ -845,17 +890,18 @@ return $.widget( "ui.dialog", {
 						this._trackingInstances()[ 0 ]._focusTabbable();
 					}
 				}
-			});
+			} );
 		}
 
 		this.overlay = $( "<div>" )
-			.addClass( "ui-widget-overlay ui-front" )
 			.appendTo( this._appendTo() );
+
+		this._addClass( this.overlay, null, "ui-widget-overlay ui-front" );
 		this._on( this.overlay, {
 			mousedown: "_keepFocus"
-		});
+		} );
 		this.document.data( "ui-dialog-overlays",
-			(this.document.data( "ui-dialog-overlays" ) || 0) + 1 );
+			( this.document.data( "ui-dialog-overlays" ) || 0 ) + 1 );
 	},
 
 	_destroyOverlay: function() {
@@ -867,9 +913,8 @@ return $.widget( "ui.dialog", {
 			var overlays = this.document.data( "ui-dialog-overlays" ) - 1;
 
 			if ( !overlays ) {
-				this.document
-					.unbind( "focusin" )
-					.removeData( "ui-dialog-overlays" );
+				this._off( this.document, "focusin" );
+				this.document.removeData( "ui-dialog-overlays" );
 			} else {
 				this.document.data( "ui-dialog-overlays", overlays );
 			}
@@ -878,6 +923,32 @@ return $.widget( "ui.dialog", {
 			this.overlay = null;
 		}
 	}
-});
+} );
+
+// DEPRECATED
+// TODO: switch return back to widget declaration at top of file when this is removed
+if ( $.uiBackCompat !== false ) {
+
+	// Backcompat for dialogClass option
+	$.widget( "ui.dialog", $.ui.dialog, {
+		options: {
+			dialogClass: ""
+		},
+		_createWrapper: function() {
+			this._super();
+			this.uiDialog.addClass( this.options.dialogClass );
+		},
+		_setOption: function( key, value ) {
+			if ( key === "dialogClass" ) {
+				this.uiDialog
+					.removeClass( this.options.dialogClass )
+					.addClass( value );
+			}
+			this._superApply( arguments );
+		}
+	} );
+}
+
+return $.ui.dialog;
 
-}));
+} ) );