@imposium-hub/components 2.12.3 → 2.13.0-0

package/dist/styles.css

@@ -1023,6 +1023,7 @@ body a {
 .ip-table-wrapper .ip-table .ip-table-filter .filterable-cell-wrapper {
   display: flex;
   align-items: center;
+  justify-content: space-between;
 }
 .ip-table-wrapper .ip-table .ip-table-header .filterable-cell-wrapper,
 .ip-table-wrapper .ip-table .ip-table-filter .filterable-cell-wrapper {
@@ -1861,12 +1862,13 @@ body a {
 .imposium-header .inner-content .inner-right a {
   border: none;
 }
-.imposium-header .inner-content .inner-right .additional-buttons {
-  margin-right: 10px;
-}
-.imposium-header .inner-content .inner-right .additional-buttons .creativeMgrBtn {
+.imposium-header .inner-content .inner-right .creativeMgrBtn {
   position: relative;
   top: 1px;
+  margin-right: 10px;
+}
+.imposium-header .inner-content .inner-right .additional-buttons {
+  margin-right: 10px;
 }
 .imposium-header .inner-content .inner-right .btn-help {
   -webkit-touch-callout: none;
@@ -2340,7 +2342,20 @@ body a {
   height: 16px;
 }
 .publish-wizard {
+  display: flex;
+  flex-direction: column;
+  height: 100%;
   padding-top: 30px;
+  box-sizing: border-box;
+}
+.publish-wizard > div:first-of-type {
+  flex: 1;
+}
+.publish-wizard .lower-buttons {
+  margin-top: auto;
+  padding-bottom: 5px;
+  width: 100%;
+  text-align: center;
 }
 .publish-wizard .missingColumns {
   margin: 15px;
@@ -2405,12 +2420,6 @@ body a {
   box-sizing: border-box;
   background-color: #353535;
 }
-.publish-wizard .lower-buttons {
-  margin-top: 10px;
-  left: 0px;
-  width: 100%;
-  text-align: center;
-}
 .publish-wizard .link-wrapper {
   display: flex;
   flex-wrap: wrap;
@@ -2486,6 +2495,14 @@ body a {
   font-weight: bold;
   font-size: 14px;
 }
+.crm-publish-name {
+  background: #161616;
+  width: 100%;
+  padding-left: 5px;
+}
+.crm-publish-name.disabled {
+  opacity: 0.5;
+}
 .section {
   position: absolute;
   width: 100%;

package/dist/styles.less

@@ -1131,6 +1131,7 @@ body{
             .filterable-cell-wrapper {
                 display: flex;
                 align-items: center;
+                justify-content: space-between;
             }
 
             .filterable-cell-wrapper {
@@ -1866,13 +1867,14 @@ body{
                 border:none;
             }
 
-            .additional-buttons{
+            .creativeMgrBtn {
+                position: relative;
+                top: 1px;
                 margin-right:10px;
+            }
 
-                .creativeMgrBtn {
-                    position: relative;
-                    top: 1px;
-                }
+            .additional-buttons{
+                margin-right:10px;
             }
             
             .btn-help {
@@ -2236,8 +2238,22 @@ body{
 
 
 .publish-wizard{
-
-    padding-top:30px;
+    display: flex;
+    flex-direction: column;
+    height: 100%;
+    padding-top: 30px;
+    box-sizing: border-box;
+    
+    > div:first-of-type {
+        flex: 1;
+    }
+    
+    .lower-buttons {
+        margin-top: auto;
+        padding-bottom: 5px;
+        width: 100%;
+        text-align: center;
+    }
 
     .missingColumns{
         margin: 15px;
@@ -2310,13 +2326,6 @@ body{
         background-color: @backgroundLight;
     }
 
-    .lower-buttons{
-        margin-top:10px;
-        left:0px;
-        width:100%;
-        text-align: center;
-    }
-
     .link-wrapper{
         display: flex;
         flex-wrap: wrap;
@@ -2417,6 +2426,16 @@ body{
     }
 }
 
+.crm-publish-name{
+    background: @backgroundDark;
+    width: 100%;
+    padding-left: 5px;
+
+    &.disabled{
+       opacity: 0.5;
+    }
+}
+
 @sectionPadding:7px 5px 5px 5px;
 @sectionHeaderHeight:25px;
 @loaderHeight:6px;

package/less/components/data-table.less

@@ -82,6 +82,7 @@
             .filterable-cell-wrapper {
                 display: flex;
                 align-items: center;
+                justify-content: space-between;
             }
 
             .filterable-cell-wrapper {

package/less/components/header.less

@@ -193,13 +193,14 @@
                 border:none;
             }
 
-            .additional-buttons{
+            .creativeMgrBtn {
+                position: relative;
+                top: 1px;
                 margin-right:10px;
+            }
 
-                .creativeMgrBtn {
-                    position: relative;
-                    top: 1px;
-                }
+            .additional-buttons{
+                margin-right:10px;
             }
             
             .btn-help {

package/less/components/publish-wizard.less

@@ -1,7 +1,21 @@
 
 .publish-wizard{
-
-    padding-top:30px;
+    display: flex;
+    flex-direction: column;
+    height: 100%;
+    padding-top: 30px;
+    box-sizing: border-box;
+    
+    > div:first-of-type {
+        flex: 1;
+    }
+    
+    .lower-buttons {
+        margin-top: auto;
+        padding-bottom: 5px;
+        width: 100%;
+        text-align: center;
+    }
 
     .missingColumns{
         margin: 15px;
@@ -74,13 +88,6 @@
         background-color: @backgroundLight;
     }
 
-    .lower-buttons{
-        margin-top:10px;
-        left:0px;
-        width:100%;
-        text-align: center;
-    }
-
     .link-wrapper{
         display: flex;
         flex-wrap: wrap;
@@ -179,4 +186,14 @@
       font-weight: bold;
       font-size:14px;
     }
+}
+
+.crm-publish-name{
+    background: @backgroundDark;
+    width: 100%;
+    padding-left: 5px;
+
+    &.disabled{
+       opacity: 0.5;
+    }
 }

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@imposium-hub/components",
-    "version": "2.12.3",
+    "version": "2.13.0-0",
     "description": "React & Typescript component / asset library for Imposium front-ends",
     "main": "./dist/cjs/index.js",
     "module": "./dist/esm/index.js",

package/src/components/app-wrapper/AppWrapper.tsx

@@ -250,7 +250,7 @@ export const AppWrapper: React.FC<IAppWrapperProps> = (props) => {
             if (crmApi && crmBaseUrl) {
                 crmApi.init(crmBaseUrl, getAccessTokenSilently);
             }
-            api.getAccessData(false)
+            api.getAccessData(false, storyId)
                 .then((freshAccess: any) => {
                     props.setAccessData(freshAccess);
                     propagateCreds(freshAccess);
@@ -258,7 +258,7 @@ export const AppWrapper: React.FC<IAppWrapperProps> = (props) => {
                 .catch((e: Error) => {
                     setErrorState(APP_WRAPPER_ERROR_STATES.UNAUTHORIZED_ORG);
 
-                    // Attempt to get the access data again without the org ID, so we can at least shoe the user the org dropdown
+                    // Attempt to get the access data again without the org ID, so we can at least show the user the org dropdown
                     api.init(baseUrl, getAccessTokenSilently, null);
                     if (crmApi && crmBaseUrl) {
                         crmApi.init(crmBaseUrl, getAccessTokenSilently);

package/src/components/header/Header.tsx

@@ -544,11 +544,9 @@ class ImposiumHeader extends React.PureComponent<IHeaderProps, IHeaderState> {
                     </span>
 
                     <span className='inner-right'>
+                        {CrMLink}
                         {storyToggle}
-                        <div className='additional-buttons'>
-                            {additionalButtons}
-                            {CrMLink}
-                        </div>
+                        <div className='additional-buttons'>{additionalButtons}</div>
                         {accountDropdownToggle}
                         <a
                             href='https://support.flashtalking.com/hc/en-us/sections/25515903148819-Imposium'