[docs] Improve export to CodeSandbox (#22346)

mui · Sep 5, 2020 · 42edfb9 · 42edfb9
1 parent 807527b
commit 42edfb9
Show file tree

Hide file tree

Showing 2 changed files with 27 additions and 5 deletions.
diff --git a/docs/src/modules/utils/helpers.js b/docs/src/modules/utils/helpers.js
@@ -44,7 +44,7 @@ function pageToTitleI18n(page, t) {
  * set of packages that ship their own typings instead of using @types/ namespace
  * Array because Set([iterable]) is not supported in IE11
  */
-const packagesWithBundledTypes = ['@material-ui/core', '@material-ui/lab'];
+const packagesWithBundledTypes = [];
 
 /**
  * WARNING: Always uses `latest` typings.
@@ -57,9 +57,10 @@ const packagesWithBundledTypes = ['@material-ui/core', '@material-ui/lab'];
  * @param {Record<string, string>} deps - list of dependency as `name => version`
  */
 function addTypeDeps(deps) {
-  const packagesWithDTPackage = Object.keys(deps).filter(
-    (name) => packagesWithBundledTypes.indexOf(name) === -1,
-  );
+  const packagesWithDTPackage = Object.keys(deps)
+    .filter((name) => packagesWithBundledTypes.indexOf(name) === -1)
+    // All the Material-UI packages come with bundled types
+    .filter((name) => name.indexOf('@material-ui/') !== 0);
 
   packagesWithDTPackage.forEach((name) => {
     let resolvedName = name;
@@ -91,7 +92,7 @@ function includePeerDependencies(deps, versions) {
     deps['@material-ui/core'] = versions['@material-ui/core'];
   }
 
-  if (deps['@material-ui/x-data-grid-generator']) {
+  if (deps['@material-ui/x-grid-data-generator']) {
     deps['@material-ui/core'] = versions['@material-ui/core'];
     deps['@material-ui/icons'] = versions['@material-ui/icons'];
     deps['@material-ui/lab'] = versions['@material-ui/lab'];

diff --git a/docs/src/modules/utils/helpers.test.js b/docs/src/modules/utils/helpers.test.js
@@ -135,4 +135,25 @@ import lab from '@material-ui/lab';
       'react-dom': 'latest',
     });
   });
+
+  it('should support the data-grid component', () => {
+    const source = `
+import * as React from 'react';
+import { DataGrid } from '@material-ui/data-grid';
+import { useDemoData } from '@material-ui/x-grid-data-generator';
+    `;
+
+    expect(getDependencies(source, { codeLanguage: 'TS' })).to.deep.equal({
+      '@material-ui/core': 'next',
+      '@material-ui/lab': 'next',
+      '@material-ui/icons': 'next',
+      '@material-ui/data-grid': 'latest',
+      '@material-ui/x-grid-data-generator': 'latest',
+      '@types/react': 'latest',
+      '@types/react-dom': 'latest',
+      react: 'latest',
+      'react-dom': 'latest',
+      typescript: 'latest',
+    });
+  });
 });