<!– @license Copyright © 2016 The Polymer Project Authors. All rights reserved. This code may only be used under the BSD style license found at polymer.github.io/LICENSE.txt The complete set of authors may be found at polymer.github.io/AUTHORS.txt The complete set of contributors may be found at polymer.github.io/CONTRIBUTORS.txt Code distributed by Google as part of the polymer project is also subject to an additional IP rights grant found at polymer.github.io/PATENTS.txt –> <!– Copyright © 2015 The Polymer Project Authors. All rights reserved. This code may only be used under the BSD style license found at polymer.github.io/LICENSE The complete set of authors may be found at polymer.github.io/AUTHORS The complete set of contributors may be found at polymer.github.io/CONTRIBUTORS Code distributed by Google as part of the polymer project is also subject to an additional IP rights grant found at polymer.github.io/PATENTS –>

<link rel=“import” href=“../../polymer/polymer.html”> <link rel=“import” href=“../../paper-button/paper-button.html”> <link rel=“import” href=“../iron-a11y-announcer.html”>

<dom-module id=“x-announces”>

<template>
  <style>
    :host {
      display: block;
      position: relative;
      padding: 1em 0;
    }

    paper-button {
      background: #4285f4;
      color: #fff;
    }
  </style>

  <paper-button on-tap="_onTapAnnounce" raised>Announce</paper-button>
  <span id="content" aria-hidden="true">
    <content></content>
  </span>
</template>
<script>
  Polymer({
    is: 'x-announces',

    attached: function() {
      Polymer.IronA11yAnnouncer.requestAvailability();
    },

    _onTapAnnounce: function() {
      this.fire('iron-announce', {
        text: this.$.content.textContent.trim()
      }, {
        bubbles: true
      });
    }
  });
</script>

</dom-module>