From 9425548aaa0e7818d6ac61da5e14a813ed23682d Mon Sep 17 00:00:00 2001 From: Alex Sheehan Date: Tue, 31 Jan 2017 09:00:12 -0500 Subject: [PATCH 1/6] feat(switch): implement css switch component --- demos/index.html | 1 + demos/switch.html | 110 ++++++++++ .../material-components-web.scss | 1 + packages/material-components-web/package.json | 1 + packages/mdc-switch/README.md | 49 +++++ packages/mdc-switch/_mixins.scss | 18 ++ packages/mdc-switch/_variables.scss | 32 +++ packages/mdc-switch/mdc-switch.scss | 202 ++++++++++++++++++ packages/mdc-switch/package.json | 15 ++ webpack.config.js | 1 + 10 files changed, 430 insertions(+) create mode 100644 demos/switch.html create mode 100644 packages/mdc-switch/README.md create mode 100644 packages/mdc-switch/_mixins.scss create mode 100644 packages/mdc-switch/_variables.scss create mode 100644 packages/mdc-switch/mdc-switch.scss create mode 100644 packages/mdc-switch/package.json diff --git a/demos/index.html b/demos/index.html index 0b737ce605a..136abf090ad 100644 --- a/demos/index.html +++ b/demos/index.html @@ -37,6 +37,7 @@
  • List
  • Select
  • Menu (simple)
  • +
  • Switch
  • Radio
  • Ripple
  • Snackbar
  • diff --git a/demos/switch.html b/demos/switch.html new file mode 100644 index 00000000000..24caa3cfc69 --- /dev/null +++ b/demos/switch.html @@ -0,0 +1,110 @@ + + + + + + MDC Switch Demo + + + + + + +
    +

    MDC Switch - CSS Only

    + +
    +

    Switch on Light Theme

    +
    + +
    +
    +
    +
    + +
    +
    +

    Switch on Light Theme - Disabled

    +
    + +
    +
    +
    +
    + +
    + +
    +

    Switch on Light Theme

    +
    + +
    +
    +
    +
    + +
    + +
    +

    Switch on Light Theme - Disabled

    +
    + +
    +
    +
    +
    + +
    + +
    + + + diff --git a/packages/material-components-web/material-components-web.scss b/packages/material-components-web/material-components-web.scss index 9580e1f3bba..457c594fc93 100644 --- a/packages/material-components-web/material-components-web.scss +++ b/packages/material-components-web/material-components-web.scss @@ -29,6 +29,7 @@ @import "@material/ripple/mdc-ripple"; @import "@material/select/mdc-select"; @import "@material/snackbar/mdc-snackbar"; +@import "@material/switch/mdc-switch"; @import "@material/textfield/mdc-textfield"; @import "@material/theme/mdc-theme"; @import "@material/typography/mdc-typography"; diff --git a/packages/material-components-web/package.json b/packages/material-components-web/package.json index ce524da63dd..59c0aece5c0 100644 --- a/packages/material-components-web/package.json +++ b/packages/material-components-web/package.json @@ -26,6 +26,7 @@ "@material/ripple": "^0.1.2", "@material/select": "^0.2.0", "@material/snackbar": "^0.1.2", + "@material/switch": "^0.3.0", "@material/textfield": "^0.2.0", "@material/theme": "^0.1.1", "@material/typography": "^0.1.1" diff --git a/packages/mdc-switch/README.md b/packages/mdc-switch/README.md new file mode 100644 index 00000000000..391c26776d8 --- /dev/null +++ b/packages/mdc-switch/README.md @@ -0,0 +1,49 @@ +# MDC Switch + +The MDC Switch component is a spec-aligned switch component adhering to the +[Material Design Switch requirements](https://material.io/guidelines/components/selection-controls.html#selection-controls-switch). +It works without JavaScript. + +## Installation + +``` +npm install --save @material/switch +``` + +## Usage + +### CSS Only +```html +
    + +
    +
    +
    +
    + +``` + +### CSS Only - Disabled +```html +
    + +
    +
    +
    +
    + +``` + +## Classes + +### Block + +The block class is `mdc-switch`. This defines the top-level switch element. + +### Modifier + +The provided modifiers are: + +| Class | Description | +| ----------------------| -------------------------------------------- | +| `mdc-fab--disabled` | Applies disabled style to disabled switches. | diff --git a/packages/mdc-switch/_mixins.scss b/packages/mdc-switch/_mixins.scss new file mode 100644 index 00000000000..7e631768926 --- /dev/null +++ b/packages/mdc-switch/_mixins.scss @@ -0,0 +1,18 @@ +// +// Copyright 2016 Google Inc. All Rights Reserved. +// +// Licensed under the Apache License, Version 2.0 (the "License"); +// you may not use this file except in compliance with the License. +// You may obtain a copy of the License at +// +// http://www.apache.org/licenses/LICENSE-2.0 +// +// Unless required by applicable law or agreed to in writing, software +// distributed under the License is distributed on an "AS IS" BASIS, // WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. +// See the License for the specific language governing permissions and +// limitations under the License. +// + +@function mdc-switch-transition($property, $timing-function, $duration: $mdc-switch-transition-duration) { + @return $property $duration $timing-function; +} diff --git a/packages/mdc-switch/_variables.scss b/packages/mdc-switch/_variables.scss new file mode 100644 index 00000000000..2d9b70fe550 --- /dev/null +++ b/packages/mdc-switch/_variables.scss @@ -0,0 +1,32 @@ +$mdc-switch-track-width: 34px; +$mdc-switch-track-height: 14px; +$mdc-switch-knob-diameter: 20px; +// +// Copyright 2016 Google Inc. All Rights Reserved. +// +// Licensed under the Apache License, Version 2.0 (the "License"); +// you may not use this file except in compliance with the License. +// You may obtain a copy of the License at +// +// http://www.apache.org/licenses/LICENSE-2.0 +// +// Unless required by applicable law or agreed to in writing, software +// distributed under the License is distributed on an "AS IS" BASIS, +// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. +// See the License for the specific language governing permissions and +// limitations under the License. +// + +$mdc-switch-focus-ring-diameter: 48px; +$mdc-switch-knob-active-margin: $mdc-switch-track-width - $mdc-switch-knob-diameter; + +$mdc-switch-unchecked-background-color: #221f1f; +$mdc-switch-unchecked-knob-color: #f1f1f1; +$mdc-switch-unchecked-focus-ring-color: #9e9e9e; +$mdc-switch-disabled-focus-ring-color: #000; +$mdc-switch-unchecked-disabled-knob-color: #bdbdbd; +$mdc-switch-unchecked-knob-color-dark: #424242; +$mdc-switch-unchecked-track-color-dark: #484848; + +$mdc-switch-transition-duration: 175ms; +$mdc-switch-transition-curve: cubic-bezier(.4, 0, .2, 1); diff --git a/packages/mdc-switch/mdc-switch.scss b/packages/mdc-switch/mdc-switch.scss new file mode 100644 index 00000000000..24ff5c6f8cf --- /dev/null +++ b/packages/mdc-switch/mdc-switch.scss @@ -0,0 +1,202 @@ +// Copyright 2016 Google Inc. All Rights Reserved. +// +// Licensed under the Apache License, Version 2.0 (the "License"); +// you may not use this file except in compliance with the License. +// You may obtain a copy of the License at +// +// http://www.apache.org/licenses/LICENSE-2.0 +// +// Unless required by applicable law or agreed to in writing, software +// distributed under the License is distributed on an "AS IS" BASIS, +// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. +// See the License for the specific language governing permissions and +// limitations under the License. + +@import "@material/animation/functions"; +@import "@material/animation/variables"; +@import "@material/elevation/mixins"; +@import "@material/theme/mixins"; +@import "./mixins"; +@import "./variables"; + +// postcss-bem-linter: define switch +.mdc-switch { + display: inline-block; + position: relative; + + &__native-control { + display: inline-block; + position: absolute; + top: 0; + left: 0; + width: $mdc-switch-track-width; + height: $mdc-switch-track-height; + cursor: pointer; + opacity: 0; + z-index: 2; + } + + &__background { + display: block; + position: relative; + width: $mdc-switch-track-width; + height: $mdc-switch-track-height; + border-radius: 7px; + outline: none; + background-color: transparent; + cursor: pointer; + user-select: none; + + @include mdc-theme-dark(".mdc-checkbox") { + @include mdc-theme-prop(background-color, text-hint-on-dark); + } + + &::before { + display: block; + position: absolute; + top: 0; + right: 0; + bottom: 0; + left: 0; + transition: + mdc-checkbox-transition(opacity, $mdc-switch-transition-curve), + mdc-checkbox-transition(background-color, $mdc-switch-transition-curve); + border-radius: 7px; + background-color: $mdc-switch-unchecked-background-color; + content: ""; + opacity: .28; + } + + // postcss-bem-linter: ignore + .mdc-switch__knob { + display: block; + position: absolute; + top: -3px; + left: 0; + width: $mdc-switch-knob-diameter; + height: $mdc-switch-knob-diameter; + transform: translateX(0); + transition: + mdc-checkbox-transition(transform, $mdc-switch-transition-curve), + mdc-checkbox-transition(background-color, $mdc-switch-transition-curve); + border-radius: $mdc-switch-knob-diameter / 2; + background-color: $mdc-switch-unchecked-knob-color; + + @include mdc-elevation(1); + + z-index: 1; + + // postcss-bem-linter: ignore + &::before { + position: absolute; + top: -14px; + left: -14px; + width: $mdc-switch-focus-ring-diameter; + height: $mdc-switch-focus-ring-diameter; + transform: scale(0); + transition: + mdc-checkbox-transition(transform, $mdc-switch-transition-curve), + mdc-checkbox-transition(background-color, $mdc-switch-transition-curve); + border-radius: $mdc-switch-focus-ring-diameter / 2; + background-color: transparent; + content: ""; + opacity: .2; + } + } + } +} + +.mdc-switch__native-control:focus ~ .mdc-switch__background { + + .mdc-switch__knob { + &::before { + position: absolute; + width: $mdc-switch-focus-ring-diameter; + height: $mdc-switch-focus-ring-diameter; + transform: scale(1); + transition: + mdc-checkbox-transition(transform, $mdc-switch-transition-curve), + mdc-checkbox-transition(background-color, $mdc-switch-transition-curve); + border-radius: $mdc-switch-focus-ring-diameter / 2; + background-color: $mdc-switch-unchecked-focus-ring-color; + + @include mdc-theme-dark(".mdc-checkbox") { + background-color: $mdc-switch-unchecked-knob-color; + } + + } + } +} + +.mdc-switch__native-control:checked ~ .mdc-switch__background { + + &::before { + @include mdc-theme-prop(background-color, primary); + opacity: .5; + } + + .mdc-switch__knob { + transform: translateX($mdc-switch-track-width - $mdc-switch-knob-diameter); + transition: + mdc-checkbox-transition(transform, $mdc-switch-transition-curve), + mdc-checkbox-transition(background-color, $mdc-switch-transition-curve); + + @include mdc-theme-prop(background-color, primary); + + &::before { + @include mdc-theme-prop(background-color, primary); + + @include mdc-theme-dark(".mdc-checkbox") { + @include mdc-theme-prop(background-color, primary); + } + + opacity: .15; + } + } +} + +// postcss-bem-linter: end + +.mdc-switch--disabled { + cursor: initial; + + .mdc-switch__native-control { + cursor: initial; + } + + .mdc-switch__background { + cursor: initial; + + &::before { + background-color: $mdc-switch-unchecked-track-color-dark; + + @include mdc-theme-dark(".mdc-checkbox") { + background-color: $mdc-switch-unchecked-track-color-dark; + } + + } + + .mdc-switch__knob { + background-color: $mdc-switch-unchecked-knob-color; + + @include mdc-theme-dark(".mdc-checkbox") { + background-color: $mdc-switch-unchecked-knob-color-dark; + } + + } + } + + .mdc-switch__native-control:focus ~ .mdc-switch__knob::before { + transform: scale(1); + transition: + mdc-checkbox-transition(transform, $mdc-switch-transition-curve), + mdc-checkbox-transition(background-color, $mdc-switch-transition-curve); + background-color: $mdc-switch-disabled-focus-ring-color; + opacity: .1; + } +} + +.mdc-switch-label { + margin-left: 10px; +} + diff --git a/packages/mdc-switch/package.json b/packages/mdc-switch/package.json new file mode 100644 index 00000000000..3df0c7e3fad --- /dev/null +++ b/packages/mdc-switch/package.json @@ -0,0 +1,15 @@ +{ + "name": "@material/switch", + "description": "The Material Components for the web switch component", + "version": "0.3.0", + "license": "Apache-2.0", + "repository": { + "type": "git", + "url": "https://github.com/material-components/material-components-web.git" + }, + "dependencies": { + "@material/animation": "^0.1.3", + "@material/elevation": "^0.1.2", + "@material/theme": "^0.1.1" + } +} diff --git a/webpack.config.js b/webpack.config.js index 455fc21519f..b9b463d91d7 100644 --- a/webpack.config.js +++ b/webpack.config.js @@ -116,6 +116,7 @@ module.exports = [{ 'mdc.ripple': path.resolve('./packages/mdc-ripple/mdc-ripple.scss'), 'mdc.select': path.resolve('./packages/mdc-select/mdc-select.scss'), 'mdc.snackbar': path.resolve('./packages/mdc-snackbar/mdc-snackbar.scss'), + 'mdc.switch': path.resolve('./packages/mdc-switch/mdc-switch.scss'), 'mdc.textfield': path.resolve('./packages/mdc-textfield/mdc-textfield.scss'), 'mdc.theme': path.resolve('./packages/mdc-theme/mdc-theme.scss'), 'mdc.typography': path.resolve('./packages/mdc-typography/mdc-typography.scss'), From 74c3ab1d1c968c09762971c0e76666a95a367423 Mon Sep 17 00:00:00 2001 From: Alex Sheehan Date: Tue, 31 Jan 2017 09:04:01 -0500 Subject: [PATCH 2/6] feat(switch): corrected variable file top comment --- packages/mdc-switch/_variables.scss | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/packages/mdc-switch/_variables.scss b/packages/mdc-switch/_variables.scss index 2d9b70fe550..76c919c8851 100644 --- a/packages/mdc-switch/_variables.scss +++ b/packages/mdc-switch/_variables.scss @@ -1,6 +1,3 @@ -$mdc-switch-track-width: 34px; -$mdc-switch-track-height: 14px; -$mdc-switch-knob-diameter: 20px; // // Copyright 2016 Google Inc. All Rights Reserved. // @@ -17,6 +14,9 @@ $mdc-switch-knob-diameter: 20px; // limitations under the License. // +$mdc-switch-track-width: 34px; +$mdc-switch-track-height: 14px; +$mdc-switch-knob-diameter: 20px; $mdc-switch-focus-ring-diameter: 48px; $mdc-switch-knob-active-margin: $mdc-switch-track-width - $mdc-switch-knob-diameter; From bfcb4797bd9cbce5996b156982aaf615e02344be Mon Sep 17 00:00:00 2001 From: Alex Sheehan Date: Wed, 1 Feb 2017 12:32:44 -0500 Subject: [PATCH 3/6] feat(switch): Code review changes --- demos/switch.html | 94 ++++++++++++++--------------- packages/mdc-snackbar/package.json | 5 +- packages/mdc-switch/README.md | 5 +- packages/mdc-switch/_variables.scss | 13 ++-- packages/mdc-switch/mdc-switch.scss | 66 +++++++++----------- 5 files changed, 89 insertions(+), 94 deletions(-) diff --git a/demos/switch.html b/demos/switch.html index 24caa3cfc69..66ad86885a6 100644 --- a/demos/switch.html +++ b/demos/switch.html @@ -53,56 +53,56 @@

    MDC Switch - CSS Only

    -
    +

    Switch on Light Theme

    -
    - -
    -
    -
    -
    - -
    -
    +
    + +
    +
    +
    +
    + +
    +

    Switch on Light Theme - Disabled

    -
    - -
    -
    -
    -
    - -
    - -
    -

    Switch on Light Theme

    -
    - -
    -
    -
    -
    - -
    - -
    +
    + +
    +
    +
    +
    + +
    + +
    +

    Switch on Dark Theme

    +
    + +
    +
    +
    +
    + +
    + +

    Switch on Light Theme - Disabled

    -
    - -
    -
    -
    -
    - -
    +
    + +
    +
    +
    +
    + +
    diff --git a/packages/mdc-snackbar/package.json b/packages/mdc-snackbar/package.json index 4b0cffc8b69..0bf85b0bfb3 100644 --- a/packages/mdc-snackbar/package.json +++ b/packages/mdc-snackbar/package.json @@ -15,5 +15,8 @@ "@material/rtl": "^0.1.1", "@material/theme": "^0.1.1", "@material/typography": "^0.1.1" - } + }, + "publishConfig": { + "access": "public" + } } diff --git a/packages/mdc-switch/README.md b/packages/mdc-switch/README.md index 391c26776d8..bcbf20e0640 100644 --- a/packages/mdc-switch/README.md +++ b/packages/mdc-switch/README.md @@ -12,7 +12,6 @@ npm install --save @material/switch ## Usage -### CSS Only ```html
    @@ -23,7 +22,7 @@ npm install --save @material/switch ``` -### CSS Only - Disabled +### Disabled ```html
    @@ -46,4 +45,4 @@ The provided modifiers are: | Class | Description | | ----------------------| -------------------------------------------- | -| `mdc-fab--disabled` | Applies disabled style to disabled switches. | +| `mdc-switch--disabled` | Applies disabled style to disabled switches. | diff --git a/packages/mdc-switch/_variables.scss b/packages/mdc-switch/_variables.scss index 76c919c8851..d6f3c0bb210 100644 --- a/packages/mdc-switch/_variables.scss +++ b/packages/mdc-switch/_variables.scss @@ -20,13 +20,14 @@ $mdc-switch-knob-diameter: 20px; $mdc-switch-focus-ring-diameter: 48px; $mdc-switch-knob-active-margin: $mdc-switch-track-width - $mdc-switch-knob-diameter; -$mdc-switch-unchecked-background-color: #221f1f; -$mdc-switch-unchecked-knob-color: #f1f1f1; +$mdc-switch-unchecked-track-color: #000; +$mdc-switch-unchecked-knob-color: #fafafa; $mdc-switch-unchecked-focus-ring-color: #9e9e9e; -$mdc-switch-disabled-focus-ring-color: #000; -$mdc-switch-unchecked-disabled-knob-color: #bdbdbd; -$mdc-switch-unchecked-knob-color-dark: #424242; -$mdc-switch-unchecked-track-color-dark: #484848; +$mdc-switch-unchecked-knob-color-dark: #bdbdbd; +$mdc-switch-unchecked-track-color-dark: #fff; +$mdc-switch-unchecked-focus-ring-color-dark: #f1f1f1; +$mdc-switch-disabled-knob-color: #bdbdbd; +$mdc-switch-disabled-knob-color-dark: #424242; $mdc-switch-transition-duration: 175ms; $mdc-switch-transition-curve: cubic-bezier(.4, 0, .2, 1); diff --git a/packages/mdc-switch/mdc-switch.scss b/packages/mdc-switch/mdc-switch.scss index 24ff5c6f8cf..55e15441aa6 100644 --- a/packages/mdc-switch/mdc-switch.scss +++ b/packages/mdc-switch/mdc-switch.scss @@ -48,7 +48,7 @@ user-select: none; @include mdc-theme-dark(".mdc-checkbox") { - @include mdc-theme-prop(background-color, text-hint-on-dark); + background-color: transparent; } &::before { @@ -62,9 +62,15 @@ mdc-checkbox-transition(opacity, $mdc-switch-transition-curve), mdc-checkbox-transition(background-color, $mdc-switch-transition-curve); border-radius: 7px; - background-color: $mdc-switch-unchecked-background-color; + background-color: $mdc-switch-unchecked-track-color; content: ""; - opacity: .28; + opacity: .38; + + @include mdc-theme-dark(".mdc-checkbox") { + background-color: $mdc-switch-unchecked-track-color-dark; + opacity: .3; + } + } // postcss-bem-linter: ignore @@ -82,7 +88,11 @@ border-radius: $mdc-switch-knob-diameter / 2; background-color: $mdc-switch-unchecked-knob-color; - @include mdc-elevation(1); + @include mdc-theme-dark(".mdc-checkbox") { + background-color: $mdc-switch-unchecked-knob-color-dark; + } + + @include mdc-elevation(2); z-index: 1; @@ -121,7 +131,8 @@ background-color: $mdc-switch-unchecked-focus-ring-color; @include mdc-theme-dark(".mdc-checkbox") { - background-color: $mdc-switch-unchecked-knob-color; + background-color: $mdc-switch-unchecked-focus-ring-color-dark; + opacity: .14; } } @@ -157,46 +168,27 @@ // postcss-bem-linter: end -.mdc-switch--disabled { +.mdc-switch__native-control:disabled { cursor: initial; +} - .mdc-switch__native-control { - cursor: initial; - } +.mdc-switch__native-control:disabled ~ .mdc-switch__background { - .mdc-switch__background { - cursor: initial; + &::before { + background-color: $mdc-switch-unchecked-track-color; + opacity: .12; - &::before { + @include mdc-theme-dark(".mdc-checkbox") { background-color: $mdc-switch-unchecked-track-color-dark; - - @include mdc-theme-dark(".mdc-checkbox") { - background-color: $mdc-switch-unchecked-track-color-dark; - } - + opacity: .1; } + } - .mdc-switch__knob { - background-color: $mdc-switch-unchecked-knob-color; - - @include mdc-theme-dark(".mdc-checkbox") { - background-color: $mdc-switch-unchecked-knob-color-dark; - } + .mdc-switch__knob { + background-color: $mdc-switch-disabled-knob-color; + @include mdc-theme-dark(".mdc-checkbox") { + background-color: $mdc-switch-disabled-knob-color-dark; } } - - .mdc-switch__native-control:focus ~ .mdc-switch__knob::before { - transform: scale(1); - transition: - mdc-checkbox-transition(transform, $mdc-switch-transition-curve), - mdc-checkbox-transition(background-color, $mdc-switch-transition-curve); - background-color: $mdc-switch-disabled-focus-ring-color; - opacity: .1; - } -} - -.mdc-switch-label { - margin-left: 10px; } - From de1ed27b4160aa62ba2e4083ace7c477ce6555e1 Mon Sep 17 00:00:00 2001 From: Alex Sheehan Date: Wed, 1 Feb 2017 12:35:11 -0500 Subject: [PATCH 4/6] feat(switch): npm publish config --- packages/mdc-snackbar/package.json | 5 +---- packages/mdc-switch/package.json | 5 ++++- 2 files changed, 5 insertions(+), 5 deletions(-) diff --git a/packages/mdc-snackbar/package.json b/packages/mdc-snackbar/package.json index 0bf85b0bfb3..24f7f8b38f2 100644 --- a/packages/mdc-snackbar/package.json +++ b/packages/mdc-snackbar/package.json @@ -15,8 +15,5 @@ "@material/rtl": "^0.1.1", "@material/theme": "^0.1.1", "@material/typography": "^0.1.1" - }, - "publishConfig": { - "access": "public" - } + } } diff --git a/packages/mdc-switch/package.json b/packages/mdc-switch/package.json index 3df0c7e3fad..514a7830739 100644 --- a/packages/mdc-switch/package.json +++ b/packages/mdc-switch/package.json @@ -11,5 +11,8 @@ "@material/animation": "^0.1.3", "@material/elevation": "^0.1.2", "@material/theme": "^0.1.1" - } + }, + "publishConfig": { + "access": "public" + } } From e8b78601a1a565f51c9d210a93a1f50381679ed0 Mon Sep 17 00:00:00 2001 From: Alex Sheehan Date: Wed, 1 Feb 2017 12:36:37 -0500 Subject: [PATCH 5/6] feat(switch): formatting package.json --- packages/mdc-switch/package.json | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/packages/mdc-switch/package.json b/packages/mdc-switch/package.json index 514a7830739..d2fd816b5b5 100644 --- a/packages/mdc-switch/package.json +++ b/packages/mdc-switch/package.json @@ -12,7 +12,7 @@ "@material/elevation": "^0.1.2", "@material/theme": "^0.1.1" }, - "publishConfig": { - "access": "public" - } + "publishConfig": { + "access": "public" + } } From 5c5c24820ac5154dfc29550da696d81a0bcaf9ee Mon Sep 17 00:00:00 2001 From: Alex Sheehan Date: Wed, 1 Feb 2017 13:01:32 -0500 Subject: [PATCH 6/6] feat(switch): fix nits --- packages/material-components-web/package.json | 2 +- packages/mdc-snackbar/package.json | 2 +- packages/mdc-switch/package.json | 2 +- 3 files changed, 3 insertions(+), 3 deletions(-) diff --git a/packages/material-components-web/package.json b/packages/material-components-web/package.json index 59c0aece5c0..aab70f1ffda 100644 --- a/packages/material-components-web/package.json +++ b/packages/material-components-web/package.json @@ -26,7 +26,7 @@ "@material/ripple": "^0.1.2", "@material/select": "^0.2.0", "@material/snackbar": "^0.1.2", - "@material/switch": "^0.3.0", + "@material/switch": "^0.1.0", "@material/textfield": "^0.2.0", "@material/theme": "^0.1.1", "@material/typography": "^0.1.1" diff --git a/packages/mdc-snackbar/package.json b/packages/mdc-snackbar/package.json index 24f7f8b38f2..4b0cffc8b69 100644 --- a/packages/mdc-snackbar/package.json +++ b/packages/mdc-snackbar/package.json @@ -15,5 +15,5 @@ "@material/rtl": "^0.1.1", "@material/theme": "^0.1.1", "@material/typography": "^0.1.1" - } + } } diff --git a/packages/mdc-switch/package.json b/packages/mdc-switch/package.json index d2fd816b5b5..74f9f388da1 100644 --- a/packages/mdc-switch/package.json +++ b/packages/mdc-switch/package.json @@ -1,7 +1,7 @@ { "name": "@material/switch", "description": "The Material Components for the web switch component", - "version": "0.3.0", + "version": "0.1.0", "license": "Apache-2.0", "repository": { "type": "git",