<commit_before><!--
A text area that makes itself big enough to show its content.

This works by copying the text to an invisible element which will automatically
grow in size; the expanding copy will expand the container, which in turn
stretch the text area.

@element basic-autosize-textarea
@demo http://basic-web-components.github.io/basic-web-components/src/basic-autosize-textarea/?dom=shadow
-->

<link rel="import" href="../../bower_components/polymer/polymer.html">
<link rel="import" href="../basic-shared/basic-shared.html">

<dom-module id="basic-autosize-textarea">

  <style>
  :host {
    display: block;
  }

  #autoSizeContainer {
    position: relative;
  }

  /*
   * Ensure both the text area and copy end up with the element's own font
   * metrics, so that text will lay out the same in both of them.
   */
  #textBox,
  #copyContainer {
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    font-family: inherit;
    font-size: inherit;
    font-style: inherit;
    font-weight: inherit;
    line-height: inherit;
    margin: 0;
  }

  #textBox {
    height: 100%;
    overflow: hidden;
    position: absolute;
    resize: none;
    top: 0;
    width: 100%;
  }

  #copyContainer {
    visibility: hidden;
    white-space: pre-wrap; /* So lines wrap */
    word-wrap: break-word; /* So we break at word boundaries when possible */
  }

  #contentContainer {
    display: none;
  }
  </style>

  <!--
  The invisible copyContainer contains an extraSpace element that ensures that,
  even if the last line of the textarea is blank, there will be something in the
  line that forces the text copy to grow by a line. This extra space is a thin
  space, to reduce the amount by which the text copy will prematurely grow.

  The copyContainer also contains an extraLine element exists to deal with the
  fact that, if the user presses the Enter key down, the textarea's content will
  move before the complete text is available. See notes at _keypress.

  Lastly, we put the HTML content element into a separate container so we can
  hide it. We need to have a content element somewhere in the template to
  convince Polymer that we care about the content in the Shady DOM case --<commit_msg>Try allowing use of a Polymer 1.0 CSS mixin.<commit_after><!--
A text area that makes itself big enough to show its content.

This works by copying the text to an invisible element which will automatically
grow in size; the expanding copy will expand the container, which in turn
stretch the text area.

@element basic-autosize-textarea
@demo http://basic-web-components.github.io/basic-web-components/src/basic-autosize-textarea/?dom=shadow
-->

<link rel="import" href="../../bower_components/polymer/polymer.html">
<link rel="import" href="../basic-shared/basic-shared.html">

<dom-module id="basic-autosize-textarea">

  <style>
  :host {
    display: block;
  }

  #autoSizeContainer {
    position: relative;
  }

  /*
   * Ensure both the text area and copy end up with the element's own font
   * metrics, so that text will lay out the same in both of them.
   */
  #textBox,
  #copyContainer {
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    font-family: inherit;
    font-size: inherit;
    font-style: inherit;
    font-weight: inherit;
    line-height: inherit;
    margin: 0;
  }

  #textBox {
    height: 100%;
    overflow: hidden;
    position: absolute;
    resize: none;
    top: 0;
    width: 100%;
    @apply(--basic-autosize-textarea);
  }

  #copyContainer {
    visibility: hidden;
    white-space: pre-wrap; /* So lines wrap */
    word-wrap: break-word; /* So we break at word boundaries when possible */
  }

  #contentContainer {
    display: none;
  }
  </style>

  <!--
  The invisible copyContainer contains an extraSpace element that ensures that,
  even if the last line of the textarea is blank, there will be something in the
  line that forces the text copy to grow by a line. This extra space is a thin
  space, to reduce the amount by which the text copy will prematurely grow.

  The copyContainer also contains an extraLine element exists to deal with the
  fact that, if the user presses the Enter key down, the textarea's content will
  move before the complete text is available. See notes at _keypress.

  Lastly, we put the HTML content element into a separate container so we can
  hide it. We need to have a content element somewhere in the template to
  convince Polymer that we care about the content in the Shady DOM case --
{'fraction_non_alphanumeric': 0.08736141906873614, 'fraction_numerical': 0.003991130820399113, 'mean_word_length': 3.2001862197392925, 'pattern_counts': {'":': 0, '<': 17, '<?xml version=': 0, '>': 15, 'https://': 0, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '3629417', 'n_tokens_mistral': 1335, 'n_tokens_neox': 1273, 'n_words': 561}