fix: address regression when onclick and href provided

Author: nicolethoen

packages/module/patternfly-docs/content/examples/CatalogTile.md

@@ -94,6 +94,7 @@ import pfLogo6 from './pfLogo6.svg';
       <CogIcon />
     </CatalogTileBadge>
   ]}
+  onClick={()=>console.log("hi")}
   href="http://patternfly.org/v4"
   title="Patternfly-React"
   vendor="provided by Red Hat"

packages/module/patternfly-docs/generated/extensions/catalog-view/catalog-tile/react.js

@@ -144,7 +144,7 @@ pageData.examples = {
 
     </Example>,
   'Link variant': props => 
-    <Example {...pageData} {...props} {...{"code":"import React from 'react';\nimport { CatalogTile, CatalogTileBadge } from '@patternfly/react-catalog-view-extension';\nimport CogIcon from '@patternfly/react-icons/dist/esm/icons/cog-icon';\nimport pfLogo6 from './pfLogo6.svg';\n\nconst LinkVariant = () => (\n  <CatalogTile\n    id=\"simple-link-variant\"\n    iconImg={pfLogo6}\n    iconAlt=\"PatternFly logo\"\n    badges={[\n      <CatalogTileBadge title=\"Certified\">\n        <CogIcon />\n      </CatalogTileBadge>\n    ]}\n    href=\"http://patternfly.org/v4\"\n    title=\"Patternfly-React\"\n    vendor=\"provided by Red Hat\"\n    description={\n      'This is a very, very long description that should be truncated after three lines. ' +\n      'Three lines is the default for cards without a footer. Cards with a footer are truncated after one line. Truncation function use is deprecated; please pass in a maxDescriptionLength of -1 to override it. ' +\n      'This has changed from PatternFly 3.'\n    }\n  />\n)","title":"Link variant","lang":"js","className":""}}>
+    <Example {...pageData} {...props} {...{"code":"import React from 'react';\nimport { CatalogTile, CatalogTileBadge } from '@patternfly/react-catalog-view-extension';\nimport CogIcon from '@patternfly/react-icons/dist/esm/icons/cog-icon';\nimport pfLogo6 from './pfLogo6.svg';\n\nconst LinkVariant = () => (\n  <CatalogTile\n    id=\"simple-link-variant\"\n    iconImg={pfLogo6}\n    iconAlt=\"PatternFly logo\"\n    badges={[\n      <CatalogTileBadge title=\"Certified\">\n        <CogIcon />\n      </CatalogTileBadge>\n    ]}\n    onClick={()=>console.log(\"hi\")}\n    href=\"http://patternfly.org/v4\"\n    title=\"Patternfly-React\"\n    vendor=\"provided by Red Hat\"\n    description={\n      'This is a very, very long description that should be truncated after three lines. ' +\n      'Three lines is the default for cards without a footer. Cards with a footer are truncated after one line. Truncation function use is deprecated; please pass in a maxDescriptionLength of -1 to override it. ' +\n      'This has changed from PatternFly 3.'\n    }\n  />\n)","title":"Link variant","lang":"js","className":""}}>
 
     </Example>,
   'With multiple icon badges': props => 

packages/module/src/components/CatalogTile/CatalogTile.tsx

@@ -63,14 +63,24 @@ export class CatalogTile extends React.Component<CatalogTileProps> {
   private handleClick = (e: React.FormEvent<HTMLInputElement> | React.MouseEvent<Element, MouseEvent>) => {
     const { onClick, href } = this.props;
 
-    if (!href) {
-      e.preventDefault();
-    } else {
+    if ("type" in e && e.type === "click" && onClick) {
+      // It's a MouseEvent
+      const mouseEvent = e as React.MouseEvent<Element, MouseEvent>;
+      if (
+        mouseEvent.metaKey || // Cmd key (Mac)
+        mouseEvent.ctrlKey || // Ctrl key
+        mouseEvent.shiftKey // Shift key
+      ) {
+        window.open(href, '_blank');
+        return; 
+      }
+    } else if (href){
       window.open(href, '_blank');
     }
+
     if (onClick) {
       onClick(e);
-    }
+    } 
   };
 
   private renderBadges = (badges: React.ReactNode[]) => {