Priompt uses priorities to decide which parts of a JSX tree to include in the context window.
- Absolute Priority: Use the
p prop on a <scope>. - Relative Priority: Use the
prel prop on a <scope>. A higher priority means the child is more important to include. - Default Behavior: If no priority is specified, a child is included if and only if its parent is included.
Example of prioritizing recent history over older history:
{props.history.map((m, i) => (
<scope prel={-(props.history.length - i)}>
{m.case === "user" ? (
<UserMessage>{m.message}</UserMessage>
) : (
<AssistantMessage>{m.message}</AssistantMessage>
)}
</scope>
))}
function ExamplePrompt(
props: PromptProps<{
name: string,
message: string,
history: { case: "user" | "assistant", message: string }[],
}>
): PromptElement {
const capitalizedName = props.name[0].toUpperCase() + props.name.slice(1);
return (
<>
<SystemMessage>
The user's name is {capitalizedName}. Please respond to them kindly.
</SystemMessage>
{props.history.map((m, i) => (
<scope prel={-(props.history.length - i)}>
{m.case === "user" ? (
<UserMessage>{m.message}</UserMessage>
) : (
<AssistantMessage>{m.message}</AssistantMessage>
)}
</scope>
))}
<UserMessage>{props.message}</UserMessage>
<empty tokens={1000} />
</>
);
}