Convert gr-linked-chip.js to .ts
Change-Id: I0c2fe85664cb134da6388bd59b488cd758da43ff
diff --git a/polygerrit-ui/app/elements/shared/gr-linked-chip/gr-linked-chip.ts b/polygerrit-ui/app/elements/shared/gr-linked-chip/gr-linked-chip.ts
index 46588ef..da843fa 100644
--- a/polygerrit-ui/app/elements/shared/gr-linked-chip/gr-linked-chip.ts
+++ b/polygerrit-ui/app/elements/shared/gr-linked-chip/gr-linked-chip.ts
@@ -15,57 +15,60 @@
* limitations under the License.
*/
-import '../gr-button/gr-button.js';
-import '../gr-icons/gr-icons.js';
-import '../gr-limited-text/gr-limited-text.js';
-import '../../../styles/shared-styles.js';
-import {GestureEventListeners} from '@polymer/polymer/lib/mixins/gesture-event-listeners.js';
-import {LegacyElementMixin} from '@polymer/polymer/lib/legacy/legacy-element-mixin.js';
-import {PolymerElement} from '@polymer/polymer/polymer-element.js';
-import {htmlTemplate} from './gr-linked-chip_html.js';
+import '../gr-button/gr-button';
+import '../gr-icons/gr-icons';
+import '../gr-limited-text/gr-limited-text';
+import '../../../styles/shared-styles';
+import {GestureEventListeners} from '@polymer/polymer/lib/mixins/gesture-event-listeners';
+import {LegacyElementMixin} from '@polymer/polymer/lib/legacy/legacy-element-mixin';
+import {PolymerElement} from '@polymer/polymer/polymer-element';
+import {customElement, property} from '@polymer/decorators/lib/decorators';
+import {htmlTemplate} from './gr-linked-chip_html';
-/**
- * @extends PolymerElement
- */
-class GrLinkedChip extends GestureEventListeners(
- LegacyElementMixin(PolymerElement)) {
- static get template() { return htmlTemplate; }
-
- static get is() { return 'gr-linked-chip'; }
-
- static get properties() {
- return {
- href: String,
- disabled: {
- type: Boolean,
- value: false,
- reflectToAttribute: true,
- },
- removable: {
- type: Boolean,
- value: false,
- },
- text: String,
- transparentBackground: {
- type: Boolean,
- value: false,
- },
-
- /** If provided, sets the maximum length of the content. */
- limit: Number,
- };
- }
-
- _getBackgroundClass(transparent) {
- return transparent ? 'transparentBackground' : '';
- }
-
- _handleRemoveTap(e) {
- e.preventDefault();
- this.dispatchEvent(new CustomEvent('remove', {
- composed: true, bubbles: true,
- }));
+declare global {
+ interface HTMLElementTagNameMap {
+ 'gr-linked-chip': GrLinkedChip;
}
}
-customElements.define(GrLinkedChip.is, GrLinkedChip);
+@customElement('gr-linked-chip')
+export class GrLinkedChip extends GestureEventListeners(
+ LegacyElementMixin(PolymerElement)
+) {
+ static get template() {
+ return htmlTemplate;
+ }
+
+ @property({type: String})
+ href?: string;
+
+ @property({type: Boolean, reflectToAttribute: true})
+ disabled = false;
+
+ @property({type: Boolean})
+ removable = false;
+
+ @property({type: String})
+ text?: string;
+
+ @property({type: Boolean})
+ transparentBackground = false;
+
+ /** If provided, sets the maximum length of the content. */
+ @property({type: Number})
+ limit?: number;
+
+ _getBackgroundClass(transparent: boolean) {
+ return transparent ? 'transparentBackground' : '';
+ }
+
+ _handleRemoveTap(e: Event) {
+ e.preventDefault();
+ this.dispatchEvent(
+ new CustomEvent('remove', {
+ composed: true,
+ bubbles: true,
+ })
+ );
+ }
+}
