feat: update mdcweb v1.x.x (#830)

BREAKING CHANGE: Text-field, select, list have API changes. Please see PR #830 for more details.

Author: Matt Goo

docs/best-practices.md

@@ -27,9 +27,4 @@ Since `[email protected]` is exporting `default`, we should be importing as such:
 ```ts
 // referenced in https://github.com/basarat/typescript-book/blob/master/docs/project/external-modules.md#default-exportsimports
 import classnames from 'classnames';
-```
-
-In other cases where we import modules that do not use `default`, we should import like:
-```ts
-import * as classnames from 'classnames';
 ```

package-lock.json

@@ -14,7 +14,7 @@
     "pretest": "npm stop",
     "test": "npm run lint && npm run test:unit && npm run test:screenshots",
     "posttest": "npm stop && istanbul report --root coverage text-summary && istanbul check-coverage --lines 95 --statements 95 --branches 95 --functions 95",
-    "postinstall": "lerna bootstrap",
+    "postinstall": "lerna bootstrap && rm node_modules/**/.babelrc -f && rm packages/**/node_modules/.babelrc -f",
     "test:watch": "karma start karma.local.js --auto-watch",
     "test:unit": "npm run clean && cross-env NODE_ENV=test karma start karma.local.js --single-run",
     "test:unit-ci": "karma start karma.ci.js --single-run",
@@ -41,9 +41,11 @@
           "linear-progress",
           "list",
           "menu-surface",
+          "notched-outline",
           "radio",
           "ripple",
           "select",
+          "snackbar",
           "top-app-bar",
           "switch",
           "tab",
@@ -60,34 +62,27 @@
   },
   "devDependencies": {
     "@google-cloud/storage": "^1.6.0",
-    "@material/button": "^0.43.0",
-    "@material/card": "^0.41.0",
-    "@material/checkbox": "^0.41.0",
-    "@material/chips": "^0.41.0",
-    "@material/dialog": "^0.43.0",
-    "@material/dom": "^0.41.0",
-    "@material/drawer": "^0.41.0",
-    "@material/fab": "^0.41.0",
-    "@material/floating-label": "^0.41.0",
-    "@material/icon-button": "^0.41.0",
-    "@material/layout-grid": "^0.41.0",
-    "@material/line-ripple": "^0.41.0",
-    "@material/linear-progress": "^0.41.0",
-    "@material/list": "^0.41.0",
-    "@material/menu-surface": "^0.41.0",
-    "@material/notched-outline": "^0.41.0",
-    "@material/radio": "^0.41.0",
-    "@material/ripple": "^0.41.0",
-    "@material/select": "^0.40.1",
-    "@material/snackbar": "^0.43.0",
-    "@material/switch": "^0.41.0",
-    "@material/tab": "^0.41.0",
-    "@material/tab-bar": "^0.41.0",
-    "@material/tab-indicator": "^0.41.0",
-    "@material/tab-scroller": "^0.41.0",
-    "@material/textfield": "^0.41.0",
-    "@material/top-app-bar": "^0.41.0",
-    "@material/typography": "^0.41.0",
+    "@material/base": "^1.0.0",
+    "@material/button": "^1.1.0",
+    "@material/card": "^1.1.0",
+    "@material/checkbox": "^1.0.0",
+    "@material/chips": "^1.1.1",
+    "@material/dialog": "^1.1.0",
+    "@material/drawer": "^1.0.1",
+    "@material/floating-label": "^1.1.0",
+    "@material/icon-button": "^1.1.0",
+    "@material/line-ripple": "^1.0.0",
+    "@material/list": "1.0.0",
+    "@material/menu-surface": "^1.0.1",
+    "@material/notched-outline": "^1.1.1",
+    "@material/radio": "^1.1.0",
+    "@material/ripple": "^1.0.0",
+    "@material/select": "^1.1.1",
+    "@material/snackbar": "^1.0.0",
+    "@material/tab": "^1.0.0",
+    "@material/tab-bar": "^1.0.0",
+    "@material/textfield": "^1.1.1",
+    "@material/typography": "^1.0.0",
     "@types/chai": "^4.1.7",
     "@types/classnames": "^2.2.6",
     "@types/enzyme": "^3.1.15",
@@ -119,8 +114,9 @@
     "cp-file": "^6.0.0",
     "cross-env": "^5.2.0",
     "css-loader": "^0.28.10",
-    "enzyme": "^3.3.0",
-    "enzyme-adapter-react-16": "^1.1.1",
+    "enzyme": "^3.9.0",
+    "enzyme-adapter-react-16": "^1.11.2",
+    "enzyme-adapter-utils": "^1.10.1",
     "eslint": "^5.9.0",
     "eslint-config-google": "^0.9.1",
     "eslint-plugin-react": "^7.7.0",
@@ -146,13 +142,13 @@
     "react-dom": "^16.4.2",
     "react-router-dom": "^4.3.1",
     "remap-istanbul": "^0.12.0",
-    "rimraf": "^2.6.3",
     "resemblejs": "^3.0.1",
+    "rimraf": "^2.6.3",
     "sass-loader": "^6.0.7",
     "testdouble": "^3.6.0",
     "ts-loader": "^3.5.0",
     "ts-node": "^7.0.1",
-    "typescript": "^3.2.2",
+    "typescript": "^3.3.3",
     "typescript-eslint-parser": "^21.0.1",
     "utility-types": "^2.1.0",
     "uuid": "^3.3.2",

package.json

@@ -20,16 +20,16 @@
 // OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
 // THE SOFTWARE.
 
-import * as React from 'react';
+import React from 'react';
 import classnames from 'classnames';
-import * as Ripple from '@material/react-ripple';
+import {withRipple, InjectedProps} from '@material/react-ripple';
 
 const BUTTON_CLASS_NAME = 'mdc-button__icon';
 
 type ButtonTypes = HTMLAnchorElement | HTMLButtonElement;
 
 export interface ButtonProps<T extends ButtonTypes>
-  extends Ripple.InjectedProps<T>, React.AnchorHTMLAttributes<T>, React.ButtonHTMLAttributes<T> {
+  extends InjectedProps<T>, React.AnchorHTMLAttributes<T>, React.ButtonHTMLAttributes<T> {
     raised?: boolean;
     unelevated?: boolean;
     outlined?: boolean;
@@ -109,5 +109,5 @@ Button.defaultProps = {
   initRipple: () => {},
 };
 
-export default Ripple.withRipple<ButtonProps<ButtonTypes>, ButtonTypes>(Button);
+export default withRipple<ButtonProps<ButtonTypes>, ButtonTypes>(Button);
 

packages/button/index.tsx

@@ -17,7 +17,7 @@
     "url": "https://github.com/material-components/material-components-web-react.git"
   },
   "dependencies": {
-    "@material/button": "^0.43.0",
+    "@material/button": "^1.1.0",
     "@material/react-ripple": "^0.11.0",
     "classnames": "^2.2.6",
     "react": "^16.4.2"

packages/button/package.json

@@ -20,7 +20,7 @@
 // OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
 // THE SOFTWARE.
 
-import * as React from 'react';
+import React from 'react';
 import classnames from 'classnames';
 
 type ChildType = React.ReactElement<React.HTMLProps<HTMLButtonElement|HTMLAnchorElement>>;

packages/card/ActionButtons.tsx

@@ -20,7 +20,7 @@
 // OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
 // THE SOFTWARE.
 
-import * as React from 'react';
+import React from 'react';
 import classnames from 'classnames';
 
 type ChildType = React.ReactElement<React.HTMLProps<HTMLImageElement|HTMLOrSVGElement>>;

packages/card/ActionIcons.tsx

@@ -20,7 +20,7 @@
 // OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
 // THE SOFTWARE.
 
-import * as React from 'react';
+import React from 'react';
 import classnames from 'classnames';
 
 export interface ActionsProps extends React.HTMLProps<HTMLDivElement> {

packages/card/Actions.tsx

@@ -20,7 +20,7 @@
 // OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
 // THE SOFTWARE.
 
-import * as React from 'react';
+import React from 'react';
 import classnames from 'classnames';
 
 export interface MediaProps extends React.HTMLProps<HTMLDivElement> {

packages/card/Media.tsx

@@ -20,11 +20,11 @@
 // OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
 // THE SOFTWARE.
 
-import * as React from 'react';
+import React from 'react';
 import classnames from 'classnames';
-import * as Ripple from '@material/react-ripple';
+import {withRipple, InjectedProps} from '@material/react-ripple';
 
-export interface PrimaryContentBaseProps extends React.HTMLProps<HTMLDivElement>, Ripple.InjectedProps<HTMLDivElement>{
+export interface PrimaryContentBaseProps extends React.HTMLProps<HTMLDivElement>, InjectedProps<HTMLDivElement>{
   className: string;
   unbounded?: boolean;
 };
@@ -47,4 +47,4 @@ export const PrimaryContentBase: React.FunctionComponent<PrimaryContentBaseProps
   );
 };
 
-export default Ripple.withRipple<PrimaryContentBaseProps, HTMLDivElement>(PrimaryContentBase);
+export default withRipple<PrimaryContentBaseProps, HTMLDivElement>(PrimaryContentBase);