digitalmarketplace-frontend
Version:
Digital Marketplace Frontend contains assets and components used in Digital Marketplace projects
197 lines (196 loc) • 18 kB
JSON
{
"component": "question-boolean",
"fixtures": [
{
"name": "default",
"options": {
"question": {
"id": "example",
"question": "Here is the service question"
}
},
"hidden": false,
"description": "",
"previewLayoutModifiers": [],
"html": "<div class=\"govuk-form-group\">\n <fieldset class=\"govuk-fieldset\">\n <legend class=\"govuk-fieldset__legend govuk-fieldset__legend--m\">\n Here is the service question\n </legend>\n <div class=\"govuk-radios govuk-radios--inline\" data-module=\"govuk-radios\">\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"input-example\" name=\"example\" type=\"radio\" value=\"true\">\n <label class=\"govuk-label govuk-radios__label\" for=\"input-example\">\n Yes\n </label>\n </div>\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"input-example-2\" name=\"example\" type=\"radio\" value=\"false\">\n <label class=\"govuk-label govuk-radios__label\" for=\"input-example-2\">\n No\n </label>\n </div>\n </div>\n</fieldset>\n</div>"
},
{
"name": "with hint",
"options": {
"question": {
"id": "example",
"question": "Here is the service question",
"hint": "This is a hint for the question"
}
},
"hidden": false,
"description": "",
"previewLayoutModifiers": [],
"html": "<div class=\"govuk-form-group\">\n <fieldset class=\"govuk-fieldset\" aria-describedby=\"input-example-hint\">\n <legend class=\"govuk-fieldset__legend govuk-fieldset__legend--m\">\n Here is the service question\n </legend>\n <div id=\"input-example-hint\" class=\"govuk-hint\">\n This is a hint for the question\n </div>\n <div class=\"govuk-radios govuk-radios--inline\" data-module=\"govuk-radios\">\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"input-example\" name=\"example\" type=\"radio\" value=\"true\">\n <label class=\"govuk-label govuk-radios__label\" for=\"input-example\">\n Yes\n </label>\n </div>\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"input-example-2\" name=\"example\" type=\"radio\" value=\"false\">\n <label class=\"govuk-label govuk-radios__label\" for=\"input-example-2\">\n No\n </label>\n </div>\n </div>\n</fieldset>\n</div>"
},
{
"name": "with question advice",
"options": {
"question": {
"id": "example",
"question": "Here is the service question",
"question_advice": "Here is the question advice"
}
},
"hidden": false,
"description": "",
"previewLayoutModifiers": [],
"html": "<div class=\"govuk-form-group\">\n <fieldset class=\"govuk-fieldset\" aria-describedby=\"input-example-hint\">\n <legend class=\"govuk-fieldset__legend govuk-fieldset__legend--m\">\n Here is the service question\n </legend>\n <div id=\"input-example-hint\" class=\"govuk-hint\">\n <div class=\"govuk-body\">\n Here is the question advice\n </div>\n </div>\n <div class=\"govuk-radios govuk-radios--inline\" data-module=\"govuk-radios\">\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"input-example\" name=\"example\" type=\"radio\" value=\"true\">\n <label class=\"govuk-label govuk-radios__label\" for=\"input-example\">\n Yes\n </label>\n </div>\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"input-example-2\" name=\"example\" type=\"radio\" value=\"false\">\n <label class=\"govuk-label govuk-radios__label\" for=\"input-example-2\">\n No\n </label>\n </div>\n </div>\n</fieldset>\n</div>"
},
{
"name": "with question advice and hint",
"options": {
"question": {
"id": "example",
"question": "Here is the service question",
"question_advice": "<p class=\"govuk-body-l\">Here is the question advice</p>\n",
"hint": "<div class=\"hint-in-html\">This is a hint for the question</div>\n"
}
},
"hidden": false,
"description": "",
"previewLayoutModifiers": [],
"html": "<div class=\"govuk-form-group\">\n <fieldset class=\"govuk-fieldset\" aria-describedby=\"input-example-hint\">\n <legend class=\"govuk-fieldset__legend govuk-fieldset__legend--m\">\n Here is the service question\n </legend>\n <div id=\"input-example-hint\" class=\"govuk-hint\">\n <div class=\"govuk-body\">\n <p class=\"govuk-body-l\">Here is the question advice</p>\n \n </div>\n <div class=\"hint-in-html\">This is a hint for the question</div>\n </div>\n <div class=\"govuk-radios govuk-radios--inline\" data-module=\"govuk-radios\">\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"input-example\" name=\"example\" type=\"radio\" value=\"true\">\n <label class=\"govuk-label govuk-radios__label\" for=\"input-example\">\n Yes\n </label>\n </div>\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"input-example-2\" name=\"example\" type=\"radio\" value=\"false\">\n <label class=\"govuk-label govuk-radios__label\" for=\"input-example-2\">\n No\n </label>\n </div>\n </div>\n</fieldset>\n</div>"
},
{
"name": "with data",
"options": {
"question": {
"id": "example",
"question": "Here is the service question"
},
"data": {
"example": true
}
},
"hidden": false,
"description": "",
"previewLayoutModifiers": [],
"html": "<div class=\"govuk-form-group\">\n <fieldset class=\"govuk-fieldset\">\n <legend class=\"govuk-fieldset__legend govuk-fieldset__legend--m\">\n Here is the service question\n </legend>\n <div class=\"govuk-radios govuk-radios--inline\" data-module=\"govuk-radios\">\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"input-example\" name=\"example\" type=\"radio\" value=\"true\" checked>\n <label class=\"govuk-label govuk-radios__label\" for=\"input-example\">\n Yes\n </label>\n </div>\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"input-example-2\" name=\"example\" type=\"radio\" value=\"false\">\n <label class=\"govuk-label govuk-radios__label\" for=\"input-example-2\">\n No\n </label>\n </div>\n </div>\n</fieldset>\n</div>"
},
{
"name": "with optional",
"options": {
"question": {
"id": "example",
"question": "Here is the service question",
"optional": true
}
},
"hidden": false,
"description": "",
"previewLayoutModifiers": [],
"html": "<div class=\"govuk-form-group\">\n <fieldset class=\"govuk-fieldset\">\n <legend class=\"govuk-fieldset__legend govuk-fieldset__legend--m\">\n Here is the service question (optional)\n </legend>\n <div class=\"govuk-radios govuk-radios--inline\" data-module=\"govuk-radios\">\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"input-example\" name=\"example\" type=\"radio\" value=\"true\">\n <label class=\"govuk-label govuk-radios__label\" for=\"input-example\">\n Yes\n </label>\n </div>\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"input-example-2\" name=\"example\" type=\"radio\" value=\"false\">\n <label class=\"govuk-label govuk-radios__label\" for=\"input-example-2\">\n No\n </label>\n </div>\n </div>\n</fieldset>\n</div>"
},
{
"name": "with optional text",
"options": {
"question": {
"id": "example",
"question": "Here is the service question",
"optional": true,
"optional_text": "if applicable"
}
},
"hidden": false,
"description": "",
"previewLayoutModifiers": [],
"html": "<div class=\"govuk-form-group\">\n <fieldset class=\"govuk-fieldset\">\n <legend class=\"govuk-fieldset__legend govuk-fieldset__legend--m\">\n Here is the service question (if applicable)\n </legend>\n <div class=\"govuk-radios govuk-radios--inline\" data-module=\"govuk-radios\">\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"input-example\" name=\"example\" type=\"radio\" value=\"true\">\n <label class=\"govuk-label govuk-radios__label\" for=\"input-example\">\n Yes\n </label>\n </div>\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"input-example-2\" name=\"example\" type=\"radio\" value=\"false\">\n <label class=\"govuk-label govuk-radios__label\" for=\"input-example-2\">\n No\n </label>\n </div>\n </div>\n</fieldset>\n</div>"
},
{
"name": "with error message",
"options": {
"question": {
"id": "example",
"question": "Here is the service question"
},
"errors": {
"example": {
"message": "You must select an option"
}
}
},
"hidden": false,
"description": "",
"previewLayoutModifiers": [],
"html": "<div class=\"govuk-form-group govuk-form-group--error\">\n <fieldset class=\"govuk-fieldset\" aria-describedby=\"input-example-error\">\n <legend class=\"govuk-fieldset__legend govuk-fieldset__legend--m\">\n Here is the service question\n </legend>\n <p id=\"input-example-error\" class=\"govuk-error-message\">\n <span class=\"govuk-visually-hidden\">Error:</span> You must select an option\n </p>\n <div class=\"govuk-radios govuk-radios--inline\" data-module=\"govuk-radios\">\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"input-example\" name=\"example\" type=\"radio\" value=\"true\">\n <label class=\"govuk-label govuk-radios__label\" for=\"input-example\">\n Yes\n </label>\n </div>\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"input-example-2\" name=\"example\" type=\"radio\" value=\"false\">\n <label class=\"govuk-label govuk-radios__label\" for=\"input-example-2\">\n No\n </label>\n </div>\n </div>\n</fieldset>\n</div>"
},
{
"name": "with hint and error message",
"options": {
"question": {
"id": "example",
"question": "Here is the service question",
"hint": "This is a hint for the question"
},
"errors": {
"example": {
"message": "You must select an option"
}
}
},
"hidden": false,
"description": "",
"previewLayoutModifiers": [],
"html": "<div class=\"govuk-form-group govuk-form-group--error\">\n <fieldset class=\"govuk-fieldset\" aria-describedby=\"input-example-hint input-example-error\">\n <legend class=\"govuk-fieldset__legend govuk-fieldset__legend--m\">\n Here is the service question\n </legend>\n <div id=\"input-example-hint\" class=\"govuk-hint\">\n This is a hint for the question\n </div>\n <p id=\"input-example-error\" class=\"govuk-error-message\">\n <span class=\"govuk-visually-hidden\">Error:</span> You must select an option\n </p>\n <div class=\"govuk-radios govuk-radios--inline\" data-module=\"govuk-radios\">\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"input-example\" name=\"example\" type=\"radio\" value=\"true\">\n <label class=\"govuk-label govuk-radios__label\" for=\"input-example\">\n Yes\n </label>\n </div>\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"input-example-2\" name=\"example\" type=\"radio\" value=\"false\">\n <label class=\"govuk-label govuk-radios__label\" for=\"input-example-2\">\n No\n </label>\n </div>\n </div>\n</fieldset>\n</div>"
},
{
"name": "with previous framework",
"options": {
"question": {
"id": "example",
"question": "Here is the service question"
},
"data": {
"example": true
},
"frameworkReusedFrom": "G-Cloud 12"
},
"hidden": false,
"description": "",
"previewLayoutModifiers": [],
"html": "<div class=\"govuk-form-group govuk-form-group--error dm-form-group--declaration-reuse\">\n <fieldset class=\"govuk-fieldset\" aria-describedby=\"input-example-error\">\n <legend class=\"govuk-fieldset__legend govuk-fieldset__legend--m\">\n Here is the service question\n </legend>\n <p id=\"input-example-error\" class=\"govuk-error-message\">\n <span class=\"govuk-visually-hidden\">Notice:</span> This answer is from your G-Cloud 12 declaration\n </p>\n <div class=\"govuk-radios govuk-radios--inline\" data-module=\"govuk-radios\">\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"input-example\" name=\"example\" type=\"radio\" value=\"true\" checked>\n <label class=\"govuk-label govuk-radios__label\" for=\"input-example\">\n Yes\n </label>\n </div>\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"input-example-2\" name=\"example\" type=\"radio\" value=\"false\">\n <label class=\"govuk-label govuk-radios__label\" for=\"input-example-2\">\n No\n </label>\n </div>\n </div>\n</fieldset>\n</div>"
},
{
"name": "with previous framework without data",
"options": {
"question": {
"id": "example",
"question": "Here is the service question"
},
"frameworkReusedFrom": "G-Cloud 12"
},
"hidden": false,
"description": "",
"previewLayoutModifiers": [],
"html": "<div class=\"govuk-form-group\">\n <fieldset class=\"govuk-fieldset\">\n <legend class=\"govuk-fieldset__legend govuk-fieldset__legend--m\">\n Here is the service question\n </legend>\n <div class=\"govuk-radios govuk-radios--inline\" data-module=\"govuk-radios\">\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"input-example\" name=\"example\" type=\"radio\" value=\"true\">\n <label class=\"govuk-label govuk-radios__label\" for=\"input-example\">\n Yes\n </label>\n </div>\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"input-example-2\" name=\"example\" type=\"radio\" value=\"false\">\n <label class=\"govuk-label govuk-radios__label\" for=\"input-example-2\">\n No\n </label>\n </div>\n </div>\n</fieldset>\n</div>"
},
{
"name": "with previous framework and error message",
"options": {
"question": {
"id": "example",
"question": "Here is the service question"
},
"data": {
"example": true
},
"errors": {
"example": {
"message": "You must select an option"
}
},
"frameworkReusedFrom": "G-Cloud 12"
},
"hidden": false,
"description": "",
"previewLayoutModifiers": [],
"html": "<div class=\"govuk-form-group govuk-form-group--error\">\n <fieldset class=\"govuk-fieldset\" aria-describedby=\"input-example-error\">\n <legend class=\"govuk-fieldset__legend govuk-fieldset__legend--m\">\n Here is the service question\n </legend>\n <p id=\"input-example-error\" class=\"govuk-error-message\">\n <span class=\"govuk-visually-hidden\">Error:</span> You must select an option\n </p>\n <div class=\"govuk-radios govuk-radios--inline\" data-module=\"govuk-radios\">\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"input-example\" name=\"example\" type=\"radio\" value=\"true\" checked>\n <label class=\"govuk-label govuk-radios__label\" for=\"input-example\">\n Yes\n </label>\n </div>\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"input-example-2\" name=\"example\" type=\"radio\" value=\"false\">\n <label class=\"govuk-label govuk-radios__label\" for=\"input-example-2\">\n No\n </label>\n </div>\n </div>\n</fieldset>\n</div>"
}
]
}