fix(ClickableTile): use Link (#7763)

Co-authored-by: kodiakhq[bot] <49736102+kodiakhq[bot]@users.noreply.github.com>

Author: tw15egan

packages/components/src/components/tile/_tile.scss

@@ -75,6 +75,12 @@
     text-decoration: none;
   }
 
+  .#{$prefix}--tile--clickable:hover,
+  .#{$prefix}--tile--clickable:active {
+    color: $text-01;
+    text-decoration: none;
+  }
+
   .#{$prefix}--tile--selectable {
     padding-right: $carbon--spacing-09;
   }

packages/react/src/components/Tile/Tile.js

@@ -9,6 +9,7 @@ import React, { Component } from 'react';
 import PropTypes from 'prop-types';
 import classNames from 'classnames';
 import { settings } from 'carbon-components';
+import Link from '../Link';
 import {
   CheckmarkFilled16 as CheckmarkFilled,
   ChevronDown16,
@@ -168,14 +169,14 @@ export class ClickableTile extends Component {
     );
 
     return (
-      <a
+      <Link
         href={href}
         className={classes}
         {...other}
         onClick={this.handleClick}
         onKeyDown={this.handleKeyDown}>
         {children}
-      </a>
+      </Link>
     );
   }
 }