diff --git a/packages/@adobe/spectrum-css-temp/components/tags/index.css b/packages/@adobe/spectrum-css-temp/components/tags/index.css
index 82cffe91b12..28d36d50e42 100644
--- a/packages/@adobe/spectrum-css-temp/components/tags/index.css
+++ b/packages/@adobe/spectrum-css-temp/components/tags/index.css
@@ -13,7 +13,7 @@ governing permissions and limitations under the License.
 @import '../commons/index.css';
 
 .spectrum-Tags {
-  display: inline-flex;
+  display: flex;
   flex-wrap: wrap;
 
   margin: 0;
@@ -27,7 +27,7 @@ governing permissions and limitations under the License.
   --spectrum-focus-ring-border-size: var(--spectrum-tag-border-size);
 
   display: grid;
-  grid-template-columns: 1fr auto;
+  grid-template-columns: auto 1fr auto;
   grid-template-areas: "icon content action";
   align-items: center;
   box-sizing: border-box;
@@ -58,28 +58,36 @@ governing permissions and limitations under the License.
     height: calc(var(--spectrum-tag-height) - (2 * var(--spectrum-tag-border-size)));
     width: var(--spectrum-global-dimension-size-300);
   }
-}
 
-.spectrum-Tag-icon {
-  grid-area: icon;
-  margin-inline-end: var(--spectrum-global-dimension-size-100);
-}
+  .spectrum-Tag-cell {
+    overflow: hidden;
+    text-overflow: ellipsis;
+    display: flex;
+    align-items: center;
+  }
 
-.spectrum-Tag-content {
-  grid-area: content;
-  block-size: 100%;
-  line-height: calc(var(--spectrum-tag-height) - calc(var(--spectrum-tag-border-size) * 2));
-  margin-inline-end: var(--spectrum-tag-padding-x);
-  flex: 1 1 auto;
-  font-size: var(--spectrum-tag-text-size);
-  cursor: default;
-  overflow: hidden;
-  white-space: nowrap;
-  text-overflow: ellipsis;
-  outline: none;
-}
+  .spectrum-Tag-icon {
+    grid-area: icon;
+    margin-inline-end: var(--spectrum-global-dimension-size-100);
+  }
+
+  .spectrum-Tag-content {
+    grid-area: content;
+    line-height: calc(var(--spectrum-tag-height) - calc(var(--spectrum-tag-border-size) * 2));
+    margin-inline-end: var(--spectrum-tag-padding-x);
+    flex: 1 1 auto;
+    font-size: var(--spectrum-tag-text-size);
+    cursor: default;
+    overflow: hidden;
+    white-space: nowrap;
+    text-overflow: ellipsis;
+    outline: none;
+  }
 
-.tags-removable {
-  margin-inline-end: 0;
+  &.is-removable {
+    .spectrum-Tag-content {
+      margin-inline-end: 0;
+    }
+  }
 }
 
diff --git a/packages/@react-aria/tag/intl/en-US.json b/packages/@react-aria/tag/intl/en-US.json
index 67ff0e1312a..f7a6cb22c7c 100644
--- a/packages/@react-aria/tag/intl/en-US.json
+++ b/packages/@react-aria/tag/intl/en-US.json
@@ -1,3 +1,3 @@
 {
-  "remove": "Remove"
+  "remove": "Press Space or Delete to remove tag."
 }
