JSFiddle - React, Tailwind, and code Playground

HTML

<script>Polymer = {dom: 'shadow', lazyRegister: 'true', useNativeCSSProperties: false};</script>
<base href="https://polygit.org/*+:master/components/">
<link rel="import" href="polymer/polymer.html">
<link rel="import" href="paper-input/paper-input-container.html">
<link rel="import" href="iron-input/iron-input.html">
<dom-module is='x-foo'>
    <template>
    <style is="custom-style">
      paper-input-container {
        --paper-input-container-label: {
          color: inherit;
        };
      }
    </style>
    <div>Body is black, not grey.</div>
    {{bindValue}}
    <paper-input-container>
      <label id="prompt">Label</label>
      <input is="iron-input" on-keydown="limit(e)" value="{{bindValue}}">
    </paper-input-container>
    </template>
</dom-module>

JavaScript

Polymer({
  is: 'x-foo',
  properties: {
  	bindValue: {
    type: String,
    value: 'Praveeeeeeen'
    }
  },
  ready: function() {
  	this.bindValue = 'Praveen';
  },
  limit:function(e){
  	console.log(e.detail)
  }
});