#!mojo mojo:sky_viewer
<!--
// Copyright 2015 The Chromium Authors. All rights reserved.
// Use of this source code is governed by a BSD-style license that can be
// found in the LICENSE file.
-->
<sky>
<import src="/sky/framework/sky-element/sky-element.sky" as="SkyElement" />
<import src="/sky/framework/sky-scrollable.sky" />
<import src="data/cities.sky" as="cities" />

<sky-element name="example-scrollable">
<template>
  <style>
  sky-scrollable {
    margin: 20px;
    height: 400px;
    border: 2px solid blue;
  }
  b {
    display: inline;
    font-weight: bold;
  }
  </style>
  <sky-scrollable>
    <template repeat="{{ cities }}">
      <template>
        <div>{{ name }}</div>
      </template>
    </template>
  </sky-scrollable>
</template>
<script>
module.exports = class extends SkyElement {
  created() {
    this.cities = cities.slice(0, 300);
  }
}.register();
</script>
</sky-element>

<example-scrollable />
</sky>