diff --git a/packages/@react-aria/tag/package.json b/packages/@react-aria/tag/package.json
index 7b7f54219c7..f8a69edc127 100644
--- a/packages/@react-aria/tag/package.json
+++ b/packages/@react-aria/tag/package.json
@@ -17,12 +17,12 @@
     "url": "https://github.com/adobe/react-spectrum"
   },
   "dependencies": {
-    "@react-aria/grid": "^3.5.2",
+    "@react-aria/gridlist": "^3.1.1",
     "@react-aria/i18n": "^3.6.3",
     "@react-aria/interactions": "^3.13.1",
     "@react-aria/utils": "^3.14.2",
-    "@react-stately/grid": "^3.4.2",
-    "@react-types/grid": "^3.1.5",
+    "@react-stately/tag": "3.0.0-alpha.1",
+    "@react-types/button": "^3.7.0",
     "@react-types/shared": "^3.16.0",
     "@react-types/tag": "3.0.0-beta.1",
     "@swc/helpers": "^0.4.14"
diff --git a/packages/@react-aria/tag/src/TagKeyboardDelegate.ts b/packages/@react-aria/tag/src/TagKeyboardDelegate.ts
index 3a3ed95f5b8..3f78d483f10 100644
--- a/packages/@react-aria/tag/src/TagKeyboardDelegate.ts
+++ b/packages/@react-aria/tag/src/TagKeyboardDelegate.ts
@@ -10,25 +10,26 @@
  * governing permissions and limitations under the License.
  */
 
-import {GridCollection} from '@react-types/grid';
-import {GridKeyboardDelegate} from '@react-aria/grid';
+import {Collection, Direction, KeyboardDelegate} from '@react-types/shared';
 import {Key} from 'react';
 
-export class TagKeyboardDelegate<T> extends GridKeyboardDelegate<T, GridCollection<T>> {
-  getFirstKey() {
-    let key = this.collection.getFirstKey();
-    let item = this.collection.getItem(key);
+export class TagKeyboardDelegate<T> implements KeyboardDelegate {
+  private collection: Collection<T>;
+  private direction: Direction;
 
-    return [...item.childNodes][0].key;
+  constructor(collection: Collection<T>, direction: Direction) {
+    this.collection = collection;
+    this.direction = direction;
   }
 
-  getLastKey() {
-    let key = this.collection.getLastKey();
-    let item = this.collection.getItem(key);
-
-    return [...item.childNodes][0].key;
+  getFirstKey() {
+    return this.collection.getFirstKey();
   }
 
+  getLastKey() {
+    return this.collection.getLastKey();
+  }
+  
   getKeyRightOf(key: Key) {
     return this.direction === 'rtl' ? this.getKeyAbove(key) : this.getKeyBelow(key);
   }
@@ -43,27 +44,12 @@ export class TagKeyboardDelegate<T> extends GridKeyboardDelegate<T, GridCollecti
       return;
     }
 
-    // If focus was on a cell, start searching from the parent row
-    if (this.isCell(startItem)) {
-      key = startItem.parentKey;
-    }
-
     // Find the next item
-    key = this.findNextKey(key);
+    key = this.collection.getKeyAfter(key);
     if (key != null) {
-      // If focus was on a cell, focus the cell with the same index in the next row.
-      if (this.isCell(startItem)) {
-        let item = this.collection.getItem(key);
-
-        return [...item.childNodes][startItem.index].key;
-      }
-
-      // Otherwise, focus the next row
-      if (this.focusMode === 'row') {
-        return key;
-      }
+      return key;
     } else {
-      return this.getFirstKey();
+      return this.collection.getFirstKey();
     }
   }
 
@@ -73,26 +59,12 @@ export class TagKeyboardDelegate<T> extends GridKeyboardDelegate<T, GridCollecti
       return;
     }
 
-    // If focus is on a cell, start searching from the parent row
-    if (this.isCell(startItem)) {
-      key = startItem.parentKey;
-    }
-
     // Find the previous item
-    key = this.findPreviousKey(key);
+    key = this.collection.getKeyBefore(key);
     if (key != null) {
-      // If focus was on a cell, focus the cell with the same index in the previous row.
-      if (this.isCell(startItem)) {
-        let item = this.collection.getItem(key);
-        return [...item.childNodes][startItem.index].key;
-      }
-
-      // Otherwise, focus the previous row
-      if (this.focusMode === 'row') {
-        return key;
-      }
+      return key;
     } else {
-      return this.getLastKey();
+      return this.collection.getLastKey();
     }
   }
 
diff --git a/packages/@react-aria/tag/src/index.ts b/packages/@react-aria/tag/src/index.ts
index cf3885d4e84..d7d10b431ff 100644
--- a/packages/@react-aria/tag/src/index.ts
+++ b/packages/@react-aria/tag/src/index.ts
@@ -15,5 +15,5 @@ export {useTag} from './useTag';
 export {useTagGroup} from './useTagGroup';
 
 export type {TagProps} from '@react-types/tag';
-export type {AriaTagGroupProps, TagGroupAria} from './useTagGroup';
+export type {TagGroupAria} from './useTagGroup';
 export type {TagAria} from './useTag';
diff --git a/packages/@react-aria/tag/src/useTag.ts b/packages/@react-aria/tag/src/useTag.ts
index 3e431c90448..a3b1610d751 100644
--- a/packages/@react-aria/tag/src/useTag.ts
+++ b/packages/@react-aria/tag/src/useTag.ts
@@ -10,14 +10,15 @@
  * governing permissions and limitations under the License.
  */
 
-import {ButtonHTMLAttributes, KeyboardEvent} from 'react';
+import {AriaButtonProps} from '@react-types/button';
+import {chain, filterDOMProps, mergeProps, useId} from '@react-aria/utils';
 import {DOMAttributes} from '@react-types/shared';
-import {filterDOMProps, mergeProps, useId} from '@react-aria/utils';
-import {GridState} from '@react-stately/grid';
 // @ts-ignore
 import intlMessages from '../intl/*.json';
+import {KeyboardEvent} from 'react';
+import type {TagGroupState} from '@react-stately/tag';
 import {TagProps} from '@react-types/tag';
-import {useGridCell, useGridRow} from '@react-aria/grid';
+import {useGridListItem} from '@react-aria/gridlist';
 import {useLocalizedStringFormatter} from '@react-aria/i18n';
 
 
@@ -25,62 +26,62 @@ export interface TagAria {
   labelProps: DOMAttributes,
   tagProps: DOMAttributes,
   tagRowProps: DOMAttributes,
-  clearButtonProps: ButtonHTMLAttributes<HTMLButtonElement>
+  clearButtonProps: AriaButtonProps
 }
 
-export function useTag(props: TagProps<any>, state: GridState<any, any>): TagAria {
-  let {isFocused} = props;
-  const {
+/**
+ * Provides the behavior and accessibility implementation for a tag component.
+ * @param props - Props to be applied to the tag.
+ * @param state - State for the tag group, as returned by `useTagGroupState`.
+ */
+export function useTag<T>(props: TagProps<T>, state: TagGroupState<T>): TagAria {
+  let {
+    isFocused,
     allowsRemoving,
-    onRemove,
     item,
-    tagRef,
     tagRowRef
   } = props;
-  const stringFormatter = useLocalizedStringFormatter(intlMessages);
-  const removeString = stringFormatter.format('remove');
-  const labelId = useId();
-  const buttonId = useId();
+  let stringFormatter = useLocalizedStringFormatter(intlMessages);
+  let removeString = stringFormatter.format('remove');
+  let labelId = useId();
+  let buttonId = useId();
 
-  let {rowProps} = useGridRow({
+  let {rowProps, gridCellProps} = useGridListItem({
     node: item
   }, state, tagRowRef);
-  // Don't want the row to be focusable or accessible via keyboard
-  // eslint-disable-next-line @typescript-eslint/no-unused-vars
-  let {tabIndex, ...otherRowProps} = rowProps;
 
-  let {gridCellProps} = useGridCell({
-    node: [...item.childNodes][0],
-    focusMode: 'cell'
-  }, state, tagRef);
+  // We want the group to handle keyboard navigation between tags.
+  delete rowProps.onKeyDownCapture;
+
+  let onRemove = chain(props.onRemove, state.onRemove);
 
-  function onKeyDown(e: KeyboardEvent) {
+  let onKeyDown = (e: KeyboardEvent) => {
     if (e.key === 'Delete' || e.key === 'Backspace' || e.key === ' ') {
-      onRemove(item.childNodes[0].key);
+      onRemove(item.key);
       e.preventDefault();
     }
-  }
-  const pressProps = {
-    onPress: () => onRemove?.(item.childNodes[0].key)
   };
 
-  isFocused = isFocused || state.selectionManager.focusedKey === item.childNodes[0].key;
+  isFocused = isFocused || state.selectionManager.focusedKey === item.key;
   let domProps = filterDOMProps(props);
   return {
-    clearButtonProps: mergeProps(pressProps, {
+    clearButtonProps: {
       'aria-label': removeString,
       'aria-labelledby': `${buttonId} ${labelId}`,
-      id: buttonId
-    }),
+      id: buttonId,
+      onPress: () => allowsRemoving && onRemove ? onRemove(item.key) : null
+    },
     labelProps: {
       id: labelId
     },
-    tagRowProps: otherRowProps,
+    tagRowProps: {
+      ...rowProps,
+      tabIndex: (isFocused || state.selectionManager.focusedKey == null) ? 0 : -1,
+      onKeyDown: allowsRemoving ? onKeyDown : null
+    },
     tagProps: mergeProps(domProps, gridCellProps, {
       'aria-errormessage': props['aria-errormessage'],
-      'aria-label': props['aria-label'],
-      onKeyDown: allowsRemoving ? onKeyDown : null,
-      tabIndex: (isFocused || state.selectionManager.focusedKey == null) ? 0 : -1
+      'aria-label': props['aria-label']
     })
   };
 }
diff --git a/packages/@react-aria/tag/src/useTagGroup.ts b/packages/@react-aria/tag/src/useTagGroup.ts
index c6ca99cefe0..8c94126cc72 100644
--- a/packages/@react-aria/tag/src/useTagGroup.ts
+++ b/packages/@react-aria/tag/src/useTagGroup.ts
@@ -10,29 +10,43 @@
  * governing permissions and limitations under the License.
  */
 
-import {DOMAttributes, DOMProps} from '@react-types/shared';
+import {AriaTagGroupProps} from '@react-types/tag';
+import {DOMAttributes} from '@react-types/shared';
 import {filterDOMProps, mergeProps} from '@react-aria/utils';
-import {ReactNode, useState} from 'react';
+import {RefObject, useState} from 'react';
+import type {TagGroupState} from '@react-stately/tag';
+import {TagKeyboardDelegate} from './TagKeyboardDelegate';
 import {useFocusWithin} from '@react-aria/interactions';
-
-export interface AriaTagGroupProps extends DOMProps {
-  children: ReactNode,
-  isReadOnly?: boolean, // removes close button
-  validationState?: 'valid' | 'invalid'
-}
+import {useGridList} from '@react-aria/gridlist';
+import {useLocale} from '@react-aria/i18n';
 
 export interface TagGroupAria {
   tagGroupProps: DOMAttributes
 }
 
-export function useTagGroup(props: AriaTagGroupProps): TagGroupAria {
+/**
+ * Provides the behavior and accessibility implementation for a tag group component.
+ * Tags allow users to categorize content. They can represent keywords or people, and are grouped to describe an item or a search request.
+ * @param props - Props to be applied to the tag group.
+ * @param state - State for the tag group, as returned by `useTagGroupState`.
+ * @param ref - A ref to a DOM element for the tag group.
+ */
+export function useTagGroup<T>(props: AriaTagGroupProps<T>, state: TagGroupState<T>, ref: RefObject<HTMLElement>): TagGroupAria {
+  let {direction} = useLocale();
+  let keyboardDelegate = new TagKeyboardDelegate(state.collection, direction);
+  let {gridProps} = useGridList({...props, keyboardDelegate}, state, ref);
+
+  // Don't want the grid to be focusable or accessible via keyboard
+  delete gridProps.role;
+  delete gridProps.tabIndex;
+
   let [isFocusWithin, setFocusWithin] = useState(false);
   let {focusWithinProps} = useFocusWithin({
     onFocusWithinChange: setFocusWithin
   });
   let domProps = filterDOMProps(props);
   return {
-    tagGroupProps: mergeProps(domProps, {
+    tagGroupProps: mergeProps(gridProps, domProps, {
       'aria-atomic': false,
       'aria-relevant': 'additions',
       'aria-live': isFocusWithin ? 'polite' : 'off',
diff --git a/packages/@react-spectrum/tag/package.json b/packages/@react-spectrum/tag/package.json
index d37d97d5a13..03a1ff08d9a 100644
--- a/packages/@react-spectrum/tag/package.json
+++ b/packages/@react-spectrum/tag/package.json
@@ -32,8 +32,6 @@
   },
   "dependencies": {
     "@react-aria/focus": "^3.10.1",
-    "@react-aria/grid": "^3.5.2",
-    "@react-aria/i18n": "^3.6.3",
     "@react-aria/interactions": "^3.13.1",
     "@react-aria/tag": "3.0.0-beta.1",
     "@react-aria/utils": "^3.14.2",
@@ -41,11 +39,9 @@
     "@react-spectrum/text": "^3.3.4",
     "@react-spectrum/utils": "^3.8.1",
     "@react-stately/collections": "^3.5.1",
-    "@react-stately/grid": "^3.4.2",
-    "@react-stately/list": "^3.6.1",
+    "@react-stately/tag": "3.0.0-alpha.1",
     "@react-types/shared": "^3.16.0",
     "@react-types/tag": "3.0.0-beta.1",
-    "@spectrum-icons/workflow": "^4.0.6",
     "@swc/helpers": "^0.4.14"
   },
   "devDependencies": {
diff --git a/packages/@react-spectrum/tag/src/Tag.tsx b/packages/@react-spectrum/tag/src/Tag.tsx
index 9f5f880cc2b..e8c8579cec3 100644
--- a/packages/@react-spectrum/tag/src/Tag.tsx
+++ b/packages/@react-spectrum/tag/src/Tag.tsx
@@ -10,17 +10,22 @@
  * governing permissions and limitations under the License.
  */
 
-import {classNames, SlotProvider, useSlotProps, useStyleProps} from '@react-spectrum/utils';
+import {classNames, ClearSlots, SlotProvider, useStyleProps} from '@react-spectrum/utils';
 import {ClearButton} from '@react-spectrum/button';
 import {mergeProps} from '@react-aria/utils';
 import React, {useRef} from 'react';
-import {SpectrumTagProps} from '@react-types/tag';
 import styles from '@adobe/spectrum-css-temp/components/tags/vars.css';
+import type {TagGroupState} from '@react-stately/tag';
+import {TagProps} from '@react-types/tag';
 import {Text} from '@react-spectrum/text';
 import {useFocusRing} from '@react-aria/focus';
 import {useHover} from '@react-aria/interactions';
 import {useTag} from '@react-aria/tag';
 
+export interface SpectrumTagProps<T> extends TagProps<T> {
+  state: TagGroupState<T>
+}
+
 export function Tag<T>(props: SpectrumTagProps<T>) {
   const {
     children,
@@ -35,7 +40,6 @@ export function Tag<T>(props: SpectrumTagProps<T>) {
   let {styleProps} = useStyleProps(otherProps);
   let {hoverProps, isHovered} = useHover({});
   let {isFocused, isFocusVisible, focusProps} = useFocusRing({within: true});
-  let tagRef = useRef();
   let tagRowRef = useRef();
   let {clearButtonProps, labelProps, tagProps, tagRowProps} = useTag({
     ...props,
@@ -43,35 +47,36 @@ export function Tag<T>(props: SpectrumTagProps<T>) {
     allowsRemoving,
     item,
     onRemove,
-    tagRef,
     tagRowRef
   }, state);
 
   return (
     <div
-      {...tagRowProps}
-      ref={tagRowRef}>
-      <div
-        {...mergeProps(tagProps, hoverProps, focusProps)}
-        className={classNames(
+      {...mergeProps(tagRowProps, hoverProps, focusProps)}
+      className={classNames(
           styles,
           'spectrum-Tags-item',
-          {
-            'focus-ring': isFocusVisible,
-            'is-focused': isFocused,
-            'is-hovered': isHovered
-          },
+        {
+          'focus-ring': isFocusVisible,
+          'is-focused': isFocused,
+          'is-hovered': isHovered,
+          'is-removable': allowsRemoving
+        },
           styleProps.className
         )}
-        ref={tagRef}>
+      ref={tagRowRef}>
+      <div
+        className={classNames(styles, 'spectrum-Tag-cell')}
+        {...tagProps}>
         <SlotProvider
           slots={{
             icon: {UNSAFE_className: classNames(styles, 'spectrum-Tag-icon'), size: 'XS'},
-            text: {UNSAFE_className: classNames(styles, 'spectrum-Tag-content', {'tags-removable': allowsRemoving}), ...labelProps}
+            text: {UNSAFE_className: classNames(styles, 'spectrum-Tag-content'), ...labelProps}
           }}>
-
           {typeof children === 'string' ? <Text>{children}</Text> : children}
-          {allowsRemoving && <TagRemoveButton item={item} {...clearButtonProps} UNSAFE_className={classNames(styles, 'spectrum-Tag-action')} />}
+          <ClearSlots>
+            {allowsRemoving && <TagRemoveButton item={item} {...clearButtonProps} UNSAFE_className={classNames(styles, 'spectrum-Tag-action')} />}
+          </ClearSlots>
         </SlotProvider>
       </div>
     </div>
@@ -79,14 +84,11 @@ export function Tag<T>(props: SpectrumTagProps<T>) {
 }
 
 function TagRemoveButton(props) {
-  props = useSlotProps(props, 'tagRemoveButton');
   let {styleProps} = useStyleProps(props);
-  let clearBtnRef = useRef();
 
   return (
     <span
-      {...styleProps}
-      ref={clearBtnRef}>
+      {...styleProps}>
       <ClearButton
         preventFocus
         {...props} />
diff --git a/packages/@react-spectrum/tag/src/TagGroup.tsx b/packages/@react-spectrum/tag/src/TagGroup.tsx
index 29b6df9ee21..d3f1fe0834b 100644
--- a/packages/@react-spectrum/tag/src/TagGroup.tsx
+++ b/packages/@react-spectrum/tag/src/TagGroup.tsx
@@ -12,18 +12,14 @@
 
 import {classNames, useDOMRef, useStyleProps} from '@react-spectrum/utils';
 import {DOMRef} from '@react-types/shared';
-import {GridCollection, useGridState} from '@react-stately/grid';
 import {mergeProps} from '@react-aria/utils';
-import React, {ReactElement, useMemo} from 'react';
+import React, {ReactElement} from 'react';
 import {SpectrumTagGroupProps} from '@react-types/tag';
 import styles from '@adobe/spectrum-css-temp/components/tags/vars.css';
 import {Tag} from './Tag';
-import {TagKeyboardDelegate, useTagGroup} from '@react-aria/tag';
-import {useGrid} from '@react-aria/grid';
-import {useListState} from '@react-stately/list';
-import {useLocale} from '@react-aria/i18n';
 import {useProviderProps} from '@react-spectrum/provider';
-
+import {useTagGroup} from '@react-aria/tag';
+import {useTagGroupState} from '@react-stately/tag';
 
 function TagGroup<T extends object>(props: SpectrumTagGroupProps<T>, ref: DOMRef<HTMLDivElement>) {
   props = useProviderProps(props);
@@ -34,48 +30,11 @@ function TagGroup<T extends object>(props: SpectrumTagGroupProps<T>, ref: DOMRef
   } = props;
   let domRef = useDOMRef(ref);
   let {styleProps} = useStyleProps(otherProps);
-  let {direction} = useLocale();
-  let listState = useListState(props);
-  let gridCollection = useMemo(() => new GridCollection({
-    columnCount: 1, // unused, but required for grid collections
-    items: [...listState.collection].map(item => {
-      let childNodes = [{
-        ...item,
-        index: 0,
-        type: 'cell'
-      }];
-
-      return {
-        type: 'item',
-        childNodes
-      };
-    })
-  // eslint-disable-next-line react-hooks/exhaustive-deps
-  }), [listState.collection, allowsRemoving]);
-  let state = useGridState({
-    ...props,
-    collection: gridCollection,
-    focusMode: 'cell'
-  });
-  let keyboardDelegate = new TagKeyboardDelegate({
-    collection: state.collection,
-    disabledKeys: new Set(),
-    ref: domRef,
-    direction,
-    focusMode: 'cell'
-  });
-  let {gridProps} = useGrid({
-    ...props,
-    keyboardDelegate
-  }, state, domRef);
-  const {tagGroupProps} = useTagGroup(props);
-
-  // Don't want the grid to be focusable or accessible via keyboard
-  // eslint-disable-next-line @typescript-eslint/no-unused-vars
-  let {tabIndex, role, ...otherGridProps} = gridProps;
+  let state = useTagGroupState(props);
+  let {tagGroupProps} = useTagGroup(props, state, domRef);
   return (
     <div
-      {...mergeProps(styleProps, tagGroupProps, otherGridProps)}
+      {...mergeProps(styleProps, tagGroupProps)}
       className={
         classNames(
           styles,
@@ -85,17 +44,17 @@ function TagGroup<T extends object>(props: SpectrumTagGroupProps<T>, ref: DOMRef
       }
       role={state.collection.size ? 'grid' : null}
       ref={domRef}>
-      {[...gridCollection].map(item => (
+      {[...state.collection].map(item => (
         <Tag
-          {...item.childNodes[0].props}
+          {...item.props}
           key={item.key}
           item={item}
           state={state}
           allowsRemoving={allowsRemoving}
           onRemove={onRemove}>
-          {item.childNodes[0].rendered}
+          {item.rendered}
         </Tag>
-        ))}
+      ))}
     </div>
   );
 }
diff --git a/packages/@react-spectrum/tag/stories/TagGroup.stories.tsx b/packages/@react-spectrum/tag/stories/TagGroup.stories.tsx
index 6974b152867..84df182a7b7 100644
--- a/packages/@react-spectrum/tag/stories/TagGroup.stories.tsx
+++ b/packages/@react-spectrum/tag/stories/TagGroup.stories.tsx
@@ -10,26 +10,24 @@
  * governing permissions and limitations under the License.
  */
 
-import {action} from '@storybook/addon-actions';
 import Audio from '@spectrum-icons/workflow/Audio';
-import {Icon} from '@react-spectrum/icon';
 import {Item, TagGroup} from '../src';
 import React, {useState} from 'react';
 import {storiesOf} from '@storybook/react';
 import {Text} from '@react-spectrum/text';
 
+let items = [{key: '1', label: 'Cool Tag 1'}, {key: '2', label: 'Cool Tag 2'}];
+
 storiesOf('TagGroup', module)
   .add(
     'default',
     () => render({})
   )
   .add('icons', () => (
-    <TagGroup aria-label="tag group" items={[{key: '1', label: 'Cool Tag 1'}, {key: '2', label: 'Cool Tag 2'}]}>
+    <TagGroup aria-label="Tag group with icons" items={items}>
       {item => (
         <Item key={item.key} textValue={item.label}>
-          <Icon>
-            <Audio />
-          </Icon>
+          <Audio />
           <Text>{item.label}</Text>
         </Item>
       )}
@@ -38,30 +36,29 @@ storiesOf('TagGroup', module)
   .add(
     'onRemove',
     () => {
-      const [items, setItems] = useState([
-        {key: 1, label: 'Cool Tag 1'},
-        {key: 2, label: 'Another cool tag'},
-        {key: 3, label: 'This tag'},
-        {key: 4, label: 'What tag?'},
-        {key: 5, label: 'This tag is cool too'},
-        {key: 6, label: 'Shy tag'}
+      let [items, setItems] = useState([
+        {id: 1, label: 'Cool Tag 1'},
+        {id: 2, label: 'Another cool tag'},
+        {id: 3, label: 'This tag'},
+        {id: 4, label: 'What tag?'},
+        {id: 5, label: 'This tag is cool too'},
+        {id: 6, label: 'Shy tag'}
       ]);
-      const onRemove = (key) => {
-        const newItems = [...items].filter((item) => key !== item.key.toString());
-        setItems(newItems);
-        action('onRemove')(key);
+
+      let removeItem = (key) => {
+        setItems(prevItems => prevItems.filter((item) => key !== item.id));
       };
 
-      return (<TagGroup allowsRemoving aria-label="tag group" items={items} onRemove={key => onRemove(key)}>
-        {item => (
-          <Item key={item.key}>{item.label}</Item>
-        )}
-      </TagGroup>);
+      return (
+        <TagGroup allowsRemoving aria-label="Tag group with removable tags" items={items} onRemove={removeItem}>
+          {item => <Item>{item.label}</Item>}
+        </TagGroup>
+      );
     }
   )
   .add('wrapping', () => (
     <div style={{width: '200px'}}>
-      <TagGroup aria-label="tag group">
+      <TagGroup aria-label="Tag group with wrapping">
         <Item key="1">Cool Tag 1</Item>
         <Item key="2">Another cool tag</Item>
         <Item key="3">This tag</Item>
@@ -74,7 +71,7 @@ storiesOf('TagGroup', module)
   )
   .add('label truncation', () => (
     <div style={{width: '100px'}}>
-      <TagGroup aria-label="tag group">
+      <TagGroup aria-label="Tag group with label truncation">
         <Item key="1">Cool Tag 1 with a really long label</Item>
         <Item key="2">Another long cool tag label</Item>
         <Item key="3">This tag</Item>
@@ -83,19 +80,17 @@ storiesOf('TagGroup', module)
     )
   )
   .add(
-    'using items prop',
+    'dynamic items',
     () => (
-      <TagGroup aria-label="tag group" items={[{key: '1', label: 'Cool Tag 1'}, {key: '2', label: 'Cool Tag 2'}]}>
-        {item =>
-          <Item key={item.key} textValue={item.label}><Text>{item.label}</Text></Item>
-        }
+      <TagGroup aria-label="Tag group with dynamic items" items={items}>
+        {item => <Item key={item.key} textValue={item.label}><Text>{item.label}</Text></Item>}
       </TagGroup>
     )
   );
 
 function render(props: any = {}) {
   return (
-    <TagGroup {...props} aria-label="tag group">
+    <TagGroup {...props} aria-label="Tag group">
       <Item key="1">Cool Tag 1</Item>
       <Item key="2">Cool Tag 2</Item>
       <Item key="3">Cool Tag 3</Item>
diff --git a/packages/@react-spectrum/tag/test/TagGroup.test.js b/packages/@react-spectrum/tag/test/TagGroup.test.js
index 37335c931ca..d5bfdf1dcca 100644
--- a/packages/@react-spectrum/tag/test/TagGroup.test.js
+++ b/packages/@react-spectrum/tag/test/TagGroup.test.js
@@ -10,8 +10,9 @@
  * governing permissions and limitations under the License.
  */
 
-import {act, fireEvent, render} from '@react-spectrum/test-utils';
+import {act, fireEvent, render, triggerPress, within} from '@react-spectrum/test-utils';
 import {Button} from '@react-spectrum/button';
+import {chain} from '@react-aria/utils';
 import {Item} from '@react-stately/collections';
 import {Provider} from '@react-spectrum/provider';
 import React from 'react';
@@ -22,6 +23,7 @@ import userEvent from '@testing-library/user-event';
 function pressKeyOnButton(key) {
   return (button) => {
     fireEvent.keyDown(button, {key});
+    fireEvent.keyUp(button, {key});
   };
 }
 
@@ -55,7 +57,7 @@ describe('TagGroup', function () {
   });
 
   it('provides context for Tag component', function () {
-    let {container} = render(
+    let {getAllByRole} = render(
       <TagGroup aria-label="tag group" allowsRemoving onRemove={onRemoveSpy}>
         <Item aria-label="Tag 1">Tag 1</Item>
         <Item aria-label="Tag 2">Tag 2</Item>
@@ -63,25 +65,26 @@ describe('TagGroup', function () {
       </TagGroup>
     );
 
-    let tags = container.querySelectorAll('[role="gridcell"]');
+    let tags = getAllByRole('row');
     expect(tags.length).toBe(3);
 
     fireEvent.keyDown(tags[1], {key: 'Delete'});
+    fireEvent.keyUp(tags[1], {key: 'Delete'});
     expect(onRemoveSpy).toHaveBeenCalledTimes(1);
   });
 
   it('has correct accessibility roles', () => {
-    let tree = render(
+    let {getByRole, getAllByRole} = render(
       <TagGroup
         aria-label="tag group">
         <Item aria-label="Tag 1">Tag 1</Item>
       </TagGroup>
     );
 
-    let tagGroup = tree.getByRole('grid');
+    let tagGroup = getByRole('grid');
     expect(tagGroup).toBeInTheDocument();
-    let tags = tree.getAllByRole('row');
-    let cells = tree.getAllByRole('gridcell');
+    let tags = getAllByRole('row');
+    let cells = getAllByRole('gridcell');
     expect(tags).toHaveLength(cells.length);
   });
 
@@ -93,7 +96,7 @@ describe('TagGroup', function () {
       </TagGroup>
     );
 
-    let tags = getAllByRole('gridcell');
+    let tags = getAllByRole('row');
     expect(tags[0]).toHaveAttribute('tabIndex', '0');
   });
 
@@ -104,7 +107,7 @@ describe('TagGroup', function () {
     ${'(up/down arrows, ltr + horizontal) TagGroup'}    | ${{locale: 'de-DE'}}                          | ${[{action: () => {userEvent.tab();}, index: 0}, {action: pressArrowDown, index: 1}, {action: pressArrowUp, index: 0}, {action: pressArrowUp, index: 2}]}
     ${'(up/down arrows, rtl + horizontal) TagGroup'}    | ${{locale: 'ar-AE'}}                          | ${[{action: () => {userEvent.tab();}, index: 0}, {action: pressArrowUp, index: 2}, {action: pressArrowDown, index: 0}, {action: pressArrowDown, index: 1}]}
   `('$Name shifts button focus in the correct direction on key press', function ({Name, props, orders}) {
-    let tree = render(
+    let {getAllByRole} = render(
       <Provider theme={theme} locale={props.locale}>
         <TagGroup aria-label="tag group">
           <Item key="1" aria-label="Tag 1">Tag 1</Item>
@@ -114,7 +117,7 @@ describe('TagGroup', function () {
       </Provider>
     );
 
-    let tags = tree.getAllByRole('gridcell');
+    let tags = getAllByRole('row');
     orders.forEach(({action, index}, i) => {
       action(document.activeElement);
       expect(document.activeElement).toBe(tags[index]);
@@ -172,7 +175,7 @@ describe('TagGroup', function () {
 
     let buttonBefore = getByLabelText('ButtonBefore');
     let buttonAfter = getByLabelText('ButtonAfter');
-    let tags = getAllByRole('gridcell');
+    let tags = getAllByRole('row');
     act(() => {buttonBefore.focus();});
 
     userEvent.tab();
@@ -202,7 +205,7 @@ describe('TagGroup', function () {
 
     let buttonBefore = getByLabelText('ButtonBefore');
     let buttonAfter = getByLabelText('ButtonAfter');
-    let tags = getAllByRole('gridcell');
+    let tags = getAllByRole('row');
     act(() => {buttonBefore.focus();});
     expect(buttonBefore).toHaveFocus();
     userEvent.tab();
@@ -225,7 +228,7 @@ describe('TagGroup', function () {
 
     let buttonBefore = getByLabelText('ButtonBefore');
     let buttonAfter = getByLabelText('ButtonAfter');
-    let tags = getAllByRole('gridcell');
+    let tags = getAllByRole('row');
     act(() => {buttonAfter.focus();});
     userEvent.tab({shift: true});
     expect(document.activeElement).toBe(tags[1]);
@@ -244,13 +247,12 @@ describe('TagGroup', function () {
     );
 
     let tagGroup = getByRole('grid');
-    let tagRow = tagGroup.children[0];
-    let tag = tagRow.children[0];
+    let tag = tagGroup.children[0];
     expect(tag).not.toHaveAttribute('icon');
     expect(tag).not.toHaveAttribute('unsafe_classname');
     expect(tag).toHaveAttribute('class', expect.stringContaining('test-class'));
     expect(tag).toHaveAttribute('class', expect.stringContaining('-item'));
-    expect(tag).toHaveAttribute('role', 'gridcell');
+    expect(tag).toHaveAttribute('role', 'row');
     expect(tag).toHaveAttribute('tabIndex', '0');
   });
 
@@ -260,22 +262,49 @@ describe('TagGroup', function () {
         <TagGroup aria-label="tag group">
           <Item key="1" aria-label="Tag 1">Tag 1</Item>
           <Item key="2" aria-label="Tag 2">Tag 2</Item>
+          <Item key="3" aria-label="Tag 3">Tag 3</Item>
+          <Item key="4" aria-label="Tag 4">Tag 4</Item>
         </TagGroup>
       </Provider>
     );
 
-    let tags = getAllByRole('gridcell');
-    expect(tags.length).toBe(2);
+    let tags = getAllByRole('row');
+    expect(tags.length).toBe(4);
     expect(tags[0]).toHaveAttribute('tabIndex', '0');
     expect(tags[1]).toHaveAttribute('tabIndex', '0');
+    expect(tags[2]).toHaveAttribute('tabIndex', '0');
+    expect(tags[3]).toHaveAttribute('tabIndex', '0');
 
-    act(() => tags[0].focus());
+    userEvent.tab();
     expect(tags[0]).toHaveAttribute('tabIndex', '0');
     expect(tags[1]).toHaveAttribute('tabIndex', '-1');
+    expect(tags[2]).toHaveAttribute('tabIndex', '-1');
+    expect(tags[3]).toHaveAttribute('tabIndex', '-1');
+    expect(document.activeElement).toBe(tags[0]);
 
-    pressArrowRight(tags[0]);
-    expect(tags[0]).toHaveAttribute('tabIndex', '-1');
-    expect(tags[1]).toHaveAttribute('tabIndex', '0');
+    fireEvent.keyDown(document.activeElement, {key: 'ArrowRight'});
+    fireEvent.keyUp(document.activeElement, {key: 'ArrowRight'});
+    expect(document.activeElement).toBe(tags[1]);
+    
+    fireEvent.keyDown(document.activeElement, {key: 'ArrowLeft'});
+    fireEvent.keyUp(document.activeElement, {key: 'ArrowLeft'});
+    expect(document.activeElement).toBe(tags[0]);
+
+    fireEvent.keyDown(document.activeElement, {key: 'End'});
+    fireEvent.keyUp(document.activeElement, {key: 'End'});
+    expect(document.activeElement).toBe(tags[3]);
+
+    fireEvent.keyDown(document.activeElement, {key: 'Home'});
+    fireEvent.keyUp(document.activeElement, {key: 'Home'});
+    expect(document.activeElement).toBe(tags[0]);
+
+    fireEvent.keyDown(document.activeElement, {key: 'PageDown'});
+    fireEvent.keyUp(document.activeElement, {key: 'PageDown'});
+    expect(document.activeElement).toBe(tags[1]);
+
+    fireEvent.keyDown(document.activeElement, {key: 'PageUp'});
+    fireEvent.keyUp(document.activeElement, {key: 'PageUp'});
+    expect(document.activeElement).toBe(tags[0]);
   });
 
   it.each`
@@ -296,44 +325,76 @@ describe('TagGroup', function () {
 
     let tag = getByText('Tag 1');
     fireEvent.keyDown(tag, {key: props.keyPress});
+    fireEvent.keyUp(tag, {key: props.keyPress});
+    expect(onRemoveSpy).toHaveBeenCalledTimes(1);
+    expect(onRemoveSpy).toHaveBeenCalledWith('1');
+  });
+
+  it('should remove tag when remove button is clicked', function () {
+    let {getAllByRole} = render(
+      <Provider theme={theme}>
+        <TagGroup aria-label="tag group" allowsRemoving onRemove={onRemoveSpy}>
+          <Item key="1" aria-label="Tag 1">Tag 1</Item>
+          <Item key="2" aria-label="Tag 2">Tag 2</Item>
+          <Item key="3" aria-label="Tag 3">Tag 3</Item>
+        </TagGroup>
+      </Provider>
+    );
+
+    let tags = getAllByRole('row');
+    triggerPress(tags[0]);
+    expect(onRemoveSpy).not.toHaveBeenCalled();
+
+    let removeButton = within(tags[0]).getByRole('button');
+    triggerPress(removeButton);
+    expect(onRemoveSpy).toHaveBeenCalledTimes(1);
     expect(onRemoveSpy).toHaveBeenCalledWith('1');
   });
 
+  it.each`
+    Name                         | props
+    ${'on `Delete` keypress'}    | ${{keyPress: 'Delete'}}
+    ${'on `Backspace` keypress'} | ${{keyPress: 'Backspace'}}
+    ${'on `space` keypress'}     | ${{keyPress: ' '}}
+  `('Can move focus after removing tag $Name', function ({Name, props}) {
+
+    function TagGroupWithDelete(props) {
+      let [items, setItems] = React.useState([
+        {id: 1, label: 'Cool Tag 1'},
+        {id: 2, label: 'Another cool tag'},
+        {id: 3, label: 'This tag'},
+        {id: 4, label: 'What tag?'},
+        {id: 5, label: 'This tag is cool too'},
+        {id: 6, label: 'Shy tag'}
+      ]);
+
+      let removeItem = (key) => {
+        setItems(prevItems => prevItems.filter((item) => key !== item.id));
+      };
+    
+      return (
+        <Provider theme={theme}>
+          <TagGroup items={items} aria-label="tag group" allowsRemoving onRemove={chain(removeItem, onRemoveSpy)} {...props}>
+            {item => <Item>{item.label}</Item>}
+          </TagGroup>
+        </Provider>
+      );
+    }
+      
+    let {getAllByRole} = render(
+      <TagGroupWithDelete {...props} />
+    );
 
-  // Commented out until spectrum can provide use case for these scenarios
-  // it.each`
-  //  Name           | Component     | TagComponent | props
-  //  ${'TagGroup'}  | ${TagGroup}   | ${Item}       | ${{isReadOnly: true, isRemovable: true, onRemove: onRemoveSpy}}
-  // `('$Name is read only', ({Component, TagComponent, props}) => {
-  //   let {getByText} = render(
-  //     <Component
-  //       {...props}
-  //       aria-label="tag group">
-  //       <TagComponent aria-label="Tag 1">Tag 1</TagComponent>
-  //     </Component>
-  //   );
-  //   let tag = getByText('Tag 1');
-  //   fireEvent.keyDown(tag, {key: 'Delete', keyCode: 46});
-  //   expect(onRemoveSpy).not.toHaveBeenCalledWith('Tag 1', expect.anything());
-  // });
-  //
-  // it.each`
-  //  Name          | Component         | TagComponent     | props
-  //  ${'Tag'}      | ${TagGroup}       | ${Item}          | ${{validationState: 'invalid'}}
-  // `('$Name can be invalid', function ({Component, TagComponent, props}) {
-  //   let {getByRole, debug} = render(
-  //     <Component
-  //       {...props}
-  //       aria-label="tag group">
-  //       <TagComponent aria-label="Tag 1">Tag 1</TagComponent>
-  //     </Component>
-  //   );
-  //
-  //   debug();
-  //
-  //   let tag = getByRole('row');
-  //   expect(tag).toHaveAttribute('aria-invalid', 'true');
-  // });
+    let tags = getAllByRole('row');
+    userEvent.tab();
+    expect(document.activeElement).toBe(tags[0]);
+    fireEvent.keyDown(document.activeElement, {key: props.keyPress});
+    fireEvent.keyUp(document.activeElement, {key: props.keyPress});
+    expect(onRemoveSpy).toHaveBeenCalledTimes(1);
+    expect(onRemoveSpy).toHaveBeenCalledWith(1);
+    tags = getAllByRole('row');
+    expect(document.activeElement).toBe(tags[0]);
+    pressArrowRight(tags[0]);
+    expect(document.activeElement).toBe(tags[1]);
+  });
 });
-
-// need to add test for focus after onremove
diff --git a/packages/@react-stately/tag/README.md b/packages/@react-stately/tag/README.md
new file mode 100644
index 00000000000..49c22e51ddb
--- /dev/null
+++ b/packages/@react-stately/tag/README.md
@@ -0,0 +1,3 @@
+# @react-stately/tag
+
+This package is part of [react-spectrum](https://github.com/adobe/react-spectrum). See the repo for more details.
diff --git a/packages/@react-stately/tag/index.ts b/packages/@react-stately/tag/index.ts
new file mode 100644
index 00000000000..4e9931530d8
--- /dev/null
+++ b/packages/@react-stately/tag/index.ts
@@ -0,0 +1,13 @@
+/*
+ * Copyright 2022 Adobe. All rights reserved.
+ * This file is licensed to you under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License. You may obtain a copy
+ * of the License at http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software distributed under
+ * the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
+ * OF ANY KIND, either express or implied. See the License for the specific language
+ * governing permissions and limitations under the License.
+ */
+
+export * from './src';
diff --git a/packages/@react-stately/tag/package.json b/packages/@react-stately/tag/package.json
new file mode 100644
index 00000000000..ce9b085151f
--- /dev/null
+++ b/packages/@react-stately/tag/package.json
@@ -0,0 +1,31 @@
+{
+  "name": "@react-stately/tag",
+  "version": "3.0.0-alpha.1",
+  "description": "Spectrum UI components in React",
+  "license": "Apache-2.0",
+  "main": "dist/main.js",
+  "module": "dist/module.js",
+  "types": "dist/types.d.ts",
+  "source": "src/index.ts",
+  "files": [
+    "dist",
+    "src"
+  ],
+  "sideEffects": false,
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/adobe/react-spectrum"
+  },
+  "dependencies": {
+    "@babel/runtime": "^7.6.2",
+    "@react-stately/list": "^3.6.0",
+    "@react-types/tag": "3.0.0-beta.1",
+    "@swc/helpers": "^0.4.14"
+  },
+  "peerDependencies": {
+    "react": "^16.8.0 || ^17.0.0-rc.1 || ^18.0.0"
+  },
+  "publishConfig": {
+    "access": "public"
+  }
+}
diff --git a/packages/@react-stately/tag/src/index.ts b/packages/@react-stately/tag/src/index.ts
new file mode 100644
index 00000000000..a01676123b2
--- /dev/null
+++ b/packages/@react-stately/tag/src/index.ts
@@ -0,0 +1,13 @@
+/*
+ * Copyright 2022 Adobe. All rights reserved.
+ * This file is licensed to you under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License. You may obtain a copy
+ * of the License at http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software distributed under
+ * the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
+ * OF ANY KIND, either express or implied. See the License for the specific language
+ * governing permissions and limitations under the License.
+ */
+
+export * from './useTagGroupState';
diff --git a/packages/@react-stately/tag/src/useTagGroupState.ts b/packages/@react-stately/tag/src/useTagGroupState.ts
new file mode 100644
index 00000000000..4d0663dc692
--- /dev/null
+++ b/packages/@react-stately/tag/src/useTagGroupState.ts
@@ -0,0 +1,37 @@
+/*
+ * Copyright 2022 Adobe. All rights reserved.
+ * This file is licensed to you under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License. You may obtain a copy
+ * of the License at http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software distributed under
+ * the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
+ * OF ANY KIND, either express or implied. See the License for the specific language
+ * governing permissions and limitations under the License.
+ */
+
+import {Key} from 'react';
+import {ListState, useListState} from '@react-stately/list';
+import {TagGroupProps} from '@react-types/tag';
+
+export interface TagGroupState<T> extends ListState<T>{
+  onRemove?: (key: Key) => void
+}
+
+/**
+ * Provides state management for a TagGroup component.
+ */
+export function useTagGroupState<T extends object>(props: TagGroupProps<T>): TagGroupState<T> {
+  let state = useListState(props);
+
+  let onRemove = (key) => {
+    // If a tag is removed, restore focus to the tag after, or tag before if no tag after.
+    let restoreKey = state.collection.getKeyAfter(key) || state.collection.getKeyBefore(key);
+    state.selectionManager.setFocusedKey(restoreKey);
+  };
+
+  return {
+    onRemove,
+    ...state
+  };
+}
diff --git a/packages/@react-types/list/package.json b/packages/@react-types/list/package.json
index 7bec3c04578..cdc6534b883 100644
--- a/packages/@react-types/list/package.json
+++ b/packages/@react-types/list/package.json
@@ -10,7 +10,8 @@
   },
   "dependencies": {
     "@react-aria/gridlist": "^3.1.2",
-    "@react-spectrum/list": "^3.2.2"
+    "@react-spectrum/list": "^3.2.2",
+    "@react-stately/list": "^3.6.1"
   },
   "peerDependencies": {
     "react": "^16.8.0 || ^17.0.0-rc.1 || ^18.0.0"
diff --git a/packages/@react-types/tag/package.json b/packages/@react-types/tag/package.json
index b56e4a6907c..c2ccd24b075 100644
--- a/packages/@react-types/tag/package.json
+++ b/packages/@react-types/tag/package.json
@@ -9,7 +9,6 @@
     "url": "https://github.com/adobe/react-spectrum"
   },
   "dependencies": {
-    "@react-stately/grid": "^3.4.2",
     "@react-types/shared": "^3.16.0"
   },
   "peerDependencies": {
diff --git a/packages/@react-types/tag/src/index.d.ts b/packages/@react-types/tag/src/index.d.ts
index 8c6aef4ac68..abf451cf028 100644
--- a/packages/@react-types/tag/src/index.d.ts
+++ b/packages/@react-types/tag/src/index.d.ts
@@ -11,7 +11,6 @@
  */
 
 import {AriaLabelingProps, CollectionBase, DOMProps, ItemProps, Node, StyleProps} from '@react-types/shared';
-import {GridState} from '@react-stately/grid';
 import {Key, RefObject} from 'react';
 
 export interface TagGroupProps<T> extends Omit<CollectionBase<T>, 'disabledKeys'> {
@@ -21,17 +20,14 @@ export interface TagGroupProps<T> extends Omit<CollectionBase<T>, 'disabledKeys'
   onRemove?: (key: Key) => void
 }
 
-export interface SpectrumTagGroupProps<T> extends TagGroupProps<T>, DOMProps, StyleProps, AriaLabelingProps {}
+export interface AriaTagGroupProps<T> extends TagGroupProps<T>, DOMProps, AriaLabelingProps {}
+
+export interface SpectrumTagGroupProps<T> extends AriaTagGroupProps<T>, StyleProps {}
 
 export interface TagProps<T> extends ItemProps<any> {
   isFocused: boolean,
   allowsRemoving?: boolean,
   item: Node<T>,
   onRemove?: (key: Key) => void,
-  tagRef: RefObject<HTMLElement>,
   tagRowRef: RefObject<HTMLElement>
 }
-
-interface SpectrumTagProps<T> extends TagProps<T> {
-  state: GridState<any, any>
-}