blob: fa4617d748f9cb24349f871b1dacc06306c4cd20 [file] [log] [blame]
/**
* @license
* Copyright (C) 2020 The Android Open Source Project
*
* Licensed under the Apache License, Version 2.0 (the "License");
* you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
*
* http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
*/
import {html} from '@polymer/polymer/lib/utils/html-tag.js';
export const htmlTemplate = html`
<style include="shared-styles">
/* Workaround for empty style block - see https://github.com/Polymer/tools/issues/408 */
</style>
<style include="gr-form-styles">
/* Workaround for empty style block - see https://github.com/Polymer/tools/issues/408 */
</style>
<style include="gr-subpage-styles">
.inherited {
color: var(--deemphasized-text-color);
margin-left: var(--spacing-m);
}
section.section:not(.ARRAY) .title {
align-items: center;
display: flex;
}
section.section.ARRAY .title {
padding-top: var(--spacing-m);
}
</style>
<div class="gr-form-styles">
<fieldset>
<h4>[[pluginData.name]]</h4>
<template is="dom-repeat" items="[[_pluginConfigOptions]]" as="option">
<section class\$="section [[option.info.type]]">
<span class="title">
<gr-tooltip-content has-tooltip="[[option.info.description]]" show-icon="[[option.info.description]]" title="[[option.info.description]]">
<span>[[option.info.display_name]]</span>
</gr-tooltip-content>
</span>
<span class="value">
<template is="dom-if" if="[[_isArray(option.info.type)]]">
<gr-plugin-config-array-editor on-plugin-config-option-changed="_handleArrayChange" plugin-option="[[option]]"></gr-plugin-config-array-editor>
</template>
<template is="dom-if" if="[[_isBoolean(option.info.type)]]">
<paper-toggle-button checked="[[_computeChecked(option.info.value)]]" on-change="_handleBooleanChange" data-option-key\$="[[option._key]]" disabled\$="[[_computeDisabled(option.info.editable)]]"></paper-toggle-button>
</template>
<template is="dom-if" if="[[_isList(option.info.type)]]">
<gr-select bind-value\$="[[option.info.value]]" on-change="_handleListChange">
<select data-option-key\$="[[option._key]]" disabled\$="[[_computeDisabled(option.info.editable)]]">
<template is="dom-repeat" items="[[option.info.permitted_values]]" as="value">
<option value\$="[[value]]">[[value]]</option>
</template>
</select>
</gr-select>
</template>
<template is="dom-if" if="[[_isString(option.info.type)]]">
<iron-input bind-value="[[option.info.value]]" on-input="_handleStringChange" data-option-key\$="[[option._key]]" disabled\$="[[_computeDisabled(option.info.editable)]]">
<input is="iron-input" value="[[option.info.value]]" on-input="_handleStringChange" data-option-key\$="[[option._key]]" disabled\$="[[_computeDisabled(option.info.editable)]]">
</iron-input>
</template>
<template is="dom-if" if="[[option.info.inherited_value]]">
<span class="inherited">
(Inherited: [[option.info.inherited_value]])
</span>
</template>
</span>
</section>
</template>
</fieldset>
</div>
`;