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

package/dist/icons/MailIcon.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 MailIcon(props) {
 }
 
 MailIcon.defaultProps = {
-  className: 'octicon',
+  className: 'octicon octicon-mail',
   size: 16,
   verticalAlign: 'text-bottom'
 };

package/dist/icons/MarkGithubIcon.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 MarkGithubIcon(props) {
 }
 
 MarkGithubIcon.defaultProps = {
-  className: 'octicon',
+  className: 'octicon octicon-mark-github',
   size: 16,
   verticalAlign: 'text-bottom'
 };

package/dist/icons/MarkdownIcon.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 MarkdownIcon(props) {
 }
 
 MarkdownIcon.defaultProps = {
-  className: 'octicon',
+  className: 'octicon octicon-markdown',
   size: 16,
   verticalAlign: 'text-bottom'
 };

package/dist/icons/MegaphoneIcon.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 }
   };
@@ -59,12 +62,12 @@ var _extends = Object.assign || function (target) {
 };
 
 function MegaphoneIcon(props) {
-  var svgDataByHeight = { "16": { "width": 16, "path": "<path fill-rule=\"evenodd\" d=\"M15.571.572A.75.75 0 0116 1.25L14.777.668c.001 0 0 0 0 0l-.015.012-.076.056a5.508 5.508 0 01-.345.224 9.982 9.982 0 01-1.463.719c-1.322.528-3.351 1.07-6.124 1.071a1.6 1.6 0 00-.861-.25H4a4 4 0 00-1.499 7.71.758.758 0 00-.001.04c0 2.32.486 3.93.813 4.75.262.66.897 1 1.517 1h1.197c.685 0 1.228-.389 1.546-.857.317-.466.468-1.09.31-1.696-.2-.767-.382-1.835-.383-3.183 2.394.086 4.177.577 5.378 1.057a9.965 9.965 0 011.463.719 5.7 5.7 0 01.421.28l.014.012h.002A.75.75 0 0016 11.75V1.25L14.777.668a.75.75 0 01.794-.096zM4.002 10.5c.033 1.969.45 3.306.704 3.946.004.01.01.02.027.03a.185.185 0 00.097.024h1.197c.083 0 .202-.047.305-.2a.608.608 0 00.1-.475 14.036 14.036 0 01-.43-3.329 1.64 1.64 0 01-.11.004h-1.89zM7.5 8.763c2.601.087 4.573.62 5.935 1.166.41.164.766.33 1.065.483V2.588c-.3.154-.654.319-1.065.483C12.073 3.616 10.1 4.15 7.5 4.237v4.526zM14.777.668zM1.5 6.5A2.5 2.5 0 014 4h1.893c.059 0 .107.048.107.107v4.786A.107.107 0 015.893 9H4a2.5 2.5 0 01-2.5-2.5z\"></path>" }, "24": { "width": 24, "path": "<path fill-rule=\"evenodd\" d=\"M22 1.75a.75.75 0 00-1.161-.627c-.047.03-.094.057-.142.085a9.15 9.15 0 01-.49.262c-.441.22-1.11.519-2.002.82-1.78.6-4.45 1.21-7.955 1.21H6.5A5.5 5.5 0 005 14.293v.457c0 3.061.684 5.505 1.061 6.621.24.709.904 1.129 1.6 1.129h2.013c1.294 0 2.1-1.322 1.732-2.453-.412-1.268-.906-3.268-.906-5.547 0-.03-.002-.06-.005-.088 3.382.028 5.965.644 7.703 1.251.89.312 1.559.62 2 .849.084.043.171.096.261.15.357.214.757.455 1.142.25A.75.75 0 0022 16.25V1.75zM10.5 12.912c3.564.029 6.313.678 8.193 1.335.737.258 1.34.517 1.807.74V2.993c-.467.216-1.073.467-1.815.718-1.878.634-4.624 1.26-8.185 1.288v7.913zm-4 1.838v-.25H9c0 2.486.537 4.648.98 6.01a.398.398 0 01-.057.343c-.07.104-.162.147-.249.147H7.661c-.105 0-.161-.058-.179-.109-.344-1.018-.982-3.294-.982-6.141zM6.5 5H9v8H6.5a4 4 0 010-8z\"></path>" } };
+  var svgDataByHeight = { "16": { "width": 16, "path": "<g fill-rule=\"evenodd\"><path d=\"M3.25 9a.75.75 0 01.75.75c0 2.142.456 3.828.733 4.653a.121.121 0 00.05.064.207.207 0 00.117.033h1.31c.085 0 .18-.042.258-.152a.448.448 0 00.075-.366A16.74 16.74 0 016 9.75a.75.75 0 011.5 0c0 1.588.25 2.926.494 3.85.293 1.113-.504 2.4-1.783 2.4H4.9c-.686 0-1.35-.41-1.589-1.12A16.42 16.42 0 012.5 9.75.75.75 0 013.25 9z\"></path><path d=\"M0 6a4 4 0 014-4h2.75a.75.75 0 01.75.75v6.5a.75.75 0 01-.75.75H4a4 4 0 01-4-4zm4-2.5a2.5 2.5 0 000 5h2v-5H4z\"></path><path d=\"M15.59.082A.75.75 0 0116 .75v10.5a.75.75 0 01-1.189.608l-.002-.001h.001l-.014-.01a5.829 5.829 0 00-.422-.25 10.58 10.58 0 00-1.469-.64C11.576 10.484 9.536 10 6.75 10a.75.75 0 110-1.5c2.964 0 5.174.516 6.658 1.043.423.151.787.302 1.092.443V2.014c-.305.14-.669.292-1.092.443C11.924 2.984 9.713 3.5 6.75 3.5a.75.75 0 110-1.5c2.786 0 4.826-.484 6.155-.957.665-.236 1.154-.47 1.47-.64a5.82 5.82 0 00.421-.25l.014-.01a.75.75 0 01.78-.061zm-.78.06zm.44 11.108l-.44.607.44-.607z\"></path></g>" }, "24": { "width": 24, "path": "<path fill-rule=\"evenodd\" d=\"M22 1.75a.75.75 0 00-1.161-.627c-.047.03-.094.057-.142.085a9.15 9.15 0 01-.49.262c-.441.22-1.11.519-2.002.82-1.78.6-4.45 1.21-7.955 1.21H6.5A5.5 5.5 0 005 14.293v.457c0 3.061.684 5.505 1.061 6.621.24.709.904 1.129 1.6 1.129h2.013c1.294 0 2.1-1.322 1.732-2.453-.412-1.268-.906-3.268-.906-5.547 0-.03-.002-.06-.005-.088 3.382.028 5.965.644 7.703 1.251.89.312 1.559.62 2 .849.084.043.171.096.261.15.357.214.757.455 1.142.25A.75.75 0 0022 16.25V1.75zM10.5 12.912c3.564.029 6.313.678 8.193 1.335.737.258 1.34.517 1.807.74V2.993c-.467.216-1.073.467-1.815.718-1.878.634-4.624 1.26-8.185 1.288v7.913zm-4 1.838v-.25H9c0 2.486.537 4.648.98 6.01a.398.398 0 01-.057.343c-.07.104-.162.147-.249.147H7.661c-.105 0-.161-.058-.179-.109-.344-1.018-.982-3.294-.982-6.141zM6.5 5H9v8H6.5a4 4 0 010-8z\"></path>" } };
   return React.createElement('svg', getSvgProps(_extends({}, props, { svgDataByHeight: svgDataByHeight })));
 }
 
 MegaphoneIcon.defaultProps = {
-  className: 'octicon',
+  className: 'octicon octicon-megaphone',
   size: 16,
   verticalAlign: 'text-bottom'
 };

