mirror of
https://github.com/jellyfin/jellyfin-web.git
synced 2024-11-18 11:28:23 -07:00
106 lines
2.9 KiB
HTML
106 lines
2.9 KiB
HTML
<!--
|
|
@license
|
|
Copyright (c) 2015 The Polymer Project Authors. All rights reserved.
|
|
This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt
|
|
The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt
|
|
The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt
|
|
Code distributed by Google as part of the polymer project is also
|
|
subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt
|
|
-->
|
|
<link rel="import" href="../polymer/polymer.html">
|
|
<link rel="import" href="../iron-autogrow-textarea/iron-autogrow-textarea.html">
|
|
<link rel="import" href="paper-input-behavior.html">
|
|
<link rel="import" href="paper-input-container.html">
|
|
<link rel="import" href="paper-input-error.html">
|
|
<link rel="import" href="paper-input-char-counter.html">
|
|
|
|
<!--
|
|
`<paper-textarea>` is a multi-line text field with Material Design styling.
|
|
|
|
<paper-textarea label="Textarea label"></paper-textarea>
|
|
|
|
See `Polymer.PaperInputBehavior` for more API docs.
|
|
|
|
### Validation
|
|
|
|
Currently only `required` and `maxlength` validation is supported.
|
|
|
|
### Styling
|
|
|
|
See `Polymer.PaperInputContainer` for a list of custom properties used to
|
|
style this element.
|
|
-->
|
|
|
|
<dom-module id="paper-textarea">
|
|
<template>
|
|
|
|
<paper-input-container no-label-float$="[[noLabelFloat]]" always-float-label="[[_computeAlwaysFloatLabel(alwaysFloatLabel,placeholder)]]" auto-validate$="[[autoValidate]]" disabled$="[[disabled]]" invalid="[[invalid]]">
|
|
|
|
<label hidden$="[[!label]]">[[label]]</label>
|
|
|
|
<iron-autogrow-textarea id="input" class="paper-input-input"
|
|
bind-value="{{value}}"
|
|
autocomplete$="[[autocomplete]]"
|
|
autofocus$="[[autofocus]]"
|
|
inputmode$="[[inputmode]]"
|
|
name$="[[name]]"
|
|
placeholder$="[[placeholder]]"
|
|
readonly$="[[readonly]]"
|
|
required$="[[required]]"
|
|
maxlength$="[[maxlength]]"
|
|
autocapitalize$="[[autocapitalize]]"></iron-autogrow-textarea>
|
|
|
|
<template is="dom-if" if="[[errorMessage]]">
|
|
<paper-input-error>[[errorMessage]]</paper-input-error>
|
|
</template>
|
|
|
|
<template is="dom-if" if="[[charCounter]]">
|
|
<paper-input-char-counter></paper-input-char-counter>
|
|
</template>
|
|
|
|
</paper-input-container>
|
|
|
|
</template>
|
|
|
|
</dom-module>
|
|
|
|
<script>
|
|
|
|
(function() {
|
|
|
|
Polymer({
|
|
|
|
is: 'paper-textarea',
|
|
|
|
behaviors: [
|
|
Polymer.PaperInputBehavior
|
|
],
|
|
|
|
properties: {
|
|
|
|
_ariaLabelledBy: {
|
|
observer: '_ariaLabelledByChanged',
|
|
type: String
|
|
},
|
|
|
|
_ariaDescribedBy: {
|
|
observer: '_ariaDescribedByChanged',
|
|
type: String
|
|
}
|
|
|
|
},
|
|
|
|
_ariaLabelledByChanged: function(ariaLabelledBy) {
|
|
this.$.input.textarea.setAttribute('aria-labelledby', ariaLabelledBy);
|
|
},
|
|
|
|
_ariaDescribedByChanged: function(ariaDescribedBy) {
|
|
this.$.input.textarea.setAttribute('aria-describedby', ariaDescribedBy);
|
|
}
|
|
|
|
});
|
|
|
|
})();
|
|
|
|
</script>
|