@sproutsocial/racine 12.16.0 → 12.16.1

package/CHANGELOG.md

@@ -1,5 +1,11 @@
 # Change Log
 
+## 12.16.1
+
+### Patch Changes
+
+- 3cb36bf: This change fixes a bug where "px" was being appended to a number value when users were already including a pixel value. This was causing incorrect css syntax i.e. "16pxpx"
+
 ## 12.16.0
 
 ### Minor Changes
@@ -37,7 +43,7 @@
   - Added support for different logo types ie. `wordmark` or `lockup`
   - Added support for predefined sizes. ie. `mini`, `small`, `medium`, `large`, and `jumbo`.
   - The partner Logo now has a fixed width by default.
-  
+
 - 5613a5c: A new Advocacy icon has been added to the icon library
 
 ### Patch Changes

package/__flow__/PartnerLogo/index.js

@@ -50,8 +50,9 @@ const PartnerLogo = ({
 
   return (
     <Container
-      height={height ? height : defaultHeight}
-      width={width ? width : defaultWidth}
+      //we add pixels here because view box coordinates are numbers
+      height={height ? height : defaultHeight + "px"}
+      width={width ? width : defaultWidth + "px"}
       logoSize={size}
       // $FlowIssue - upgrade v0.112.0
       {...rest}

package/__flow__/PartnerLogo/index.stories.js

@@ -81,7 +81,7 @@ export const LogoLayout = (args: TypeProps) => (
   <Box display="flex" alignItems="stretch">
     <Box display="flex" alignItems="center" mr={600}>
       <PartnerLogo partnerName="facebook" mr={600} />
-      <PartnerLogo height="30" partnerName="microsoft-dynamics" mr={600} />
+      <PartnerLogo height="30px" partnerName="microsoft-dynamics" mr={600} />
       <PartnerLogo size="jumbo" partnerName="zendesk" />
     </Box>
     <Box display="flex" flexDirection="column" justifyContent="space-between">

package/__flow__/PartnerLogo/styles.js

@@ -13,11 +13,11 @@ const sizes = {
 };
 
 const stylesForSize = (height, width, logoSize) => css`
-  line-height: ${logoSize ? logoSize : height + "px"};
+  line-height: ${logoSize ? logoSize : height};
 
   &,
   .logo-svg {
-    height: ${logoSize ? logoSize : height + "px"};
+    height: ${logoSize ? logoSize : height};
     width: ${logoSize ? logoSize : ""};
   }
 
@@ -25,12 +25,12 @@ const stylesForSize = (height, width, logoSize) => css`
   /* stylelint-disable */
   _:-ms-fullscreen &,
   html & {
-    width: ${logoSize ? logoSize : width + "px"};
+    width: ${logoSize ? logoSize : width};
   }
 
   ${"" /* PDF hack, do not remove */}
   .pdf-page & {
-    width: ${logoSize ? logoSize : width + "px"};
+    width: ${logoSize ? logoSize : width};
   }
 `;
 

package/commonjs/PartnerLogo/index.js

@@ -50,9 +50,10 @@ var PartnerLogo = function PartnerLogo(_ref) {
   var viewBoxCoordinates = (logoViewBox == null ? void 0 : logoViewBox.split(" ")) || [];
   var defaultWidth = viewBoxCoordinates[2];
   var defaultHeight = viewBoxCoordinates[3];
-  return /*#__PURE__*/_react.default.createElement(_styles.default, _extends({
-    height: height ? height : defaultHeight,
-    width: width ? width : defaultWidth,
+  return /*#__PURE__*/_react.default.createElement(_styles.default //we add pixels here because view box coordinates are numbers
+  , _extends({
+    height: height ? height : defaultHeight + "px",
+    width: width ? width : defaultWidth + "px",
     logoSize: size // $FlowIssue - upgrade v0.112.0
 
   }, rest), /*#__PURE__*/_react.default.createElement("svg", _extends({

package/commonjs/PartnerLogo/styles.js

@@ -22,9 +22,9 @@ var sizes = {
 };
 
 var stylesForSize = function stylesForSize(height, width, logoSize) {
-  return (0, _styledComponents.css)(["line-height:", ";&,.logo-svg{height:", ";width:", ";}_:-ms-fullscreen &,html &{width:", ";}", " .pdf-page &{width:", ";}"], logoSize ? logoSize : height + "px", logoSize ? logoSize : height + "px", logoSize ? logoSize : "", logoSize ? logoSize : width + "px", ""
+  return (0, _styledComponents.css)(["line-height:", ";&,.logo-svg{height:", ";width:", ";}_:-ms-fullscreen &,html &{width:", ";}", " .pdf-page &{width:", ";}"], logoSize ? logoSize : height, logoSize ? logoSize : height, logoSize ? logoSize : "", logoSize ? logoSize : width, ""
   /* PDF hack, do not remove */
-  , logoSize ? logoSize : width + "px");
+  , logoSize ? logoSize : width);
 };
 
 var Container = _styledComponents.default.span.attrs({

package/lib/PartnerLogo/index.js

@@ -39,9 +39,10 @@ var PartnerLogo = function PartnerLogo(_ref) {
   var viewBoxCoordinates = (logoViewBox == null ? void 0 : logoViewBox.split(" ")) || [];
   var defaultWidth = viewBoxCoordinates[2];
   var defaultHeight = viewBoxCoordinates[3];
-  return /*#__PURE__*/React.createElement(Container, _extends({
-    height: height ? height : defaultHeight,
-    width: width ? width : defaultWidth,
+  return /*#__PURE__*/React.createElement(Container //we add pixels here because view box coordinates are numbers
+  , _extends({
+    height: height ? height : defaultHeight + "px",
+    width: width ? width : defaultWidth + "px",
     logoSize: size // $FlowIssue - upgrade v0.112.0
 
   }, rest), /*#__PURE__*/React.createElement("svg", _extends({

package/lib/PartnerLogo/styles.js

@@ -10,9 +10,9 @@ var sizes = {
 };
 
 var stylesForSize = function stylesForSize(height, width, logoSize) {
-  return css(["line-height:", ";&,.logo-svg{height:", ";width:", ";}_:-ms-fullscreen &,html &{width:", ";}", " .pdf-page &{width:", ";}"], logoSize ? logoSize : height + "px", logoSize ? logoSize : height + "px", logoSize ? logoSize : "", logoSize ? logoSize : width + "px", ""
+  return css(["line-height:", ";&,.logo-svg{height:", ";width:", ";}_:-ms-fullscreen &,html &{width:", ";}", " .pdf-page &{width:", ";}"], logoSize ? logoSize : height, logoSize ? logoSize : height, logoSize ? logoSize : "", logoSize ? logoSize : width, ""
   /* PDF hack, do not remove */
-  , logoSize ? logoSize : width + "px");
+  , logoSize ? logoSize : width);
 };
 
 var Container = styled.span.attrs({

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@sproutsocial/racine",
-  "version": "12.16.0",
+  "version": "12.16.1",
   "license": "MIT",
   "files": [
     "__flow__",