package/dist/icons/MentionIcon.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 MentionIcon(props) {
 }
 
 MentionIcon.defaultProps = {
-  className: 'octicon',
+  className: 'octicon octicon-mention',
   size: 16,
   verticalAlign: 'text-bottom'
 };

package/dist/icons/MeterIcon.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 MeterIcon(props) {
 }
 
 MeterIcon.defaultProps = {
-  className: 'octicon',
+  className: 'octicon octicon-meter',
   size: 16,
   verticalAlign: 'text-bottom'
 };

package/dist/icons/MilestoneIcon.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 MilestoneIcon(props) {
 }
 
 MilestoneIcon.defaultProps = {
-  className: 'octicon',
+  className: 'octicon octicon-milestone',
   size: 16,
   verticalAlign: 'text-bottom'
 };

package/dist/icons/MirrorIcon.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 MirrorIcon(props) {
 }
 
 MirrorIcon.defaultProps = {
-  className: 'octicon',
+  className: 'octicon octicon-mirror',
   size: 16,
   verticalAlign: 'text-bottom'
 };

package/dist/icons/MoonIcon.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 MoonIcon(props) {
 }
 
 MoonIcon.defaultProps = {
-  className: 'octicon',
+  className: 'octicon octicon-moon',
   size: 16,
   verticalAlign: 'text-bottom'
 };

