']`|\n| `initialChildGroupCount` | false | 1 | number | Number of child items groups that need to be repeated or added as a children from form on initial load |\n| `itemName` | true | | string | For screen readers; What this field is a list of, for example if this were set to 'trade agreements' screen readers would read 'first trade agreement' |\n| | | | | |\n"}}};const New=()=>react.createElement(Form.A,{id:"fieldAddAnotherExample",analyticsFormName:"fieldAddAnotherExample",submissionTaskName:"Submit Form example"},(state=>react.createElement(react.Fragment,null,react.createElement(FieldAddAnother.A,{name:"teams_new_edit_example",legend:"Team members with roles",dataTestPrefix:"teams-field-",itemName:"team member"},(({groupIndex})=>react.createElement(react.Fragment,null,react.createElement(FieldTypeahead.A,{name:`adviser_${groupIndex}`,inputId:`adviser_${groupIndex}`,label:"Team Member",options,placeholder:"Search advisers",required:"Select at least one Adviser","aria-label":"Select an adviser"}),react.createElement(FieldInput.A,{name:`role_${groupIndex}`,type:"text",label:"Role"})))),react.createElement("pre",null,"Using the data with the form setting and getting values"," ",JSON.stringify(state.values,null,2)),react.createElement("pre",null,"When sending data back to the database",JSON.stringify(transformObjectBackToArray(state.values),null,2))))),MultiStep=()=>react.createElement(Form.A,{id:"fieldAddAnotherMultiStepExample",submissionTaskName:"Submit Form example",initialValues:{"added-another-input_0":"Initial value 0","added-another-input_1":"Initial value 1","added-another-input_2":"Initial value 2"}},(({values})=>react.createElement(react.Fragment,null,react.createElement(Step.A,{name:"step-1"},"Step 1",react.createElement(FieldInput.A,{label:"Step 1 input",name:"step-1-input"})),react.createElement(Step.A,{name:"step-2"},"Step 2",react.createElement(FieldInput.A,{label:"Step 2 input",name:"step-2-input"}),react.createElement(FieldAddAnother.A,{itemName:"thing",initialChildGroupCount:3,limitChildGroupCount:7},(({groupIndex})=>react.createElement(FieldInput.A,{name:`added-another-input_${groupIndex}`,type:"text",label:"Added another"})))),react.createElement(Step.A,{name:"step-3"},"Step 3",react.createElement(FieldInput.A,{label:"Step 3 input",name:"step-3-input"})),react.createElement("pre",null,JSON.stringify(values,null,2)))));DocsPlaceholder.parameters={...DocsPlaceholder.parameters,docs:{...DocsPlaceholder.parameters?.docs,source:{originalSource:"() => \n This is a workaround to get the DocsPage to work with multiInstance\n components.\n
",...DocsPlaceholder.parameters?.docs?.source}}},Edit.parameters={...Edit.parameters,docs:{...Edit.parameters?.docs,source:{originalSource:'() => ',...Edit.parameters?.docs?.source}}},New.parameters={...New.parameters,docs:{...New.parameters?.docs,source:{originalSource:'() => ',...New.parameters?.docs?.source}}},MultiStep.parameters={...MultiStep.parameters,docs:{...MultiStep.parameters?.docs,source:{originalSource:'() => ',...MultiStep.parameters?.docs?.source}}};const __namedExportsOrder=["DocsPlaceholder","Edit","New","MultiStep"]}}]);
\ No newline at end of file
diff --git a/Form-elements-__stories__-FieldCheckboxes-stories.0efdf984.iframe.bundle.js b/Form-elements-__stories__-FieldCheckboxes-stories.0efdf984.iframe.bundle.js
new file mode 100644
index 00000000000..39291baf0ca
--- /dev/null
+++ b/Form-elements-__stories__-FieldCheckboxes-stories.0efdf984.iframe.bundle.js
@@ -0,0 +1 @@
+"use strict";(self.webpackChunkdata_hub_frontend=self.webpackChunkdata_hub_frontend||[]).push([[8141],{"./src/client/components/Form/elements/__stories__/FieldCheckboxes.stories.jsx":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.r(__webpack_exports__),__webpack_require__.d(__webpack_exports__,{CheckboxesExclusive:()=>CheckboxesExclusive,CheckboxesHint:()=>CheckboxesHint,CheckboxesLegend:()=>CheckboxesLegend,Default:()=>Default,__namedExportsOrder:()=>__namedExportsOrder,default:()=>__WEBPACK_DEFAULT_EXPORT__});var react__WEBPACK_IMPORTED_MODULE_0__=__webpack_require__("./node_modules/react/index.js"),_govuk_react_heading__WEBPACK_IMPORTED_MODULE_1__=__webpack_require__("./node_modules/@govuk-react/heading/dist/govuk-react-heading.esm.js"),govuk_react__WEBPACK_IMPORTED_MODULE_2__=__webpack_require__("./node_modules/govuk-react/dist/govuk-react.esm.js"),styled_components__WEBPACK_IMPORTED_MODULE_5__=__webpack_require__("./node_modules/styled-components/dist/styled-components.browser.esm.js"),_FieldCheckboxes__WEBPACK_IMPORTED_MODULE_3__=__webpack_require__("./src/client/components/Form/elements/FieldCheckboxes/index.jsx"),_Form__WEBPACK_IMPORTED_MODULE_4__=__webpack_require__("./src/client/components/Form/index.jsx");const StyledDetails=(0,styled_components__WEBPACK_IMPORTED_MODULE_5__.Ay)(govuk_react__WEBPACK_IMPORTED_MODULE_2__.B_)({margin:0}),options=[{label:"Italy",value:"it"},{label:"Poland",value:"pl"},{label:"United Kingdom",value:"gb"},{label:"United States",value:"us",hint:"Hints are supported!"}],__WEBPACK_DEFAULT_EXPORT__={title:"Form/Form Elements/Checkboxes",parameters:{component:_FieldCheckboxes__WEBPACK_IMPORTED_MODULE_3__.A}},Default=()=>react__WEBPACK_IMPORTED_MODULE_0__.createElement(_Form__WEBPACK_IMPORTED_MODULE_4__.A,{id:"fieldCheckboxExample",analyticsFormName:"fieldCheckboxExample",submissionTaskName:"Submit Form example"},(form=>react__WEBPACK_IMPORTED_MODULE_0__.createElement(react__WEBPACK_IMPORTED_MODULE_0__.Fragment,null,react__WEBPACK_IMPORTED_MODULE_0__.createElement(_FieldCheckboxes__WEBPACK_IMPORTED_MODULE_3__.A,{name:"countries",label:"What are your favourite countries?",required:"Select at least one country",options}),react__WEBPACK_IMPORTED_MODULE_0__.createElement("pre",null,JSON.stringify(form,null,2))))),CheckboxesHint=()=>react__WEBPACK_IMPORTED_MODULE_0__.createElement(_Form__WEBPACK_IMPORTED_MODULE_4__.A,{id:"fieldCheckboxExample",analyticsFormName:"fieldCheckboxExample",submissionTaskName:"Submit Form example"},(form=>react__WEBPACK_IMPORTED_MODULE_0__.createElement(react__WEBPACK_IMPORTED_MODULE_0__.Fragment,null,react__WEBPACK_IMPORTED_MODULE_0__.createElement(_FieldCheckboxes__WEBPACK_IMPORTED_MODULE_3__.A,{name:"countries",label:"What are your favourite countries?",hint:"Some hint",required:"Select at least one country",options}),react__WEBPACK_IMPORTED_MODULE_0__.createElement("pre",null,JSON.stringify(form,null,2)))));CheckboxesHint.story={name:"Checkboxes - hint"};const CheckboxesLegend=()=>react__WEBPACK_IMPORTED_MODULE_0__.createElement(_Form__WEBPACK_IMPORTED_MODULE_4__.A,{id:"fieldCheckboxExample",analyticsFormName:"fieldCheckboxExample",submissionTaskName:"Submit Form example"},(form=>react__WEBPACK_IMPORTED_MODULE_0__.createElement(react__WEBPACK_IMPORTED_MODULE_0__.Fragment,null,react__WEBPACK_IMPORTED_MODULE_0__.createElement(_FieldCheckboxes__WEBPACK_IMPORTED_MODULE_3__.A,{name:"countries2",legend:react__WEBPACK_IMPORTED_MODULE_0__.createElement(_govuk_react_heading__WEBPACK_IMPORTED_MODULE_1__.H1,null,"Using H1 as legend"),hint:"Some hint",required:"Select at least one country",options}),react__WEBPACK_IMPORTED_MODULE_0__.createElement("pre",null,JSON.stringify(form,null,2)))));CheckboxesLegend.story={name:"Checkboxes - legend"};const CheckboxesExclusive=()=>react__WEBPACK_IMPORTED_MODULE_0__.createElement(_Form__WEBPACK_IMPORTED_MODULE_4__.A,{id:"fieldCheckboxExample",analyticsFormName:"fieldCheckboxExample",submissionTaskName:"Submit Form example"},(form=>react__WEBPACK_IMPORTED_MODULE_0__.createElement(react__WEBPACK_IMPORTED_MODULE_0__.Fragment,null,react__WEBPACK_IMPORTED_MODULE_0__.createElement(_FieldCheckboxes__WEBPACK_IMPORTED_MODULE_3__.A,{name:"countries",label:"Estimated land date notification preferences",hint:"Select all that apply",required:"Select at least one country or select 'No, ...'",exclusive:!0,initialValue:["no"],options:[{label:"France",value:"fr"},{label:"Portugal",value:"pr"},{label:"Spain",value:"sp"},{label:"No, I will not be travelling to any of these countries",value:"no"},{label:"Yes, I will travelling to any of these countries",value:"yes",link:react__WEBPACK_IMPORTED_MODULE_0__.createElement(StyledDetails,{summary:"Is included a territorial independent countries?","data-test":"some-list-of-territorial-countries"},react__WEBPACK_IMPORTED_MODULE_0__.createElement("p",null,"List of territorial countries:"),react__WEBPACK_IMPORTED_MODULE_0__.createElement(govuk_react__WEBPACK_IMPORTED_MODULE_2__.Xy,{listStyleType:"bullet"},react__WEBPACK_IMPORTED_MODULE_0__.createElement(govuk_react__WEBPACK_IMPORTED_MODULE_2__.ck,null,"French Guiana"),react__WEBPACK_IMPORTED_MODULE_0__.createElement(govuk_react__WEBPACK_IMPORTED_MODULE_2__.ck,null,"Madeira and Azores"),react__WEBPACK_IMPORTED_MODULE_0__.createElement(govuk_react__WEBPACK_IMPORTED_MODULE_2__.ck,null,"Balearic Islands(Ibiza, Formentera, Mallorca and Canary Islands)")))}]}),react__WEBPACK_IMPORTED_MODULE_0__.createElement("pre",null,JSON.stringify(form,null,2)))));CheckboxesExclusive.story={name:"Checkboxes - exclusive"},Default.parameters={...Default.parameters,docs:{...Default.parameters?.docs,source:{originalSource:'() => ',...Default.parameters?.docs?.source}}},CheckboxesHint.parameters={...CheckboxesHint.parameters,docs:{...CheckboxesHint.parameters?.docs,source:{originalSource:'() => ',...CheckboxesHint.parameters?.docs?.source}}},CheckboxesLegend.parameters={...CheckboxesLegend.parameters,docs:{...CheckboxesLegend.parameters?.docs,source:{originalSource:'() => ',...CheckboxesLegend.parameters?.docs?.source}}},CheckboxesExclusive.parameters={...CheckboxesExclusive.parameters,docs:{...CheckboxesExclusive.parameters?.docs,source:{originalSource:"() => ",...CheckboxesExclusive.parameters?.docs?.source}}};const __namedExportsOrder=["Default","CheckboxesHint","CheckboxesLegend","CheckboxesExclusive"]}}]);
\ No newline at end of file
diff --git a/Form-elements-__stories__-FieldCheckboxes-stories.9c014366.iframe.bundle.js b/Form-elements-__stories__-FieldCheckboxes-stories.9c014366.iframe.bundle.js
deleted file mode 100644
index a245675b6b0..00000000000
--- a/Form-elements-__stories__-FieldCheckboxes-stories.9c014366.iframe.bundle.js
+++ /dev/null
@@ -1 +0,0 @@
-"use strict";(self.webpackChunkdata_hub_frontend=self.webpackChunkdata_hub_frontend||[]).push([[8141],{"./src/client/components/Form/elements/__stories__/FieldCheckboxes.stories.jsx":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.r(__webpack_exports__),__webpack_require__.d(__webpack_exports__,{CheckboxesExclusive:()=>CheckboxesExclusive,CheckboxesHint:()=>CheckboxesHint,CheckboxesLegend:()=>CheckboxesLegend,Default:()=>Default,__namedExportsOrder:()=>__namedExportsOrder,default:()=>__WEBPACK_DEFAULT_EXPORT__});var react__WEBPACK_IMPORTED_MODULE_0__=__webpack_require__("./node_modules/react/index.js"),_govuk_react_heading__WEBPACK_IMPORTED_MODULE_1__=__webpack_require__("./node_modules/@govuk-react/heading/dist/govuk-react-heading.esm.js"),govuk_react__WEBPACK_IMPORTED_MODULE_2__=__webpack_require__("./node_modules/govuk-react/dist/govuk-react.esm.js"),styled_components__WEBPACK_IMPORTED_MODULE_5__=__webpack_require__("./node_modules/styled-components/dist/styled-components.browser.esm.js"),_FieldCheckboxes__WEBPACK_IMPORTED_MODULE_3__=__webpack_require__("./src/client/components/Form/elements/FieldCheckboxes/index.jsx"),_Form__WEBPACK_IMPORTED_MODULE_4__=__webpack_require__("./src/client/components/Form/index.jsx"),StyledDetails=(0,styled_components__WEBPACK_IMPORTED_MODULE_5__.Ay)(govuk_react__WEBPACK_IMPORTED_MODULE_2__.B_)({margin:0}),options=[{label:"Italy",value:"it"},{label:"Poland",value:"pl"},{label:"United Kingdom",value:"gb"},{label:"United States",value:"us",hint:"Hints are supported!"}];const __WEBPACK_DEFAULT_EXPORT__={title:"Form/Form Elements/Checkboxes",parameters:{component:_FieldCheckboxes__WEBPACK_IMPORTED_MODULE_3__.A}};var Default=function Default(){return react__WEBPACK_IMPORTED_MODULE_0__.createElement(_Form__WEBPACK_IMPORTED_MODULE_4__.A,{id:"fieldCheckboxExample",analyticsFormName:"fieldCheckboxExample",submissionTaskName:"Submit Form example"},(function(form){return react__WEBPACK_IMPORTED_MODULE_0__.createElement(react__WEBPACK_IMPORTED_MODULE_0__.Fragment,null,react__WEBPACK_IMPORTED_MODULE_0__.createElement(_FieldCheckboxes__WEBPACK_IMPORTED_MODULE_3__.A,{name:"countries",label:"What are your favourite countries?",required:"Select at least one country",options}),react__WEBPACK_IMPORTED_MODULE_0__.createElement("pre",null,JSON.stringify(form,null,2)))}))},CheckboxesHint=function CheckboxesHint(){return react__WEBPACK_IMPORTED_MODULE_0__.createElement(_Form__WEBPACK_IMPORTED_MODULE_4__.A,{id:"fieldCheckboxExample",analyticsFormName:"fieldCheckboxExample",submissionTaskName:"Submit Form example"},(function(form){return react__WEBPACK_IMPORTED_MODULE_0__.createElement(react__WEBPACK_IMPORTED_MODULE_0__.Fragment,null,react__WEBPACK_IMPORTED_MODULE_0__.createElement(_FieldCheckboxes__WEBPACK_IMPORTED_MODULE_3__.A,{name:"countries",label:"What are your favourite countries?",hint:"Some hint",required:"Select at least one country",options}),react__WEBPACK_IMPORTED_MODULE_0__.createElement("pre",null,JSON.stringify(form,null,2)))}))};CheckboxesHint.story={name:"Checkboxes - hint"};var CheckboxesLegend=function CheckboxesLegend(){return react__WEBPACK_IMPORTED_MODULE_0__.createElement(_Form__WEBPACK_IMPORTED_MODULE_4__.A,{id:"fieldCheckboxExample",analyticsFormName:"fieldCheckboxExample",submissionTaskName:"Submit Form example"},(function(form){return react__WEBPACK_IMPORTED_MODULE_0__.createElement(react__WEBPACK_IMPORTED_MODULE_0__.Fragment,null,react__WEBPACK_IMPORTED_MODULE_0__.createElement(_FieldCheckboxes__WEBPACK_IMPORTED_MODULE_3__.A,{name:"countries2",legend:react__WEBPACK_IMPORTED_MODULE_0__.createElement(_govuk_react_heading__WEBPACK_IMPORTED_MODULE_1__.H1,null,"Using H1 as legend"),hint:"Some hint",required:"Select at least one country",options}),react__WEBPACK_IMPORTED_MODULE_0__.createElement("pre",null,JSON.stringify(form,null,2)))}))};CheckboxesLegend.story={name:"Checkboxes - legend"};var CheckboxesExclusive=function CheckboxesExclusive(){return react__WEBPACK_IMPORTED_MODULE_0__.createElement(_Form__WEBPACK_IMPORTED_MODULE_4__.A,{id:"fieldCheckboxExample",analyticsFormName:"fieldCheckboxExample",submissionTaskName:"Submit Form example"},(function(form){return react__WEBPACK_IMPORTED_MODULE_0__.createElement(react__WEBPACK_IMPORTED_MODULE_0__.Fragment,null,react__WEBPACK_IMPORTED_MODULE_0__.createElement(_FieldCheckboxes__WEBPACK_IMPORTED_MODULE_3__.A,{name:"countries",label:"Estimated land date notification preferences",hint:"Select all that apply",required:"Select at least one country or select 'No, ...'",exclusive:!0,initialValue:["no"],options:[{label:"France",value:"fr"},{label:"Portugal",value:"pr"},{label:"Spain",value:"sp"},{label:"No, I will not be travelling to any of these countries",value:"no"},{label:"Yes, I will travelling to any of these countries",value:"yes",link:react__WEBPACK_IMPORTED_MODULE_0__.createElement(StyledDetails,{summary:"Is included a territorial independent countries?","data-test":"some-list-of-territorial-countries"},react__WEBPACK_IMPORTED_MODULE_0__.createElement("p",null,"List of territorial countries:"),react__WEBPACK_IMPORTED_MODULE_0__.createElement(govuk_react__WEBPACK_IMPORTED_MODULE_2__.Xy,{listStyleType:"bullet"},react__WEBPACK_IMPORTED_MODULE_0__.createElement(govuk_react__WEBPACK_IMPORTED_MODULE_2__.ck,null,"French Guiana"),react__WEBPACK_IMPORTED_MODULE_0__.createElement(govuk_react__WEBPACK_IMPORTED_MODULE_2__.ck,null,"Madeira and Azores"),react__WEBPACK_IMPORTED_MODULE_0__.createElement(govuk_react__WEBPACK_IMPORTED_MODULE_2__.ck,null,"Balearic Islands(Ibiza, Formentera, Mallorca and Canary Islands)")))}]}),react__WEBPACK_IMPORTED_MODULE_0__.createElement("pre",null,JSON.stringify(form,null,2)))}))};CheckboxesExclusive.story={name:"Checkboxes - exclusive"},Default.parameters={...Default.parameters,docs:{...Default.parameters?.docs,source:{originalSource:'() => ',...Default.parameters?.docs?.source}}},CheckboxesHint.parameters={...CheckboxesHint.parameters,docs:{...CheckboxesHint.parameters?.docs,source:{originalSource:'() => ',...CheckboxesHint.parameters?.docs?.source}}},CheckboxesLegend.parameters={...CheckboxesLegend.parameters,docs:{...CheckboxesLegend.parameters?.docs,source:{originalSource:'() => ',...CheckboxesLegend.parameters?.docs?.source}}},CheckboxesExclusive.parameters={...CheckboxesExclusive.parameters,docs:{...CheckboxesExclusive.parameters?.docs,source:{originalSource:"() => ",...CheckboxesExclusive.parameters?.docs?.source}}};const __namedExportsOrder=["Default","CheckboxesHint","CheckboxesLegend","CheckboxesExclusive"]}}]);
\ No newline at end of file
diff --git a/Form-elements-__stories__-FieldChoice-stories.843bb4e6.iframe.bundle.js b/Form-elements-__stories__-FieldChoice-stories.843bb4e6.iframe.bundle.js
new file mode 100644
index 00000000000..296506ebc64
--- /dev/null
+++ b/Form-elements-__stories__-FieldChoice-stories.843bb4e6.iframe.bundle.js
@@ -0,0 +1,13 @@
+"use strict";(self.webpackChunkdata_hub_frontend=self.webpackChunkdata_hub_frontend||[]).push([[7163],{"./src/client/components/Form/elements/__stories__/FieldChoice.stories.jsx":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.r(__webpack_exports__),__webpack_require__.d(__webpack_exports__,{Checkbox:()=>Checkbox,CheckboxChecked:()=>CheckboxChecked,CheckboxHint:()=>CheckboxHint,CheckboxInline:()=>CheckboxInline,CheckboxLabel:()=>CheckboxLabel,CheckboxLegend:()=>CheckboxLegend,CheckboxRequired:()=>CheckboxRequired,Radio:()=>Radio,RadioHint:()=>RadioHint,RadioInline:()=>RadioInline,RadioLabel:()=>RadioLabel,RadioLegend:()=>RadioLegend,RadioRequired:()=>RadioRequired,RadioSelected:()=>RadioSelected,__namedExportsOrder:()=>__namedExportsOrder,default:()=>__WEBPACK_DEFAULT_EXPORT__});var react__WEBPACK_IMPORTED_MODULE_0__=__webpack_require__("./node_modules/react/index.js"),_govuk_react_heading__WEBPACK_IMPORTED_MODULE_1__=__webpack_require__("./node_modules/@govuk-react/heading/dist/govuk-react-heading.esm.js"),styled_components__WEBPACK_IMPORTED_MODULE_4__=__webpack_require__("./node_modules/styled-components/dist/styled-components.browser.esm.js"),_FieldChoice__WEBPACK_IMPORTED_MODULE_2__=__webpack_require__("./src/client/components/Form/elements/FieldChoice/index.jsx"),___WEBPACK_IMPORTED_MODULE_3__=__webpack_require__("./src/client/components/Form/index.jsx");const inline=styled_components__WEBPACK_IMPORTED_MODULE_4__.AH`
+ fieldset div {
+ display: flex;
+ }
+ fieldset div label {
+ margin-right: 10px;
+ }
+`,FieldChoiceRadioInline=(0,styled_components__WEBPACK_IMPORTED_MODULE_4__.Ay)(_FieldChoice__WEBPACK_IMPORTED_MODULE_2__.A.Radio)`
+ ${inline}
+`,FieldChoiceCheckboxInline=(0,styled_components__WEBPACK_IMPORTED_MODULE_4__.Ay)(_FieldChoice__WEBPACK_IMPORTED_MODULE_2__.A.Checkbox)`
+ ${inline}
+`,options=[{value:"0",label:"England"},{value:"1",label:"Wales"},{value:"2",label:"Scotland"},{value:"3",label:"Northern Ireland"}],formatOption=option=>`{ value: '${option.value}', label: '${option.label}' }`,__WEBPACK_DEFAULT_EXPORT__={title:"Form/Form Elements/FieldChoice",component:_FieldChoice__WEBPACK_IMPORTED_MODULE_2__.A,args:{options,name:"country",component:_FieldChoice__WEBPACK_IMPORTED_MODULE_2__.A},argTypes:{type:"string",initialValues:{control:"object"}},parameters:{docs:{description:{component:'The FieldChoice component is designed to render a group of radio buttons or checkboxes by setting the prop type to either "radio" or "checkbox" .\n The component sets the entire selected option (Object) to the Form\'s state which is helpful on user journeys where the final page is a summary page and you\n need to pullout a name (or any other field) from a previous selection to display it to the user. At present, FieldRadio only writes the ID (String) to the form state.'}}}},Template=({component:Component,initialValues,...args},{id:storyId})=>react__WEBPACK_IMPORTED_MODULE_0__.createElement(___WEBPACK_IMPORTED_MODULE_3__.A,{id:storyId,analyticsFormName:"formRadio",submissionTaskName:"SUBMISSION",initialValues},(state=>react__WEBPACK_IMPORTED_MODULE_0__.createElement(react__WEBPACK_IMPORTED_MODULE_0__.Fragment,null,react__WEBPACK_IMPORTED_MODULE_0__.createElement(Component,args),react__WEBPACK_IMPORTED_MODULE_0__.createElement("pre",null,JSON.stringify(state,null,2))))),defaultFormProps='\n id="form-id"\n analyticsFormName="formRadio"\n submissionTaskName="SUBMISSION"',getForm=({component,formProp,componentProp})=>`\n\n`,Radio=Template.bind({});Radio.args={type:"radio"},Radio.parameters={docs:{description:{story:"A group of 4 radio buttons"},source:{code:getForm({component:"FieldChoice.Radio"})}}};const RadioLabel=Template.bind({});RadioLabel.args={...Radio.args,label:"Countries"},RadioLabel.parameters={docs:{description:{story:"Radio button group label"},source:{code:getForm({component:"FieldChoice.Radio",componentProp:'label="Countries"'})}}};const RadioHint=Template.bind({});RadioHint.args={...Radio.args,hint:"Country hint"},RadioHint.parameters={docs:{description:{story:"Radio button group hint text"},source:{code:getForm({component:"FieldChoice.Radio",componentProp:'hint="Country hint"'})}}};const RadioLegend=Template.bind({});RadioLegend.args={...Radio.args,legend:react__WEBPACK_IMPORTED_MODULE_0__.createElement("h1",null,"My H1 legend")},RadioLegend.parameters={docs:{description:{story:"Radio button group legend"},source:{code:getForm({component:"FieldChoice.Radio",componentProp:"legend={My H1 legend }"})}}};const RadioInline=Template.bind({});RadioInline.args={...Radio.args,component:FieldChoiceRadioInline},RadioInline.parameters={docs:{description:{story:"Radio button group inline"},source:{code:getForm({component:"FieldChoiceRadioInline"})}}};const RadioRequired=Template.bind({});RadioRequired.args={...Radio.args,required:"Select at least one country"},RadioRequired.parameters={docs:{description:{story:'Radio button group where a selection is required. Click "Save" to view the form validation error message.'},source:{code:getForm({component:"FieldChoice.Radio",componentProp:'required="Select at least one country"'})}}};const RadioSelected=Template.bind({});RadioSelected.args={...Radio.args,initialValues:{country:options[0]}},RadioSelected.parameters={docs:{description:{story:"Radio button group selected"},source:{code:getForm({component:"FieldChoice.Radio",formProp:`initialValues={{country: ${formatOption(options[0])}}}`})}}};const Checkbox=Template.bind({});Checkbox.args={type:"checkbox"},Checkbox.parameters={docs:{description:{story:"A group of 4 checkboxes."},source:{code:getForm({component:"FieldChoice.Checkbox"})}}};const CheckboxLabel=Template.bind({});CheckboxLabel.args={...Checkbox.args,label:"Countries"},CheckboxLabel.parameters={docs:{description:{story:"Checkbox group label"},source:{code:getForm({component:"FieldChoice.Checkbox",componentProp:'label="Countries"'})}}};const CheckboxHint=Template.bind({});CheckboxHint.args={...Checkbox.args,hint:"Country hint"},CheckboxHint.parameters={docs:{description:{story:"Checkbox group hint text"},source:{code:getForm({component:"FieldChoice.Checkbox",componentProp:'hint="Country hint"'})}}};const CheckboxLegend=Template.bind({});CheckboxLegend.args={...Checkbox.args,legend:react__WEBPACK_IMPORTED_MODULE_0__.createElement(_govuk_react_heading__WEBPACK_IMPORTED_MODULE_1__.H1,null,"My H1 legend")},CheckboxLegend.parameters={docs:{description:{story:"Checkbox group legend"},source:{code:getForm({component:"FieldChoice.Checkbox",componentProp:"legend={My H1 legend }"})}}};const CheckboxInline=Template.bind({});CheckboxInline.args={...Checkbox.args,component:FieldChoiceCheckboxInline},CheckboxInline.parameters={docs:{description:{story:"Checkbox group inline"},source:{code:getForm({component:"FieldChoiceCheckboxInline"})}}};const CheckboxRequired=Template.bind({});CheckboxRequired.args={...Checkbox.args,required:"Choose one or more countries"},CheckboxRequired.parameters={docs:{description:{story:'Checkbox group where a user must choose at least one country. Click "Save" to view the form validation error message.'},source:{code:getForm({component:"FieldChoice.Checkbox",componentProp:'required="Choose one or more countries"'})}}};const CheckboxChecked=Template.bind({});CheckboxChecked.args={...Checkbox.args,initialValues:{country:[options[0],options[1]]}},CheckboxChecked.parameters={docs:{description:{story:"Checkbox group checked"},source:{code:getForm({component:"FieldChoice.Checkbox",formProp:`initialValues={{ country: [${(options=>options.map(formatOption))([options[0],options[1]])}]}}`})}}},Radio.parameters={...Radio.parameters,docs:{...Radio.parameters?.docs,source:{originalSource:'({\n component: Component,\n initialValues,\n ...args\n}, {\n id: storyId\n}) => ',...Radio.parameters?.docs?.source}}},RadioLabel.parameters={...RadioLabel.parameters,docs:{...RadioLabel.parameters?.docs,source:{originalSource:'({\n component: Component,\n initialValues,\n ...args\n}, {\n id: storyId\n}) => ',...RadioLabel.parameters?.docs?.source}}},RadioHint.parameters={...RadioHint.parameters,docs:{...RadioHint.parameters?.docs,source:{originalSource:'({\n component: Component,\n initialValues,\n ...args\n}, {\n id: storyId\n}) => ',...RadioHint.parameters?.docs?.source}}},RadioLegend.parameters={...RadioLegend.parameters,docs:{...RadioLegend.parameters?.docs,source:{originalSource:'({\n component: Component,\n initialValues,\n ...args\n}, {\n id: storyId\n}) => ',...RadioLegend.parameters?.docs?.source}}},RadioInline.parameters={...RadioInline.parameters,docs:{...RadioInline.parameters?.docs,source:{originalSource:'({\n component: Component,\n initialValues,\n ...args\n}, {\n id: storyId\n}) => ',...RadioInline.parameters?.docs?.source}}},RadioRequired.parameters={...RadioRequired.parameters,docs:{...RadioRequired.parameters?.docs,source:{originalSource:'({\n component: Component,\n initialValues,\n ...args\n}, {\n id: storyId\n}) => ',...RadioRequired.parameters?.docs?.source}}},RadioSelected.parameters={...RadioSelected.parameters,docs:{...RadioSelected.parameters?.docs,source:{originalSource:'({\n component: Component,\n initialValues,\n ...args\n}, {\n id: storyId\n}) => ',...RadioSelected.parameters?.docs?.source}}},Checkbox.parameters={...Checkbox.parameters,docs:{...Checkbox.parameters?.docs,source:{originalSource:'({\n component: Component,\n initialValues,\n ...args\n}, {\n id: storyId\n}) => ',...Checkbox.parameters?.docs?.source}}},CheckboxLabel.parameters={...CheckboxLabel.parameters,docs:{...CheckboxLabel.parameters?.docs,source:{originalSource:'({\n component: Component,\n initialValues,\n ...args\n}, {\n id: storyId\n}) => ',...CheckboxLabel.parameters?.docs?.source}}},CheckboxHint.parameters={...CheckboxHint.parameters,docs:{...CheckboxHint.parameters?.docs,source:{originalSource:'({\n component: Component,\n initialValues,\n ...args\n}, {\n id: storyId\n}) => ',...CheckboxHint.parameters?.docs?.source}}},CheckboxLegend.parameters={...CheckboxLegend.parameters,docs:{...CheckboxLegend.parameters?.docs,source:{originalSource:'({\n component: Component,\n initialValues,\n ...args\n}, {\n id: storyId\n}) => ',...CheckboxLegend.parameters?.docs?.source}}},CheckboxInline.parameters={...CheckboxInline.parameters,docs:{...CheckboxInline.parameters?.docs,source:{originalSource:'({\n component: Component,\n initialValues,\n ...args\n}, {\n id: storyId\n}) => ',...CheckboxInline.parameters?.docs?.source}}},CheckboxRequired.parameters={...CheckboxRequired.parameters,docs:{...CheckboxRequired.parameters?.docs,source:{originalSource:'({\n component: Component,\n initialValues,\n ...args\n}, {\n id: storyId\n}) => ',...CheckboxRequired.parameters?.docs?.source}}},CheckboxChecked.parameters={...CheckboxChecked.parameters,docs:{...CheckboxChecked.parameters?.docs,source:{originalSource:'({\n component: Component,\n initialValues,\n ...args\n}, {\n id: storyId\n}) => ',...CheckboxChecked.parameters?.docs?.source}}};const __namedExportsOrder=["Radio","RadioLabel","RadioHint","RadioLegend","RadioInline","RadioRequired","RadioSelected","Checkbox","CheckboxLabel","CheckboxHint","CheckboxLegend","CheckboxInline","CheckboxRequired","CheckboxChecked"]}}]);
+//# sourceMappingURL=Form-elements-__stories__-FieldChoice-stories.843bb4e6.iframe.bundle.js.map
\ No newline at end of file
diff --git a/Form-elements-__stories__-FieldChoice-stories.843bb4e6.iframe.bundle.js.map b/Form-elements-__stories__-FieldChoice-stories.843bb4e6.iframe.bundle.js.map
new file mode 100644
index 00000000000..a34dac63517
--- /dev/null
+++ b/Form-elements-__stories__-FieldChoice-stories.843bb4e6.iframe.bundle.js.map
@@ -0,0 +1 @@
+{"version":3,"file":"Form-elements-__stories__-FieldChoice-stories.843bb4e6.iframe.bundle.js","mappings":";;;;;;;AAaA;AACA;AAEA;AACA;AAEA","sources":["webpack://data-hub-frontend/"],"names":[],"sourceRoot":""}
\ No newline at end of file
diff --git a/Form-elements-__stories__-FieldChoice-stories.db9672ac.iframe.bundle.js b/Form-elements-__stories__-FieldChoice-stories.db9672ac.iframe.bundle.js
deleted file mode 100644
index 7ce5692f2a0..00000000000
--- a/Form-elements-__stories__-FieldChoice-stories.db9672ac.iframe.bundle.js
+++ /dev/null
@@ -1 +0,0 @@
-"use strict";(self.webpackChunkdata_hub_frontend=self.webpackChunkdata_hub_frontend||[]).push([[7163],{"./src/client/components/Form/elements/__stories__/FieldChoice.stories.jsx":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.r(__webpack_exports__),__webpack_require__.d(__webpack_exports__,{Checkbox:()=>Checkbox,CheckboxChecked:()=>CheckboxChecked,CheckboxHint:()=>CheckboxHint,CheckboxInline:()=>CheckboxInline,CheckboxLabel:()=>CheckboxLabel,CheckboxLegend:()=>CheckboxLegend,CheckboxRequired:()=>CheckboxRequired,Radio:()=>Radio,RadioHint:()=>RadioHint,RadioInline:()=>RadioInline,RadioLabel:()=>RadioLabel,RadioLegend:()=>RadioLegend,RadioRequired:()=>RadioRequired,RadioSelected:()=>RadioSelected,__namedExportsOrder:()=>__namedExportsOrder,default:()=>__WEBPACK_DEFAULT_EXPORT__});__webpack_require__("./node_modules/core-js/modules/es.symbol.js"),__webpack_require__("./node_modules/core-js/modules/es.symbol.description.js"),__webpack_require__("./node_modules/core-js/modules/es.symbol.iterator.js"),__webpack_require__("./node_modules/core-js/modules/es.symbol.to-primitive.js"),__webpack_require__("./node_modules/core-js/modules/es.array.filter.js"),__webpack_require__("./node_modules/core-js/modules/es.array.iterator.js"),__webpack_require__("./node_modules/core-js/modules/es.array.slice.js"),__webpack_require__("./node_modules/core-js/modules/es.date.to-primitive.js"),__webpack_require__("./node_modules/core-js/modules/es.number.constructor.js"),__webpack_require__("./node_modules/core-js/modules/es.object.freeze.js"),__webpack_require__("./node_modules/core-js/modules/es.object.get-own-property-descriptor.js"),__webpack_require__("./node_modules/core-js/modules/es.object.get-own-property-descriptors.js"),__webpack_require__("./node_modules/core-js/modules/es.object.keys.js"),__webpack_require__("./node_modules/core-js/modules/es.object.to-string.js"),__webpack_require__("./node_modules/core-js/modules/es.string.iterator.js"),__webpack_require__("./node_modules/core-js/modules/web.dom-collections.for-each.js"),__webpack_require__("./node_modules/core-js/modules/web.dom-collections.iterator.js"),__webpack_require__("./node_modules/core-js/modules/es.array.concat.js"),__webpack_require__("./node_modules/core-js/modules/es.array.map.js");var react__WEBPACK_IMPORTED_MODULE_19__=__webpack_require__("./node_modules/react/index.js"),_govuk_react_heading__WEBPACK_IMPORTED_MODULE_20__=__webpack_require__("./node_modules/@govuk-react/heading/dist/govuk-react-heading.esm.js"),styled_components__WEBPACK_IMPORTED_MODULE_23__=__webpack_require__("./node_modules/styled-components/dist/styled-components.browser.esm.js"),_FieldChoice__WEBPACK_IMPORTED_MODULE_21__=__webpack_require__("./src/client/components/Form/elements/FieldChoice/index.jsx"),___WEBPACK_IMPORTED_MODULE_22__=__webpack_require__("./src/client/components/Form/index.jsx");function _typeof(o){return _typeof="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(o){return typeof o}:function(o){return o&&"function"==typeof Symbol&&o.constructor===Symbol&&o!==Symbol.prototype?"symbol":typeof o},_typeof(o)}var _templateObject,_templateObject2,_templateObject3,_excluded=["component","initialValues"];function ownKeys(e,r){var t=Object.keys(e);if(Object.getOwnPropertySymbols){var o=Object.getOwnPropertySymbols(e);r&&(o=o.filter((function(r){return Object.getOwnPropertyDescriptor(e,r).enumerable}))),t.push.apply(t,o)}return t}function _objectSpread(e){for(var r=1;rFieldChoice component is designed to render a group of radio buttons or checkboxes by setting the prop type to either "radio" or "checkbox" .\n The component sets the entire selected option (Object) to the Form\'s state which is helpful on user journeys where the final page is a summary page and you\n need to pullout a name (or any other field) from a previous selection to display it to the user. At present, FieldRadio only writes the ID (String) to the form state.'}}}};var Template=function Template(_ref,_ref2){var Component=_ref.component,initialValues=_ref.initialValues,args=function _objectWithoutProperties(e,t){if(null==e)return{};var o,r,i=function _objectWithoutPropertiesLoose(r,e){if(null==r)return{};var t={};for(var n in r)if({}.hasOwnProperty.call(r,n)){if(e.indexOf(n)>=0)continue;t[n]=r[n]}return t}(e,t);if(Object.getOwnPropertySymbols){var n=Object.getOwnPropertySymbols(e);for(r=0;r=0||{}.propertyIsEnumerable.call(e,o)&&(i[o]=e[o])}return i}(_ref,_excluded),storyId=_ref2.id;return react__WEBPACK_IMPORTED_MODULE_19__.createElement(___WEBPACK_IMPORTED_MODULE_22__.A,{id:storyId,analyticsFormName:"formRadio",submissionTaskName:"SUBMISSION",initialValues},(function(state){return react__WEBPACK_IMPORTED_MODULE_19__.createElement(react__WEBPACK_IMPORTED_MODULE_19__.Fragment,null,react__WEBPACK_IMPORTED_MODULE_19__.createElement(Component,args),react__WEBPACK_IMPORTED_MODULE_19__.createElement("pre",null,JSON.stringify(state,null,2)))}))},defaultFormProps='\n id="form-id"\n analyticsFormName="formRadio"\n submissionTaskName="SUBMISSION"',getForm=function getForm(_ref3){var component=_ref3.component,formProp=_ref3.formProp,componentProp=_ref3.componentProp,formProps=formProp?"".concat(defaultFormProps,"\n ").concat(formProp):" ".concat(defaultFormProps),componentProps=componentProp?"".concat('name="country"',"\n ").concat(componentProp):"".concat('name="country"');return"\n\n")},Radio=Template.bind({});Radio.args={type:"radio"},Radio.parameters={docs:{description:{story:"A group of 4 radio buttons"},source:{code:getForm({component:"FieldChoice.Radio"})}}};var RadioLabel=Template.bind({});RadioLabel.args=_objectSpread(_objectSpread({},Radio.args),{},{label:"Countries"}),RadioLabel.parameters={docs:{description:{story:"Radio button group label"},source:{code:getForm({component:"FieldChoice.Radio",componentProp:'label="Countries"'})}}};var RadioHint=Template.bind({});RadioHint.args=_objectSpread(_objectSpread({},Radio.args),{},{hint:"Country hint"}),RadioHint.parameters={docs:{description:{story:"Radio button group hint text"},source:{code:getForm({component:"FieldChoice.Radio",componentProp:'hint="Country hint"'})}}};var RadioLegend=Template.bind({});RadioLegend.args=_objectSpread(_objectSpread({},Radio.args),{},{legend:react__WEBPACK_IMPORTED_MODULE_19__.createElement("h1",null,"My H1 legend")}),RadioLegend.parameters={docs:{description:{story:"Radio button group legend"},source:{code:getForm({component:"FieldChoice.Radio",componentProp:"legend={My H1 legend }"})}}};var RadioInline=Template.bind({});RadioInline.args=_objectSpread(_objectSpread({},Radio.args),{},{component:FieldChoiceRadioInline}),RadioInline.parameters={docs:{description:{story:"Radio button group inline"},source:{code:getForm({component:"FieldChoiceRadioInline"})}}};var RadioRequired=Template.bind({});RadioRequired.args=_objectSpread(_objectSpread({},Radio.args),{},{required:"Select at least one country"}),RadioRequired.parameters={docs:{description:{story:'Radio button group where a selection is required. Click "Save" to view the form validation error message.'},source:{code:getForm({component:"FieldChoice.Radio",componentProp:'required="Select at least one country"'})}}};var RadioSelected=Template.bind({});RadioSelected.args=_objectSpread(_objectSpread({},Radio.args),{},{initialValues:{country:options[0]}}),RadioSelected.parameters={docs:{description:{story:"Radio button group selected"},source:{code:getForm({component:"FieldChoice.Radio",formProp:"initialValues={{country: ".concat(formatOption(options[0]),"}}")})}}};var Checkbox=Template.bind({});Checkbox.args={type:"checkbox"},Checkbox.parameters={docs:{description:{story:"A group of 4 checkboxes."},source:{code:getForm({component:"FieldChoice.Checkbox"})}}};var CheckboxLabel=Template.bind({});CheckboxLabel.args=_objectSpread(_objectSpread({},Checkbox.args),{},{label:"Countries"}),CheckboxLabel.parameters={docs:{description:{story:"Checkbox group label"},source:{code:getForm({component:"FieldChoice.Checkbox",componentProp:'label="Countries"'})}}};var CheckboxHint=Template.bind({});CheckboxHint.args=_objectSpread(_objectSpread({},Checkbox.args),{},{hint:"Country hint"}),CheckboxHint.parameters={docs:{description:{story:"Checkbox group hint text"},source:{code:getForm({component:"FieldChoice.Checkbox",componentProp:'hint="Country hint"'})}}};var CheckboxLegend=Template.bind({});CheckboxLegend.args=_objectSpread(_objectSpread({},Checkbox.args),{},{legend:react__WEBPACK_IMPORTED_MODULE_19__.createElement(_govuk_react_heading__WEBPACK_IMPORTED_MODULE_20__.H1,null,"My H1 legend")}),CheckboxLegend.parameters={docs:{description:{story:"Checkbox group legend"},source:{code:getForm({component:"FieldChoice.Checkbox",componentProp:"legend={My H1 legend }"})}}};var CheckboxInline=Template.bind({});CheckboxInline.args=_objectSpread(_objectSpread({},Checkbox.args),{},{component:FieldChoiceCheckboxInline}),CheckboxInline.parameters={docs:{description:{story:"Checkbox group inline"},source:{code:getForm({component:"FieldChoiceCheckboxInline"})}}};var CheckboxRequired=Template.bind({});CheckboxRequired.args=_objectSpread(_objectSpread({},Checkbox.args),{},{required:"Choose one or more countries"}),CheckboxRequired.parameters={docs:{description:{story:'Checkbox group where a user must choose at least one country. Click "Save" to view the form validation error message.'},source:{code:getForm({component:"FieldChoice.Checkbox",componentProp:'required="Choose one or more countries"'})}}};var CheckboxChecked=Template.bind({});CheckboxChecked.args=_objectSpread(_objectSpread({},Checkbox.args),{},{initialValues:{country:[options[0],options[1]]}}),CheckboxChecked.parameters={docs:{description:{story:"Checkbox group checked"},source:{code:getForm({component:"FieldChoice.Checkbox",formProp:"initialValues={{ country: [".concat(function formatOptions(options){return options.map(formatOption)}([options[0],options[1]]),"]}}")})}}},Radio.parameters={...Radio.parameters,docs:{...Radio.parameters?.docs,source:{originalSource:'({\n component: Component,\n initialValues,\n ...args\n}, {\n id: storyId\n}) => ',...Radio.parameters?.docs?.source}}},RadioLabel.parameters={...RadioLabel.parameters,docs:{...RadioLabel.parameters?.docs,source:{originalSource:'({\n component: Component,\n initialValues,\n ...args\n}, {\n id: storyId\n}) => ',...RadioLabel.parameters?.docs?.source}}},RadioHint.parameters={...RadioHint.parameters,docs:{...RadioHint.parameters?.docs,source:{originalSource:'({\n component: Component,\n initialValues,\n ...args\n}, {\n id: storyId\n}) => ',...RadioHint.parameters?.docs?.source}}},RadioLegend.parameters={...RadioLegend.parameters,docs:{...RadioLegend.parameters?.docs,source:{originalSource:'({\n component: Component,\n initialValues,\n ...args\n}, {\n id: storyId\n}) => ',...RadioLegend.parameters?.docs?.source}}},RadioInline.parameters={...RadioInline.parameters,docs:{...RadioInline.parameters?.docs,source:{originalSource:'({\n component: Component,\n initialValues,\n ...args\n}, {\n id: storyId\n}) => ',...RadioInline.parameters?.docs?.source}}},RadioRequired.parameters={...RadioRequired.parameters,docs:{...RadioRequired.parameters?.docs,source:{originalSource:'({\n component: Component,\n initialValues,\n ...args\n}, {\n id: storyId\n}) => ',...RadioRequired.parameters?.docs?.source}}},RadioSelected.parameters={...RadioSelected.parameters,docs:{...RadioSelected.parameters?.docs,source:{originalSource:'({\n component: Component,\n initialValues,\n ...args\n}, {\n id: storyId\n}) => ',...RadioSelected.parameters?.docs?.source}}},Checkbox.parameters={...Checkbox.parameters,docs:{...Checkbox.parameters?.docs,source:{originalSource:'({\n component: Component,\n initialValues,\n ...args\n}, {\n id: storyId\n}) => ',...Checkbox.parameters?.docs?.source}}},CheckboxLabel.parameters={...CheckboxLabel.parameters,docs:{...CheckboxLabel.parameters?.docs,source:{originalSource:'({\n component: Component,\n initialValues,\n ...args\n}, {\n id: storyId\n}) => ',...CheckboxLabel.parameters?.docs?.source}}},CheckboxHint.parameters={...CheckboxHint.parameters,docs:{...CheckboxHint.parameters?.docs,source:{originalSource:'({\n component: Component,\n initialValues,\n ...args\n}, {\n id: storyId\n}) => ',...CheckboxHint.parameters?.docs?.source}}},CheckboxLegend.parameters={...CheckboxLegend.parameters,docs:{...CheckboxLegend.parameters?.docs,source:{originalSource:'({\n component: Component,\n initialValues,\n ...args\n}, {\n id: storyId\n}) => ',...CheckboxLegend.parameters?.docs?.source}}},CheckboxInline.parameters={...CheckboxInline.parameters,docs:{...CheckboxInline.parameters?.docs,source:{originalSource:'({\n component: Component,\n initialValues,\n ...args\n}, {\n id: storyId\n}) => ',...CheckboxInline.parameters?.docs?.source}}},CheckboxRequired.parameters={...CheckboxRequired.parameters,docs:{...CheckboxRequired.parameters?.docs,source:{originalSource:'({\n component: Component,\n initialValues,\n ...args\n}, {\n id: storyId\n}) => ',...CheckboxRequired.parameters?.docs?.source}}},CheckboxChecked.parameters={...CheckboxChecked.parameters,docs:{...CheckboxChecked.parameters?.docs,source:{originalSource:'({\n component: Component,\n initialValues,\n ...args\n}, {\n id: storyId\n}) => ',...CheckboxChecked.parameters?.docs?.source}}};const __namedExportsOrder=["Radio","RadioLabel","RadioHint","RadioLegend","RadioInline","RadioRequired","RadioSelected","Checkbox","CheckboxLabel","CheckboxHint","CheckboxLegend","CheckboxInline","CheckboxRequired","CheckboxChecked"]}}]);
\ No newline at end of file
diff --git a/Form-elements-__stories__-FieldCompaniesTypeahead-stories.583ad718.iframe.bundle.js b/Form-elements-__stories__-FieldCompaniesTypeahead-stories.583ad718.iframe.bundle.js
new file mode 100644
index 00000000000..de754371a48
--- /dev/null
+++ b/Form-elements-__stories__-FieldCompaniesTypeahead-stories.583ad718.iframe.bundle.js
@@ -0,0 +1 @@
+"use strict";(self.webpackChunkdata_hub_frontend=self.webpackChunkdata_hub_frontend||[]).push([[6286],{"./src/client/components/Form/elements/__stories__/FieldCompaniesTypeahead.stories.jsx":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.r(__webpack_exports__),__webpack_require__.d(__webpack_exports__,{Default:()=>Default,__namedExportsOrder:()=>__namedExportsOrder,default:()=>__WEBPACK_DEFAULT_EXPORT__,mockLoadOptions:()=>mockLoadOptions});var react__WEBPACK_IMPORTED_MODULE_0__=__webpack_require__("./node_modules/react/index.js"),_FieldCompaniesTypeahead__WEBPACK_IMPORTED_MODULE_1__=__webpack_require__("./src/client/components/Form/elements/FieldCompaniesTypeahead/index.jsx"),_Form__WEBPACK_IMPORTED_MODULE_2__=__webpack_require__("./src/client/components/Form/index.jsx");const options=[{value:"379f390a-e083-4a2c-9cea-e3b9a08606a7",label:"Company A",isInList:!0,ukRegion:{name:"Bristol"}},{value:"8dcd2bb8-dc73-4a42-8655-4ae42d4d3c5a",label:"Company B",ukRegion:{name:"Cardiff"}},{value:"a6f39399-5bf4-46cb-a686-826f73e9f0ca",label:"Company C",address:{country:{name:"France"}}}],mockLoadOptions=(query="")=>new Promise((resolve=>query&&query.length?setTimeout(resolve,200,options.filter((({label})=>label.toLowerCase().includes(query.toLowerCase())))):resolve([]))),__WEBPACK_DEFAULT_EXPORT__={title:"Form/Form Elements/FieldCompaniesTypeahead",excludeStories:["mockLoadOptions"],parameters:{component:_FieldCompaniesTypeahead__WEBPACK_IMPORTED_MODULE_1__.A}},Default=()=>react__WEBPACK_IMPORTED_MODULE_0__.createElement(_Form__WEBPACK_IMPORTED_MODULE_2__.A,{id:"fieldCompaniesTypeaheadExample",analyticsFormName:"fieldCompaniesTypeaheadExample",submissionTaskName:"Submit Form example"},(()=>react__WEBPACK_IMPORTED_MODULE_0__.createElement(react__WEBPACK_IMPORTED_MODULE_0__.Fragment,null,react__WEBPACK_IMPORTED_MODULE_0__.createElement(_FieldCompaniesTypeahead__WEBPACK_IMPORTED_MODULE_1__.A,{name:"company",loadOptions:mockLoadOptions}))));Default.parameters={...Default.parameters,docs:{...Default.parameters?.docs,source:{originalSource:'() => ',...Default.parameters?.docs?.source}}};const __namedExportsOrder=["mockLoadOptions","Default"]}}]);
\ No newline at end of file
diff --git a/Form-elements-__stories__-FieldCompaniesTypeahead-stories.58786fbf.iframe.bundle.js b/Form-elements-__stories__-FieldCompaniesTypeahead-stories.58786fbf.iframe.bundle.js
deleted file mode 100644
index 2348ef13f9a..00000000000
--- a/Form-elements-__stories__-FieldCompaniesTypeahead-stories.58786fbf.iframe.bundle.js
+++ /dev/null
@@ -1 +0,0 @@
-"use strict";(self.webpackChunkdata_hub_frontend=self.webpackChunkdata_hub_frontend||[]).push([[6286],{"./src/client/components/Form/elements/__stories__/FieldCompaniesTypeahead.stories.jsx":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.r(__webpack_exports__),__webpack_require__.d(__webpack_exports__,{Default:()=>Default,__namedExportsOrder:()=>__namedExportsOrder,default:()=>__WEBPACK_DEFAULT_EXPORT__,mockLoadOptions:()=>mockLoadOptions});__webpack_require__("./node_modules/core-js/modules/es.array.filter.js"),__webpack_require__("./node_modules/core-js/modules/es.array.includes.js"),__webpack_require__("./node_modules/core-js/modules/es.object.to-string.js"),__webpack_require__("./node_modules/core-js/modules/es.promise.js"),__webpack_require__("./node_modules/core-js/modules/es.string.includes.js");var react__WEBPACK_IMPORTED_MODULE_5__=__webpack_require__("./node_modules/react/index.js"),_FieldCompaniesTypeahead__WEBPACK_IMPORTED_MODULE_6__=__webpack_require__("./src/client/components/Form/elements/FieldCompaniesTypeahead/index.jsx"),_Form__WEBPACK_IMPORTED_MODULE_7__=__webpack_require__("./src/client/components/Form/index.jsx"),options=[{value:"379f390a-e083-4a2c-9cea-e3b9a08606a7",label:"Company A",isInList:!0,ukRegion:{name:"Bristol"}},{value:"8dcd2bb8-dc73-4a42-8655-4ae42d4d3c5a",label:"Company B",ukRegion:{name:"Cardiff"}},{value:"a6f39399-5bf4-46cb-a686-826f73e9f0ca",label:"Company C",address:{country:{name:"France"}}}],mockLoadOptions=function mockLoadOptions(){var query=arguments.length>0&&void 0!==arguments[0]?arguments[0]:"";return new Promise((function(resolve){return query&&query.length?setTimeout(resolve,200,options.filter((function(_ref){return _ref.label.toLowerCase().includes(query.toLowerCase())}))):resolve([])}))};const __WEBPACK_DEFAULT_EXPORT__={title:"Form/Form Elements/FieldCompaniesTypeahead",excludeStories:["mockLoadOptions"],parameters:{component:_FieldCompaniesTypeahead__WEBPACK_IMPORTED_MODULE_6__.A}};var Default=function Default(){return react__WEBPACK_IMPORTED_MODULE_5__.createElement(_Form__WEBPACK_IMPORTED_MODULE_7__.A,{id:"fieldCompaniesTypeaheadExample",analyticsFormName:"fieldCompaniesTypeaheadExample",submissionTaskName:"Submit Form example"},(function(){return react__WEBPACK_IMPORTED_MODULE_5__.createElement(react__WEBPACK_IMPORTED_MODULE_5__.Fragment,null,react__WEBPACK_IMPORTED_MODULE_5__.createElement(_FieldCompaniesTypeahead__WEBPACK_IMPORTED_MODULE_6__.A,{name:"company",loadOptions:mockLoadOptions}))}))};Default.parameters={...Default.parameters,docs:{...Default.parameters?.docs,source:{originalSource:'() => ',...Default.parameters?.docs?.source}}};const __namedExportsOrder=["mockLoadOptions","Default"]}}]);
\ No newline at end of file
diff --git a/Form-elements-__stories__-FieldCurrency-stories.46c716f8.iframe.bundle.js b/Form-elements-__stories__-FieldCurrency-stories.46c716f8.iframe.bundle.js
deleted file mode 100644
index 0a310856083..00000000000
--- a/Form-elements-__stories__-FieldCurrency-stories.46c716f8.iframe.bundle.js
+++ /dev/null
@@ -1 +0,0 @@
-"use strict";(self.webpackChunkdata_hub_frontend=self.webpackChunkdata_hub_frontend||[]).push([[1555],{"./src/client/components/Form/elements/__stories__/FieldCurrency.stories.jsx":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.r(__webpack_exports__),__webpack_require__.d(__webpack_exports__,{FieldCurrencyDefaultValidation:()=>FieldCurrencyDefaultValidation,__namedExportsOrder:()=>__namedExportsOrder,default:()=>__WEBPACK_DEFAULT_EXPORT__});var react__WEBPACK_IMPORTED_MODULE_0__=__webpack_require__("./node_modules/react/index.js"),_FieldCurrency__WEBPACK_IMPORTED_MODULE_1__=__webpack_require__("./src/client/components/Form/elements/FieldCurrency/index.jsx"),_Form__WEBPACK_IMPORTED_MODULE_2__=__webpack_require__("./src/client/components/Form/index.jsx");const __WEBPACK_DEFAULT_EXPORT__={title:"Form/Form Elements/Currency",parameters:{component:_FieldCurrency__WEBPACK_IMPORTED_MODULE_1__.A}};var FieldCurrencyDefaultValidation=function FieldCurrencyDefaultValidation(){return react__WEBPACK_IMPORTED_MODULE_0__.createElement(_Form__WEBPACK_IMPORTED_MODULE_2__.A,{id:"fieldCurrencyExample",analyticsFormName:"fieldCurrencyExample",submissionTaskName:"Submit Form example"},(function(){return react__WEBPACK_IMPORTED_MODULE_0__.createElement(react__WEBPACK_IMPORTED_MODULE_0__.Fragment,null,react__WEBPACK_IMPORTED_MODULE_0__.createElement(_FieldCurrency__WEBPACK_IMPORTED_MODULE_1__.A,{name:"currency1",label:"Estimate amount in pounds (bold label)",hint:"For example, £1,000",required:"Enter amount in pounds"}),react__WEBPACK_IMPORTED_MODULE_0__.createElement(_FieldCurrency__WEBPACK_IMPORTED_MODULE_1__.A,{name:"currency2",label:"Estimate amount in pounds (not bold label)",hint:"For example, £1,000",required:"Enter amount in pounds",boldLabel:!1}))}))};FieldCurrencyDefaultValidation.story={name:"FieldCurrency - default validation"},FieldCurrencyDefaultValidation.parameters={...FieldCurrencyDefaultValidation.parameters,docs:{...FieldCurrencyDefaultValidation.parameters?.docs,source:{originalSource:'() => ',...FieldCurrencyDefaultValidation.parameters?.docs?.source}}};const __namedExportsOrder=["FieldCurrencyDefaultValidation"]}}]);
\ No newline at end of file
diff --git a/Form-elements-__stories__-FieldCurrency-stories.db9f8256.iframe.bundle.js b/Form-elements-__stories__-FieldCurrency-stories.db9f8256.iframe.bundle.js
new file mode 100644
index 00000000000..f06a6e193af
--- /dev/null
+++ b/Form-elements-__stories__-FieldCurrency-stories.db9f8256.iframe.bundle.js
@@ -0,0 +1 @@
+"use strict";(self.webpackChunkdata_hub_frontend=self.webpackChunkdata_hub_frontend||[]).push([[1555],{"./src/client/components/Form/elements/__stories__/FieldCurrency.stories.jsx":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.r(__webpack_exports__),__webpack_require__.d(__webpack_exports__,{FieldCurrencyDefaultValidation:()=>FieldCurrencyDefaultValidation,__namedExportsOrder:()=>__namedExportsOrder,default:()=>__WEBPACK_DEFAULT_EXPORT__});var react__WEBPACK_IMPORTED_MODULE_0__=__webpack_require__("./node_modules/react/index.js"),_FieldCurrency__WEBPACK_IMPORTED_MODULE_1__=__webpack_require__("./src/client/components/Form/elements/FieldCurrency/index.jsx"),_Form__WEBPACK_IMPORTED_MODULE_2__=__webpack_require__("./src/client/components/Form/index.jsx");const __WEBPACK_DEFAULT_EXPORT__={title:"Form/Form Elements/Currency",parameters:{component:_FieldCurrency__WEBPACK_IMPORTED_MODULE_1__.A}},FieldCurrencyDefaultValidation=()=>react__WEBPACK_IMPORTED_MODULE_0__.createElement(_Form__WEBPACK_IMPORTED_MODULE_2__.A,{id:"fieldCurrencyExample",analyticsFormName:"fieldCurrencyExample",submissionTaskName:"Submit Form example"},(()=>react__WEBPACK_IMPORTED_MODULE_0__.createElement(react__WEBPACK_IMPORTED_MODULE_0__.Fragment,null,react__WEBPACK_IMPORTED_MODULE_0__.createElement(_FieldCurrency__WEBPACK_IMPORTED_MODULE_1__.A,{name:"currency1",label:"Estimate amount in pounds (bold label)",hint:"For example, £1,000",required:"Enter amount in pounds"}),react__WEBPACK_IMPORTED_MODULE_0__.createElement(_FieldCurrency__WEBPACK_IMPORTED_MODULE_1__.A,{name:"currency2",label:"Estimate amount in pounds (not bold label)",hint:"For example, £1,000",required:"Enter amount in pounds",boldLabel:!1}))));FieldCurrencyDefaultValidation.story={name:"FieldCurrency - default validation"},FieldCurrencyDefaultValidation.parameters={...FieldCurrencyDefaultValidation.parameters,docs:{...FieldCurrencyDefaultValidation.parameters?.docs,source:{originalSource:'() => ',...FieldCurrencyDefaultValidation.parameters?.docs?.source}}};const __namedExportsOrder=["FieldCurrencyDefaultValidation"]}}]);
\ No newline at end of file
diff --git a/Form-elements-__stories__-FieldDate-stories.cac443d5.iframe.bundle.js b/Form-elements-__stories__-FieldDate-stories.cac443d5.iframe.bundle.js
new file mode 100644
index 00000000000..8d2c6d2e4cf
--- /dev/null
+++ b/Form-elements-__stories__-FieldDate-stories.cac443d5.iframe.bundle.js
@@ -0,0 +1 @@
+"use strict";(self.webpackChunkdata_hub_frontend=self.webpackChunkdata_hub_frontend||[]).push([[8262],{"./src/client/components/Form/elements/__stories__/FieldDate.stories.jsx":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.r(__webpack_exports__),__webpack_require__.d(__webpack_exports__,{FieldDateCustomValidation:()=>FieldDateCustomValidation,FieldDateDefaultValidation:()=>FieldDateDefaultValidation,FieldDateReduced:()=>FieldDateReduced,FieldDateShortFormat:()=>FieldDateShortFormat,__namedExportsOrder:()=>__namedExportsOrder,default:()=>__WEBPACK_DEFAULT_EXPORT__});var react__WEBPACK_IMPORTED_MODULE_0__=__webpack_require__("./node_modules/react/index.js"),_FieldDate__WEBPACK_IMPORTED_MODULE_1__=__webpack_require__("./src/client/components/Form/elements/FieldDate/index.jsx"),_Form__WEBPACK_IMPORTED_MODULE_2__=__webpack_require__("./src/client/components/Form/index.jsx");const ERRORS_DAY="Enter a valid Epoch day",ERRORS_MONTH="Enter a valid Epoch month",ERRORS_YEAR="Enter a valid Epoch year",__WEBPACK_DEFAULT_EXPORT__={title:"Form/Form Elements/Date",parameters:{component:_FieldDate__WEBPACK_IMPORTED_MODULE_1__.A}},FieldDateDefaultValidation=()=>react__WEBPACK_IMPORTED_MODULE_0__.createElement(_Form__WEBPACK_IMPORTED_MODULE_2__.A,{id:"fieldDateExample",analyticsFormName:"fieldDateExample",submissionTaskName:"Submit Form example"},(form=>react__WEBPACK_IMPORTED_MODULE_0__.createElement(react__WEBPACK_IMPORTED_MODULE_0__.Fragment,null,react__WEBPACK_IMPORTED_MODULE_0__.createElement(_FieldDate__WEBPACK_IMPORTED_MODULE_1__.A,{name:"date",label:"What is your date of birth?",hint:"For example, 01 09 2019",required:"Enter a valid date of birth"}),react__WEBPACK_IMPORTED_MODULE_0__.createElement("pre",null,JSON.stringify(form,null,2)))));FieldDateDefaultValidation.story={name:"FieldDate - default validation"};const FieldDateCustomValidation=()=>react__WEBPACK_IMPORTED_MODULE_0__.createElement(_Form__WEBPACK_IMPORTED_MODULE_2__.A,{id:"fieldDateExample",analyticsFormName:"fieldDateExample",submissionTaskName:"Submit Form example"},(form=>react__WEBPACK_IMPORTED_MODULE_0__.createElement(react__WEBPACK_IMPORTED_MODULE_0__.Fragment,null,react__WEBPACK_IMPORTED_MODULE_0__.createElement(_FieldDate__WEBPACK_IMPORTED_MODULE_1__.A,{name:"date",label:"What date is Unix epoch?",hint:"For example, 01 09 2019",required:"Enter a valid Unix epoch date",validate:({day,month,year})=>("01"===day?null:ERRORS_DAY)||("01"===month?null:ERRORS_MONTH)||("1970"===year?null:ERRORS_YEAR)}),react__WEBPACK_IMPORTED_MODULE_0__.createElement("pre",null,JSON.stringify(form,null,2)))));FieldDateCustomValidation.story={name:"FieldDate - custom validation"};const FieldDateShortFormat=()=>react__WEBPACK_IMPORTED_MODULE_0__.createElement(_Form__WEBPACK_IMPORTED_MODULE_2__.A,{id:"fieldDateExample",analyticsFormName:"fieldDateExample",submissionTaskName:"Submit Form example"},(form=>react__WEBPACK_IMPORTED_MODULE_0__.createElement(react__WEBPACK_IMPORTED_MODULE_0__.Fragment,null,react__WEBPACK_IMPORTED_MODULE_0__.createElement(_FieldDate__WEBPACK_IMPORTED_MODULE_1__.A,{format:"short",name:"date",label:"What is the month and year?",hint:"For example, 09 2019",required:"Enter a valid date"}),react__WEBPACK_IMPORTED_MODULE_0__.createElement("pre",null,JSON.stringify(form,null,2)))));FieldDateShortFormat.story={name:"FieldDate - short format"};const FieldDateReduced=()=>react__WEBPACK_IMPORTED_MODULE_0__.createElement(_Form__WEBPACK_IMPORTED_MODULE_2__.A,{id:"fieldDateExample",analyticsFormName:"fieldDateExample",submissionTaskName:"Submit Form example"},(form=>react__WEBPACK_IMPORTED_MODULE_0__.createElement(react__WEBPACK_IMPORTED_MODULE_0__.Fragment,null,react__WEBPACK_IMPORTED_MODULE_0__.createElement(_FieldDate__WEBPACK_IMPORTED_MODULE_1__.A,{name:"date",label:"What is the month and year?",hint:"For example, 09 2019",required:"Enter a valid date",reduced:!0}),react__WEBPACK_IMPORTED_MODULE_0__.createElement("pre",null,JSON.stringify(form,null,2)))));FieldDateReduced.story={name:"FieldDate (reduced)"},FieldDateDefaultValidation.parameters={...FieldDateDefaultValidation.parameters,docs:{...FieldDateDefaultValidation.parameters?.docs,source:{originalSource:'() => ',...FieldDateDefaultValidation.parameters?.docs?.source}}},FieldDateCustomValidation.parameters={...FieldDateCustomValidation.parameters,docs:{...FieldDateCustomValidation.parameters?.docs,source:{originalSource:'() => ',...FieldDateCustomValidation.parameters?.docs?.source}}},FieldDateShortFormat.parameters={...FieldDateShortFormat.parameters,docs:{...FieldDateShortFormat.parameters?.docs,source:{originalSource:'() => ',...FieldDateShortFormat.parameters?.docs?.source}}},FieldDateReduced.parameters={...FieldDateReduced.parameters,docs:{...FieldDateReduced.parameters?.docs,source:{originalSource:'() => ',...FieldDateReduced.parameters?.docs?.source}}};const __namedExportsOrder=["FieldDateDefaultValidation","FieldDateCustomValidation","FieldDateShortFormat","FieldDateReduced"]}}]);
\ No newline at end of file
diff --git a/Form-elements-__stories__-FieldDate-stories.d29f31d3.iframe.bundle.js b/Form-elements-__stories__-FieldDate-stories.d29f31d3.iframe.bundle.js
deleted file mode 100644
index 62205fc5d29..00000000000
--- a/Form-elements-__stories__-FieldDate-stories.d29f31d3.iframe.bundle.js
+++ /dev/null
@@ -1 +0,0 @@
-"use strict";(self.webpackChunkdata_hub_frontend=self.webpackChunkdata_hub_frontend||[]).push([[8262],{"./src/client/components/Form/elements/__stories__/FieldDate.stories.jsx":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.r(__webpack_exports__),__webpack_require__.d(__webpack_exports__,{FieldDateCustomValidation:()=>FieldDateCustomValidation,FieldDateDefaultValidation:()=>FieldDateDefaultValidation,FieldDateReduced:()=>FieldDateReduced,FieldDateShortFormat:()=>FieldDateShortFormat,__namedExportsOrder:()=>__namedExportsOrder,default:()=>__WEBPACK_DEFAULT_EXPORT__});var react__WEBPACK_IMPORTED_MODULE_0__=__webpack_require__("./node_modules/react/index.js"),_FieldDate__WEBPACK_IMPORTED_MODULE_1__=__webpack_require__("./src/client/components/Form/elements/FieldDate/index.jsx"),_Form__WEBPACK_IMPORTED_MODULE_2__=__webpack_require__("./src/client/components/Form/index.jsx"),ERRORS_DAY="Enter a valid Epoch day",ERRORS_MONTH="Enter a valid Epoch month",ERRORS_YEAR="Enter a valid Epoch year";const __WEBPACK_DEFAULT_EXPORT__={title:"Form/Form Elements/Date",parameters:{component:_FieldDate__WEBPACK_IMPORTED_MODULE_1__.A}};var FieldDateDefaultValidation=function FieldDateDefaultValidation(){return react__WEBPACK_IMPORTED_MODULE_0__.createElement(_Form__WEBPACK_IMPORTED_MODULE_2__.A,{id:"fieldDateExample",analyticsFormName:"fieldDateExample",submissionTaskName:"Submit Form example"},(function(form){return react__WEBPACK_IMPORTED_MODULE_0__.createElement(react__WEBPACK_IMPORTED_MODULE_0__.Fragment,null,react__WEBPACK_IMPORTED_MODULE_0__.createElement(_FieldDate__WEBPACK_IMPORTED_MODULE_1__.A,{name:"date",label:"What is your date of birth?",hint:"For example, 01 09 2019",required:"Enter a valid date of birth"}),react__WEBPACK_IMPORTED_MODULE_0__.createElement("pre",null,JSON.stringify(form,null,2)))}))};FieldDateDefaultValidation.story={name:"FieldDate - default validation"};var FieldDateCustomValidation=function FieldDateCustomValidation(){return react__WEBPACK_IMPORTED_MODULE_0__.createElement(_Form__WEBPACK_IMPORTED_MODULE_2__.A,{id:"fieldDateExample",analyticsFormName:"fieldDateExample",submissionTaskName:"Submit Form example"},(function(form){return react__WEBPACK_IMPORTED_MODULE_0__.createElement(react__WEBPACK_IMPORTED_MODULE_0__.Fragment,null,react__WEBPACK_IMPORTED_MODULE_0__.createElement(_FieldDate__WEBPACK_IMPORTED_MODULE_1__.A,{name:"date",label:"What date is Unix epoch?",hint:"For example, 01 09 2019",required:"Enter a valid Unix epoch date",validate:function validate(_ref){var day=_ref.day,month=_ref.month,year=_ref.year;return("01"===day?null:ERRORS_DAY)||("01"===month?null:ERRORS_MONTH)||("1970"===year?null:ERRORS_YEAR)}}),react__WEBPACK_IMPORTED_MODULE_0__.createElement("pre",null,JSON.stringify(form,null,2)))}))};FieldDateCustomValidation.story={name:"FieldDate - custom validation"};var FieldDateShortFormat=function FieldDateShortFormat(){return react__WEBPACK_IMPORTED_MODULE_0__.createElement(_Form__WEBPACK_IMPORTED_MODULE_2__.A,{id:"fieldDateExample",analyticsFormName:"fieldDateExample",submissionTaskName:"Submit Form example"},(function(form){return react__WEBPACK_IMPORTED_MODULE_0__.createElement(react__WEBPACK_IMPORTED_MODULE_0__.Fragment,null,react__WEBPACK_IMPORTED_MODULE_0__.createElement(_FieldDate__WEBPACK_IMPORTED_MODULE_1__.A,{format:"short",name:"date",label:"What is the month and year?",hint:"For example, 09 2019",required:"Enter a valid date"}),react__WEBPACK_IMPORTED_MODULE_0__.createElement("pre",null,JSON.stringify(form,null,2)))}))};FieldDateShortFormat.story={name:"FieldDate - short format"};var FieldDateReduced=function FieldDateReduced(){return react__WEBPACK_IMPORTED_MODULE_0__.createElement(_Form__WEBPACK_IMPORTED_MODULE_2__.A,{id:"fieldDateExample",analyticsFormName:"fieldDateExample",submissionTaskName:"Submit Form example"},(function(form){return react__WEBPACK_IMPORTED_MODULE_0__.createElement(react__WEBPACK_IMPORTED_MODULE_0__.Fragment,null,react__WEBPACK_IMPORTED_MODULE_0__.createElement(_FieldDate__WEBPACK_IMPORTED_MODULE_1__.A,{name:"date",label:"What is the month and year?",hint:"For example, 09 2019",required:"Enter a valid date",reduced:!0}),react__WEBPACK_IMPORTED_MODULE_0__.createElement("pre",null,JSON.stringify(form,null,2)))}))};FieldDateReduced.story={name:"FieldDate (reduced)"},FieldDateDefaultValidation.parameters={...FieldDateDefaultValidation.parameters,docs:{...FieldDateDefaultValidation.parameters?.docs,source:{originalSource:'() => ',...FieldDateDefaultValidation.parameters?.docs?.source}}},FieldDateCustomValidation.parameters={...FieldDateCustomValidation.parameters,docs:{...FieldDateCustomValidation.parameters?.docs,source:{originalSource:'() => ',...FieldDateCustomValidation.parameters?.docs?.source}}},FieldDateShortFormat.parameters={...FieldDateShortFormat.parameters,docs:{...FieldDateShortFormat.parameters?.docs,source:{originalSource:'() => ',...FieldDateShortFormat.parameters?.docs?.source}}},FieldDateReduced.parameters={...FieldDateReduced.parameters,docs:{...FieldDateReduced.parameters?.docs,source:{originalSource:'() => ',...FieldDateReduced.parameters?.docs?.source}}};const __namedExportsOrder=["FieldDateDefaultValidation","FieldDateCustomValidation","FieldDateShortFormat","FieldDateReduced"]}}]);
\ No newline at end of file
diff --git a/Form-elements-__stories__-FieldHelp-stories.6723239c.iframe.bundle.js b/Form-elements-__stories__-FieldHelp-stories.6723239c.iframe.bundle.js
new file mode 100644
index 00000000000..b6dfe49a2cf
--- /dev/null
+++ b/Form-elements-__stories__-FieldHelp-stories.6723239c.iframe.bundle.js
@@ -0,0 +1 @@
+"use strict";(self.webpackChunkdata_hub_frontend=self.webpackChunkdata_hub_frontend||[]).push([[3943],{"./src/client/components/Form/elements/__stories__/FieldHelp.stories.jsx":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.r(__webpack_exports__),__webpack_require__.d(__webpack_exports__,{FieldHelpSetAsOpen:()=>FieldHelpSetAsOpen,FieldHelpWithFooterUrl:()=>FieldHelpWithFooterUrl,FieldHelpWithoutFooterUrl:()=>FieldHelpWithoutFooterUrl,__namedExportsOrder:()=>__namedExportsOrder,default:()=>__WEBPACK_DEFAULT_EXPORT__});var react__WEBPACK_IMPORTED_MODULE_0__=__webpack_require__("./node_modules/react/index.js"),_FieldHelp__WEBPACK_IMPORTED_MODULE_1__=__webpack_require__("./src/client/components/Form/elements/FieldHelp/index.jsx");const __WEBPACK_DEFAULT_EXPORT__={title:"Form/Form Elements/Help",parameters:{component:_FieldHelp__WEBPACK_IMPORTED_MODULE_1__.A}},FieldHelpWithFooterUrl=()=>react__WEBPACK_IMPORTED_MODULE_0__.createElement(react__WEBPACK_IMPORTED_MODULE_0__.Fragment,null,react__WEBPACK_IMPORTED_MODULE_0__.createElement(_FieldHelp__WEBPACK_IMPORTED_MODULE_1__.A,{helpSummary:"Help with policy issue types",helpText:"A policy is the broad category/categories that information fits into.",footerUrl:"http://datahub.trade.gov.uk/",footerUrlDescription:"Learn more about policy issue types. This will open in a new tab or window"}));FieldHelpWithFooterUrl.story={name:"FieldHelp - with footer URL"};const FieldHelpWithoutFooterUrl=()=>react__WEBPACK_IMPORTED_MODULE_0__.createElement(react__WEBPACK_IMPORTED_MODULE_0__.Fragment,null,react__WEBPACK_IMPORTED_MODULE_0__.createElement(_FieldHelp__WEBPACK_IMPORTED_MODULE_1__.A,{helpSummary:"Help with policy issue types",helpText:"A policy is the broad category/categories that information fits into."}));FieldHelpWithoutFooterUrl.story={name:"FieldHelp - without footer URL"};const FieldHelpSetAsOpen=()=>react__WEBPACK_IMPORTED_MODULE_0__.createElement(react__WEBPACK_IMPORTED_MODULE_0__.Fragment,null,react__WEBPACK_IMPORTED_MODULE_0__.createElement(_FieldHelp__WEBPACK_IMPORTED_MODULE_1__.A,{helpSummary:"Help with policy issue types",helpText:"A policy is the broad category/categories that information fits into.",open:"true"}));FieldHelpSetAsOpen.story={name:"FieldHelp - set as open"},FieldHelpWithFooterUrl.parameters={...FieldHelpWithFooterUrl.parameters,docs:{...FieldHelpWithFooterUrl.parameters?.docs,source:{originalSource:'() => <>\n \n >',...FieldHelpWithFooterUrl.parameters?.docs?.source}}},FieldHelpWithoutFooterUrl.parameters={...FieldHelpWithoutFooterUrl.parameters,docs:{...FieldHelpWithoutFooterUrl.parameters?.docs,source:{originalSource:'() => <>\n \n >',...FieldHelpWithoutFooterUrl.parameters?.docs?.source}}},FieldHelpSetAsOpen.parameters={...FieldHelpSetAsOpen.parameters,docs:{...FieldHelpSetAsOpen.parameters?.docs,source:{originalSource:'() => <>\n \n >',...FieldHelpSetAsOpen.parameters?.docs?.source}}};const __namedExportsOrder=["FieldHelpWithFooterUrl","FieldHelpWithoutFooterUrl","FieldHelpSetAsOpen"]}}]);
\ No newline at end of file
diff --git a/Form-elements-__stories__-FieldHelp-stories.ae66ed8a.iframe.bundle.js b/Form-elements-__stories__-FieldHelp-stories.ae66ed8a.iframe.bundle.js
deleted file mode 100644
index b8e1c2a4496..00000000000
--- a/Form-elements-__stories__-FieldHelp-stories.ae66ed8a.iframe.bundle.js
+++ /dev/null
@@ -1 +0,0 @@
-"use strict";(self.webpackChunkdata_hub_frontend=self.webpackChunkdata_hub_frontend||[]).push([[3943],{"./src/client/components/Form/elements/__stories__/FieldHelp.stories.jsx":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.r(__webpack_exports__),__webpack_require__.d(__webpack_exports__,{FieldHelpSetAsOpen:()=>FieldHelpSetAsOpen,FieldHelpWithFooterUrl:()=>FieldHelpWithFooterUrl,FieldHelpWithoutFooterUrl:()=>FieldHelpWithoutFooterUrl,__namedExportsOrder:()=>__namedExportsOrder,default:()=>__WEBPACK_DEFAULT_EXPORT__});var react__WEBPACK_IMPORTED_MODULE_0__=__webpack_require__("./node_modules/react/index.js"),_FieldHelp__WEBPACK_IMPORTED_MODULE_1__=__webpack_require__("./src/client/components/Form/elements/FieldHelp/index.jsx");const __WEBPACK_DEFAULT_EXPORT__={title:"Form/Form Elements/Help",parameters:{component:_FieldHelp__WEBPACK_IMPORTED_MODULE_1__.A}};var FieldHelpWithFooterUrl=function FieldHelpWithFooterUrl(){return react__WEBPACK_IMPORTED_MODULE_0__.createElement(react__WEBPACK_IMPORTED_MODULE_0__.Fragment,null,react__WEBPACK_IMPORTED_MODULE_0__.createElement(_FieldHelp__WEBPACK_IMPORTED_MODULE_1__.A,{helpSummary:"Help with policy issue types",helpText:"A policy is the broad category/categories that information fits into.",footerUrl:"http://datahub.trade.gov.uk/",footerUrlDescription:"Learn more about policy issue types. This will open in a new tab or window"}))};FieldHelpWithFooterUrl.story={name:"FieldHelp - with footer URL"};var FieldHelpWithoutFooterUrl=function FieldHelpWithoutFooterUrl(){return react__WEBPACK_IMPORTED_MODULE_0__.createElement(react__WEBPACK_IMPORTED_MODULE_0__.Fragment,null,react__WEBPACK_IMPORTED_MODULE_0__.createElement(_FieldHelp__WEBPACK_IMPORTED_MODULE_1__.A,{helpSummary:"Help with policy issue types",helpText:"A policy is the broad category/categories that information fits into."}))};FieldHelpWithoutFooterUrl.story={name:"FieldHelp - without footer URL"};var FieldHelpSetAsOpen=function FieldHelpSetAsOpen(){return react__WEBPACK_IMPORTED_MODULE_0__.createElement(react__WEBPACK_IMPORTED_MODULE_0__.Fragment,null,react__WEBPACK_IMPORTED_MODULE_0__.createElement(_FieldHelp__WEBPACK_IMPORTED_MODULE_1__.A,{helpSummary:"Help with policy issue types",helpText:"A policy is the broad category/categories that information fits into.",open:"true"}))};FieldHelpSetAsOpen.story={name:"FieldHelp - set as open"},FieldHelpWithFooterUrl.parameters={...FieldHelpWithFooterUrl.parameters,docs:{...FieldHelpWithFooterUrl.parameters?.docs,source:{originalSource:'() => <>\n \n >',...FieldHelpWithFooterUrl.parameters?.docs?.source}}},FieldHelpWithoutFooterUrl.parameters={...FieldHelpWithoutFooterUrl.parameters,docs:{...FieldHelpWithoutFooterUrl.parameters?.docs,source:{originalSource:'() => <>\n \n >',...FieldHelpWithoutFooterUrl.parameters?.docs?.source}}},FieldHelpSetAsOpen.parameters={...FieldHelpSetAsOpen.parameters,docs:{...FieldHelpSetAsOpen.parameters?.docs,source:{originalSource:'() => <>\n \n >',...FieldHelpSetAsOpen.parameters?.docs?.source}}};const __namedExportsOrder=["FieldHelpWithFooterUrl","FieldHelpWithoutFooterUrl","FieldHelpSetAsOpen"]}}]);
\ No newline at end of file
diff --git a/Form-elements-__stories__-FieldInput-stories.44dba0b1.iframe.bundle.js b/Form-elements-__stories__-FieldInput-stories.44dba0b1.iframe.bundle.js
deleted file mode 100644
index eda18486778..00000000000
--- a/Form-elements-__stories__-FieldInput-stories.44dba0b1.iframe.bundle.js
+++ /dev/null
@@ -1 +0,0 @@
-"use strict";(self.webpackChunkdata_hub_frontend=self.webpackChunkdata_hub_frontend||[]).push([[7310],{"./src/client/components/Form/elements/__stories__/FieldInput.stories.jsx":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.r(__webpack_exports__),__webpack_require__.d(__webpack_exports__,{Number:()=>Number,Text:()=>Text,TextReduced:()=>TextReduced,__namedExportsOrder:()=>__namedExportsOrder,default:()=>__WEBPACK_DEFAULT_EXPORT__});var react__WEBPACK_IMPORTED_MODULE_0__=__webpack_require__("./node_modules/react/index.js"),_FieldInput__WEBPACK_IMPORTED_MODULE_1__=__webpack_require__("./src/client/components/Form/elements/FieldInput/index.jsx"),_Form__WEBPACK_IMPORTED_MODULE_2__=__webpack_require__("./src/client/components/Form/index.jsx");const __WEBPACK_DEFAULT_EXPORT__={title:"Form/Form Elements/Input",parameters:{component:_FieldInput__WEBPACK_IMPORTED_MODULE_1__.A}};var Text=function Text(){return react__WEBPACK_IMPORTED_MODULE_0__.createElement(_Form__WEBPACK_IMPORTED_MODULE_2__.A,{id:"fieldInputExample",analyticsFormName:"fieldInputExample",submissionTaskName:"Submit Form example"},(function(state){return react__WEBPACK_IMPORTED_MODULE_0__.createElement(react__WEBPACK_IMPORTED_MODULE_0__.Fragment,null,react__WEBPACK_IMPORTED_MODULE_0__.createElement(_FieldInput__WEBPACK_IMPORTED_MODULE_1__.A,{label:"Text",hint:"Some hint",name:"testField",required:"Enter text",type:"text"}),react__WEBPACK_IMPORTED_MODULE_0__.createElement("pre",null,JSON.stringify(state,null,2)))}))},Number=function Number(){return react__WEBPACK_IMPORTED_MODULE_0__.createElement(_Form__WEBPACK_IMPORTED_MODULE_2__.A,{id:"fieldInputExample",analyticsFormName:"fieldInputExample",submissionTaskName:"Submit Form example"},(function(state){return react__WEBPACK_IMPORTED_MODULE_0__.createElement(react__WEBPACK_IMPORTED_MODULE_0__.Fragment,null,react__WEBPACK_IMPORTED_MODULE_0__.createElement(_FieldInput__WEBPACK_IMPORTED_MODULE_1__.A,{label:"Number",hint:"Some hint",name:"testField",required:"Enter number",type:"number"}),react__WEBPACK_IMPORTED_MODULE_0__.createElement("pre",null,JSON.stringify(state,null,2)))}))},TextReduced=function TextReduced(){return react__WEBPACK_IMPORTED_MODULE_0__.createElement(_Form__WEBPACK_IMPORTED_MODULE_2__.A,{id:"fieldInputExample",analyticsFormName:"fieldInputExample",submissionTaskName:"Submit Form example"},(function(state){return react__WEBPACK_IMPORTED_MODULE_0__.createElement(react__WEBPACK_IMPORTED_MODULE_0__.Fragment,null,react__WEBPACK_IMPORTED_MODULE_0__.createElement(_FieldInput__WEBPACK_IMPORTED_MODULE_1__.A,{label:"Text",hint:"Some hint",name:"testField",required:"Enter text",type:"text",reduced:!0}),react__WEBPACK_IMPORTED_MODULE_0__.createElement("pre",null,JSON.stringify(state,null,2)))}))};TextReduced.story={name:"Text (reduced)"},Text.parameters={...Text.parameters,docs:{...Text.parameters?.docs,source:{originalSource:'() => ',...Text.parameters?.docs?.source}}},Number.parameters={...Number.parameters,docs:{...Number.parameters?.docs,source:{originalSource:'() => ',...Number.parameters?.docs?.source}}},TextReduced.parameters={...TextReduced.parameters,docs:{...TextReduced.parameters?.docs,source:{originalSource:'() => ',...TextReduced.parameters?.docs?.source}}};const __namedExportsOrder=["Text","Number","TextReduced"]}}]);
\ No newline at end of file
diff --git a/Form-elements-__stories__-FieldInput-stories.b8219fb2.iframe.bundle.js b/Form-elements-__stories__-FieldInput-stories.b8219fb2.iframe.bundle.js
new file mode 100644
index 00000000000..fb2f82101bf
--- /dev/null
+++ b/Form-elements-__stories__-FieldInput-stories.b8219fb2.iframe.bundle.js
@@ -0,0 +1 @@
+"use strict";(self.webpackChunkdata_hub_frontend=self.webpackChunkdata_hub_frontend||[]).push([[7310],{"./src/client/components/Form/elements/__stories__/FieldInput.stories.jsx":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.r(__webpack_exports__),__webpack_require__.d(__webpack_exports__,{Number:()=>Number,Text:()=>Text,TextReduced:()=>TextReduced,__namedExportsOrder:()=>__namedExportsOrder,default:()=>__WEBPACK_DEFAULT_EXPORT__});var react__WEBPACK_IMPORTED_MODULE_0__=__webpack_require__("./node_modules/react/index.js"),_FieldInput__WEBPACK_IMPORTED_MODULE_1__=__webpack_require__("./src/client/components/Form/elements/FieldInput/index.jsx"),_Form__WEBPACK_IMPORTED_MODULE_2__=__webpack_require__("./src/client/components/Form/index.jsx");const __WEBPACK_DEFAULT_EXPORT__={title:"Form/Form Elements/Input",parameters:{component:_FieldInput__WEBPACK_IMPORTED_MODULE_1__.A}},Text=()=>react__WEBPACK_IMPORTED_MODULE_0__.createElement(_Form__WEBPACK_IMPORTED_MODULE_2__.A,{id:"fieldInputExample",analyticsFormName:"fieldInputExample",submissionTaskName:"Submit Form example"},(state=>react__WEBPACK_IMPORTED_MODULE_0__.createElement(react__WEBPACK_IMPORTED_MODULE_0__.Fragment,null,react__WEBPACK_IMPORTED_MODULE_0__.createElement(_FieldInput__WEBPACK_IMPORTED_MODULE_1__.A,{label:"Text",hint:"Some hint",name:"testField",required:"Enter text",type:"text"}),react__WEBPACK_IMPORTED_MODULE_0__.createElement("pre",null,JSON.stringify(state,null,2))))),Number=()=>react__WEBPACK_IMPORTED_MODULE_0__.createElement(_Form__WEBPACK_IMPORTED_MODULE_2__.A,{id:"fieldInputExample",analyticsFormName:"fieldInputExample",submissionTaskName:"Submit Form example"},(state=>react__WEBPACK_IMPORTED_MODULE_0__.createElement(react__WEBPACK_IMPORTED_MODULE_0__.Fragment,null,react__WEBPACK_IMPORTED_MODULE_0__.createElement(_FieldInput__WEBPACK_IMPORTED_MODULE_1__.A,{label:"Number",hint:"Some hint",name:"testField",required:"Enter number",type:"number"}),react__WEBPACK_IMPORTED_MODULE_0__.createElement("pre",null,JSON.stringify(state,null,2))))),TextReduced=()=>react__WEBPACK_IMPORTED_MODULE_0__.createElement(_Form__WEBPACK_IMPORTED_MODULE_2__.A,{id:"fieldInputExample",analyticsFormName:"fieldInputExample",submissionTaskName:"Submit Form example"},(state=>react__WEBPACK_IMPORTED_MODULE_0__.createElement(react__WEBPACK_IMPORTED_MODULE_0__.Fragment,null,react__WEBPACK_IMPORTED_MODULE_0__.createElement(_FieldInput__WEBPACK_IMPORTED_MODULE_1__.A,{label:"Text",hint:"Some hint",name:"testField",required:"Enter text",type:"text",reduced:!0}),react__WEBPACK_IMPORTED_MODULE_0__.createElement("pre",null,JSON.stringify(state,null,2)))));TextReduced.story={name:"Text (reduced)"},Text.parameters={...Text.parameters,docs:{...Text.parameters?.docs,source:{originalSource:'() => ',...Text.parameters?.docs?.source}}},Number.parameters={...Number.parameters,docs:{...Number.parameters?.docs,source:{originalSource:'() => ',...Number.parameters?.docs?.source}}},TextReduced.parameters={...TextReduced.parameters,docs:{...TextReduced.parameters?.docs,source:{originalSource:'() => ',...TextReduced.parameters?.docs?.source}}};const __namedExportsOrder=["Text","Number","TextReduced"]}}]);
\ No newline at end of file
diff --git a/Form-elements-__stories__-FieldInvestmentProjectTypeahead-stories.6b579e3c.iframe.bundle.js b/Form-elements-__stories__-FieldInvestmentProjectTypeahead-stories.6b579e3c.iframe.bundle.js
new file mode 100644
index 00000000000..afff5c8d0ce
--- /dev/null
+++ b/Form-elements-__stories__-FieldInvestmentProjectTypeahead-stories.6b579e3c.iframe.bundle.js
@@ -0,0 +1 @@
+"use strict";(self.webpackChunkdata_hub_frontend=self.webpackChunkdata_hub_frontend||[]).push([[8575],{"./src/client/components/Form/elements/__stories__/FieldInvestmentProjectTypeahead.stories.jsx":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.r(__webpack_exports__),__webpack_require__.d(__webpack_exports__,{Default:()=>Default,__namedExportsOrder:()=>__namedExportsOrder,default:()=>__WEBPACK_DEFAULT_EXPORT__,mockLoadOptions:()=>mockLoadOptions});var react__WEBPACK_IMPORTED_MODULE_0__=__webpack_require__("./node_modules/react/index.js"),_FieldInvestmentProjectTypeahead__WEBPACK_IMPORTED_MODULE_1__=__webpack_require__("./src/client/components/Form/elements/FieldInvestmentProjectTypeahead/index.jsx"),_Form__WEBPACK_IMPORTED_MODULE_2__=__webpack_require__("./src/client/components/Form/index.jsx");const options=[{value:"379f390a-e083-4a2c-9cea-e3b9a08606a7",label:"Project A"},{value:"8dcd2bb8-dc73-4a42-8655-4ae42d4d3c5a",label:"Project B"}],mockLoadOptions=(query="")=>new Promise((resolve=>query&&query.length?setTimeout(resolve,200,options.filter((({label})=>label.toLowerCase().includes(query.toLowerCase())))):resolve([]))),__WEBPACK_DEFAULT_EXPORT__={title:"Form/Form Elements/FieldInvestmentProjectTypeahead",excludeStories:["mockLoadOptions"],parameters:{component:_FieldInvestmentProjectTypeahead__WEBPACK_IMPORTED_MODULE_1__.A}},Default=()=>react__WEBPACK_IMPORTED_MODULE_0__.createElement(_Form__WEBPACK_IMPORTED_MODULE_2__.A,{id:"fieldInvestmentProjectTypeaheadExample",analyticsFormName:"fieldInvestmentProjectTypeaheadExample",submissionTaskName:"Submit Form example"},(()=>react__WEBPACK_IMPORTED_MODULE_0__.createElement(react__WEBPACK_IMPORTED_MODULE_0__.Fragment,null,react__WEBPACK_IMPORTED_MODULE_0__.createElement(_FieldInvestmentProjectTypeahead__WEBPACK_IMPORTED_MODULE_1__.A,{name:"investmentProject",loadOptions:mockLoadOptions}))));Default.parameters={...Default.parameters,docs:{...Default.parameters?.docs,source:{originalSource:'() => ',...Default.parameters?.docs?.source}}};const __namedExportsOrder=["mockLoadOptions","Default"]}}]);
\ No newline at end of file
diff --git a/Form-elements-__stories__-FieldInvestmentProjectTypeahead-stories.7d05374a.iframe.bundle.js b/Form-elements-__stories__-FieldInvestmentProjectTypeahead-stories.7d05374a.iframe.bundle.js
deleted file mode 100644
index 8b91c24be9c..00000000000
--- a/Form-elements-__stories__-FieldInvestmentProjectTypeahead-stories.7d05374a.iframe.bundle.js
+++ /dev/null
@@ -1 +0,0 @@
-"use strict";(self.webpackChunkdata_hub_frontend=self.webpackChunkdata_hub_frontend||[]).push([[8575],{"./src/client/components/Form/elements/__stories__/FieldInvestmentProjectTypeahead.stories.jsx":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.r(__webpack_exports__),__webpack_require__.d(__webpack_exports__,{Default:()=>Default,__namedExportsOrder:()=>__namedExportsOrder,default:()=>__WEBPACK_DEFAULT_EXPORT__,mockLoadOptions:()=>mockLoadOptions});__webpack_require__("./node_modules/core-js/modules/es.array.filter.js"),__webpack_require__("./node_modules/core-js/modules/es.array.includes.js"),__webpack_require__("./node_modules/core-js/modules/es.object.to-string.js"),__webpack_require__("./node_modules/core-js/modules/es.promise.js"),__webpack_require__("./node_modules/core-js/modules/es.string.includes.js");var react__WEBPACK_IMPORTED_MODULE_5__=__webpack_require__("./node_modules/react/index.js"),_FieldInvestmentProjectTypeahead__WEBPACK_IMPORTED_MODULE_6__=__webpack_require__("./src/client/components/Form/elements/FieldInvestmentProjectTypeahead/index.jsx"),_Form__WEBPACK_IMPORTED_MODULE_7__=__webpack_require__("./src/client/components/Form/index.jsx"),options=[{value:"379f390a-e083-4a2c-9cea-e3b9a08606a7",label:"Project A"},{value:"8dcd2bb8-dc73-4a42-8655-4ae42d4d3c5a",label:"Project B"}],mockLoadOptions=function mockLoadOptions(){var query=arguments.length>0&&void 0!==arguments[0]?arguments[0]:"";return new Promise((function(resolve){return query&&query.length?setTimeout(resolve,200,options.filter((function(_ref){return _ref.label.toLowerCase().includes(query.toLowerCase())}))):resolve([])}))};const __WEBPACK_DEFAULT_EXPORT__={title:"Form/Form Elements/FieldInvestmentProjectTypeahead",excludeStories:["mockLoadOptions"],parameters:{component:_FieldInvestmentProjectTypeahead__WEBPACK_IMPORTED_MODULE_6__.A}};var Default=function Default(){return react__WEBPACK_IMPORTED_MODULE_5__.createElement(_Form__WEBPACK_IMPORTED_MODULE_7__.A,{id:"fieldInvestmentProjectTypeaheadExample",analyticsFormName:"fieldInvestmentProjectTypeaheadExample",submissionTaskName:"Submit Form example"},(function(){return react__WEBPACK_IMPORTED_MODULE_5__.createElement(react__WEBPACK_IMPORTED_MODULE_5__.Fragment,null,react__WEBPACK_IMPORTED_MODULE_5__.createElement(_FieldInvestmentProjectTypeahead__WEBPACK_IMPORTED_MODULE_6__.A,{name:"investmentProject",loadOptions:mockLoadOptions}))}))};Default.parameters={...Default.parameters,docs:{...Default.parameters?.docs,source:{originalSource:'() => ',...Default.parameters?.docs?.source}}};const __namedExportsOrder=["mockLoadOptions","Default"]}}]);
\ No newline at end of file
diff --git a/Form-elements-__stories__-FieldSelect-stories.180a21c1.iframe.bundle.js b/Form-elements-__stories__-FieldSelect-stories.180a21c1.iframe.bundle.js
deleted file mode 100644
index df5ee11f76d..00000000000
--- a/Form-elements-__stories__-FieldSelect-stories.180a21c1.iframe.bundle.js
+++ /dev/null
@@ -1 +0,0 @@
-"use strict";(self.webpackChunkdata_hub_frontend=self.webpackChunkdata_hub_frontend||[]).push([[8458],{"./src/client/components/Form/elements/__stories__/FieldSelect.stories.jsx":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.r(__webpack_exports__),__webpack_require__.d(__webpack_exports__,{Default:()=>Default,__namedExportsOrder:()=>__namedExportsOrder,default:()=>__WEBPACK_DEFAULT_EXPORT__});var react__WEBPACK_IMPORTED_MODULE_0__=__webpack_require__("./node_modules/react/index.js"),_FieldSelect__WEBPACK_IMPORTED_MODULE_1__=__webpack_require__("./src/client/components/Form/elements/FieldSelect/index.jsx"),_FieldInput__WEBPACK_IMPORTED_MODULE_2__=__webpack_require__("./src/client/components/Form/elements/FieldInput/index.jsx"),_Form__WEBPACK_IMPORTED_MODULE_3__=__webpack_require__("./src/client/components/Form/index.jsx");const __WEBPACK_DEFAULT_EXPORT__={title:"Form/Form Elements/Select",parameters:{component:_FieldSelect__WEBPACK_IMPORTED_MODULE_1__.A}};var Default=function Default(){return react__WEBPACK_IMPORTED_MODULE_0__.createElement(_Form__WEBPACK_IMPORTED_MODULE_3__.A,{id:"fieldSelectExample",analyticsFormName:"fieldSelectExample",submissionTaskName:"Submit Form example"},(function(form){return react__WEBPACK_IMPORTED_MODULE_0__.createElement(react__WEBPACK_IMPORTED_MODULE_0__.Fragment,null,react__WEBPACK_IMPORTED_MODULE_0__.createElement(_FieldSelect__WEBPACK_IMPORTED_MODULE_1__.A,{name:"testField",label:"Test select",hint:"Some hint",initialValue:"testOptionValue2",emptyOption:"Please select",options:[{label:"testOptionLabel1",value:"testOptionValue1"},{label:"testOptionLabel2",value:"testOptionValue2"}],required:"Select one of the options",validate:function validate(value){return"testOptionValue2"!==value?"You need to select testOptionValue2":null}}),react__WEBPACK_IMPORTED_MODULE_0__.createElement(_FieldSelect__WEBPACK_IMPORTED_MODULE_1__.A,{name:"testField2",label:"Test select with children",hint:"Some hint",emptyOption:"Please select",options:[{label:"Option 1",value:"o1"},{label:"Option 2",value:"o2"},{label:"Other",value:"other",children:react__WEBPACK_IMPORTED_MODULE_0__.createElement(_FieldInput__WEBPACK_IMPORTED_MODULE_2__.A,{type:"text",placeholder:"Define other",name:"other"})}],required:"Select one of the options",validate:function validate(value){return"testOptionValue2"!==value?"You need to select testOptionValue2":null}}),react__WEBPACK_IMPORTED_MODULE_0__.createElement(_FieldSelect__WEBPACK_IMPORTED_MODULE_1__.A,{name:"testField3",label:"Test full width select",hint:"Some hint",initialValue:"testOptionValue2",emptyOption:"Please select",options:[{label:"testOptionLabel1",value:"testOptionValue1"},{label:"testOptionLabel2",value:"testOptionValue2"}],required:"Select one of the options",fullWidth:!0}),react__WEBPACK_IMPORTED_MODULE_0__.createElement("pre",null,JSON.stringify(form,null,2)))}))};Default.parameters={...Default.parameters,docs:{...Default.parameters?.docs,source:{originalSource:"() => ",...Default.parameters?.docs?.source}}};const __namedExportsOrder=["Default"]}}]);
\ No newline at end of file
diff --git a/Form-elements-__stories__-FieldSelect-stories.d5f04b3a.iframe.bundle.js b/Form-elements-__stories__-FieldSelect-stories.d5f04b3a.iframe.bundle.js
new file mode 100644
index 00000000000..5fd39cbe82c
--- /dev/null
+++ b/Form-elements-__stories__-FieldSelect-stories.d5f04b3a.iframe.bundle.js
@@ -0,0 +1 @@
+"use strict";(self.webpackChunkdata_hub_frontend=self.webpackChunkdata_hub_frontend||[]).push([[8458],{"./src/client/components/Form/elements/__stories__/FieldSelect.stories.jsx":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.r(__webpack_exports__),__webpack_require__.d(__webpack_exports__,{Default:()=>Default,__namedExportsOrder:()=>__namedExportsOrder,default:()=>__WEBPACK_DEFAULT_EXPORT__});var react__WEBPACK_IMPORTED_MODULE_0__=__webpack_require__("./node_modules/react/index.js"),_FieldSelect__WEBPACK_IMPORTED_MODULE_1__=__webpack_require__("./src/client/components/Form/elements/FieldSelect/index.jsx"),_FieldInput__WEBPACK_IMPORTED_MODULE_2__=__webpack_require__("./src/client/components/Form/elements/FieldInput/index.jsx"),_Form__WEBPACK_IMPORTED_MODULE_3__=__webpack_require__("./src/client/components/Form/index.jsx");const __WEBPACK_DEFAULT_EXPORT__={title:"Form/Form Elements/Select",parameters:{component:_FieldSelect__WEBPACK_IMPORTED_MODULE_1__.A}},Default=()=>react__WEBPACK_IMPORTED_MODULE_0__.createElement(_Form__WEBPACK_IMPORTED_MODULE_3__.A,{id:"fieldSelectExample",analyticsFormName:"fieldSelectExample",submissionTaskName:"Submit Form example"},(form=>react__WEBPACK_IMPORTED_MODULE_0__.createElement(react__WEBPACK_IMPORTED_MODULE_0__.Fragment,null,react__WEBPACK_IMPORTED_MODULE_0__.createElement(_FieldSelect__WEBPACK_IMPORTED_MODULE_1__.A,{name:"testField",label:"Test select",hint:"Some hint",initialValue:"testOptionValue2",emptyOption:"Please select",options:[{label:"testOptionLabel1",value:"testOptionValue1"},{label:"testOptionLabel2",value:"testOptionValue2"}],required:"Select one of the options",validate:value=>"testOptionValue2"!==value?"You need to select testOptionValue2":null}),react__WEBPACK_IMPORTED_MODULE_0__.createElement(_FieldSelect__WEBPACK_IMPORTED_MODULE_1__.A,{name:"testField2",label:"Test select with children",hint:"Some hint",emptyOption:"Please select",options:[{label:"Option 1",value:"o1"},{label:"Option 2",value:"o2"},{label:"Other",value:"other",children:react__WEBPACK_IMPORTED_MODULE_0__.createElement(_FieldInput__WEBPACK_IMPORTED_MODULE_2__.A,{type:"text",placeholder:"Define other",name:"other"})}],required:"Select one of the options",validate:value=>"testOptionValue2"!==value?"You need to select testOptionValue2":null}),react__WEBPACK_IMPORTED_MODULE_0__.createElement(_FieldSelect__WEBPACK_IMPORTED_MODULE_1__.A,{name:"testField3",label:"Test full width select",hint:"Some hint",initialValue:"testOptionValue2",emptyOption:"Please select",options:[{label:"testOptionLabel1",value:"testOptionValue1"},{label:"testOptionLabel2",value:"testOptionValue2"}],required:"Select one of the options",fullWidth:!0}),react__WEBPACK_IMPORTED_MODULE_0__.createElement("pre",null,JSON.stringify(form,null,2)))));Default.parameters={...Default.parameters,docs:{...Default.parameters?.docs,source:{originalSource:"() => ",...Default.parameters?.docs?.source}}};const __namedExportsOrder=["Default"]}}]);
\ No newline at end of file
diff --git a/Form-elements-__stories__-FieldTypeahead-stories.3e637de5.iframe.bundle.js b/Form-elements-__stories__-FieldTypeahead-stories.3e637de5.iframe.bundle.js
deleted file mode 100644
index 21d858bfb3a..00000000000
--- a/Form-elements-__stories__-FieldTypeahead-stories.3e637de5.iframe.bundle.js
+++ /dev/null
@@ -1 +0,0 @@
-"use strict";(self.webpackChunkdata_hub_frontend=self.webpackChunkdata_hub_frontend||[]).push([[6653],{"./src/client/components/Form/elements/__stories__/FieldTypeahead.stories.jsx":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.r(__webpack_exports__),__webpack_require__.d(__webpack_exports__,{Default:()=>Default,__namedExportsOrder:()=>__namedExportsOrder,default:()=>__WEBPACK_DEFAULT_EXPORT__});__webpack_require__("./node_modules/core-js/modules/es.object.to-string.js"),__webpack_require__("./node_modules/core-js/modules/es.promise.js");var react__WEBPACK_IMPORTED_MODULE_2__=__webpack_require__("./node_modules/react/index.js"),_Form__WEBPACK_IMPORTED_MODULE_3__=__webpack_require__("./src/client/components/Form/index.jsx"),_FieldTypeahead__WEBPACK_IMPORTED_MODULE_4__=__webpack_require__("./src/client/components/Form/elements/FieldTypeahead/index.jsx"),options=[{value:"379f390a-e083-4a2c-9cea-e3b9a08606a7",label:"Holly Clins - olHeart of the South West LEP"},{value:"8dcd2bb8-dc73-4a42-8655-4ae42d4d3c5a",label:"Bernard Harris-Patelc - Welsh Government (Investment)"},{value:"a6f39399-5bf4-46cb-a686-826f73e9f0ca",label:"Dennis Kennedy"}],getOptions=function getOptions(){return new Promise((function(resolve){return setTimeout(resolve,1e3,options)}))};const __WEBPACK_DEFAULT_EXPORT__={title:"Form/Form Elements/Typeahead",parameters:{component:_FieldTypeahead__WEBPACK_IMPORTED_MODULE_4__.A}};var Default=function Default(){return react__WEBPACK_IMPORTED_MODULE_2__.createElement(_Form__WEBPACK_IMPORTED_MODULE_3__.A,{id:"fieldTypeaheadExample",analyticsFormName:"fieldTypeaheadExample",submissionTaskName:"Submit Form example"},(function(state){return react__WEBPACK_IMPORTED_MODULE_2__.createElement(react__WEBPACK_IMPORTED_MODULE_2__.Fragment,null,react__WEBPACK_IMPORTED_MODULE_2__.createElement(_FieldTypeahead__WEBPACK_IMPORTED_MODULE_4__.A,{label:"Typeahead - sync single value",hint:"Some hint",name:"sync_single",required:"Choose value",options}),react__WEBPACK_IMPORTED_MODULE_2__.createElement(_FieldTypeahead__WEBPACK_IMPORTED_MODULE_4__.A,{label:"Typeahead - sync multi value",hint:"Some hint",name:"sync_multi",required:"Choose value",options,isMulti:!0}),react__WEBPACK_IMPORTED_MODULE_2__.createElement(_FieldTypeahead__WEBPACK_IMPORTED_MODULE_4__.A,{label:"Typeahead - initial value",hint:"Some hint",name:"sync_single",required:"Choose value",initialValue:options[1],options}),react__WEBPACK_IMPORTED_MODULE_2__.createElement(_FieldTypeahead__WEBPACK_IMPORTED_MODULE_4__.A,{label:"Typeahead - async single value",hint:"Some hint",name:"async_single",required:"Choose value",loadOptions:getOptions}),react__WEBPACK_IMPORTED_MODULE_2__.createElement(_FieldTypeahead__WEBPACK_IMPORTED_MODULE_4__.A,{label:"Typeahead - async multi value",hint:"Some hint",name:"async_multi",required:"Choose value",loadOptions:getOptions,isMulti:!0}),react__WEBPACK_IMPORTED_MODULE_2__.createElement("pre",null,JSON.stringify(state,null,2)))}))};Default.parameters={...Default.parameters,docs:{...Default.parameters?.docs,source:{originalSource:'() => ',...Default.parameters?.docs?.source}}};const __namedExportsOrder=["Default"]}}]);
\ No newline at end of file
diff --git a/Form-elements-__stories__-FieldTypeahead-stories.e6742b7a.iframe.bundle.js b/Form-elements-__stories__-FieldTypeahead-stories.e6742b7a.iframe.bundle.js
new file mode 100644
index 00000000000..82777fb99fb
--- /dev/null
+++ b/Form-elements-__stories__-FieldTypeahead-stories.e6742b7a.iframe.bundle.js
@@ -0,0 +1 @@
+"use strict";(self.webpackChunkdata_hub_frontend=self.webpackChunkdata_hub_frontend||[]).push([[6653],{"./src/client/components/Form/elements/__stories__/FieldTypeahead.stories.jsx":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.r(__webpack_exports__),__webpack_require__.d(__webpack_exports__,{Default:()=>Default,__namedExportsOrder:()=>__namedExportsOrder,default:()=>__WEBPACK_DEFAULT_EXPORT__});var react__WEBPACK_IMPORTED_MODULE_0__=__webpack_require__("./node_modules/react/index.js"),_Form__WEBPACK_IMPORTED_MODULE_1__=__webpack_require__("./src/client/components/Form/index.jsx"),_FieldTypeahead__WEBPACK_IMPORTED_MODULE_2__=__webpack_require__("./src/client/components/Form/elements/FieldTypeahead/index.jsx");const options=[{value:"379f390a-e083-4a2c-9cea-e3b9a08606a7",label:"Holly Clins - olHeart of the South West LEP"},{value:"8dcd2bb8-dc73-4a42-8655-4ae42d4d3c5a",label:"Bernard Harris-Patelc - Welsh Government (Investment)"},{value:"a6f39399-5bf4-46cb-a686-826f73e9f0ca",label:"Dennis Kennedy"}],getOptions=()=>new Promise((resolve=>setTimeout(resolve,1e3,options))),__WEBPACK_DEFAULT_EXPORT__={title:"Form/Form Elements/Typeahead",parameters:{component:_FieldTypeahead__WEBPACK_IMPORTED_MODULE_2__.A}},Default=()=>react__WEBPACK_IMPORTED_MODULE_0__.createElement(_Form__WEBPACK_IMPORTED_MODULE_1__.A,{id:"fieldTypeaheadExample",analyticsFormName:"fieldTypeaheadExample",submissionTaskName:"Submit Form example"},(state=>react__WEBPACK_IMPORTED_MODULE_0__.createElement(react__WEBPACK_IMPORTED_MODULE_0__.Fragment,null,react__WEBPACK_IMPORTED_MODULE_0__.createElement(_FieldTypeahead__WEBPACK_IMPORTED_MODULE_2__.A,{label:"Typeahead - sync single value",hint:"Some hint",name:"sync_single",required:"Choose value",options}),react__WEBPACK_IMPORTED_MODULE_0__.createElement(_FieldTypeahead__WEBPACK_IMPORTED_MODULE_2__.A,{label:"Typeahead - sync multi value",hint:"Some hint",name:"sync_multi",required:"Choose value",options,isMulti:!0}),react__WEBPACK_IMPORTED_MODULE_0__.createElement(_FieldTypeahead__WEBPACK_IMPORTED_MODULE_2__.A,{label:"Typeahead - initial value",hint:"Some hint",name:"sync_single",required:"Choose value",initialValue:options[1],options}),react__WEBPACK_IMPORTED_MODULE_0__.createElement(_FieldTypeahead__WEBPACK_IMPORTED_MODULE_2__.A,{label:"Typeahead - async single value",hint:"Some hint",name:"async_single",required:"Choose value",loadOptions:getOptions}),react__WEBPACK_IMPORTED_MODULE_0__.createElement(_FieldTypeahead__WEBPACK_IMPORTED_MODULE_2__.A,{label:"Typeahead - async multi value",hint:"Some hint",name:"async_multi",required:"Choose value",loadOptions:getOptions,isMulti:!0}),react__WEBPACK_IMPORTED_MODULE_0__.createElement("pre",null,JSON.stringify(state,null,2)))));Default.parameters={...Default.parameters,docs:{...Default.parameters?.docs,source:{originalSource:'() => ',...Default.parameters?.docs?.source}}};const __namedExportsOrder=["Default"]}}]);
\ No newline at end of file
diff --git a/Form-elements-__stories__-FieldWrapper-stories.1396c00f.iframe.bundle.js b/Form-elements-__stories__-FieldWrapper-stories.1396c00f.iframe.bundle.js
new file mode 100644
index 00000000000..8b5dad57180
--- /dev/null
+++ b/Form-elements-__stories__-FieldWrapper-stories.1396c00f.iframe.bundle.js
@@ -0,0 +1 @@
+"use strict";(self.webpackChunkdata_hub_frontend=self.webpackChunkdata_hub_frontend||[]).push([[1791],{"./src/client/components/Form/elements/__stories__/FieldWrapper.stories.jsx":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.r(__webpack_exports__),__webpack_require__.d(__webpack_exports__,{FieldWrapperLabel:()=>FieldWrapperLabel,FieldWrapperLegend:()=>FieldWrapperLegend,__namedExportsOrder:()=>__namedExportsOrder,default:()=>__WEBPACK_DEFAULT_EXPORT__});var react__WEBPACK_IMPORTED_MODULE_0__=__webpack_require__("./node_modules/react/index.js"),_govuk_react_heading__WEBPACK_IMPORTED_MODULE_1__=__webpack_require__("./node_modules/@govuk-react/heading/dist/govuk-react-heading.esm.js"),_Form__WEBPACK_IMPORTED_MODULE_2__=__webpack_require__("./src/client/components/Form/index.jsx"),_FieldWrapper__WEBPACK_IMPORTED_MODULE_3__=__webpack_require__("./src/client/components/Form/elements/FieldWrapper/index.jsx"),_FieldInput__WEBPACK_IMPORTED_MODULE_4__=__webpack_require__("./src/client/components/Form/elements/FieldInput/index.jsx");const testInput=react__WEBPACK_IMPORTED_MODULE_0__.createElement(_FieldInput__WEBPACK_IMPORTED_MODULE_4__.A,{name:"testField",type:"text",required:"Some error"}),__WEBPACK_DEFAULT_EXPORT__={title:"Form/Form Elements/FieldWrapper",parameters:{component:_FieldWrapper__WEBPACK_IMPORTED_MODULE_3__.A}},FieldWrapperLabel=()=>react__WEBPACK_IMPORTED_MODULE_0__.createElement(_Form__WEBPACK_IMPORTED_MODULE_2__.A,{id:"fieldWrapperExample",analyticsFormName:"fieldWrapperExample",submissionTaskName:"Submit Form example",submitButtonLabel:"Click to show error"},(form=>react__WEBPACK_IMPORTED_MODULE_0__.createElement(react__WEBPACK_IMPORTED_MODULE_0__.Fragment,null,react__WEBPACK_IMPORTED_MODULE_0__.createElement(_FieldWrapper__WEBPACK_IMPORTED_MODULE_3__.A,{label:"Label with bold font weight",name:"testField",hint:"Some hint",error:form.errors.testField},testInput),react__WEBPACK_IMPORTED_MODULE_0__.createElement(_FieldWrapper__WEBPACK_IMPORTED_MODULE_3__.A,{legend:"Label without bold font weight",name:"testField2",hint:"Some hint",error:form.errors.testField,boldLabel:!1},testInput))));FieldWrapperLabel.story={name:"FieldWrapper - Label"};const FieldWrapperLegend=()=>react__WEBPACK_IMPORTED_MODULE_0__.createElement(_Form__WEBPACK_IMPORTED_MODULE_2__.A,{id:"fieldWrapperExample",analyticsFormName:"fieldWrapperExample",submissionTaskName:"Submit Form example",submitButtonLabel:"Click to show error"},(form=>react__WEBPACK_IMPORTED_MODULE_0__.createElement(react__WEBPACK_IMPORTED_MODULE_0__.Fragment,null,react__WEBPACK_IMPORTED_MODULE_0__.createElement(_FieldWrapper__WEBPACK_IMPORTED_MODULE_3__.A,{legend:"Legend as text",name:"testField",hint:"Some hint",error:form.errors.testField},testInput),react__WEBPACK_IMPORTED_MODULE_0__.createElement(_FieldWrapper__WEBPACK_IMPORTED_MODULE_3__.A,{legend:"Big Legend",name:"testField",hint:"Some hint",error:form.errors.testField,bigLegend:!0},testInput),react__WEBPACK_IMPORTED_MODULE_0__.createElement(_FieldWrapper__WEBPACK_IMPORTED_MODULE_3__.A,{legend:"Legend with border",name:"testField",hint:"Some hint",showBorder:!0,error:form.errors.testField},testInput),react__WEBPACK_IMPORTED_MODULE_0__.createElement(_FieldWrapper__WEBPACK_IMPORTED_MODULE_3__.A,{legend:react__WEBPACK_IMPORTED_MODULE_0__.createElement(_govuk_react_heading__WEBPACK_IMPORTED_MODULE_1__.H1,null,"Legend as H1"),name:"testField",hint:"Some hint",error:form.errors.testField},testInput),react__WEBPACK_IMPORTED_MODULE_0__.createElement(_FieldWrapper__WEBPACK_IMPORTED_MODULE_3__.A,{legend:react__WEBPACK_IMPORTED_MODULE_0__.createElement(_govuk_react_heading__WEBPACK_IMPORTED_MODULE_1__.H2,null,"Legend as H2"),name:"testField",hint:"Some hint",error:form.errors.testField},testInput),react__WEBPACK_IMPORTED_MODULE_0__.createElement(_FieldWrapper__WEBPACK_IMPORTED_MODULE_3__.A,{legend:react__WEBPACK_IMPORTED_MODULE_0__.createElement(_govuk_react_heading__WEBPACK_IMPORTED_MODULE_1__.H3,null,"Legend as H3"),name:"testField",hint:"Some hint",error:form.errors.testField},testInput))));FieldWrapperLegend.story={name:"FieldWrapper - Legend"},FieldWrapperLabel.parameters={...FieldWrapperLabel.parameters,docs:{...FieldWrapperLabel.parameters?.docs,source:{originalSource:'() => ',...FieldWrapperLabel.parameters?.docs?.source}}},FieldWrapperLegend.parameters={...FieldWrapperLegend.parameters,docs:{...FieldWrapperLegend.parameters?.docs,source:{originalSource:'() => ',...FieldWrapperLegend.parameters?.docs?.source}}};const __namedExportsOrder=["FieldWrapperLabel","FieldWrapperLegend"]}}]);
\ No newline at end of file
diff --git a/Form-elements-__stories__-FieldWrapper-stories.fdb6e829.iframe.bundle.js b/Form-elements-__stories__-FieldWrapper-stories.fdb6e829.iframe.bundle.js
deleted file mode 100644
index 0da81d5f46a..00000000000
--- a/Form-elements-__stories__-FieldWrapper-stories.fdb6e829.iframe.bundle.js
+++ /dev/null
@@ -1 +0,0 @@
-"use strict";(self.webpackChunkdata_hub_frontend=self.webpackChunkdata_hub_frontend||[]).push([[1791],{"./src/client/components/Form/elements/__stories__/FieldWrapper.stories.jsx":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.r(__webpack_exports__),__webpack_require__.d(__webpack_exports__,{FieldWrapperLabel:()=>FieldWrapperLabel,FieldWrapperLegend:()=>FieldWrapperLegend,__namedExportsOrder:()=>__namedExportsOrder,default:()=>__WEBPACK_DEFAULT_EXPORT__});var react__WEBPACK_IMPORTED_MODULE_0__=__webpack_require__("./node_modules/react/index.js"),_govuk_react_heading__WEBPACK_IMPORTED_MODULE_1__=__webpack_require__("./node_modules/@govuk-react/heading/dist/govuk-react-heading.esm.js"),_Form__WEBPACK_IMPORTED_MODULE_2__=__webpack_require__("./src/client/components/Form/index.jsx"),_FieldWrapper__WEBPACK_IMPORTED_MODULE_3__=__webpack_require__("./src/client/components/Form/elements/FieldWrapper/index.jsx"),_FieldInput__WEBPACK_IMPORTED_MODULE_4__=__webpack_require__("./src/client/components/Form/elements/FieldInput/index.jsx"),testInput=react__WEBPACK_IMPORTED_MODULE_0__.createElement(_FieldInput__WEBPACK_IMPORTED_MODULE_4__.A,{name:"testField",type:"text",required:"Some error"});const __WEBPACK_DEFAULT_EXPORT__={title:"Form/Form Elements/FieldWrapper",parameters:{component:_FieldWrapper__WEBPACK_IMPORTED_MODULE_3__.A}};var FieldWrapperLabel=function FieldWrapperLabel(){return react__WEBPACK_IMPORTED_MODULE_0__.createElement(_Form__WEBPACK_IMPORTED_MODULE_2__.A,{id:"fieldWrapperExample",analyticsFormName:"fieldWrapperExample",submissionTaskName:"Submit Form example",submitButtonLabel:"Click to show error"},(function(form){return react__WEBPACK_IMPORTED_MODULE_0__.createElement(react__WEBPACK_IMPORTED_MODULE_0__.Fragment,null,react__WEBPACK_IMPORTED_MODULE_0__.createElement(_FieldWrapper__WEBPACK_IMPORTED_MODULE_3__.A,{label:"Label with bold font weight",name:"testField",hint:"Some hint",error:form.errors.testField},testInput),react__WEBPACK_IMPORTED_MODULE_0__.createElement(_FieldWrapper__WEBPACK_IMPORTED_MODULE_3__.A,{legend:"Label without bold font weight",name:"testField2",hint:"Some hint",error:form.errors.testField,boldLabel:!1},testInput))}))};FieldWrapperLabel.story={name:"FieldWrapper - Label"};var FieldWrapperLegend=function FieldWrapperLegend(){return react__WEBPACK_IMPORTED_MODULE_0__.createElement(_Form__WEBPACK_IMPORTED_MODULE_2__.A,{id:"fieldWrapperExample",analyticsFormName:"fieldWrapperExample",submissionTaskName:"Submit Form example",submitButtonLabel:"Click to show error"},(function(form){return react__WEBPACK_IMPORTED_MODULE_0__.createElement(react__WEBPACK_IMPORTED_MODULE_0__.Fragment,null,react__WEBPACK_IMPORTED_MODULE_0__.createElement(_FieldWrapper__WEBPACK_IMPORTED_MODULE_3__.A,{legend:"Legend as text",name:"testField",hint:"Some hint",error:form.errors.testField},testInput),react__WEBPACK_IMPORTED_MODULE_0__.createElement(_FieldWrapper__WEBPACK_IMPORTED_MODULE_3__.A,{legend:"Big Legend",name:"testField",hint:"Some hint",error:form.errors.testField,bigLegend:!0},testInput),react__WEBPACK_IMPORTED_MODULE_0__.createElement(_FieldWrapper__WEBPACK_IMPORTED_MODULE_3__.A,{legend:"Legend with border",name:"testField",hint:"Some hint",showBorder:!0,error:form.errors.testField},testInput),react__WEBPACK_IMPORTED_MODULE_0__.createElement(_FieldWrapper__WEBPACK_IMPORTED_MODULE_3__.A,{legend:react__WEBPACK_IMPORTED_MODULE_0__.createElement(_govuk_react_heading__WEBPACK_IMPORTED_MODULE_1__.H1,null,"Legend as H1"),name:"testField",hint:"Some hint",error:form.errors.testField},testInput),react__WEBPACK_IMPORTED_MODULE_0__.createElement(_FieldWrapper__WEBPACK_IMPORTED_MODULE_3__.A,{legend:react__WEBPACK_IMPORTED_MODULE_0__.createElement(_govuk_react_heading__WEBPACK_IMPORTED_MODULE_1__.H2,null,"Legend as H2"),name:"testField",hint:"Some hint",error:form.errors.testField},testInput),react__WEBPACK_IMPORTED_MODULE_0__.createElement(_FieldWrapper__WEBPACK_IMPORTED_MODULE_3__.A,{legend:react__WEBPACK_IMPORTED_MODULE_0__.createElement(_govuk_react_heading__WEBPACK_IMPORTED_MODULE_1__.H3,null,"Legend as H3"),name:"testField",hint:"Some hint",error:form.errors.testField},testInput))}))};FieldWrapperLegend.story={name:"FieldWrapper - Legend"},FieldWrapperLabel.parameters={...FieldWrapperLabel.parameters,docs:{...FieldWrapperLabel.parameters?.docs,source:{originalSource:'() => ',...FieldWrapperLabel.parameters?.docs?.source}}},FieldWrapperLegend.parameters={...FieldWrapperLegend.parameters,docs:{...FieldWrapperLegend.parameters?.docs,source:{originalSource:'() => ',...FieldWrapperLegend.parameters?.docs?.source}}};const __namedExportsOrder=["FieldWrapperLabel","FieldWrapperLegend"]}}]);
\ No newline at end of file
diff --git a/InvestmentProjectLocalHeader-__stories__-InvestmentProjectLocalHeader-stories.7dcf0037.iframe.bundle.js b/InvestmentProjectLocalHeader-__stories__-InvestmentProjectLocalHeader-stories.7dcf0037.iframe.bundle.js
deleted file mode 100644
index f26b3aefa8f..00000000000
--- a/InvestmentProjectLocalHeader-__stories__-InvestmentProjectLocalHeader-stories.7dcf0037.iframe.bundle.js
+++ /dev/null
@@ -1 +0,0 @@
-"use strict";(self.webpackChunkdata_hub_frontend=self.webpackChunkdata_hub_frontend||[]).push([[280],{"./src/client/components/InvestmentProjectLocalHeader/__stories__/InvestmentProjectLocalHeader.stories.jsx":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.r(__webpack_exports__),__webpack_require__.d(__webpack_exports__,{CreatedByNoDbtTeam:()=>CreatedByNoDbtTeam,ProjectValuedFalse:()=>ProjectValuedFalse,ProjectValuedTrue:()=>ProjectValuedTrue,StageActive:()=>StageActive,StageAssignPm:()=>StageAssignPm,StageProspect:()=>StageProspect,StageVerifyWin:()=>StageVerifyWin,StageWon:()=>StageWon,StatusAbandoned:()=>StatusAbandoned,StatusDelayed:()=>StatusDelayed,StatusDormant:()=>StatusDormant,StatusLost:()=>StatusLost,StatusOngoing:()=>StatusOngoing,__namedExportsOrder:()=>__namedExportsOrder,default:()=>__WEBPACK_DEFAULT_EXPORT__});__webpack_require__("./node_modules/core-js/modules/es.symbol.js"),__webpack_require__("./node_modules/core-js/modules/es.symbol.description.js"),__webpack_require__("./node_modules/core-js/modules/es.symbol.iterator.js"),__webpack_require__("./node_modules/core-js/modules/es.symbol.to-primitive.js"),__webpack_require__("./node_modules/core-js/modules/es.array.filter.js"),__webpack_require__("./node_modules/core-js/modules/es.array.iterator.js"),__webpack_require__("./node_modules/core-js/modules/es.date.to-primitive.js"),__webpack_require__("./node_modules/core-js/modules/es.function.name.js"),__webpack_require__("./node_modules/core-js/modules/es.number.constructor.js"),__webpack_require__("./node_modules/core-js/modules/es.object.get-own-property-descriptor.js"),__webpack_require__("./node_modules/core-js/modules/es.object.get-own-property-descriptors.js"),__webpack_require__("./node_modules/core-js/modules/es.object.keys.js"),__webpack_require__("./node_modules/core-js/modules/es.object.to-string.js"),__webpack_require__("./node_modules/core-js/modules/es.string.iterator.js"),__webpack_require__("./node_modules/core-js/modules/web.dom-collections.for-each.js"),__webpack_require__("./node_modules/core-js/modules/web.dom-collections.iterator.js");var react__WEBPACK_IMPORTED_MODULE_16__=__webpack_require__("./node_modules/react/index.js"),InvestmentProjectLocalHeader__WEBPACK_IMPORTED_MODULE_17__=__webpack_require__("./src/client/components/InvestmentProjectLocalHeader/index.jsx"),_lib_urls__WEBPACK_IMPORTED_MODULE_18__=__webpack_require__("./src/lib/urls.js"),_lib_urls__WEBPACK_IMPORTED_MODULE_18___default=__webpack_require__.n(_lib_urls__WEBPACK_IMPORTED_MODULE_18__),_modules_Investments_Projects_constants__WEBPACK_IMPORTED_MODULE_19__=__webpack_require__("./src/client/modules/Investments/Projects/constants.js");function _typeof(o){return _typeof="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(o){return typeof o}:function(o){return o&&"function"==typeof Symbol&&o.constructor===Symbol&&o!==Symbol.prototype?"symbol":typeof o},_typeof(o)}function ownKeys(e,r){var t=Object.keys(e);if(Object.getOwnPropertySymbols){var o=Object.getOwnPropertySymbols(e);r&&(o=o.filter((function(r){return Object.getOwnPropertyDescriptor(e,r).enumerable}))),t.push.apply(t,o)}return t}function _objectSpread(e){for(var r=1;r ",...StatusOngoing.parameters?.docs?.source}}},StatusDelayed.parameters={...StatusDelayed.parameters,docs:{...StatusDelayed.parameters?.docs,source:{originalSource:"() => ",...StatusDelayed.parameters?.docs?.source}}},StatusAbandoned.parameters={...StatusAbandoned.parameters,docs:{...StatusAbandoned.parameters?.docs,source:{originalSource:"() => ",...StatusAbandoned.parameters?.docs?.source}}},StatusLost.parameters={...StatusLost.parameters,docs:{...StatusLost.parameters?.docs,source:{originalSource:"() => ",...StatusLost.parameters?.docs?.source}}},StatusDormant.parameters={...StatusDormant.parameters,docs:{...StatusDormant.parameters?.docs,source:{originalSource:"() => ",...StatusDormant.parameters?.docs?.source}}},StageProspect.parameters={...StageProspect.parameters,docs:{...StageProspect.parameters?.docs,source:{originalSource:"() => ",...StageProspect.parameters?.docs?.source}}},StageAssignPm.parameters={...StageAssignPm.parameters,docs:{...StageAssignPm.parameters?.docs,source:{originalSource:"() => ",...StageAssignPm.parameters?.docs?.source}}},StageActive.parameters={...StageActive.parameters,docs:{...StageActive.parameters?.docs,source:{originalSource:"() => ",...StageActive.parameters?.docs?.source}}},StageVerifyWin.parameters={...StageVerifyWin.parameters,docs:{...StageVerifyWin.parameters?.docs,source:{originalSource:"() => ",...StageVerifyWin.parameters?.docs?.source}}},StageWon.parameters={...StageWon.parameters,docs:{...StageWon.parameters?.docs,source:{originalSource:"() => ",...StageWon.parameters?.docs?.source}}},ProjectValuedFalse.parameters={...ProjectValuedFalse.parameters,docs:{...ProjectValuedFalse.parameters?.docs,source:{originalSource:"() => ",...ProjectValuedFalse.parameters?.docs?.source}}},ProjectValuedTrue.parameters={...ProjectValuedTrue.parameters,docs:{...ProjectValuedTrue.parameters?.docs,source:{originalSource:"() => ",...ProjectValuedTrue.parameters?.docs?.source}}},CreatedByNoDbtTeam.parameters={...CreatedByNoDbtTeam.parameters,docs:{...CreatedByNoDbtTeam.parameters?.docs,source:{originalSource:"() => ",...CreatedByNoDbtTeam.parameters?.docs?.source}}};const __namedExportsOrder=["StatusOngoing","StatusDelayed","StatusAbandoned","StatusLost","StatusDormant","StageProspect","StageAssignPm","StageActive","StageVerifyWin","StageWon","ProjectValuedFalse","ProjectValuedTrue","CreatedByNoDbtTeam"]}}]);
\ No newline at end of file
diff --git a/InvestmentProjectLocalHeader-__stories__-InvestmentProjectLocalHeader-stories.f760c475.iframe.bundle.js b/InvestmentProjectLocalHeader-__stories__-InvestmentProjectLocalHeader-stories.f760c475.iframe.bundle.js
new file mode 100644
index 00000000000..bd734dfee58
--- /dev/null
+++ b/InvestmentProjectLocalHeader-__stories__-InvestmentProjectLocalHeader-stories.f760c475.iframe.bundle.js
@@ -0,0 +1 @@
+"use strict";(self.webpackChunkdata_hub_frontend=self.webpackChunkdata_hub_frontend||[]).push([[280],{"./src/client/components/InvestmentProjectLocalHeader/__stories__/InvestmentProjectLocalHeader.stories.jsx":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.r(__webpack_exports__),__webpack_require__.d(__webpack_exports__,{CreatedByNoDbtTeam:()=>CreatedByNoDbtTeam,ProjectValuedFalse:()=>ProjectValuedFalse,ProjectValuedTrue:()=>ProjectValuedTrue,StageActive:()=>StageActive,StageAssignPm:()=>StageAssignPm,StageProspect:()=>StageProspect,StageVerifyWin:()=>StageVerifyWin,StageWon:()=>StageWon,StatusAbandoned:()=>StatusAbandoned,StatusDelayed:()=>StatusDelayed,StatusDormant:()=>StatusDormant,StatusLost:()=>StatusLost,StatusOngoing:()=>StatusOngoing,__namedExportsOrder:()=>__namedExportsOrder,default:()=>__WEBPACK_DEFAULT_EXPORT__});var react__WEBPACK_IMPORTED_MODULE_0__=__webpack_require__("./node_modules/react/index.js"),InvestmentProjectLocalHeader__WEBPACK_IMPORTED_MODULE_1__=__webpack_require__("./src/client/components/InvestmentProjectLocalHeader/index.jsx"),_lib_urls__WEBPACK_IMPORTED_MODULE_2__=__webpack_require__("./src/lib/urls.js"),_lib_urls__WEBPACK_IMPORTED_MODULE_2___default=__webpack_require__.n(_lib_urls__WEBPACK_IMPORTED_MODULE_2__),_modules_Investments_Projects_constants__WEBPACK_IMPORTED_MODULE_3__=__webpack_require__("./src/client/modules/Investments/Projects/constants.js");const investment={id:"123",investor_company:{name:"Alphabet Inc.",id:"456"},project_code:"DHP-00000356",value_complete:!1,created_on:"2022-02-25T15:37:23.331204Z",created_by:{name:"Andy Pipkin",dit_team:{name:"Little Britain"}},stage:{name:_modules_Investments_Projects_constants__WEBPACK_IMPORTED_MODULE_3__.sy},status:"ongoing"},breadcrumbs=[{link:_lib_urls__WEBPACK_IMPORTED_MODULE_2___default().dashboard.index(),text:"Home"},{link:_lib_urls__WEBPACK_IMPORTED_MODULE_2___default().investments.index(),text:"Investments"},{link:_lib_urls__WEBPACK_IMPORTED_MODULE_2___default().investments.index(),text:"Projects"},{link:_lib_urls__WEBPACK_IMPORTED_MODULE_2___default().investments.projects.details(investment.id),text:investment.investor_company.name}],__WEBPACK_DEFAULT_EXPORT__={title:"InvestmentProjectLocalHeader",parameters:{component:InvestmentProjectLocalHeader__WEBPACK_IMPORTED_MODULE_1__.A}},StatusOngoing=()=>react__WEBPACK_IMPORTED_MODULE_0__.createElement(InvestmentProjectLocalHeader__WEBPACK_IMPORTED_MODULE_1__.A,{investment:{...investment,status:"ongoing"},breadcrumbs});StatusOngoing.story={name:"Status: Ongoing"};const StatusDelayed=()=>react__WEBPACK_IMPORTED_MODULE_0__.createElement(InvestmentProjectLocalHeader__WEBPACK_IMPORTED_MODULE_1__.A,{investment:{...investment,status:"delayed"},breadcrumbs});StatusDelayed.story={name:"Status: Delayed"};const StatusAbandoned=()=>react__WEBPACK_IMPORTED_MODULE_0__.createElement(InvestmentProjectLocalHeader__WEBPACK_IMPORTED_MODULE_1__.A,{investment:{...investment,status:"abandoned"},breadcrumbs});StatusAbandoned.story={name:"Status: Abandoned"};const StatusLost=()=>react__WEBPACK_IMPORTED_MODULE_0__.createElement(InvestmentProjectLocalHeader__WEBPACK_IMPORTED_MODULE_1__.A,{investment:{...investment,status:"lost"},breadcrumbs});StatusLost.story={name:"Status: Lost"};const StatusDormant=()=>react__WEBPACK_IMPORTED_MODULE_0__.createElement(InvestmentProjectLocalHeader__WEBPACK_IMPORTED_MODULE_1__.A,{investment:{...investment,status:"dormant"},breadcrumbs});StatusDormant.story={name:"Status: Dormant"};const StageProspect=()=>react__WEBPACK_IMPORTED_MODULE_0__.createElement(InvestmentProjectLocalHeader__WEBPACK_IMPORTED_MODULE_1__.A,{investment,breadcrumbs});StageProspect.story={name:"Stage: Prospect"};const StageAssignPm=()=>react__WEBPACK_IMPORTED_MODULE_0__.createElement(InvestmentProjectLocalHeader__WEBPACK_IMPORTED_MODULE_1__.A,{investment:{...investment,stage:{name:_modules_Investments_Projects_constants__WEBPACK_IMPORTED_MODULE_3__.Li}},breadcrumbs});StageAssignPm.story={name:"Stage: Assign PM"};const StageActive=()=>react__WEBPACK_IMPORTED_MODULE_0__.createElement(InvestmentProjectLocalHeader__WEBPACK_IMPORTED_MODULE_1__.A,{investment:{...investment,stage:{name:_modules_Investments_Projects_constants__WEBPACK_IMPORTED_MODULE_3__.aO}},breadcrumbs});StageActive.story={name:"Stage: Active"};const StageVerifyWin=()=>react__WEBPACK_IMPORTED_MODULE_0__.createElement(InvestmentProjectLocalHeader__WEBPACK_IMPORTED_MODULE_1__.A,{investment:{...investment,stage:{name:_modules_Investments_Projects_constants__WEBPACK_IMPORTED_MODULE_3__.Cb}},breadcrumbs});StageVerifyWin.story={name:"Stage: Verify win"};const StageWon=()=>react__WEBPACK_IMPORTED_MODULE_0__.createElement(InvestmentProjectLocalHeader__WEBPACK_IMPORTED_MODULE_1__.A,{investment:{...investment,stage:{name:_modules_Investments_Projects_constants__WEBPACK_IMPORTED_MODULE_3__.c0}},breadcrumbs});StageWon.story={name:"Stage: Won"};const ProjectValuedFalse=()=>react__WEBPACK_IMPORTED_MODULE_0__.createElement(InvestmentProjectLocalHeader__WEBPACK_IMPORTED_MODULE_1__.A,{investment,breadcrumbs});ProjectValuedFalse.story={name:"Project valued: false"};const ProjectValuedTrue=()=>react__WEBPACK_IMPORTED_MODULE_0__.createElement(InvestmentProjectLocalHeader__WEBPACK_IMPORTED_MODULE_1__.A,{investment:{...investment,value_complete:!0},breadcrumbs});ProjectValuedTrue.story={name:"Project valued: true"};const CreatedByNoDbtTeam=()=>react__WEBPACK_IMPORTED_MODULE_0__.createElement(InvestmentProjectLocalHeader__WEBPACK_IMPORTED_MODULE_1__.A,{investment:{...investment,created_by:{}},breadcrumbs});CreatedByNoDbtTeam.story={name:"Created by: no DBT team"},StatusOngoing.parameters={...StatusOngoing.parameters,docs:{...StatusOngoing.parameters?.docs,source:{originalSource:"() => ",...StatusOngoing.parameters?.docs?.source}}},StatusDelayed.parameters={...StatusDelayed.parameters,docs:{...StatusDelayed.parameters?.docs,source:{originalSource:"() => ",...StatusDelayed.parameters?.docs?.source}}},StatusAbandoned.parameters={...StatusAbandoned.parameters,docs:{...StatusAbandoned.parameters?.docs,source:{originalSource:"() => ",...StatusAbandoned.parameters?.docs?.source}}},StatusLost.parameters={...StatusLost.parameters,docs:{...StatusLost.parameters?.docs,source:{originalSource:"() => ",...StatusLost.parameters?.docs?.source}}},StatusDormant.parameters={...StatusDormant.parameters,docs:{...StatusDormant.parameters?.docs,source:{originalSource:"() => ",...StatusDormant.parameters?.docs?.source}}},StageProspect.parameters={...StageProspect.parameters,docs:{...StageProspect.parameters?.docs,source:{originalSource:"() => ",...StageProspect.parameters?.docs?.source}}},StageAssignPm.parameters={...StageAssignPm.parameters,docs:{...StageAssignPm.parameters?.docs,source:{originalSource:"() => ",...StageAssignPm.parameters?.docs?.source}}},StageActive.parameters={...StageActive.parameters,docs:{...StageActive.parameters?.docs,source:{originalSource:"() => ",...StageActive.parameters?.docs?.source}}},StageVerifyWin.parameters={...StageVerifyWin.parameters,docs:{...StageVerifyWin.parameters?.docs,source:{originalSource:"() => ",...StageVerifyWin.parameters?.docs?.source}}},StageWon.parameters={...StageWon.parameters,docs:{...StageWon.parameters?.docs,source:{originalSource:"() => ",...StageWon.parameters?.docs?.source}}},ProjectValuedFalse.parameters={...ProjectValuedFalse.parameters,docs:{...ProjectValuedFalse.parameters?.docs,source:{originalSource:"() => ",...ProjectValuedFalse.parameters?.docs?.source}}},ProjectValuedTrue.parameters={...ProjectValuedTrue.parameters,docs:{...ProjectValuedTrue.parameters?.docs,source:{originalSource:"() => ",...ProjectValuedTrue.parameters?.docs?.source}}},CreatedByNoDbtTeam.parameters={...CreatedByNoDbtTeam.parameters,docs:{...CreatedByNoDbtTeam.parameters?.docs,source:{originalSource:"() => ",...CreatedByNoDbtTeam.parameters?.docs?.source}}};const __namedExportsOrder=["StatusOngoing","StatusDelayed","StatusAbandoned","StatusLost","StatusDormant","StageProspect","StageAssignPm","StageActive","StageVerifyWin","StageWon","ProjectValuedFalse","ProjectValuedTrue","CreatedByNoDbtTeam"]}}]);
\ No newline at end of file
diff --git a/InvestmentReminders-__stories__-InvestmentReminders-stories.0169d9fd.iframe.bundle.js b/InvestmentReminders-__stories__-InvestmentReminders-stories.0169d9fd.iframe.bundle.js
new file mode 100644
index 00000000000..13fec797aef
--- /dev/null
+++ b/InvestmentReminders-__stories__-InvestmentReminders-stories.0169d9fd.iframe.bundle.js
@@ -0,0 +1 @@
+"use strict";(self.webpackChunkdata_hub_frontend=self.webpackChunkdata_hub_frontend||[]).push([[8490],{"./src/client/components/InvestmentReminders/__stories__/InvestmentReminders.stories.jsx":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.r(__webpack_exports__),__webpack_require__.d(__webpack_exports__,{Default:()=>Default,__namedExportsOrder:()=>__namedExportsOrder,default:()=>__WEBPACK_DEFAULT_EXPORT__});var react__WEBPACK_IMPORTED_MODULE_0__=__webpack_require__("./node_modules/react/index.js"),InvestmentReminders__WEBPACK_IMPORTED_MODULE_1__=__webpack_require__("./src/client/components/InvestmentReminders/index.jsx");const adviser={name:"Paula Churing",first_name:"Paula",last_name:"Churing",id:"adviser-1"},outstandingPropositions={count:2,results:[{id:"123",investment_project:{name:"New restaurant",project_code:"DHP-00000004",id:"project-a"},adviser,deadline:"2021-04-01",name:"Restaurant proposition"},{id:"456",investment_project:{name:"Univeristy",project_code:"DHP-00000005",id:"project-b"},adviser,deadline:"2021-04-01",name:"Univeristy proposition"}]},__WEBPACK_DEFAULT_EXPORT__={title:"InvestmentReminders",parameters:{component:InvestmentReminders__WEBPACK_IMPORTED_MODULE_1__.A}},Default=()=>react__WEBPACK_IMPORTED_MODULE_0__.createElement(InvestmentReminders__WEBPACK_IMPORTED_MODULE_1__.A,{adviser,outstandingPropositions});Default.parameters={...Default.parameters,docs:{...Default.parameters?.docs,source:{originalSource:"() => ",...Default.parameters?.docs?.source}}};const __namedExportsOrder=["Default"]}}]);
\ No newline at end of file
diff --git a/InvestmentReminders-__stories__-InvestmentReminders-stories.bd3cdb1d.iframe.bundle.js b/InvestmentReminders-__stories__-InvestmentReminders-stories.bd3cdb1d.iframe.bundle.js
deleted file mode 100644
index ce8a9d6d37c..00000000000
--- a/InvestmentReminders-__stories__-InvestmentReminders-stories.bd3cdb1d.iframe.bundle.js
+++ /dev/null
@@ -1 +0,0 @@
-"use strict";(self.webpackChunkdata_hub_frontend=self.webpackChunkdata_hub_frontend||[]).push([[8490],{"./src/client/components/InvestmentReminders/__stories__/InvestmentReminders.stories.jsx":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.r(__webpack_exports__),__webpack_require__.d(__webpack_exports__,{Default:()=>Default,__namedExportsOrder:()=>__namedExportsOrder,default:()=>__WEBPACK_DEFAULT_EXPORT__});var react__WEBPACK_IMPORTED_MODULE_0__=__webpack_require__("./node_modules/react/index.js"),InvestmentReminders__WEBPACK_IMPORTED_MODULE_1__=__webpack_require__("./src/client/components/InvestmentReminders/index.jsx"),adviser={name:"Paula Churing",first_name:"Paula",last_name:"Churing",id:"adviser-1"},outstandingPropositions={count:2,results:[{id:"123",investment_project:{name:"New restaurant",project_code:"DHP-00000004",id:"project-a"},adviser,deadline:"2021-04-01",name:"Restaurant proposition"},{id:"456",investment_project:{name:"Univeristy",project_code:"DHP-00000005",id:"project-b"},adviser,deadline:"2021-04-01",name:"Univeristy proposition"}]};const __WEBPACK_DEFAULT_EXPORT__={title:"InvestmentReminders",parameters:{component:InvestmentReminders__WEBPACK_IMPORTED_MODULE_1__.A}};var Default=function Default(){return react__WEBPACK_IMPORTED_MODULE_0__.createElement(InvestmentReminders__WEBPACK_IMPORTED_MODULE_1__.A,{adviser,outstandingPropositions})};Default.parameters={...Default.parameters,docs:{...Default.parameters?.docs,source:{originalSource:"() => ",...Default.parameters?.docs?.source}}};const __namedExportsOrder=["Default"]}}]);
\ No newline at end of file
diff --git a/LocalHeader-__stories__-FlashMessages-stories.a4049572.iframe.bundle.js b/LocalHeader-__stories__-FlashMessages-stories.a4049572.iframe.bundle.js
deleted file mode 100644
index c0cee7382ad..00000000000
--- a/LocalHeader-__stories__-FlashMessages-stories.a4049572.iframe.bundle.js
+++ /dev/null
@@ -1 +0,0 @@
-"use strict";(self.webpackChunkdata_hub_frontend=self.webpackChunkdata_hub_frontend||[]).push([[4350],{"./src/client/components/LocalHeader/__stories__/FlashMessages.stories.jsx":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.r(__webpack_exports__),__webpack_require__.d(__webpack_exports__,{Default:()=>Default,__namedExportsOrder:()=>__namedExportsOrder,default:()=>__WEBPACK_DEFAULT_EXPORT__});var react__WEBPACK_IMPORTED_MODULE_0__=__webpack_require__("./node_modules/react/index.js"),_FlashMessages__WEBPACK_IMPORTED_MODULE_1__=__webpack_require__("./src/client/components/LocalHeader/FlashMessages.jsx");const __WEBPACK_DEFAULT_EXPORT__={title:"Flash Messages",parameters:{component:_FlashMessages__WEBPACK_IMPORTED_MODULE_1__.A}};var Default=function Default(){return react__WEBPACK_IMPORTED_MODULE_0__.createElement(_FlashMessages__WEBPACK_IMPORTED_MODULE_1__.A,{flashMessages:{success:["Success message"],"success:with-body":[{heading:"Success message heading",body:"Success message body"}],info:["Info message"],"info:with-body":[{heading:"Info message heading",body:"Info message body"}],error:["Error test message","Another error message"],warning:["Warning test message"],muted:["Muted test message"]}})};Default.parameters={...Default.parameters,docs:{...Default.parameters?.docs,source:{originalSource:"() => ",...Default.parameters?.docs?.source}}};const __namedExportsOrder=["Default"]}}]);
\ No newline at end of file
diff --git a/LocalHeader-__stories__-FlashMessages-stories.f73eeb14.iframe.bundle.js b/LocalHeader-__stories__-FlashMessages-stories.f73eeb14.iframe.bundle.js
new file mode 100644
index 00000000000..97ab85fe8fe
--- /dev/null
+++ b/LocalHeader-__stories__-FlashMessages-stories.f73eeb14.iframe.bundle.js
@@ -0,0 +1 @@
+"use strict";(self.webpackChunkdata_hub_frontend=self.webpackChunkdata_hub_frontend||[]).push([[4350],{"./src/client/components/LocalHeader/__stories__/FlashMessages.stories.jsx":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.r(__webpack_exports__),__webpack_require__.d(__webpack_exports__,{Default:()=>Default,__namedExportsOrder:()=>__namedExportsOrder,default:()=>__WEBPACK_DEFAULT_EXPORT__});var react__WEBPACK_IMPORTED_MODULE_0__=__webpack_require__("./node_modules/react/index.js"),_FlashMessages__WEBPACK_IMPORTED_MODULE_1__=__webpack_require__("./src/client/components/LocalHeader/FlashMessages.jsx");const __WEBPACK_DEFAULT_EXPORT__={title:"Flash Messages",parameters:{component:_FlashMessages__WEBPACK_IMPORTED_MODULE_1__.A}},Default=()=>react__WEBPACK_IMPORTED_MODULE_0__.createElement(_FlashMessages__WEBPACK_IMPORTED_MODULE_1__.A,{flashMessages:{success:["Success message"],"success:with-body":[{heading:"Success message heading",body:"Success message body"}],info:["Info message"],"info:with-body":[{heading:"Info message heading",body:"Info message body"}],error:["Error test message","Another error message"],warning:["Warning test message"],muted:["Muted test message"]}});Default.parameters={...Default.parameters,docs:{...Default.parameters?.docs,source:{originalSource:"() => ",...Default.parameters?.docs?.source}}};const __namedExportsOrder=["Default"]}}]);
\ No newline at end of file
diff --git a/LocalHeader-__stories__-LocalHeader-stories.a4be46b9.iframe.bundle.js b/LocalHeader-__stories__-LocalHeader-stories.a4be46b9.iframe.bundle.js
new file mode 100644
index 00000000000..4e06e9271e6
--- /dev/null
+++ b/LocalHeader-__stories__-LocalHeader-stories.a4be46b9.iframe.bundle.js
@@ -0,0 +1 @@
+"use strict";(self.webpackChunkdata_hub_frontend=self.webpackChunkdata_hub_frontend||[]).push([[7546],{"./src/client/components/LocalHeader/__stories__/LocalHeader.stories.jsx":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.r(__webpack_exports__),__webpack_require__.d(__webpack_exports__,{Default:()=>Default,WithChildren:()=>WithChildren,WithLink:()=>WithLink,WithSuperheading:()=>WithSuperheading,__namedExportsOrder:()=>__namedExportsOrder,default:()=>__WEBPACK_DEFAULT_EXPORT__});var react__WEBPACK_IMPORTED_MODULE_0__=__webpack_require__("./node_modules/react/index.js"),_LocalHeader__WEBPACK_IMPORTED_MODULE_1__=__webpack_require__("./src/client/components/LocalHeader/LocalHeader.jsx");const breadcrumbs=[{link:"/",text:"Home"},{text:"Example"}],__WEBPACK_DEFAULT_EXPORT__={title:"LocalHeader",parameters:{component:_LocalHeader__WEBPACK_IMPORTED_MODULE_1__.A}},Default=()=>react__WEBPACK_IMPORTED_MODULE_0__.createElement(_LocalHeader__WEBPACK_IMPORTED_MODULE_1__.A,{breadcrumbs,heading:"Example"}),WithLink=()=>react__WEBPACK_IMPORTED_MODULE_0__.createElement(_LocalHeader__WEBPACK_IMPORTED_MODULE_1__.A,{breadcrumbs,heading:"Example",headingLink:{url:"/",text:"Example"}});WithLink.story={name:"With link"};const WithSuperheading=()=>react__WEBPACK_IMPORTED_MODULE_0__.createElement(_LocalHeader__WEBPACK_IMPORTED_MODULE_1__.A,{breadcrumbs,heading:"Example",superheading:"Example"});WithSuperheading.story={name:"With superheading"};const WithChildren=()=>react__WEBPACK_IMPORTED_MODULE_0__.createElement(_LocalHeader__WEBPACK_IMPORTED_MODULE_1__.A,{breadcrumbs,heading:"Example",children:"Example"});WithChildren.story={name:"With children"},Default.parameters={...Default.parameters,docs:{...Default.parameters?.docs,source:{originalSource:"() => ",...Default.parameters?.docs?.source}}},WithLink.parameters={...WithLink.parameters,docs:{...WithLink.parameters?.docs,source:{originalSource:"() => ",...WithLink.parameters?.docs?.source}}},WithSuperheading.parameters={...WithSuperheading.parameters,docs:{...WithSuperheading.parameters?.docs,source:{originalSource:"() => ",...WithSuperheading.parameters?.docs?.source}}},WithChildren.parameters={...WithChildren.parameters,docs:{...WithChildren.parameters?.docs,source:{originalSource:"() => ",...WithChildren.parameters?.docs?.source}}};const __namedExportsOrder=["Default","WithLink","WithSuperheading","WithChildren"]}}]);
\ No newline at end of file
diff --git a/LocalHeader-__stories__-LocalHeader-stories.bcf7db00.iframe.bundle.js b/LocalHeader-__stories__-LocalHeader-stories.bcf7db00.iframe.bundle.js
deleted file mode 100644
index 02044ab5998..00000000000
--- a/LocalHeader-__stories__-LocalHeader-stories.bcf7db00.iframe.bundle.js
+++ /dev/null
@@ -1 +0,0 @@
-"use strict";(self.webpackChunkdata_hub_frontend=self.webpackChunkdata_hub_frontend||[]).push([[7546],{"./src/client/components/LocalHeader/__stories__/LocalHeader.stories.jsx":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.r(__webpack_exports__),__webpack_require__.d(__webpack_exports__,{Default:()=>Default,WithChildren:()=>WithChildren,WithLink:()=>WithLink,WithSuperheading:()=>WithSuperheading,__namedExportsOrder:()=>__namedExportsOrder,default:()=>__WEBPACK_DEFAULT_EXPORT__});var react__WEBPACK_IMPORTED_MODULE_0__=__webpack_require__("./node_modules/react/index.js"),_LocalHeader__WEBPACK_IMPORTED_MODULE_1__=__webpack_require__("./src/client/components/LocalHeader/LocalHeader.jsx"),breadcrumbs=[{link:"/",text:"Home"},{text:"Example"}];const __WEBPACK_DEFAULT_EXPORT__={title:"LocalHeader",parameters:{component:_LocalHeader__WEBPACK_IMPORTED_MODULE_1__.A}};var Default=function Default(){return react__WEBPACK_IMPORTED_MODULE_0__.createElement(_LocalHeader__WEBPACK_IMPORTED_MODULE_1__.A,{breadcrumbs,heading:"Example"})},WithLink=function WithLink(){return react__WEBPACK_IMPORTED_MODULE_0__.createElement(_LocalHeader__WEBPACK_IMPORTED_MODULE_1__.A,{breadcrumbs,heading:"Example",headingLink:{url:"/",text:"Example"}})};WithLink.story={name:"With link"};var WithSuperheading=function WithSuperheading(){return react__WEBPACK_IMPORTED_MODULE_0__.createElement(_LocalHeader__WEBPACK_IMPORTED_MODULE_1__.A,{breadcrumbs,heading:"Example",superheading:"Example"})};WithSuperheading.story={name:"With superheading"};var WithChildren=function WithChildren(){return react__WEBPACK_IMPORTED_MODULE_0__.createElement(_LocalHeader__WEBPACK_IMPORTED_MODULE_1__.A,{breadcrumbs,heading:"Example",children:"Example"})};WithChildren.story={name:"With children"},Default.parameters={...Default.parameters,docs:{...Default.parameters?.docs,source:{originalSource:"() => ",...Default.parameters?.docs?.source}}},WithLink.parameters={...WithLink.parameters,docs:{...WithLink.parameters?.docs,source:{originalSource:"() => ",...WithLink.parameters?.docs?.source}}},WithSuperheading.parameters={...WithSuperheading.parameters,docs:{...WithSuperheading.parameters?.docs,source:{originalSource:"() => ",...WithSuperheading.parameters?.docs?.source}}},WithChildren.parameters={...WithChildren.parameters,docs:{...WithChildren.parameters?.docs,source:{originalSource:"() => ",...WithChildren.parameters?.docs?.source}}};const __namedExportsOrder=["Default","WithLink","WithSuperheading","WithChildren"]}}]);
\ No newline at end of file
diff --git a/LocalHeaderDetails-__stories__-LocalHeaderDetails-stories.03123516.iframe.bundle.js b/LocalHeaderDetails-__stories__-LocalHeaderDetails-stories.b275925b.iframe.bundle.js
similarity index 79%
rename from LocalHeaderDetails-__stories__-LocalHeaderDetails-stories.03123516.iframe.bundle.js
rename to LocalHeaderDetails-__stories__-LocalHeaderDetails-stories.b275925b.iframe.bundle.js
index dd17148ed05..3fef4788132 100644
--- a/LocalHeaderDetails-__stories__-LocalHeaderDetails-stories.03123516.iframe.bundle.js
+++ b/LocalHeaderDetails-__stories__-LocalHeaderDetails-stories.b275925b.iframe.bundle.js
@@ -1 +1 @@
-"use strict";(self.webpackChunkdata_hub_frontend=self.webpackChunkdata_hub_frontend||[]).push([[1684],{"./src/client/components/LocalHeaderDetails/__stories__/LocalHeaderDetails.stories.jsx":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.r(__webpack_exports__),__webpack_require__.d(__webpack_exports__,{Default:()=>Default,__namedExportsOrder:()=>__namedExportsOrder,default:()=>LocalHeaderDetails_stories});var _templateObject,_templateObject2,_templateObject3,react=__webpack_require__("./node_modules/react/index.js"),prop_types=(__webpack_require__("./node_modules/core-js/modules/es.array.slice.js"),__webpack_require__("./node_modules/core-js/modules/es.object.freeze.js"),__webpack_require__("./node_modules/core-js/modules/es.array.map.js"),__webpack_require__("./node_modules/prop-types/index.js")),prop_types_default=__webpack_require__.n(prop_types),styled_components_browser_esm=__webpack_require__("./node_modules/styled-components/dist/styled-components.browser.esm.js"),govuk_react_constants_esm=__webpack_require__("./node_modules/@govuk-react/constants/dist/govuk-react-constants.esm.js"),colours=__webpack_require__("./src/client/utils/colours.js");function _taggedTemplateLiteral(e,t){return t||(t=e.slice(0)),Object.freeze(Object.defineProperties(e,{raw:{value:Object.freeze(t)}}))}var StyledHeaderDetails=(0,styled_components_browser_esm.Ay)("div")(_templateObject||(_templateObject=_taggedTemplateLiteral(["\n background-color: ",";\n"])),colours.P1),StyledHeaderList=(0,styled_components_browser_esm.Ay)("li")(_templateObject2||(_templateObject2=_taggedTemplateLiteral(["\n display: inline-block;\n padding-right: ",";\n"])),govuk_react_constants_esm.Es.SCALE_5),StyledHeaderListLabel=(0,styled_components_browser_esm.Ay)("label")(_templateObject3||(_templateObject3=_taggedTemplateLiteral(["\n color: ",";\n"])),colours.IC),LocalHeaderDetails=function LocalHeaderDetails(_ref){var items=_ref.items;return react.createElement(StyledHeaderDetails,{"aria-label":"local header details","data-test":"localHeaderDetails",role:"region"},items.map((function(item){return react.createElement(StyledHeaderList,{key:item.label},react.createElement(StyledHeaderListLabel,null,item.label),react.createElement("p",null,item.value))})))};LocalHeaderDetails.propTypes={items:prop_types_default().arrayOf(prop_types_default().shape({label:prop_types_default().string.isRequired,value:prop_types_default().node.isRequired})).isRequired};const components_LocalHeaderDetails=LocalHeaderDetails;LocalHeaderDetails.__docgenInfo={description:"A component to be used within the `LocalHeader` component to add more information to a header.",methods:[],displayName:"LocalHeaderDetails",props:{items:{description:"Contains the details items to display in a LocalHeader.\nTakes an array of objects with labels and values, displayed as pairs horizontally in the header.",type:{name:"arrayOf",value:{name:"shape",value:{label:{name:"string",required:!0},value:{name:"node",required:!0}}}},required:!0}}};var LocalHeader=__webpack_require__("./src/client/components/LocalHeader/LocalHeader.jsx"),items=[{label:"Name",value:"A name"},{label:"Location",value:"A location"},{label:"Company",value:"A company"},{label:"Job",value:"A job"}];const LocalHeaderDetails_stories={title:"LocalHeader/LocalHeaderDetails",parameters:{component:components_LocalHeaderDetails}};var Default=function Default(){return react.createElement(LocalHeader.A,{breadcrumbs:[{link:"/",text:"Home"},{text:"Example"}],heading:"Example"},react.createElement(components_LocalHeaderDetails,{items}))};Default.parameters={...Default.parameters,docs:{...Default.parameters?.docs,source:{originalSource:"() => \n \n ",...Default.parameters?.docs?.source}}};const __namedExportsOrder=["Default"]}}]);
\ No newline at end of file
+"use strict";(self.webpackChunkdata_hub_frontend=self.webpackChunkdata_hub_frontend||[]).push([[1684],{"./src/client/components/LocalHeaderDetails/__stories__/LocalHeaderDetails.stories.jsx":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.r(__webpack_exports__),__webpack_require__.d(__webpack_exports__,{Default:()=>Default,__namedExportsOrder:()=>__namedExportsOrder,default:()=>LocalHeaderDetails_stories});var _templateObject,_templateObject2,_templateObject3,react=__webpack_require__("./node_modules/react/index.js"),prop_types=(__webpack_require__("./node_modules/core-js/modules/es.array.slice.js"),__webpack_require__("./node_modules/core-js/modules/es.object.freeze.js"),__webpack_require__("./node_modules/core-js/modules/es.array.map.js"),__webpack_require__("./node_modules/prop-types/index.js")),prop_types_default=__webpack_require__.n(prop_types),styled_components_browser_esm=__webpack_require__("./node_modules/styled-components/dist/styled-components.browser.esm.js"),govuk_react_constants_esm=__webpack_require__("./node_modules/@govuk-react/constants/dist/govuk-react-constants.esm.js"),colours=__webpack_require__("./src/client/utils/colours.js");function _taggedTemplateLiteral(e,t){return t||(t=e.slice(0)),Object.freeze(Object.defineProperties(e,{raw:{value:Object.freeze(t)}}))}var StyledHeaderDetails=(0,styled_components_browser_esm.Ay)("div")(_templateObject||(_templateObject=_taggedTemplateLiteral(["\n background-color: ",";\n"])),colours.P1),StyledHeaderList=(0,styled_components_browser_esm.Ay)("li")(_templateObject2||(_templateObject2=_taggedTemplateLiteral(["\n display: inline-block;\n padding-right: ",";\n"])),govuk_react_constants_esm.Es.SCALE_5),StyledHeaderListLabel=(0,styled_components_browser_esm.Ay)("label")(_templateObject3||(_templateObject3=_taggedTemplateLiteral(["\n color: ",";\n"])),colours.IC),LocalHeaderDetails=function LocalHeaderDetails(_ref){var items=_ref.items;return react.createElement(StyledHeaderDetails,{"aria-label":"local header details","data-test":"localHeaderDetails",role:"region"},items.map((function(item){return react.createElement(StyledHeaderList,{key:item.label},react.createElement(StyledHeaderListLabel,null,item.label),react.createElement("p",null,item.value))})))};LocalHeaderDetails.propTypes={items:prop_types_default().arrayOf(prop_types_default().shape({label:prop_types_default().string.isRequired,value:prop_types_default().node.isRequired})).isRequired};const components_LocalHeaderDetails=LocalHeaderDetails;LocalHeaderDetails.__docgenInfo={description:"A component to be used within the `LocalHeader` component to add more information to a header.",methods:[],displayName:"LocalHeaderDetails",props:{items:{description:"Contains the details items to display in a LocalHeader.\nTakes an array of objects with labels and values, displayed as pairs horizontally in the header.",type:{name:"arrayOf",value:{name:"shape",value:{label:{name:"string",required:!0},value:{name:"node",required:!0}}}},required:!0}}};var LocalHeader=__webpack_require__("./src/client/components/LocalHeader/LocalHeader.jsx");const items=[{label:"Name",value:"A name"},{label:"Location",value:"A location"},{label:"Company",value:"A company"},{label:"Job",value:"A job"}],LocalHeaderDetails_stories={title:"LocalHeader/LocalHeaderDetails",parameters:{component:components_LocalHeaderDetails}},Default=()=>react.createElement(LocalHeader.A,{breadcrumbs:[{link:"/",text:"Home"},{text:"Example"}],heading:"Example"},react.createElement(components_LocalHeaderDetails,{items}));Default.parameters={...Default.parameters,docs:{...Default.parameters?.docs,source:{originalSource:"() => \n \n ",...Default.parameters?.docs?.source}}};const __namedExportsOrder=["Default"]}}]);
\ No newline at end of file
diff --git a/Main-__stories__-Main-stories.10429492.iframe.bundle.js b/Main-__stories__-Main-stories.10429492.iframe.bundle.js
deleted file mode 100644
index 757841d1325..00000000000
--- a/Main-__stories__-Main-stories.10429492.iframe.bundle.js
+++ /dev/null
@@ -1 +0,0 @@
-"use strict";(self.webpackChunkdata_hub_frontend=self.webpackChunkdata_hub_frontend||[]).push([[1322],{"./src/client/components/Main/__stories__/Main.stories.jsx":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.r(__webpack_exports__),__webpack_require__.d(__webpack_exports__,{Default:()=>Default,__namedExportsOrder:()=>__namedExportsOrder,default:()=>__WEBPACK_DEFAULT_EXPORT__});var react__WEBPACK_IMPORTED_MODULE_0__=__webpack_require__("./node_modules/react/index.js"),Main__WEBPACK_IMPORTED_MODULE_1__=__webpack_require__("./src/client/components/Main/index.jsx");const __WEBPACK_DEFAULT_EXPORT__={title:"Main",parameters:{component:Main__WEBPACK_IMPORTED_MODULE_1__.A}};var Default=function Default(){return react__WEBPACK_IMPORTED_MODULE_0__.createElement(Main__WEBPACK_IMPORTED_MODULE_1__.A,null,react__WEBPACK_IMPORTED_MODULE_0__.createElement("p",null,"Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua."))};Default.parameters={...Default.parameters,docs:{...Default.parameters?.docs,source:{originalSource:"() => \n \n Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod\n tempor incididunt ut labore et dolore magna aliqua. Lorem ipsum dolor sit\n amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut\n labore et dolore magna aliqua.\n
\n ",...Default.parameters?.docs?.source}}};const __namedExportsOrder=["Default"]}}]);
\ No newline at end of file
diff --git a/Main-__stories__-Main-stories.b779bf14.iframe.bundle.js b/Main-__stories__-Main-stories.b779bf14.iframe.bundle.js
new file mode 100644
index 00000000000..88c3febfdf9
--- /dev/null
+++ b/Main-__stories__-Main-stories.b779bf14.iframe.bundle.js
@@ -0,0 +1 @@
+"use strict";(self.webpackChunkdata_hub_frontend=self.webpackChunkdata_hub_frontend||[]).push([[1322],{"./src/client/components/Main/__stories__/Main.stories.jsx":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.r(__webpack_exports__),__webpack_require__.d(__webpack_exports__,{Default:()=>Default,__namedExportsOrder:()=>__namedExportsOrder,default:()=>__WEBPACK_DEFAULT_EXPORT__});var react__WEBPACK_IMPORTED_MODULE_0__=__webpack_require__("./node_modules/react/index.js"),Main__WEBPACK_IMPORTED_MODULE_1__=__webpack_require__("./src/client/components/Main/index.jsx");const __WEBPACK_DEFAULT_EXPORT__={title:"Main",parameters:{component:Main__WEBPACK_IMPORTED_MODULE_1__.A}},Default=()=>react__WEBPACK_IMPORTED_MODULE_0__.createElement(Main__WEBPACK_IMPORTED_MODULE_1__.A,null,react__WEBPACK_IMPORTED_MODULE_0__.createElement("p",null,"Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua."));Default.parameters={...Default.parameters,docs:{...Default.parameters?.docs,source:{originalSource:"() => \n \n Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod\n tempor incididunt ut labore et dolore magna aliqua. Lorem ipsum dolor sit\n amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut\n labore et dolore magna aliqua.\n
\n ",...Default.parameters?.docs?.source}}};const __namedExportsOrder=["Default"]}}]);
\ No newline at end of file
diff --git a/Metadata-__stories__-Metadata-stories.67318f97.iframe.bundle.js b/Metadata-__stories__-Metadata-stories.67318f97.iframe.bundle.js
deleted file mode 100644
index e47d3e59f1f..00000000000
--- a/Metadata-__stories__-Metadata-stories.67318f97.iframe.bundle.js
+++ /dev/null
@@ -1 +0,0 @@
-"use strict";(self.webpackChunkdata_hub_frontend=self.webpackChunkdata_hub_frontend||[]).push([[2558],{"./src/client/components/Metadata/__stories__/Metadata.stories.jsx":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.r(__webpack_exports__),__webpack_require__.d(__webpack_exports__,{Default:()=>Default,__namedExportsOrder:()=>__namedExportsOrder,default:()=>__WEBPACK_DEFAULT_EXPORT__});var react__WEBPACK_IMPORTED_MODULE_0__=__webpack_require__("./node_modules/react/index.js"),_govuk_react_link__WEBPACK_IMPORTED_MODULE_1__=__webpack_require__("./node_modules/@govuk-react/link/dist/govuk-react-link.esm.js"),Metadata__WEBPACK_IMPORTED_MODULE_2__=__webpack_require__("./src/client/components/Metadata/index.jsx"),metadata=[{label:"Updated on",value:"5 September 2019"},{label:"Sector",value:"Environment"},{label:"Parent company",value:react__WEBPACK_IMPORTED_MODULE_0__.createElement(_govuk_react_link__WEBPACK_IMPORTED_MODULE_1__.A,{href:"http://example.com"},"E-corp LTD")}];const __WEBPACK_DEFAULT_EXPORT__={title:"Metadata",parameters:{component:Metadata__WEBPACK_IMPORTED_MODULE_2__.A}};var Default=function Default(){return react__WEBPACK_IMPORTED_MODULE_0__.createElement(Metadata__WEBPACK_IMPORTED_MODULE_2__.A,{rows:metadata})};Default.parameters={...Default.parameters,docs:{...Default.parameters?.docs,source:{originalSource:"() => ",...Default.parameters?.docs?.source}}};const __namedExportsOrder=["Default"]}}]);
\ No newline at end of file
diff --git a/Metadata-__stories__-Metadata-stories.f9e62acb.iframe.bundle.js b/Metadata-__stories__-Metadata-stories.f9e62acb.iframe.bundle.js
new file mode 100644
index 00000000000..f124433a60c
--- /dev/null
+++ b/Metadata-__stories__-Metadata-stories.f9e62acb.iframe.bundle.js
@@ -0,0 +1 @@
+"use strict";(self.webpackChunkdata_hub_frontend=self.webpackChunkdata_hub_frontend||[]).push([[2558],{"./src/client/components/Metadata/__stories__/Metadata.stories.jsx":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.r(__webpack_exports__),__webpack_require__.d(__webpack_exports__,{Default:()=>Default,__namedExportsOrder:()=>__namedExportsOrder,default:()=>__WEBPACK_DEFAULT_EXPORT__});var react__WEBPACK_IMPORTED_MODULE_0__=__webpack_require__("./node_modules/react/index.js"),_govuk_react_link__WEBPACK_IMPORTED_MODULE_1__=__webpack_require__("./node_modules/@govuk-react/link/dist/govuk-react-link.esm.js"),Metadata__WEBPACK_IMPORTED_MODULE_2__=__webpack_require__("./src/client/components/Metadata/index.jsx");const metadata=[{label:"Updated on",value:"5 September 2019"},{label:"Sector",value:"Environment"},{label:"Parent company",value:react__WEBPACK_IMPORTED_MODULE_0__.createElement(_govuk_react_link__WEBPACK_IMPORTED_MODULE_1__.A,{href:"http://example.com"},"E-corp LTD")}],__WEBPACK_DEFAULT_EXPORT__={title:"Metadata",parameters:{component:Metadata__WEBPACK_IMPORTED_MODULE_2__.A}},Default=()=>react__WEBPACK_IMPORTED_MODULE_0__.createElement(Metadata__WEBPACK_IMPORTED_MODULE_2__.A,{rows:metadata});Default.parameters={...Default.parameters,docs:{...Default.parameters?.docs,source:{originalSource:"() => ",...Default.parameters?.docs?.source}}};const __namedExportsOrder=["Default"]}}]);
\ No newline at end of file
diff --git a/NewWindowLink-__stories__-NewWindowLink-stories.8d419715.iframe.bundle.js b/NewWindowLink-__stories__-NewWindowLink-stories.8d419715.iframe.bundle.js
deleted file mode 100644
index e21e3bbb7b7..00000000000
--- a/NewWindowLink-__stories__-NewWindowLink-stories.8d419715.iframe.bundle.js
+++ /dev/null
@@ -1 +0,0 @@
-"use strict";(self.webpackChunkdata_hub_frontend=self.webpackChunkdata_hub_frontend||[]).push([[1186],{"./src/client/components/NewWindowLink/__stories__/NewWindowLink.stories.jsx":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.r(__webpack_exports__),__webpack_require__.d(__webpack_exports__,{CustomAriaLabel:()=>CustomAriaLabel,Default:()=>Default,__namedExportsOrder:()=>__namedExportsOrder,default:()=>__WEBPACK_DEFAULT_EXPORT__});var react__WEBPACK_IMPORTED_MODULE_0__=__webpack_require__("./node_modules/react/index.js"),NewWindowLink__WEBPACK_IMPORTED_MODULE_1__=__webpack_require__("./src/client/components/NewWindowLink/index.jsx");const __WEBPACK_DEFAULT_EXPORT__={title:"NewWindowLink",parameters:{component:NewWindowLink__WEBPACK_IMPORTED_MODULE_1__.A}};var Default=function Default(){return react__WEBPACK_IMPORTED_MODULE_0__.createElement(NewWindowLink__WEBPACK_IMPORTED_MODULE_1__.A,{href:"https://example.com"},"This is a link")},CustomAriaLabel=function CustomAriaLabel(){return react__WEBPACK_IMPORTED_MODULE_0__.createElement(NewWindowLink__WEBPACK_IMPORTED_MODULE_1__.A,{href:"https://example.com","aria-label":"custom help text for screen readers which overrides the link text"},"This is a link")};CustomAriaLabel.story={name:"Custom aria-label"},Default.parameters={...Default.parameters,docs:{...Default.parameters?.docs,source:{originalSource:'() => This is a link ',...Default.parameters?.docs?.source}}},CustomAriaLabel.parameters={...CustomAriaLabel.parameters,docs:{...CustomAriaLabel.parameters?.docs,source:{originalSource:'() => \n This is a link\n ',...CustomAriaLabel.parameters?.docs?.source}}};const __namedExportsOrder=["Default","CustomAriaLabel"]}}]);
\ No newline at end of file
diff --git a/NewWindowLink-__stories__-NewWindowLink-stories.bea6f080.iframe.bundle.js b/NewWindowLink-__stories__-NewWindowLink-stories.bea6f080.iframe.bundle.js
new file mode 100644
index 00000000000..8c671c984f7
--- /dev/null
+++ b/NewWindowLink-__stories__-NewWindowLink-stories.bea6f080.iframe.bundle.js
@@ -0,0 +1 @@
+"use strict";(self.webpackChunkdata_hub_frontend=self.webpackChunkdata_hub_frontend||[]).push([[1186],{"./src/client/components/NewWindowLink/__stories__/NewWindowLink.stories.jsx":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.r(__webpack_exports__),__webpack_require__.d(__webpack_exports__,{CustomAriaLabel:()=>CustomAriaLabel,Default:()=>Default,__namedExportsOrder:()=>__namedExportsOrder,default:()=>__WEBPACK_DEFAULT_EXPORT__});var react__WEBPACK_IMPORTED_MODULE_0__=__webpack_require__("./node_modules/react/index.js"),NewWindowLink__WEBPACK_IMPORTED_MODULE_1__=__webpack_require__("./src/client/components/NewWindowLink/index.jsx");const __WEBPACK_DEFAULT_EXPORT__={title:"NewWindowLink",parameters:{component:NewWindowLink__WEBPACK_IMPORTED_MODULE_1__.A}},Default=()=>react__WEBPACK_IMPORTED_MODULE_0__.createElement(NewWindowLink__WEBPACK_IMPORTED_MODULE_1__.A,{href:"https://example.com"},"This is a link"),CustomAriaLabel=()=>react__WEBPACK_IMPORTED_MODULE_0__.createElement(NewWindowLink__WEBPACK_IMPORTED_MODULE_1__.A,{href:"https://example.com","aria-label":"custom help text for screen readers which overrides the link text"},"This is a link");CustomAriaLabel.story={name:"Custom aria-label"},Default.parameters={...Default.parameters,docs:{...Default.parameters?.docs,source:{originalSource:'() => This is a link ',...Default.parameters?.docs?.source}}},CustomAriaLabel.parameters={...CustomAriaLabel.parameters,docs:{...CustomAriaLabel.parameters?.docs,source:{originalSource:'() => \n This is a link\n ',...CustomAriaLabel.parameters?.docs?.source}}};const __namedExportsOrder=["Default","CustomAriaLabel"]}}]);
\ No newline at end of file
diff --git a/NotificationBadge-__stories__-NotificationBadge-stories.68ee959a.iframe.bundle.js b/NotificationBadge-__stories__-NotificationBadge-stories.8229ec39.iframe.bundle.js
similarity index 65%
rename from NotificationBadge-__stories__-NotificationBadge-stories.68ee959a.iframe.bundle.js
rename to NotificationBadge-__stories__-NotificationBadge-stories.8229ec39.iframe.bundle.js
index fe3448c6e7f..12ad690ec30 100644
--- a/NotificationBadge-__stories__-NotificationBadge-stories.68ee959a.iframe.bundle.js
+++ b/NotificationBadge-__stories__-NotificationBadge-stories.8229ec39.iframe.bundle.js
@@ -1 +1 @@
-"use strict";(self.webpackChunkdata_hub_frontend=self.webpackChunkdata_hub_frontend||[]).push([[2342],{"./src/client/components/NotificationBadge/__stories__/NotificationBadge.stories.jsx":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.r(__webpack_exports__),__webpack_require__.d(__webpack_exports__,{Default:()=>Default,__namedExportsOrder:()=>__namedExportsOrder,default:()=>__WEBPACK_DEFAULT_EXPORT__});var react__WEBPACK_IMPORTED_MODULE_0__=__webpack_require__("./node_modules/react/index.js"),NotificationBadge__WEBPACK_IMPORTED_MODULE_1__=__webpack_require__("./src/client/components/NotificationBadge/index.jsx");const __WEBPACK_DEFAULT_EXPORT__={title:"NotificationBadge",parameters:{component:NotificationBadge__WEBPACK_IMPORTED_MODULE_1__.Ay}};var Default=function Default(){return react__WEBPACK_IMPORTED_MODULE_0__.createElement(NotificationBadge__WEBPACK_IMPORTED_MODULE_1__.Ay,{value:3})};Default.parameters={...Default.parameters,docs:{...Default.parameters?.docs,source:{originalSource:"() => ",...Default.parameters?.docs?.source}}};const __namedExportsOrder=["Default"]}}]);
\ No newline at end of file
+"use strict";(self.webpackChunkdata_hub_frontend=self.webpackChunkdata_hub_frontend||[]).push([[2342],{"./src/client/components/NotificationBadge/__stories__/NotificationBadge.stories.jsx":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.r(__webpack_exports__),__webpack_require__.d(__webpack_exports__,{Default:()=>Default,__namedExportsOrder:()=>__namedExportsOrder,default:()=>__WEBPACK_DEFAULT_EXPORT__});var react__WEBPACK_IMPORTED_MODULE_0__=__webpack_require__("./node_modules/react/index.js"),NotificationBadge__WEBPACK_IMPORTED_MODULE_1__=__webpack_require__("./src/client/components/NotificationBadge/index.jsx");const __WEBPACK_DEFAULT_EXPORT__={title:"NotificationBadge",parameters:{component:NotificationBadge__WEBPACK_IMPORTED_MODULE_1__.Ay}},Default=()=>react__WEBPACK_IMPORTED_MODULE_0__.createElement(NotificationBadge__WEBPACK_IMPORTED_MODULE_1__.Ay,{value:3});Default.parameters={...Default.parameters,docs:{...Default.parameters?.docs,source:{originalSource:"() => ",...Default.parameters?.docs?.source}}};const __namedExportsOrder=["Default"]}}]);
\ No newline at end of file
diff --git a/Pagination-__stories__-Pagination-stories.223b37ad.iframe.bundle.js b/Pagination-__stories__-Pagination-stories.223b37ad.iframe.bundle.js
new file mode 100644
index 00000000000..f3c06bec676
--- /dev/null
+++ b/Pagination-__stories__-Pagination-stories.223b37ad.iframe.bundle.js
@@ -0,0 +1 @@
+"use strict";(self.webpackChunkdata_hub_frontend=self.webpackChunkdata_hub_frontend||[]).push([[3480],{"./src/client/components/Pagination/__stories__/Pagination.stories.jsx":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.r(__webpack_exports__),__webpack_require__.d(__webpack_exports__,{Default:()=>Default,Routed:()=>Routed,__namedExportsOrder:()=>__namedExportsOrder,default:()=>__WEBPACK_DEFAULT_EXPORT__});var react__WEBPACK_IMPORTED_MODULE_0__=__webpack_require__("./node_modules/react/index.js"),_RoutedPagination__WEBPACK_IMPORTED_MODULE_1__=__webpack_require__("./src/client/components/Pagination/RoutedPagination.jsx"),___WEBPACK_IMPORTED_MODULE_2__=__webpack_require__("./src/client/components/Pagination/index.jsx");const PaginationWithState=()=>{const[activePage,setActivePage]=(0,react__WEBPACK_IMPORTED_MODULE_0__.useState)(1);return react__WEBPACK_IMPORTED_MODULE_0__.createElement(___WEBPACK_IMPORTED_MODULE_2__.A,{activePage,totalPages:1e3,onPageClick:(page,event)=>{setActivePage(page),event.preventDefault()}})},RoutedPaginationWithState=()=>{const exampleItems=[...Array(150).keys()].map((i=>({id:i+1,name:"Item "+(i+1)}))),[items,setItems]=(0,react__WEBPACK_IMPORTED_MODULE_0__.useState)({exampleItems,pageOfItems:[]});return react__WEBPACK_IMPORTED_MODULE_0__.createElement(react__WEBPACK_IMPORTED_MODULE_0__.Fragment,null,react__WEBPACK_IMPORTED_MODULE_0__.createElement("div",{style:{textAlign:"center"}},react__WEBPACK_IMPORTED_MODULE_0__.createElement("p",null,"Total items: ",exampleItems.length),items.pageOfItems.map((item=>react__WEBPACK_IMPORTED_MODULE_0__.createElement("div",{key:item.id},item.name)))),react__WEBPACK_IMPORTED_MODULE_0__.createElement(_RoutedPagination__WEBPACK_IMPORTED_MODULE_1__.A,{items:exampleItems.length,onChangePage:newPager=>{const pageOfItems=exampleItems.slice(newPager.startIndex,newPager.endIndex+1);setItems({...items,pageOfItems})}}))},__WEBPACK_DEFAULT_EXPORT__={title:"Pagination",parameters:{component:___WEBPACK_IMPORTED_MODULE_2__.A}},Default=()=>react__WEBPACK_IMPORTED_MODULE_0__.createElement(PaginationWithState,null),Routed=()=>react__WEBPACK_IMPORTED_MODULE_0__.createElement(RoutedPaginationWithState,null);Default.parameters={...Default.parameters,docs:{...Default.parameters?.docs,source:{originalSource:"() => ",...Default.parameters?.docs?.source}}},Routed.parameters={...Routed.parameters,docs:{...Routed.parameters?.docs,source:{originalSource:"() => ",...Routed.parameters?.docs?.source}}};const __namedExportsOrder=["Default","Routed"]}}]);
\ No newline at end of file
diff --git a/Pagination-__stories__-Pagination-stories.636754f2.iframe.bundle.js b/Pagination-__stories__-Pagination-stories.636754f2.iframe.bundle.js
deleted file mode 100644
index daa2f52b6fa..00000000000
--- a/Pagination-__stories__-Pagination-stories.636754f2.iframe.bundle.js
+++ /dev/null
@@ -1 +0,0 @@
-"use strict";(self.webpackChunkdata_hub_frontend=self.webpackChunkdata_hub_frontend||[]).push([[3480],{"./src/client/components/Pagination/__stories__/Pagination.stories.jsx":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.r(__webpack_exports__),__webpack_require__.d(__webpack_exports__,{Default:()=>Default,Routed:()=>Routed,__namedExportsOrder:()=>__namedExportsOrder,default:()=>__WEBPACK_DEFAULT_EXPORT__});__webpack_require__("./node_modules/core-js/modules/es.symbol.js"),__webpack_require__("./node_modules/core-js/modules/es.symbol.description.js"),__webpack_require__("./node_modules/core-js/modules/es.symbol.iterator.js"),__webpack_require__("./node_modules/core-js/modules/es.symbol.to-primitive.js"),__webpack_require__("./node_modules/core-js/modules/es.array.filter.js"),__webpack_require__("./node_modules/core-js/modules/es.array.from.js"),__webpack_require__("./node_modules/core-js/modules/es.array.iterator.js"),__webpack_require__("./node_modules/core-js/modules/es.array.map.js"),__webpack_require__("./node_modules/core-js/modules/es.array.slice.js"),__webpack_require__("./node_modules/core-js/modules/es.date.to-primitive.js"),__webpack_require__("./node_modules/core-js/modules/es.function.name.js"),__webpack_require__("./node_modules/core-js/modules/es.number.constructor.js"),__webpack_require__("./node_modules/core-js/modules/es.object.get-own-property-descriptor.js"),__webpack_require__("./node_modules/core-js/modules/es.object.get-own-property-descriptors.js"),__webpack_require__("./node_modules/core-js/modules/es.object.keys.js"),__webpack_require__("./node_modules/core-js/modules/es.object.to-string.js"),__webpack_require__("./node_modules/core-js/modules/es.regexp.exec.js"),__webpack_require__("./node_modules/core-js/modules/es.regexp.to-string.js"),__webpack_require__("./node_modules/core-js/modules/es.string.iterator.js"),__webpack_require__("./node_modules/core-js/modules/web.dom-collections.for-each.js"),__webpack_require__("./node_modules/core-js/modules/web.dom-collections.iterator.js");var react__WEBPACK_IMPORTED_MODULE_21__=__webpack_require__("./node_modules/react/index.js"),_RoutedPagination__WEBPACK_IMPORTED_MODULE_22__=__webpack_require__("./src/client/components/Pagination/RoutedPagination.jsx"),___WEBPACK_IMPORTED_MODULE_23__=__webpack_require__("./src/client/components/Pagination/index.jsx");function _typeof(o){return _typeof="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(o){return typeof o}:function(o){return o&&"function"==typeof Symbol&&o.constructor===Symbol&&o!==Symbol.prototype?"symbol":typeof o},_typeof(o)}function ownKeys(e,r){var t=Object.keys(e);if(Object.getOwnPropertySymbols){var o=Object.getOwnPropertySymbols(e);r&&(o=o.filter((function(r){return Object.getOwnPropertyDescriptor(e,r).enumerable}))),t.push.apply(t,o)}return t}function _objectSpread(e){for(var r=1;rr.length)&&(a=r.length);for(var e=0,n=Array(a);e ",...Default.parameters?.docs?.source}}},Routed.parameters={...Routed.parameters,docs:{...Routed.parameters?.docs,source:{originalSource:"() => ",...Routed.parameters?.docs?.source}}};const __namedExportsOrder=["Default","Routed"]}}]);
\ No newline at end of file
diff --git a/Panel-__stories__-Panel-stories.23732beb.iframe.bundle.js b/Panel-__stories__-Panel-stories.23732beb.iframe.bundle.js
deleted file mode 100644
index 9770516d594..00000000000
--- a/Panel-__stories__-Panel-stories.23732beb.iframe.bundle.js
+++ /dev/null
@@ -1 +0,0 @@
-"use strict";(self.webpackChunkdata_hub_frontend=self.webpackChunkdata_hub_frontend||[]).push([[6214],{"./src/client/components/Panel/__stories__/Panel.stories.jsx":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.r(__webpack_exports__),__webpack_require__.d(__webpack_exports__,{Default:()=>Default,__namedExportsOrder:()=>__namedExportsOrder,default:()=>__WEBPACK_DEFAULT_EXPORT__});var react__WEBPACK_IMPORTED_MODULE_0__=__webpack_require__("./node_modules/react/index.js"),Panel__WEBPACK_IMPORTED_MODULE_1__=__webpack_require__("./src/client/components/Panel/index.jsx");const __WEBPACK_DEFAULT_EXPORT__={title:"Panel",parameters:{component:Panel__WEBPACK_IMPORTED_MODULE_1__.A}};var Default=function Default(){return react__WEBPACK_IMPORTED_MODULE_0__.createElement(Panel__WEBPACK_IMPORTED_MODULE_1__.A,{title:"How do referrals work?"},react__WEBPACK_IMPORTED_MODULE_0__.createElement("p",null,"Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua."),react__WEBPACK_IMPORTED_MODULE_0__.createElement("p",null,"Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua"))};Default.parameters={...Default.parameters,docs:{...Default.parameters?.docs,source:{originalSource:'() => \n \n Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod\n tempor incididunt ut labore et dolore magna aliqua. Lorem ipsum dolor sit\n amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut\n labore et dolore magna aliqua.\n
\n \n Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod\n tempor incididunt ut labore et dolore magna aliqua\n
\n ',...Default.parameters?.docs?.source}}};const __namedExportsOrder=["Default"]}}]);
\ No newline at end of file
diff --git a/Panel-__stories__-Panel-stories.66f9c5e8.iframe.bundle.js b/Panel-__stories__-Panel-stories.66f9c5e8.iframe.bundle.js
new file mode 100644
index 00000000000..a9e807ff9f4
--- /dev/null
+++ b/Panel-__stories__-Panel-stories.66f9c5e8.iframe.bundle.js
@@ -0,0 +1 @@
+"use strict";(self.webpackChunkdata_hub_frontend=self.webpackChunkdata_hub_frontend||[]).push([[6214],{"./src/client/components/Panel/__stories__/Panel.stories.jsx":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.r(__webpack_exports__),__webpack_require__.d(__webpack_exports__,{Default:()=>Default,__namedExportsOrder:()=>__namedExportsOrder,default:()=>__WEBPACK_DEFAULT_EXPORT__});var react__WEBPACK_IMPORTED_MODULE_0__=__webpack_require__("./node_modules/react/index.js"),Panel__WEBPACK_IMPORTED_MODULE_1__=__webpack_require__("./src/client/components/Panel/index.jsx");const __WEBPACK_DEFAULT_EXPORT__={title:"Panel",parameters:{component:Panel__WEBPACK_IMPORTED_MODULE_1__.A}},Default=()=>react__WEBPACK_IMPORTED_MODULE_0__.createElement(Panel__WEBPACK_IMPORTED_MODULE_1__.A,{title:"How do referrals work?"},react__WEBPACK_IMPORTED_MODULE_0__.createElement("p",null,"Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua."),react__WEBPACK_IMPORTED_MODULE_0__.createElement("p",null,"Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua"));Default.parameters={...Default.parameters,docs:{...Default.parameters?.docs,source:{originalSource:'() => \n \n Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod\n tempor incididunt ut labore et dolore magna aliqua. Lorem ipsum dolor sit\n amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut\n labore et dolore magna aliqua.\n
\n \n Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod\n tempor incididunt ut labore et dolore magna aliqua\n
\n ',...Default.parameters?.docs?.source}}};const __namedExportsOrder=["Default"]}}]);
\ No newline at end of file
diff --git a/ReadMore-__stories__-ReadMore-stories.3cbf8859.iframe.bundle.js b/ReadMore-__stories__-ReadMore-stories.3cbf8859.iframe.bundle.js
deleted file mode 100644
index 97ea21af9a4..00000000000
--- a/ReadMore-__stories__-ReadMore-stories.3cbf8859.iframe.bundle.js
+++ /dev/null
@@ -1 +0,0 @@
-"use strict";(self.webpackChunkdata_hub_frontend=self.webpackChunkdata_hub_frontend||[]).push([[7322],{"./src/client/components/ReadMore/__stories__/ReadMore.stories.jsx":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.r(__webpack_exports__),__webpack_require__.d(__webpack_exports__,{Custom:()=>Custom,Default:()=>Default,__namedExportsOrder:()=>__namedExportsOrder,default:()=>__WEBPACK_DEFAULT_EXPORT__});var ReadMore__WEBPACK_IMPORTED_MODULE_0__=__webpack_require__("./src/client/components/ReadMore/index.jsx"),content="Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.";const __WEBPACK_DEFAULT_EXPORT__={title:"ReadMore",parameters:{component:ReadMore__WEBPACK_IMPORTED_MODULE_0__.A}};var Default=function Default(){return React.createElement(ReadMore__WEBPACK_IMPORTED_MODULE_0__.A,{text:content})},Custom=function Custom(){return React.createElement(React.Fragment,null,React.createElement("p",null,"Character limit set to 10"),React.createElement(ReadMore__WEBPACK_IMPORTED_MODULE_0__.A,{text:content,count:20}))};Default.parameters={...Default.parameters,docs:{...Default.parameters?.docs,source:{originalSource:"() => ",...Default.parameters?.docs?.source}}},Custom.parameters={...Custom.parameters,docs:{...Custom.parameters?.docs,source:{originalSource:"() => <>\n Character limit set to 10
\n \n >",...Custom.parameters?.docs?.source}}};const __namedExportsOrder=["Default","Custom"]}}]);
\ No newline at end of file
diff --git a/ReadMore-__stories__-ReadMore-stories.eb019b30.iframe.bundle.js b/ReadMore-__stories__-ReadMore-stories.eb019b30.iframe.bundle.js
new file mode 100644
index 00000000000..0652a3125b6
--- /dev/null
+++ b/ReadMore-__stories__-ReadMore-stories.eb019b30.iframe.bundle.js
@@ -0,0 +1 @@
+"use strict";(self.webpackChunkdata_hub_frontend=self.webpackChunkdata_hub_frontend||[]).push([[7322],{"./src/client/components/ReadMore/__stories__/ReadMore.stories.jsx":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.r(__webpack_exports__),__webpack_require__.d(__webpack_exports__,{Custom:()=>Custom,Default:()=>Default,__namedExportsOrder:()=>__namedExportsOrder,default:()=>__WEBPACK_DEFAULT_EXPORT__});var ReadMore__WEBPACK_IMPORTED_MODULE_0__=__webpack_require__("./src/client/components/ReadMore/index.jsx");const content="Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.",__WEBPACK_DEFAULT_EXPORT__={title:"ReadMore",parameters:{component:ReadMore__WEBPACK_IMPORTED_MODULE_0__.A}},Default=()=>React.createElement(ReadMore__WEBPACK_IMPORTED_MODULE_0__.A,{text:content}),Custom=()=>React.createElement(React.Fragment,null,React.createElement("p",null,"Character limit set to 10"),React.createElement(ReadMore__WEBPACK_IMPORTED_MODULE_0__.A,{text:content,count:20}));Default.parameters={...Default.parameters,docs:{...Default.parameters?.docs,source:{originalSource:"() => ",...Default.parameters?.docs?.source}}},Custom.parameters={...Custom.parameters,docs:{...Custom.parameters?.docs,source:{originalSource:"() => <>\n Character limit set to 10
\n \n >",...Custom.parameters?.docs?.source}}};const __namedExportsOrder=["Default","Custom"]}}]);
\ No newline at end of file
diff --git a/Resource-__stories__-Resource-stories.952c25f8.iframe.bundle.js b/Resource-__stories__-Resource-stories.952c25f8.iframe.bundle.js
deleted file mode 100644
index ebc8ab66af0..00000000000
--- a/Resource-__stories__-Resource-stories.952c25f8.iframe.bundle.js
+++ /dev/null
@@ -1 +0,0 @@
-"use strict";(self.webpackChunkdata_hub_frontend=self.webpackChunkdata_hub_frontend||[]).push([[2496],{"./src/client/components/Resource/__stories__/Resource.stories.jsx":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.r(__webpack_exports__),__webpack_require__.d(__webpack_exports__,{CustomProgressAndError:()=>CustomProgressAndError,Default:()=>Default,Inline:()=>Inline,MetadataFormFields:()=>MetadataFormFields,__namedExportsOrder:()=>__namedExportsOrder,default:()=>__WEBPACK_DEFAULT_EXPORT__});__webpack_require__("./node_modules/core-js/modules/es.array.concat.js"),__webpack_require__("./node_modules/core-js/modules/es.array.iterator.js"),__webpack_require__("./node_modules/core-js/modules/es.object.to-string.js"),__webpack_require__("./node_modules/core-js/modules/web.dom-collections.iterator.js");var react__WEBPACK_IMPORTED_MODULE_4__=__webpack_require__("./node_modules/react/index.js"),_Form__WEBPACK_IMPORTED_MODULE_5__=__webpack_require__("./src/client/components/Form/index.jsx"),_TabNav__WEBPACK_IMPORTED_MODULE_6__=__webpack_require__("./src/client/components/TabNav/index.jsx"),_Contact__WEBPACK_IMPORTED_MODULE_7__=__webpack_require__("./src/client/components/Resource/Contact.js"),_Company__WEBPACK_IMPORTED_MODULE_8__=__webpack_require__("./src/client/components/Resource/Company.js"),_Resource__WEBPACK_IMPORTED_MODULE_9__=__webpack_require__("./src/client/components/Resource/Resource.jsx"),_Task_stories_utils__WEBPACK_IMPORTED_MODULE_10__=__webpack_require__("./src/client/components/Task/__stories__/utils.jsx"),_Countries__WEBPACK_IMPORTED_MODULE_11__=__webpack_require__("./src/client/components/Resource/Countries.js"),_BusinessPotential__WEBPACK_IMPORTED_MODULE_12__=__webpack_require__("./src/client/components/Resource/BusinessPotential.js"),Json=function Json(_ref){var children=_ref.children;return react__WEBPACK_IMPORTED_MODULE_4__.createElement("pre",null,JSON.stringify(children,null,2))};const __WEBPACK_DEFAULT_EXPORT__={title:"Resource",component:_Resource__WEBPACK_IMPORTED_MODULE_9__.Ay};var Default=function Default(){return react__WEBPACK_IMPORTED_MODULE_4__.createElement(_TabNav__WEBPACK_IMPORTED_MODULE_6__.A,{id:"resource-example",label:"Resource examples",selectedIndex:"Resource example",tabs:[{label:"Example resolved",content:react__WEBPACK_IMPORTED_MODULE_4__.createElement(_Resource__WEBPACK_IMPORTED_MODULE_9__.Ay,{name:"Resource example",id:"resource-example-resolve",payload:1234},(function(resource){return react__WEBPACK_IMPORTED_MODULE_4__.createElement(Json,null,resource)}))},{label:"Example rejected",content:react__WEBPACK_IMPORTED_MODULE_4__.createElement(_Resource__WEBPACK_IMPORTED_MODULE_9__.Ay,{name:"Resource example",id:"resource-example-reject"},(function(resource){return react__WEBPACK_IMPORTED_MODULE_4__.createElement(Json,null,resource)}))},{label:"Contact",content:react__WEBPACK_IMPORTED_MODULE_4__.createElement(_Contact__WEBPACK_IMPORTED_MODULE_7__.A,{id:"foo"},(function(contact){return react__WEBPACK_IMPORTED_MODULE_4__.createElement(Json,null,contact)}))},{label:"Company",content:react__WEBPACK_IMPORTED_MODULE_4__.createElement(_Company__WEBPACK_IMPORTED_MODULE_8__.A,{id:"bar"},(function(company){return react__WEBPACK_IMPORTED_MODULE_4__.createElement(Json,null,company)}))}]})},CustomProgressAndError=function CustomProgressAndError(){return react__WEBPACK_IMPORTED_MODULE_4__.createElement(_Contact__WEBPACK_IMPORTED_MODULE_7__.A,{id:"foo",taskStatusProps:{renderProgress:function renderProgress(){return"loading..."},renderError:function renderError(_ref2){var retry=_ref2.retry,dismiss=_ref2.dismiss,errorMessage=_ref2.errorMessage,noun=_ref2.noun;return react__WEBPACK_IMPORTED_MODULE_4__.createElement("div",{style:{border:"4px solid green",background:"gold",padding:10}},react__WEBPACK_IMPORTED_MODULE_4__.createElement("div",null,"Couldn't load ",noun," because:"),react__WEBPACK_IMPORTED_MODULE_4__.createElement("pre",null,errorMessage),react__WEBPACK_IMPORTED_MODULE_4__.createElement("button",{onClick:retry},"retry"),react__WEBPACK_IMPORTED_MODULE_4__.createElement("button",{onClick:dismiss},"dismiss"))}}},(function(contact){return react__WEBPACK_IMPORTED_MODULE_4__.createElement(Json,null,contact)}))},ContactName=function ContactName(props){return react__WEBPACK_IMPORTED_MODULE_4__.createElement(_Contact__WEBPACK_IMPORTED_MODULE_7__.A.Inline,props,(function(_ref3){var firstName=_ref3.firstName,lastName=_ref3.lastName;return"".concat(firstName," ").concat(lastName)}))},Inline=function Inline(){return react__WEBPACK_IMPORTED_MODULE_4__.createElement(_Task_stories_utils__WEBPACK_IMPORTED_MODULE_10__.C,{dismissable:react__WEBPACK_IMPORTED_MODULE_4__.createElement(ContactName,{id:"foo"}),noRetry:react__WEBPACK_IMPORTED_MODULE_4__.createElement(ContactName,{id:"foo",dismissable:!1,noRetry:!0})})},MetadataFormFields=function MetadataFormFields(){return react__WEBPACK_IMPORTED_MODULE_4__.createElement(_Form__WEBPACK_IMPORTED_MODULE_5__.A,{id:"my-form"},(function(_ref4){var values=_ref4.values;return react__WEBPACK_IMPORTED_MODULE_4__.createElement(react__WEBPACK_IMPORTED_MODULE_4__.Fragment,null,react__WEBPACK_IMPORTED_MODULE_4__.createElement(_Countries__WEBPACK_IMPORTED_MODULE_11__.A.FieldSelect,{name:"countrySelect",label:"Country"}),react__WEBPACK_IMPORTED_MODULE_4__.createElement(_Countries__WEBPACK_IMPORTED_MODULE_11__.A.FieldTypeahead,{name:"countryTypeahead",label:"Country"}),react__WEBPACK_IMPORTED_MODULE_4__.createElement(_BusinessPotential__WEBPACK_IMPORTED_MODULE_12__.A.FieldRadios,{name:"businessPotentialRadios",label:"Business potential"}),react__WEBPACK_IMPORTED_MODULE_4__.createElement(_BusinessPotential__WEBPACK_IMPORTED_MODULE_12__.A.FieldCheckboxes,{name:"businessPotentialCheckboxes",label:"Business potential"}),react__WEBPACK_IMPORTED_MODULE_4__.createElement(Json,null,values))}))};Default.parameters={...Default.parameters,docs:{...Default.parameters?.docs,source:{originalSource:'() => \n {resource => {resource} }\n \n}, {\n label: \'Example rejected\',\n content: \n {resource => {resource} }\n \n}, {\n label: \'Contact\',\n content: {contact => {contact} } \n}, {\n label: \'Company\',\n content: {company => {company} } \n}]} />',...Default.parameters?.docs?.source}}},CustomProgressAndError.parameters={...CustomProgressAndError.parameters,docs:{...CustomProgressAndError.parameters?.docs,source:{originalSource:"() => 'loading...',\n renderError: ({\n retry,\n dismiss,\n errorMessage,\n noun\n }) => \n
Couldn't load {noun} because:
\n
{errorMessage} \n
retry \n
dismiss \n
\n}}>\n {contact => {contact} }\n ",...CustomProgressAndError.parameters?.docs?.source}}},Inline.parameters={...Inline.parameters,docs:{...Inline.parameters?.docs,source:{originalSource:'() => } noRetry={ } />',...Inline.parameters?.docs?.source}}},MetadataFormFields.parameters={...MetadataFormFields.parameters,docs:{...MetadataFormFields.parameters?.docs,source:{originalSource:'() => ',...MetadataFormFields.parameters?.docs?.source}}};const __namedExportsOrder=["Default","CustomProgressAndError","Inline","MetadataFormFields"]},"./src/client/components/Task/__stories__/utils.jsx":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.d(__webpack_exports__,{C:()=>InlineTemplate});var _TabNav__WEBPACK_IMPORTED_MODULE_0__=__webpack_require__("./src/client/components/TabNav/index.jsx"),_Layout_DefaultLayout__WEBPACK_IMPORTED_MODULE_1__=__webpack_require__("./src/client/components/Layout/DefaultLayout.jsx"),InlineTemplate=function InlineTemplate(_ref){var dismissable=_ref.dismissable,noRetry=_ref.noRetry;return React.createElement(_Layout_DefaultLayout__WEBPACK_IMPORTED_MODULE_1__.A,{heading:React.createElement(React.Fragment,null,"In heading ",dismissable," foo bar baz"),localHeaderdismissable:React.createElement(React.Fragment,null,"In local header ",dismissable," foo bar baz"),breadcrumbs:[{text:"Foo"},{text:noRetry},{text:"Foo"}]},React.createElement(_TabNav__WEBPACK_IMPORTED_MODULE_0__.A,{id:"example",label:"Tab nav",selectedIndex:"bar",tabs:{foo:{label:"Foo",content:"Foo content"},bar:{label:React.createElement(React.Fragment,null,"Inside tab ",noRetry),content:"Bar content"},baz:{label:"Baz",content:"Baz content"}}}),React.createElement("h1",null,"Inside H1 ",dismissable," foo bar baz"),React.createElement("h2",null,"Inside H2 ",dismissable," foo bar baz"),React.createElement("h3",null,"Inside H3 ",dismissable," foo bar baz"),React.createElement("h4",null,"Inside H4 ",dismissable," foo bar baz"),React.createElement("h5",null,"Inside H5 ",dismissable," foo bar baz"),React.createElement("h6",null,"Inside H6 ",dismissable," foo bar baz"),React.createElement("p",null,"Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis ultrices"," ",dismissable," odio at ultricies semper. Sed fermentum tortor quis ante blandit malesuada. Praesent vulputate eget dolor vel luctus. Pellentesque id molestie arcu, a eleifend justo."),React.createElement("ul",null,React.createElement("li",null,"Inside list item ",dismissable," foo bar baz"),React.createElement("li",null,"Inside list item ",dismissable," foo bar baz"),React.createElement("li",null,"Inside list item ",dismissable," foo bar baz")))};InlineTemplate.__docgenInfo={description:"",methods:[],displayName:"InlineTemplate"}}}]);
\ No newline at end of file
diff --git a/Resource-__stories__-Resource-stories.9b3f08e6.iframe.bundle.js b/Resource-__stories__-Resource-stories.9b3f08e6.iframe.bundle.js
new file mode 100644
index 00000000000..5a3670aa99c
--- /dev/null
+++ b/Resource-__stories__-Resource-stories.9b3f08e6.iframe.bundle.js
@@ -0,0 +1 @@
+"use strict";(self.webpackChunkdata_hub_frontend=self.webpackChunkdata_hub_frontend||[]).push([[2496],{"./src/client/components/Resource/__stories__/Resource.stories.jsx":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.r(__webpack_exports__),__webpack_require__.d(__webpack_exports__,{CustomProgressAndError:()=>CustomProgressAndError,Default:()=>Default,Inline:()=>Inline,MetadataFormFields:()=>MetadataFormFields,__namedExportsOrder:()=>__namedExportsOrder,default:()=>__WEBPACK_DEFAULT_EXPORT__});var react__WEBPACK_IMPORTED_MODULE_0__=__webpack_require__("./node_modules/react/index.js"),_Form__WEBPACK_IMPORTED_MODULE_1__=__webpack_require__("./src/client/components/Form/index.jsx"),_TabNav__WEBPACK_IMPORTED_MODULE_2__=__webpack_require__("./src/client/components/TabNav/index.jsx"),_Contact__WEBPACK_IMPORTED_MODULE_3__=__webpack_require__("./src/client/components/Resource/Contact.js"),_Company__WEBPACK_IMPORTED_MODULE_4__=__webpack_require__("./src/client/components/Resource/Company.js"),_Resource__WEBPACK_IMPORTED_MODULE_5__=__webpack_require__("./src/client/components/Resource/Resource.jsx"),_Task_stories_utils__WEBPACK_IMPORTED_MODULE_6__=__webpack_require__("./src/client/components/Task/__stories__/utils.jsx"),_Countries__WEBPACK_IMPORTED_MODULE_7__=__webpack_require__("./src/client/components/Resource/Countries.js"),_BusinessPotential__WEBPACK_IMPORTED_MODULE_8__=__webpack_require__("./src/client/components/Resource/BusinessPotential.js");const Json=({children})=>react__WEBPACK_IMPORTED_MODULE_0__.createElement("pre",null,JSON.stringify(children,null,2)),__WEBPACK_DEFAULT_EXPORT__={title:"Resource",component:_Resource__WEBPACK_IMPORTED_MODULE_5__.Ay},Default=()=>react__WEBPACK_IMPORTED_MODULE_0__.createElement(_TabNav__WEBPACK_IMPORTED_MODULE_2__.A,{id:"resource-example",label:"Resource examples",selectedIndex:"Resource example",tabs:[{label:"Example resolved",content:react__WEBPACK_IMPORTED_MODULE_0__.createElement(_Resource__WEBPACK_IMPORTED_MODULE_5__.Ay,{name:"Resource example",id:"resource-example-resolve",payload:1234},(resource=>react__WEBPACK_IMPORTED_MODULE_0__.createElement(Json,null,resource)))},{label:"Example rejected",content:react__WEBPACK_IMPORTED_MODULE_0__.createElement(_Resource__WEBPACK_IMPORTED_MODULE_5__.Ay,{name:"Resource example",id:"resource-example-reject"},(resource=>react__WEBPACK_IMPORTED_MODULE_0__.createElement(Json,null,resource)))},{label:"Contact",content:react__WEBPACK_IMPORTED_MODULE_0__.createElement(_Contact__WEBPACK_IMPORTED_MODULE_3__.A,{id:"foo"},(contact=>react__WEBPACK_IMPORTED_MODULE_0__.createElement(Json,null,contact)))},{label:"Company",content:react__WEBPACK_IMPORTED_MODULE_0__.createElement(_Company__WEBPACK_IMPORTED_MODULE_4__.A,{id:"bar"},(company=>react__WEBPACK_IMPORTED_MODULE_0__.createElement(Json,null,company)))}]}),CustomProgressAndError=()=>react__WEBPACK_IMPORTED_MODULE_0__.createElement(_Contact__WEBPACK_IMPORTED_MODULE_3__.A,{id:"foo",taskStatusProps:{renderProgress:()=>"loading...",renderError:({retry,dismiss,errorMessage,noun})=>react__WEBPACK_IMPORTED_MODULE_0__.createElement("div",{style:{border:"4px solid green",background:"gold",padding:10}},react__WEBPACK_IMPORTED_MODULE_0__.createElement("div",null,"Couldn't load ",noun," because:"),react__WEBPACK_IMPORTED_MODULE_0__.createElement("pre",null,errorMessage),react__WEBPACK_IMPORTED_MODULE_0__.createElement("button",{onClick:retry},"retry"),react__WEBPACK_IMPORTED_MODULE_0__.createElement("button",{onClick:dismiss},"dismiss"))}},(contact=>react__WEBPACK_IMPORTED_MODULE_0__.createElement(Json,null,contact))),ContactName=props=>react__WEBPACK_IMPORTED_MODULE_0__.createElement(_Contact__WEBPACK_IMPORTED_MODULE_3__.A.Inline,props,(({firstName,lastName})=>`${firstName} ${lastName}`)),Inline=()=>react__WEBPACK_IMPORTED_MODULE_0__.createElement(_Task_stories_utils__WEBPACK_IMPORTED_MODULE_6__.C,{dismissable:react__WEBPACK_IMPORTED_MODULE_0__.createElement(ContactName,{id:"foo"}),noRetry:react__WEBPACK_IMPORTED_MODULE_0__.createElement(ContactName,{id:"foo",dismissable:!1,noRetry:!0})}),MetadataFormFields=()=>react__WEBPACK_IMPORTED_MODULE_0__.createElement(_Form__WEBPACK_IMPORTED_MODULE_1__.A,{id:"my-form"},(({values})=>react__WEBPACK_IMPORTED_MODULE_0__.createElement(react__WEBPACK_IMPORTED_MODULE_0__.Fragment,null,react__WEBPACK_IMPORTED_MODULE_0__.createElement(_Countries__WEBPACK_IMPORTED_MODULE_7__.A.FieldSelect,{name:"countrySelect",label:"Country"}),react__WEBPACK_IMPORTED_MODULE_0__.createElement(_Countries__WEBPACK_IMPORTED_MODULE_7__.A.FieldTypeahead,{name:"countryTypeahead",label:"Country"}),react__WEBPACK_IMPORTED_MODULE_0__.createElement(_BusinessPotential__WEBPACK_IMPORTED_MODULE_8__.A.FieldRadios,{name:"businessPotentialRadios",label:"Business potential"}),react__WEBPACK_IMPORTED_MODULE_0__.createElement(_BusinessPotential__WEBPACK_IMPORTED_MODULE_8__.A.FieldCheckboxes,{name:"businessPotentialCheckboxes",label:"Business potential"}),react__WEBPACK_IMPORTED_MODULE_0__.createElement(Json,null,values))));Default.parameters={...Default.parameters,docs:{...Default.parameters?.docs,source:{originalSource:'() => \n {resource => {resource} }\n \n}, {\n label: \'Example rejected\',\n content: \n {resource => {resource} }\n \n}, {\n label: \'Contact\',\n content: {contact => {contact} } \n}, {\n label: \'Company\',\n content: {company => {company} } \n}]} />',...Default.parameters?.docs?.source}}},CustomProgressAndError.parameters={...CustomProgressAndError.parameters,docs:{...CustomProgressAndError.parameters?.docs,source:{originalSource:"() => 'loading...',\n renderError: ({\n retry,\n dismiss,\n errorMessage,\n noun\n }) => \n
Couldn't load {noun} because:
\n
{errorMessage} \n
retry \n
dismiss \n
\n}}>\n {contact => {contact} }\n ",...CustomProgressAndError.parameters?.docs?.source}}},Inline.parameters={...Inline.parameters,docs:{...Inline.parameters?.docs,source:{originalSource:'() => } noRetry={ } />',...Inline.parameters?.docs?.source}}},MetadataFormFields.parameters={...MetadataFormFields.parameters,docs:{...MetadataFormFields.parameters?.docs,source:{originalSource:'() => ',...MetadataFormFields.parameters?.docs?.source}}};const __namedExportsOrder=["Default","CustomProgressAndError","Inline","MetadataFormFields"]},"./src/client/components/Task/__stories__/utils.jsx":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.d(__webpack_exports__,{C:()=>InlineTemplate});var _TabNav__WEBPACK_IMPORTED_MODULE_0__=__webpack_require__("./src/client/components/TabNav/index.jsx"),_Layout_DefaultLayout__WEBPACK_IMPORTED_MODULE_1__=__webpack_require__("./src/client/components/Layout/DefaultLayout.jsx"),InlineTemplate=function InlineTemplate(_ref){var dismissable=_ref.dismissable,noRetry=_ref.noRetry;return React.createElement(_Layout_DefaultLayout__WEBPACK_IMPORTED_MODULE_1__.A,{heading:React.createElement(React.Fragment,null,"In heading ",dismissable," foo bar baz"),localHeaderdismissable:React.createElement(React.Fragment,null,"In local header ",dismissable," foo bar baz"),breadcrumbs:[{text:"Foo"},{text:noRetry},{text:"Foo"}]},React.createElement(_TabNav__WEBPACK_IMPORTED_MODULE_0__.A,{id:"example",label:"Tab nav",selectedIndex:"bar",tabs:{foo:{label:"Foo",content:"Foo content"},bar:{label:React.createElement(React.Fragment,null,"Inside tab ",noRetry),content:"Bar content"},baz:{label:"Baz",content:"Baz content"}}}),React.createElement("h1",null,"Inside H1 ",dismissable," foo bar baz"),React.createElement("h2",null,"Inside H2 ",dismissable," foo bar baz"),React.createElement("h3",null,"Inside H3 ",dismissable," foo bar baz"),React.createElement("h4",null,"Inside H4 ",dismissable," foo bar baz"),React.createElement("h5",null,"Inside H5 ",dismissable," foo bar baz"),React.createElement("h6",null,"Inside H6 ",dismissable," foo bar baz"),React.createElement("p",null,"Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis ultrices"," ",dismissable," odio at ultricies semper. Sed fermentum tortor quis ante blandit malesuada. Praesent vulputate eget dolor vel luctus. Pellentesque id molestie arcu, a eleifend justo."),React.createElement("ul",null,React.createElement("li",null,"Inside list item ",dismissable," foo bar baz"),React.createElement("li",null,"Inside list item ",dismissable," foo bar baz"),React.createElement("li",null,"Inside list item ",dismissable," foo bar baz")))};InlineTemplate.__docgenInfo={description:"",methods:[],displayName:"InlineTemplate"}}}]);
\ No newline at end of file
diff --git a/RoutedInput-__stories__-RoutedInput-stories.467b5dbf.iframe.bundle.js b/RoutedInput-__stories__-RoutedInput-stories.467b5dbf.iframe.bundle.js
new file mode 100644
index 00000000000..8b0c2424b53
--- /dev/null
+++ b/RoutedInput-__stories__-RoutedInput-stories.467b5dbf.iframe.bundle.js
@@ -0,0 +1 @@
+"use strict";(self.webpackChunkdata_hub_frontend=self.webpackChunkdata_hub_frontend||[]).push([[6846],{"./src/client/components/RoutedInput/__stories__/RoutedInput.stories.jsx":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.r(__webpack_exports__),__webpack_require__.d(__webpack_exports__,{Number:()=>Number,Text:()=>Text,__namedExportsOrder:()=>__namedExportsOrder,default:()=>__WEBPACK_DEFAULT_EXPORT__});var react__WEBPACK_IMPORTED_MODULE_0__=__webpack_require__("./node_modules/react/index.js"),_storybook_utils__WEBPACK_IMPORTED_MODULE_1__=__webpack_require__("./.storybook/utils.jsx"),___WEBPACK_IMPORTED_MODULE_2__=__webpack_require__("./src/client/components/RoutedInput/index.jsx");const __WEBPACK_DEFAULT_EXPORT__={title:"RoutedInput"},Text=()=>react__WEBPACK_IMPORTED_MODULE_0__.createElement("div",null,react__WEBPACK_IMPORTED_MODULE_0__.createElement(___WEBPACK_IMPORTED_MODULE_2__.A,{id:"text",qsParam:"text",placeholder:"text"}),react__WEBPACK_IMPORTED_MODULE_0__.createElement(_storybook_utils__WEBPACK_IMPORTED_MODULE_1__.$,null)),Number=()=>react__WEBPACK_IMPORTED_MODULE_0__.createElement("div",null,react__WEBPACK_IMPORTED_MODULE_0__.createElement(___WEBPACK_IMPORTED_MODULE_2__.A,{id:"number",qsParam:"number",type:"number",placeholder:"number"}),react__WEBPACK_IMPORTED_MODULE_0__.createElement(_storybook_utils__WEBPACK_IMPORTED_MODULE_1__.$,null));Text.parameters={...Text.parameters,docs:{...Text.parameters?.docs,source:{originalSource:'() => \n \n \n
',...Text.parameters?.docs?.source}}},Number.parameters={...Number.parameters,docs:{...Number.parameters?.docs,source:{originalSource:'() => \n \n \n
',...Number.parameters?.docs?.source}}};const __namedExportsOrder=["Text","Number"]},"./.storybook/utils.jsx":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.d(__webpack_exports__,{$:()=>ResetQueryStringButton});__webpack_require__("./node_modules/core-js/modules/es.symbol.js"),__webpack_require__("./node_modules/core-js/modules/es.regexp.exec.js"),__webpack_require__("./node_modules/core-js/modules/es.string.replace.js"),__webpack_require__("./node_modules/core-js/modules/es.string.search.js");var react__WEBPACK_IMPORTED_MODULE_4__=__webpack_require__("./node_modules/react/index.js"),react_router_dom__WEBPACK_IMPORTED_MODULE_5__=__webpack_require__("./node_modules/react-router/dist/index.js"),_excluded=["search"];var ResetQueryStringButton=function ResetQueryStringButton(){return react__WEBPACK_IMPORTED_MODULE_4__.createElement(react_router_dom__WEBPACK_IMPORTED_MODULE_5__.qh,null,(function(_ref){var history=_ref.history,_ref$location=_ref.location,location=(_ref$location.search,function _objectWithoutProperties(e,t){if(null==e)return{};var o,r,i=function _objectWithoutPropertiesLoose(r,e){if(null==r)return{};var t={};for(var n in r)if({}.hasOwnProperty.call(r,n)){if(e.indexOf(n)>=0)continue;t[n]=r[n]}return t}(e,t);if(Object.getOwnPropertySymbols){var n=Object.getOwnPropertySymbols(e);for(r=0;r=0||{}.propertyIsEnumerable.call(e,o)&&(i[o]=e[o])}return i}(_ref$location,_excluded));return react__WEBPACK_IMPORTED_MODULE_4__.createElement("button",{onClick:function onClick(){return history.replace(location)}},"Reset querystring")}))};ResetQueryStringButton.__docgenInfo={description:"",methods:[],displayName:"ResetQueryStringButton"}}}]);
\ No newline at end of file
diff --git a/RoutedInput-__stories__-RoutedInput-stories.e13e1263.iframe.bundle.js b/RoutedInput-__stories__-RoutedInput-stories.e13e1263.iframe.bundle.js
deleted file mode 100644
index ca63737bcde..00000000000
--- a/RoutedInput-__stories__-RoutedInput-stories.e13e1263.iframe.bundle.js
+++ /dev/null
@@ -1 +0,0 @@
-"use strict";(self.webpackChunkdata_hub_frontend=self.webpackChunkdata_hub_frontend||[]).push([[6846],{"./src/client/components/RoutedInput/__stories__/RoutedInput.stories.jsx":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.r(__webpack_exports__),__webpack_require__.d(__webpack_exports__,{Number:()=>Number,Text:()=>Text,__namedExportsOrder:()=>__namedExportsOrder,default:()=>__WEBPACK_DEFAULT_EXPORT__});var react__WEBPACK_IMPORTED_MODULE_0__=__webpack_require__("./node_modules/react/index.js"),_storybook_utils__WEBPACK_IMPORTED_MODULE_1__=__webpack_require__("./.storybook/utils.jsx"),___WEBPACK_IMPORTED_MODULE_2__=__webpack_require__("./src/client/components/RoutedInput/index.jsx");const __WEBPACK_DEFAULT_EXPORT__={title:"RoutedInput"};var Text=function Text(){return react__WEBPACK_IMPORTED_MODULE_0__.createElement("div",null,react__WEBPACK_IMPORTED_MODULE_0__.createElement(___WEBPACK_IMPORTED_MODULE_2__.A,{id:"text",qsParam:"text",placeholder:"text"}),react__WEBPACK_IMPORTED_MODULE_0__.createElement(_storybook_utils__WEBPACK_IMPORTED_MODULE_1__.$,null))},Number=function Number(){return react__WEBPACK_IMPORTED_MODULE_0__.createElement("div",null,react__WEBPACK_IMPORTED_MODULE_0__.createElement(___WEBPACK_IMPORTED_MODULE_2__.A,{id:"number",qsParam:"number",type:"number",placeholder:"number"}),react__WEBPACK_IMPORTED_MODULE_0__.createElement(_storybook_utils__WEBPACK_IMPORTED_MODULE_1__.$,null))};Text.parameters={...Text.parameters,docs:{...Text.parameters?.docs,source:{originalSource:'() => \n \n \n
',...Text.parameters?.docs?.source}}},Number.parameters={...Number.parameters,docs:{...Number.parameters?.docs,source:{originalSource:'() => \n \n \n
',...Number.parameters?.docs?.source}}};const __namedExportsOrder=["Text","Number"]},"./.storybook/utils.jsx":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.d(__webpack_exports__,{$:()=>ResetQueryStringButton});__webpack_require__("./node_modules/core-js/modules/es.symbol.js"),__webpack_require__("./node_modules/core-js/modules/es.regexp.exec.js"),__webpack_require__("./node_modules/core-js/modules/es.string.replace.js"),__webpack_require__("./node_modules/core-js/modules/es.string.search.js");var react__WEBPACK_IMPORTED_MODULE_4__=__webpack_require__("./node_modules/react/index.js"),react_router_dom__WEBPACK_IMPORTED_MODULE_5__=__webpack_require__("./node_modules/react-router/dist/index.js"),_excluded=["search"];var ResetQueryStringButton=function ResetQueryStringButton(){return react__WEBPACK_IMPORTED_MODULE_4__.createElement(react_router_dom__WEBPACK_IMPORTED_MODULE_5__.qh,null,(function(_ref){var history=_ref.history,_ref$location=_ref.location,location=(_ref$location.search,function _objectWithoutProperties(e,t){if(null==e)return{};var o,r,i=function _objectWithoutPropertiesLoose(r,e){if(null==r)return{};var t={};for(var n in r)if({}.hasOwnProperty.call(r,n)){if(e.indexOf(n)>=0)continue;t[n]=r[n]}return t}(e,t);if(Object.getOwnPropertySymbols){var n=Object.getOwnPropertySymbols(e);for(r=0;r=0||{}.propertyIsEnumerable.call(e,o)&&(i[o]=e[o])}return i}(_ref$location,_excluded));return react__WEBPACK_IMPORTED_MODULE_4__.createElement("button",{onClick:function onClick(){return history.replace(location)}},"Reset querystring")}))};ResetQueryStringButton.__docgenInfo={description:"",methods:[],displayName:"ResetQueryStringButton"}}}]);
\ No newline at end of file
diff --git a/RoutedInputField-__stories__-RoutedInputFieldFilter-stories.5e36ce11.iframe.bundle.js b/RoutedInputField-__stories__-RoutedInputFieldFilter-stories.5e36ce11.iframe.bundle.js
new file mode 100644
index 00000000000..ffb8e54f9b4
--- /dev/null
+++ b/RoutedInputField-__stories__-RoutedInputFieldFilter-stories.5e36ce11.iframe.bundle.js
@@ -0,0 +1 @@
+"use strict";(self.webpackChunkdata_hub_frontend=self.webpackChunkdata_hub_frontend||[]).push([[4428],{"./src/client/components/RoutedInputField/__stories__/RoutedInputFieldFilter.stories.jsx":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.r(__webpack_exports__),__webpack_require__.d(__webpack_exports__,{Filter:()=>Filter,__namedExportsOrder:()=>__namedExportsOrder,default:()=>__WEBPACK_DEFAULT_EXPORT__});var react__WEBPACK_IMPORTED_MODULE_0__=__webpack_require__("./node_modules/react/index.js"),_storybook_utils__WEBPACK_IMPORTED_MODULE_1__=__webpack_require__("./.storybook/utils.jsx"),_Filter__WEBPACK_IMPORTED_MODULE_2__=__webpack_require__("./src/client/components/RoutedInputField/Filter.jsx");const __WEBPACK_DEFAULT_EXPORT__={title:"RoutedInputField",parameters:{component:_Filter__WEBPACK_IMPORTED_MODULE_2__.A}},Filter=()=>react__WEBPACK_IMPORTED_MODULE_0__.createElement(react__WEBPACK_IMPORTED_MODULE_0__.Fragment,null,react__WEBPACK_IMPORTED_MODULE_0__.createElement(_Filter__WEBPACK_IMPORTED_MODULE_2__.A,{label:"Example",id:"example",name:"example",qsParam:"example",placeholder:"example"}),react__WEBPACK_IMPORTED_MODULE_0__.createElement(_storybook_utils__WEBPACK_IMPORTED_MODULE_1__.$,null));Filter.parameters={...Filter.parameters,docs:{...Filter.parameters?.docs,source:{originalSource:'() => <>\n \n \n >',...Filter.parameters?.docs?.source}}};const __namedExportsOrder=["Filter"]},"./.storybook/utils.jsx":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.d(__webpack_exports__,{$:()=>ResetQueryStringButton});__webpack_require__("./node_modules/core-js/modules/es.symbol.js"),__webpack_require__("./node_modules/core-js/modules/es.regexp.exec.js"),__webpack_require__("./node_modules/core-js/modules/es.string.replace.js"),__webpack_require__("./node_modules/core-js/modules/es.string.search.js");var react__WEBPACK_IMPORTED_MODULE_4__=__webpack_require__("./node_modules/react/index.js"),react_router_dom__WEBPACK_IMPORTED_MODULE_5__=__webpack_require__("./node_modules/react-router/dist/index.js"),_excluded=["search"];var ResetQueryStringButton=function ResetQueryStringButton(){return react__WEBPACK_IMPORTED_MODULE_4__.createElement(react_router_dom__WEBPACK_IMPORTED_MODULE_5__.qh,null,(function(_ref){var history=_ref.history,_ref$location=_ref.location,location=(_ref$location.search,function _objectWithoutProperties(e,t){if(null==e)return{};var o,r,i=function _objectWithoutPropertiesLoose(r,e){if(null==r)return{};var t={};for(var n in r)if({}.hasOwnProperty.call(r,n)){if(e.indexOf(n)>=0)continue;t[n]=r[n]}return t}(e,t);if(Object.getOwnPropertySymbols){var n=Object.getOwnPropertySymbols(e);for(r=0;r=0||{}.propertyIsEnumerable.call(e,o)&&(i[o]=e[o])}return i}(_ref$location,_excluded));return react__WEBPACK_IMPORTED_MODULE_4__.createElement("button",{onClick:function onClick(){return history.replace(location)}},"Reset querystring")}))};ResetQueryStringButton.__docgenInfo={description:"",methods:[],displayName:"ResetQueryStringButton"}}}]);
\ No newline at end of file
diff --git a/RoutedInputField-__stories__-RoutedInputFieldFilter-stories.f957792f.iframe.bundle.js b/RoutedInputField-__stories__-RoutedInputFieldFilter-stories.f957792f.iframe.bundle.js
deleted file mode 100644
index 188ddcf728d..00000000000
--- a/RoutedInputField-__stories__-RoutedInputFieldFilter-stories.f957792f.iframe.bundle.js
+++ /dev/null
@@ -1 +0,0 @@
-"use strict";(self.webpackChunkdata_hub_frontend=self.webpackChunkdata_hub_frontend||[]).push([[4428],{"./src/client/components/RoutedInputField/__stories__/RoutedInputFieldFilter.stories.jsx":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.r(__webpack_exports__),__webpack_require__.d(__webpack_exports__,{Filter:()=>Filter,__namedExportsOrder:()=>__namedExportsOrder,default:()=>__WEBPACK_DEFAULT_EXPORT__});var react__WEBPACK_IMPORTED_MODULE_0__=__webpack_require__("./node_modules/react/index.js"),_storybook_utils__WEBPACK_IMPORTED_MODULE_1__=__webpack_require__("./.storybook/utils.jsx"),_Filter__WEBPACK_IMPORTED_MODULE_2__=__webpack_require__("./src/client/components/RoutedInputField/Filter.jsx");const __WEBPACK_DEFAULT_EXPORT__={title:"RoutedInputField",parameters:{component:_Filter__WEBPACK_IMPORTED_MODULE_2__.A}};var Filter=function Filter(){return react__WEBPACK_IMPORTED_MODULE_0__.createElement(react__WEBPACK_IMPORTED_MODULE_0__.Fragment,null,react__WEBPACK_IMPORTED_MODULE_0__.createElement(_Filter__WEBPACK_IMPORTED_MODULE_2__.A,{label:"Example",id:"example",name:"example",qsParam:"example",placeholder:"example"}),react__WEBPACK_IMPORTED_MODULE_0__.createElement(_storybook_utils__WEBPACK_IMPORTED_MODULE_1__.$,null))};Filter.parameters={...Filter.parameters,docs:{...Filter.parameters?.docs,source:{originalSource:'() => <>\n \n \n >',...Filter.parameters?.docs?.source}}};const __namedExportsOrder=["Filter"]},"./.storybook/utils.jsx":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.d(__webpack_exports__,{$:()=>ResetQueryStringButton});__webpack_require__("./node_modules/core-js/modules/es.symbol.js"),__webpack_require__("./node_modules/core-js/modules/es.regexp.exec.js"),__webpack_require__("./node_modules/core-js/modules/es.string.replace.js"),__webpack_require__("./node_modules/core-js/modules/es.string.search.js");var react__WEBPACK_IMPORTED_MODULE_4__=__webpack_require__("./node_modules/react/index.js"),react_router_dom__WEBPACK_IMPORTED_MODULE_5__=__webpack_require__("./node_modules/react-router/dist/index.js"),_excluded=["search"];var ResetQueryStringButton=function ResetQueryStringButton(){return react__WEBPACK_IMPORTED_MODULE_4__.createElement(react_router_dom__WEBPACK_IMPORTED_MODULE_5__.qh,null,(function(_ref){var history=_ref.history,_ref$location=_ref.location,location=(_ref$location.search,function _objectWithoutProperties(e,t){if(null==e)return{};var o,r,i=function _objectWithoutPropertiesLoose(r,e){if(null==r)return{};var t={};for(var n in r)if({}.hasOwnProperty.call(r,n)){if(e.indexOf(n)>=0)continue;t[n]=r[n]}return t}(e,t);if(Object.getOwnPropertySymbols){var n=Object.getOwnPropertySymbols(e);for(r=0;r=0||{}.propertyIsEnumerable.call(e,o)&&(i[o]=e[o])}return i}(_ref$location,_excluded));return react__WEBPACK_IMPORTED_MODULE_4__.createElement("button",{onClick:function onClick(){return history.replace(location)}},"Reset querystring")}))};ResetQueryStringButton.__docgenInfo={description:"",methods:[],displayName:"ResetQueryStringButton"}}}]);
\ No newline at end of file
diff --git a/RoutedNumericRangeField-__stories__-RoutedNumericRangeFieldFilter-stories.25e3ce35.iframe.bundle.js b/RoutedNumericRangeField-__stories__-RoutedNumericRangeFieldFilter-stories.25e3ce35.iframe.bundle.js
new file mode 100644
index 00000000000..34e44cf5c50
--- /dev/null
+++ b/RoutedNumericRangeField-__stories__-RoutedNumericRangeFieldFilter-stories.25e3ce35.iframe.bundle.js
@@ -0,0 +1 @@
+"use strict";(self.webpackChunkdata_hub_frontend=self.webpackChunkdata_hub_frontend||[]).push([[1796],{"./src/client/components/RoutedNumericRangeField/__stories__/RoutedNumericRangeFieldFilter.stories.jsx":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.r(__webpack_exports__),__webpack_require__.d(__webpack_exports__,{Filter:()=>Filter,__namedExportsOrder:()=>__namedExportsOrder,default:()=>__WEBPACK_DEFAULT_EXPORT__});var react__WEBPACK_IMPORTED_MODULE_0__=__webpack_require__("./node_modules/react/index.js"),_storybook_utils__WEBPACK_IMPORTED_MODULE_1__=__webpack_require__("./.storybook/utils.jsx"),_Filter__WEBPACK_IMPORTED_MODULE_2__=__webpack_require__("./src/client/components/RoutedNumericRangeField/Filter.jsx");const __WEBPACK_DEFAULT_EXPORT__={title:"RoutedNumericRangeField",parameters:{component:_Filter__WEBPACK_IMPORTED_MODULE_2__.A}},Filter=()=>react__WEBPACK_IMPORTED_MODULE_0__.createElement("div",null,react__WEBPACK_IMPORTED_MODULE_0__.createElement(_Filter__WEBPACK_IMPORTED_MODULE_2__.A,{label:"Label",id:"example",name:"example",qsParam:"example",placeholder:"example"}),react__WEBPACK_IMPORTED_MODULE_0__.createElement(_storybook_utils__WEBPACK_IMPORTED_MODULE_1__.$,null));Filter.parameters={...Filter.parameters,docs:{...Filter.parameters?.docs,source:{originalSource:'() => \n \n \n
',...Filter.parameters?.docs?.source}}};const __namedExportsOrder=["Filter"]},"./.storybook/utils.jsx":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.d(__webpack_exports__,{$:()=>ResetQueryStringButton});__webpack_require__("./node_modules/core-js/modules/es.symbol.js"),__webpack_require__("./node_modules/core-js/modules/es.regexp.exec.js"),__webpack_require__("./node_modules/core-js/modules/es.string.replace.js"),__webpack_require__("./node_modules/core-js/modules/es.string.search.js");var react__WEBPACK_IMPORTED_MODULE_4__=__webpack_require__("./node_modules/react/index.js"),react_router_dom__WEBPACK_IMPORTED_MODULE_5__=__webpack_require__("./node_modules/react-router/dist/index.js"),_excluded=["search"];var ResetQueryStringButton=function ResetQueryStringButton(){return react__WEBPACK_IMPORTED_MODULE_4__.createElement(react_router_dom__WEBPACK_IMPORTED_MODULE_5__.qh,null,(function(_ref){var history=_ref.history,_ref$location=_ref.location,location=(_ref$location.search,function _objectWithoutProperties(e,t){if(null==e)return{};var o,r,i=function _objectWithoutPropertiesLoose(r,e){if(null==r)return{};var t={};for(var n in r)if({}.hasOwnProperty.call(r,n)){if(e.indexOf(n)>=0)continue;t[n]=r[n]}return t}(e,t);if(Object.getOwnPropertySymbols){var n=Object.getOwnPropertySymbols(e);for(r=0;r=0||{}.propertyIsEnumerable.call(e,o)&&(i[o]=e[o])}return i}(_ref$location,_excluded));return react__WEBPACK_IMPORTED_MODULE_4__.createElement("button",{onClick:function onClick(){return history.replace(location)}},"Reset querystring")}))};ResetQueryStringButton.__docgenInfo={description:"",methods:[],displayName:"ResetQueryStringButton"}}}]);
\ No newline at end of file
diff --git a/RoutedNumericRangeField-__stories__-RoutedNumericRangeFieldFilter-stories.96c6dea1.iframe.bundle.js b/RoutedNumericRangeField-__stories__-RoutedNumericRangeFieldFilter-stories.96c6dea1.iframe.bundle.js
deleted file mode 100644
index 75ea37b5e28..00000000000
--- a/RoutedNumericRangeField-__stories__-RoutedNumericRangeFieldFilter-stories.96c6dea1.iframe.bundle.js
+++ /dev/null
@@ -1 +0,0 @@
-"use strict";(self.webpackChunkdata_hub_frontend=self.webpackChunkdata_hub_frontend||[]).push([[1796],{"./src/client/components/RoutedNumericRangeField/__stories__/RoutedNumericRangeFieldFilter.stories.jsx":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.r(__webpack_exports__),__webpack_require__.d(__webpack_exports__,{Filter:()=>Filter,__namedExportsOrder:()=>__namedExportsOrder,default:()=>__WEBPACK_DEFAULT_EXPORT__});var react__WEBPACK_IMPORTED_MODULE_0__=__webpack_require__("./node_modules/react/index.js"),_storybook_utils__WEBPACK_IMPORTED_MODULE_1__=__webpack_require__("./.storybook/utils.jsx"),_Filter__WEBPACK_IMPORTED_MODULE_2__=__webpack_require__("./src/client/components/RoutedNumericRangeField/Filter.jsx");const __WEBPACK_DEFAULT_EXPORT__={title:"RoutedNumericRangeField",parameters:{component:_Filter__WEBPACK_IMPORTED_MODULE_2__.A}};var Filter=function Filter(){return react__WEBPACK_IMPORTED_MODULE_0__.createElement("div",null,react__WEBPACK_IMPORTED_MODULE_0__.createElement(_Filter__WEBPACK_IMPORTED_MODULE_2__.A,{label:"Label",id:"example",name:"example",qsParam:"example",placeholder:"example"}),react__WEBPACK_IMPORTED_MODULE_0__.createElement(_storybook_utils__WEBPACK_IMPORTED_MODULE_1__.$,null))};Filter.parameters={...Filter.parameters,docs:{...Filter.parameters?.docs,source:{originalSource:'() => \n \n \n
',...Filter.parameters?.docs?.source}}};const __namedExportsOrder=["Filter"]},"./.storybook/utils.jsx":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.d(__webpack_exports__,{$:()=>ResetQueryStringButton});__webpack_require__("./node_modules/core-js/modules/es.symbol.js"),__webpack_require__("./node_modules/core-js/modules/es.regexp.exec.js"),__webpack_require__("./node_modules/core-js/modules/es.string.replace.js"),__webpack_require__("./node_modules/core-js/modules/es.string.search.js");var react__WEBPACK_IMPORTED_MODULE_4__=__webpack_require__("./node_modules/react/index.js"),react_router_dom__WEBPACK_IMPORTED_MODULE_5__=__webpack_require__("./node_modules/react-router/dist/index.js"),_excluded=["search"];var ResetQueryStringButton=function ResetQueryStringButton(){return react__WEBPACK_IMPORTED_MODULE_4__.createElement(react_router_dom__WEBPACK_IMPORTED_MODULE_5__.qh,null,(function(_ref){var history=_ref.history,_ref$location=_ref.location,location=(_ref$location.search,function _objectWithoutProperties(e,t){if(null==e)return{};var o,r,i=function _objectWithoutPropertiesLoose(r,e){if(null==r)return{};var t={};for(var n in r)if({}.hasOwnProperty.call(r,n)){if(e.indexOf(n)>=0)continue;t[n]=r[n]}return t}(e,t);if(Object.getOwnPropertySymbols){var n=Object.getOwnPropertySymbols(e);for(r=0;r=0||{}.propertyIsEnumerable.call(e,o)&&(i[o]=e[o])}return i}(_ref$location,_excluded));return react__WEBPACK_IMPORTED_MODULE_4__.createElement("button",{onClick:function onClick(){return history.replace(location)}},"Reset querystring")}))};ResetQueryStringButton.__docgenInfo={description:"",methods:[],displayName:"ResetQueryStringButton"}}}]);
\ No newline at end of file
diff --git a/StatusMessage-__stories__-DismissableStatusMessage-stories.ac9cbfeb.iframe.bundle.js b/StatusMessage-__stories__-DismissableStatusMessage-stories.afadb583.iframe.bundle.js
similarity index 86%
rename from StatusMessage-__stories__-DismissableStatusMessage-stories.ac9cbfeb.iframe.bundle.js
rename to StatusMessage-__stories__-DismissableStatusMessage-stories.afadb583.iframe.bundle.js
index db8cbf666e2..6bb3a04f530 100644
--- a/StatusMessage-__stories__-DismissableStatusMessage-stories.ac9cbfeb.iframe.bundle.js
+++ b/StatusMessage-__stories__-DismissableStatusMessage-stories.afadb583.iframe.bundle.js
@@ -1 +1 @@
-"use strict";(self.webpackChunkdata_hub_frontend=self.webpackChunkdata_hub_frontend||[]).push([[1468],{"./src/client/components/StatusMessage/__stories__/DismissableStatusMessage.stories.jsx":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.r(__webpack_exports__),__webpack_require__.d(__webpack_exports__,{CustomColour:()=>CustomColour,Default:()=>Default,__namedExportsOrder:()=>__namedExportsOrder,default:()=>DismissableStatusMessage_stories});var react=__webpack_require__("./node_modules/react/index.js"),colours=__webpack_require__("./src/client/utils/colours.js"),prop_types=(__webpack_require__("./node_modules/core-js/modules/es.symbol.js"),__webpack_require__("./node_modules/core-js/modules/es.object.assign.js"),__webpack_require__("./node_modules/prop-types/index.js")),prop_types_default=__webpack_require__.n(prop_types),styled_components_browser_esm=__webpack_require__("./node_modules/styled-components/dist/styled-components.browser.esm.js"),StatusMessage=__webpack_require__("./src/client/components/StatusMessage/index.jsx"),styles=(__webpack_require__("./node_modules/core-js/modules/es.symbol.description.js"),__webpack_require__("./node_modules/core-js/modules/es.symbol.iterator.js"),__webpack_require__("./node_modules/core-js/modules/es.symbol.to-primitive.js"),__webpack_require__("./node_modules/core-js/modules/es.array.filter.js"),__webpack_require__("./node_modules/core-js/modules/es.array.iterator.js"),__webpack_require__("./node_modules/core-js/modules/es.date.to-primitive.js"),__webpack_require__("./node_modules/core-js/modules/es.number.constructor.js"),__webpack_require__("./node_modules/core-js/modules/es.object.get-own-property-descriptor.js"),__webpack_require__("./node_modules/core-js/modules/es.object.get-own-property-descriptors.js"),__webpack_require__("./node_modules/core-js/modules/es.object.keys.js"),__webpack_require__("./node_modules/core-js/modules/es.object.to-string.js"),__webpack_require__("./node_modules/core-js/modules/es.string.iterator.js"),__webpack_require__("./node_modules/core-js/modules/web.dom-collections.for-each.js"),__webpack_require__("./node_modules/core-js/modules/web.dom-collections.iterator.js"),__webpack_require__("./src/client/styles.js"));function _typeof(o){return _typeof="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(o){return typeof o}:function(o){return o&&"function"==typeof Symbol&&o.constructor===Symbol&&o!==Symbol.prototype?"symbol":typeof o},_typeof(o)}function ownKeys(e,r){var t=Object.keys(e);if(Object.getOwnPropertySymbols){var o=Object.getOwnPropertySymbols(e);r&&(o=o.filter((function(r){return Object.getOwnPropertyDescriptor(e,r).enumerable}))),t.push.apply(t,o)}return t}function _defineProperty(e,r,t){return(r=function _toPropertyKey(t){var i=function _toPrimitive(t,r){if("object"!=_typeof(t)||!t)return t;var e=t[Symbol.toPrimitive];if(void 0!==e){var i=e.call(t,r||"default");if("object"!=_typeof(i))return i;throw new TypeError("@@toPrimitive must return a primitive value.")}return("string"===r?String:Number)(t)}(t,"string");return"symbol"==_typeof(i)?i:i+""}(r))in e?Object.defineProperty(e,r,{value:t,enumerable:!0,configurable:!0,writable:!0}):e[r]=t,e}const TextLikeButton=styled_components_browser_esm.Ay.button(function _objectSpread(e){for(var r=1;r=0)continue;t[n]=r[n]}return t}(e,t);if(Object.getOwnPropertySymbols){var n=Object.getOwnPropertySymbols(e);for(r=0;r=0||{}.propertyIsEnumerable.call(e,o)&&(i[o]=e[o])}return i}(_ref,_excluded);return react.createElement(StyledStatusMessage,_extends({},props,{ref}),children,react.createElement(TextLikeButton,{tabIndex:0,onClick:onDismiss,"aria-label":"dismiss"},"✕"))}));DismissableStatusMessage.propTypes={onDismiss:prop_types_default().func};const Dismissable=DismissableStatusMessage;DismissableStatusMessage.__docgenInfo={description:"",methods:[],displayName:"DismissableStatusMessage",props:{onDismiss:{description:"",type:{name:"func"},required:!1}}};const DismissableStatusMessage_stories={title:"DismissableStatusMessage",parameters:{component:Dismissable}};var Default=function Default(){return react.createElement(Dismissable,null,"An info message")},CustomColour=function CustomColour(){return react.createElement(Dismissable,{colour:colours.su},"An error message")};CustomColour.story={name:"Custom colour"},Default.parameters={...Default.parameters,docs:{...Default.parameters?.docs,source:{originalSource:"() => {\n return An info message ;\n}",...Default.parameters?.docs?.source}}},CustomColour.parameters={...CustomColour.parameters,docs:{...CustomColour.parameters?.docs,source:{originalSource:"() => {\n return \n An error message\n ;\n}",...CustomColour.parameters?.docs?.source}}};const __namedExportsOrder=["Default","CustomColour"]}}]);
\ No newline at end of file
+"use strict";(self.webpackChunkdata_hub_frontend=self.webpackChunkdata_hub_frontend||[]).push([[1468],{"./src/client/components/StatusMessage/__stories__/DismissableStatusMessage.stories.jsx":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.r(__webpack_exports__),__webpack_require__.d(__webpack_exports__,{CustomColour:()=>CustomColour,Default:()=>Default,__namedExportsOrder:()=>__namedExportsOrder,default:()=>DismissableStatusMessage_stories});var react=__webpack_require__("./node_modules/react/index.js"),colours=__webpack_require__("./src/client/utils/colours.js"),prop_types=(__webpack_require__("./node_modules/core-js/modules/es.symbol.js"),__webpack_require__("./node_modules/core-js/modules/es.object.assign.js"),__webpack_require__("./node_modules/prop-types/index.js")),prop_types_default=__webpack_require__.n(prop_types),styled_components_browser_esm=__webpack_require__("./node_modules/styled-components/dist/styled-components.browser.esm.js"),StatusMessage=__webpack_require__("./src/client/components/StatusMessage/index.jsx"),styles=(__webpack_require__("./node_modules/core-js/modules/es.symbol.description.js"),__webpack_require__("./node_modules/core-js/modules/es.symbol.iterator.js"),__webpack_require__("./node_modules/core-js/modules/es.symbol.to-primitive.js"),__webpack_require__("./node_modules/core-js/modules/es.array.filter.js"),__webpack_require__("./node_modules/core-js/modules/es.array.iterator.js"),__webpack_require__("./node_modules/core-js/modules/es.date.to-primitive.js"),__webpack_require__("./node_modules/core-js/modules/es.number.constructor.js"),__webpack_require__("./node_modules/core-js/modules/es.object.get-own-property-descriptor.js"),__webpack_require__("./node_modules/core-js/modules/es.object.get-own-property-descriptors.js"),__webpack_require__("./node_modules/core-js/modules/es.object.keys.js"),__webpack_require__("./node_modules/core-js/modules/es.object.to-string.js"),__webpack_require__("./node_modules/core-js/modules/es.string.iterator.js"),__webpack_require__("./node_modules/core-js/modules/web.dom-collections.for-each.js"),__webpack_require__("./node_modules/core-js/modules/web.dom-collections.iterator.js"),__webpack_require__("./src/client/styles.js"));function _typeof(o){return _typeof="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(o){return typeof o}:function(o){return o&&"function"==typeof Symbol&&o.constructor===Symbol&&o!==Symbol.prototype?"symbol":typeof o},_typeof(o)}function ownKeys(e,r){var t=Object.keys(e);if(Object.getOwnPropertySymbols){var o=Object.getOwnPropertySymbols(e);r&&(o=o.filter((function(r){return Object.getOwnPropertyDescriptor(e,r).enumerable}))),t.push.apply(t,o)}return t}function _defineProperty(e,r,t){return(r=function _toPropertyKey(t){var i=function _toPrimitive(t,r){if("object"!=_typeof(t)||!t)return t;var e=t[Symbol.toPrimitive];if(void 0!==e){var i=e.call(t,r||"default");if("object"!=_typeof(i))return i;throw new TypeError("@@toPrimitive must return a primitive value.")}return("string"===r?String:Number)(t)}(t,"string");return"symbol"==_typeof(i)?i:i+""}(r))in e?Object.defineProperty(e,r,{value:t,enumerable:!0,configurable:!0,writable:!0}):e[r]=t,e}const TextLikeButton=styled_components_browser_esm.Ay.button(function _objectSpread(e){for(var r=1;r=0)continue;t[n]=r[n]}return t}(e,t);if(Object.getOwnPropertySymbols){var n=Object.getOwnPropertySymbols(e);for(r=0;r=0||{}.propertyIsEnumerable.call(e,o)&&(i[o]=e[o])}return i}(_ref,_excluded);return react.createElement(StyledStatusMessage,_extends({},props,{ref}),children,react.createElement(TextLikeButton,{tabIndex:0,onClick:onDismiss,"aria-label":"dismiss"},"✕"))}));DismissableStatusMessage.propTypes={onDismiss:prop_types_default().func};const Dismissable=DismissableStatusMessage;DismissableStatusMessage.__docgenInfo={description:"",methods:[],displayName:"DismissableStatusMessage",props:{onDismiss:{description:"",type:{name:"func"},required:!1}}};const DismissableStatusMessage_stories={title:"DismissableStatusMessage",parameters:{component:Dismissable}},Default=()=>react.createElement(Dismissable,null,"An info message"),CustomColour=()=>react.createElement(Dismissable,{colour:colours.su},"An error message");CustomColour.story={name:"Custom colour"},Default.parameters={...Default.parameters,docs:{...Default.parameters?.docs,source:{originalSource:"() => {\n return An info message ;\n}",...Default.parameters?.docs?.source}}},CustomColour.parameters={...CustomColour.parameters,docs:{...CustomColour.parameters?.docs,source:{originalSource:"() => {\n return \n An error message\n ;\n}",...CustomColour.parameters?.docs?.source}}};const __namedExportsOrder=["Default","CustomColour"]}}]);
\ No newline at end of file
diff --git a/StatusMessage-__stories__-StatusMessage-stories.1e86551d.iframe.bundle.js b/StatusMessage-__stories__-StatusMessage-stories.1e86551d.iframe.bundle.js
deleted file mode 100644
index bb3bba015c6..00000000000
--- a/StatusMessage-__stories__-StatusMessage-stories.1e86551d.iframe.bundle.js
+++ /dev/null
@@ -1 +0,0 @@
-"use strict";(self.webpackChunkdata_hub_frontend=self.webpackChunkdata_hub_frontend||[]).push([[3318],{"./src/client/components/StatusMessage/__stories__/StatusMessage.stories.jsx":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.r(__webpack_exports__),__webpack_require__.d(__webpack_exports__,{CustomColour:()=>CustomColour,Default:()=>Default,__namedExportsOrder:()=>__namedExportsOrder,default:()=>__WEBPACK_DEFAULT_EXPORT__});var react__WEBPACK_IMPORTED_MODULE_0__=__webpack_require__("./node_modules/react/index.js"),StatusMessage__WEBPACK_IMPORTED_MODULE_1__=__webpack_require__("./src/client/components/StatusMessage/index.jsx"),_client_utils_colours__WEBPACK_IMPORTED_MODULE_2__=__webpack_require__("./src/client/utils/colours.js");const __WEBPACK_DEFAULT_EXPORT__={title:"StatusMessage"};var Default=function Default(){return react__WEBPACK_IMPORTED_MODULE_0__.createElement(StatusMessage__WEBPACK_IMPORTED_MODULE_1__.A,null,"An info message")},CustomColour=function CustomColour(){return react__WEBPACK_IMPORTED_MODULE_0__.createElement(StatusMessage__WEBPACK_IMPORTED_MODULE_1__.A,{colour:_client_utils_colours__WEBPACK_IMPORTED_MODULE_2__.su},"An error message")};CustomColour.story={name:"Custom colour"},Default.parameters={...Default.parameters,docs:{...Default.parameters?.docs,source:{originalSource:"() => {\n return An info message ;\n}",...Default.parameters?.docs?.source}}},CustomColour.parameters={...CustomColour.parameters,docs:{...CustomColour.parameters?.docs,source:{originalSource:"() => {\n return An error message ;\n}",...CustomColour.parameters?.docs?.source}}};const __namedExportsOrder=["Default","CustomColour"]}}]);
\ No newline at end of file
diff --git a/StatusMessage-__stories__-StatusMessage-stories.99c0e40a.iframe.bundle.js b/StatusMessage-__stories__-StatusMessage-stories.99c0e40a.iframe.bundle.js
new file mode 100644
index 00000000000..870fa9407d8
--- /dev/null
+++ b/StatusMessage-__stories__-StatusMessage-stories.99c0e40a.iframe.bundle.js
@@ -0,0 +1 @@
+"use strict";(self.webpackChunkdata_hub_frontend=self.webpackChunkdata_hub_frontend||[]).push([[3318],{"./src/client/components/StatusMessage/__stories__/StatusMessage.stories.jsx":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.r(__webpack_exports__),__webpack_require__.d(__webpack_exports__,{CustomColour:()=>CustomColour,Default:()=>Default,__namedExportsOrder:()=>__namedExportsOrder,default:()=>__WEBPACK_DEFAULT_EXPORT__});var react__WEBPACK_IMPORTED_MODULE_0__=__webpack_require__("./node_modules/react/index.js"),StatusMessage__WEBPACK_IMPORTED_MODULE_1__=__webpack_require__("./src/client/components/StatusMessage/index.jsx"),_client_utils_colours__WEBPACK_IMPORTED_MODULE_2__=__webpack_require__("./src/client/utils/colours.js");const __WEBPACK_DEFAULT_EXPORT__={title:"StatusMessage"},Default=()=>react__WEBPACK_IMPORTED_MODULE_0__.createElement(StatusMessage__WEBPACK_IMPORTED_MODULE_1__.A,null,"An info message"),CustomColour=()=>react__WEBPACK_IMPORTED_MODULE_0__.createElement(StatusMessage__WEBPACK_IMPORTED_MODULE_1__.A,{colour:_client_utils_colours__WEBPACK_IMPORTED_MODULE_2__.su},"An error message");CustomColour.story={name:"Custom colour"},Default.parameters={...Default.parameters,docs:{...Default.parameters?.docs,source:{originalSource:"() => {\n return An info message ;\n}",...Default.parameters?.docs?.source}}},CustomColour.parameters={...CustomColour.parameters,docs:{...CustomColour.parameters?.docs,source:{originalSource:"() => {\n return An error message ;\n}",...CustomColour.parameters?.docs?.source}}};const __namedExportsOrder=["Default","CustomColour"]}}]);
\ No newline at end of file
diff --git a/SummaryList-__stories__-SummaryList-stories.685f0339.iframe.bundle.js b/SummaryList-__stories__-SummaryList-stories.685f0339.iframe.bundle.js
new file mode 100644
index 00000000000..505f9c1a3c2
--- /dev/null
+++ b/SummaryList-__stories__-SummaryList-stories.685f0339.iframe.bundle.js
@@ -0,0 +1 @@
+"use strict";(self.webpackChunkdata_hub_frontend=self.webpackChunkdata_hub_frontend||[]).push([[1586],{"./src/client/components/SummaryList/__stories__/SummaryList.stories.jsx":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.r(__webpack_exports__),__webpack_require__.d(__webpack_exports__,{Default:()=>Default,__namedExportsOrder:()=>__namedExportsOrder,default:()=>__WEBPACK_DEFAULT_EXPORT__});var react__WEBPACK_IMPORTED_MODULE_0__=__webpack_require__("./node_modules/react/index.js"),SummaryList__WEBPACK_IMPORTED_MODULE_1__=__webpack_require__("./src/client/components/SummaryList/index.jsx");const rows=[{label:"Registered company name",value:"Example Ltd"},{label:"Trading name(s)",value:"Examples & Tests"},{label:"Located at",value:"99 Loooooooooooooooooooooooooong name Street, London, SE1 456, United Kingdom"},{label:"Registered address",value:"123 Fake Road, London, SE1 123, United Kingdom"}],__WEBPACK_DEFAULT_EXPORT__={title:"SummaryList",parameters:{component:SummaryList__WEBPACK_IMPORTED_MODULE_1__.A}},Default=()=>react__WEBPACK_IMPORTED_MODULE_0__.createElement(SummaryList__WEBPACK_IMPORTED_MODULE_1__.A,{rows});Default.parameters={...Default.parameters,docs:{...Default.parameters?.docs,source:{originalSource:"() => ",...Default.parameters?.docs?.source}}};const __namedExportsOrder=["Default"]}}]);
\ No newline at end of file
diff --git a/SummaryList-__stories__-SummaryList-stories.ff72fcb0.iframe.bundle.js b/SummaryList-__stories__-SummaryList-stories.ff72fcb0.iframe.bundle.js
deleted file mode 100644
index 33c4118c82e..00000000000
--- a/SummaryList-__stories__-SummaryList-stories.ff72fcb0.iframe.bundle.js
+++ /dev/null
@@ -1 +0,0 @@
-"use strict";(self.webpackChunkdata_hub_frontend=self.webpackChunkdata_hub_frontend||[]).push([[1586],{"./src/client/components/SummaryList/__stories__/SummaryList.stories.jsx":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.r(__webpack_exports__),__webpack_require__.d(__webpack_exports__,{Default:()=>Default,__namedExportsOrder:()=>__namedExportsOrder,default:()=>__WEBPACK_DEFAULT_EXPORT__});var react__WEBPACK_IMPORTED_MODULE_0__=__webpack_require__("./node_modules/react/index.js"),SummaryList__WEBPACK_IMPORTED_MODULE_1__=__webpack_require__("./src/client/components/SummaryList/index.jsx"),rows=[{label:"Registered company name",value:"Example Ltd"},{label:"Trading name(s)",value:"Examples & Tests"},{label:"Located at",value:"99 Loooooooooooooooooooooooooong name Street, London, SE1 456, United Kingdom"},{label:"Registered address",value:"123 Fake Road, London, SE1 123, United Kingdom"}];const __WEBPACK_DEFAULT_EXPORT__={title:"SummaryList",parameters:{component:SummaryList__WEBPACK_IMPORTED_MODULE_1__.A}};var Default=function Default(){return react__WEBPACK_IMPORTED_MODULE_0__.createElement(SummaryList__WEBPACK_IMPORTED_MODULE_1__.A,{rows})};Default.parameters={...Default.parameters,docs:{...Default.parameters?.docs,source:{originalSource:"() => ",...Default.parameters?.docs?.source}}};const __namedExportsOrder=["Default"]}}]);
\ No newline at end of file
diff --git a/SummaryTable-__stories__-SummaryTable-stories.297099b4.iframe.bundle.js b/SummaryTable-__stories__-SummaryTable-stories.297099b4.iframe.bundle.js
new file mode 100644
index 00000000000..23b2daf7d5a
--- /dev/null
+++ b/SummaryTable-__stories__-SummaryTable-stories.297099b4.iframe.bundle.js
@@ -0,0 +1 @@
+"use strict";(self.webpackChunkdata_hub_frontend=self.webpackChunkdata_hub_frontend||[]).push([[1288],{"./src/client/components/SummaryTable/__stories__/SummaryTable.stories.jsx":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.r(__webpack_exports__),__webpack_require__.d(__webpack_exports__,{Default:()=>Default,__namedExportsOrder:()=>__namedExportsOrder,default:()=>__WEBPACK_DEFAULT_EXPORT__});var react__WEBPACK_IMPORTED_MODULE_0__=__webpack_require__("./node_modules/react/index.js"),_govuk_react_link__WEBPACK_IMPORTED_MODULE_1__=__webpack_require__("./node_modules/@govuk-react/link/dist/govuk-react-link.esm.js"),SummaryTable__WEBPACK_IMPORTED_MODULE_2__=__webpack_require__("./src/client/components/SummaryTable/index.jsx");const __WEBPACK_DEFAULT_EXPORT__={title:"SummaryTable",parameters:{component:SummaryTable__WEBPACK_IMPORTED_MODULE_2__.A}},Default=()=>react__WEBPACK_IMPORTED_MODULE_0__.createElement(SummaryTable__WEBPACK_IMPORTED_MODULE_2__.A,{caption:"About company",actions:react__WEBPACK_IMPORTED_MODULE_0__.createElement(_govuk_react_link__WEBPACK_IMPORTED_MODULE_1__.A,{href:"https://example.com"},"Edit")},react__WEBPACK_IMPORTED_MODULE_0__.createElement(SummaryTable__WEBPACK_IMPORTED_MODULE_2__.A.Row,{heading:"Name"},"Example company name"),react__WEBPACK_IMPORTED_MODULE_0__.createElement(SummaryTable__WEBPACK_IMPORTED_MODULE_2__.A.Row,{heading:"Companies House number"},"123",react__WEBPACK_IMPORTED_MODULE_0__.createElement(_govuk_react_link__WEBPACK_IMPORTED_MODULE_1__.A,{href:"https://beta.companieshouse.gov.uk/company/123"},"View on Companies House website")),react__WEBPACK_IMPORTED_MODULE_0__.createElement(SummaryTable__WEBPACK_IMPORTED_MODULE_2__.A.Row,{heading:"Business type"},"Company"),react__WEBPACK_IMPORTED_MODULE_0__.createElement(SummaryTable__WEBPACK_IMPORTED_MODULE_2__.A.CurrencyRow,{heading:"Annual turnover",value:1e12}),react__WEBPACK_IMPORTED_MODULE_0__.createElement(SummaryTable__WEBPACK_IMPORTED_MODULE_2__.A.ListRow,{heading:"UK regions",value:["South West","North East"]}),react__WEBPACK_IMPORTED_MODULE_0__.createElement(SummaryTable__WEBPACK_IMPORTED_MODULE_2__.A.TextRow,{heading:"Have required checks been completed?"}));Default.parameters={...Default.parameters,docs:{...Default.parameters?.docs,source:{originalSource:'() => Edit}>\n Example company name \n \n 123\n \n View on Companies House website\n \n \n Company \n \n \n \n ',...Default.parameters?.docs?.source}}};const __namedExportsOrder=["Default"]}}]);
\ No newline at end of file
diff --git a/SummaryTable-__stories__-SummaryTable-stories.56a3338a.iframe.bundle.js b/SummaryTable-__stories__-SummaryTable-stories.56a3338a.iframe.bundle.js
deleted file mode 100644
index c905d824005..00000000000
--- a/SummaryTable-__stories__-SummaryTable-stories.56a3338a.iframe.bundle.js
+++ /dev/null
@@ -1 +0,0 @@
-"use strict";(self.webpackChunkdata_hub_frontend=self.webpackChunkdata_hub_frontend||[]).push([[1288],{"./src/client/components/SummaryTable/__stories__/SummaryTable.stories.jsx":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.r(__webpack_exports__),__webpack_require__.d(__webpack_exports__,{Default:()=>Default,__namedExportsOrder:()=>__namedExportsOrder,default:()=>__WEBPACK_DEFAULT_EXPORT__});var react__WEBPACK_IMPORTED_MODULE_0__=__webpack_require__("./node_modules/react/index.js"),_govuk_react_link__WEBPACK_IMPORTED_MODULE_1__=__webpack_require__("./node_modules/@govuk-react/link/dist/govuk-react-link.esm.js"),SummaryTable__WEBPACK_IMPORTED_MODULE_2__=__webpack_require__("./src/client/components/SummaryTable/index.jsx");const __WEBPACK_DEFAULT_EXPORT__={title:"SummaryTable",parameters:{component:SummaryTable__WEBPACK_IMPORTED_MODULE_2__.A}};var Default=function Default(){return react__WEBPACK_IMPORTED_MODULE_0__.createElement(SummaryTable__WEBPACK_IMPORTED_MODULE_2__.A,{caption:"About company",actions:react__WEBPACK_IMPORTED_MODULE_0__.createElement(_govuk_react_link__WEBPACK_IMPORTED_MODULE_1__.A,{href:"https://example.com"},"Edit")},react__WEBPACK_IMPORTED_MODULE_0__.createElement(SummaryTable__WEBPACK_IMPORTED_MODULE_2__.A.Row,{heading:"Name"},"Example company name"),react__WEBPACK_IMPORTED_MODULE_0__.createElement(SummaryTable__WEBPACK_IMPORTED_MODULE_2__.A.Row,{heading:"Companies House number"},"123",react__WEBPACK_IMPORTED_MODULE_0__.createElement(_govuk_react_link__WEBPACK_IMPORTED_MODULE_1__.A,{href:"https://beta.companieshouse.gov.uk/company/123"},"View on Companies House website")),react__WEBPACK_IMPORTED_MODULE_0__.createElement(SummaryTable__WEBPACK_IMPORTED_MODULE_2__.A.Row,{heading:"Business type"},"Company"),react__WEBPACK_IMPORTED_MODULE_0__.createElement(SummaryTable__WEBPACK_IMPORTED_MODULE_2__.A.CurrencyRow,{heading:"Annual turnover",value:1e12}),react__WEBPACK_IMPORTED_MODULE_0__.createElement(SummaryTable__WEBPACK_IMPORTED_MODULE_2__.A.ListRow,{heading:"UK regions",value:["South West","North East"]}),react__WEBPACK_IMPORTED_MODULE_0__.createElement(SummaryTable__WEBPACK_IMPORTED_MODULE_2__.A.TextRow,{heading:"Have required checks been completed?"}))};Default.parameters={...Default.parameters,docs:{...Default.parameters?.docs,source:{originalSource:'() => Edit}>\n Example company name \n \n 123\n \n View on Companies House website\n \n \n Company \n \n \n \n ',...Default.parameters?.docs?.source}}};const __namedExportsOrder=["Default"]}}]);
\ No newline at end of file
diff --git a/TabNav-__stories__-TabNav-stories.45756fe4.iframe.bundle.js b/TabNav-__stories__-TabNav-stories.45756fe4.iframe.bundle.js
new file mode 100644
index 00000000000..3992863426a
--- /dev/null
+++ b/TabNav-__stories__-TabNav-stories.45756fe4.iframe.bundle.js
@@ -0,0 +1 @@
+"use strict";(self.webpackChunkdata_hub_frontend=self.webpackChunkdata_hub_frontend||[]).push([[2192],{"./src/client/components/TabNav/__stories__/TabNav.stories.jsx":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.r(__webpack_exports__),__webpack_require__.d(__webpack_exports__,{Default:()=>Default,DocsPlaceholder:()=>DocsPlaceholder,Routed:()=>Routed,__namedExportsOrder:()=>__namedExportsOrder,default:()=>TabNav_stories});var react=__webpack_require__("./node_modules/react/index.js"),TabNav=__webpack_require__("./src/client/components/TabNav/index.jsx");const TabNav_stories={title:"TabNav"},DocsPlaceholder=()=>react.createElement("p",null,"This is a workaround to get the DocsPage to work with multiInstance components.");DocsPlaceholder.story={name:"Docs placeholder"};const Default=()=>react.createElement(TabNav.A,{id:"example",label:"Example",selectedIndex:"bar",tabs:{foo:{label:"Foo",content:react.createElement("h1",null,"Foo")},bar:{label:"Bar",content:react.createElement(TabNav.A,{id:"nested",label:"Nested",selectedIndex:"bbb",tabs:{aaa:{label:"A",content:"aaaaa"},bbb:{label:"B",content:"bbbbb"},ccc:{label:"C",content:"ccccc"}}})},baz:{label:"Baz",content:react.createElement("h3",null,"Baz")}}});Default.story={parameters:{docs:{storyDescription:"Accessible, optionally routed tab navigation. Based on https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Roles/Tab_Role\n\n### Properties\n\n| Prop | Required | Default | Type | Description |\n| :-------------- | :------- | :---------------------------------------- | :--- | :---------- |\n| `label`| Yes | `undefined`| `String` | A label required for accessibility |\n| `routed`| No | `false` | `Boolean` | If `true` the component will set the current path of the route to the value of the selected index and vice versa |\n| `tabs`| Yes | `undefined` | An object or array of `{label: string, content: ReactNode}` objects | If `true` the component will set the current path of the route to the value of the selected index |\n| `keepQueryParams` | No | `false` | `Boolean` | If `true`, clicking through the navigation will keep any query params in the url.\n"}}};const Routed=()=>react.createElement(TabNav.A,{id:"routed-example",label:"RoutedExample",selectedIndex:"bar",routed:!0,tabs:{"/foo":{label:"Foo",content:react.createElement("h1",null,"Foo")},"/bar":{label:"Bar",content:react.createElement("h2",null,"Bar")},"/baz":{label:"Baz",content:react.createElement("h3",null,"Baz")}}});DocsPlaceholder.parameters={...DocsPlaceholder.parameters,docs:{...DocsPlaceholder.parameters?.docs,source:{originalSource:"() => \n This is a workaround to get the DocsPage to work with multiInstance\n components.\n
",...DocsPlaceholder.parameters?.docs?.source}}},Default.parameters={...Default.parameters,docs:{...Default.parameters?.docs,source:{originalSource:"() => Foo\n },\n bar: {\n label: 'Bar',\n content: \n },\n baz: {\n label: 'Baz',\n content: Baz \n }\n}} />",...Default.parameters?.docs?.source}}},Routed.parameters={...Routed.parameters,docs:{...Routed.parameters?.docs,source:{originalSource:"() => Foo\n },\n '/bar': {\n label: 'Bar',\n content: Bar \n },\n '/baz': {\n label: 'Baz',\n content: Baz \n }\n}} />",...Routed.parameters?.docs?.source}}};const __namedExportsOrder=["DocsPlaceholder","Default","Routed"]}}]);
\ No newline at end of file
diff --git a/TabNav-__stories__-TabNav-stories.a6e2a95a.iframe.bundle.js b/TabNav-__stories__-TabNav-stories.a6e2a95a.iframe.bundle.js
deleted file mode 100644
index b4308f111b0..00000000000
--- a/TabNav-__stories__-TabNav-stories.a6e2a95a.iframe.bundle.js
+++ /dev/null
@@ -1 +0,0 @@
-"use strict";(self.webpackChunkdata_hub_frontend=self.webpackChunkdata_hub_frontend||[]).push([[2192],{"./src/client/components/TabNav/__stories__/TabNav.stories.jsx":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.r(__webpack_exports__),__webpack_require__.d(__webpack_exports__,{Default:()=>Default,DocsPlaceholder:()=>DocsPlaceholder,Routed:()=>Routed,__namedExportsOrder:()=>__namedExportsOrder,default:()=>TabNav_stories});var react=__webpack_require__("./node_modules/react/index.js"),TabNav=__webpack_require__("./src/client/components/TabNav/index.jsx");const TabNav_stories={title:"TabNav"};var DocsPlaceholder=function DocsPlaceholder(){return react.createElement("p",null,"This is a workaround to get the DocsPage to work with multiInstance components.")};DocsPlaceholder.story={name:"Docs placeholder"};var Default=function Default(){return react.createElement(TabNav.A,{id:"example",label:"Example",selectedIndex:"bar",tabs:{foo:{label:"Foo",content:react.createElement("h1",null,"Foo")},bar:{label:"Bar",content:react.createElement(TabNav.A,{id:"nested",label:"Nested",selectedIndex:"bbb",tabs:{aaa:{label:"A",content:"aaaaa"},bbb:{label:"B",content:"bbbbb"},ccc:{label:"C",content:"ccccc"}}})},baz:{label:"Baz",content:react.createElement("h3",null,"Baz")}}})};Default.story={parameters:{docs:{storyDescription:"Accessible, optionally routed tab navigation. Based on https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Roles/Tab_Role\n\n### Properties\n\n| Prop | Required | Default | Type | Description |\n| :-------------- | :------- | :---------------------------------------- | :--- | :---------- |\n| `label`| Yes | `undefined`| `String` | A label required for accessibility |\n| `routed`| No | `false` | `Boolean` | If `true` the component will set the current path of the route to the value of the selected index and vice versa |\n| `tabs`| Yes | `undefined` | An object or array of `{label: string, content: ReactNode}` objects | If `true` the component will set the current path of the route to the value of the selected index |\n| `keepQueryParams` | No | `false` | `Boolean` | If `true`, clicking through the navigation will keep any query params in the url.\n"}}};var Routed=function Routed(){return react.createElement(TabNav.A,{id:"routed-example",label:"RoutedExample",selectedIndex:"bar",routed:!0,tabs:{"/foo":{label:"Foo",content:react.createElement("h1",null,"Foo")},"/bar":{label:"Bar",content:react.createElement("h2",null,"Bar")},"/baz":{label:"Baz",content:react.createElement("h3",null,"Baz")}}})};DocsPlaceholder.parameters={...DocsPlaceholder.parameters,docs:{...DocsPlaceholder.parameters?.docs,source:{originalSource:"() => \n This is a workaround to get the DocsPage to work with multiInstance\n components.\n
",...DocsPlaceholder.parameters?.docs?.source}}},Default.parameters={...Default.parameters,docs:{...Default.parameters?.docs,source:{originalSource:"() => Foo\n },\n bar: {\n label: 'Bar',\n content: \n },\n baz: {\n label: 'Baz',\n content: Baz \n }\n}} />",...Default.parameters?.docs?.source}}},Routed.parameters={...Routed.parameters,docs:{...Routed.parameters?.docs,source:{originalSource:"() => Foo\n },\n '/bar': {\n label: 'Bar',\n content: Bar \n },\n '/baz': {\n label: 'Baz',\n content: Baz \n }\n}} />",...Routed.parameters?.docs?.source}}};const __namedExportsOrder=["DocsPlaceholder","Default","Routed"]}}]);
\ No newline at end of file
diff --git a/Tag-__stories__-Tag-stories.0ab4ed7d.iframe.bundle.js b/Tag-__stories__-Tag-stories.0ab4ed7d.iframe.bundle.js
deleted file mode 100644
index 3fc185f63b7..00000000000
--- a/Tag-__stories__-Tag-stories.0ab4ed7d.iframe.bundle.js
+++ /dev/null
@@ -1 +0,0 @@
-"use strict";(self.webpackChunkdata_hub_frontend=self.webpackChunkdata_hub_frontend||[]).push([[1122],{"./src/client/components/Tag/__stories__/Tag.stories.jsx":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.r(__webpack_exports__),__webpack_require__.d(__webpack_exports__,{Default:()=>Default,__namedExportsOrder:()=>__namedExportsOrder,default:()=>__WEBPACK_DEFAULT_EXPORT__});__webpack_require__("./node_modules/core-js/modules/es.array.slice.js"),__webpack_require__("./node_modules/core-js/modules/es.object.freeze.js");var _templateObject,react__WEBPACK_IMPORTED_MODULE_2__=__webpack_require__("./node_modules/react/index.js"),styled_components__WEBPACK_IMPORTED_MODULE_5__=__webpack_require__("./node_modules/styled-components/dist/styled-components.browser.esm.js"),_govuk_react_constants__WEBPACK_IMPORTED_MODULE_3__=__webpack_require__("./node_modules/@govuk-react/constants/dist/govuk-react-constants.esm.js"),Tag__WEBPACK_IMPORTED_MODULE_4__=__webpack_require__("./src/client/components/Tag/index.jsx");var List=(0,styled_components__WEBPACK_IMPORTED_MODULE_5__.Ay)("div")(_templateObject||(_templateObject=function _taggedTemplateLiteral(e,t){return t||(t=e.slice(0)),Object.freeze(Object.defineProperties(e,{raw:{value:Object.freeze(t)}}))}(["\n display: flex;\n flex-direction: column;\n align-items: flex-start;\n\n strong {\n margin-bottom: ",";\n }\n"])),_govuk_react_constants__WEBPACK_IMPORTED_MODULE_3__.Es.SCALE_3);const __WEBPACK_DEFAULT_EXPORT__={title:"Tag",parameters:{component:Tag__WEBPACK_IMPORTED_MODULE_4__.A}};var Default=function Default(){return react__WEBPACK_IMPORTED_MODULE_2__.createElement(List,null,react__WEBPACK_IMPORTED_MODULE_2__.createElement(Tag__WEBPACK_IMPORTED_MODULE_4__.A,null,"BETA"),react__WEBPACK_IMPORTED_MODULE_2__.createElement(Tag__WEBPACK_IMPORTED_MODULE_4__.A,{colour:"grey"},"INACTIVE"),react__WEBPACK_IMPORTED_MODULE_2__.createElement(Tag__WEBPACK_IMPORTED_MODULE_4__.A,{colour:"green"},"NEW"),react__WEBPACK_IMPORTED_MODULE_2__.createElement(Tag__WEBPACK_IMPORTED_MODULE_4__.A,{colour:"turquoise"},"ACTIVE"),react__WEBPACK_IMPORTED_MODULE_2__.createElement(Tag__WEBPACK_IMPORTED_MODULE_4__.A,{colour:"blue"},"PENDING"),react__WEBPACK_IMPORTED_MODULE_2__.createElement(Tag__WEBPACK_IMPORTED_MODULE_4__.A,{colour:"purple"},"RECEIVED"),react__WEBPACK_IMPORTED_MODULE_2__.createElement(Tag__WEBPACK_IMPORTED_MODULE_4__.A,{colour:"pink"},"SENT"),react__WEBPACK_IMPORTED_MODULE_2__.createElement(Tag__WEBPACK_IMPORTED_MODULE_4__.A,{colour:"red"},"REJECTED"),react__WEBPACK_IMPORTED_MODULE_2__.createElement(Tag__WEBPACK_IMPORTED_MODULE_4__.A,{colour:"orange"},"DECLINED"),react__WEBPACK_IMPORTED_MODULE_2__.createElement(Tag__WEBPACK_IMPORTED_MODULE_4__.A,{colour:"yellow"},"DELAYED"))};Default.parameters={...Default.parameters,docs:{...Default.parameters?.docs,source:{originalSource:'() => \n BETA \n INACTIVE \n NEW \n ACTIVE \n PENDING \n RECEIVED \n SENT \n REJECTED \n DECLINED \n DELAYED \n
',...Default.parameters?.docs?.source}}};const __namedExportsOrder=["Default"]}}]);
\ No newline at end of file
diff --git a/Tag-__stories__-Tag-stories.bffe7897.iframe.bundle.js b/Tag-__stories__-Tag-stories.bffe7897.iframe.bundle.js
new file mode 100644
index 00000000000..1c1d4bb7270
--- /dev/null
+++ b/Tag-__stories__-Tag-stories.bffe7897.iframe.bundle.js
@@ -0,0 +1,10 @@
+"use strict";(self.webpackChunkdata_hub_frontend=self.webpackChunkdata_hub_frontend||[]).push([[1122],{"./src/client/components/Tag/__stories__/Tag.stories.jsx":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.r(__webpack_exports__),__webpack_require__.d(__webpack_exports__,{Default:()=>Default,__namedExportsOrder:()=>__namedExportsOrder,default:()=>__WEBPACK_DEFAULT_EXPORT__});var react__WEBPACK_IMPORTED_MODULE_0__=__webpack_require__("./node_modules/react/index.js"),styled_components__WEBPACK_IMPORTED_MODULE_3__=__webpack_require__("./node_modules/styled-components/dist/styled-components.browser.esm.js"),_govuk_react_constants__WEBPACK_IMPORTED_MODULE_1__=__webpack_require__("./node_modules/@govuk-react/constants/dist/govuk-react-constants.esm.js"),Tag__WEBPACK_IMPORTED_MODULE_2__=__webpack_require__("./src/client/components/Tag/index.jsx");const List=(0,styled_components__WEBPACK_IMPORTED_MODULE_3__.Ay)("div")`
+ display: flex;
+ flex-direction: column;
+ align-items: flex-start;
+
+ strong {
+ margin-bottom: ${_govuk_react_constants__WEBPACK_IMPORTED_MODULE_1__.Es.SCALE_3};
+ }
+`,__WEBPACK_DEFAULT_EXPORT__={title:"Tag",parameters:{component:Tag__WEBPACK_IMPORTED_MODULE_2__.A}},Default=()=>react__WEBPACK_IMPORTED_MODULE_0__.createElement(List,null,react__WEBPACK_IMPORTED_MODULE_0__.createElement(Tag__WEBPACK_IMPORTED_MODULE_2__.A,null,"BETA"),react__WEBPACK_IMPORTED_MODULE_0__.createElement(Tag__WEBPACK_IMPORTED_MODULE_2__.A,{colour:"grey"},"INACTIVE"),react__WEBPACK_IMPORTED_MODULE_0__.createElement(Tag__WEBPACK_IMPORTED_MODULE_2__.A,{colour:"green"},"NEW"),react__WEBPACK_IMPORTED_MODULE_0__.createElement(Tag__WEBPACK_IMPORTED_MODULE_2__.A,{colour:"turquoise"},"ACTIVE"),react__WEBPACK_IMPORTED_MODULE_0__.createElement(Tag__WEBPACK_IMPORTED_MODULE_2__.A,{colour:"blue"},"PENDING"),react__WEBPACK_IMPORTED_MODULE_0__.createElement(Tag__WEBPACK_IMPORTED_MODULE_2__.A,{colour:"purple"},"RECEIVED"),react__WEBPACK_IMPORTED_MODULE_0__.createElement(Tag__WEBPACK_IMPORTED_MODULE_2__.A,{colour:"pink"},"SENT"),react__WEBPACK_IMPORTED_MODULE_0__.createElement(Tag__WEBPACK_IMPORTED_MODULE_2__.A,{colour:"red"},"REJECTED"),react__WEBPACK_IMPORTED_MODULE_0__.createElement(Tag__WEBPACK_IMPORTED_MODULE_2__.A,{colour:"orange"},"DECLINED"),react__WEBPACK_IMPORTED_MODULE_0__.createElement(Tag__WEBPACK_IMPORTED_MODULE_2__.A,{colour:"yellow"},"DELAYED"));Default.parameters={...Default.parameters,docs:{...Default.parameters?.docs,source:{originalSource:'() => \n BETA \n INACTIVE \n NEW \n ACTIVE \n PENDING \n RECEIVED \n SENT \n REJECTED \n DECLINED \n DELAYED \n
',...Default.parameters?.docs?.source}}};const __namedExportsOrder=["Default"]}}]);
+//# sourceMappingURL=Tag-__stories__-Tag-stories.bffe7897.iframe.bundle.js.map
\ No newline at end of file
diff --git a/Tag-__stories__-Tag-stories.bffe7897.iframe.bundle.js.map b/Tag-__stories__-Tag-stories.bffe7897.iframe.bundle.js.map
new file mode 100644
index 00000000000..dc247edc4f2
--- /dev/null
+++ b/Tag-__stories__-Tag-stories.bffe7897.iframe.bundle.js.map
@@ -0,0 +1 @@
+{"version":3,"file":"Tag-__stories__-Tag-stories.bffe7897.iframe.bundle.js","mappings":";;;;;;AAUA;;AAGA","sources":["webpack://data-hub-frontend/"],"names":[],"sourceRoot":""}
\ No newline at end of file
diff --git a/Task-__stories__-Error-stories.386550dc.iframe.bundle.js b/Task-__stories__-Error-stories.386550dc.iframe.bundle.js
new file mode 100644
index 00000000000..c276822111a
--- /dev/null
+++ b/Task-__stories__-Error-stories.386550dc.iframe.bundle.js
@@ -0,0 +1 @@
+"use strict";(self.webpackChunkdata_hub_frontend=self.webpackChunkdata_hub_frontend||[]).push([[9925],{"./node_modules/@storybook/addon-actions/dist/index.mjs":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.d(__webpack_exports__,{XI:()=>action,o1:()=>actions});var v4=__webpack_require__("./node_modules/@storybook/addon-actions/node_modules/uuid/dist/esm-browser/v4.js"),external_STORYBOOK_MODULE_PREVIEW_API_=__webpack_require__("@storybook/preview-api"),external_STORYBOOK_MODULE_GLOBAL_=__webpack_require__("@storybook/global"),external_STORYBOOK_MODULE_CORE_EVENTS_PREVIEW_ERRORS_=__webpack_require__("@storybook/core-events/preview-errors"),ADDON_ID="storybook/actions",EVENT_ID=`${ADDON_ID}/action-event`,config={depth:10,clearOnStoryChange:!0,limit:50},findProto=(obj,callback)=>{let proto=Object.getPrototypeOf(obj);return!proto||callback(proto)?proto:findProto(proto,callback)},serializeArg=a=>{if("object"==typeof(e=a)&&e&&findProto(e,(proto=>/^Synthetic(?:Base)?Event$/.test(proto.constructor.name)))&&"function"==typeof e.persist){let e=Object.create(a.constructor.prototype,Object.getOwnPropertyDescriptors(a));e.persist();let viewDescriptor=Object.getOwnPropertyDescriptor(e,"view"),view=viewDescriptor?.value;return"object"==typeof view&&"Window"===view?.constructor.name&&Object.defineProperty(e,"view",{...viewDescriptor,value:Object.create(view.constructor.prototype)}),e}var e;return a},generateId=()=>"object"==typeof crypto&&"function"==typeof crypto.getRandomValues?(0,v4.A)():Date.now().toString(36)+Math.random().toString(36).substring(2);function action(name,options={}){let actionOptions={...config,...options},handler=function(...args){if(options.implicit){let storyRenderer=("__STORYBOOK_PREVIEW__"in external_STORYBOOK_MODULE_GLOBAL_.global?external_STORYBOOK_MODULE_GLOBAL_.global.__STORYBOOK_PREVIEW__:void 0)?.storyRenders.find((render=>"playing"===render.phase||"rendering"===render.phase));if(storyRenderer){let deprecated=!window?.FEATURES?.disallowImplicitActionsInRenderV8,error=new external_STORYBOOK_MODULE_CORE_EVENTS_PREVIEW_ERRORS_.ImplicitActionsDuringRendering({phase:storyRenderer.phase,name,deprecated});if(!deprecated)throw error;console.warn(error)}}let channel=external_STORYBOOK_MODULE_PREVIEW_API_.addons.getChannel(),id=generateId(),serializedArgs=args.map(serializeArg),normalizedArgs=args.length>1?serializedArgs:serializedArgs[0],actionDisplayToEmit={id,count:0,data:{name,args:normalizedArgs},options:{...actionOptions,maxDepth:5+(actionOptions.depth||3),allowFunction:actionOptions.allowFunction||!1}};channel.emit(EVENT_ID,actionDisplayToEmit)};return handler.isAction=!0,handler.implicit=options.implicit,handler}var actions=(...args)=>{let options=config,names=args;1===names.length&&Array.isArray(names[0])&&([names]=names),1!==names.length&&"string"!=typeof names[names.length-1]&&(options={...config,...names.pop()});let namesObject=names[0];(1!==names.length||"string"==typeof namesObject)&&(namesObject={},names.forEach((name=>{namesObject[name]=name})));let actionsObject={};return Object.keys(namesObject).forEach((name=>{actionsObject[name]=action(namesObject[name],options)})),actionsObject}},"./src/client/components/Task/__stories__/Error.stories.jsx":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.r(__webpack_exports__),__webpack_require__.d(__webpack_exports__,{Dismissable:()=>Dismissable,Inline:()=>Inline,NonDismissable:()=>NonDismissable,__namedExportsOrder:()=>__namedExportsOrder,default:()=>__WEBPACK_DEFAULT_EXPORT__});var _storybook_addon_actions__WEBPACK_IMPORTED_MODULE_0__=__webpack_require__("./node_modules/@storybook/addon-actions/dist/index.mjs"),_utils__WEBPACK_IMPORTED_MODULE_1__=__webpack_require__("./src/client/components/Task/__stories__/utils.jsx"),_Error__WEBPACK_IMPORTED_MODULE_2__=__webpack_require__("./src/client/components/Task/Error.jsx");function _extends(){return _extends=Object.assign?Object.assign.bind():function(n){for(var e=1;eReact.createElement(_Error__WEBPACK_IMPORTED_MODULE_2__.A,_extends({},(0,_storybook_addon_actions__WEBPACK_IMPORTED_MODULE_0__.o1)("retry","dismiss"),{errorMessage:"Complete meltdown",noun:"made up thing"})),NonDismissable=()=>React.createElement(_Error__WEBPACK_IMPORTED_MODULE_2__.A,_extends({},(0,_storybook_addon_actions__WEBPACK_IMPORTED_MODULE_0__.o1)("retry"),{errorMessage:"Complete meltdown",noun:"made up thing"})),InlineError=props=>React.createElement(_Error__WEBPACK_IMPORTED_MODULE_2__.A.Inline,_extends({errorMessage:"Complete meltdown",noun:"stuff"},props)),Inline=()=>React.createElement(_utils__WEBPACK_IMPORTED_MODULE_1__.C,{dismissable:React.createElement(InlineError,(0,_storybook_addon_actions__WEBPACK_IMPORTED_MODULE_0__.o1)("retry")),noRetry:React.createElement(InlineError,null)});Dismissable.parameters={...Dismissable.parameters,docs:{...Dismissable.parameters?.docs,source:{originalSource:"() => ",...Dismissable.parameters?.docs?.source}}},NonDismissable.parameters={...NonDismissable.parameters,docs:{...NonDismissable.parameters?.docs,source:{originalSource:'() => ',...NonDismissable.parameters?.docs?.source}}},Inline.parameters={...Inline.parameters,docs:{...Inline.parameters?.docs,source:{originalSource:"() => } noRetry={ } />",...Inline.parameters?.docs?.source}}};const __namedExportsOrder=["Dismissable","NonDismissable","Inline"]},"./src/client/components/Task/__stories__/utils.jsx":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.d(__webpack_exports__,{C:()=>InlineTemplate});var _TabNav__WEBPACK_IMPORTED_MODULE_0__=__webpack_require__("./src/client/components/TabNav/index.jsx"),_Layout_DefaultLayout__WEBPACK_IMPORTED_MODULE_1__=__webpack_require__("./src/client/components/Layout/DefaultLayout.jsx"),InlineTemplate=function InlineTemplate(_ref){var dismissable=_ref.dismissable,noRetry=_ref.noRetry;return React.createElement(_Layout_DefaultLayout__WEBPACK_IMPORTED_MODULE_1__.A,{heading:React.createElement(React.Fragment,null,"In heading ",dismissable," foo bar baz"),localHeaderdismissable:React.createElement(React.Fragment,null,"In local header ",dismissable," foo bar baz"),breadcrumbs:[{text:"Foo"},{text:noRetry},{text:"Foo"}]},React.createElement(_TabNav__WEBPACK_IMPORTED_MODULE_0__.A,{id:"example",label:"Tab nav",selectedIndex:"bar",tabs:{foo:{label:"Foo",content:"Foo content"},bar:{label:React.createElement(React.Fragment,null,"Inside tab ",noRetry),content:"Bar content"},baz:{label:"Baz",content:"Baz content"}}}),React.createElement("h1",null,"Inside H1 ",dismissable," foo bar baz"),React.createElement("h2",null,"Inside H2 ",dismissable," foo bar baz"),React.createElement("h3",null,"Inside H3 ",dismissable," foo bar baz"),React.createElement("h4",null,"Inside H4 ",dismissable," foo bar baz"),React.createElement("h5",null,"Inside H5 ",dismissable," foo bar baz"),React.createElement("h6",null,"Inside H6 ",dismissable," foo bar baz"),React.createElement("p",null,"Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis ultrices"," ",dismissable," odio at ultricies semper. Sed fermentum tortor quis ante blandit malesuada. Praesent vulputate eget dolor vel luctus. Pellentesque id molestie arcu, a eleifend justo."),React.createElement("ul",null,React.createElement("li",null,"Inside list item ",dismissable," foo bar baz"),React.createElement("li",null,"Inside list item ",dismissable," foo bar baz"),React.createElement("li",null,"Inside list item ",dismissable," foo bar baz")))};InlineTemplate.__docgenInfo={description:"",methods:[],displayName:"InlineTemplate"}}}]);
\ No newline at end of file
diff --git a/Task-__stories__-Error-stories.d10df821.iframe.bundle.js b/Task-__stories__-Error-stories.d10df821.iframe.bundle.js
deleted file mode 100644
index b703041ac7e..00000000000
--- a/Task-__stories__-Error-stories.d10df821.iframe.bundle.js
+++ /dev/null
@@ -1 +0,0 @@
-"use strict";(self.webpackChunkdata_hub_frontend=self.webpackChunkdata_hub_frontend||[]).push([[9925],{"./node_modules/@storybook/addon-actions/dist/index.mjs":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.d(__webpack_exports__,{XI:()=>action,o1:()=>actions});var v4=__webpack_require__("./node_modules/@storybook/addon-actions/node_modules/uuid/dist/esm-browser/v4.js"),external_STORYBOOK_MODULE_PREVIEW_API_=__webpack_require__("@storybook/preview-api"),external_STORYBOOK_MODULE_GLOBAL_=__webpack_require__("@storybook/global"),external_STORYBOOK_MODULE_CORE_EVENTS_PREVIEW_ERRORS_=__webpack_require__("@storybook/core-events/preview-errors"),ADDON_ID="storybook/actions",EVENT_ID=`${ADDON_ID}/action-event`,config={depth:10,clearOnStoryChange:!0,limit:50},findProto=(obj,callback)=>{let proto=Object.getPrototypeOf(obj);return!proto||callback(proto)?proto:findProto(proto,callback)},serializeArg=a=>{if("object"==typeof(e=a)&&e&&findProto(e,(proto=>/^Synthetic(?:Base)?Event$/.test(proto.constructor.name)))&&"function"==typeof e.persist){let e=Object.create(a.constructor.prototype,Object.getOwnPropertyDescriptors(a));e.persist();let viewDescriptor=Object.getOwnPropertyDescriptor(e,"view"),view=viewDescriptor?.value;return"object"==typeof view&&"Window"===view?.constructor.name&&Object.defineProperty(e,"view",{...viewDescriptor,value:Object.create(view.constructor.prototype)}),e}var e;return a},generateId=()=>"object"==typeof crypto&&"function"==typeof crypto.getRandomValues?(0,v4.A)():Date.now().toString(36)+Math.random().toString(36).substring(2);function action(name,options={}){let actionOptions={...config,...options},handler=function(...args){if(options.implicit){let storyRenderer=("__STORYBOOK_PREVIEW__"in external_STORYBOOK_MODULE_GLOBAL_.global?external_STORYBOOK_MODULE_GLOBAL_.global.__STORYBOOK_PREVIEW__:void 0)?.storyRenders.find((render=>"playing"===render.phase||"rendering"===render.phase));if(storyRenderer){let deprecated=!window?.FEATURES?.disallowImplicitActionsInRenderV8,error=new external_STORYBOOK_MODULE_CORE_EVENTS_PREVIEW_ERRORS_.ImplicitActionsDuringRendering({phase:storyRenderer.phase,name,deprecated});if(!deprecated)throw error;console.warn(error)}}let channel=external_STORYBOOK_MODULE_PREVIEW_API_.addons.getChannel(),id=generateId(),serializedArgs=args.map(serializeArg),normalizedArgs=args.length>1?serializedArgs:serializedArgs[0],actionDisplayToEmit={id,count:0,data:{name,args:normalizedArgs},options:{...actionOptions,maxDepth:5+(actionOptions.depth||3),allowFunction:actionOptions.allowFunction||!1}};channel.emit(EVENT_ID,actionDisplayToEmit)};return handler.isAction=!0,handler.implicit=options.implicit,handler}var actions=(...args)=>{let options=config,names=args;1===names.length&&Array.isArray(names[0])&&([names]=names),1!==names.length&&"string"!=typeof names[names.length-1]&&(options={...config,...names.pop()});let namesObject=names[0];(1!==names.length||"string"==typeof namesObject)&&(namesObject={},names.forEach((name=>{namesObject[name]=name})));let actionsObject={};return Object.keys(namesObject).forEach((name=>{actionsObject[name]=action(namesObject[name],options)})),actionsObject}},"./src/client/components/Task/__stories__/Error.stories.jsx":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.r(__webpack_exports__),__webpack_require__.d(__webpack_exports__,{Dismissable:()=>Dismissable,Inline:()=>Inline,NonDismissable:()=>NonDismissable,__namedExportsOrder:()=>__namedExportsOrder,default:()=>__WEBPACK_DEFAULT_EXPORT__});__webpack_require__("./node_modules/core-js/modules/es.object.assign.js");var _storybook_addon_actions__WEBPACK_IMPORTED_MODULE_1__=__webpack_require__("./node_modules/@storybook/addon-actions/dist/index.mjs"),_utils__WEBPACK_IMPORTED_MODULE_2__=__webpack_require__("./src/client/components/Task/__stories__/utils.jsx"),_Error__WEBPACK_IMPORTED_MODULE_3__=__webpack_require__("./src/client/components/Task/Error.jsx");function _extends(){return _extends=Object.assign?Object.assign.bind():function(n){for(var e=1;e ",...Dismissable.parameters?.docs?.source}}},NonDismissable.parameters={...NonDismissable.parameters,docs:{...NonDismissable.parameters?.docs,source:{originalSource:'() => ',...NonDismissable.parameters?.docs?.source}}},Inline.parameters={...Inline.parameters,docs:{...Inline.parameters?.docs,source:{originalSource:"() => } noRetry={ } />",...Inline.parameters?.docs?.source}}};const __namedExportsOrder=["Dismissable","NonDismissable","Inline"]},"./src/client/components/Task/__stories__/utils.jsx":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.d(__webpack_exports__,{C:()=>InlineTemplate});var _TabNav__WEBPACK_IMPORTED_MODULE_0__=__webpack_require__("./src/client/components/TabNav/index.jsx"),_Layout_DefaultLayout__WEBPACK_IMPORTED_MODULE_1__=__webpack_require__("./src/client/components/Layout/DefaultLayout.jsx"),InlineTemplate=function InlineTemplate(_ref){var dismissable=_ref.dismissable,noRetry=_ref.noRetry;return React.createElement(_Layout_DefaultLayout__WEBPACK_IMPORTED_MODULE_1__.A,{heading:React.createElement(React.Fragment,null,"In heading ",dismissable," foo bar baz"),localHeaderdismissable:React.createElement(React.Fragment,null,"In local header ",dismissable," foo bar baz"),breadcrumbs:[{text:"Foo"},{text:noRetry},{text:"Foo"}]},React.createElement(_TabNav__WEBPACK_IMPORTED_MODULE_0__.A,{id:"example",label:"Tab nav",selectedIndex:"bar",tabs:{foo:{label:"Foo",content:"Foo content"},bar:{label:React.createElement(React.Fragment,null,"Inside tab ",noRetry),content:"Bar content"},baz:{label:"Baz",content:"Baz content"}}}),React.createElement("h1",null,"Inside H1 ",dismissable," foo bar baz"),React.createElement("h2",null,"Inside H2 ",dismissable," foo bar baz"),React.createElement("h3",null,"Inside H3 ",dismissable," foo bar baz"),React.createElement("h4",null,"Inside H4 ",dismissable," foo bar baz"),React.createElement("h5",null,"Inside H5 ",dismissable," foo bar baz"),React.createElement("h6",null,"Inside H6 ",dismissable," foo bar baz"),React.createElement("p",null,"Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis ultrices"," ",dismissable," odio at ultricies semper. Sed fermentum tortor quis ante blandit malesuada. Praesent vulputate eget dolor vel luctus. Pellentesque id molestie arcu, a eleifend justo."),React.createElement("ul",null,React.createElement("li",null,"Inside list item ",dismissable," foo bar baz"),React.createElement("li",null,"Inside list item ",dismissable," foo bar baz"),React.createElement("li",null,"Inside list item ",dismissable," foo bar baz")))};InlineTemplate.__docgenInfo={description:"",methods:[],displayName:"InlineTemplate"}}}]);
\ No newline at end of file
diff --git a/Task-__stories__-ProgressIndicator-stories.205d5483.iframe.bundle.js b/Task-__stories__-ProgressIndicator-stories.205d5483.iframe.bundle.js
deleted file mode 100644
index 748a5cc5f64..00000000000
--- a/Task-__stories__-ProgressIndicator-stories.205d5483.iframe.bundle.js
+++ /dev/null
@@ -1 +0,0 @@
-"use strict";(self.webpackChunkdata_hub_frontend=self.webpackChunkdata_hub_frontend||[]).push([[5099],{"./src/client/components/Task/__stories__/ProgressIndicator.stories.jsx":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.r(__webpack_exports__),__webpack_require__.d(__webpack_exports__,{Inline:()=>Inline,Message:()=>Message,Noun:()=>Noun,__namedExportsOrder:()=>__namedExportsOrder,default:()=>__WEBPACK_DEFAULT_EXPORT__});var _utils__WEBPACK_IMPORTED_MODULE_0__=__webpack_require__("./src/client/components/Task/__stories__/utils.jsx"),_ProgressIndicator__WEBPACK_IMPORTED_MODULE_1__=__webpack_require__("./src/client/components/ProgressIndicator.jsx");const __WEBPACK_DEFAULT_EXPORT__={title:"Task/ProgressIndicator",component:_ProgressIndicator__WEBPACK_IMPORTED_MODULE_1__.A};var Noun=function Noun(){return React.createElement(_ProgressIndicator__WEBPACK_IMPORTED_MODULE_1__.A,{noun:"stuff"})},Message=function Message(){return React.createElement(_ProgressIndicator__WEBPACK_IMPORTED_MODULE_1__.A,{message:"something is in progress"})},Inline=function Inline(){return React.createElement(_utils__WEBPACK_IMPORTED_MODULE_0__.C,{dismissable:React.createElement(_ProgressIndicator__WEBPACK_IMPORTED_MODULE_1__.A.Inline,{noun:"stuff"}),noRetry:React.createElement(_ProgressIndicator__WEBPACK_IMPORTED_MODULE_1__.A.Inline,{noun:"stuff"})})};Noun.parameters={...Noun.parameters,docs:{...Noun.parameters?.docs,source:{originalSource:'() => ',...Noun.parameters?.docs?.source}}},Message.parameters={...Message.parameters,docs:{...Message.parameters?.docs,source:{originalSource:'() => ',...Message.parameters?.docs?.source}}},Inline.parameters={...Inline.parameters,docs:{...Inline.parameters?.docs,source:{originalSource:'() => } noRetry={ } />',...Inline.parameters?.docs?.source}}};const __namedExportsOrder=["Noun","Message","Inline"]},"./src/client/components/Task/__stories__/utils.jsx":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.d(__webpack_exports__,{C:()=>InlineTemplate});var _TabNav__WEBPACK_IMPORTED_MODULE_0__=__webpack_require__("./src/client/components/TabNav/index.jsx"),_Layout_DefaultLayout__WEBPACK_IMPORTED_MODULE_1__=__webpack_require__("./src/client/components/Layout/DefaultLayout.jsx"),InlineTemplate=function InlineTemplate(_ref){var dismissable=_ref.dismissable,noRetry=_ref.noRetry;return React.createElement(_Layout_DefaultLayout__WEBPACK_IMPORTED_MODULE_1__.A,{heading:React.createElement(React.Fragment,null,"In heading ",dismissable," foo bar baz"),localHeaderdismissable:React.createElement(React.Fragment,null,"In local header ",dismissable," foo bar baz"),breadcrumbs:[{text:"Foo"},{text:noRetry},{text:"Foo"}]},React.createElement(_TabNav__WEBPACK_IMPORTED_MODULE_0__.A,{id:"example",label:"Tab nav",selectedIndex:"bar",tabs:{foo:{label:"Foo",content:"Foo content"},bar:{label:React.createElement(React.Fragment,null,"Inside tab ",noRetry),content:"Bar content"},baz:{label:"Baz",content:"Baz content"}}}),React.createElement("h1",null,"Inside H1 ",dismissable," foo bar baz"),React.createElement("h2",null,"Inside H2 ",dismissable," foo bar baz"),React.createElement("h3",null,"Inside H3 ",dismissable," foo bar baz"),React.createElement("h4",null,"Inside H4 ",dismissable," foo bar baz"),React.createElement("h5",null,"Inside H5 ",dismissable," foo bar baz"),React.createElement("h6",null,"Inside H6 ",dismissable," foo bar baz"),React.createElement("p",null,"Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis ultrices"," ",dismissable," odio at ultricies semper. Sed fermentum tortor quis ante blandit malesuada. Praesent vulputate eget dolor vel luctus. Pellentesque id molestie arcu, a eleifend justo."),React.createElement("ul",null,React.createElement("li",null,"Inside list item ",dismissable," foo bar baz"),React.createElement("li",null,"Inside list item ",dismissable," foo bar baz"),React.createElement("li",null,"Inside list item ",dismissable," foo bar baz")))};InlineTemplate.__docgenInfo={description:"",methods:[],displayName:"InlineTemplate"}}}]);
\ No newline at end of file
diff --git a/Task-__stories__-ProgressIndicator-stories.b97fe6f6.iframe.bundle.js b/Task-__stories__-ProgressIndicator-stories.b97fe6f6.iframe.bundle.js
new file mode 100644
index 00000000000..34390eced48
--- /dev/null
+++ b/Task-__stories__-ProgressIndicator-stories.b97fe6f6.iframe.bundle.js
@@ -0,0 +1 @@
+"use strict";(self.webpackChunkdata_hub_frontend=self.webpackChunkdata_hub_frontend||[]).push([[5099],{"./src/client/components/Task/__stories__/ProgressIndicator.stories.jsx":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.r(__webpack_exports__),__webpack_require__.d(__webpack_exports__,{Inline:()=>Inline,Message:()=>Message,Noun:()=>Noun,__namedExportsOrder:()=>__namedExportsOrder,default:()=>__WEBPACK_DEFAULT_EXPORT__});var _utils__WEBPACK_IMPORTED_MODULE_0__=__webpack_require__("./src/client/components/Task/__stories__/utils.jsx"),_ProgressIndicator__WEBPACK_IMPORTED_MODULE_1__=__webpack_require__("./src/client/components/ProgressIndicator.jsx");const __WEBPACK_DEFAULT_EXPORT__={title:"Task/ProgressIndicator",component:_ProgressIndicator__WEBPACK_IMPORTED_MODULE_1__.A},Noun=()=>React.createElement(_ProgressIndicator__WEBPACK_IMPORTED_MODULE_1__.A,{noun:"stuff"}),Message=()=>React.createElement(_ProgressIndicator__WEBPACK_IMPORTED_MODULE_1__.A,{message:"something is in progress"}),Inline=()=>React.createElement(_utils__WEBPACK_IMPORTED_MODULE_0__.C,{dismissable:React.createElement(_ProgressIndicator__WEBPACK_IMPORTED_MODULE_1__.A.Inline,{noun:"stuff"}),noRetry:React.createElement(_ProgressIndicator__WEBPACK_IMPORTED_MODULE_1__.A.Inline,{noun:"stuff"})});Noun.parameters={...Noun.parameters,docs:{...Noun.parameters?.docs,source:{originalSource:'() => ',...Noun.parameters?.docs?.source}}},Message.parameters={...Message.parameters,docs:{...Message.parameters?.docs,source:{originalSource:'() => ',...Message.parameters?.docs?.source}}},Inline.parameters={...Inline.parameters,docs:{...Inline.parameters?.docs,source:{originalSource:'() => } noRetry={ } />',...Inline.parameters?.docs?.source}}};const __namedExportsOrder=["Noun","Message","Inline"]},"./src/client/components/Task/__stories__/utils.jsx":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.d(__webpack_exports__,{C:()=>InlineTemplate});var _TabNav__WEBPACK_IMPORTED_MODULE_0__=__webpack_require__("./src/client/components/TabNav/index.jsx"),_Layout_DefaultLayout__WEBPACK_IMPORTED_MODULE_1__=__webpack_require__("./src/client/components/Layout/DefaultLayout.jsx"),InlineTemplate=function InlineTemplate(_ref){var dismissable=_ref.dismissable,noRetry=_ref.noRetry;return React.createElement(_Layout_DefaultLayout__WEBPACK_IMPORTED_MODULE_1__.A,{heading:React.createElement(React.Fragment,null,"In heading ",dismissable," foo bar baz"),localHeaderdismissable:React.createElement(React.Fragment,null,"In local header ",dismissable," foo bar baz"),breadcrumbs:[{text:"Foo"},{text:noRetry},{text:"Foo"}]},React.createElement(_TabNav__WEBPACK_IMPORTED_MODULE_0__.A,{id:"example",label:"Tab nav",selectedIndex:"bar",tabs:{foo:{label:"Foo",content:"Foo content"},bar:{label:React.createElement(React.Fragment,null,"Inside tab ",noRetry),content:"Bar content"},baz:{label:"Baz",content:"Baz content"}}}),React.createElement("h1",null,"Inside H1 ",dismissable," foo bar baz"),React.createElement("h2",null,"Inside H2 ",dismissable," foo bar baz"),React.createElement("h3",null,"Inside H3 ",dismissable," foo bar baz"),React.createElement("h4",null,"Inside H4 ",dismissable," foo bar baz"),React.createElement("h5",null,"Inside H5 ",dismissable," foo bar baz"),React.createElement("h6",null,"Inside H6 ",dismissable," foo bar baz"),React.createElement("p",null,"Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis ultrices"," ",dismissable," odio at ultricies semper. Sed fermentum tortor quis ante blandit malesuada. Praesent vulputate eget dolor vel luctus. Pellentesque id molestie arcu, a eleifend justo."),React.createElement("ul",null,React.createElement("li",null,"Inside list item ",dismissable," foo bar baz"),React.createElement("li",null,"Inside list item ",dismissable," foo bar baz"),React.createElement("li",null,"Inside list item ",dismissable," foo bar baz")))};InlineTemplate.__docgenInfo={description:"",methods:[],displayName:"InlineTemplate"}}}]);
\ No newline at end of file
diff --git a/Task-__stories__-Task-stories.26aa0a2b.iframe.bundle.js b/Task-__stories__-Task-stories.26aa0a2b.iframe.bundle.js
deleted file mode 100644
index 9da8d88e2a0..00000000000
--- a/Task-__stories__-Task-stories.26aa0a2b.iframe.bundle.js
+++ /dev/null
@@ -1 +0,0 @@
-"use strict";(self.webpackChunkdata_hub_frontend=self.webpackChunkdata_hub_frontend||[]).push([[5158],{"./src/client/components/Task/__stories__/Task.stories.jsx":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.r(__webpack_exports__),__webpack_require__.d(__webpack_exports__,{Cancelation:()=>Cancelation,__namedExportsOrder:()=>__namedExportsOrder,default:()=>__WEBPACK_DEFAULT_EXPORT__});__webpack_require__("./node_modules/core-js/modules/es.array.map.js");var react__WEBPACK_IMPORTED_MODULE_1__=__webpack_require__("./node_modules/react/index.js"),___WEBPACK_IMPORTED_MODULE_2__=__webpack_require__("./src/client/components/Task/index.jsx");const __WEBPACK_DEFAULT_EXPORT__={title:"Task"};var Cancelation=function Cancelation(){return react__WEBPACK_IMPORTED_MODULE_1__.createElement(___WEBPACK_IMPORTED_MODULE_2__.A,null,(function(task){return react__WEBPACK_IMPORTED_MODULE_1__.createElement("ul",null,["a","b","c"].map((function(id){var t=task("Task cancellation demo",id),startOptions={payload:id,onSuccessDispatch:"DONE-".concat(id)};return react__WEBPACK_IMPORTED_MODULE_1__.createElement("li",{key:id},"id: ",id," ",react__WEBPACK_IMPORTED_MODULE_1__.createElement("button",{disabled:t.progress,onClick:function onClick(){return t.start(startOptions)}},"start"),react__WEBPACK_IMPORTED_MODULE_1__.createElement("button",{onClick:function onClick(){t.cancel(),t.start(startOptions)}},"restart"),react__WEBPACK_IMPORTED_MODULE_1__.createElement("button",{disabled:!t.progress,onClick:function onClick(){return t.cancel()}},"cancel")," ","status: ",t.status)})))}))};Cancelation.parameters={...Cancelation.parameters,docs:{...Cancelation.parameters?.docs,source:{originalSource:"() => \n {task => \n {['a', 'b', 'c'].map(id => {\n const t = task('Task cancellation demo', id);\n const startOptions = {\n payload: id,\n onSuccessDispatch: `DONE-${id}`\n };\n return \n id: {id}{' '}\n t.start(startOptions)}>\n start\n \n {\n t.cancel();\n t.start(startOptions);\n }}>\n restart\n \n t.cancel()}>\n cancel\n {' '}\n status: {t.status}\n ;\n })}\n }\n ",...Cancelation.parameters?.docs?.source}}};const __namedExportsOrder=["Cancelation"]}}]);
\ No newline at end of file
diff --git a/Task-__stories__-Task-stories.8875c96e.iframe.bundle.js b/Task-__stories__-Task-stories.8875c96e.iframe.bundle.js
new file mode 100644
index 00000000000..73c695a7d2e
--- /dev/null
+++ b/Task-__stories__-Task-stories.8875c96e.iframe.bundle.js
@@ -0,0 +1 @@
+"use strict";(self.webpackChunkdata_hub_frontend=self.webpackChunkdata_hub_frontend||[]).push([[5158],{"./src/client/components/Task/__stories__/Task.stories.jsx":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.r(__webpack_exports__),__webpack_require__.d(__webpack_exports__,{Cancelation:()=>Cancelation,__namedExportsOrder:()=>__namedExportsOrder,default:()=>__WEBPACK_DEFAULT_EXPORT__});var react__WEBPACK_IMPORTED_MODULE_0__=__webpack_require__("./node_modules/react/index.js"),___WEBPACK_IMPORTED_MODULE_1__=__webpack_require__("./src/client/components/Task/index.jsx");const __WEBPACK_DEFAULT_EXPORT__={title:"Task"},Cancelation=()=>react__WEBPACK_IMPORTED_MODULE_0__.createElement(___WEBPACK_IMPORTED_MODULE_1__.A,null,(task=>react__WEBPACK_IMPORTED_MODULE_0__.createElement("ul",null,["a","b","c"].map((id=>{const t=task("Task cancellation demo",id),startOptions={payload:id,onSuccessDispatch:`DONE-${id}`};return react__WEBPACK_IMPORTED_MODULE_0__.createElement("li",{key:id},"id: ",id," ",react__WEBPACK_IMPORTED_MODULE_0__.createElement("button",{disabled:t.progress,onClick:()=>t.start(startOptions)},"start"),react__WEBPACK_IMPORTED_MODULE_0__.createElement("button",{onClick:()=>{t.cancel(),t.start(startOptions)}},"restart"),react__WEBPACK_IMPORTED_MODULE_0__.createElement("button",{disabled:!t.progress,onClick:()=>t.cancel()},"cancel")," ","status: ",t.status)})))));Cancelation.parameters={...Cancelation.parameters,docs:{...Cancelation.parameters?.docs,source:{originalSource:"() => \n {task => \n {['a', 'b', 'c'].map(id => {\n const t = task('Task cancellation demo', id);\n const startOptions = {\n payload: id,\n onSuccessDispatch: `DONE-${id}`\n };\n return \n id: {id}{' '}\n t.start(startOptions)}>\n start\n \n {\n t.cancel();\n t.start(startOptions);\n }}>\n restart\n \n t.cancel()}>\n cancel\n {' '}\n status: {t.status}\n ;\n })}\n }\n ",...Cancelation.parameters?.docs?.source}}};const __namedExportsOrder=["Cancelation"]}}]);
\ No newline at end of file
diff --git a/Timeline-__stories__-Timeline-stories.13988fa7.iframe.bundle.js b/Timeline-__stories__-Timeline-stories.13988fa7.iframe.bundle.js
deleted file mode 100644
index 7b85e65fce5..00000000000
--- a/Timeline-__stories__-Timeline-stories.13988fa7.iframe.bundle.js
+++ /dev/null
@@ -1 +0,0 @@
-"use strict";(self.webpackChunkdata_hub_frontend=self.webpackChunkdata_hub_frontend||[]).push([[790],{"./src/client/components/Timeline/__stories__/Timeline.stories.jsx":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.r(__webpack_exports__),__webpack_require__.d(__webpack_exports__,{Complete:()=>Complete,Default:()=>Default,FirstStage:()=>FirstStage,__namedExportsOrder:()=>__namedExportsOrder,default:()=>__WEBPACK_DEFAULT_EXPORT__});var react__WEBPACK_IMPORTED_MODULE_0__=__webpack_require__("./node_modules/react/index.js"),Timeline__WEBPACK_IMPORTED_MODULE_1__=__webpack_require__("./src/client/components/Timeline/index.jsx"),_modules_Investments_Projects_constants__WEBPACK_IMPORTED_MODULE_2__=__webpack_require__("./src/client/modules/Investments/Projects/constants.js");const __WEBPACK_DEFAULT_EXPORT__={title:"Timeline",parameters:{component:Timeline__WEBPACK_IMPORTED_MODULE_1__.A}};var Default=function Default(){return react__WEBPACK_IMPORTED_MODULE_0__.createElement(Timeline__WEBPACK_IMPORTED_MODULE_1__.A,{stages:_modules_Investments_Projects_constants__WEBPACK_IMPORTED_MODULE_2__.s1})},FirstStage=function FirstStage(){return react__WEBPACK_IMPORTED_MODULE_0__.createElement(Timeline__WEBPACK_IMPORTED_MODULE_1__.A,{stages:_modules_Investments_Projects_constants__WEBPACK_IMPORTED_MODULE_2__.s1,currentStage:_modules_Investments_Projects_constants__WEBPACK_IMPORTED_MODULE_2__.sy})};FirstStage.story={name:"First stage"};var Complete=function Complete(){return react__WEBPACK_IMPORTED_MODULE_0__.createElement(Timeline__WEBPACK_IMPORTED_MODULE_1__.A,{stages:_modules_Investments_Projects_constants__WEBPACK_IMPORTED_MODULE_2__.s1,currentStage:_modules_Investments_Projects_constants__WEBPACK_IMPORTED_MODULE_2__.c0})};Default.parameters={...Default.parameters,docs:{...Default.parameters?.docs,source:{originalSource:"() => ",...Default.parameters?.docs?.source}}},FirstStage.parameters={...FirstStage.parameters,docs:{...FirstStage.parameters?.docs,source:{originalSource:"() => ",...FirstStage.parameters?.docs?.source}}},Complete.parameters={...Complete.parameters,docs:{...Complete.parameters?.docs,source:{originalSource:"() => ",...Complete.parameters?.docs?.source}}};const __namedExportsOrder=["Default","FirstStage","Complete"]}}]);
\ No newline at end of file
diff --git a/Timeline-__stories__-Timeline-stories.9d76c5ad.iframe.bundle.js b/Timeline-__stories__-Timeline-stories.9d76c5ad.iframe.bundle.js
new file mode 100644
index 00000000000..234184e55b4
--- /dev/null
+++ b/Timeline-__stories__-Timeline-stories.9d76c5ad.iframe.bundle.js
@@ -0,0 +1 @@
+"use strict";(self.webpackChunkdata_hub_frontend=self.webpackChunkdata_hub_frontend||[]).push([[790],{"./src/client/components/Timeline/__stories__/Timeline.stories.jsx":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.r(__webpack_exports__),__webpack_require__.d(__webpack_exports__,{Complete:()=>Complete,Default:()=>Default,FirstStage:()=>FirstStage,__namedExportsOrder:()=>__namedExportsOrder,default:()=>__WEBPACK_DEFAULT_EXPORT__});var react__WEBPACK_IMPORTED_MODULE_0__=__webpack_require__("./node_modules/react/index.js"),Timeline__WEBPACK_IMPORTED_MODULE_1__=__webpack_require__("./src/client/components/Timeline/index.jsx"),_modules_Investments_Projects_constants__WEBPACK_IMPORTED_MODULE_2__=__webpack_require__("./src/client/modules/Investments/Projects/constants.js");const __WEBPACK_DEFAULT_EXPORT__={title:"Timeline",parameters:{component:Timeline__WEBPACK_IMPORTED_MODULE_1__.A}},Default=()=>react__WEBPACK_IMPORTED_MODULE_0__.createElement(Timeline__WEBPACK_IMPORTED_MODULE_1__.A,{stages:_modules_Investments_Projects_constants__WEBPACK_IMPORTED_MODULE_2__.s1}),FirstStage=()=>react__WEBPACK_IMPORTED_MODULE_0__.createElement(Timeline__WEBPACK_IMPORTED_MODULE_1__.A,{stages:_modules_Investments_Projects_constants__WEBPACK_IMPORTED_MODULE_2__.s1,currentStage:_modules_Investments_Projects_constants__WEBPACK_IMPORTED_MODULE_2__.sy});FirstStage.story={name:"First stage"};const Complete=()=>react__WEBPACK_IMPORTED_MODULE_0__.createElement(Timeline__WEBPACK_IMPORTED_MODULE_1__.A,{stages:_modules_Investments_Projects_constants__WEBPACK_IMPORTED_MODULE_2__.s1,currentStage:_modules_Investments_Projects_constants__WEBPACK_IMPORTED_MODULE_2__.c0});Default.parameters={...Default.parameters,docs:{...Default.parameters?.docs,source:{originalSource:"() => ",...Default.parameters?.docs?.source}}},FirstStage.parameters={...FirstStage.parameters,docs:{...FirstStage.parameters?.docs,source:{originalSource:"() => ",...FirstStage.parameters?.docs?.source}}},Complete.parameters={...Complete.parameters,docs:{...Complete.parameters?.docs,source:{originalSource:"() => ",...Complete.parameters?.docs?.source}}};const __namedExportsOrder=["Default","FirstStage","Complete"]}}]);
\ No newline at end of file
diff --git a/ToggleSection-__stories__-ToggleSection-stories.0170caa1.iframe.bundle.js b/ToggleSection-__stories__-ToggleSection-stories.0170caa1.iframe.bundle.js
deleted file mode 100644
index 7f09a7efebb..00000000000
--- a/ToggleSection-__stories__-ToggleSection-stories.0170caa1.iframe.bundle.js
+++ /dev/null
@@ -1 +0,0 @@
-"use strict";(self.webpackChunkdata_hub_frontend=self.webpackChunkdata_hub_frontend||[]).push([[710],{"./src/client/components/ToggleSection/__stories__/ToggleSection.stories.jsx":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.r(__webpack_exports__),__webpack_require__.d(__webpack_exports__,{DashboardMultiple:()=>DashboardMultiple,DashboardSingleWithBadge:()=>DashboardSingleWithBadge,DefaultMultiple:()=>DefaultMultiple,DefaultSingle:()=>DefaultSingle,DocsPlaceholder:()=>DocsPlaceholder,FilterMultiple:()=>FilterMultiple,FilterSingle:()=>FilterSingle,NoHighlightMultiple:()=>NoHighlightMultiple,NoHighlightSingle:()=>NoHighlightSingle,__namedExportsOrder:()=>__namedExportsOrder,default:()=>ToggleSection_stories});var react=__webpack_require__("./node_modules/react/index.js"),NotificationBadge=__webpack_require__("./src/client/components/NotificationBadge/index.jsx"),ToggleSection=__webpack_require__("./src/client/components/ToggleSection/index.jsx");var FieldInput=__webpack_require__("./src/client/components/Form/elements/FieldInput/index.jsx"),Form=__webpack_require__("./src/client/components/Form/index.jsx");const ToggleSection_stories={title:"ToggleSection"};var DocsPlaceholder=function DocsPlaceholder(){return react.createElement("p",null,"This is a workaround to get the DocsPage to work with multiInstance components.")};DocsPlaceholder.story={name:"Docs placeholder"};var DefaultSingle=function DefaultSingle(){return react.createElement(ToggleSection.Os,{label:"Toggle me",id:"toggle.four",isOpen:!0},react.createElement(Form.A,{id:"toggleSectionExample",analyticsFormName:"toggleSectionExample",submissionTaskName:"Submit Form example"},(function(){return react.createElement(FieldInput.A,{label:"Text",hint:"Some hint",name:"testField",required:"Enter text",type:"text"})})))};DefaultSingle.story={name:"Default - Single",parameters:{docs:{storyDescription:'This is to be used for toggling groups, this does not replace the "details" component in the [GDS design system](https://design-system.service.gov.uk/components/details/).\n'}}};var DefaultMultiple=function DefaultMultiple(){return react.createElement(react.Fragment,null,react.createElement(ToggleSection.Os,{label:"Toggle me",id:"toggle.five",isOpen:!0},react.createElement(Form.A,{id:"toggleSectionExample",analyticsFormName:"toggleSectionExample",submissionTaskName:"Submit Form example"},(function(){return react.createElement(FieldInput.A,{label:"Text",hint:"Some hint",name:"testField",required:"Enter text",type:"text"})}))),react.createElement(ToggleSection.Os,{label:"Toggle me",id:"toggle.six"},react.createElement(Form.A,{id:"toggleSectionExample",analyticsFormName:"toggleSectionExample",submissionTaskName:"Submit Form example"},(function(){return react.createElement(FieldInput.A,{label:"Text",hint:"Some hint",name:"testField",required:"Enter text",type:"text"})}))))};DefaultMultiple.story={name:"Default - Multiple"};var NoHighlightSingle=function NoHighlightSingle(){return react.createElement(ToggleSection.xQ,{label:"Toggle me",id:"toggle.seven",isOpen:!0},react.createElement(Form.A,{id:"toggleSectionExample",analyticsFormName:"toggleSectionExample",submissionTaskName:"Submit Form example"},(function(){return react.createElement(FieldInput.A,{label:"Text",hint:"Some hint",name:"testField",required:"Enter text",type:"text"})})))};NoHighlightSingle.story={name:"No Highlight - Single"};var NoHighlightMultiple=function NoHighlightMultiple(){return react.createElement(react.Fragment,null,react.createElement(ToggleSection.xQ,{label:"Toggle me",id:"toggle.eight",isOpen:!0},react.createElement(Form.A,{id:"toggleSectionExample",analyticsFormName:"toggleSectionExample",submissionTaskName:"Submit Form example"},(function(){return react.createElement(FieldInput.A,{label:"Text",hint:"Some hint",name:"testField",required:"Enter text",type:"text"})}))),react.createElement(ToggleSection.xQ,{label:"Toggle me",id:"toggle.nine"},react.createElement(Form.A,{id:"toggleSectionExample",analyticsFormName:"toggleSectionExample",submissionTaskName:"Submit Form example"},(function(){return react.createElement(FieldInput.A,{label:"Text",hint:"Some hint",name:"testField",required:"Enter text",type:"text"})}))))};NoHighlightMultiple.story={name:"No Highlight - Multiple"};var DashboardSingleWithBadge=function DashboardSingleWithBadge(){return react.createElement(ToggleSection.cQ,{label:"Toggle me",id:"toggle.one",isOpen:!0,badge:react.createElement(NotificationBadge.Ay,{value:15})},react.createElement(Form.A,{id:"toggleSectionExample",analyticsFormName:"toggleSectionExample",submissionTaskName:"Submit Form example"},(function(){return react.createElement(FieldInput.A,{label:"Text",hint:"Some hint",name:"testField",required:"Enter text",type:"text"})})))};DashboardSingleWithBadge.story={name:"Dashboard - Single (with badge)"};var DashboardMultiple=function DashboardMultiple(){return react.createElement(react.Fragment,null,react.createElement(ToggleSection.cQ,{label:"Toggle me",id:"toggle.two",isOpen:!0,major:!0},react.createElement(Form.A,{id:"toggleSectionExample",analyticsFormName:"toggleSectionExample",submissionTaskName:"Submit Form example"},(function(){return react.createElement(FieldInput.A,{label:"Text",hint:"Some hint",name:"testField",required:"Enter text",type:"text"})}))),react.createElement(ToggleSection.cQ,{label:"Toggle me",id:"toggle.three"},react.createElement(Form.A,{id:"toggleSectionExample",analyticsFormName:"toggleSectionExample",submissionTaskName:"Submit Form example"},(function(){return react.createElement(FieldInput.A,{label:"Text",hint:"Some hint",name:"testField",required:"Enter text",type:"text"})}))))};DashboardMultiple.story={name:"Dashboard - Multiple"};var FilterSingle=function FilterSingle(){return react.createElement(ToggleSection.Q,{label:"Toggle me",id:"toggle.eight",isOpen:!0},react.createElement("p",null,"Some filters"))};FilterSingle.story={name:"Filter - Single"};var FilterMultiple=function FilterMultiple(){return react.createElement(react.Fragment,null,react.createElement(ToggleSection.Q,{label:"Toggle me",id:"toggle.nine",isOpen:!0},react.createElement("p",null,"Some filters")),react.createElement(ToggleSection.Q,{label:"Toggle me",id:"toggle.ten",isOpen:!1},react.createElement("p",null,"Some filters")),react.createElement(ToggleSection.Q,{label:"Toggle me",id:"toggle.eleven",isOpen:!1},react.createElement("p",null,"Some filters")))};FilterMultiple.story={name:"Filter - Multiple"},DocsPlaceholder.parameters={...DocsPlaceholder.parameters,docs:{...DocsPlaceholder.parameters?.docs,source:{originalSource:"() => \n This is a workaround to get the DocsPage to work with multiInstance\n components.\n
",...DocsPlaceholder.parameters?.docs?.source}}},DefaultSingle.parameters={...DefaultSingle.parameters,docs:{...DefaultSingle.parameters?.docs,source:{originalSource:'() => \n \n ',...DefaultSingle.parameters?.docs?.source}}},DefaultMultiple.parameters={...DefaultMultiple.parameters,docs:{...DefaultMultiple.parameters?.docs,source:{originalSource:'() => <>\n \n \n \n \n \n \n >',...DefaultMultiple.parameters?.docs?.source}}},NoHighlightSingle.parameters={...NoHighlightSingle.parameters,docs:{...NoHighlightSingle.parameters?.docs,source:{originalSource:'() => \n \n ',...NoHighlightSingle.parameters?.docs?.source}}},NoHighlightMultiple.parameters={...NoHighlightMultiple.parameters,docs:{...NoHighlightMultiple.parameters?.docs,source:{originalSource:'() => <>\n \n \n \n \n \n \n >',...NoHighlightMultiple.parameters?.docs?.source}}},DashboardSingleWithBadge.parameters={...DashboardSingleWithBadge.parameters,docs:{...DashboardSingleWithBadge.parameters?.docs,source:{originalSource:'() => }>\n \n ',...DashboardSingleWithBadge.parameters?.docs?.source}}},DashboardMultiple.parameters={...DashboardMultiple.parameters,docs:{...DashboardMultiple.parameters?.docs,source:{originalSource:'() => <>\n \n \n \n \n \n \n >',...DashboardMultiple.parameters?.docs?.source}}},FilterSingle.parameters={...FilterSingle.parameters,docs:{...FilterSingle.parameters?.docs,source:{originalSource:'() => \n Some filters
\n ',...FilterSingle.parameters?.docs?.source}}},FilterMultiple.parameters={...FilterMultiple.parameters,docs:{...FilterMultiple.parameters?.docs,source:{originalSource:'() => <>\n \n Some filters
\n \n \n Some filters
\n \n \n Some filters
\n \n >',...FilterMultiple.parameters?.docs?.source}}};const __namedExportsOrder=["DocsPlaceholder","DefaultSingle","DefaultMultiple","NoHighlightSingle","NoHighlightMultiple","DashboardSingleWithBadge","DashboardMultiple","FilterSingle","FilterMultiple"]}}]);
\ No newline at end of file
diff --git a/ToggleSection-__stories__-ToggleSection-stories.412d76c9.iframe.bundle.js b/ToggleSection-__stories__-ToggleSection-stories.412d76c9.iframe.bundle.js
new file mode 100644
index 00000000000..5b76f0b183e
--- /dev/null
+++ b/ToggleSection-__stories__-ToggleSection-stories.412d76c9.iframe.bundle.js
@@ -0,0 +1 @@
+"use strict";(self.webpackChunkdata_hub_frontend=self.webpackChunkdata_hub_frontend||[]).push([[710],{"./src/client/components/ToggleSection/__stories__/ToggleSection.stories.jsx":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.r(__webpack_exports__),__webpack_require__.d(__webpack_exports__,{DashboardMultiple:()=>DashboardMultiple,DashboardSingleWithBadge:()=>DashboardSingleWithBadge,DefaultMultiple:()=>DefaultMultiple,DefaultSingle:()=>DefaultSingle,DocsPlaceholder:()=>DocsPlaceholder,FilterMultiple:()=>FilterMultiple,FilterSingle:()=>FilterSingle,NoHighlightMultiple:()=>NoHighlightMultiple,NoHighlightSingle:()=>NoHighlightSingle,__namedExportsOrder:()=>__namedExportsOrder,default:()=>ToggleSection_stories});var react=__webpack_require__("./node_modules/react/index.js"),NotificationBadge=__webpack_require__("./src/client/components/NotificationBadge/index.jsx"),ToggleSection=__webpack_require__("./src/client/components/ToggleSection/index.jsx");var FieldInput=__webpack_require__("./src/client/components/Form/elements/FieldInput/index.jsx"),Form=__webpack_require__("./src/client/components/Form/index.jsx");const ToggleSection_stories={title:"ToggleSection"},DocsPlaceholder=()=>react.createElement("p",null,"This is a workaround to get the DocsPage to work with multiInstance components.");DocsPlaceholder.story={name:"Docs placeholder"};const DefaultSingle=()=>react.createElement(ToggleSection.Os,{label:"Toggle me",id:"toggle.four",isOpen:!0},react.createElement(Form.A,{id:"toggleSectionExample",analyticsFormName:"toggleSectionExample",submissionTaskName:"Submit Form example"},(()=>react.createElement(FieldInput.A,{label:"Text",hint:"Some hint",name:"testField",required:"Enter text",type:"text"}))));DefaultSingle.story={name:"Default - Single",parameters:{docs:{storyDescription:'This is to be used for toggling groups, this does not replace the "details" component in the [GDS design system](https://design-system.service.gov.uk/components/details/).\n'}}};const DefaultMultiple=()=>react.createElement(react.Fragment,null,react.createElement(ToggleSection.Os,{label:"Toggle me",id:"toggle.five",isOpen:!0},react.createElement(Form.A,{id:"toggleSectionExample",analyticsFormName:"toggleSectionExample",submissionTaskName:"Submit Form example"},(()=>react.createElement(FieldInput.A,{label:"Text",hint:"Some hint",name:"testField",required:"Enter text",type:"text"})))),react.createElement(ToggleSection.Os,{label:"Toggle me",id:"toggle.six"},react.createElement(Form.A,{id:"toggleSectionExample",analyticsFormName:"toggleSectionExample",submissionTaskName:"Submit Form example"},(()=>react.createElement(FieldInput.A,{label:"Text",hint:"Some hint",name:"testField",required:"Enter text",type:"text"})))));DefaultMultiple.story={name:"Default - Multiple"};const NoHighlightSingle=()=>react.createElement(ToggleSection.xQ,{label:"Toggle me",id:"toggle.seven",isOpen:!0},react.createElement(Form.A,{id:"toggleSectionExample",analyticsFormName:"toggleSectionExample",submissionTaskName:"Submit Form example"},(()=>react.createElement(FieldInput.A,{label:"Text",hint:"Some hint",name:"testField",required:"Enter text",type:"text"}))));NoHighlightSingle.story={name:"No Highlight - Single"};const NoHighlightMultiple=()=>react.createElement(react.Fragment,null,react.createElement(ToggleSection.xQ,{label:"Toggle me",id:"toggle.eight",isOpen:!0},react.createElement(Form.A,{id:"toggleSectionExample",analyticsFormName:"toggleSectionExample",submissionTaskName:"Submit Form example"},(()=>react.createElement(FieldInput.A,{label:"Text",hint:"Some hint",name:"testField",required:"Enter text",type:"text"})))),react.createElement(ToggleSection.xQ,{label:"Toggle me",id:"toggle.nine"},react.createElement(Form.A,{id:"toggleSectionExample",analyticsFormName:"toggleSectionExample",submissionTaskName:"Submit Form example"},(()=>react.createElement(FieldInput.A,{label:"Text",hint:"Some hint",name:"testField",required:"Enter text",type:"text"})))));NoHighlightMultiple.story={name:"No Highlight - Multiple"};const DashboardSingleWithBadge=()=>react.createElement(ToggleSection.cQ,{label:"Toggle me",id:"toggle.one",isOpen:!0,badge:react.createElement(NotificationBadge.Ay,{value:15})},react.createElement(Form.A,{id:"toggleSectionExample",analyticsFormName:"toggleSectionExample",submissionTaskName:"Submit Form example"},(()=>react.createElement(FieldInput.A,{label:"Text",hint:"Some hint",name:"testField",required:"Enter text",type:"text"}))));DashboardSingleWithBadge.story={name:"Dashboard - Single (with badge)"};const DashboardMultiple=()=>react.createElement(react.Fragment,null,react.createElement(ToggleSection.cQ,{label:"Toggle me",id:"toggle.two",isOpen:!0,major:!0},react.createElement(Form.A,{id:"toggleSectionExample",analyticsFormName:"toggleSectionExample",submissionTaskName:"Submit Form example"},(()=>react.createElement(FieldInput.A,{label:"Text",hint:"Some hint",name:"testField",required:"Enter text",type:"text"})))),react.createElement(ToggleSection.cQ,{label:"Toggle me",id:"toggle.three"},react.createElement(Form.A,{id:"toggleSectionExample",analyticsFormName:"toggleSectionExample",submissionTaskName:"Submit Form example"},(()=>react.createElement(FieldInput.A,{label:"Text",hint:"Some hint",name:"testField",required:"Enter text",type:"text"})))));DashboardMultiple.story={name:"Dashboard - Multiple"};const FilterSingle=()=>react.createElement(ToggleSection.Q,{label:"Toggle me",id:"toggle.eight",isOpen:!0},react.createElement("p",null,"Some filters"));FilterSingle.story={name:"Filter - Single"};const FilterMultiple=()=>react.createElement(react.Fragment,null,react.createElement(ToggleSection.Q,{label:"Toggle me",id:"toggle.nine",isOpen:!0},react.createElement("p",null,"Some filters")),react.createElement(ToggleSection.Q,{label:"Toggle me",id:"toggle.ten",isOpen:!1},react.createElement("p",null,"Some filters")),react.createElement(ToggleSection.Q,{label:"Toggle me",id:"toggle.eleven",isOpen:!1},react.createElement("p",null,"Some filters")));FilterMultiple.story={name:"Filter - Multiple"},DocsPlaceholder.parameters={...DocsPlaceholder.parameters,docs:{...DocsPlaceholder.parameters?.docs,source:{originalSource:"() => \n This is a workaround to get the DocsPage to work with multiInstance\n components.\n
",...DocsPlaceholder.parameters?.docs?.source}}},DefaultSingle.parameters={...DefaultSingle.parameters,docs:{...DefaultSingle.parameters?.docs,source:{originalSource:'() => \n \n ',...DefaultSingle.parameters?.docs?.source}}},DefaultMultiple.parameters={...DefaultMultiple.parameters,docs:{...DefaultMultiple.parameters?.docs,source:{originalSource:'() => <>\n \n \n \n \n \n \n >',...DefaultMultiple.parameters?.docs?.source}}},NoHighlightSingle.parameters={...NoHighlightSingle.parameters,docs:{...NoHighlightSingle.parameters?.docs,source:{originalSource:'() => \n \n ',...NoHighlightSingle.parameters?.docs?.source}}},NoHighlightMultiple.parameters={...NoHighlightMultiple.parameters,docs:{...NoHighlightMultiple.parameters?.docs,source:{originalSource:'() => <>\n \n \n \n \n \n \n >',...NoHighlightMultiple.parameters?.docs?.source}}},DashboardSingleWithBadge.parameters={...DashboardSingleWithBadge.parameters,docs:{...DashboardSingleWithBadge.parameters?.docs,source:{originalSource:'() => }>\n \n ',...DashboardSingleWithBadge.parameters?.docs?.source}}},DashboardMultiple.parameters={...DashboardMultiple.parameters,docs:{...DashboardMultiple.parameters?.docs,source:{originalSource:'() => <>\n \n \n \n \n \n \n >',...DashboardMultiple.parameters?.docs?.source}}},FilterSingle.parameters={...FilterSingle.parameters,docs:{...FilterSingle.parameters?.docs,source:{originalSource:'() => \n Some filters
\n ',...FilterSingle.parameters?.docs?.source}}},FilterMultiple.parameters={...FilterMultiple.parameters,docs:{...FilterMultiple.parameters?.docs,source:{originalSource:'() => <>\n \n Some filters
\n \n \n Some filters
\n \n \n Some filters
\n \n >',...FilterMultiple.parameters?.docs?.source}}};const __namedExportsOrder=["DocsPlaceholder","DefaultSingle","DefaultMultiple","NoHighlightSingle","NoHighlightMultiple","DashboardSingleWithBadge","DashboardMultiple","FilterSingle","FilterMultiple"]}}]);
\ No newline at end of file
diff --git a/Typeahead-__stories__-Typeahead-stories.9680d1c6.iframe.bundle.js b/Typeahead-__stories__-Typeahead-stories.9680d1c6.iframe.bundle.js
new file mode 100644
index 00000000000..8ef2633c296
--- /dev/null
+++ b/Typeahead-__stories__-Typeahead-stories.9680d1c6.iframe.bundle.js
@@ -0,0 +1 @@
+"use strict";(self.webpackChunkdata_hub_frontend=self.webpackChunkdata_hub_frontend||[]).push([[1310],{"./src/client/components/Typeahead/__stories__/Typeahead.stories.jsx":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.r(__webpack_exports__),__webpack_require__.d(__webpack_exports__,{DocsPlaceholder:()=>DocsPlaceholder,MultiAsyncOptions:()=>MultiAsyncOptions,MultiAsyncPreSelectedOptions:()=>MultiAsyncPreSelectedOptions,MultiPreSelectedMultipleOptions:()=>MultiPreSelectedMultipleOptions,MultiPreSelectedOption:()=>MultiPreSelectedOption,MultiStandardOptions:()=>MultiStandardOptions,SingleAsyncOptions:()=>SingleAsyncOptions,SingleError:()=>SingleError,SinglePreSelectedOption:()=>SinglePreSelectedOption,SingleStandardOptions:()=>SingleStandardOptions,__namedExportsOrder:()=>__namedExportsOrder,default:()=>Typeahead_stories,mockLoadOptions:()=>mockLoadOptions});var react=__webpack_require__("./node_modules/react/index.js");var Typeahead=__webpack_require__("./src/client/components/Typeahead/index.jsx");const asyncOptions=[{value:"379f390a-e083-4a2c-9cea-e3b9a08606a7",label:"Holly Clins - Heart of the South West LEP"},{value:"8dcd2bb8-dc73-4a42-8655-4ae42d4d3c5a",label:"Bernard Harris-Patelc - Welsh Government (Investment)"},{value:"a6f39399-5bf4-46cb-a686-826f73e9f0ca",label:"Dennis Kennedy"},{value:"eecd2bb8-dc73-4a42-8655-4ae42d4d3cff",label:"Denzil Lincoln"}],mockLoadOptions=(query="")=>new Promise((resolve=>query&&query.length?setTimeout(resolve,1e3,asyncOptions.filter((({label})=>label.toLowerCase().includes(query.toLowerCase())))):resolve([]))),options=[{value:"0001",label:"Apple"},{value:"0002",label:"Banana"},{value:"0003",label:"Blackberry"},{value:"0004",label:"Blueberry"},{value:"0005",label:"Orange"},{value:"0006",label:"Papaya"},{value:"0007",label:"Passion Fruit"},{value:"0008",label:"Pear"},{value:"0009",label:"Pineapple"},{value:"0010",label:"Prickly Pear That Has a Very Very Long Name"}],Typeahead_stories={title:"Typeahead",excludeStories:["mockLoadOptions"]},DocsPlaceholder=()=>react.createElement("p",null,"This is a workaround to get the DocsPage to work with multiInstance components.");DocsPlaceholder.story={name:"Docs placeholder"};const SingleStandardOptions=()=>react.createElement(Typeahead.A,{name:"singleselect",isMulti:!1,initialOptions:options,placeholder:"Search...",label:"Pick a fruit"});SingleStandardOptions.story={name:"Single - standard options",parameters:{docs:{storyDescription:"This is a new accessible typeahead designed to replace the old typeahead. Typing into the input will filter options - this can be operated in both multi and single select modes. In multi-select mode, the selected options are shown outside of the input box as removable chips.\n\nThis is based on [accessibility research by Microsoft's Sarah Higley](https://www.24a11y.com/2019/select-your-poison-part-2/).\n"}}};const SinglePreSelectedOption=()=>react.createElement(Typeahead.A,{name:"singleselect-pre-select",isMulti:!1,initialOptions:options,placeholder:"Search...",defaultValue:options[2],label:"Pick a fruit"});SinglePreSelectedOption.story={name:"Single - pre-selected option"};const SingleError=()=>react.createElement(Typeahead.A,{name:"singleselect-error",error:!0,isMulti:!1,initialOptions:options,placeholder:"Search...",label:"Pick a fruit"});SingleError.story={name:"Single - error"};const SingleAsyncOptions=()=>react.createElement("div",{style:{width:"600px"}},react.createElement("h2",null,"Search for"),react.createElement("ul",null,react.createElement("li",null,"Bernard"),react.createElement("li",null,"Dennis"),react.createElement("li",null,"Denzil"),react.createElement("li",null,"Holly")),react.createElement(Typeahead.A,{isMulti:!1,name:"singleselect",loadOptions:mockLoadOptions,placeholder:"Search...",label:"Pick an adviser"}));SingleAsyncOptions.story={name:"Single - async options"};const MultiStandardOptions=()=>react.createElement(Typeahead.A,{isMulti:!0,closeMenuOnSelect:!1,name:"multiselect",initialOptions:options,placeholder:"Search...",label:"Pick a fruit"});MultiStandardOptions.story={name:"Multi - standard options"};const MultiPreSelectedOption=()=>react.createElement(Typeahead.A,{isMulti:!0,closeMenuOnSelect:!1,name:"multiselect-pre-select",initialOptions:options,placeholder:"Search...",defaultValue:options[2],label:"Pick a fruit"});MultiPreSelectedOption.story={name:"Multi - pre-selected option"};const MultiPreSelectedMultipleOptions=()=>react.createElement(Typeahead.A,{isMulti:!0,closeMenuOnSelect:!1,name:"multiselect-pre-select-multiple",initialOptions:options,placeholder:"Search...",defaultValue:[options[2],options[0]],label:"Pick a fruit"});MultiPreSelectedMultipleOptions.story={name:"Multi - pre-selected multiple options"};const MultiAsyncOptions=()=>react.createElement("div",{style:{width:"600px"}},react.createElement("h2",null,"Search for"),react.createElement("ul",null,react.createElement("li",null,"Bernard"),react.createElement("li",null,"Dennis"),react.createElement("li",null,"Denzil"),react.createElement("li",null,"Holly")),react.createElement(Typeahead.A,{isMulti:!0,closeMenuOnSelect:!1,name:"multiselect-async",loadOptions:mockLoadOptions,placeholder:"Search advisers...",noOptionsMessage:"No advisers found","aria-label":"search"}));MultiAsyncOptions.story={name:"Multi - async options"};const MultiAsyncPreSelectedOptions=()=>react.createElement("div",{style:{width:"600px"}},react.createElement("h2",null,"Search for"),react.createElement("ul",null,react.createElement("li",null,"Bernard"),react.createElement("li",null,"Dennis"),react.createElement("li",null,"Denzil"),react.createElement("li",null,"Holly")),react.createElement(Typeahead.A,{isMulti:!0,closeMenuOnSelect:!1,name:"multiselect-async",loadOptions:mockLoadOptions,placeholder:"Search advisers...",noOptionsMessage:"No advisers found",defaultValue:[asyncOptions[2],asyncOptions[0]],"aria-label":"search"}));MultiAsyncPreSelectedOptions.story={name:"Multi - async pre-selected options"},DocsPlaceholder.parameters={...DocsPlaceholder.parameters,docs:{...DocsPlaceholder.parameters?.docs,source:{originalSource:"() => \n This is a workaround to get the DocsPage to work with multiInstance\n components.\n
",...DocsPlaceholder.parameters?.docs?.source}}},SingleStandardOptions.parameters={...SingleStandardOptions.parameters,docs:{...SingleStandardOptions.parameters?.docs,source:{originalSource:'() => ',...SingleStandardOptions.parameters?.docs?.source}}},SinglePreSelectedOption.parameters={...SinglePreSelectedOption.parameters,docs:{...SinglePreSelectedOption.parameters?.docs,source:{originalSource:'() => ',...SinglePreSelectedOption.parameters?.docs?.source}}},SingleError.parameters={...SingleError.parameters,docs:{...SingleError.parameters?.docs,source:{originalSource:'() => ',...SingleError.parameters?.docs?.source}}},SingleAsyncOptions.parameters={...SingleAsyncOptions.parameters,docs:{...SingleAsyncOptions.parameters?.docs,source:{originalSource:'() => \n
Search for \n
\n Bernard \n Dennis \n Denzil \n Holly \n \n
\n
',...SingleAsyncOptions.parameters?.docs?.source}}},MultiStandardOptions.parameters={...MultiStandardOptions.parameters,docs:{...MultiStandardOptions.parameters?.docs,source:{originalSource:'() => ',...MultiStandardOptions.parameters?.docs?.source}}},MultiPreSelectedOption.parameters={...MultiPreSelectedOption.parameters,docs:{...MultiPreSelectedOption.parameters?.docs,source:{originalSource:'() => ',...MultiPreSelectedOption.parameters?.docs?.source}}},MultiPreSelectedMultipleOptions.parameters={...MultiPreSelectedMultipleOptions.parameters,docs:{...MultiPreSelectedMultipleOptions.parameters?.docs,source:{originalSource:'() => ',...MultiPreSelectedMultipleOptions.parameters?.docs?.source}}},MultiAsyncOptions.parameters={...MultiAsyncOptions.parameters,docs:{...MultiAsyncOptions.parameters?.docs,source:{originalSource:'() => \n
Search for \n
\n Bernard \n Dennis \n Denzil \n Holly \n \n
\n
',...MultiAsyncOptions.parameters?.docs?.source}}},MultiAsyncPreSelectedOptions.parameters={...MultiAsyncPreSelectedOptions.parameters,docs:{...MultiAsyncPreSelectedOptions.parameters?.docs,source:{originalSource:'() => \n
Search for \n
\n Bernard \n Dennis \n Denzil \n Holly \n \n
\n
',...MultiAsyncPreSelectedOptions.parameters?.docs?.source}}};const __namedExportsOrder=["mockLoadOptions","DocsPlaceholder","SingleStandardOptions","SinglePreSelectedOption","SingleError","SingleAsyncOptions","MultiStandardOptions","MultiPreSelectedOption","MultiPreSelectedMultipleOptions","MultiAsyncOptions","MultiAsyncPreSelectedOptions"]}}]);
\ No newline at end of file
diff --git a/Typeahead-__stories__-Typeahead-stories.b4d40b7c.iframe.bundle.js b/Typeahead-__stories__-Typeahead-stories.b4d40b7c.iframe.bundle.js
deleted file mode 100644
index 633afb7fcb0..00000000000
--- a/Typeahead-__stories__-Typeahead-stories.b4d40b7c.iframe.bundle.js
+++ /dev/null
@@ -1 +0,0 @@
-"use strict";(self.webpackChunkdata_hub_frontend=self.webpackChunkdata_hub_frontend||[]).push([[1310],{"./src/client/components/Typeahead/__stories__/Typeahead.stories.jsx":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.r(__webpack_exports__),__webpack_require__.d(__webpack_exports__,{DocsPlaceholder:()=>DocsPlaceholder,MultiAsyncOptions:()=>MultiAsyncOptions,MultiAsyncPreSelectedOptions:()=>MultiAsyncPreSelectedOptions,MultiPreSelectedMultipleOptions:()=>MultiPreSelectedMultipleOptions,MultiPreSelectedOption:()=>MultiPreSelectedOption,MultiStandardOptions:()=>MultiStandardOptions,SingleAsyncOptions:()=>SingleAsyncOptions,SingleError:()=>SingleError,SinglePreSelectedOption:()=>SinglePreSelectedOption,SingleStandardOptions:()=>SingleStandardOptions,__namedExportsOrder:()=>__namedExportsOrder,default:()=>Typeahead_stories,mockLoadOptions:()=>mockLoadOptions});__webpack_require__("./node_modules/core-js/modules/es.array.filter.js"),__webpack_require__("./node_modules/core-js/modules/es.array.includes.js"),__webpack_require__("./node_modules/core-js/modules/es.object.to-string.js"),__webpack_require__("./node_modules/core-js/modules/es.promise.js"),__webpack_require__("./node_modules/core-js/modules/es.string.includes.js");var react=__webpack_require__("./node_modules/react/index.js");var Typeahead=__webpack_require__("./src/client/components/Typeahead/index.jsx"),asyncOptions=[{value:"379f390a-e083-4a2c-9cea-e3b9a08606a7",label:"Holly Clins - Heart of the South West LEP"},{value:"8dcd2bb8-dc73-4a42-8655-4ae42d4d3c5a",label:"Bernard Harris-Patelc - Welsh Government (Investment)"},{value:"a6f39399-5bf4-46cb-a686-826f73e9f0ca",label:"Dennis Kennedy"},{value:"eecd2bb8-dc73-4a42-8655-4ae42d4d3cff",label:"Denzil Lincoln"}],mockLoadOptions=function mockLoadOptions(){var query=arguments.length>0&&void 0!==arguments[0]?arguments[0]:"";return new Promise((function(resolve){return query&&query.length?setTimeout(resolve,1e3,asyncOptions.filter((function(_ref){return _ref.label.toLowerCase().includes(query.toLowerCase())}))):resolve([])}))},options=[{value:"0001",label:"Apple"},{value:"0002",label:"Banana"},{value:"0003",label:"Blackberry"},{value:"0004",label:"Blueberry"},{value:"0005",label:"Orange"},{value:"0006",label:"Papaya"},{value:"0007",label:"Passion Fruit"},{value:"0008",label:"Pear"},{value:"0009",label:"Pineapple"},{value:"0010",label:"Prickly Pear That Has a Very Very Long Name"}];const Typeahead_stories={title:"Typeahead",excludeStories:["mockLoadOptions"]};var DocsPlaceholder=function DocsPlaceholder(){return react.createElement("p",null,"This is a workaround to get the DocsPage to work with multiInstance components.")};DocsPlaceholder.story={name:"Docs placeholder"};var SingleStandardOptions=function SingleStandardOptions(){return react.createElement(Typeahead.A,{name:"singleselect",isMulti:!1,initialOptions:options,placeholder:"Search...",label:"Pick a fruit"})};SingleStandardOptions.story={name:"Single - standard options",parameters:{docs:{storyDescription:"This is a new accessible typeahead designed to replace the old typeahead. Typing into the input will filter options - this can be operated in both multi and single select modes. In multi-select mode, the selected options are shown outside of the input box as removable chips.\n\nThis is based on [accessibility research by Microsoft's Sarah Higley](https://www.24a11y.com/2019/select-your-poison-part-2/).\n"}}};var SinglePreSelectedOption=function SinglePreSelectedOption(){return react.createElement(Typeahead.A,{name:"singleselect-pre-select",isMulti:!1,initialOptions:options,placeholder:"Search...",defaultValue:options[2],label:"Pick a fruit"})};SinglePreSelectedOption.story={name:"Single - pre-selected option"};var SingleError=function SingleError(){return react.createElement(Typeahead.A,{name:"singleselect-error",error:!0,isMulti:!1,initialOptions:options,placeholder:"Search...",label:"Pick a fruit"})};SingleError.story={name:"Single - error"};var SingleAsyncOptions=function SingleAsyncOptions(){return react.createElement("div",{style:{width:"600px"}},react.createElement("h2",null,"Search for"),react.createElement("ul",null,react.createElement("li",null,"Bernard"),react.createElement("li",null,"Dennis"),react.createElement("li",null,"Denzil"),react.createElement("li",null,"Holly")),react.createElement(Typeahead.A,{isMulti:!1,name:"singleselect",loadOptions:mockLoadOptions,placeholder:"Search...",label:"Pick an adviser"}))};SingleAsyncOptions.story={name:"Single - async options"};var MultiStandardOptions=function MultiStandardOptions(){return react.createElement(Typeahead.A,{isMulti:!0,closeMenuOnSelect:!1,name:"multiselect",initialOptions:options,placeholder:"Search...",label:"Pick a fruit"})};MultiStandardOptions.story={name:"Multi - standard options"};var MultiPreSelectedOption=function MultiPreSelectedOption(){return react.createElement(Typeahead.A,{isMulti:!0,closeMenuOnSelect:!1,name:"multiselect-pre-select",initialOptions:options,placeholder:"Search...",defaultValue:options[2],label:"Pick a fruit"})};MultiPreSelectedOption.story={name:"Multi - pre-selected option"};var MultiPreSelectedMultipleOptions=function MultiPreSelectedMultipleOptions(){return react.createElement(Typeahead.A,{isMulti:!0,closeMenuOnSelect:!1,name:"multiselect-pre-select-multiple",initialOptions:options,placeholder:"Search...",defaultValue:[options[2],options[0]],label:"Pick a fruit"})};MultiPreSelectedMultipleOptions.story={name:"Multi - pre-selected multiple options"};var MultiAsyncOptions=function MultiAsyncOptions(){return react.createElement("div",{style:{width:"600px"}},react.createElement("h2",null,"Search for"),react.createElement("ul",null,react.createElement("li",null,"Bernard"),react.createElement("li",null,"Dennis"),react.createElement("li",null,"Denzil"),react.createElement("li",null,"Holly")),react.createElement(Typeahead.A,{isMulti:!0,closeMenuOnSelect:!1,name:"multiselect-async",loadOptions:mockLoadOptions,placeholder:"Search advisers...",noOptionsMessage:"No advisers found","aria-label":"search"}))};MultiAsyncOptions.story={name:"Multi - async options"};var MultiAsyncPreSelectedOptions=function MultiAsyncPreSelectedOptions(){return react.createElement("div",{style:{width:"600px"}},react.createElement("h2",null,"Search for"),react.createElement("ul",null,react.createElement("li",null,"Bernard"),react.createElement("li",null,"Dennis"),react.createElement("li",null,"Denzil"),react.createElement("li",null,"Holly")),react.createElement(Typeahead.A,{isMulti:!0,closeMenuOnSelect:!1,name:"multiselect-async",loadOptions:mockLoadOptions,placeholder:"Search advisers...",noOptionsMessage:"No advisers found",defaultValue:[asyncOptions[2],asyncOptions[0]],"aria-label":"search"}))};MultiAsyncPreSelectedOptions.story={name:"Multi - async pre-selected options"},DocsPlaceholder.parameters={...DocsPlaceholder.parameters,docs:{...DocsPlaceholder.parameters?.docs,source:{originalSource:"() => \n This is a workaround to get the DocsPage to work with multiInstance\n components.\n
",...DocsPlaceholder.parameters?.docs?.source}}},SingleStandardOptions.parameters={...SingleStandardOptions.parameters,docs:{...SingleStandardOptions.parameters?.docs,source:{originalSource:'() => ',...SingleStandardOptions.parameters?.docs?.source}}},SinglePreSelectedOption.parameters={...SinglePreSelectedOption.parameters,docs:{...SinglePreSelectedOption.parameters?.docs,source:{originalSource:'() => ',...SinglePreSelectedOption.parameters?.docs?.source}}},SingleError.parameters={...SingleError.parameters,docs:{...SingleError.parameters?.docs,source:{originalSource:'() => ',...SingleError.parameters?.docs?.source}}},SingleAsyncOptions.parameters={...SingleAsyncOptions.parameters,docs:{...SingleAsyncOptions.parameters?.docs,source:{originalSource:'() => \n
Search for \n
\n Bernard \n Dennis \n Denzil \n Holly \n \n
\n
',...SingleAsyncOptions.parameters?.docs?.source}}},MultiStandardOptions.parameters={...MultiStandardOptions.parameters,docs:{...MultiStandardOptions.parameters?.docs,source:{originalSource:'() => ',...MultiStandardOptions.parameters?.docs?.source}}},MultiPreSelectedOption.parameters={...MultiPreSelectedOption.parameters,docs:{...MultiPreSelectedOption.parameters?.docs,source:{originalSource:'() => ',...MultiPreSelectedOption.parameters?.docs?.source}}},MultiPreSelectedMultipleOptions.parameters={...MultiPreSelectedMultipleOptions.parameters,docs:{...MultiPreSelectedMultipleOptions.parameters?.docs,source:{originalSource:'() => ',...MultiPreSelectedMultipleOptions.parameters?.docs?.source}}},MultiAsyncOptions.parameters={...MultiAsyncOptions.parameters,docs:{...MultiAsyncOptions.parameters?.docs,source:{originalSource:'() => \n
Search for \n
\n Bernard \n Dennis \n Denzil \n Holly \n \n
\n
',...MultiAsyncOptions.parameters?.docs?.source}}},MultiAsyncPreSelectedOptions.parameters={...MultiAsyncPreSelectedOptions.parameters,docs:{...MultiAsyncPreSelectedOptions.parameters?.docs,source:{originalSource:'() => \n
Search for \n
\n Bernard \n Dennis \n Denzil \n Holly \n \n
\n
',...MultiAsyncPreSelectedOptions.parameters?.docs?.source}}};const __namedExportsOrder=["mockLoadOptions","DocsPlaceholder","SingleStandardOptions","SinglePreSelectedOption","SingleError","SingleAsyncOptions","MultiStandardOptions","MultiPreSelectedOption","MultiPreSelectedMultipleOptions","MultiAsyncOptions","MultiAsyncPreSelectedOptions"]}}]);
\ No newline at end of file
diff --git a/favicon.svg b/favicon.svg
index 684ddb27457..571f90fe99a 100644
--- a/favicon.svg
+++ b/favicon.svg
@@ -1,7 +1 @@
-
-
-
-
-
-
-
\ No newline at end of file
+
\ No newline at end of file
diff --git a/iframe.html b/iframe.html
index a720b9677e9..e976f1b0154 100644
--- a/iframe.html
+++ b/iframe.html
@@ -474,8 +474,8 @@
window['TAGS_OPTIONS'] = {"dev-only":{"excludeFromDocsStories":true},"docs-only":{"excludeFromSidebar":true},"test-only":{"excludeFromSidebar":true,"excludeFromDocsStories":true}};