diff --git a/package-lock.json b/package-lock.json index c538721a4..32ae7f2f9 100644 --- a/package-lock.json +++ b/package-lock.json @@ -1203,49 +1203,92 @@ "dev": true }, "@material/snackbar": { - "version": "0.43.0", - "resolved": "https://registry.npmjs.org/@material/snackbar/-/snackbar-0.43.0.tgz", - "integrity": "sha512-jmyQSDRLHeZWitrQJM26gySxBeY47zuAyouVsdm0HioYiElQWsn2LJLvl74kLwYByHtK+sFNkcJkKUh+Xm36OQ==", + "version": "1.0.1", + "resolved": "https://registry.npmjs.org/@material/snackbar/-/snackbar-1.0.1.tgz", + "integrity": "sha512-Gts1N3DA7uEac7JZ1kNwTN+ljgrMDzVGgLAwgcPFSssndW08GSkmZSAko8Lk0Zb4hDY90WtI4jPwuzekixIrWw==", "dev": true, "requires": { - "@material/animation": "^0.41.0", - "@material/base": "^0.41.0", - "@material/button": "^0.43.0", - "@material/dom": "^0.41.0", - "@material/icon-button": "^0.43.0", - "@material/ripple": "^0.43.0", + "@material/animation": "^1.0.0", + "@material/base": "^1.0.0", + "@material/button": "^1.0.1", + "@material/dom": "^1.0.1", + "@material/icon-button": "^1.0.1", + "@material/ripple": "^1.0.1", "@material/rtl": "^0.42.0", - "@material/shape": "^0.43.0", - "@material/theme": "^0.43.0", - "@material/typography": "^0.43.0" + "@material/shape": "^1.0.0", + "@material/theme": "^1.0.0", + "@material/typography": "^1.0.0", + "tslib": "^1.9.3" }, "dependencies": { - "@material/base": { - "version": "0.41.0", - "resolved": "https://registry.npmjs.org/@material/base/-/base-0.41.0.tgz", - "integrity": "sha512-tEyzwBRu3d1H120SfKsDVYZHcqT5lKohh/7cWKR93aAaPDkSvjpKJIjyu2yuSkjpDduVZGzVocYbOvhUKhhzXQ==", - "dev": true + "@material/animation": { + "version": "1.0.0", + "resolved": "https://registry.npmjs.org/@material/animation/-/animation-1.0.0.tgz", + "integrity": "sha512-Ed5/vggn6ZhSJ87yn3ZS1d826VJNFz73jHF2bSsgRtHDoB8KCuOwQMfdgAgDa4lKDF6CDIPCKBZPKrs2ubehdw==", + "dev": true, + "requires": { + "tslib": "^1.9.3" + } + }, + "@material/button": { + "version": "1.0.1", + "resolved": "https://registry.npmjs.org/@material/button/-/button-1.0.1.tgz", + "integrity": "sha512-gMGuAlG9ETKH14Up4RAH87Z+51NkU725C4H7J0AnICzG75Rto8PtpMqNu5+w/c1cQM1Hudc8JfsflneMEZ10oA==", + "dev": true, + "requires": { + "@material/elevation": "^1.0.0", + "@material/feature-targeting": "^0.44.1", + "@material/ripple": "^1.0.1", + "@material/rtl": "^0.42.0", + "@material/shape": "^1.0.0", + "@material/theme": "^1.0.0", + "@material/typography": "^1.0.0" + } + }, + "@material/dom": { + "version": "1.0.1", + "resolved": "https://registry.npmjs.org/@material/dom/-/dom-1.0.1.tgz", + "integrity": "sha512-7gb9Tk8YBn2fLEa5fJfvDexG0QxvRGDb8c6uZEhvK4bTd2ZHCfHg9KrO+smC6Trbn5jC+FsBvdRZBbMjtS/E4g==", + "dev": true, + "requires": { + "tslib": "^1.9.3" + } + }, + "@material/elevation": { + "version": "1.0.0", + "resolved": "https://registry.npmjs.org/@material/elevation/-/elevation-1.0.0.tgz", + "integrity": "sha512-TqmvEXmZDYLm2X5lEnjKCsZMDkCXpxFFxL22AfCAQB5L4d0gAS7vqDEE797y4Rp+BBKEcOP71mum1l56RI3NBQ==", + "dev": true, + "requires": { + "@material/animation": "^1.0.0", + "@material/feature-targeting": "^0.44.1", + "@material/theme": "^1.0.0" + } }, "@material/icon-button": { - "version": "0.43.0", - "resolved": "https://registry.npmjs.org/@material/icon-button/-/icon-button-0.43.0.tgz", - "integrity": "sha512-muldr6pmX2peY9ECYxcZfnmDWLqinT+HRVuND2ltCKUqgLBGi4DETQQE0PEOzsChePJothbyqeQorXgcBP8EgQ==", + "version": "1.0.1", + "resolved": "https://registry.npmjs.org/@material/icon-button/-/icon-button-1.0.1.tgz", + "integrity": "sha512-a2jnwYMTDwPVsOIc4+osZIbXwQM7ujy1grQtjvvS0CVogsOdLXYzqUYrI8V9aHxdAdndos3ssm3JAziQhbsuEQ==", "dev": true, "requires": { - "@material/base": "^0.41.0", - "@material/ripple": "^0.43.0", - "@material/theme": "^0.43.0" + "@material/base": "^1.0.0", + "@material/ripple": "^1.0.1", + "@material/theme": "^1.0.0", + "tslib": "^1.9.3" } }, "@material/ripple": { - "version": "0.43.0", - "resolved": "https://registry.npmjs.org/@material/ripple/-/ripple-0.43.0.tgz", - "integrity": "sha512-5X5xJtE1tM5QYrsvIe5coZNk7nt++vi40CDBVxS2abO+83ky91I5mH/djcm0vcSFmkHM/QOymEQBR3XDjA3XXQ==", + "version": "1.0.1", + "resolved": "https://registry.npmjs.org/@material/ripple/-/ripple-1.0.1.tgz", + "integrity": "sha512-aBigRoVMjIU2lLDq7TMocI2H2YFbO1hICs5FTdSRp4Yis/QFTrgaW32q8yuHdZI56j+b2BWIWapqA2xpSmCMXQ==", "dev": true, "requires": { - "@material/animation": "^0.41.0", - "@material/base": "^0.41.0", - "@material/theme": "^0.43.0" + "@material/animation": "^1.0.0", + "@material/base": "^1.0.0", + "@material/dom": "^1.0.1", + "@material/feature-targeting": "^0.44.1", + "@material/theme": "^1.0.0", + "tslib": "^1.9.3" } }, "@material/rtl": { @@ -1255,22 +1298,31 @@ "dev": true }, "@material/shape": { - "version": "0.43.0", - "resolved": "https://registry.npmjs.org/@material/shape/-/shape-0.43.0.tgz", - "integrity": "sha512-KGnoQV4G2OQbMe5Lr5Xbk8XNlO93Qi/juxXtd2wrAfiaPmktD8ug0CwdVDOPBOmj9a0gX3Ofi9XWcoU+tLEVjg==", - "dev": true + "version": "1.0.0", + "resolved": "https://registry.npmjs.org/@material/shape/-/shape-1.0.0.tgz", + "integrity": "sha512-zfXEacPQZmH+ujVtaFyfAsYiF46j1QCcFzJeZVouG4pznrbA7XD6614Ywg0wbyWX5iB6hD52ld/IN+R/6oxKqA==", + "dev": true, + "requires": { + "@material/feature-targeting": "^0.44.1" + } }, "@material/theme": { - "version": "0.43.0", - "resolved": "https://registry.npmjs.org/@material/theme/-/theme-0.43.0.tgz", - "integrity": "sha512-/zndZL6EihI18v2mYd4O8xvOBAAXmLeHyHVK28LozSAaJ9okQgD25wq5Ktk95oMTmPIC+rH66KcK6371ivNk8g==", - "dev": true + "version": "1.0.0", + "resolved": "https://registry.npmjs.org/@material/theme/-/theme-1.0.0.tgz", + "integrity": "sha512-Bg/BQLU5MmCwtQ3DHcSs9DodZB8PTvuItv1wXrP54S/wBVwryIB5uMDmERhnItbNnAFbkKhlAuhn1asMmMzfkQ==", + "dev": true, + "requires": { + "@material/feature-targeting": "^0.44.1" + } }, "@material/typography": { - "version": "0.43.0", - "resolved": "https://registry.npmjs.org/@material/typography/-/typography-0.43.0.tgz", - "integrity": "sha512-WSg8vDoC2rnmOWbhNdDmSoT1jV0QQSw7CFps1DFbnIe57UaUxgWuGdhc+9XlEPctXUFto4FU4DfnRcdW4ydAig==", - "dev": true + "version": "1.0.0", + "resolved": "https://registry.npmjs.org/@material/typography/-/typography-1.0.0.tgz", + "integrity": "sha512-Oeqbjci1cC7jTE8/n3dwnkqKe9ZeWiaE+rgMtRYtRFw1HvAw14SpGA5EEAS/Li2Hu2KZ50FYCe3HYqShfxtChA==", + "dev": true, + "requires": { + "@material/feature-targeting": "^0.44.1" + } } } }, diff --git a/package.json b/package.json index 6e38fa887..e474420fb 100644 --- a/package.json +++ b/package.json @@ -44,6 +44,7 @@ "radio", "ripple", "select", + "snackbar", "top-app-bar", "switch", "tab", @@ -80,7 +81,7 @@ "@material/radio": "^0.41.0", "@material/ripple": "^1.0.0", "@material/select": "^0.40.1", - "@material/snackbar": "^0.43.0", + "@material/snackbar": "^1.0.0", "@material/switch": "^0.41.0", "@material/tab": "^1.0.0", "@material/tab-bar": "^0.41.0", diff --git a/packages/snackbar/index.tsx b/packages/snackbar/index.tsx index 14dccb597..af35732d1 100644 --- a/packages/snackbar/index.tsx +++ b/packages/snackbar/index.tsx @@ -23,11 +23,8 @@ import * as React from 'react'; import classnames from 'classnames'; -// TODO: replace with MDC Web types when available -import {IMDCSnackbarAdapter, IMDCSnackbarFoundation} from './types'; - -// @ts-ignore no .d.ts file -import {MDCSnackbarFoundation} from '@material/snackbar'; +import {MDCSnackbarFoundation} from '@material/snackbar/foundation'; +import {MDCSnackbarAdapter} from '@material/snackbar/adapter'; export interface Props { message: string; @@ -51,7 +48,7 @@ type State = { }; export class Snackbar extends React.Component { - foundation: IMDCSnackbarFoundation + foundation: MDCSnackbarFoundation static defaultProps: Partial = { open: true, @@ -84,7 +81,7 @@ export class Snackbar extends React.Component { this.foundation.setCloseOnEscape(closeOnEscape); } } - get adapter(): IMDCSnackbarAdapter { + get adapter(): MDCSnackbarAdapter { return { addClass: (className: string) => { const {classes} = this.state; diff --git a/packages/snackbar/package.json b/packages/snackbar/package.json index 55760ca77..ecb5722cd 100644 --- a/packages/snackbar/package.json +++ b/packages/snackbar/package.json @@ -17,7 +17,7 @@ "url": "https://github.com/material-components/material-components-web-react.git" }, "dependencies": { - "@material/snackbar": "^0.43.0", + "@material/snackbar": "^1.0.0", "classnames": "^2.2.6", "react": "^16.4.2" }, diff --git a/packages/snackbar/types.tsx b/packages/snackbar/types.tsx deleted file mode 100644 index 31964ea71..000000000 --- a/packages/snackbar/types.tsx +++ /dev/null @@ -1,49 +0,0 @@ -// The MIT License -// -// Copyright (c) 2019 Google, Inc. -// -// Permission is hereby granted, free of charge, to any person obtaining a copy -// of this software and associated documentation files (the "Software"), to deal -// in the Software without restriction, including without limitation the rights -// to use, copy, modify, merge, publish, distribute, sublicense, and/or sell -// copies of the Software, and to permit persons to whom the Software is -// furnished to do so, subject to the following conditions: -// -// The above copyright notice and this permission notice shall be included in -// all copies or substantial portions of the Software. -// -// THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR -// IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, -// FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE -// AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER -// LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, -// OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN -// THE SOFTWARE. - -// TODO: remove this when MDC Web types are added. - -export interface IMDCSnackbarAdapter { - addClass(className: string): void - removeClass(className: string): void - announce(): void - notifyOpening(): void - notifyOpened(): void - notifyClosing(reason: string): void - notifyClosed(reason: string): void -} - -export interface IMDCSnackbarFoundation { - open(): void; - close(action: string): void; - isOpen(): boolean - getTimeoutMs(): number - setTimeoutMs(timeoutMs: number): void - getCloseOnEscape(): boolean - setCloseOnEscape(closeOnEscape: boolean): void - handleKeyDown(event: KeyboardEvent): void - handleActionButtonClick(event: MouseEvent): void - handleActionIconClick(event: MouseEvent): void - init(): void - destroy(): void - adapter_: IMDCSnackbarAdapter -} diff --git a/test/unit/snackbar/index.test.tsx b/test/unit/snackbar/index.test.tsx index 09e3de349..884e0ed2c 100644 --- a/test/unit/snackbar/index.test.tsx +++ b/test/unit/snackbar/index.test.tsx @@ -3,6 +3,12 @@ import * as td from 'testdouble'; import {assert} from 'chai'; import {shallow} from 'enzyme'; import {Snackbar} from '../../../packages/snackbar/index'; +import {MDCSnackbarAdapter} from '@material/snackbar/adapter'; + +function getAdapter(instance: Snackbar): MDCSnackbarAdapter { + // @ts-ignore adapter_ is a protected property, we need to override it + return instance.foundation.adapter_; +} suite('Snackbar'); @@ -71,7 +77,7 @@ test('opening notification works', () => { const openingHandler = td.func<() => void>(); const wrapper = shallow( ); - wrapper.instance().foundation.adapter_.notifyOpening(); + getAdapter(wrapper.instance()).notifyOpening(); td.verify(openingHandler(), {times: 1}); wrapper.unmount(); }); @@ -80,7 +86,7 @@ test('open notification works', () => { const openHandler = td.func<() => void>(); const wrapper = shallow( ); - wrapper.instance().foundation.adapter_.notifyOpened(); + getAdapter(wrapper.instance()).notifyOpened(); td.verify(openHandler(), {times: 1}); wrapper.unmount(); }); @@ -89,7 +95,7 @@ test('closing notification works', () => { const closingHandler = td.func<(reason: string) => void>(); const wrapper = shallow( ); - wrapper.instance().foundation.adapter_.notifyClosing('unit_test'); + getAdapter(wrapper.instance()).notifyClosing('unit_test'); td.verify(closingHandler('unit_test'), {times: 1}); wrapper.unmount(); }); @@ -98,7 +104,7 @@ test('close notification works', () => { const closeHandler = td.func<(reason: string) => void>(); const wrapper = shallow( ); - wrapper.instance().foundation.adapter_.notifyClosed('unit_test'); + getAdapter(wrapper.instance()).notifyClosed('unit_test'); td.verify(closeHandler('unit_test'), {times: 1}); wrapper.unmount(); });