Overview
Provides bidirectional transformation between UserInputFormItem and PromptVariable representations used in Dify's model configuration layer.
Description
This module bridges two different data representations used across the Dify frontend: UserInputFormItem (the API/form-level representation) and PromptVariable (the internal model/debug-level representation). The function userInputsFormToPromptVariables converts an array of form items into prompt variables, handling type detection for string, paragraph, number, boolean (checkbox), select, file, file-list, json_object, and external_data_tool input types. The inverse function promptVariablesToUserInputsForm converts prompt variables back into form items. A third utility, formatBooleanInputs, normalizes checkbox-type inputs to proper boolean values within an input record. Together, these functions ensure consistent data flow between the configuration UI, the debug panel, and the API layer.
Usage
Use userInputsFormToPromptVariables when loading form data from the API that needs to be consumed by the prompt editor or debug panel. Use promptVariablesToUserInputsForm when saving prompt variable configuration back to the API format. Use formatBooleanInputs before submitting user inputs to ensure checkbox values are properly typed as booleans.
Code Reference
Source Location
Signature
export const userInputsFormToPromptVariables = (
useInputs: UserInputFormItem[] | null,
dataset_query_variable?: string,
) => PromptVariable[]
export const promptVariablesToUserInputsForm = (
promptVariables: PromptVariable[],
) => UserInputFormItem[]
export const formatBooleanInputs = (
useInputs?: PromptVariable[] | null,
inputs?: Record<string, string | number | object | boolean> | null,
) => Record<string, string | number | object | boolean> | null | undefined
Import
import {
userInputsFormToPromptVariables,
promptVariablesToUserInputsForm,
formatBooleanInputs,
} from '@/utils/model-config'
I/O Contract
Inputs (userInputsFormToPromptVariables)
| Name |
Type |
Required |
Description
|
| useInputs |
null |
Yes |
Array of form items from the API, each containing a typed input definition keyed by type name (e.g., "text-input", "paragraph", "select")
|
| dataset_query_variable |
string |
No |
The variable name designated as the dataset query context variable; matching items are flagged with is_context_var: true
|
Inputs (promptVariablesToUserInputsForm)
| Name |
Type |
Required |
Description
|
| promptVariables |
PromptVariable[] |
Yes |
Array of prompt variables to convert back to form items; entries with empty key or name are filtered out
|
Inputs (formatBooleanInputs)
| Name |
Type |
Required |
Description
|
| useInputs |
null |
No |
The prompt variable definitions used to identify which inputs are checkbox (boolean) type
|
| inputs |
number | object | boolean> | null |
No |
The user input values to normalize
|
Outputs
| Function |
Type |
Description
|
| userInputsFormToPromptVariables |
PromptVariable[] |
Array of prompt variables with normalized types, options, and file configuration
|
| promptVariablesToUserInputsForm |
UserInputFormItem[] |
Array of form items suitable for API serialization
|
| formatBooleanInputs |
null | undefined |
A copy of the inputs record with checkbox values coerced to proper booleans via !!
|
Usage Examples
Convert Form Items to Prompt Variables
import { userInputsFormToPromptVariables } from '@/utils/model-config'
const formItems = [
{ 'text-input': { label: 'Name', variable: 'user_name', required: true, max_length: 100 } },
{ select: { label: 'Language', variable: 'lang', required: true, options: ['en', 'zh'] } },
]
const promptVars = userInputsFormToPromptVariables(formItems)
// [
// { key: 'user_name', name: 'Name', type: 'string', required: true, max_length: 100, options: [] },
// { key: 'lang', name: 'Language', type: 'select', required: true, options: ['en', 'zh'] },
// ]
Convert Prompt Variables Back to Form Items
import { promptVariablesToUserInputsForm } from '@/utils/model-config'
const promptVars = [
{ key: 'user_name', name: 'Name', type: 'string', required: true },
{ key: 'lang', name: 'Language', type: 'select', required: true, options: ['en', 'zh'] },
]
const formItems = promptVariablesToUserInputsForm(promptVars)
// [
// { 'text-input': { label: 'Name', variable: 'user_name', required: true, default: '' } },
// { select: { label: 'Language', variable: 'lang', required: true, options: ['en', 'zh'], default: '' } },
// ]
Normalize Boolean Inputs Before Submission
import { formatBooleanInputs } from '@/utils/model-config'
const variables = [
{ key: 'agree', name: 'Agreement', type: 'checkbox', required: true },
{ key: 'name', name: 'Name', type: 'string', required: true },
]
const inputs = { agree: 'true', name: 'Alice' }
const normalized = formatBooleanInputs(variables, inputs)
// { agree: true, name: 'Alice' }
Related Pages
