water

Author: abhiomkar

.github/workflows/lint.yml

@@ -0,0 +1,25 @@
+name: MDC Lint
+
+on:
+  push:
+    branches:
+      - master
+      - develop
+      - feature/**
+    paths:
+      - '**.js'
+      - '**.ts'
+      - '**.css'
+      - '**.scss'
+      - '**.html'
+
+jobs:
+  build:
+    runs-on: ubuntu-latest
+    steps:
+      - uses: actions/checkout@v1
+      - uses: actions/setup-node@v1
+        with:
+          node-version: 10
+      - run: npm i
+      - run: npm run lint

.travis.yml

@@ -32,12 +32,6 @@ after_script:
 matrix:
   include:
 
-  - node_js: 10
-    env:
-      - TEST_SUITE=lint
-    script:
-      - if has_testable_files; then npm run lint && npm run test:feature-targeting; else log_untestable_files; fi
-
   - node_js: 10
     env:
       - TEST_SUITE=build

packages/mdc-ripple/README.md

@@ -67,9 +67,7 @@ In order to fully style the ripple effect for different states (hover/focus/pres
   @include mdc-ripple-surface;
   @include mdc-ripple-radius-bounded;
   @include mdc-states-base-color(black);
-  @include mdc-states-hover-opacity(.1);
-  @include mdc-states-focus-opacity(.3);
-  @include mdc-states-press-opacity(.4);
+  @include mdc-states-opacities((hover: .1, focus: .3, press: .4));
 }
 ```
 
@@ -109,12 +107,12 @@ These mixins can also be used to emit activated or selected styles, by applying
 Mixin | Description
 --- | ---
 `mdc-states-base-color($color)` | Mandatory. Sets up base state styles using the provided color
-`mdc-states-hover-opacity($opacity)` | Mandatory. Adds styles for hover state using the provided opacity
-`mdc-states-focus-opacity($opacity, $has-nested-focusable-element)` | Mandatory. Adds styles for focus state using the provided opacity
-`mdc-states-press-opacity($opacity)` | Mandatory. Adds styles for press state using the provided opacity
+`mdc-states-opacities($opacity-map, $has-nested-focusable-element)` | Sets the opacity of the ripple in any of the `hover`, `focus`, or `press` states. The `opacity-map` can specify one or more of these states as keys. States not specified in the map resort to default opacity values.
 
 > _NOTE_: `$has-nested-focusable-element` defaults to `false` but should be set to `true` if the component contains a focusable element (e.g. an input) inside the root element.
 
+> _DEPRECATED_: The individual mixins `mdc-states-hover-opacity($opacity)`, `mdc-states-focus-opacity($opacity, $has-nested-focusable-element)`, and `mdc-states-press-opacity($opacity)` are deprecated in favor of the unified `mdc-states-opacities($opacity-map, $has-nested-focusable-element)` mixin above.
+
 #### Sass Functions
 
 Function | Description

packages/mdc-ripple/_mixins.scss

@@ -210,6 +210,26 @@
   }
 }
 
+///
+/// Customizes ripple opacities in `hover`, `focus`, or `press` states
+/// @param {map} $opacity-map - map specifying custom opacity of zero or more states
+/// @param {bool} $has-nested-focusable-element - whether the component contains a focusable element in the root
+///
+@mixin mdc-states-opacities($opacity-map: (), $has-nested-focusable-element: false, $query: mdc-feature-all()) {
+  // Ensure sufficient specificity to override base state opacities
+  @if map-has-key($opacity-map, hover) {
+    @include mdc-states-hover-opacity(map-get($opacity-map, hover), $query: $query);
+  }
+
+  @if map-has-key($opacity-map, focus) {
+    @include mdc-states-focus-opacity(map-get($opacity-map, focus), $has-nested-focusable-element, $query: $query);
+  }
+
+  @if map-has-key($opacity-map, press) {
+    @include mdc-states-press-opacity(map-get($opacity-map, press), $query: $query);
+  }
+}
+
 @mixin mdc-states-hover-opacity(
   $opacity, $query: mdc-feature-all(), $ripple-target: "&") {
   $feat-color: mdc-feature-create-target($query, color);

packages/mdc-switch/_mixins.scss

@@ -252,17 +252,7 @@
 @mixin mdc-switch-ripple-states-opacity($opacity-map: (), $query: mdc-feature-all()) {
   // Ensure sufficient specificity to override base state opacities
   &.mdc-switch .mdc-switch__thumb-underlay {
-    @if map-has-key($opacity-map, "hover") {
-      @include mdc-states-hover-opacity(map-get($opacity-map, "hover"), $query);
-    }
-
-    @if map-has-key($opacity-map, "focus") {
-      @include mdc-states-focus-opacity(map-get($opacity-map, "focus"), $query);
-    }
-
-    @if map-has-key($opacity-map, "press") {
-      @include mdc-states-press-opacity(map-get($opacity-map, "press"), $query);
-    }
+    @include mdc-states-opacities($opacity-map, $query: $query);
   }
 }
 

scripts/travis-env-vars.sh

@@ -81,11 +81,6 @@ if [[ "$TEST_SUITE" == 'unit' ]]; then
   check_for_testable_files '^karma\.conf\.js$' '^packages/.+\.(js|ts)$' '^test/unit/.+\.(js|ts)$'
 fi
 
-if [[ "$TEST_SUITE" == 'lint' ]]; then
-  # Only run linter if JS/Sass files changed
-  check_for_testable_files '\.(js|ts|css|scss)$'
-fi
-
 if [[ "$TEST_SUITE" == 'build' ]]; then
   # Only run build if package JS/Sass files changed
   check_for_testable_files '^packages/.+\.(js|ts|css|scss)$'