feat: Convert packages to TypeScript

.eslintrc.yaml

@@ -15,6 +15,7 @@ rules:
   quotes: [error, single, {"avoidEscape": true}]
   no-var: error
   curly: error
+  eol-last: [error, "always"]
   no-floating-decimal: error
   no-unused-vars:
     - error

.gitignore

@@ -1,10 +1,25 @@
-node_modules
+# macOS filesystem
 .DS_Store
-/build
-/coverage
-packages/*/dist
-out
+
+# Editors and IDEs
+.idea/
+.vscode/
+
+# Generated files
 *.log
-.idea
 *.sw*
-.closure-tmp
+node_modules/
+
+# Build output
+/build/
+/coverage/
+packages/*/dist
+packages/**/*.js
+packages/**/*.d.ts
+packages/**/*.map
+
+# Material.io site generator test (`npm run test:site`)
+.site-generator-tmp/
+
+# Used by internal sync & rewrite scripts
+.rewrite-tmp/

.travis.yml

@@ -12,6 +12,7 @@ branches:
   # This prevents excessive resource usage and CI slowness.
   only:
     - master
+    - feat/typescript
 
 before_install:
   # Source the scripts to export their env vars. See https://superuser.com/a/176788/62792
@@ -40,25 +41,18 @@ matrix:
     env:
       - TEST_SUITE=build
     script:
-      - if has_testable_files; then npm run build; else log_untestable_files; fi
+      - if has_testable_files; then npm run dist; else log_untestable_files; fi
 
   - node_js: 8
     env:
       - TEST_SUITE=unit
     addons:
       sauce_connect: true
     script:
-      - if has_testable_files; then npm run test:unit && npm run posttest; else log_untestable_files; fi
+      - if has_testable_files; then npm run test:unit; else log_untestable_files; fi
     after_success:
       - codecov
 
-  - node_js: 8
-    env:
-      - TEST_SUITE=closure
-      - CLOSURE=1
-    script:
-      - if has_testable_files; then npm run test:closure; else log_untestable_files; fi
-
   - node_js: 8
     env:
       - TEST_SUITE=site-generator

CONTRIBUTING.md

@@ -99,9 +99,8 @@ npm run fix # Runs both of the above commands in parallel
 
 npm run test:watch # Runs karma on Chrome, re-running when source files change
 
-npm test # Lints all files, runs karma, runs closure tests, and then runs coverage enforcement checks.
+npm test # Lints all files, runs karma, runs typescript tests, and then runs coverage enforcement checks.
 npm run test:unit # Only runs the karma tests
-npm run test:closure # Runs closure build tests against all closurized files
 ```
 
 #### Running Tests across browsers

demos/theme/_theme-shared.scss

@@ -336,7 +336,7 @@ figure {
 }
 
 //
-// Icon Toggle demo
+// Icon Button demo
 //
 
 .mdc-icon-button {
@@ -345,12 +345,12 @@ figure {
   display: inline-flex;
 }
 
-.demo-icon-toggle-row {
+.demo-icon-button-row {
   display: flex;
   flex-wrap: wrap;
 }
 
-.demo-icon-toggle-tile {
+.demo-icon-button-tile {
   width: 200px;
   margin: 0 10px 10px 0;
   padding: 20px;

demos/theme/index.html

@@ -463,14 +463,14 @@ <h3 class="mdc-typography--headline5 demo-component-section__heading">
       </section>
 
       <section class="demo-component-section">
-        <i id="icon-toggle" class="demo-anchor-with-toolbar-offset"></i>
+        <i id="icon-button--toggle" class="demo-anchor-with-toolbar-offset"></i>
         <h3 class="mdc-typography--headline5 demo-component-section__heading">
-          Icon Toggle
-          <a href="#icon-toggle" class="demo-component-section__permalink" title="Permalink to the theme demo for the icon toggle component">#</a>
+          Icon Button
+          <a href="#icon-button--toggle" class="demo-component-section__permalink" title="Permalink to the theme demo for the icon button component">#</a>
         </h3>
 
-        <div class="demo-icon-toggle-row">
-          <div class="mdc-elevation--z2 demo-icon-toggle-tile">
+        <div class="demo-icon-button-row">
+          <div class="mdc-elevation--z2 demo-icon-button-tile">
             <h4 class="mdc-typography--subtitle1">Enabled</h4>
 
             <button class="mdc-icon-button"
@@ -480,7 +480,7 @@ <h4 class="mdc-typography--subtitle1">Enabled</h4>
               <i class="material-icons mdc-icon-button__icon">favorite_border</i></button>
           </div>
 
-          <div class="mdc-elevation--z2 demo-icon-toggle-tile">
+          <div class="mdc-elevation--z2 demo-icon-button-tile">
             <h4 class="mdc-typography--subtitle1">Disabled</h4>
 
             <button class="mdc-icon-button"
@@ -869,10 +869,6 @@ <h3 class="mdc-typography--headline5 demo-component-section__heading">
           mdc.ripple.MDCRipple.attachTo(iconButtonEl);
         });
 
-        /*
-         * Icon Toggle
-         */
-
         [].forEach.call(document.querySelectorAll('.mdc-icon-button[data-demo-toggle]'), function(iconButtonToggleEl) {
           mdc.iconButton.MDCIconButtonToggle.attachTo(iconButtonToggleEl);
         });