createSvgIcon refactor in @material-ui 4.9.9 breaking builds

[Kauabunga]

Tech	Version
@material-ui/pickers	v4.0.0-alpha.4
material-ui	v4.9.9

Expected behavior

Use createSvgIcon from utils export

import { createSvgIcon } from '@material-ui/core/utils';

instead of

import createSvgIcon from '@material-ui/core/internal/svg-icons/createSvgIcon';

@ https://github.com/mui-org/material-ui-pickers/blob/574944acbb6e3918803914078674d9d815fc260c/lib/src/_shared/icons/ArrowDropDownIcon.tsx#L2

Actual behavior

Module not found: Can't resolve '@material-ui/core/internal/svg-icons/createSvgIcon' in '/.../node_modules/@material-ui/pickers'

Refactored utility createSvgIcon in latest material-ui version breaks pickers svgs. This has been removed from the internal path in the following commit

mui/material-ui@8ea2df8

[oliviertassinari]

I was about to open an issue to encourage the change of API, I hadn't realized that it would have broken the component, sorry.

I wish it didn't happen. We could have avoided the problem by releasing the pickers at the same time, which mui/material-ui#19706 would enable.
The alternative would have been to do it in two steps, keep the internals, add the new API, migrate pickers, remove internal. But this sounds like x2 the among of work.

[dmtrKovalenko]

I am happy that at least v3.2.10 is not affected by this change.

[icflorescu]

Is there any way I can help to speed up the release of an alpha.5 release to include this fix?

[digitalkaoz]

i mean its an easy change, currently its all broken :(

[oliviertassinari]

@icflorescu Definitely, what do you think about this diff? Do you want to submit a pull request :)?

diff --git a/docs/package.json b/docs/package.json
index 6bde60d5..722ebeb3 100644
--- a/docs/package.json
+++ b/docs/package.json
@@ -21,7 +21,7 @@
     "@date-io/hijri": "^2.2.0",
     "@date-io/jalaali": "^2.0.0",
     "@mapbox/rehype-prism": "^0.4.0",
-    "@material-ui/core": "^4.9.7",
+    "@material-ui/core": "^4.9.9",
     "@material-ui/icons": "^4.9.1",
     "@material-ui/pickers": "^4.0.0-alpha.1",
     "@types/fuzzy-search": "^2.1.0",
diff --git a/lib/package.json b/lib/package.json
index e4477f69..6b8815b2 100644
--- a/lib/package.json
+++ b/lib/package.json
@@ -32,7 +32,7 @@
     "email": "dmtr.kovalenko@outlook.com"
   },
   "peerDependencies": {
-    "@material-ui/core": "^4.0.0",
+    "@material-ui/core": "^4.9.9",
     "@types/react": "^16.8.6",
     "react": "^16.8.4",
     "react-dom": "^16.8.4"
@@ -77,7 +77,7 @@
     "@babel/preset-env": "^7.6.0",
     "@babel/preset-react": "^7.0.0",
     "@cypress/webpack-preprocessor": "^4.1.1",
-    "@material-ui/core": "^4.9.7",
+    "@material-ui/core": "^4.9.9",
     "@material-ui/icons": "^4.9.1",
     "@types/enzyme": "^3.10.5",
     "@types/enzyme-adapter-react-16": "^1.0.3",
diff --git a/lib/rollup.config.js b/lib/rollup.config.js
index 0628df6f..7977601a 100644
--- a/lib/rollup.config.js
+++ b/lib/rollup.config.js
@@ -26,7 +26,6 @@ const globals = {
   '@material-ui/core/Grid': 'material-ui.Grid',
   '@material-ui/core/IconButton': 'material-ui.IconButton',
   '@material-ui/core/InputAdornment': 'material-ui.InputAdornment',
-  '@material-ui/core/internal/svg-icons/createSvgIcon': 'material-ui.createSvgIcon',
   '@material-ui/core/Paper': 'material-ui.Paper',
   '@material-ui/core/Popover': 'material-ui.Popover',
   '@material-ui/core/styles': 'material-ui',
diff --git a/lib/src/_shared/icons/ArrowDropDownIcon.tsx b/lib/src/_shared/icons/ArrowDropDownIcon.tsx
index 1515a3f8..e5c0c589 100644
--- a/lib/src/_shared/icons/ArrowDropDownIcon.tsx
+++ b/lib/src/_shared/icons/ArrowDropDownIcon.tsx
@@ -1,4 +1,4 @@
 import React from 'react';
-import createSvgIcon from '@material-ui/core/internal/svg-icons/createSvgIcon';
+import { createSvgIcon } from '@material-ui/core/utils';

 export const ArrowDropDownIcon = createSvgIcon(<path d="M7 10l5 5 5-5z" />, 'ArrowDropDownIcon');
diff --git a/lib/typings.d.ts b/lib/typings.d.ts
index d58eafa3..e9750fd6 100644
--- a/lib/typings.d.ts
+++ b/lib/typings.d.ts
@@ -4,11 +4,3 @@ declare module '@date-io/type' {

   export type DateType = Moment | DateTime | Date;
 }
-
-declare module '@material-ui/core/internal/svg-icons/createSvgIcon' {
-  import * as React from 'react';
-  import { SvgIconProps } from '@material-ui/core';
-
-  declare const createSvgIcon: (path: React.ReactNode, name: string) => React.FC<SvgIconProps>;
-  export default createSvgIcon;
-}
diff --git a/yarn.lock b/yarn.lock
index c16e430f..32421057 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -1626,10 +1626,10 @@
     refractor "^2.3.0"
     unist-util-visit "^1.1.3"

-"@material-ui/core@^4.9.7":
-  version "4.9.7"
-  resolved "https://registry.yarnpkg.com/@material-ui/core/-/core-4.9.7.tgz#0c1caf123278770f34c5d8e9ecd9e1314f87a621"
-  integrity sha512-RTRibZgq572GHEskMAG4sP+bt3P3XyIkv3pOTR8grZAW2rSUd6JoGZLRM4S2HkuO7wS7cAU5SpU2s1EsmTgWog==
+"@material-ui/core@^4.9.9":
+  version "4.9.9"
+  resolved "https://registry.yarnpkg.com/@material-ui/core/-/core-4.9.9.tgz#902dc37eeb415dd3288feb2c92e0dc27d9caed48"
+  integrity sha512-Gp0UdJLxPEnkn7O0QpJ2/LOeIuT8nX9e6CjQFuLnOy10rUGjRsOZ2T170Y057xdUmw1VNE+0bvkkO6dOghxt4g==
   dependencies:
     "@babel/runtime" "^7.4.4"
     "@material-ui/styles" "^4.9.6"

It would need to be completed with all the icons.

[kelly-tock]

lab needs this too I believe 😄

[Vincz]

Hey @oliviertassinari ! I started a PR here : #1629

But I'm not sure about the config in this two files:

https://github.com/mui-org/material-ui-pickers/blob/4eca4db9b08769349011f4901c828901271e6c52/lib/rollup.config.js#L29

and

https://github.com/mui-org/material-ui-pickers/blob/4eca4db9b08769349011f4901c828901271e6c52/lib/typings.d.ts#L8