Variables & Transforms

Variables allow you to create dynamic, reusable schemas. This guide covers variable syntax and available transformations.

Variable Syntax

Variables use the %VARIABLE_NAME% format:

<folder name="%PROJECT_NAME%">
  <file name="%COMPONENT_NAME%.tsx" />
</folder>

Naming Conventions

  • Use UPPERCASE with underscores: PROJECT_NAME, AUTHOR_EMAIL
  • Names can contain letters, numbers, and underscores
  • Names must start with a letter

Variable Detection

Structure Creator automatically detects variables in your schema and displays them in the Variables panel. Enter values before creating your structure.

Variable Definitions

Use the <variables> block to provide context for each variable. This helps users understand what values to enter by showing descriptions, placeholders, and examples.

<structure>
  <variables>
    <variable name="CLIENT_NAME"
              description="The client's company name"
              placeholder="Enter client name"
              example="Acme Corp"
              required="true" />
    <variable name="PROJECT_TYPE"
              description="Type of project (e.g., website, api)"
              placeholder="Enter project type"
              example="website"
              pattern="^[a-z-]+$"
              minLength="3"
              maxLength="30" />
  </variables>

  <folder name="%CLIENT_NAME%-%PROJECT_TYPE%">
    <file name="README.md" />
  </folder>
</structure>

Available Attributes

AttributeDescription
nameVariable name without % delimiters (required)
descriptionHelp text shown below the input field
placeholderPlaceholder text shown in empty inputs
exampleExample value displayed as "Example: value"
requiredWhether the variable must have a value (true/false)
patternRegex pattern for validation
minLengthMinimum character length
maxLengthMaximum character length

How It Works

When you define variables in the <variables> block:

  1. Placeholder text appears in the input field when empty
  2. Description displays below the input to explain what the variable is for
  3. Example shows a concrete value the user can reference
  4. Validation rules (required, pattern, minLength, maxLength) are automatically applied

This is especially useful for templates shared with others, as it provides self-documenting schemas.

Transforms

Apply transformations to format variable values:

%VARIABLE:transform%

Available Transforms

TransformInputOutput
uppercasehello worldHELLO WORLD
lowercaseHELLO WORLDhello world
camelCasehello worldhelloWorld
PascalCasehello worldHelloWorld
kebab-caseHelloWorldhello-world
snake_caseHelloWorldhello_world
pluralcatcats
lengthhello5

Examples

<!-- Package name in kebab-case -->
<file name="package.json">
{
  "name": "%PROJECT_NAME:kebab-case%"
}
</file>

<!-- Component name in PascalCase -->
<file name="%COMPONENT:PascalCase%.tsx" />

<!-- Class name in snake_case -->
<file name="%MODEL:snake_case%.py" />

Built-in Variables

Structure Creator provides built-in variables that are automatically available without needing to define them:

VariableDescriptionExample
%PROJECT_NAME%The project name from the UImy-awesome-project
%DATE%Current date (ISO)2024-01-15
%DATE:format(FORMAT)%Formatted dateSee below
%YEAR%Current year2024
%MONTH%Current month (01-12)01
%DAY%Current day (01-31)15

Project Name Variable

The %PROJECT_NAME% variable is special—it's automatically set from the "Project Name" field in the UI. This is the recommended way to name your root folder:

<folder name="%PROJECT_NAME%">
  <file name="README.md">
# %PROJECT_NAME%

Welcome to %PROJECT_NAME%!
  </file>
</folder>

When you enter "my-awesome-project" in the Project Name field, the folder will be created with that name, and all references to %PROJECT_NAME% in your schema will be replaced.

You can also apply transforms to the project name:

<file name="package.json">
{
  "name": "%PROJECT_NAME:kebab-case%",
  "displayName": "%PROJECT_NAME:PascalCase%"
}
</file>

Note: If you define %PROJECT_NAME% as a custom variable, your value will override the built-in project name.

Date Formats

Format dates with %DATE:format(FORMAT)%:

<file name="log-%DATE:format(YYYY-MM-DD)%.txt" />
<file name="report-%DATE:format(MMM D, YYYY)%.md" />

Available tokens:

  • YYYY - 4-digit year (2024)
  • YY - 2-digit year (24)
  • MMMM - Full month (January)
  • MMM - Short month (Jan)
  • MM - 2-digit month (01)
  • DD - 2-digit day (15)
  • D - Day without padding (5)

Variable Validation

Add validation rules to variables in templates:

{
  "variable_validation": {
    "PROJECT_NAME": {
      "required": true,
      "pattern": "^[a-z][a-z0-9-]*$",
      "minLength": 3,
      "maxLength": 50
    },
    "AUTHOR_EMAIL": {
      "required": true,
      "pattern": "^[^@]+@[^@]+\\.[^@]+$"
    }
  }
}

Validation is enforced in the UI before structure creation.

Conditional Variables

Use variables with conditionals:

<if var="INCLUDE_DOCKER">
  <file name="Dockerfile" />
  <file name="docker-compose.yml" />
</if>

Boolean variables are truthy when:

  • Set to "true", "yes", "1", or "on"
  • Non-empty string

Variables are falsy when:

  • Empty or not set
  • Set to "false", "no", "0", or "off"