<link rel="import" href="../../../../bower_components/polymer/polymer.html">
<link rel="import" href="../../../../bower_components/paper-input/paper-input.html">
<link rel="import" href="../../../../bower_components/paper-input/paper-input-decorator.html">
<link rel="import" href="../../../../bower_components/core-input/core-input.html">

<polymer-element name="loot-validated-input" attributes="error type required maxlength minlength pattern max min step value disabled">
    <template>
        <paper-input-decorator error="{{error}}" isInvalid="{{!$.input.validity.valid}}" disabled?="{{disabled != undefined}}">
            <input id="input" is="core-input" type="{{type}}" class="{{class}}" required?="{{required != undefined}}" maxlength?="{{maxlength}}" minlength?="{{minlength}}" pattern?="{{pattern}}" max?="{{max}}" min?="{{min}}" step?="{{step}}" value="{{value}}" readonly?="{{disabled != undefined}}">
        </paper-input-decorator>
    </template>
    <script>
    Polymer({
        type: 'text',

        checkValidity: function() {
            return this.shadowRoot.getElementById('input').checkValidity();
        }
    });
    </script>
</polymer-element>
