Shared building blocks for the **items level** of the entity-context picker (Figma 31:29102). Provides row chrome, skeleton placeholders, a scrollable list with scroll-driven pagination, and an error boundary — consumed by `ChatContextPickerConfig.renderItems` in the host application. ## Key Components | Export | Type | Description | |---|---|---| | `CONTEXT_ROW_CLASS` | `string` | Tailwind classes for a standard menu row | | `CONTEXT_ICON_CLASS` | `string` | Responsive 16px→24px icon wrapper | | `CONTEXT_LABEL_CLASS` | `string` | Truncating h4 label slot | | `CONTEXT_BACK_CLASS` | `string` | Back-navigation row classes | | `CONTEXT_STATE_CLASS` | `string` | Empty/error state prose classes | | `ContextMenuRow` | Component | Icon + label + optional trailing slot button primitive | | `ContextItemsSkeleton` | Component | Suspense / load-more placeholder rows | | `ContextItemsList` | Component | Scrollable `role="listbox"` with selection state, limit enforcement, and scroll-driven pagination | | `ContextErrorBoundary` | Class Component | Catches failed host fetches; auto-resets on `resetKey` change | ## Usage Example ```typescript import { ContextItemsList, ContextErrorBoundary, ContextItemsSkeleton, } from './context-items-list' function MyPickerItems({ query }: { query: string }) { const { items, hasMore, fetchNextPage, isFetchingNextPage } = useMyItems(query) return ( ( Failed to load — retry )} > }> = 5} hasMore={hasMore} onLoadMore={fetchNextPage} loadingMore={isFetchingNextPage} emptyLabel="No devices found" /> ) } ``` **Notes:** - `ContextErrorBoundary.resetKey` should encode both the entity type and current search query so errors clear automatically on navigation or new searches. Pair the `retry` callback with your data library's cache-reset (e.g. react-query's `queryClient.resetQueries`) to ensure the fetch actually re-runs. - The list caps height at `min(340px, 45vh)` to stay inside bottom-anchored popovers on short viewports. - Source: [`context-items-list.tsx`](https://github.com/flamingo-stack/openframe-oss-lib/blob/main/context-items-list.tsx)