Project import generated by Copybara.
GitOrigin-RevId: d9e9e3fb4e31372ec1fb43b178994ca78fa8fe70
diff --git a/static_src/elements/issue-detail/metadata/mr-metadata/mr-field-values.js b/static_src/elements/issue-detail/metadata/mr-metadata/mr-field-values.js
new file mode 100644
index 0000000..ba68c39
--- /dev/null
+++ b/static_src/elements/issue-detail/metadata/mr-metadata/mr-field-values.js
@@ -0,0 +1,58 @@
+// Copyright 2019 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.
+
+import {LitElement, html} from 'lit-element';
+
+import 'elements/framework/links/mr-user-link/mr-user-link.js';
+import {fieldTypes, EMPTY_FIELD_VALUE} from 'shared/issue-fields.js';
+import {displayNameToUserRef} from 'shared/convertersV0.js';
+import {SHARED_STYLES} from 'shared/shared-styles.js';
+
+/**
+ * `<mr-field-values>`
+ *
+ * Takes in a list of field values and a single fieldDef and displays them
+ * according to their type.
+ *
+ */
+export class MrFieldValues extends LitElement {
+ /** @override */
+ static get styles() {
+ return SHARED_STYLES;
+ }
+
+ /** @override */
+ render() {
+ if (!this.values || !this.values.length) {
+ return html`${EMPTY_FIELD_VALUE}`;
+ }
+ switch (this.type) {
+ case fieldTypes.URL_TYPE:
+ return html`${this.values.map((value) => html`
+ <a href=${value} target="_blank" rel="nofollow">${value}</a>
+ `)}`;
+ case fieldTypes.USER_TYPE:
+ return html`${this.values.map((value) => html`
+ <mr-user-link .userRef=${displayNameToUserRef(value)}></mr-user-link>
+ `)}`;
+ default:
+ return html`${this.values.map((value, i) => html`
+ <a href="/p/${this.projectName}/issues/list?q=${this.name}="${value}"">
+ ${value}</a>${this.values.length - 1 > i ? ', ' : ''}
+ `)}`;
+ }
+ }
+
+ /** @override */
+ static get properties() {
+ return {
+ name: {type: String},
+ type: {type: Object},
+ projectName: {type: String},
+ values: {type: Array},
+ };
+ }
+}
+
+customElements.define('mr-field-values', MrFieldValues);