Add React Spectrum v3 link

Author: devongovett

packages/dev/s2-docs/src/SearchTagGroups.tsx

@@ -1,13 +1,15 @@
 import {divider} from './SearchMenu';
 import {Key, Separator as RACSeparator} from 'react-aria-components';
+import LinkOutIcon from '../../../@react-spectrum/s2/ui-icons/LinkOut';
 import React from 'react';
 import {SelectableCollectionContext} from '../../../react-aria-components/src/RSPContexts';
 import {style} from '@react-spectrum/s2/style' with { type: 'macro' };
 import {Tag, TagGroup} from '@react-spectrum/s2';
 
 interface TagItem {
   id: string,
-  name: string
+  name: string,
+  href?: string
 }
 
 interface SearchTagGroupsProps {
@@ -77,8 +79,13 @@ export function SearchTagGroups({
                 items={resourceTags}
                 UNSAFE_style={isMobile ? {whiteSpace: 'nowrap'} : undefined}>
                 {(tag) => (
-                  <Tag key={tag.id} id={tag.id}>
+                  <Tag key={tag.id} id={tag.id} href={tag.href} target="_blank">
                     {tag.name}
+                    {tag.href &&
+                      <LinkOutIcon
+                        aria-label="(opens in a new tab)"
+                        className={style({'--iconPrimary': {type: 'fill', value: 'currentColor'}, marginStart: 8, flexShrink: 0})} />
+                    }
                   </Tag>
                 )}
               </TagGroup>

packages/dev/s2-docs/src/searchUtils.tsx

@@ -1,14 +1,15 @@
 'use client';
 
 import {Content, Heading, IllustratedMessage} from '@react-spectrum/s2';
-import {getLibraryFromPage} from './library';
+import {getBaseUrl} from './pageUtils';
 // @ts-ignore
+import {getLibraryFromPage} from './library';
 import {iconList, useIconFilter} from './IconSearchView';
 import {Key} from 'react-aria-components';
+ 
 import {type Library, TAB_DEFS} from './constants';
-// eslint-disable-next-line monorepo/no-internal-import
-import NoSearchResults from '@react-spectrum/s2/illustrations/linear/NoSearchResults';
 // @ts-ignore
+import NoSearchResults from '@react-spectrum/s2/illustrations/linear/NoSearchResults';
 import {Page} from '@parcel/rsc';
 import React, {useCallback, useEffect, useMemo, useRef, useState} from 'react';
 import {style} from '@react-spectrum/s2/style' with {type: 'macro'};
@@ -37,7 +38,8 @@ export interface Section {
 
 export interface Tag {
   id: string,
-  name: string
+  name: string,
+  href?: string
 }
 
 /**
@@ -349,7 +351,7 @@ export function getOrderedLibraries(currentPage: Page) {
 
 export function getResourceTags(library: Library): Tag[] {
   if (library === 'react-spectrum') {
-    return [{id: 'icons', name: 'Icons'}];
+    return [{id: 'icons', name: 'Icons'}, {id: 'v3', name: 'React Spectrum v3', href: getBaseUrl('s2') + '/v3/getting-started.html'}];
   }
   return [];
 }