From 7b863023491649f5c7e17cdc62c96cbde04cc85c Mon Sep 17 00:00:00 2001
From: Tosh Goodson <tosh.goodson@gmail.com>
Date: Thu, 3 Oct 2019 23:49:52 -0700
Subject: [PATCH] Add 'order' option to Col

---
 index.d.ts                  | 1 +
 src/Col/index.js            | 2 ++
 src/Col/index.md            | 2 +-
 src/Col/tests/index.test.js | 5 +++--
 src/Row/index.md            | 2 +-
 5 files changed, 8 insertions(+), 4 deletions(-)

diff --git a/index.d.ts b/index.d.ts
index 02fb23995..b422687b6 100644
--- a/index.d.ts
+++ b/index.d.ts
@@ -394,6 +394,7 @@ declare module '@bootstrap-styled/v4' {
         push?: number | string;
         pull?: number | string;
         offset?: number | string;
+        order?: number | string;
       });
 
   export type ColProps = {
diff --git a/src/Col/index.js b/src/Col/index.js
index a996e9ac0..aaf2f4506 100644
--- a/src/Col/index.js
+++ b/src/Col/index.js
@@ -18,6 +18,7 @@ const columnProps = PropTypes.oneOfType([
     push: stringOrNumberProp,
     pull: stringOrNumberProp,
     offset: stringOrNumberProp,
+    order: stringOrNumberProp,
   }),
 ]);
 
@@ -119,6 +120,7 @@ class ColUnstyled extends React.Component { // eslint-disable-line react/prefer-
           [`push${colSizeInterfix}${columnProp.push}`]: columnProp.push,
           [`pull${colSizeInterfix}${columnProp.pull}`]: columnProp.pull,
           [`offset${colSizeInterfix}${columnProp.offset}`]: columnProp.offset,
+          [`order${colSizeInterfix}${columnProp.order}`]: columnProp.order,
         })), cssModule);
       } else {
         colClass = getColumnSizeClass(isXs, colWidth, columnProp);
diff --git a/src/Col/index.md b/src/Col/index.md
index 8b699db37..cbb0d66d0 100644
--- a/src/Col/index.md
+++ b/src/Col/index.md
@@ -16,7 +16,7 @@ import { Col, Row } from '$PACKAGE_NAME';
 </Row>
 ```
 
-You can use `offset`, `size`, `push`, `pull` modifier on any `Col` component:
+You can use `offset`, `order`, `size`, `push`, `pull` modifier on any `Col` component:
 
 ```js
 import { Col, Row } from '$PACKAGE_NAME';
diff --git a/src/Col/tests/index.test.js b/src/Col/tests/index.test.js
index 6defb5581..b25e2642e 100644
--- a/src/Col/tests/index.test.js
+++ b/src/Col/tests/index.test.js
@@ -83,16 +83,17 @@ describe('<Col />', () => {
     });
     expect(renderedComponent.find('div').at(1).hasClass('col-md-auto')).toEqual(true);
   });
-  it('should have a classes .col .col-sm-6 .sm-push-2 .sm-pull-2 .sm-offset-2', () => {
+  it('should have a classes .col .col-sm-6 .sm-push-2 .sm-pull-2 .sm-offset-1 .sm-order-2', () => {
     const renderedComponent = renderComponentUsingTheme({
       sm: {
-        size: 6, push: 2, pull: 2, offset: 1,
+        size: 6, push: 2, pull: 2, offset: 1, order: 2,
       },
     });
     expect(renderedComponent.find('div').at(1).hasClass('col-sm-6')).toEqual(true);
     expect(renderedComponent.find('div').at(1).hasClass('push-sm-2')).toEqual(true);
     expect(renderedComponent.find('div').at(1).hasClass('pull-sm-2')).toEqual(true);
     expect(renderedComponent.find('div').at(1).hasClass('offset-sm-1')).toEqual(true);
+    expect(renderedComponent.find('div').at(1).hasClass('order-sm-2')).toEqual(true);
   });
   it('should have children with a theme', () => {
     const renderedComponent = renderComponentUsingTheme({
diff --git a/src/Row/index.md b/src/Row/index.md
index 432037293..78920e170 100644
--- a/src/Row/index.md
+++ b/src/Row/index.md
@@ -19,7 +19,7 @@ import {
 </Row>
 ```
 
-You can use `offset`, `size`, `push`, `pull` modifier on any `Col` component:
+You can use `offset`, `order`, `size`, `push`, `pull` modifier on any `Col` component:
 
 ```js
 import { Col, Row } from '$PACKAGE_NAME';