Added react-native/style-sheet-object-names setting

Author: xxsnakerxx

lib/rules/no-color-literals.js

@@ -32,7 +32,7 @@ module.exports = Components.detect((context) => {
 
   return {
     VariableDeclarator: (node) => {
-      if (astHelpers.isStyleSheetDeclaration(node)) {
+      if (astHelpers.isStyleSheetDeclaration(node, context.settings)) {
         const styles = astHelpers.getStyleDeclarations(node);
 
         if (styles) {

lib/rules/no-unused-styles.js

@@ -42,7 +42,7 @@ module.exports = Components.detect((context, components) => {
     },
 
     VariableDeclarator: function (node) {
-      if (astHelpers.isStyleSheetDeclaration(node)) {
+      if (astHelpers.isStyleSheetDeclaration(node, context.settings)) {
         const styleSheetName = astHelpers.getStyleSheetName(node);
         const styles = astHelpers.getStyleDeclarations(node);
 

lib/util/stylesheet.js

@@ -92,15 +92,18 @@ const getSourceCode = node => currentContent
   .getSourceCode(node)
   .getText(node);
 
+const getStyleSheetObjectNames = settings =>
+  settings['react-native/style-sheet-object-names'] || ['StyleSheet'];
+
 const astHelpers = {
-  containsStyleSheetObject: function (node) {
+  containsStyleSheetObject: function (node, objectNames) {
     return Boolean(
       node &&
       node.init &&
       node.init.callee &&
       node.init.callee.object &&
       node.init.callee.object.name &&
-      node.init.callee.object.name.includes('StyleSheet')
+      objectNames.includes(node.init.callee.object.name)
     );
   },
 
@@ -114,9 +117,11 @@ const astHelpers = {
     );
   },
 
-  isStyleSheetDeclaration: function (node) {
+  isStyleSheetDeclaration: function (node, settings) {
+    const objectNames = getStyleSheetObjectNames(settings);
+
     return Boolean(
-      astHelpers.containsStyleSheetObject(node) &&
+      astHelpers.containsStyleSheetObject(node, objectNames) &&
       astHelpers.containsCreateCall(node)
     );
   },

tests/lib/rules/no-unused-styles.js

@@ -204,6 +204,17 @@ const tests = {
         }
       });
     `,
+  }, {
+    code: `
+      const styles = OtherStyleSheet.create({
+        name: {},
+      });
+      const Hello = React.createClass({
+        render: function() {
+          return <Text textStyle={styles.name}>Hello {this.props.name}</Text>;
+        }
+      });
+    `,
   }],
 
   invalid: [{
@@ -250,6 +261,21 @@ const tests = {
     errors: [{
       message: 'Unused style detected: styles.bar',
     }],
+  }, {
+    code: `
+      const styles = OtherStyleSheet.create({
+        foo: {},
+        bar: {},
+      })
+      class Foo extends React.PureComponent {
+        render() {
+          return <View style={styles.foo}/>;
+        }
+      }
+    `,
+    errors: [{
+      message: 'Unused style detected: styles.bar',
+    }],
   }],
 };
 
@@ -261,6 +287,9 @@ const config = {
       jsx: true,
     },
   },
+  settings: {
+    'react-native/style-sheet-object-names': ['StyleSheet', 'OtherStyleSheet'],
+  },
 };
 
 tests.valid.forEach(t => Object.assign(t, config));