createSvgIcon refactor in @material-ui 4.9.9 breaking builds

Kauabunga commented 4 years ago

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

https://github.com/mui-org/material-ui/commit/8ea2df8a18fb4a1f8a89e755e0d7f05a9b8eed73

oliviertassinari commented 4 years ago

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 https://github.com/mui-org/material-ui/issues/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 commented 4 years ago

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

icflorescu commented 4 years ago

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

digitalkaoz commented 4 years ago

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

oliviertassinari commented 4 years ago

@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.