text: define(["../polymer/polymer-legacy.js", "../iron-a11y-announcer/iron-a11y-announcer.js", "../iron-validatable-behavior/iron-validatable-behavior.js", "../polymer/lib/legacy/polymer-fn.js", "../polymer/lib/legacy/polymer.dom.js", "../polymer/lib/utils/html-tag.js"], function (_polymerLegacy, _ironA11yAnnouncer, _ironValidatableBehavior, _polymerFn, _polymerDom, _htmlTag) {
    "use strict";
  
    function _templateObject_9d317360e53211e9a0cfefb808989d41() {
      var data = babelHelpers.taggedTemplateLiteral(["\n    <style>\n      :host {\n        display: inline-block;\n      }\n    </style>\n    <slot id=\"content\"></slot>\n"]);
  
      _templateObject_9d317360e53211e9a0cfefb808989d41 = function _templateObject_9d317360e53211e9a0cfefb808989d41() {
        return data;
      };
  
      return data;
    }
  
    /**
    `<iron-input>` is a wrapper to a native `<input>` element, that adds two-way
    binding and prevention of invalid input. To use it, you must distribute a native
    `<input>` yourself. You can continue to use the native `input` as you would
    normally:
    
        <iron-input>
          <input>
        </iron-input>
    
        <iron-input>
          <input type="email" disabled>
        </iron-input>
    
    ### Two-way binding
    
    By default you can only get notified of changes to a native `<input>`'s `value`
    due to user input:
    
        <input value="{{myValue::input}}">
    
    This means that if you imperatively set the value (i.e. `someNativeInput.value =
    'foo'`), no events will be fired and this change cannot be observed.
    
    `iron-input` adds the `bind-value` property that mirrors the native `input`'s
    '`value` property; this property can be used for two-way data binding.
    `bind-value` will notify if it is changed either by user input or by script.
    
        <iron-input bind-value="{{myValue}}">
          <input>
        </iron-input>
    
    Note: this means that if you want to imperatively set the native `input`'s, you
    _must_ set `bind-value` instead, so that the wrapper `iron-input` can be
    notified.
    
    ### Validation
    
    `iron-input` uses the native `input`'s validation. For simplicity, `iron-input`
    has a `validate()` method (which internally just checks the distributed
    `input`'s validity), which sets an `invalid` attribute that can also be used for
    styling.
    
    To validate automatically as you type, you can use the `auto-validate`
    attribute.
    
    `iron-input` also fires an `iron-input-validate` event after `validate()` is
    called. You can use it to implement a custom validator:
    
        var CatsOnlyValidator = {
          validate: function(ironInput) {
            var valid = !ironInput.bindValue || ironInput.bindValue === 'cat';
            ironInput.invalid = !valid;
            return valid;
          }
        }
        ironInput.addEventListener('iron-input-validate', function() {
          CatsOnly.validate(input2);
        });
    
    You can also use an element implementing an
    [`IronValidatorBehavior`](/element/PolymerElements/iron-validatable-behavior).
    This example can also be found in the demo for this element:
    
        <iron-input validator="cats-only">
          <input>
        </iron-input>
    
    ### Preventing invalid input
    
    It may be desirable to only allow users to enter certain characters. You can use
    the `allowed-pattern` attribute to accomplish this. This feature is separate
    from validation, and `allowed-pattern` does not affect how the input is
    validated.
    
        // Only allow typing digits, but a valid input has exactly 5 digits.
        <iron-input allowed-pattern="[0-9]">
          <input pattern="\d{5}">
        </iron-input>
    
    @demo demo/index.html
    */
    (0, _polymerFn.Polymer)({
      _template: (0, _htmlTag.html)(_templateObject_9d317360e53211e9a0cfefb808989d41()),
      is: 'iron-input',
      behaviors: [_ironValidatableBehavior.IronValidatableBehavior],
  
      /**
       * Fired whenever `validate()` is called.
       *
       * @event iron-input-validate
       */
      properties: {
        /**
         * Use this property instead of `value` for two-way data binding, or to
         * set a default value for the input. **Do not** use the distributed
         * input's `value` property to set a default value.
         */
        bindValue: {
          type: String,
          value: ''
        },
  
        /**
         * Computed property that echoes `bindValue` (mostly used for Polymer 1.0
         * backcompatibility, if you were one-way binding to the Polymer 1.0
         * `input is="iron-input"` value attribute).
         */
        value: {
          type: String,
          computed: '_computeValue(bindValue)'
        },
  
        /**
         * Regex-like list of characters allowed as input; all characters not in the
         * list will be rejected. The recommended format should be a list of allowed
         * characters, for example, `[a-zA-Z0-9.+-!;:]`.
         *
         * This pattern represents the allowed characters for the field; as the user
         * inputs text, each individual character will be checked against the
         * pattern (rather than checking the entire value as a whole). If a
         * character is not a match, it will be rejected.
         *
         * Pasted input will have each character checked individually; if any
         * character doesn't match `allowedPattern`, the entire pasted string will
         * be rejected.
         *
         * Note: if you were using `iron-input` in 1.0, you were also required to
         * set `prevent-invalid-input`. This is no longer needed as of Polymer 2.0,
         * and will be set automatically for you if an `allowedPattern` is provided.
         *
         */
        allowedPattern: {
          type: String
        },
  
        /**
         * Set to true to auto-validate the input value as you type.
         */
        autoValidate: {
          type: Boolean,
          value: false
        },
  
        /**
         * The native input element.
         */
        _inputElement: Object
      },
      observers: ['_bindValueChanged(bindValue, _inputElement)'],
      listeners: {
        'input': '_onInput',
        'keypress': '_onKeypress'
      },
      created: function created() {
        _ironA11yAnnouncer.IronA11yAnnouncer.requestAvailability();
  
        this._previousValidInput = '';
        this._patternAlreadyChecked = false;
      },
      attached: function attached() {
        // If the input is added at a later time, update the internal reference.
        this._observer = (0, _polymerDom.dom)(this).observeNodes(function (info) {
          this._initSlottedInput();
        }.bind(this));
      },
      detached: function detached() {
        if (this._observer) {
          (0, _polymerDom.dom)(this).unobserveNodes(this._observer);
          this._observer = null;
        }
      },
  
      /**
       * Returns the distributed input element.
       */
      get inputElement() {
        return this._inputElement;
      },
  
      _initSlottedInput: function _initSlottedInput() {
        this._inputElement = this.getEffectiveChildren()[0];
  
        if (this.inputElement && this.inputElement.value) {
          this.bindValue = this.inputElement.value;
        }
  
        this.fire('iron-input-ready');
      },
  
      get _patternRegExp() {
        var pattern;
  
        if (this.allowedPattern) {
          pattern = new RegExp(this.allowedPattern);
        } else {
          switch (this.inputElement.type) {
            case 'number':
              pattern = /[0-9.,e-]/;
              break;
          }
        }
  
        return pattern;
      },
  
      /**
       * @suppress {checkTypes}
       */
      _bindValueChanged: function _bindValueChanged(bindValue, inputElement) {
        // The observer could have run before attached() when we have actually
        // initialized this property.
        if (!inputElement) {
          return;
        }
  
        if (bindValue === undefined) {
          inputElement.value = null;
        } else if (bindValue !== inputElement.value) {
          this.inputElement.value = bindValue;
        }
  
        if (this.autoValidate) {
          this.validate();
        } // manually notify because we don't want to notify until after setting value
  
  
        this.fire('bind-value-changed', {
          value: bindValue
        });
      },
      _onInput: function _onInput() {
        // Need to validate each of the characters pasted if they haven't
        // been validated inside `_onKeypress` already.
        if (this.allowedPattern && !this._patternAlreadyChecked) {
          var valid = this._checkPatternValidity();
  
          if (!valid) {
            this._announceInvalidCharacter('Invalid string of characters not entered.');
  
            this.inputElement.value = this._previousValidInput;
          }
        }
  
        this.bindValue = this._previousValidInput = this.inputElement.value;
        this._patternAlreadyChecked = false;
      },
      _isPrintable: function _isPrintable(event) {
        // What a control/printable character is varies wildly based on the browser.
        // - most control characters (arrows, backspace) do not send a `keypress`
        // event
        //   in Chrome, but the *do* on Firefox
        // - in Firefox, when they do send a `keypress` event, control chars have
        //   a charCode = 0, keyCode = xx (for ex. 40 for down arrow)
        // - printable characters always send a keypress event.
        // - in Firefox, printable chars always have a keyCode = 0. In Chrome, the
        // keyCode
        //   always matches the charCode.
        // None of this makes any sense.
        // For these keys, ASCII code == browser keycode.
        var anyNonPrintable = event.keyCode == 8 || // backspace
        event.keyCode == 9 || // tab
        event.keyCode == 13 || // enter
        event.keyCode == 27; // escape
        // For these keys, make sure it's a browser keycode and not an ASCII code.
  
        var mozNonPrintable = event.keyCode == 19 || // pause
        event.keyCode == 20 || // caps lock
        event.keyCode == 45 || // insert
        event.keyCode == 46 || // delete
        event.keyCode == 144 || // num lock
        event.keyCode == 145 || // scroll lock
        event.keyCode > 32 && event.keyCode < 41 || // page up/down, end, home, arrows
        event.keyCode > 111 && event.keyCode < 124; // fn keys
  
        return !anyNonPrintable && !(event.charCode == 0 && mozNonPrintable);
      },
      _onKeypress: function _onKeypress(event) {
        if (!this.allowedPattern && this.inputElement.type !== 'number') {
          return;
        }
  
        var regexp = this._patternRegExp;
  
        if (!regexp) {
          return;
        } // Handle special keys and backspace
  
  
        if (event.metaKey || event.ctrlKey || event.altKey) {
          return;
        } // Check the pattern either here or in `_onInput`, but not in both.
  
  
        this._patternAlreadyChecked = true;
        var thisChar = String.fromCharCode(event.charCode);
  
        if (this._isPrintable(event) && !regexp.test(thisChar)) {
          event.preventDefault();
  
          this._announceInvalidCharacter('Invalid character ' + thisChar + ' not entered.');
        }
      },
      _checkPatternValidity: function _checkPatternValidity() {
        var regexp = this._patternRegExp;
  
        if (!regexp) {
          return true;
        }
  
        for (var i = 0; i < this.inputElement.value.length; i++) {
          if (!regexp.test(this.inputElement.value[i])) {
            return false;
          }
        }
  
        return true;
      },
  
      /**
       * Returns true if `value` is valid. The validator provided in `validator`
       * will be used first, then any constraints.
       * @return {boolean} True if the value is valid.
       */
      validate: function validate() {
        if (!this.inputElement) {
          this.invalid = false;
          return true;
        } // Use the nested input's native validity.
  
  
        var valid = this.inputElement.checkValidity(); // Only do extra checking if the browser thought this was valid.
  
        if (valid) {
          // Empty, required input is invalid
          if (this.required && this.bindValue === '') {
            valid = false;
          } else if (this.hasValidator()) {
            valid = _ironValidatableBehavior.IronValidatableBehavior.validate.call(this, this.bindValue);
          }
        }
  
        this.invalid = !valid;
        this.fire('iron-input-validate');
        return valid;
      },
      _announceInvalidCharacter: function _announceInvalidCharacter(message) {
        this.fire('iron-announce', {
          text: message
        });
      },
      _computeValue: function _computeValue(bindValue) {
        return bindValue;
      }
    });
  });