{
    "$schema": "https://alexanderparker.github.io/instruction-template-specification/schema/v1.0/its-base-schema-v1.json",
    "version": "1.0.0",
    "extends": [
        "https://alexanderparker.github.io/instruction-template-specification/schema/v1.0/its-html-types-v1.json"
    ],
    "metadata": {
        "name": "Product Card Fragment Template",
        "description": "An HTML product card whose markup is authored literally in the template, with HTML type placeholders filling text, list items and table rows",
        "author": "Alexander Parker",
        "tags": [
            "example",
            "html",
            "fragment",
            "structured-output"
        ],
        "created": "2026-07-29T00:00:00Z"
    },
    "variables": {
        "productName": "Solar Garden Lantern",
        "productUrl": "https://www.example.com/products/solar-garden-lantern",
        "includeSpecifications": true
    },
    "content": [
        {
            "type": "text",
            "text": "<section class=\"product-card\">\n  <h2><a href=\"${productUrl}\">${productName}</a></h2>\n  <p class=\"product-card__summary\">"
        },
        {
            "type": "placeholder",
            "id": "product_summary",
            "instructionType": "html_text",
            "config": {
                "description": "a short marketing summary of the ${productName}",
                "displayName": "Product Summary",
                "allowInlineMarkup": true
            }
        },
        {
            "type": "text",
            "text": "</p>\n\n  <h3>Key features</h3>\n  <ul class=\"product-card__features\">\n"
        },
        {
            "type": "placeholder",
            "id": "feature_items",
            "instructionType": "html_list_items",
            "config": {
                "description": "four key features of the ${productName} focused on benefits for the buyer",
                "displayName": "Feature Items",
                "itemCount": 4
            }
        },
        {
            "type": "text",
            "text": "\n  </ul>\n"
        },
        {
            "type": "conditional",
            "condition": "includeSpecifications == true",
            "content": [
                {
                    "type": "text",
                    "text": "\n  <h3>Specifications</h3>\n  <table class=\"product-card__specs\">\n    <thead>\n      <tr><th>Specification</th><th>Value</th></tr>\n    </thead>\n    <tbody>\n"
                },
                {
                    "type": "placeholder",
                    "id": "spec_rows",
                    "instructionType": "html_table_rows",
                    "config": {
                        "description": "rows for the dimensions, weight, battery life and materials of the ${productName}",
                        "displayName": "Specification Rows",
                        "rows": 4,
                        "columns": 2
                    }
                },
                {
                    "type": "text",
                    "text": "\n    </tbody>\n  </table>\n"
                }
            ]
        },
        {
            "type": "text",
            "text": "</section>"
        }
    ]
}