summaryrefslogtreecommitdiff
path: root/chromium/chrome/browser/resources/settings/controls/settings_textarea.js
blob: a66898fccb3d74cbf8a87db406d1465f5eec0eec (plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
// Copyright 2018 The Chromium Authors. All rights reserved.
// Use of this source code is governed by a BSD-style license that can be
// found in the LICENSE file.

/**
 * @fileoverview 'settings-textarea' is a component similar to native textarea,
 * and inherits styling from cr-input.
 */
Polymer({
  is: 'settings-textarea',

  properties: {
    /**
     * Whether the text area should automatically get focus when the page
     * loads.
     */
    autofocus: {
      type: Boolean,
      value: false,
      reflectToAttribute: true,
    },

    /**
     * Whether the text area is disabled. When disabled, the text area loses
     * focus and is not reachable by tabbing.
     */
    disabled: {
      type: Boolean,
      value: false,
      reflectToAttribute: true,
      observer: 'onDisabledChanged_'
    },

    /** Number of rows (lines) of the text area. */
    rows: {
      type: Number,
      value: 3,
      reflectToAttribute: true,
    },

    /** Caption of the text area. */
    label: {
      type: String,
      value: '',
    },

    /**
     * Text inside the text area. If the text exceeds the bounds of the text
     * area, i.e. if it has more than |rows| lines, a scrollbar is shown by
     * default.
     */
    value: {
      type: String,
      value: '',
      notify: true,
    },
  },

  /**
   * 'change' event fires when <input> value changes and user presses 'Enter'.
   * This function helps propagate it to host since change events don't
   * propagate across Shadow DOM boundary by default.
   * @param {!Event} e
   * @private
   */
  onInputChange_: function(e) {
    this.fire('change', {sourceEvent: e});
  },

  /**@private */
  onInputFocusChange_: function() {
    // focused_ is used instead of :focus-within, so focus on elements within
    // the suffix slot does not trigger a change in input styles.
    if (this.shadowRoot.activeElement == this.$.input) {
      this.setAttribute('focused_', '');
    } else {
      this.removeAttribute('focused_');
    }
  },

  /**@private */
  onDisabledChanged_: function() {
    this.setAttribute('aria-disabled', this.disabled ? 'true' : 'false');
  },
});