Migrate from Polymer to Lit

Also remove the extra bind-value attribute for the input
tag and instead use the revision object to get the current
ref.

Change-Id: Iee2cd78206fc6a0188b21357fa9a70dd803c692c

ref-copy/plugin.js

diff --git a/ref-copy/plugin.js b/ref-copy/plugin.js
index 6e3adc1..d406da0 100644
--- a/ref-copy/plugin.js
+++ b/ref-copy/plugin.js
@@ -12,9 +12,9 @@
 // See the License for the specific language governing permissions and
 // limitations under the License.
 
-import './ref-copy';
+import {REF_COPY} from './ref-copy';
 
 Gerrit.install(plugin => {
   plugin.registerCustomComponent(
-      'change-metadata-item', 'ref-copy');
+      'change-metadata-item', REF_COPY);
 });

ref-copy/ref-copy.js

diff --git a/ref-copy/ref-copy.js b/ref-copy/ref-copy.js
index 4ced2bd..46fc39f 100644
--- a/ref-copy/ref-copy.js
+++ b/ref-copy/ref-copy.js
@@ -12,40 +12,71 @@
 // See the License for the specific language governing permissions and
 // limitations under the License.
 
-import {htmlTemplate} from './ref-copy_html';
+import {css, html, LitElement} from 'lit';
 
 const COPY_TIMEOUT_MS = 1000;
 
-class RefCopy extends Polymer.Element {
-
-  static get is() { return 'ref-copy'; }
-
-  static get template() { return htmlTemplate; }
-
+export const REF_COPY = 'ref-copy';
+class RefCopy extends LitElement {
   static get properties() {
     return {
-      revision: Object,
+      revision: {type: Object}
     };
   }
 
+  static get styles() {
+    return css`
+    .text {
+      min-width: 8em;
+      padding: var(--spacing-l);
+      text-transform: none;
+    }
+    `;
+  }
+
+  render() {
+    return html`
+    <div class="text">
+      <iron-input
+          bind-value="${this.revision.ref}"
+          readonly>
+        <input
+            id="input"
+            is="iron-input"
+            type="text"
+            @click="${this._handleInputTap}"
+            readonly/>
+      </iron-input>
+      <gr-button
+        id="button"
+        link
+        class="copyToClipboard"
+        @click="${this._copyToClipboard}">
+        copy
+      </gr-button>
+    </div>`;
+  }
+
   _handleInputTap(e) {
     e.preventDefault();
-    Polymer.dom(e).rootTarget.select();
+    const rootTarget = e.composedPath()[0];
+    rootTarget.select();
   }
 
   _copyToClipboard(e) {
-    const ref = this.$.input.value;
+    const ref = this.revision.ref;
     const copyBtn = e.target;
     if (ref) {
       navigator.clipboard.writeText(ref).then(() => {
         copyBtn.innerText = 'done';
         setTimeout(() => {
-          copyBtn.innerText = 'copy'}, COPY_TIMEOUT_MS);
-        }).catch(err => {
-          console.log('Failed to copy ref to clipboard', err);
-        })
+          copyBtn.innerText = 'copy'
+        }, COPY_TIMEOUT_MS);
+      }).catch(err => {
+        console.log('Failed to copy ref to clipboard', err);
+      })
     }
   }
 }
 
-customElements.define(RefCopy.is, RefCopy);
+customElements.define(REF_COPY, RefCopy);

ref-copy/ref-copy_html.js

diff --git a/ref-copy/ref-copy_html.js b/ref-copy/ref-copy_html.js
deleted file mode 100644
index d39c9e2..0000000
--- a/ref-copy/ref-copy_html.js
+++ /dev/null
@@ -1,43 +0,0 @@
-// Copyright (C) 2021 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.
-
-export const htmlTemplate = Polymer.html`
-<style>
-  .text {
-    min-width: 8em;
-    padding: var(--spacing-l);
-    text-transform: none;
-  }
-</style>
-<div class="text">
-  <iron-input
-      bind-value="{{revision.ref}}"
-      readonly>
-    <input
-        id="input"
-        is="iron-input"
-        type="text"
-        on-tap="_handleInputTap"
-        bind-value="{{revision.ref}}"
-        readonly/>
-  </iron-input>
-  <gr-button
-    id="button"
-    link
-    class="copyToClipboard"
-    on-tap="_copyToClipboard">
-    copy
-  </gr-button>
-</div>
-<gr-js-api-interface id="jsAPI"></gr-js-api-interface>`;