Add addModalPanel to atom.workspace.

spec/panel-element-spec.coffee

@@ -54,3 +54,12 @@ describe "PanelElement", ->
 
       panel.show()
       expect(element.style.display).not.toBe 'none'
+
+  describe "when a class name is specified", ->
+    it 'initially renders panel created with visibile: false', ->
+      panel = new Panel({viewRegistry, className: 'some classes', item: new TestPanelItem})
+      element = panel.getView()
+      jasmineContent.appendChild(element)
+
+      expect(element).toHaveClass 'some'
+      expect(element).toHaveClass 'classes'

spec/workspace-spec.coffee

@@ -492,3 +492,12 @@ describe "Workspace", ->
 
         expect(panel).toBeDefined()
         expect(addPanelSpy).toHaveBeenCalledWith({panel, index: 0})
+
+    describe '::addModalPanel(model)', ->
+      it 'adds a panel to the correct panel container', ->
+        atom.workspace.panelContainers.modal.onDidAddPanel addPanelSpy = jasmine.createSpy()
+        panel = atom.workspace.addModalPanel(item: new TestPanel())
+
+        expect(panel).toBeDefined()
+        expect(addPanelSpy).toHaveBeenCalledWith({panel, index: 0})
+        expect(panel.getClassName()).toBe 'overlay from-top' # the default

spec/workspace-view-spec.coffee

@@ -286,3 +286,6 @@ describe "WorkspaceView", ->
       bottomContainer = workspaceElement.querySelector('atom-panel-container[location="bottom"]')
       expect(topContainer.nextSibling).toBe workspaceElement.paneContainer
       expect(bottomContainer.previousSibling).toBe workspaceElement.paneContainer
+
+      modalContainer = workspaceElement.querySelector('atom-panel-container[location="modal"]')
+      expect(modalContainer.parentNode).toBe workspaceElement

src/panel-element.coffee

@@ -12,6 +12,7 @@ class PanelElement extends HTMLElement
     @appendChild(view)
     callAttachHooks(view) # for backward compatibility with SpacePen views
 
+    @classList.add(@model.getClassName().split(' ')...) if @model.getClassName()?
     @subscriptions.add @model.onDidChangeVisible(@visibleChanged.bind(this))
     @subscriptions.add @model.onDidDestroy(@destroyed.bind(this))
 

src/panel.coffee

@@ -14,7 +14,7 @@ class Panel
   Section: Construction and Destruction
   ###
 
-  constructor: ({@viewRegistry, @item, @visible, @priority}) ->
+  constructor: ({@viewRegistry, @item, @visible, @priority, @className}) ->
     @emitter = new Emitter
     @visible ?= true
     @priority ?= 100
@@ -62,6 +62,8 @@ class Panel
   # Public: Returns a {Number} indicating this panel's priority.
   getPriority: -> @priority
 
+  getClassName: -> @className
+
   # Public: Returns a {Boolean} true when the panel is visible.
   isVisible: -> @visible
 

src/workspace-element.coffee

@@ -77,6 +77,7 @@ class WorkspaceElement extends HTMLElement
       left: @model.panelContainers.left.getView()
       right: @model.panelContainers.right.getView()
       bottom: @model.panelContainers.bottom.getView()
+      modal: @model.panelContainers.modal.getView()
 
     @horizontalAxis.insertBefore(@panelContainers.left, @verticalAxis)
     @horizontalAxis.appendChild(@panelContainers.right)
@@ -84,6 +85,8 @@ class WorkspaceElement extends HTMLElement
     @verticalAxis.insertBefore(@panelContainers.top, @paneContainer)
     @verticalAxis.appendChild(@panelContainers.bottom)
 
+    @appendChild(@panelContainers.modal)
+
     @__spacePenView.setModel(@model)
 
   setTextEditorFontSize: (fontSize) ->

src/workspace.coffee

@@ -54,6 +54,7 @@ class Workspace extends Model
       left: new PanelContainer({viewRegistry, location: 'left'})
       right: new PanelContainer({viewRegistry, location: 'right'})
       bottom: new PanelContainer({viewRegistry, location: 'bottom'})
+      modal: new PanelContainer({viewRegistry, location: 'modal'})
 
     @subscribeToActiveItem()
 
@@ -660,6 +661,22 @@ class Workspace extends Model
   addTopPanel: (options) ->
     @addPanel('top', options)
 
+  # Essential: Adds a panel item as a modal dialog.
+  #
+  # * `options` {Object}
+  #   * `item` Your panel content. It can be DOM element, a jQuery element, or
+  #     a model with a view registered via {ViewRegistry::addViewProvider}. We recommend the
+  #     latter. See {ViewRegistry::addViewProvider} for more information.
+  #   * `visible` (optional) {Boolean} false if you want the panel to initially be hidden
+  #     (default: true)
+  #   * `priority` (optional) {Number} Determines stacking order. Lower priority items are
+  #     forced closer to the edges of the window. (default: 100)
+  #
+  # Returns a {Panel}
+  addModalPanel: (options={}) ->
+    options.className ?= 'overlay from-top'
+    @addPanel('modal', options)
+
   addPanel: (location, options) ->
     options ?= {}
     options.viewRegistry = atom.views