An extension of Ember's TextareaAutosize
component from ember-cli-textarea-autosize, but
applies Bootstrap styling. Basic elements needed to properly use are listed as properties here. Basic usage example:
<FwTextarea @value={{myVariable}} @update={{action (mut myVariable)}} />
If you want input-group-addons, you will need to pass them into the component like so. This is to ensure that the character count doesn't mess with the addon. Note that you should not wrap it in the 'input-group' class, as that is done within the component:
<FwTextarea @value={{myVariable}} @update={{action (mut myvariable)}} as |section|>
{{#if section.prepend}}
{{!-- insert prepend addon here --}}
{{else if section.append}}
{{!-- inset append addon here --}}
{{/if}}
</FwTextarea>
See Ember's textarea
, documentation here and ember-cli-textarea-autosize,
documentation here.
These two documentations should help you know how to do things.
for more information.
Methods
autoresize
BooleanAutoresize allows the textarea to expand as more data is put into it. This is expanded with the ember-cli-autoresize.
Default: true
max-height
StringGoes with autoresize. This is the maximum height a fw-textarea will grow to. If it is null, the fw-textarea will grow indefinitely. If autoresize is false, it is set to 56.8 px.
maxCount
NumberSets the limit of how many characters are allowed to be typed. Whichever of maxlength or maxCount is greater will determine the actual limit, but the count will display as negative and red if maxlength is surpassed.
Default: 3000
min-height
StringGoes with autoresize. This is the minimum height an empty textarea will be. This is also a css string for height. If autoresize is false, this is set to 56.8px.
placeholder
StringThis is an optional attribute that changes the placeholder of the textarea (the grey text which appears if the textarea is empty).
Default: null
rows
NumberNumber of lines in height the textarea is to start out. Use this or min-height
, not both.
Default: 2
showCount
BooleanIf true, number of characters remaining will appear below the textarea, on the right.
Default: true
update
ActionThis attribute takes the action which is called whenever the value is changed. It is always used with the native handlebars action helper, and is often used with the native handlebars mut helper (as seen in the example above).
value
StringThe variable that is the value of the textarea (the information displayed in it).
Default: null