58 lines
1.7 KiB
Handlebars
58 lines
1.7 KiB
Handlebars
<div
|
|
class="masked-input {{if @displayOnly 'display-only'}} {{if @allowCopy 'allow-copy'}}"
|
|
data-test-masked-input
|
|
data-test-field
|
|
...attributes
|
|
>
|
|
{{#if @displayOnly}}
|
|
{{#if this.showValue}}
|
|
<pre class="masked-value display-only is-word-break">{{@value}}</pre>
|
|
{{else}}
|
|
<pre class="masked-value display-only masked-font">***********</pre>
|
|
{{/if}}
|
|
{{else}}
|
|
<Textarea
|
|
id={{this.textareaId}}
|
|
name={{@name}}
|
|
@value={{@value}}
|
|
class="input masked-value {{unless this.showValue 'masked-font'}}"
|
|
rows={{1}}
|
|
wrap="off"
|
|
spellcheck="false"
|
|
{{on "change" this.onChange}}
|
|
{{on "keyup" (fn this.handleKeyUp @name)}}
|
|
data-test-textarea
|
|
/>
|
|
{{/if}}
|
|
{{#if @allowCopy}}
|
|
<CopyButton
|
|
@clipboardText={{@value}}
|
|
@success={{action (set-flash-message "Data copied!")}}
|
|
class="copy-button button {{if @displayOnly 'is-compact'}}"
|
|
data-test-copy-button
|
|
>
|
|
<Icon @name="clipboard-copy" aria-hidden="Copy value" />
|
|
</CopyButton>
|
|
{{/if}}
|
|
{{#if @allowDownload}}
|
|
<DownloadButton
|
|
class="button download-button"
|
|
@filename={{or @name "secret-value"}}
|
|
@data={{@value}}
|
|
@stringify={{true}}
|
|
aria-label="Download secret value"
|
|
>
|
|
<Icon @name="download" />
|
|
</DownloadButton>
|
|
{{/if}}
|
|
<button
|
|
onclick={{this.toggleMask}}
|
|
type="button"
|
|
aria-label={{if this.showValue "mask value" "show value"}}
|
|
title={{if this.showValue "mask value" "show value"}}
|
|
class="{{if (eq @value '') 'has-text-grey'}} masked-input-toggle button"
|
|
data-test-button="toggle-masked"
|
|
>
|
|
<Icon @name={{if this.showValue "eye" "eye-off"}} />
|
|
</button>
|
|
</div> |