Prompt Template

A prompt with {{variable}} placeholders and a form to fill them. Variables are parsed out of the template rather than declared separately, so the two cannot drift.

src/components/ui/prompt-template.tsx

About

From the component's own source, where it was written.

A prompt with {{variable}} placeholders and a form to fill them.

Variables are parsed out of the template rather than declared separately. Two sources for the same list drift the moment someone edits the text, and the failure is silent — a placeholder with no input, or an input that fills nothing.

Unfilled placeholders stay visible in the preview instead of rendering empty. A prompt that quietly sends "Summarise in words" is worse than one that shows you what is missing.

Install

npx astralyx-ui add prompt-template

Usage

import { PromptTemplate } from '@/components/ui/prompt-template'

<PromptTemplate template={template} values={values} onValuesChange={setValues} />

Composer

Change the props and the source below follows.

PR review0 / 4 filled

repo

focus

limit

diff

You are reviewing a pull request for {{repo}}.

Focus on {{focus}}. Keep the review under {{limit}} comments, and
skip anything that a linter would already catch.

Diff:
{{diff}}

Props

showPreview

tsx

<PromptTemplate
  template={template}
  values={values}
  onValuesChange={setValues}
  showPreview={true}
/>

Examples

Fill the blanks

tsx

<PromptTemplate template={template} title="PR review" />

API

Generated from the source, so it cannot fall behind the code. One table per exported component, then hooks, functions and types.

`PromptTemplate`

Extends Omit<ComponentProps<'div'>, 'title' | 'onChange'>.

Prop	Type	Default	Description
template	string	required	Placeholders are `{{name}}`. Repeats of one name share a single input.
values	Record<string, string>	—	Controlled or uncontrolled.
onValuesChange	(values: Record<string, string>) => void	—	Controlled or uncontrolled.
title	string	—	—
showPreview	boolean	true	—

Functions

Function	Signature	Description
extractVariables	(template: string) => string[]	Exported, for validating a template before it is saved.

Behaviour

Topic	Detail	Description
preview	literal gaps	Unfilled placeholders stay visible and highlighted — a prompt that quietly sends "Summarise in words" is worse than one that shows what is missing.