fix: remove custom keyboard handling example from ListBox docs and story

Author: hasegawa-101

packages/react-aria-components/docs/ListBox.mdx

@@ -409,47 +409,6 @@ By default, link items in a ListBox are not selectable, and only perform navigat
 
 The `<ListBoxItem>` component works with frameworks and client side routers like [Next.js](https://nextjs.org/) and [React Router](https://reactrouter.com/en/main). As with other React Aria components that support links, this works via the <TypeLink links={docs.links} type={docs.exports.RouterProvider} /> component at the root of your app. See the [client side routing guide](routing.html) to learn how to set this up.
 
-## Custom keyboard handling
-
-ListBox supports custom keyboard event handling on individual items via the `onKeyDown` prop on `ListBoxItem`. This enables you to implement additional keyboard interactions beyond the built-in selection and navigation behavior, such as deleting items with the <Keyboard>Backspace</Keyboard> or <Keyboard>Delete</Keyboard> keys.
-
-```tsx example
-import {useListData} from 'react-stately';
-import type {Key} from 'react-aria-components';
-
-function Example() {
-  let list = useListData({
-    initialItems: [
-      {id: 1, name: 'Item 1'},
-      {id: 2, name: 'Item 2'},
-      {id: 3, name: 'Item 3'},
-      {id: 4, name: 'Item 4'},
-      {id: 5, name: 'Item 5'}
-    ]
-  });
-
-  let handleKeyDown = (key: Key) => (e: React.KeyboardEvent) => {
-    if (e.key === 'Delete' || e.key === 'Backspace') {
-      e.preventDefault();
-      list.remove(key);
-    }
-  };
-
-  return (
-    <ListBox
-      aria-label="ListBox with delete support"
-      selectionMode="single"
-      items={list.items}>
-      {item => (
-        <ListBoxItem onKeyDown={handleKeyDown(item.id)}>
-          {item.name}
-        </ListBoxItem>
-      )}
-    </ListBox>
-  );
-}
-```
-
 ## Sections
 
 ListBox supports sections in order to group options. Sections can be used by wrapping groups of items in a `ListBoxSection` element. A `<Header>` element may also be included to label the section.

packages/react-aria-components/stories/ListBox.stories.tsx

@@ -12,8 +12,6 @@
 
 import {action} from '@storybook/addon-actions';
 import {Collection, DropIndicator, GridLayout, Header, ListBox, ListBoxItem, ListBoxProps, ListBoxSection, ListLayout, Separator, Text, useDragAndDrop, Virtualizer, WaterfallLayout} from 'react-aria-components';
-import {Key} from '@react-types/shared';
-import {Keyboard} from '@react-spectrum/text';
 import {ListBoxLoadMoreItem} from '../';
 import {LoadingSpinner, MyListBoxItem} from './utils';
 import {Meta, StoryFn, StoryObj} from '@storybook/react';
@@ -810,44 +808,4 @@ export let VirtualizedListBoxDndOnAction: ListBoxStory = () => {
   );
 };
 
-export const ListBoxWithKeyboardDelete: ListBoxStory = () => {
-  let initialItems = [
-    {id: 1, name: 'Item 1'},
-    {id: 2, name: 'Item 2'},
-    {id: 3, name: 'Item 3'},
-    {id: 4, name: 'Item 4'},
-    {id: 5, name: 'Item 5'}
-  ];
-
-  let list = useListData({
-    initialItems
-  });
-
-  let handleKeyDown = (key: Key) => (e: React.KeyboardEvent) => {
-    if (e.key === 'Delete' || e.key === 'Backspace') {
-      e.preventDefault();
-      list.remove(key);
-      action('onDelete')(key);
-    }
-  };
-
-  return (
-    <div style={{display: 'flex', flexDirection: 'column', alignItems: 'center', gap: 12}}>
-      <div style={{padding: 12, background: '#f0f0f0', borderRadius: 4}}>
-        Press <Keyboard>Delete</Keyboard> or <Keyboard>Backspace</Keyboard> to remove the focused item.
-      </div>
-      <ListBox
-        className={styles.menu}
-        aria-label="ListBox with delete support"
-        selectionMode="single"
-        items={list.items}>
-        {item => (
-          <MyListBoxItem onKeyDown={handleKeyDown(item.id)}>
-            {item.name}
-          </MyListBoxItem>
-        )}
-      </ListBox>
-    </div>
-  );
-};