mwc-select

CHANGELOG.md

@@ -9,6 +9,20 @@ and this project adheres to [Semantic Versioning](http://semver.org/).
 ### Added
 
 - End-alignment to `mwc-textfield` and `mwc-textarea`
+- Implemented:
+  - `mwc-select`
+  - `mwc-menu`
+  - `mwc-menu-surface`
+  - `mwc-list`
+  - `mwc-list-item`
+- Base / utils.ts
+  - `isNodeElement` - performant node -> element checking
+  - `deepActiveElementPath` - finds the deepest `activeElement` node
+  - `doesElementContainFocus` - determines is ancestor of `activeElement`
+- `mwc-radio.global` - groups radios across document rather than shadow root
+- Style underline of filled textfield
+  - `--mdc-text-field-idle-line-color`
+  - `--mdc-text-field-hover-line-color`
 
 ### Fixed
 

demos/demo-component.css

@@ -39,7 +39,7 @@ header > a {
   align-items: center;
 }
 
-mwc-icon {
+header mwc-icon {
   margin: 0 16px;
 }
 

demos/index.js

@@ -103,14 +103,14 @@ class DemoView extends LitElement {
             <span class="demo-catalog-list-icon mdc-list-item__graphic"><img src="https://material-components-web.appspot.com/images/ic_component_24px.svg"></span>
             <span class="mdc-list-item__text">
               Drawer
-              <span class="mdc-list-item__secondary-text">Multi-selection controls</span>
+              <span class="mdc-list-item__secondary-text">Navigation to provide access to destinations.</span>
             </span>
           </a>
           <a role="listitem" class="mdc-list-item" href="dialog.html">
             <span class="demo-catalog-list-icon mdc-list-item__graphic"><img src="https://material-components-web.appspot.com/images/ic_dialog_24px.svg"></span>
             <span class="mdc-list-item__text">
               Dialog
-              <span class="mdc-list-item__secondary-text">Multi-selection controls</span>
+              <span class="mdc-list-item__secondary-text">Popup that gains user attention.</span>
             </span>
           </a>
           <a role="listitem" class="mdc-list-item" href="formfield.html">
@@ -148,6 +148,20 @@ class DemoView extends LitElement {
               <span class="mdc-list-item__secondary-text">Fills from 0% to 100%, represented by bars</span>
             </span>
           </a>
+          <a role="listitem" class="mdc-list-item" href="list.html">
+            <span class="demo-catalog-list-icon mdc-list-item__graphic"><img src="https://material.io/develop/images/component_icons/list.svg"></span>
+            <span class="mdc-list-item__text">
+              List
+              <span class="mdc-list-item__secondary-text">Lists are continuous, vertical indexes of text or images.</span>
+            </span>
+          </a>
+          <a role="listitem" class="mdc-list-item" href="menu.html">
+            <span class="demo-catalog-list-icon mdc-list-item__graphic"><img src="https://material.io/develop/images/component_icons/menu.svg"></span>
+            <span class="mdc-list-item__text">
+              Menu
+              <span class="mdc-list-item__secondary-text">Displays a list of choices on a temporary surface.</span>
+            </span>
+          </a>
           <a role="listitem" class="mdc-list-item" href="radio.html">
             <span class="demo-catalog-list-icon mdc-list-item__graphic"><img src="https://material-components-web.appspot.com/images/ic_radio_button_24px.svg"></span>
             <span class="mdc-list-item__text">
@@ -162,6 +176,13 @@ class DemoView extends LitElement {
               <span class="mdc-list-item__secondary-text">Touch ripple</span>
             </span>
           </a>
+          <a role="listitem" class="mdc-list-item" href="select.html">
+            <span class="demo-catalog-list-icon mdc-list-item__graphic"><img src="https://material.io/develop/images/component_icons/menu.svg"></span>
+            <span class="mdc-list-item__text">
+              Select
+              <span class="mdc-list-item__secondary-text">Single option dropdown select menus</span>
+            </span>
+          </a>
           <a role="listitem" class="mdc-list-item" href="slider.html">
             <span class="demo-catalog-list-icon mdc-list-item__graphic"><img src="https://material-components-web.appspot.com/images/slider.svg"></span>
             <span class="mdc-list-item__text">
@@ -194,14 +215,14 @@ class DemoView extends LitElement {
             <span class="demo-catalog-list-icon mdc-list-item__graphic"><img src="https://material-components-web.appspot.com/images/ic_text_field_24px.svg"></span>
             <span class="mdc-list-item__text">
               Text field
-              <span class="mdc-list-item__secondary-text">Single and multiline text fields</span>
+              <span class="mdc-list-item__secondary-text">Single line text fields</span>
             </span>
           </a>
           <a role="listitem" class="mdc-list-item" href="textarea.html">
             <span class="demo-catalog-list-icon mdc-list-item__graphic"><img src="https://material-components-web.appspot.com/images/ic_text_field_24px.svg"></span>
             <span class="mdc-list-item__text">
               Text area
-              <span class="mdc-list-item__secondary-text">Single and multiline text areas</span>
+              <span class="mdc-list-item__secondary-text">Multiline text areas</span>
             </span>
           </a>
           <a role="listitem" class="mdc-list-item" href="top-app-bar.html">
@@ -224,4 +245,4 @@ class DemoView extends LitElement {
   }
 }
 
-customElements.define('demo-view', DemoView);
+customElements.define('demo-view', DemoView);