@primer/styled-octicons 0.0.0-e76164b → 0.0.0-e79b4ff

package/dist/icons/OrganizationIcon.js

@@ -12,6 +12,8 @@ var sizeMap = {
 function getSvgProps(_ref) {
   var ariaLabel = _ref['aria-label'],
       className = _ref.className,
+      _ref$fill = _ref.fill,
+      fill = _ref$fill === undefined ? 'currentColor' : _ref$fill,
       size = _ref.size,
       verticalAlign = _ref.verticalAlign,
       svgDataByHeight = _ref.svgDataByHeight;
@@ -30,11 +32,12 @@ function getSvgProps(_ref) {
     viewBox: '0 0 ' + naturalWidth + ' ' + naturalHeight,
     width: width,
     height: height,
-    fill: 'currentColor',
+    fill: fill,
     style: {
       display: 'inline-block',
       userSelect: 'none',
-      verticalAlign: verticalAlign
+      verticalAlign: verticalAlign,
+      overflow: 'visible'
     },
     dangerouslySetInnerHTML: { __html: path }
   };
@@ -64,7 +67,7 @@ function OrganizationIcon(props) {
 }
 
 OrganizationIcon.defaultProps = {
-  className: 'octicon',
+  className: 'octicon octicon-organization',
   size: 16,
   verticalAlign: 'text-bottom'
 };

package/dist/icons/PackageDependenciesIcon.js

@@ -12,6 +12,8 @@ var sizeMap = {
 function getSvgProps(_ref) {
   var ariaLabel = _ref['aria-label'],
       className = _ref.className,
+      _ref$fill = _ref.fill,
+      fill = _ref$fill === undefined ? 'currentColor' : _ref$fill,
       size = _ref.size,
       verticalAlign = _ref.verticalAlign,
       svgDataByHeight = _ref.svgDataByHeight;
@@ -30,11 +32,12 @@ function getSvgProps(_ref) {
     viewBox: '0 0 ' + naturalWidth + ' ' + naturalHeight,
     width: width,
     height: height,
-    fill: 'currentColor',
+    fill: fill,
     style: {
       display: 'inline-block',
       userSelect: 'none',
-      verticalAlign: verticalAlign
+      verticalAlign: verticalAlign,
+      overflow: 'visible'
     },
     dangerouslySetInnerHTML: { __html: path }
   };
@@ -64,7 +67,7 @@ function PackageDependenciesIcon(props) {
 }
 
 PackageDependenciesIcon.defaultProps = {
-  className: 'octicon',
+  className: 'octicon octicon-package-dependencies',
   size: 16,
   verticalAlign: 'text-bottom'
 };

package/dist/icons/PackageDependentsIcon.js

@@ -12,6 +12,8 @@ var sizeMap = {
 function getSvgProps(_ref) {
   var ariaLabel = _ref['aria-label'],
       className = _ref.className,
+      _ref$fill = _ref.fill,
+      fill = _ref$fill === undefined ? 'currentColor' : _ref$fill,
       size = _ref.size,
       verticalAlign = _ref.verticalAlign,
       svgDataByHeight = _ref.svgDataByHeight;
@@ -30,11 +32,12 @@ function getSvgProps(_ref) {
     viewBox: '0 0 ' + naturalWidth + ' ' + naturalHeight,
     width: width,
     height: height,
-    fill: 'currentColor',
+    fill: fill,
     style: {
       display: 'inline-block',
       userSelect: 'none',
-      verticalAlign: verticalAlign
+      verticalAlign: verticalAlign,
+      overflow: 'visible'
     },
     dangerouslySetInnerHTML: { __html: path }
   };
@@ -64,7 +67,7 @@ function PackageDependentsIcon(props) {
 }
 
 PackageDependentsIcon.defaultProps = {
-  className: 'octicon',
+  className: 'octicon octicon-package-dependents',
   size: 16,
   verticalAlign: 'text-bottom'
 };

package/dist/icons/PackageIcon.js

@@ -12,6 +12,8 @@ var sizeMap = {
 function getSvgProps(_ref) {
   var ariaLabel = _ref['aria-label'],
       className = _ref.className,
+      _ref$fill = _ref.fill,
+      fill = _ref$fill === undefined ? 'currentColor' : _ref$fill,
       size = _ref.size,
       verticalAlign = _ref.verticalAlign,
       svgDataByHeight = _ref.svgDataByHeight;
@@ -30,11 +32,12 @@ function getSvgProps(_ref) {
     viewBox: '0 0 ' + naturalWidth + ' ' + naturalHeight,
     width: width,
     height: height,
-    fill: 'currentColor',
+    fill: fill,
     style: {
       display: 'inline-block',
       userSelect: 'none',
-      verticalAlign: verticalAlign
+      verticalAlign: verticalAlign,
+      overflow: 'visible'
     },
     dangerouslySetInnerHTML: { __html: path }
   };
@@ -64,7 +67,7 @@ function PackageIcon(props) {
 }
 
 PackageIcon.defaultProps = {
-  className: 'octicon',
+  className: 'octicon octicon-package',
   size: 16,
   verticalAlign: 'text-bottom'
 };

package/dist/icons/PaintbrushIcon.js

@@ -12,6 +12,8 @@ var sizeMap = {
 function getSvgProps(_ref) {
   var ariaLabel = _ref['aria-label'],
       className = _ref.className,
+      _ref$fill = _ref.fill,
+      fill = _ref$fill === undefined ? 'currentColor' : _ref$fill,
       size = _ref.size,
       verticalAlign = _ref.verticalAlign,
       svgDataByHeight = _ref.svgDataByHeight;
@@ -30,11 +32,12 @@ function getSvgProps(_ref) {
     viewBox: '0 0 ' + naturalWidth + ' ' + naturalHeight,
     width: width,
     height: height,
-    fill: 'currentColor',
+    fill: fill,
     style: {
       display: 'inline-block',
       userSelect: 'none',
-      verticalAlign: verticalAlign
+      verticalAlign: verticalAlign,
+      overflow: 'visible'
     },
     dangerouslySetInnerHTML: { __html: path }
   };
@@ -64,7 +67,7 @@ function PaintbrushIcon(props) {
 }
 
 PaintbrushIcon.defaultProps = {
-  className: 'octicon',
+  className: 'octicon octicon-paintbrush',
   size: 16,
   verticalAlign: 'text-bottom'
 };

package/dist/icons/PaperAirplaneIcon.js

@@ -12,6 +12,8 @@ var sizeMap = {
 function getSvgProps(_ref) {
   var ariaLabel = _ref['aria-label'],
       className = _ref.className,
+      _ref$fill = _ref.fill,
+      fill = _ref$fill === undefined ? 'currentColor' : _ref$fill,
       size = _ref.size,
       verticalAlign = _ref.verticalAlign,
       svgDataByHeight = _ref.svgDataByHeight;
@@ -30,11 +32,12 @@ function getSvgProps(_ref) {
     viewBox: '0 0 ' + naturalWidth + ' ' + naturalHeight,
     width: width,
     height: height,
-    fill: 'currentColor',
+    fill: fill,
     style: {
       display: 'inline-block',
       userSelect: 'none',
-      verticalAlign: verticalAlign
+      verticalAlign: verticalAlign,
+      overflow: 'visible'
     },
     dangerouslySetInnerHTML: { __html: path }
   };
@@ -64,7 +67,7 @@ function PaperAirplaneIcon(props) {
 }
 
 PaperAirplaneIcon.defaultProps = {
-  className: 'octicon',
+  className: 'octicon octicon-paper-airplane',
   size: 16,
   verticalAlign: 'text-bottom'
 };

package/dist/icons/{ClippyIcon.js → PasteIcon.js}

@@ -12,6 +12,8 @@ var sizeMap = {
 function getSvgProps(_ref) {
   var ariaLabel = _ref['aria-label'],
       className = _ref.className,
+      _ref$fill = _ref.fill,
+      fill = _ref$fill === undefined ? 'currentColor' : _ref$fill,
       size = _ref.size,
       verticalAlign = _ref.verticalAlign,
       svgDataByHeight = _ref.svgDataByHeight;
@@ -30,11 +32,12 @@ function getSvgProps(_ref) {
     viewBox: '0 0 ' + naturalWidth + ' ' + naturalHeight,
     width: width,
     height: height,
-    fill: 'currentColor',
+    fill: fill,
     style: {
       display: 'inline-block',
       userSelect: 'none',
-      verticalAlign: verticalAlign
+      verticalAlign: verticalAlign,
+      overflow: 'visible'
     },
     dangerouslySetInnerHTML: { __html: path }
   };
@@ -58,13 +61,13 @@ var _extends = Object.assign || function (target) {
   }return target;
 };
 
-function ClippyIcon(props) {
+function PasteIcon(props) {
   var svgDataByHeight = { "16": { "width": 16, "path": "<path fill-rule=\"evenodd\" d=\"M5.75 1a.75.75 0 00-.75.75v3c0 .414.336.75.75.75h4.5a.75.75 0 00.75-.75v-3a.75.75 0 00-.75-.75h-4.5zm.75 3V2.5h3V4h-3zm-2.874-.467a.75.75 0 00-.752-1.298A1.75 1.75 0 002 3.75v9.5c0 .966.784 1.75 1.75 1.75h8.5A1.75 1.75 0 0014 13.25v-9.5a1.75 1.75 0 00-.874-1.515.75.75 0 10-.752 1.298.25.25 0 01.126.217v9.5a.25.25 0 01-.25.25h-8.5a.25.25 0 01-.25-.25v-9.5a.25.25 0 01.126-.217z\"></path>" }, "24": { "width": 24, "path": "<path fill-rule=\"evenodd\" d=\"M5.962 2.513a.75.75 0 01-.475.949l-.816.272a.25.25 0 00-.171.237V21.25c0 .138.112.25.25.25h14.5a.25.25 0 00.25-.25V3.97a.25.25 0 00-.17-.236l-.817-.272a.75.75 0 01.474-1.424l.816.273A1.75 1.75 0 0121 3.97v17.28A1.75 1.75 0 0119.25 23H4.75A1.75 1.75 0 013 21.25V3.97a1.75 1.75 0 011.197-1.66l.816-.272a.75.75 0 01.949.475z\"></path><path fill-rule=\"evenodd\" d=\"M7 1.75C7 .784 7.784 0 8.75 0h6.5C16.216 0 17 .784 17 1.75v1.5A1.75 1.75 0 0115.25 5h-6.5A1.75 1.75 0 017 3.25v-1.5zm1.75-.25a.25.25 0 00-.25.25v1.5c0 .138.112.25.25.25h6.5a.25.25 0 00.25-.25v-1.5a.25.25 0 00-.25-.25h-6.5z\"></path>" } };
   return React.createElement('svg', getSvgProps(_extends({}, props, { svgDataByHeight: svgDataByHeight })));
 }
 
-ClippyIcon.defaultProps = {
-  className: 'octicon',
+PasteIcon.defaultProps = {
+  className: 'octicon octicon-paste',
   size: 16,
   verticalAlign: 'text-bottom'
 };
@@ -79,6 +82,6 @@ var sx = function sx(props) {
 
 /* THIS FILE IS GENERATED. DO NOT EDIT IT. */
 
-var StyledClippyIcon = styled(ClippyIcon)(COMMON, sx);
+var StyledPasteIcon = styled(PasteIcon)(COMMON, sx);
 
-export default StyledClippyIcon;
+export default StyledPasteIcon;

package/dist/icons/PencilIcon.js

@@ -12,6 +12,8 @@ var sizeMap = {
 function getSvgProps(_ref) {
   var ariaLabel = _ref['aria-label'],
       className = _ref.className,
+      _ref$fill = _ref.fill,
+      fill = _ref$fill === undefined ? 'currentColor' : _ref$fill,
       size = _ref.size,
       verticalAlign = _ref.verticalAlign,
       svgDataByHeight = _ref.svgDataByHeight;
@@ -30,11 +32,12 @@ function getSvgProps(_ref) {
     viewBox: '0 0 ' + naturalWidth + ' ' + naturalHeight,
     width: width,
     height: height,
-    fill: 'currentColor',
+    fill: fill,
     style: {
       display: 'inline-block',
       userSelect: 'none',
-      verticalAlign: verticalAlign
+      verticalAlign: verticalAlign,
+      overflow: 'visible'
     },
     dangerouslySetInnerHTML: { __html: path }
   };
@@ -64,7 +67,7 @@ function PencilIcon(props) {
 }
 
 PencilIcon.defaultProps = {
-  className: 'octicon',
+  className: 'octicon octicon-pencil',
   size: 16,
   verticalAlign: 'text-bottom'
 };

package/dist/icons/PeopleIcon.js

@@ -12,6 +12,8 @@ var sizeMap = {
 function getSvgProps(_ref) {
   var ariaLabel = _ref['aria-label'],
       className = _ref.className,
+      _ref$fill = _ref.fill,
+      fill = _ref$fill === undefined ? 'currentColor' : _ref$fill,
       size = _ref.size,
       verticalAlign = _ref.verticalAlign,
       svgDataByHeight = _ref.svgDataByHeight;
@@ -30,11 +32,12 @@ function getSvgProps(_ref) {
     viewBox: '0 0 ' + naturalWidth + ' ' + naturalHeight,
     width: width,
     height: height,
-    fill: 'currentColor',
+    fill: fill,
     style: {
       display: 'inline-block',
       userSelect: 'none',
-      verticalAlign: verticalAlign
+      verticalAlign: verticalAlign,
+      overflow: 'visible'
     },
     dangerouslySetInnerHTML: { __html: path }
   };
@@ -64,7 +67,7 @@ function PeopleIcon(props) {
 }
 
 PeopleIcon.defaultProps = {
-  className: 'octicon',
+  className: 'octicon octicon-people',
   size: 16,
   verticalAlign: 'text-bottom'
 };

package/dist/icons/PersonAddIcon.js

@@ -0,0 +1,87 @@
+import React from 'react';
+import { compose, space, color } from 'styled-system';
+import css from '@styled-system/css';
+import styled from 'styled-components';
+
+var sizeMap = {
+  small: 16,
+  medium: 32,
+  large: 64
+};
+
+function getSvgProps(_ref) {
+  var ariaLabel = _ref['aria-label'],
+      className = _ref.className,
+      _ref$fill = _ref.fill,
+      fill = _ref$fill === undefined ? 'currentColor' : _ref$fill,
+      size = _ref.size,
+      verticalAlign = _ref.verticalAlign,
+      svgDataByHeight = _ref.svgDataByHeight;
+
+  var height = sizeMap[size] || size;
+  var naturalHeight = closestNaturalHeight(Object.keys(svgDataByHeight), height);
+  var naturalWidth = svgDataByHeight[naturalHeight].width;
+  var width = height * (naturalWidth / naturalHeight);
+  var path = svgDataByHeight[naturalHeight].path;
+
+  return {
+    'aria-hidden': ariaLabel ? 'false' : 'true',
+    'aria-label': ariaLabel,
+    role: 'img',
+    className: className,
+    viewBox: '0 0 ' + naturalWidth + ' ' + naturalHeight,
+    width: width,
+    height: height,
+    fill: fill,
+    style: {
+      display: 'inline-block',
+      userSelect: 'none',
+      verticalAlign: verticalAlign,
+      overflow: 'visible'
+    },
+    dangerouslySetInnerHTML: { __html: path }
+  };
+}
+
+function closestNaturalHeight(naturalHeights, height) {
+  return naturalHeights.map(function (naturalHeight) {
+    return parseInt(naturalHeight, 10);
+  }).reduce(function (acc, naturalHeight) {
+    return naturalHeight <= height ? naturalHeight : acc;
+  }, naturalHeights[0]);
+}
+
+var _extends = Object.assign || function (target) {
+  for (var i = 1; i < arguments.length; i++) {
+    var source = arguments[i];for (var key in source) {
+      if (Object.prototype.hasOwnProperty.call(source, key)) {
+        target[key] = source[key];
+      }
+    }
+  }return target;
+};
+
+function PersonAddIcon(props) {
+  var svgDataByHeight = { "16": { "width": 16, "path": "<path fill-rule=\"evenodd\" d=\"M13.25 0a.75.75 0 01.75.75V2h1.25a.75.75 0 010 1.5H14v1.25a.75.75 0 01-1.5 0V3.5h-1.25a.75.75 0 010-1.5h1.25V.75a.75.75 0 01.75-.75zM5.5 4a2 2 0 100 4 2 2 0 000-4zm2.4 4.548a3.5 3.5 0 10-4.799 0 5.527 5.527 0 00-3.1 4.66.75.75 0 101.498.085A4.01 4.01 0 015.5 9.5a4.01 4.01 0 014.001 3.793.75.75 0 101.498-.086 5.527 5.527 0 00-3.1-4.659z\"></path>" }, "24": { "width": 24, "path": "<path fill-rule=\"evenodd\" d=\"M19.25 1a.75.75 0 01.75.75V4h2.25a.75.75 0 010 1.5H20v2.25a.75.75 0 01-1.5 0V5.5h-2.25a.75.75 0 010-1.5h2.25V1.75a.75.75 0 01.75-.75zM9 6a3.5 3.5 0 100 7 3.5 3.5 0 000-7zM4 9.5a5 5 0 117.916 4.062 7.973 7.973 0 015.018 7.166.75.75 0 11-1.499.044 6.469 6.469 0 00-12.932 0 .75.75 0 01-1.499-.044 7.973 7.973 0 015.059-7.181A4.993 4.993 0 014 9.5z\"></path>" } };
+  return React.createElement('svg', getSvgProps(_extends({}, props, { svgDataByHeight: svgDataByHeight })));
+}
+
+PersonAddIcon.defaultProps = {
+  className: 'octicon octicon-person-add',
+  size: 16,
+  verticalAlign: 'text-bottom'
+};
+
+// eslint-disable-next-line import/no-namespace
+
+var COMMON = compose(space, color);
+
+var sx = function sx(props) {
+  return css(props.sx);
+};
+
+/* THIS FILE IS GENERATED. DO NOT EDIT IT. */
+
+var StyledPersonAddIcon = styled(PersonAddIcon)(COMMON, sx);
+
+export default StyledPersonAddIcon;

package/dist/icons/{InsightsIcon.js → PersonFillIcon.js}

@@ -12,6 +12,8 @@ var sizeMap = {
 function getSvgProps(_ref) {
   var ariaLabel = _ref['aria-label'],
       className = _ref.className,
+      _ref$fill = _ref.fill,
+      fill = _ref$fill === undefined ? 'currentColor' : _ref$fill,
       size = _ref.size,
       verticalAlign = _ref.verticalAlign,
       svgDataByHeight = _ref.svgDataByHeight;
@@ -30,11 +32,12 @@ function getSvgProps(_ref) {
     viewBox: '0 0 ' + naturalWidth + ' ' + naturalHeight,
     width: width,
     height: height,
-    fill: 'currentColor',
+    fill: fill,
     style: {
       display: 'inline-block',
       userSelect: 'none',
-      verticalAlign: verticalAlign
+      verticalAlign: verticalAlign,
+      overflow: 'visible'
     },
     dangerouslySetInnerHTML: { __html: path }
   };
@@ -58,13 +61,13 @@ var _extends = Object.assign || function (target) {
   }return target;
 };
 
-function InsightsIcon(props) {
-  var svgDataByHeight = { "24": { "width": 24, "path": "<path fill-rule=\"evenodd\" d=\"M11.75 3.5a.75.75 0 01.75.75v15.5a.75.75 0 01-1.5 0V4.25a.75.75 0 01.75-.75zm6.5 3.625a.75.75 0 01.75.75V19.75a.75.75 0 01-1.5 0V7.875a.75.75 0 01.75-.75zM5.25 11a.75.75 0 01.75.75v8a.75.75 0 01-1.5 0v-8a.75.75 0 01.75-.75z\"></path>" } };
+function PersonFillIcon(props) {
+  var svgDataByHeight = { "16": { "width": 16, "path": "<path d=\"M4.243 4.757a3.757 3.757 0 115.851 3.119 6.006 6.006 0 013.9 5.339.75.75 0 01-.715.784H2.721a.75.75 0 01-.714-.784 6.006 6.006 0 013.9-5.34 3.753 3.753 0 01-1.664-3.118z\"></path>" }, "24": { "width": 24, "path": "<path d=\"M12 2.5a5.25 5.25 0 00-2.519 9.857 9.005 9.005 0 00-6.477 8.37.75.75 0 00.727.773H20.27a.75.75 0 00.727-.772 9.005 9.005 0 00-6.477-8.37A5.25 5.25 0 0012 2.5z\"></path>" } };
   return React.createElement('svg', getSvgProps(_extends({}, props, { svgDataByHeight: svgDataByHeight })));
 }
 
-InsightsIcon.defaultProps = {
-  className: 'octicon',
+PersonFillIcon.defaultProps = {
+  className: 'octicon octicon-person-fill',
   size: 16,
   verticalAlign: 'text-bottom'
 };
@@ -79,6 +82,6 @@ var sx = function sx(props) {
 
 /* THIS FILE IS GENERATED. DO NOT EDIT IT. */
 
-var StyledInsightsIcon = styled(InsightsIcon)(COMMON, sx);
+var StyledPersonFillIcon = styled(PersonFillIcon)(COMMON, sx);
 
-export default StyledInsightsIcon;
+export default StyledPersonFillIcon;

package/dist/icons/PersonIcon.js

@@ -12,6 +12,8 @@ var sizeMap = {
 function getSvgProps(_ref) {
   var ariaLabel = _ref['aria-label'],
       className = _ref.className,
+      _ref$fill = _ref.fill,
+      fill = _ref$fill === undefined ? 'currentColor' : _ref$fill,
       size = _ref.size,
       verticalAlign = _ref.verticalAlign,
       svgDataByHeight = _ref.svgDataByHeight;
@@ -30,11 +32,12 @@ function getSvgProps(_ref) {
     viewBox: '0 0 ' + naturalWidth + ' ' + naturalHeight,
     width: width,
     height: height,
-    fill: 'currentColor',
+    fill: fill,
     style: {
       display: 'inline-block',
       userSelect: 'none',
-      verticalAlign: verticalAlign
+      verticalAlign: verticalAlign,
+      overflow: 'visible'
     },
     dangerouslySetInnerHTML: { __html: path }
   };
@@ -64,7 +67,7 @@ function PersonIcon(props) {
 }
 
 PersonIcon.defaultProps = {
-  className: 'octicon',
+  className: 'octicon octicon-person',
   size: 16,
   verticalAlign: 'text-bottom'
 };

package/dist/icons/PinIcon.js

@@ -12,6 +12,8 @@ var sizeMap = {
 function getSvgProps(_ref) {
   var ariaLabel = _ref['aria-label'],
       className = _ref.className,
+      _ref$fill = _ref.fill,
+      fill = _ref$fill === undefined ? 'currentColor' : _ref$fill,
       size = _ref.size,
       verticalAlign = _ref.verticalAlign,
       svgDataByHeight = _ref.svgDataByHeight;
@@ -30,11 +32,12 @@ function getSvgProps(_ref) {
     viewBox: '0 0 ' + naturalWidth + ' ' + naturalHeight,
     width: width,
     height: height,
-    fill: 'currentColor',
+    fill: fill,
     style: {
       display: 'inline-block',
       userSelect: 'none',
-      verticalAlign: verticalAlign
+      verticalAlign: verticalAlign,
+      overflow: 'visible'
     },
     dangerouslySetInnerHTML: { __html: path }
   };
@@ -64,7 +67,7 @@ function PinIcon(props) {
 }
 
 PinIcon.defaultProps = {
-  className: 'octicon',
+  className: 'octicon octicon-pin',
   size: 16,
   verticalAlign: 'text-bottom'
 };

package/dist/icons/PlayIcon.js

@@ -12,6 +12,8 @@ var sizeMap = {
 function getSvgProps(_ref) {
   var ariaLabel = _ref['aria-label'],
       className = _ref.className,
+      _ref$fill = _ref.fill,
+      fill = _ref$fill === undefined ? 'currentColor' : _ref$fill,
       size = _ref.size,
       verticalAlign = _ref.verticalAlign,
       svgDataByHeight = _ref.svgDataByHeight;
@@ -30,11 +32,12 @@ function getSvgProps(_ref) {
     viewBox: '0 0 ' + naturalWidth + ' ' + naturalHeight,
     width: width,
     height: height,
-    fill: 'currentColor',
+    fill: fill,
     style: {
       display: 'inline-block',
       userSelect: 'none',
-      verticalAlign: verticalAlign
+      verticalAlign: verticalAlign,
+      overflow: 'visible'
     },
     dangerouslySetInnerHTML: { __html: path }
   };
@@ -64,7 +67,7 @@ function PlayIcon(props) {
 }
 
 PlayIcon.defaultProps = {
-  className: 'octicon',
+  className: 'octicon octicon-play',
   size: 16,
   verticalAlign: 'text-bottom'
 };

package/dist/icons/PlugIcon.js

@@ -12,6 +12,8 @@ var sizeMap = {
 function getSvgProps(_ref) {
   var ariaLabel = _ref['aria-label'],
       className = _ref.className,
+      _ref$fill = _ref.fill,
+      fill = _ref$fill === undefined ? 'currentColor' : _ref$fill,
       size = _ref.size,
       verticalAlign = _ref.verticalAlign,
       svgDataByHeight = _ref.svgDataByHeight;
@@ -30,11 +32,12 @@ function getSvgProps(_ref) {
     viewBox: '0 0 ' + naturalWidth + ' ' + naturalHeight,
     width: width,
     height: height,
-    fill: 'currentColor',
+    fill: fill,
     style: {
       display: 'inline-block',
       userSelect: 'none',
-      verticalAlign: verticalAlign
+      verticalAlign: verticalAlign,
+      overflow: 'visible'
     },
     dangerouslySetInnerHTML: { __html: path }
   };
@@ -64,7 +67,7 @@ function PlugIcon(props) {
 }
 
 PlugIcon.defaultProps = {
-  className: 'octicon',
+  className: 'octicon octicon-plug',
   size: 16,
   verticalAlign: 'text-bottom'
 };

package/dist/icons/PlusCircleIcon.js

@@ -12,6 +12,8 @@ var sizeMap = {
 function getSvgProps(_ref) {
   var ariaLabel = _ref['aria-label'],
       className = _ref.className,
+      _ref$fill = _ref.fill,
+      fill = _ref$fill === undefined ? 'currentColor' : _ref$fill,
       size = _ref.size,
       verticalAlign = _ref.verticalAlign,
       svgDataByHeight = _ref.svgDataByHeight;
@@ -30,11 +32,12 @@ function getSvgProps(_ref) {
     viewBox: '0 0 ' + naturalWidth + ' ' + naturalHeight,
     width: width,
     height: height,
-    fill: 'currentColor',
+    fill: fill,
     style: {
       display: 'inline-block',
       userSelect: 'none',
-      verticalAlign: verticalAlign
+      verticalAlign: verticalAlign,
+      overflow: 'visible'
     },
     dangerouslySetInnerHTML: { __html: path }
   };
@@ -64,7 +67,7 @@ function PlusCircleIcon(props) {
 }
 
 PlusCircleIcon.defaultProps = {
-  className: 'octicon',
+  className: 'octicon octicon-plus-circle',
   size: 16,
   verticalAlign: 'text-bottom'
 };

package/dist/icons/PlusIcon.js

@@ -12,6 +12,8 @@ var sizeMap = {
 function getSvgProps(_ref) {
   var ariaLabel = _ref['aria-label'],
       className = _ref.className,
+      _ref$fill = _ref.fill,
+      fill = _ref$fill === undefined ? 'currentColor' : _ref$fill,
       size = _ref.size,
       verticalAlign = _ref.verticalAlign,
       svgDataByHeight = _ref.svgDataByHeight;
@@ -30,11 +32,12 @@ function getSvgProps(_ref) {
     viewBox: '0 0 ' + naturalWidth + ' ' + naturalHeight,
     width: width,
     height: height,
-    fill: 'currentColor',
+    fill: fill,
     style: {
       display: 'inline-block',
       userSelect: 'none',
-      verticalAlign: verticalAlign
+      verticalAlign: verticalAlign,
+      overflow: 'visible'
     },
     dangerouslySetInnerHTML: { __html: path }
   };
@@ -64,7 +67,7 @@ function PlusIcon(props) {
 }
 
 PlusIcon.defaultProps = {
-  className: 'octicon',
+  className: 'octicon octicon-plus',
   size: 16,
   verticalAlign: 'text-bottom'
 };