<title>snuggsi ツ - Autocomplete Dropdown List</title>

<meta charset=UTF-8>
<meta name=viewport content='width=device-width, initial-scale=1'>

<link rel=stylesheet href=http://www.devpunks.com/typography.css>

<script src=http://unpkg.com/snuggsi/examples/webcomponents-hi-ce.js></script>
<script nomodule src=http://unpkg.com/snuggsi/snuggsi.min.js></script>

<header-group>
  <h2 slot=header>Autocomplete Dropdown</h2>
</header-group>
<!-- import works inline body -->
<link rel=import href=/examples/header-group>


<p>
  This is a refactor of
  <a href='https://jsfiddle.net/nomzz/Kp3s7'>https://jsfiddle.net/nomzz/Kp3s7</a>
</p>

<h1>Autocomplete Countries</h1>

<auto-complete>
  <form action='#'>
    <label for='search'>Search</label>
    <input id='search' list='results' placeholder='Search'>

    <datalist id='results'></datalist>
  </form>

<script src='http://www.devpunks.com/examples/filter.es' defer> </script>
<script src='./autocomplete.es' defer></script>
</auto-complete>

<script src='../../vendor/browser-sync.es'></script>

<title>snuggsi ツ - Autocomplete Dropdown List</title>

<meta charset=UTF-8>
<meta name=viewport content='width=device-width, initial-scale=1'>

<link rel=stylesheet href=http://www.devpunks.com/typography.css>

<script src=http://unpkg.com/snuggsi/examples/webcomponents-hi-ce.js></script>
<script nomodule src=http://unpkg.com/snuggsi/snuggsi.min.js></script>

<header-group>
  <h2 slot=header>&lt:auto-complete&gt;</h2>
  <a  slot=subheader Title='See more componentexamples' href=/examples>See more component examples</a>
</header-group>
<!-- import works inline body -->
<link rel=import href=/examples/header-group>


<p>
  This is a refactor of
  <a href='https://jsfiddle.net/nomzz/Kp3s7'>https://jsfiddle.net/nomzz/Kp3s7</a>
</p>

<h1>Autocomplete Countries</h1>

<auto-complete>
  <form action='#'>
    <label for='search'>Search</label>
    <input id='search' list='results' placeholder='Search'>

    <datalist id='results'></datalist>
  </form>

<script src='http://www.devpunks.com/examples/filter.es' defer> </script>
<script src='./autocomplete.es' defer></script>
</auto-complete>

<script src='../../vendor/browser-sync.es'></script>

Add link to examples on auto-complete
Add link to examples on auto-complete
