feat(progress-indicator): Add common progress indicator interface

packages/mdc-linear-progress/component.ts

@@ -22,10 +22,12 @@
  */
 
 import {MDCComponent} from '@material/base/component';
+import {MDCProgressIndicator} from '@material/progress-indicator/component';
 import {MDCLinearProgressAdapter} from './adapter';
 import {MDCLinearProgressFoundation} from './foundation';
 
-export class MDCLinearProgress extends MDCComponent<MDCLinearProgressFoundation> {
+export class MDCLinearProgress extends
+    MDCComponent<MDCLinearProgressFoundation> implements MDCProgressIndicator {
   static attachTo(root: Element) {
     return new MDCLinearProgress(root);
   }

packages/mdc-linear-progress/foundation.ts

@@ -23,10 +23,13 @@
 
 import {getCorrectPropertyName} from '@material/animation/util';
 import {MDCFoundation} from '@material/base/foundation';
+import {MDCProgressIndicatorFoundation} from '@material/progress-indicator/foundation';
 import {MDCLinearProgressAdapter} from './adapter';
 import {cssClasses, strings} from './constants';
 
-export class MDCLinearProgressFoundation extends MDCFoundation<MDCLinearProgressAdapter> {
+export class MDCLinearProgressFoundation extends
+    MDCFoundation<MDCLinearProgressAdapter> implements
+        MDCProgressIndicatorFoundation {
   static get cssClasses() {
     return cssClasses;
   }

packages/mdc-linear-progress/package.json

@@ -21,6 +21,7 @@
     "@material/animation": "^4.0.0",
     "@material/base": "^4.0.0",
     "@material/feature-targeting": "^4.0.0",
+    "@material/progress-indicator": "^4.0.0",
     "@material/theme": "^4.0.0",
     "tslib": "^1.9.3"
   },

packages/mdc-progress-indicator/README.md

@@ -0,0 +1,42 @@
+<!--docs:
+title: "Progress Indicator"
+layout: detail
+section: components
+excerpt: "Material Design-styled progress indicators."
+iconId: progress_linear
+path: /catalog/progress-indicator/
+-->
+
+# Progress Indicators
+The MDC Progress Indicator component exposes common foundation and component interfaces for a progress indicator. Components that implement these interfaces include [linear progress](https://github.com/material-components/material-components-web/tree/master/packages/mdc-linear-progress) and circular progress (WIP).
+[Material Design progress & activity requirements](https://material.io/go/design-progress-indicators).
+
+## Installation
+
+```
+npm install @material/progress-indicator
+```
+
+## Basic Usage
+
+### MDCProgressIndicatorFoundation API
+
+MDC Progress Indicator Foundation exposes the following methods:
+
+| Method Signature | Description |
+| --- | --- |
+| `setDeterminate(value: boolean) => void` | Toggles the component between the determinate and indeterminate state. |
+| `setProgress(value: number) => void` | Sets the progress to this value. Value should be between [0, 1]. |
+| `open() => void` | Puts the component in the open state. |
+| `close() => void` | Puts the component in the closed state. |
+
+### MDCProgressIndicator Component API
+
+MDC Progress Indicator exposes the following API:
+
+| Method Signature | Description |
+| --- | --- |
+| `determinate: boolean` | Whether the indicator is in the determinate or indeterminate state. |
+| `progress: number` | The current progress. Value should be between [0, 1]. |
+| `open() => void` | Puts the component in the open state. |
+| `close() => void` | Puts the component in the closed state. |

packages/mdc-progress-indicator/component.ts

@@ -0,0 +1,29 @@
+/**
+ * @license
+ * Copyright 2020 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.
+ */
+
+export interface MDCProgressIndicator {
+  determinate: boolean;
+  progress: number;
+  open(): void;
+  close(): void;
+}

packages/mdc-progress-indicator/foundation.ts

@@ -0,0 +1,29 @@
+/**
+ * @license
+ * Copyright 2020 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.
+ */
+
+export interface MDCProgressIndicatorFoundation {
+  setDeterminate(isDeterminate: boolean): void;
+  setProgress(value: number): void;
+  open(): void;
+  close(): void;
+}

packages/mdc-progress-indicator/index.ts

@@ -0,0 +1,25 @@
+/**
+ * @license
+ * Copyright 2020 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.
+ */
+
+export * from './component';
+export * from './foundation';

packages/mdc-progress-indicator/package.json

@@ -0,0 +1,21 @@
+{
+  "name": "@material/progress-indicator",
+  "description": "The Material Components for the web interface for Progress Indicators",
+  "version": "4.0.0",
+  "license": "MIT",
+  "main": "dist/mdc.progressIndicator.js",
+  "module": "index.js",
+  "sideEffects": false,
+  "types": "dist/mdc.progressIndicator.d.ts",
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/material-components/material-components-web.git",
+    "directory": "packages/mdc-progress-indicator"
+  },
+  "dependencies": {
+    "tslib": "^1.9.3"
+  },
+  "publishConfig": {
+    "access": "public"
+  }
+}

scripts/check-pkg-for-release.js

@@ -73,15 +73,22 @@ const CSS_WHITELIST = [
   'density',
   'dom',
   'feature-targeting',
+  'progress-indicator',
   'rtl',
   'shape',
   'touch-target',
 ];
 
+const JS_WHITELIST = [
+  'animation',
+  'progress-indicator',
+];
+
 const NOT_AUTOINIT = [
   'auto-init',
   'base',
   'dom',
+  'progress-indicator',
   'tab', // Only makes sense in context of tab-bar
   'tab-indicator', // Only makes sense in context of tab-bar
   'tab-scroller', // Only makes sense in context of tab-bar
@@ -126,14 +133,17 @@ function checkDependencyAddedInWebpackConfig() {
 }
 
 function checkJSDependencyAddedInWebpackConfig() {
-  const jsconfig = WEBPACK_CONFIG.find((value) => {
-    return value.name === 'main-js-a-la-carte';
-  });
-  const nameCamel = camelCase(CLI_PACKAGE_JSON.name.replace('@material/', ''));
-  assert.notEqual(typeof jsconfig.entry[nameCamel], 'undefined',
-    'FAILURE: Component ' + CLI_PACKAGE_JSON.name + ' javascript dependency is not added to webpack ' +
-    'configuration. Please add ' + nameCamel + ' to ' + WEBPACK_CONFIG_RELATIVE_PATH + '\'s js-components ' +
-    'entry before commit.');
+  const name = getPkgName();
+  if (JS_WHITELIST.indexOf(name) === -1) {
+    const jsconfig = WEBPACK_CONFIG.find((value) => {
+      return value.name === 'main-js-a-la-carte';
+    });
+    const nameCamel = camelCase(CLI_PACKAGE_JSON.name.replace('@material/', ''));
+    assert.notEqual(typeof jsconfig.entry[nameCamel], 'undefined',
+      'FAILURE: Component ' + CLI_PACKAGE_JSON.name + ' javascript dependency is not added to webpack ' +
+      'configuration. Please add ' + nameCamel + ' to ' + WEBPACK_CONFIG_RELATIVE_PATH + '\'s js-components ' +
+      'entry before commit.');
+  }
 }
 
 function checkCSSDependencyAddedInWebpackConfig() {
@@ -162,10 +172,13 @@ function checkDependencyAddedInMDCPackage() {
 }
 
 function checkPkgDependencyAddedInMDCPackage() {
-  assert.notEqual(typeof MASTER_PACKAGE_JSON.dependencies[CLI_PACKAGE_JSON.name], 'undefined',
-    'FAILURE: Component ' + CLI_PACKAGE_JSON.name + ' is not a dependency for MDC Web. ' +
-    'Please add ' + CLI_PACKAGE_JSON.name +' to ' + MASTER_PACKAGE_JSON_RELATIVE_PATH +
-    '\' dependencies before commit.');
+  const name = getPkgName();
+  if (!CSS_WHITELIST.filter((x) => JS_WHITELIST.includes(x)).includes(name)) {
+    assert.notEqual(typeof MASTER_PACKAGE_JSON.dependencies[CLI_PACKAGE_JSON.name], 'undefined',
+      'FAILURE: Component ' + CLI_PACKAGE_JSON.name + ' is not a dependency for MDC Web. ' +
+      'Please add ' + CLI_PACKAGE_JSON.name +' to ' + MASTER_PACKAGE_JSON_RELATIVE_PATH +
+      '\' dependencies before commit.');
+  }
 }
 
 function checkCSSDependencyAddedInMDCPackage() {
@@ -185,10 +198,9 @@ function checkCSSDependencyAddedInMDCPackage() {
 }
 
 function checkJSDependencyAddedInMDCPackage() {
-  const NOT_IMPORTED = ['animation'];
   const name = getPkgName();
   if (typeof (CLI_PACKAGE_JSON.main) !== 'undefined' &&
-      NOT_IMPORTED.indexOf(name) === -1) {
+      JS_WHITELIST.indexOf(name) === -1) {
     const nameCamel = camelCase(CLI_PACKAGE_JSON.name.replace('@material/', ''));
     const src = fs.readFileSync(path.join(process.env.PWD, MASTER_TS_RELATIVE_PATH), 'utf8');
     const ast = recast.parse(src, {