digitalmarketplace-frontend
Version:
Digital Marketplace Frontend contains assets and components used in Digital Marketplace projects
37 lines (36 loc) • 2.51 kB
JSON
{
"component": "search-box",
"fixtures": [
{
"name": "default",
"options": {
"id": "search-keywords",
"label": "Keyword search",
"ariaLabel": "keywords",
"inputId": "keywords",
"inputName": "q",
"inputLabel": "Keyword search"
},
"hidden": false,
"description": "Default search box",
"previewLayoutModifiers": [],
"html": "<div id=\"search-keywords\" role=\"search\" aria-label=\"keywords\" data-module=\"dm-search-box\">\n <div class=\"dm-search-box dm-search-box--on-white\">\n <label for=\"keywords\" class=\"dm-search-box__label\">\n Keyword search\n </label>\n <div class=\"dm-search-box__item-wrapper\">\n <input\n type=\"search\"\n id=\"keywords\"\n name=\"q\"\n title=\"Keyword search\"\n class=\"dm-search-box__item dm-search-box__input js-class-toggle\"\n >\n <div class=\"dm-search-box__item dm-search-box__submit-wrapper\">\n <button type=\"submit\" class=\"dm-search-box__submit\">Search</button>\n </div>\n </div>\n </div>\n</div>"
},
{
"name": "with value",
"options": {
"id": "search-keywords",
"label": "Keyword search",
"ariaLabel": "keywords",
"inputId": "keywords",
"inputName": "q",
"inputLabel": "Keyword search",
"inputValue": "This is a search term"
},
"hidden": false,
"description": "with a value",
"previewLayoutModifiers": [],
"html": "<div id=\"search-keywords\" role=\"search\" aria-label=\"keywords\" data-module=\"dm-search-box\">\n <div class=\"dm-search-box dm-search-box--on-white\">\n <label for=\"keywords\" class=\"dm-search-box__label\">\n Keyword search\n </label>\n <div class=\"dm-search-box__item-wrapper\">\n <input\n type=\"search\"\n value=\"This is a search term\" id=\"keywords\"\n name=\"q\"\n title=\"Keyword search\"\n class=\"dm-search-box__item dm-search-box__input js-class-toggle\"\n >\n <div class=\"dm-search-box__item dm-search-box__submit-wrapper\">\n <button type=\"submit\" class=\"dm-search-box__submit\">Search</button>\n </div>\n </div>\n </div>\n</div>"
}
]
}