create-svg-icon-sprite - npm Package Compare versions

Comparing version 1.2.1 to 1.2.2

CHANGELOG.md

@@ -0,1 +1,6 @@
+# v1.2.2
+## Adds accessibility options to React icon components
+
+- accepts `title` prop with text/node (e.g. `<FormattedMessage />`) and renders `<span class="sr-only>...</span>` or sets `aria-hidden` and `role="presentation"` on icon
+
 # v1.2.1
@@ -2,0 +7,0 @@ ## Fixes premature release from a faulty CircleCI config

lib/react/buildModules.js

@@ -20,3 +20,3 @@ const path = require('path');
     .then((results) => {
-      console.log(`${results.length} React modules successfully built.`);
+      console.log(`${results.length} React modules successfully built.`); // eslint-disable-line no-console
     })
@@ -51,3 +51,2 @@ .catch((err) => {
   const transformedContent = transform(moduleFileContent);
-
   const packagePath = path.join(REACT_MODULES_DIR, `${name}.js`);
@@ -58,14 +57,34 @@
 
-function getModuleFileContentForSvgAndClass(svg, className) {
-  return `import React from 'react';
+function getModuleFileContentForSvgAndClass(svg, iconClassName) {
+  return `
+import React from 'react';
+import PropTypes from 'prop-types';
 
-export default (props) => (
+const Icon = ({ size, className, title, style }) => (
   <span
-    {...props}
-    className={\`${className}\${ props.size ? ' ${className}-' + props.size : ''} \${ props.className || '' }\`}
-    style={{ ...props.style, display: 'inline-block' }}
+    className={\`${iconClassName}\${ size ? ' ${iconClassName}-' + size : ''} \${ className ? ' ' + className : '' }\`}
+    style={{ ...style }}
+    aria-hidden={!title ? 'true' : null}
+    role={!title ? 'presentation' : null}
   >
     ${svg}
+    { title && <span className="sr-only">{title}</span> }
   </span>
 );
+
+Icon.propTypes = {
+    size: PropTypes.oneOf(['sm', 'md', 'lg', 'xl', 'xxl']),
+    className: PropTypes.string,
+    title: PropTypes.oneOfType([PropTypes.node, PropTypes.string]),
+    style: PropTypes.object
+};
+
+Icon.defaultProps = {
+    size: null,
+    className: "",
+    title: null,
+    style: null
+};
+
+export default Icon;
 `;
@@ -72,0 +91,0 @@ }

package.json

 {
   "name": "create-svg-icon-sprite",
-  "version": "1.2.1",
+  "version": "1.2.2",
   "description": "Create SVG icon sprite",
@@ -5,0 +5,0 @@ "main": "index.js",

No alert changes

Improved metrics

Total package byte prevSize

22115

increased by3.59%

Lines of code

389

increased by4.57%

No dependency changes