Add mapping of "Box" to "div"

src/configs/components.js

@@ -20,4 +20,12 @@ const components = flattenComponents({
   },
 })
 
-module.exports = components
+// We want to avoid setting a jsx-a11y mapping from `Box` to `div` until polymorphic linting is enabled for jsx-a11y.
+// However, polymorphic linting is enabled for the github plugin, so we can safely map `Box` to `div` (while also having it properly interpret the `as` prop)
+const githubMapping = Object.assign({}, components)
+githubMapping['Box'] = 'div'
+
+module.exports = {
+  jsxA11yMapping: components,
+  githubMapping,
+}

src/configs/recommended.js

@@ -1,4 +1,4 @@
-const components = require('./components')
+const {jsxA11yMapping, githubMapping} = require('./components')
 
 module.exports = {
   parserOptions: {
@@ -19,10 +19,10 @@ module.exports = {
   },
   settings: {
     github: {
-      components,
+      components: githubMapping,
     },
     'jsx-a11y': {
-      components,
+      components: jsxA11yMapping,
     },
   },
 }