navody-digital-frontend/govuk/components/hint/fixtures.json

Navody.Digital Frontend contains the code you need to start building a user interface for navody.digital

{
    "component": "hint",
    "fixtures": [
        {
            "name": "default",
            "options": {
                "text": "It's on your National Insurance card, benefit letter, payslip or P60.\nFor example, 'QQ 12 34 56 C'.\n"
            },
            "html": "<div class=\"govuk-hint\">\n  It&#39;s on your National Insurance card, benefit letter, payslip or P60.\nFor example, &#39;QQ 12 34 56 C&#39;.\n\n</div>",
            "hidden": false
        },
        {
            "name": "with html",
            "options": {
                "html": "It's on your National Insurance card, benefit letter, payslip or <a class=\"govuk-link\" href=\"#\">P60</a>.\nFor example, 'QQ 12 34 56 C'.\n"
            },
            "html": "<div class=\"govuk-hint\">\n  It's on your National Insurance card, benefit letter, payslip or <a class=\"govuk-link\" href=\"#\">P60</a>.\nFor example, 'QQ 12 34 56 C'.\n\n</div>",
            "hidden": false
        },
        {
            "name": "classes",
            "options": {
                "id": "example-hint",
                "classes": "app-hint--custom-modifier",
                "text": "It's on your National Insurance card, benefit letter, payslip or P60."
            },
            "html": "<div id=\"example-hint\" class=\"govuk-hint app-hint--custom-modifier\">\n  It&#39;s on your National Insurance card, benefit letter, payslip or P60.\n</div>",
            "hidden": true
        },
        {
            "name": "id",
            "options": {
                "id": "my-hint",
                "text": "It's on your National Insurance card, benefit letter, payslip or P60."
            },
            "html": "<div id=\"my-hint\" class=\"govuk-hint\">\n  It&#39;s on your National Insurance card, benefit letter, payslip or P60.\n</div>",
            "hidden": true
        },
        {
            "name": "html as text",
            "options": {
                "text": "Unexpected <strong>bold text</strong> in body"
            },
            "html": "<div class=\"govuk-hint\">\n  Unexpected &lt;strong&gt;bold text&lt;/strong&gt; in body\n</div>",
            "hidden": true
        },
        {
            "name": "attributes",
            "options": {
                "text": "It's on your National Insurance card, benefit letter, payslip or P60.",
                "attributes": {
                    "data-attribute": "my data value"
                }
            },
            "html": "<div class=\"govuk-hint\" data-attribute=\"my data value\">\n  It&#39;s on your National Insurance card, benefit letter, payslip or P60.\n</div>",
            "hidden": true
        }
    ]
}