feat: add launch action for AILabel icon in icon library

src/components/SVGLibraries/shared/ActionBar.js

@@ -1,5 +1,5 @@
 import React, { useRef, useContext, useState } from 'react';
-import { Code, Download } from '@carbon/icons-react';
+import { Code, Download, Launch } from '@carbon/icons-react';
 import { Button } from '@carbon/react';
 import copy from 'copy-to-clipboard';
 import cx from 'classnames';
@@ -46,6 +46,14 @@ const ActionBar = ({
     copy(`<${moduleName} />`, { format: 'text/plain' });
   };
 
+  // AILabel icon is customized to display a launch icon,
+  // linking to the React Storybook component, instead
+  // of the standard download action.
+  const shouldShowLaunchButton = name === 'ai-label';
+  const shouldShowDownloadButton = name !== 'ai-label';
+  const launchURL =
+    'https://react.carbondesignsystem.com/?path=/docs/components-ailabel--overview';
+
   return (
     <div
       ref={actionBarRef}
@@ -54,23 +62,40 @@ const ActionBar = ({
       className={cx(container, {
         [hidden]: !isActionBarVisible,
       })}>
-      <Button
-        kind="ghost"
-        size="small"
-        hasIconOnly
-        tooltipAlignment={tooltipAlignment}
-        tooltipPosition="top"
-        iconDescription="Download SVG"
-        renderIcon={Download}
-        onFocus={() => setIsActionBarVisible(true)}
-        onClick={handleDownload}
-        className={tooltip}
-        triggerClassName={trigger}
-      />
+      {shouldShowLaunchButton && (
+        <Button
+          kind="ghost"
+          size="sm"
+          hasIconOnly
+          tooltipAlignment={tooltipAlignment}
+          tooltipPosition="top"
+          iconDescription="View component"
+          renderIcon={Launch}
+          onFocus={() => setIsActionBarVisible(true)}
+          href={launchURL}
+          className={tooltip}
+          triggerClassName={trigger}
+        />
+      )}
+      {shouldShowDownloadButton && (
+        <Button
+          kind="ghost"
+          size="sm"
+          hasIconOnly
+          tooltipAlignment={tooltipAlignment}
+          tooltipPosition="top"
+          iconDescription="Download SVG"
+          renderIcon={Download}
+          onFocus={() => setIsActionBarVisible(true)}
+          onClick={handleDownload}
+          className={tooltip}
+          triggerClassName={trigger}
+        />
+      )}
       {shouldShowCopyButton && (
         <Button
           kind="ghost"
-          size="small"
+          size="sm"
           hasIconOnly
           tooltipAlignment={tooltipAlignment}
           tooltipPosition="top"

src/components/SVGLibraries/shared/ActionBar.module.scss

@@ -29,8 +29,6 @@
   padding: 0;
   border: 0;
   background: transparent;
-  height: 32px;
-  width: 32px;
   display: inline-flex;
   justify-content: center;
   align-items: center;