AI SDK Token UsageuseModelDetails
Message metadata required
In order to use the hooks, the required metadata-fields for AI SDK Token Usage has to be attached to the message. If you have not done this, read Message Metadata.
The hook useModelDetails can be used to get model details, such as context window and pricing.
Use it when you need to show the model’s max tokens or price references in your UI.
Usage
import { useModelDetails } from 'ai-sdk-token-usage';
export default function Chat() {
const modelDetails = useModelDetails({ canonicalSlug: 'openai/gpt-5' });
};Here, modelDetails is an object with three keys:
- data: All data related to model details.
- isLoading: A boolean used to determine if data is loading or not.
- error: If an error occured, this will hold useful information to either debug the issue or display an appropriate message to the user.
The reasoning behind this data structure is that the hook leverages SWR internally for data fetching, which introduces asynchronous behavior. SWR returns an object containing data, error, and isLoading, and useModelDetails follows the same pattern. This makes it intuitive for developers familiar with SWR or React Query to handle loading states, manage errors gracefully, and access the resolved data once available — ensuring a consistent and predictable experience when working with asynchronous hooks.
Read the API signature to understand the full structure of the hook’s inputs and return values, and how each field can be used in your component.
API Signature
Parameters
Prop
Type
Returns
Prop
Type