package/dist/icons/MortarBoardIcon.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 MortarBoardIcon(props) {
 }
 
 MortarBoardIcon.defaultProps = {
-  className: 'octicon',
+  className: 'octicon octicon-mortar-board',
   size: 16,
   verticalAlign: 'text-bottom'
 };

package/dist/icons/MultiSelectIcon.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 MultiSelectIcon(props) {
+  var svgDataByHeight = { "16": { "width": 16, "path": "<path fill-rule=\"evenodd\" d=\"M1.75 2.5a.75.75 0 000 1.5h6.5a.75.75 0 000-1.5h-6.5zm4 5a.75.75 0 000 1.5h7.5a.75.75 0 000-1.5h-7.5zm0 5a.75.75 0 000 1.5h7.5a.75.75 0 000-1.5h-7.5zM3 8a1 1 0 11-2 0 1 1 0 012 0zm-1 6a1 1 0 100-2 1 1 0 000 2z\"></path><path d=\"M13.314 4.918L11.07 2.417A.25.25 0 0111.256 2h4.488a.25.25 0 01.186.417l-2.244 2.5a.25.25 0 01-.372 0z\"></path>" }, "24": { "width": 24, "path": "<path fill-rule=\"evenodd\" d=\"M3.75 5.5a.75.75 0 000 1.5h10a.75.75 0 000-1.5h-10zm5 6a.75.75 0 000 1.5h11.5a.75.75 0 000-1.5H8.75zm0 6a.75.75 0 000 1.5h11.5a.75.75 0 000-1.5H8.75zM5 12a1 1 0 11-2 0 1 1 0 012 0zm-1 7a1 1 0 100-2 1 1 0 000 2z\"></path><path d=\"M19.309 7.918l-2.245-2.501A.25.25 0 0117.25 5h4.49a.25.25 0 01.185.417l-2.244 2.5a.25.25 0 01-.372 0z\"></path>" } };
+  return React.createElement('svg', getSvgProps(_extends({}, props, { svgDataByHeight: svgDataByHeight })));
+}
+
+MultiSelectIcon.defaultProps = {
+  className: 'octicon octicon-multi-select',
+  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 StyledMultiSelectIcon = styled(MultiSelectIcon)(COMMON, sx);
+
+export default StyledMultiSelectIcon;

package/dist/icons/MuteIcon.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 MuteIcon(props) {
 }
 
 MuteIcon.defaultProps = {
-  className: 'octicon',
+  className: 'octicon octicon-mute',
   size: 16,
   verticalAlign: 'text-bottom'
 };

package/dist/icons/NoEntryIcon.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 NoEntryIcon(props) {
 }
 
 NoEntryIcon.defaultProps = {
-  className: 'octicon',
+  className: 'octicon octicon-no-entry',
   size: 16,
   verticalAlign: 'text-bottom'
 };

package/dist/icons/NorthStarIcon.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 NorthStarIcon(props) {
 }
 
 NorthStarIcon.defaultProps = {
-  className: 'octicon',
+  className: 'octicon octicon-north-star',
   size: 16,
   verticalAlign: 'text-bottom'
 };

package/dist/icons/NoteIcon.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 NoteIcon(props) {
 }
 
 NoteIcon.defaultProps = {
-  className: 'octicon',
+  className: 'octicon octicon-note',
   size: 16,
   verticalAlign: 'text-bottom'
 };

package/dist/icons/NumberIcon.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 NumberIcon(props) {
+  var svgDataByHeight = { "16": { "width": 16, "path": "<path fill-rule=\"evenodd\" d=\"M5.604.089A.75.75 0 016 .75v4.77h.711a.75.75 0 110 1.5H3.759a.75.75 0 110-1.5H4.5V2.15l-.334.223a.75.75 0 01-.832-1.248l1.5-1a.75.75 0 01.77-.037zM9 4.75A.75.75 0 019.75 4h4a.75.75 0 01.53 1.28l-1.89 1.892c.312.076.604.18.867.319.742.391 1.244 1.063 1.244 2.005 0 .653-.231 1.208-.629 1.627-.386.408-.894.653-1.408.777-1.01.243-2.225.063-3.124-.527a.75.75 0 01.822-1.254c.534.35 1.32.474 1.951.322.306-.073.53-.201.67-.349.129-.136.218-.32.218-.596 0-.308-.123-.509-.444-.678-.373-.197-.98-.318-1.806-.318a.75.75 0 01-.53-1.28l1.72-1.72H9.75A.75.75 0 019 4.75zm-3.587 5.763c-.35-.05-.77.113-.983.572a.75.75 0 11-1.36-.632c.508-1.094 1.589-1.565 2.558-1.425 1 .145 1.872.945 1.872 2.222 0 1.433-1.088 2.192-1.79 2.681-.308.216-.571.397-.772.573H7a.75.75 0 010 1.5H3.75a.75.75 0 01-.75-.75c0-.69.3-1.211.67-1.61.348-.372.8-.676 1.15-.92.8-.56 1.18-.904 1.18-1.474 0-.473-.267-.69-.587-.737z\"></path>" }, "24": { "width": 24, "path": "<path fill-rule=\"evenodd\" d=\"M8.114 2.094a.75.75 0 01.386.656V9h1.252a.75.75 0 110 1.5H5.75a.75.75 0 010-1.5H7V4.103l-.853.533a.75.75 0 01-.795-1.272l2-1.25a.75.75 0 01.762-.02zm4.889 5.66a.75.75 0 01.75-.75h5.232a.75.75 0 01.53 1.28l-2.776 2.777c.55.097 1.057.253 1.492.483.905.477 1.504 1.284 1.504 2.418 0 .966-.471 1.75-1.172 2.27-.687.511-1.587.77-2.521.77-1.367 0-2.274-.528-2.667-.756a.75.75 0 01.755-1.297c.331.193.953.553 1.912.553.673 0 1.243-.188 1.627-.473.37-.275.566-.635.566-1.067 0-.5-.219-.836-.703-1.091-.538-.284-1.375-.443-2.471-.443a.75.75 0 01-.53-1.28l2.643-2.644h-3.421a.75.75 0 01-.75-.75zM7.88 15.215a1.4 1.4 0 00-1.446.83.75.75 0 01-1.37-.61 2.9 2.9 0 012.986-1.71 2.565 2.565 0 011.557.743c.434.446.685 1.058.685 1.778 0 1.641-1.254 2.437-2.12 2.986-.538.341-1.18.694-1.495 1.273H9.75a.75.75 0 010 1.5h-4a.75.75 0 01-.75-.75c0-1.799 1.337-2.63 2.243-3.21 1.032-.659 1.55-1.031 1.55-1.8 0-.355-.116-.584-.26-.732a1.068 1.068 0 00-.652-.298z\"></path>" } };
+  return React.createElement('svg', getSvgProps(_extends({}, props, { svgDataByHeight: svgDataByHeight })));
+}
+
+NumberIcon.defaultProps = {
+  className: 'octicon octicon-number',
+  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 StyledNumberIcon = styled(NumberIcon)(COMMON, sx);
+
+export default StyledNumberIcon;