From d3f1264a53ffb2701fccccc8f044c3bf634279b5 Mon Sep 17 00:00:00 2001
From: Brett Mason <brettsmason@gmail.com>
Date: Mon, 28 Nov 2016 20:08:01 +0000
Subject: [PATCH] Remove position option from the JavaScript as its no longer
 needed or used.

---
 js/foundation.offcanvas.js             |  7 -------
 test/visual/offcanvas/all-options.html | 22 +++++++++++-----------
 test/visual/offcanvas/reveal.html      |  2 +-
 test/visual/offcanvas/sticky.html      | 22 +++++++++++-----------
 4 files changed, 23 insertions(+), 30 deletions(-)

diff --git a/js/foundation.offcanvas.js b/js/foundation.offcanvas.js
index 08347c6b5..c71f2218f 100644
--- a/js/foundation.offcanvas.js
+++ b/js/foundation.offcanvas.js
@@ -344,13 +344,6 @@ OffCanvas.defaults = {
    */
   transition: 'push',
 
-  /**
-   * Direction the offcanvas opens from. Determines class applied to body.
-   * @option
-   * @example left
-   */
-  position: 'left',
-
   /**
    * Force the page to scroll to top or bottom on open.
    * @option
diff --git a/test/visual/offcanvas/all-options.html b/test/visual/offcanvas/all-options.html
index 5d9fac714..f4820103f 100644
--- a/test/visual/offcanvas/all-options.html
+++ b/test/visual/offcanvas/all-options.html
@@ -19,77 +19,77 @@
         <h3>This is a left off-canvas panel</h3>
       </div>
 
-      <div class="off-canvas position-right" id="offCanvasRight" data-off-canvas data-position="right">
+      <div class="off-canvas position-right" id="offCanvasRight" data-off-canvas>
         <button class="close-button" aria-label="Close panel" type="button" data-close>
           <span aria-hidden="true">&times;</span>
         </button>
         <h3>This is a right off-canvas panel</h3>
       </div>
 
-      <div class="off-canvas position-top" id="offCanvasTop" data-off-canvas data-position="top">
+      <div class="off-canvas position-top" id="offCanvasTop" data-off-canvas>
         <button class="close-button" aria-label="Close panel" type="button" data-close>
           <span aria-hidden="true">&times;</span>
         </button>
         <h3>This is a top off-canvas panel</h3>
       </div>
 
-      <div class="off-canvas position-bottom" id="offCanvasBottom" data-off-canvas data-position="bottom">
+      <div class="off-canvas position-bottom" id="offCanvasBottom" data-off-canvas>
         <button class="close-button" aria-label="Close panel" type="button" data-close>
           <span aria-hidden="true">&times;</span>
         </button>
         <h3>This is a bottom off-canvas panel</h3>
       </div>
 
-      <div class="off-canvas position-left" id="offCanvasLeftOverlap" data-off-canvas data-position="left" data-transition="overlap">
+      <div class="off-canvas position-left" id="offCanvasLeftOverlap" data-off-canvas data-transition="overlap">
         <button class="close-button" aria-label="Close panel" type="button" data-close>
           <span aria-hidden="true">&times;</span>
         </button>
         <h3>This is a left off-canvas panel with 'overlap' transition</h3>
       </div>
 
-      <div class="off-canvas position-right" id="offCanvasRightOverlap" data-off-canvas data-position="right" data-transition="overlap">
+      <div class="off-canvas position-right" id="offCanvasRightOverlap" data-off-canvas data-transition="overlap">
         <button class="close-button" aria-label="Close panel" type="button" data-close>
           <span aria-hidden="true">&times;</span>
         </button>
         <h3>This is a right off-canvas panel with 'overlap' transition</h3>
       </div>
 
-      <div class="off-canvas position-top" id="offCanvasTopOverlap" data-off-canvas data-position="top" data-transition="overlap">
+      <div class="off-canvas position-top" id="offCanvasTopOverlap" data-off-canvas data-transition="overlap">
         <button class="close-button" aria-label="Close panel" type="button" data-close>
           <span aria-hidden="true">&times;</span>
         </button>
         <h3>This is a top off-canvas panel with 'overlap' transition</h3>
       </div>
 
-      <div class="off-canvas position-bottom" id="offCanvasBottomOverlap" data-off-canvas data-position="bottom" data-transition="overlap">
+      <div class="off-canvas position-bottom" id="offCanvasBottomOverlap" data-off-canvas data-transition="overlap">
         <button class="close-button" aria-label="Close panel" type="button" data-close>
           <span aria-hidden="true">&times;</span>
         </button>
         <h3>This is a bottom off-canvas panel with 'overlap' transition</h3>
       </div>
 
-      <div class="off-canvas position-top" id="offCanvasForceTop" data-off-canvas data-position="top" data-force-to="top">
+      <div class="off-canvas position-top" id="offCanvasForceTop" data-off-canvas data-force-to="top">
         <button class="close-button" aria-label="Close panel" type="button" data-close>
           <span aria-hidden="true">&times;</span>
         </button>
         <h3>This is a top off-canvas panel with force-to set to top</h3>
       </div>
 
-      <div class="off-canvas position-bottom" id="offCanvasForceBottom" data-off-canvas data-position="bottom" data-force-to="bottom">
+      <div class="off-canvas position-bottom" id="offCanvasForceBottom" data-off-canvas data-force-to="bottom">
         <button class="close-button" aria-label="Close panel" type="button" data-close>
           <span aria-hidden="true">&times;</span>
         </button>
         <h3>This is a bottom off-canvas panel with force-to set to bottom</h3>
       </div>
 
-      <div class="off-canvas position-left" id="noOverlay" data-off-canvas data-position="left" data-content-overlay="false">
+      <div class="off-canvas position-left" id="noOverlay" data-off-canvas data-content-overlay="false">
         <button class="close-button" aria-label="Close panel" type="button" data-close>
           <span aria-hidden="true">&times;</span>
         </button>
         <h3>This is a left off-canvas panel with no content overlay. You can still click the content to close me.</h3>
       </div>
 
-      <div class="off-canvas position-right" id="noCloseOnClick" data-off-canvas data-position="right" data-close-on-click="false">
+      <div class="off-canvas position-right" id="noCloseOnClick" data-off-canvas data-close-on-click="false">
         <button class="close-button" aria-label="Close panel" type="button" data-close>
           <span aria-hidden="true">&times;</span>
         </button>
diff --git a/test/visual/offcanvas/reveal.html b/test/visual/offcanvas/reveal.html
index 36e056eb3..7cddb777f 100644
--- a/test/visual/offcanvas/reveal.html
+++ b/test/visual/offcanvas/reveal.html
@@ -19,7 +19,7 @@
         <h3>This is a left off-canvas panel. It should reveal on large and up screens.</h3>
       </div>
 
-      <div class="off-canvas position-right reveal-for-medium" id="offCanvasRight" data-off-canvas data-position="right">
+      <div class="off-canvas position-right reveal-for-medium" id="offCanvasRight" data-off-canvas>
         <button class="close-button" aria-label="Close panel" type="button" data-close>
           <span aria-hidden="true">&times;</span>
         </button>
diff --git a/test/visual/offcanvas/sticky.html b/test/visual/offcanvas/sticky.html
index 56f00cd40..6fb78ee59 100644
--- a/test/visual/offcanvas/sticky.html
+++ b/test/visual/offcanvas/sticky.html
@@ -18,77 +18,77 @@
         <h3>This is a left off-canvas panel</h3>
       </div>
 
-      <div class="off-canvas position-right" id="offCanvasRight" data-off-canvas data-position="right">
+      <div class="off-canvas position-right" id="offCanvasRight" data-off-canvas>
         <button class="close-button" aria-label="Close panel" type="button" data-close>
           <span aria-hidden="true">&times;</span>
         </button>
         <h3>This is a right off-canvas panel</h3>
       </div>
 
-      <div class="off-canvas position-top" id="offCanvasTop" data-off-canvas data-position="top">
+      <div class="off-canvas position-top" id="offCanvasTop" data-off-canvas>
         <button class="close-button" aria-label="Close panel" type="button" data-close>
           <span aria-hidden="true">&times;</span>
         </button>
         <h3>This is a top off-canvas panel</h3>
       </div>
 
-      <div class="off-canvas position-bottom" id="offCanvasBottom" data-off-canvas data-position="bottom">
+      <div class="off-canvas position-bottom" id="offCanvasBottom" data-off-canvas>
         <button class="close-button" aria-label="Close panel" type="button" data-close>
           <span aria-hidden="true">&times;</span>
         </button>
         <h3>This is a bottom off-canvas panel</h3>
       </div>
 
-      <div class="off-canvas position-left" id="offCanvasLeftOverlap" data-off-canvas data-position="left" data-transition="overlap">
+      <div class="off-canvas position-left" id="offCanvasLeftOverlap" data-off-canvas data-transition="overlap">
         <button class="close-button" aria-label="Close panel" type="button" data-close>
           <span aria-hidden="true">&times;</span>
         </button>
         <h3>This is a left off-canvas panel with 'overlap' transition</h3>
       </div>
 
-      <div class="off-canvas position-right" id="offCanvasRightOverlap" data-off-canvas data-position="right" data-transition="overlap">
+      <div class="off-canvas position-right" id="offCanvasRightOverlap" data-off-canvas data-transition="overlap">
         <button class="close-button" aria-label="Close panel" type="button" data-close>
           <span aria-hidden="true">&times;</span>
         </button>
         <h3>This is a right off-canvas panel with 'overlap' transition</h3>
       </div>
 
-      <div class="off-canvas position-top" id="offCanvasTopOverlap" data-off-canvas data-position="top" data-transition="overlap">
+      <div class="off-canvas position-top" id="offCanvasTopOverlap" data-off-canvas data-transition="overlap">
         <button class="close-button" aria-label="Close panel" type="button" data-close>
           <span aria-hidden="true">&times;</span>
         </button>
         <h3>This is a top off-canvas panel with 'overlap' transition</h3>
       </div>
 
-      <div class="off-canvas position-bottom" id="offCanvasBottomOverlap" data-off-canvas data-position="bottom" data-transition="overlap">
+      <div class="off-canvas position-bottom" id="offCanvasBottomOverlap" data-off-canvas data-transition="overlap">
         <button class="close-button" aria-label="Close panel" type="button" data-close>
           <span aria-hidden="true">&times;</span>
         </button>
         <h3>This is a bottom off-canvas panel with 'overlap' transition</h3>
       </div>
 
-      <div class="off-canvas position-top" id="offCanvasForceTop" data-off-canvas data-position="top" data-force-to="top">
+      <div class="off-canvas position-top" id="offCanvasForceTop" data-off-canvas data-force-to="top">
         <button class="close-button" aria-label="Close panel" type="button" data-close>
           <span aria-hidden="true">&times;</span>
         </button>
         <h3>This is a top off-canvas panel with force-to set to top</h3>
       </div>
 
-      <div class="off-canvas position-bottom" id="offCanvasForceBottom" data-off-canvas data-position="bottom" data-force-to="bottom">
+      <div class="off-canvas position-bottom" id="offCanvasForceBottom" data-off-canvas data-force-to="bottom">
         <button class="close-button" aria-label="Close panel" type="button" data-close>
           <span aria-hidden="true">&times;</span>
         </button>
         <h3>This is a bottom off-canvas panel with force-to set to bottom</h3>
       </div>
 
-      <div class="off-canvas position-left" id="noOverlay" data-off-canvas data-position="left" data-content-overlay="false">
+      <div class="off-canvas position-left" id="noOverlay" data-off-canvas data-content-overlay="false">
         <button class="close-button" aria-label="Close panel" type="button" data-close>
           <span aria-hidden="true">&times;</span>
         </button>
         <h3>This is a left off-canvas panel with no content overlay. You can still click the content to close me.</h3>
       </div>
 
-      <div class="off-canvas position-right" id="noCloseOnClick" data-off-canvas data-position="right" data-close-on-click="false">
+      <div class="off-canvas position-right" id="noCloseOnClick" data-off-canvas data-close-on-click="false">
         <button class="close-button" aria-label="Close panel" type="button" data-close>
           <span aria-hidden="true">&times;</span>
         </button>
-- 
2.47.3