@hmcts/rpx-xui-common-lib 3.0.4 → 3.0.15-alpha-4

package/{fesm2022 → fesm2020}/hmcts-rpx-xui-common-lib.mjs

@@ -21,15 +21,17 @@ import { MatLegacyAutocompleteModule } from '@angular/material/legacy-autocomple
 import * as i5 from '@angular/material/legacy-core';
 import * as i2$4 from '@angular/material/legacy-tabs';
 import { MatLegacyTabsModule } from '@angular/material/legacy-tabs';
+import * as i4$1 from 'ngx-pagination';
+import { NgxPaginationModule, PaginatePipe } from 'ngx-pagination';
 import { MatLegacyInputModule } from '@angular/material/legacy-input';
 
 class AccessibilityComponent {
     constructor() {
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: AccessibilityComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.7", type: AccessibilityComponent, selector: "xuilib-accessibility", ngImport: i0, template: "<h1 class=\"govuk-heading-xl\" id=\"Accessibility-statement-for-Expert-UI\">Accessibility statement for Expert UI</h1>\n\n<ul class=\"govuk-list\">\n  <li><a href=\"accessibility#immigration\">Immigration and Asylum</a></li>\n  <li><a href=\"accessibility#family\">Family Public Law </a></li>\n</ul>\n\n<p class=\"govuk-body\">This website is run by HM Courts & Tribunals Service. We want as many people as possible to be\n  able to use this website. For example, you should be able to:</p>\n\n<ul class=\"govuk-list govuk-list--bullet\">\n  <li>change colours, contrast levels and fonts</li>\n  <li>zoom in up to 300% without the text spilling off the screen</li>\n  <li>navigate most of the website using just a keyboard</li>\n  <li>navigate most of the website using speech recognition software</li>\n  <li>listen to most of the website using a screen reader (including the most recent versions of JAWS, NVDA and\n    VoiceOver)\n  </li>\n</ul>\n\n<p class=\"govuk-body\">We\u2019ve also made the website text as simple as possible to understand.</p>\n\n<p class=\"govuk-body\"><a rel=\"noopener noreferrer\" target=\"_blank\" href=\"https://mcmw.abilitynet.org.uk/\">AbilityNet</a>\n  has advice on making your device easier to use if you have a disability.</p>\n\n<h2 class=\"govuk-heading-l\" id=\"How-accessible-this-website-is\">How accessible this website is</h2>\n\n<p class=\"govuk-body\">We know some parts of the website are not fully accessible:</p>\n\n<ul class=\"govuk-list govuk-list--bullet\">\n  <li>some pages are difficult to navigate using just a keyboard</li>\n  <li>some pages can\u2019t be listened to in full using a screen reader</li>\n  <li>some pages have problems with colour contrasts between text and background</li>\n  <li>some PDFs may not be fully accessible to a screen reader</li>\n</ul>\n\n<h2 class=\"govuk-heading-l\" id=\"What-to-do-if-you-cannot-access-parts-of-this-website\">Feedback and contact\n  information</h2>\n\n<p class=\"govuk-body\">If you need information on this website in a different format like accessible PDF, large print,\n  easy read, audio recording or braille, you can:</p>\n\n<ul class=\"govuk-list govuk-list--bullet\">\n  <li>email: <a href=\"mailto:HMCTSforms@justice.gov.uk\"> HMCTSforms@justice.gov.uk</a></li>\n  <li>call: +44 (0) 300 123 1711</li>\n  <li>contact your service representative</li>\n</ul>\n\n<p class=\"govuk-body\">We\u2019ll consider your request and get back to you in 10 working days.</p>\n\n<h2 class=\"govuk-heading-l\" id=\"Reporting-accessibility-problems-with-this-website\">Reporting accessibility problems\n  with this website</h2>\n\n<p class=\"govuk-body\">We\u2019re always looking to improve the accessibility of this website. If you find any problems not\n  listed on this page or think we\u2019re not meeting accessibility requirements, contact:</p>\n\n<ul class=\"govuk-list govuk-list--bullet\">\n  <li>email: <a href=\"mailto:customer.service@justice.gov.uk\"> customer.service@justice.gov.uk</a></li>\n  <li>telephone: +44 (0) 300 123 1711</li>\n</ul>\n\n<h2 class=\"govuk-heading-l\" id=\"Enforcement-procedure \">Enforcement procedure</h2>\n\n<p class=\"govuk-body\">The Equality and Human Rights Commission (EHRC) is responsible for enforcing the Public Sector\n  Bodies (Websites and Mobile Applications) (No. 2) Accessibility Regulations 2018 (the \u2018accessibility\n  regulations\u2019). </p>\n\n<p class=\"govuk-body\">If you\u2019re not happy with how we respond to your complaint, <a rel=\"noopener noreferrer\"\n                                                                                    target=\"_blank\"\n                                                                                    href=\"https://www.equalityadvisoryservice.com/\">contact\n  the Equality Advisory and Support Service (EASS).</a></p>\n\n<h1 class=\"govuk-heading-l\" id=\"Contacting-us-by-phone-or-visiting-us-in-person\">Contacting us by phone or visiting us\n  in person</h1>\n\n<p class=\"govuk-body\">We provide a text relay service for people who are D/deaf, hearing impaired or have a speech\n  impediment.</p>\n\n<p class=\"govuk-body\">Our offices and tribunal venues have audio induction loops, or if you contact us before your visit\n  we can arrange a British Sign Language (BSL) interpreter. You can also request step-free access or a foreign language\n  interpreter.</p>\n\n<p class=\"govuk-body\">If you have a question about accessibility in our Tribunal venues, you can contact the First-tier\n  Tribunal enquiry line: +44 (0) 300 123 1711. You can <a target=\"_blank\"\n                                                          href=\"https://courttribunalfinder.service.gov.uk/search/\">find\n    the contact details for court and tribunal venues</a>. </p>\n\n<p class=\"govuk-body\">You can also contact your service representative for more information.</p>\n\n<h1 class=\"govuk-heading-l\" id=\"Technical-information-about-this-website\u2019s-accessibility\">Technical information about\n  this website\u2019s accessibility</h1>\n\n<p class=\"govuk-body\">HMCTS is committed to making its website accessible, in accordance with the Public Sector Bodies\n  (Websites and Mobile Applications) (No.2) Accessibility Regulations 2018.</p>\n\n<p class=\"govuk-body\">This website is partially compliant with the <a rel=\"noopener noreferrer\" target=\"_blank\"\n                                                                      href=\"https://www.w3.org/TR/WCAG21/\">Web Content\n  Accessibility Guidelines version 2.1</a>, due to the non-compliances listed below.</p>\n\n<h1 class=\"govuk-heading-l\" id=\"Non-accessible-content\">Non-accessible content </h1>\n\n<p class=\"govuk-body\">The content listed below is non-compliant for the following reasons.</p>\n\n<h2 class=\"govuk-heading-l\" id=\"Non-compliance-with-the-accessibility-regulations\">Non-compliance with the accessibility\n  regulations</h2>\n\n<p class=\"govuk-body\">Some pages cannot be navigated completely using just a keyboard, so some people won\u2019t be able to\n  tab through the pages. This fails WCAG 2.1 success criterion 2.1 (keyboard accessible).</p>\n\n<p class=\"govuk-body\">Some pages can\u2019t be listened to in full using a screen reader, so some people won\u2019t be able to\n  access the information. This fails WCAG 2.1 success criterion 1.2.5 (audio description \u2013 prerecorded).</p>\n\n<p class=\"govuk-body\">Some of the contrast ratios don\u2019t meet the current accessibility requirements. This fails WCAG 2.1\n  success criterion 1.4.3 (contrast \u2013 minimum).</p>\n\n<h3 class=\"govuk-heading-m\" id=\"immigration\">Immigration and Asylum</h3>\n\n<p class=\"govuk-body\">Some of the images on the service include text and are not accessible for some low vision users.\n  We have identified a solution for this issue that we will implement as soon as possible.</p>\n\n<h3 class=\"govuk-heading-m\" id=\"family\">Family Public Law </h3>\n\n<ol class=\"govuk-list govuk-list--alpha\">\n  <li>The navigation system used in family public law cannot be rendered well by screen readers, so features can\u2019t be\n    listened to in full\n  </li>\n  <li>Some essential functions within the family public law digital service cannot be accessed properly using screen\n    readers\n  </li>\n  <li>Some complex forms within the service will not be rendered correctly or cannot be listened to by screen readers\n  </li>\n</ol>\n\n<h2 class=\"govuk-heading-m\" id=\"Disproportionate burden \">Disproportionate burden </h2>\n\n<p class=\"govuk-body\">For Manage organisation, Register organisation, Approve organisations and Manage cases, we found\n  the following issues that are currently being triaged to find out if there is a disproportionate burden:</p>\n\n<ol class=\"govuk-list govuk-list--alpha\">\n  <li>Screen readers can\u2019t switch between headers, read content in tabs and buttons</li>\n  <li>Screen readers can\u2019t tab between radio buttons, read links or content</li>\n  <li>Colour contrast ratios uneven between page background and content</li>\n  <li>Some labels, fields, error messages and other content can\u2019t be clearly identified by screen readers and voice\n    activation software\n  </li>\n  <li>Some page headings and titles don\u2019t follow a logical structure for screen readers</li>\n  <li>The navigation of some pages isn\u2019t clear</li>\n  <li>Some headings, links and button labels aren\u2019t clearly descriptive</li>\n</ol>\n\n<h2 class=\"govuk-heading-m\" id=\"Content-that\u2019s-not-within-the-scope-of-the-accessibility-regulations\">Content that\u2019s not\n  within the scope of the accessibility regulations </h2>\n\n<p class=\"govuk-body\">PDFs, documents and attachments to email notifications published before 23 September 2018 may not\n  meet accessibility standards. For example, they may not be structured so they\u2019re accessible to a screen reader.</p>\n\n<p class=\"govuk-body\">Any new PDFs or Word documents we publish will meet accessibility standards.</p>\n\n<h1 class=\"govuk-heading-l\" id=\"what-to-improve-accessibility\">What we\u2019re doing to improve accessibility</h1>\n\n<p class=\"govuk-body\">We\u2019re committed to ensuring our services are accessible to all our users and that they comply with\n  level AA of the Web Content Accessibility Guidelines \u2013 WCAG 2.1.</p>\n\n<p class=\"govuk-body\">We\u2019re actively working to improve the identified issues and make them AA-compliant by 23 September\n  2020. We\u2019re also continuing to improve all other AAA-level accessibility issues as we iterate the service.</p>\n\n<h1 class=\"govuk-heading-l\" id=\"preparation-of-this-accessibility-statement\">Preparation of this accessibility\n  statement</h1>\n\n<p class=\"govuk-body\">This statement was prepared on 16 September 2019. It was last reviewed on 16 September 2020.</p>\n\n<p class=\"govuk-body\">This website was last tested on 19 May 2020. The test was carried out by the <a target=\"_blank\"\n                                                                                                      href=\"https://digitalaccessibilitycentre.org/\">Digital\n  Accessibility Centre (DAC)</a>.</p>\n\n<h3 class=\"govuk-heading-m\">Family Private Law:</h3>\n\n<p class=\"govuk-body\">This service has not yet been tested for accessibility issues. In the future, we will conduct an\n  accessibility audit in order to find out if there are any accessibility issues. The accessibility statement will be\n  updated with any relevant changes that we find.</p>\n\n<p class=\"govuk-body\">If there are any issues with accessing information or using this website please contact:</p>\n\n<ol class=\"govuk-list govuk-list--bullet\">\n  <li>Nicola Whitcher - 02380 384324</li>\n  <li>Hannah Townley - 02380 384313</li>\n</ol>", styles: [".govuk-list--alpha{padding-left:20px;list-style-type:lower-alpha}\n"] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: AccessibilityComponent, decorators: [{
+AccessibilityComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: AccessibilityComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+AccessibilityComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: AccessibilityComponent, selector: "xuilib-accessibility", ngImport: i0, template: "<h1 class=\"govuk-heading-xl\" id=\"Accessibility-statement-for-Expert-UI\">Accessibility statement for Expert UI</h1>\n\n<ul class=\"govuk-list\">\n  <li><a href=\"accessibility#immigration\">Immigration and Asylum</a></li>\n  <li><a href=\"accessibility#family\">Family Public Law </a></li>\n</ul>\n\n<p class=\"govuk-body\">This website is run by HM Courts & Tribunals Service. We want as many people as possible to be\n  able to use this website. For example, you should be able to:</p>\n\n<ul class=\"govuk-list govuk-list--bullet\">\n  <li>change colours, contrast levels and fonts</li>\n  <li>zoom in up to 300% without the text spilling off the screen</li>\n  <li>navigate most of the website using just a keyboard</li>\n  <li>navigate most of the website using speech recognition software</li>\n  <li>listen to most of the website using a screen reader (including the most recent versions of JAWS, NVDA and\n    VoiceOver)\n  </li>\n</ul>\n\n<p class=\"govuk-body\">We\u2019ve also made the website text as simple as possible to understand.</p>\n\n<p class=\"govuk-body\"><a rel=\"noopener noreferrer\" target=\"_blank\" href=\"https://mcmw.abilitynet.org.uk/\">AbilityNet</a>\n  has advice on making your device easier to use if you have a disability.</p>\n\n<h2 class=\"govuk-heading-l\" id=\"How-accessible-this-website-is\">How accessible this website is</h2>\n\n<p class=\"govuk-body\">We know some parts of the website are not fully accessible:</p>\n\n<ul class=\"govuk-list govuk-list--bullet\">\n  <li>some pages are difficult to navigate using just a keyboard</li>\n  <li>some pages can\u2019t be listened to in full using a screen reader</li>\n  <li>some pages have problems with colour contrasts between text and background</li>\n  <li>some PDFs may not be fully accessible to a screen reader</li>\n</ul>\n\n<h2 class=\"govuk-heading-l\" id=\"What-to-do-if-you-cannot-access-parts-of-this-website\">Feedback and contact\n  information</h2>\n\n<p class=\"govuk-body\">If you need information on this website in a different format like accessible PDF, large print,\n  easy read, audio recording or braille, you can:</p>\n\n<ul class=\"govuk-list govuk-list--bullet\">\n  <li>email: <a href=\"mailto:HMCTSforms@justice.gov.uk\"> HMCTSforms@justice.gov.uk</a></li>\n  <li>call: +44 (0) 300 123 1711</li>\n  <li>contact your service representative</li>\n</ul>\n\n<p class=\"govuk-body\">We\u2019ll consider your request and get back to you in 10 working days.</p>\n\n<h2 class=\"govuk-heading-l\" id=\"Reporting-accessibility-problems-with-this-website\">Reporting accessibility problems\n  with this website</h2>\n\n<p class=\"govuk-body\">We\u2019re always looking to improve the accessibility of this website. If you find any problems not\n  listed on this page or think we\u2019re not meeting accessibility requirements, contact:</p>\n\n<ul class=\"govuk-list govuk-list--bullet\">\n  <li>email: <a href=\"mailto:customer.service@justice.gov.uk\"> customer.service@justice.gov.uk</a></li>\n  <li>telephone: +44 (0) 300 123 1711</li>\n</ul>\n\n<h2 class=\"govuk-heading-l\" id=\"Enforcement-procedure \">Enforcement procedure</h2>\n\n<p class=\"govuk-body\">The Equality and Human Rights Commission (EHRC) is responsible for enforcing the Public Sector\n  Bodies (Websites and Mobile Applications) (No. 2) Accessibility Regulations 2018 (the \u2018accessibility\n  regulations\u2019). </p>\n\n<p class=\"govuk-body\">If you\u2019re not happy with how we respond to your complaint, <a rel=\"noopener noreferrer\"\n                                                                                    target=\"_blank\"\n                                                                                    href=\"https://www.equalityadvisoryservice.com/\">contact\n  the Equality Advisory and Support Service (EASS).</a></p>\n\n<h1 class=\"govuk-heading-l\" id=\"Contacting-us-by-phone-or-visiting-us-in-person\">Contacting us by phone or visiting us\n  in person</h1>\n\n<p class=\"govuk-body\">We provide a text relay service for people who are D/deaf, hearing impaired or have a speech\n  impediment.</p>\n\n<p class=\"govuk-body\">Our offices and tribunal venues have audio induction loops, or if you contact us before your visit\n  we can arrange a British Sign Language (BSL) interpreter. You can also request step-free access or a foreign language\n  interpreter.</p>\n\n<p class=\"govuk-body\">If you have a question about accessibility in our Tribunal venues, you can contact the First-tier\n  Tribunal enquiry line: +44 (0) 300 123 1711. You can <a target=\"_blank\"\n                                                          href=\"https://courttribunalfinder.service.gov.uk/search/\">find\n    the contact details for court and tribunal venues</a>. </p>\n\n<p class=\"govuk-body\">You can also contact your service representative for more information.</p>\n\n<h1 class=\"govuk-heading-l\" id=\"Technical-information-about-this-website\u2019s-accessibility\">Technical information about\n  this website\u2019s accessibility</h1>\n\n<p class=\"govuk-body\">HMCTS is committed to making its website accessible, in accordance with the Public Sector Bodies\n  (Websites and Mobile Applications) (No.2) Accessibility Regulations 2018.</p>\n\n<p class=\"govuk-body\">This website is partially compliant with the <a rel=\"noopener noreferrer\" target=\"_blank\"\n                                                                      href=\"https://www.w3.org/TR/WCAG21/\">Web Content\n  Accessibility Guidelines version 2.1</a>, due to the non-compliances listed below.</p>\n\n<h1 class=\"govuk-heading-l\" id=\"Non-accessible-content\">Non-accessible content </h1>\n\n<p class=\"govuk-body\">The content listed below is non-compliant for the following reasons.</p>\n\n<h2 class=\"govuk-heading-l\" id=\"Non-compliance-with-the-accessibility-regulations\">Non-compliance with the accessibility\n  regulations</h2>\n\n<p class=\"govuk-body\">Some pages cannot be navigated completely using just a keyboard, so some people won\u2019t be able to\n  tab through the pages. This fails WCAG 2.1 success criterion 2.1 (keyboard accessible).</p>\n\n<p class=\"govuk-body\">Some pages can\u2019t be listened to in full using a screen reader, so some people won\u2019t be able to\n  access the information. This fails WCAG 2.1 success criterion 1.2.5 (audio description \u2013 prerecorded).</p>\n\n<p class=\"govuk-body\">Some of the contrast ratios don\u2019t meet the current accessibility requirements. This fails WCAG 2.1\n  success criterion 1.4.3 (contrast \u2013 minimum).</p>\n\n<h3 class=\"govuk-heading-m\" id=\"immigration\">Immigration and Asylum</h3>\n\n<p class=\"govuk-body\">Some of the images on the service include text and are not accessible for some low vision users.\n  We have identified a solution for this issue that we will implement as soon as possible.</p>\n\n<h3 class=\"govuk-heading-m\" id=\"family\">Family Public Law </h3>\n\n<ol class=\"govuk-list govuk-list--alpha\">\n  <li>The navigation system used in family public law cannot be rendered well by screen readers, so features can\u2019t be\n    listened to in full\n  </li>\n  <li>Some essential functions within the family public law digital service cannot be accessed properly using screen\n    readers\n  </li>\n  <li>Some complex forms within the service will not be rendered correctly or cannot be listened to by screen readers\n  </li>\n</ol>\n\n<h2 class=\"govuk-heading-m\" id=\"Disproportionate burden \">Disproportionate burden </h2>\n\n<p class=\"govuk-body\">For Manage organisation, Register organisation, Approve organisations and Manage cases, we found\n  the following issues that are currently being triaged to find out if there is a disproportionate burden:</p>\n\n<ol class=\"govuk-list govuk-list--alpha\">\n  <li>Screen readers can\u2019t switch between headers, read content in tabs and buttons</li>\n  <li>Screen readers can\u2019t tab between radio buttons, read links or content</li>\n  <li>Colour contrast ratios uneven between page background and content</li>\n  <li>Some labels, fields, error messages and other content can\u2019t be clearly identified by screen readers and voice\n    activation software\n  </li>\n  <li>Some page headings and titles don\u2019t follow a logical structure for screen readers</li>\n  <li>The navigation of some pages isn\u2019t clear</li>\n  <li>Some headings, links and button labels aren\u2019t clearly descriptive</li>\n</ol>\n\n<h2 class=\"govuk-heading-m\" id=\"Content-that\u2019s-not-within-the-scope-of-the-accessibility-regulations\">Content that\u2019s not\n  within the scope of the accessibility regulations </h2>\n\n<p class=\"govuk-body\">PDFs, documents and attachments to email notifications published before 23 September 2018 may not\n  meet accessibility standards. For example, they may not be structured so they\u2019re accessible to a screen reader.</p>\n\n<p class=\"govuk-body\">Any new PDFs or Word documents we publish will meet accessibility standards.</p>\n\n<h1 class=\"govuk-heading-l\" id=\"what-to-improve-accessibility\">What we\u2019re doing to improve accessibility</h1>\n\n<p class=\"govuk-body\">We\u2019re committed to ensuring our services are accessible to all our users and that they comply with\n  level AA of the Web Content Accessibility Guidelines \u2013 WCAG 2.1.</p>\n\n<p class=\"govuk-body\">We\u2019re actively working to improve the identified issues and make them AA-compliant by 23 September\n  2020. We\u2019re also continuing to improve all other AAA-level accessibility issues as we iterate the service.</p>\n\n<h1 class=\"govuk-heading-l\" id=\"preparation-of-this-accessibility-statement\">Preparation of this accessibility\n  statement</h1>\n\n<p class=\"govuk-body\">This statement was prepared on 16 September 2019. It was last reviewed on 16 September 2020.</p>\n\n<p class=\"govuk-body\">This website was last tested on 19 May 2020. The test was carried out by the <a target=\"_blank\"\n                                                                                                      href=\"https://digitalaccessibilitycentre.org/\">Digital\n  Accessibility Centre (DAC)</a>.</p>\n\n<h3 class=\"govuk-heading-m\">Family Private Law:</h3>\n\n<p class=\"govuk-body\">This service has not yet been tested for accessibility issues. In the future, we will conduct an\n  accessibility audit in order to find out if there are any accessibility issues. The accessibility statement will be\n  updated with any relevant changes that we find.</p>\n\n<p class=\"govuk-body\">If there are any issues with accessing information or using this website please contact:</p>\n\n<ol class=\"govuk-list govuk-list--bullet\">\n  <li>Nicola Whitcher - 02380 384324</li>\n  <li>Hannah Townley - 02380 384313</li>\n</ol>", styles: [".govuk-list--alpha{padding-left:20px;list-style-type:lower-alpha}\n"] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: AccessibilityComponent, decorators: [{
             type: Component,
             args: [{ selector: 'xuilib-accessibility', template: "<h1 class=\"govuk-heading-xl\" id=\"Accessibility-statement-for-Expert-UI\">Accessibility statement for Expert UI</h1>\n\n<ul class=\"govuk-list\">\n  <li><a href=\"accessibility#immigration\">Immigration and Asylum</a></li>\n  <li><a href=\"accessibility#family\">Family Public Law </a></li>\n</ul>\n\n<p class=\"govuk-body\">This website is run by HM Courts & Tribunals Service. We want as many people as possible to be\n  able to use this website. For example, you should be able to:</p>\n\n<ul class=\"govuk-list govuk-list--bullet\">\n  <li>change colours, contrast levels and fonts</li>\n  <li>zoom in up to 300% without the text spilling off the screen</li>\n  <li>navigate most of the website using just a keyboard</li>\n  <li>navigate most of the website using speech recognition software</li>\n  <li>listen to most of the website using a screen reader (including the most recent versions of JAWS, NVDA and\n    VoiceOver)\n  </li>\n</ul>\n\n<p class=\"govuk-body\">We\u2019ve also made the website text as simple as possible to understand.</p>\n\n<p class=\"govuk-body\"><a rel=\"noopener noreferrer\" target=\"_blank\" href=\"https://mcmw.abilitynet.org.uk/\">AbilityNet</a>\n  has advice on making your device easier to use if you have a disability.</p>\n\n<h2 class=\"govuk-heading-l\" id=\"How-accessible-this-website-is\">How accessible this website is</h2>\n\n<p class=\"govuk-body\">We know some parts of the website are not fully accessible:</p>\n\n<ul class=\"govuk-list govuk-list--bullet\">\n  <li>some pages are difficult to navigate using just a keyboard</li>\n  <li>some pages can\u2019t be listened to in full using a screen reader</li>\n  <li>some pages have problems with colour contrasts between text and background</li>\n  <li>some PDFs may not be fully accessible to a screen reader</li>\n</ul>\n\n<h2 class=\"govuk-heading-l\" id=\"What-to-do-if-you-cannot-access-parts-of-this-website\">Feedback and contact\n  information</h2>\n\n<p class=\"govuk-body\">If you need information on this website in a different format like accessible PDF, large print,\n  easy read, audio recording or braille, you can:</p>\n\n<ul class=\"govuk-list govuk-list--bullet\">\n  <li>email: <a href=\"mailto:HMCTSforms@justice.gov.uk\"> HMCTSforms@justice.gov.uk</a></li>\n  <li>call: +44 (0) 300 123 1711</li>\n  <li>contact your service representative</li>\n</ul>\n\n<p class=\"govuk-body\">We\u2019ll consider your request and get back to you in 10 working days.</p>\n\n<h2 class=\"govuk-heading-l\" id=\"Reporting-accessibility-problems-with-this-website\">Reporting accessibility problems\n  with this website</h2>\n\n<p class=\"govuk-body\">We\u2019re always looking to improve the accessibility of this website. If you find any problems not\n  listed on this page or think we\u2019re not meeting accessibility requirements, contact:</p>\n\n<ul class=\"govuk-list govuk-list--bullet\">\n  <li>email: <a href=\"mailto:customer.service@justice.gov.uk\"> customer.service@justice.gov.uk</a></li>\n  <li>telephone: +44 (0) 300 123 1711</li>\n</ul>\n\n<h2 class=\"govuk-heading-l\" id=\"Enforcement-procedure \">Enforcement procedure</h2>\n\n<p class=\"govuk-body\">The Equality and Human Rights Commission (EHRC) is responsible for enforcing the Public Sector\n  Bodies (Websites and Mobile Applications) (No. 2) Accessibility Regulations 2018 (the \u2018accessibility\n  regulations\u2019). </p>\n\n<p class=\"govuk-body\">If you\u2019re not happy with how we respond to your complaint, <a rel=\"noopener noreferrer\"\n                                                                                    target=\"_blank\"\n                                                                                    href=\"https://www.equalityadvisoryservice.com/\">contact\n  the Equality Advisory and Support Service (EASS).</a></p>\n\n<h1 class=\"govuk-heading-l\" id=\"Contacting-us-by-phone-or-visiting-us-in-person\">Contacting us by phone or visiting us\n  in person</h1>\n\n<p class=\"govuk-body\">We provide a text relay service for people who are D/deaf, hearing impaired or have a speech\n  impediment.</p>\n\n<p class=\"govuk-body\">Our offices and tribunal venues have audio induction loops, or if you contact us before your visit\n  we can arrange a British Sign Language (BSL) interpreter. You can also request step-free access or a foreign language\n  interpreter.</p>\n\n<p class=\"govuk-body\">If you have a question about accessibility in our Tribunal venues, you can contact the First-tier\n  Tribunal enquiry line: +44 (0) 300 123 1711. You can <a target=\"_blank\"\n                                                          href=\"https://courttribunalfinder.service.gov.uk/search/\">find\n    the contact details for court and tribunal venues</a>. </p>\n\n<p class=\"govuk-body\">You can also contact your service representative for more information.</p>\n\n<h1 class=\"govuk-heading-l\" id=\"Technical-information-about-this-website\u2019s-accessibility\">Technical information about\n  this website\u2019s accessibility</h1>\n\n<p class=\"govuk-body\">HMCTS is committed to making its website accessible, in accordance with the Public Sector Bodies\n  (Websites and Mobile Applications) (No.2) Accessibility Regulations 2018.</p>\n\n<p class=\"govuk-body\">This website is partially compliant with the <a rel=\"noopener noreferrer\" target=\"_blank\"\n                                                                      href=\"https://www.w3.org/TR/WCAG21/\">Web Content\n  Accessibility Guidelines version 2.1</a>, due to the non-compliances listed below.</p>\n\n<h1 class=\"govuk-heading-l\" id=\"Non-accessible-content\">Non-accessible content </h1>\n\n<p class=\"govuk-body\">The content listed below is non-compliant for the following reasons.</p>\n\n<h2 class=\"govuk-heading-l\" id=\"Non-compliance-with-the-accessibility-regulations\">Non-compliance with the accessibility\n  regulations</h2>\n\n<p class=\"govuk-body\">Some pages cannot be navigated completely using just a keyboard, so some people won\u2019t be able to\n  tab through the pages. This fails WCAG 2.1 success criterion 2.1 (keyboard accessible).</p>\n\n<p class=\"govuk-body\">Some pages can\u2019t be listened to in full using a screen reader, so some people won\u2019t be able to\n  access the information. This fails WCAG 2.1 success criterion 1.2.5 (audio description \u2013 prerecorded).</p>\n\n<p class=\"govuk-body\">Some of the contrast ratios don\u2019t meet the current accessibility requirements. This fails WCAG 2.1\n  success criterion 1.4.3 (contrast \u2013 minimum).</p>\n\n<h3 class=\"govuk-heading-m\" id=\"immigration\">Immigration and Asylum</h3>\n\n<p class=\"govuk-body\">Some of the images on the service include text and are not accessible for some low vision users.\n  We have identified a solution for this issue that we will implement as soon as possible.</p>\n\n<h3 class=\"govuk-heading-m\" id=\"family\">Family Public Law </h3>\n\n<ol class=\"govuk-list govuk-list--alpha\">\n  <li>The navigation system used in family public law cannot be rendered well by screen readers, so features can\u2019t be\n    listened to in full\n  </li>\n  <li>Some essential functions within the family public law digital service cannot be accessed properly using screen\n    readers\n  </li>\n  <li>Some complex forms within the service will not be rendered correctly or cannot be listened to by screen readers\n  </li>\n</ol>\n\n<h2 class=\"govuk-heading-m\" id=\"Disproportionate burden \">Disproportionate burden </h2>\n\n<p class=\"govuk-body\">For Manage organisation, Register organisation, Approve organisations and Manage cases, we found\n  the following issues that are currently being triaged to find out if there is a disproportionate burden:</p>\n\n<ol class=\"govuk-list govuk-list--alpha\">\n  <li>Screen readers can\u2019t switch between headers, read content in tabs and buttons</li>\n  <li>Screen readers can\u2019t tab between radio buttons, read links or content</li>\n  <li>Colour contrast ratios uneven between page background and content</li>\n  <li>Some labels, fields, error messages and other content can\u2019t be clearly identified by screen readers and voice\n    activation software\n  </li>\n  <li>Some page headings and titles don\u2019t follow a logical structure for screen readers</li>\n  <li>The navigation of some pages isn\u2019t clear</li>\n  <li>Some headings, links and button labels aren\u2019t clearly descriptive</li>\n</ol>\n\n<h2 class=\"govuk-heading-m\" id=\"Content-that\u2019s-not-within-the-scope-of-the-accessibility-regulations\">Content that\u2019s not\n  within the scope of the accessibility regulations </h2>\n\n<p class=\"govuk-body\">PDFs, documents and attachments to email notifications published before 23 September 2018 may not\n  meet accessibility standards. For example, they may not be structured so they\u2019re accessible to a screen reader.</p>\n\n<p class=\"govuk-body\">Any new PDFs or Word documents we publish will meet accessibility standards.</p>\n\n<h1 class=\"govuk-heading-l\" id=\"what-to-improve-accessibility\">What we\u2019re doing to improve accessibility</h1>\n\n<p class=\"govuk-body\">We\u2019re committed to ensuring our services are accessible to all our users and that they comply with\n  level AA of the Web Content Accessibility Guidelines \u2013 WCAG 2.1.</p>\n\n<p class=\"govuk-body\">We\u2019re actively working to improve the identified issues and make them AA-compliant by 23 September\n  2020. We\u2019re also continuing to improve all other AAA-level accessibility issues as we iterate the service.</p>\n\n<h1 class=\"govuk-heading-l\" id=\"preparation-of-this-accessibility-statement\">Preparation of this accessibility\n  statement</h1>\n\n<p class=\"govuk-body\">This statement was prepared on 16 September 2019. It was last reviewed on 16 September 2020.</p>\n\n<p class=\"govuk-body\">This website was last tested on 19 May 2020. The test was carried out by the <a target=\"_blank\"\n                                                                                                      href=\"https://digitalaccessibilitycentre.org/\">Digital\n  Accessibility Centre (DAC)</a>.</p>\n\n<h3 class=\"govuk-heading-m\">Family Private Law:</h3>\n\n<p class=\"govuk-body\">This service has not yet been tested for accessibility issues. In the future, we will conduct an\n  accessibility audit in order to find out if there are any accessibility issues. The accessibility statement will be\n  updated with any relevant changes that we find.</p>\n\n<p class=\"govuk-body\">If there are any issues with accessing information or using this website please contact:</p>\n\n<ol class=\"govuk-list govuk-list--bullet\">\n  <li>Nicola Whitcher - 02380 384324</li>\n  <li>Hannah Townley - 02380 384313</li>\n</ol>", styles: [".govuk-list--alpha{padding-left:20px;list-style-type:lower-alpha}\n"] }]
         }], ctorParameters: function () { return []; } });
@@ -193,10 +195,10 @@ class CheckboxListComponent {
             }
         }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: CheckboxListComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.7", type: CheckboxListComponent, selector: "xuilib-checkbox-list", inputs: { options: "options", preselection: "preselection", labelFunction: "labelFunction", selection: "selection" }, outputs: { selectionChange: "selectionChange" }, usesOnChanges: true, ngImport: i0, template: "<div class=\"xui-checkbox-list govuk-checkboxes govuk-checkboxes--small\" *ngIf=\"isFunctional\">\n  <div class=\"select-all govuk-checkboxes__item\">\n    <input type=\"checkbox\" id=\"select_all\" class=\"govuk-checkboxes__input\" [checked]=\"allSelected\"\n           (change)=\"toggleSelectAll()\" />\n    <label for=\"select_all\" class=\"govuk-label govuk-checkboxes__label\">Select all / Deselect all</label>\n  </div>\n  <div class=\"checkbox-items\">\n    <div *ngFor=\"let item of options; let i = index\" class=\"govuk-checkboxes__item\">\n      <input type=\"checkbox\" [id]=\"'select_' + i\" class=\"govuk-checkboxes__input\" [checked]=\"isSelected(item)\"\n             (change)=\"toggleItemSelection(item)\" />\n      <label [for]=\"'select_' + i\" class=\"govuk-label govuk-checkboxes__label\">{{labelFunction(item)}}</label>\n    </div>\n  </div>\n</div>\n", styles: [".xui-checkbox-list .select-all{margin-bottom:10px}.xui-checkbox-list .checkbox-items{display:flex;flex-direction:column;flex-wrap:wrap;height:100%;max-height:100%;align-items:flex-start;align-content:flex-start;width:100%;max-width:100%;overflow-x:scroll}\n"], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: CheckboxListComponent, decorators: [{
+CheckboxListComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: CheckboxListComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+CheckboxListComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: CheckboxListComponent, selector: "xuilib-checkbox-list", inputs: { options: "options", preselection: "preselection", labelFunction: "labelFunction", selection: "selection" }, outputs: { selectionChange: "selectionChange" }, usesOnChanges: true, ngImport: i0, template: "<div class=\"xui-checkbox-list govuk-checkboxes govuk-checkboxes--small\" *ngIf=\"isFunctional\">\n  <div class=\"select-all govuk-checkboxes__item\">\n    <input type=\"checkbox\" id=\"select_all\" class=\"govuk-checkboxes__input\" [checked]=\"allSelected\"\n           (change)=\"toggleSelectAll()\" />\n    <label for=\"select_all\" class=\"govuk-label govuk-checkboxes__label\">Select all / Deselect all</label>\n  </div>\n  <div class=\"checkbox-items\">\n    <div *ngFor=\"let item of options; let i = index\" class=\"govuk-checkboxes__item\">\n      <input type=\"checkbox\" [id]=\"'select_' + i\" class=\"govuk-checkboxes__input\" [checked]=\"isSelected(item)\"\n             (change)=\"toggleItemSelection(item)\" />\n      <label [for]=\"'select_' + i\" class=\"govuk-label govuk-checkboxes__label\">{{labelFunction(item)}}</label>\n    </div>\n  </div>\n</div>\n", styles: [".xui-checkbox-list .select-all{margin-bottom:10px}.xui-checkbox-list .checkbox-items{display:flex;flex-direction:column;flex-wrap:wrap;height:100%;max-height:100%;align-items:flex-start;align-content:flex-start;width:100%;max-width:100%;overflow-x:scroll}\n"], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], encapsulation: i0.ViewEncapsulation.None });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: CheckboxListComponent, decorators: [{
             type: Component,
             args: [{ selector: 'xuilib-checkbox-list', encapsulation: ViewEncapsulation.None, template: "<div class=\"xui-checkbox-list govuk-checkboxes govuk-checkboxes--small\" *ngIf=\"isFunctional\">\n  <div class=\"select-all govuk-checkboxes__item\">\n    <input type=\"checkbox\" id=\"select_all\" class=\"govuk-checkboxes__input\" [checked]=\"allSelected\"\n           (change)=\"toggleSelectAll()\" />\n    <label for=\"select_all\" class=\"govuk-label govuk-checkboxes__label\">Select all / Deselect all</label>\n  </div>\n  <div class=\"checkbox-items\">\n    <div *ngFor=\"let item of options; let i = index\" class=\"govuk-checkboxes__item\">\n      <input type=\"checkbox\" [id]=\"'select_' + i\" class=\"govuk-checkboxes__input\" [checked]=\"isSelected(item)\"\n             (change)=\"toggleItemSelection(item)\" />\n      <label [for]=\"'select_' + i\" class=\"govuk-label govuk-checkboxes__label\">{{labelFunction(item)}}</label>\n    </div>\n  </div>\n</div>\n", styles: [".xui-checkbox-list .select-all{margin-bottom:10px}.xui-checkbox-list .checkbox-items{display:flex;flex-direction:column;flex-wrap:wrap;height:100%;max-height:100%;align-items:flex-start;align-content:flex-start;width:100%;max-width:100%;overflow-x:scroll}\n"] }]
         }], propDecorators: { options: [{
@@ -214,10 +216,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.7", ngImpor
 class ContactDetailsComponent {
     constructor() {
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: ContactDetailsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.7", type: ContactDetailsComponent, selector: "xuilib-contact-details", inputs: { data: "data" }, ngImport: i0, template: "<div class=\"contact-details\" *ngIf=\"data\">\n  <h3 class=\"govuk-heading-m\" *ngIf=\"data.title\">{{ data.title }}</h3>\n  <p *ngIf=\"data.badgeText\"><span [className]=\"'hmcts-badge ' + data.badgeColour\">{{ data.badgeText }}</span></p>\n  <div class=\"email\" *ngIf=\"data.email\"><span class=\"govuk-!-font-weight-bold\">Email: </span> <a href=\"mailto:{{ data.email }}\">{{ data.email }}</a></div>\n  <div class=\"phone\" *ngIf=\"data.phone\"><span class=\"govuk-!-font-weight-bold\">Phone: </span>{{ data.phone }}</div>\n  <div class=\"opening-times\" *ngIf=\"data.openingTimes\"><span class=\"govuk-!-font-weight-bold\">Opening times: </span>{{ data.openingTimes}}</div>\n</div>\n\n", styles: [".contact-details{margin-top:30px}.contact-details h3,.contact-details p{margin-bottom:10px}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: ContactDetailsComponent, decorators: [{
+ContactDetailsComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: ContactDetailsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+ContactDetailsComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: ContactDetailsComponent, selector: "xuilib-contact-details", inputs: { data: "data" }, ngImport: i0, template: "<div class=\"contact-details\" *ngIf=\"data\">\n  <h3 class=\"govuk-heading-m\" *ngIf=\"data.title\">{{ data.title }}</h3>\n  <p *ngIf=\"data.badgeText\"><span [className]=\"'hmcts-badge ' + data.badgeColour\">{{ data.badgeText }}</span></p>\n  <div class=\"email\" *ngIf=\"data.email\"><span class=\"govuk-!-font-weight-bold\">Email: </span> <a href=\"mailto:{{ data.email }}\">{{ data.email }}</a></div>\n  <div class=\"phone\" *ngIf=\"data.phone\"><span class=\"govuk-!-font-weight-bold\">Phone: </span>{{ data.phone }}</div>\n  <div class=\"opening-times\" *ngIf=\"data.openingTimes\"><span class=\"govuk-!-font-weight-bold\">Opening times: </span>{{ data.openingTimes}}</div>\n</div>\n\n", styles: [".contact-details{margin-top:30px}.contact-details h3,.contact-details p{margin-bottom:10px}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: ContactDetailsComponent, decorators: [{
             type: Component,
             args: [{ selector: 'xuilib-contact-details', template: "<div class=\"contact-details\" *ngIf=\"data\">\n  <h3 class=\"govuk-heading-m\" *ngIf=\"data.title\">{{ data.title }}</h3>\n  <p *ngIf=\"data.badgeText\"><span [className]=\"'hmcts-badge ' + data.badgeColour\">{{ data.badgeText }}</span></p>\n  <div class=\"email\" *ngIf=\"data.email\"><span class=\"govuk-!-font-weight-bold\">Email: </span> <a href=\"mailto:{{ data.email }}\">{{ data.email }}</a></div>\n  <div class=\"phone\" *ngIf=\"data.phone\"><span class=\"govuk-!-font-weight-bold\">Phone: </span>{{ data.phone }}</div>\n  <div class=\"opening-times\" *ngIf=\"data.openingTimes\"><span class=\"govuk-!-font-weight-bold\">Opening times: </span>{{ data.openingTimes}}</div>\n</div>\n\n", styles: [".contact-details{margin-top:30px}.contact-details h3,.contact-details p{margin-bottom:10px}\n"] }]
         }], ctorParameters: function () { return []; }, propDecorators: { data: [{
@@ -329,10 +331,10 @@ class DueDateComponent {
         const diffSecs = Math.floor((toEpoch - fromEpoch) / 1000);
         return Math.floor(diffSecs / SECONDS_IN_A_DAY);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: DueDateComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.7", type: DueDateComponent, selector: "xuilib-due-date", inputs: { dueDate: "dueDate", highUrgencyCutoff: "highUrgencyCutoff", mediumUrgencyCutoff: "mediumUrgencyCutoff" }, usesOnChanges: true, ngImport: i0, template: "<span *ngIf=\"dueDate\" class=\"due-date hmcts-badge\" [ngClass]=\"badge\"\n      [title]=\"accessibleLabel\" [attr.aria-label]=\"accessibleLabel\">\n  {{label}}\n</span>", styles: [".due-date{white-space:nowrap}.due-date.hmcts-badge--orange{color:#f47738;border-color:#f47738}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: DueDateComponent, decorators: [{
+DueDateComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: DueDateComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+DueDateComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: DueDateComponent, selector: "xuilib-due-date", inputs: { dueDate: "dueDate", highUrgencyCutoff: "highUrgencyCutoff", mediumUrgencyCutoff: "mediumUrgencyCutoff" }, usesOnChanges: true, ngImport: i0, template: "<span *ngIf=\"dueDate\" class=\"due-date hmcts-badge\" [ngClass]=\"badge\"\n      [title]=\"accessibleLabel\" [attr.aria-label]=\"accessibleLabel\">\n  {{label}}\n</span>", styles: [".due-date{white-space:nowrap}.due-date.hmcts-badge--orange{color:#f47738;border-color:#f47738}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], encapsulation: i0.ViewEncapsulation.None });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: DueDateComponent, decorators: [{
             type: Component,
             args: [{ selector: 'xuilib-due-date', encapsulation: ViewEncapsulation.None, template: "<span *ngIf=\"dueDate\" class=\"due-date hmcts-badge\" [ngClass]=\"badge\"\n      [title]=\"accessibleLabel\" [attr.aria-label]=\"accessibleLabel\">\n  {{label}}\n</span>", styles: [".due-date{white-space:nowrap}.due-date.hmcts-badge--orange{color:#f47738;border-color:#f47738}\n"] }]
         }], propDecorators: { dueDate: [{
@@ -381,10 +383,10 @@ class FeatureToggleService {
     getValueOnce(_key, _defaultValue) {
         throw new Error('Not implemented');
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: FeatureToggleService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: FeatureToggleService, providedIn: 'root' }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: FeatureToggleService, decorators: [{
+FeatureToggleService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: FeatureToggleService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+FeatureToggleService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: FeatureToggleService, providedIn: 'root' });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: FeatureToggleService, decorators: [{
             type: Injectable,
             args: [{
                     providedIn: 'root'
@@ -406,10 +408,10 @@ class FeatureToggleGuard {
     canActivate(route) {
         return combineLatest(...route.data.needsFeaturesEnabled.map(feature => this.featureToggleService.getValueOnce(feature, false))).pipe(map(featureStatuses => featureStatuses.every(status => status)), map(status => status || this.router.parseUrl(route.data.featureDisabledRedirect)));
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: FeatureToggleGuard, deps: [{ token: FeatureToggleService }, { token: i2.Router }], target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: FeatureToggleGuard, providedIn: 'root' }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: FeatureToggleGuard, decorators: [{
+FeatureToggleGuard.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: FeatureToggleGuard, deps: [{ token: FeatureToggleService }, { token: i2.Router }], target: i0.ɵɵFactoryTarget.Injectable });
+FeatureToggleGuard.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: FeatureToggleGuard, providedIn: 'root' });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: FeatureToggleGuard, decorators: [{
             type: Injectable,
             args: [{
                     providedIn: 'root'
@@ -462,10 +464,10 @@ class LaunchDarklyService {
     getValueOnce(feature, defaultValue) {
         return this.ready.pipe(filter(ready => ready), map(() => this.client.variation(feature, defaultValue)));
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: LaunchDarklyService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: LaunchDarklyService, providedIn: 'root' }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: LaunchDarklyService, decorators: [{
+LaunchDarklyService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: LaunchDarklyService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+LaunchDarklyService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: LaunchDarklyService, providedIn: 'root' });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: LaunchDarklyService, decorators: [{
             type: Injectable,
             args: [{
                     providedIn: 'root'
@@ -519,10 +521,10 @@ class GoogleAnalyticsService {
     event(eventName, params) {
         this.window.gtag('event', eventName, params);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: GoogleAnalyticsService, deps: [{ token: i2.Router }, { token: i2$1.Title }, { token: windowToken }, { token: DOCUMENT }], target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: GoogleAnalyticsService, providedIn: 'root' }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: GoogleAnalyticsService, decorators: [{
+GoogleAnalyticsService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: GoogleAnalyticsService, deps: [{ token: i2.Router }, { token: i2$1.Title }, { token: windowToken }, { token: DOCUMENT }], target: i0.ɵɵFactoryTarget.Injectable });
+GoogleAnalyticsService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: GoogleAnalyticsService, providedIn: 'root' });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: GoogleAnalyticsService, decorators: [{
             type: Injectable,
             args: [{
                     providedIn: 'root'
@@ -582,10 +584,10 @@ class GoogleTagManagerService {
             params
         });
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: GoogleTagManagerService, deps: [{ token: i2.Router }, { token: i2$1.Title }, { token: windowToken }, { token: DOCUMENT }], target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: GoogleTagManagerService, providedIn: 'root' }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: GoogleTagManagerService, decorators: [{
+GoogleTagManagerService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: GoogleTagManagerService, deps: [{ token: i2.Router }, { token: i2$1.Title }, { token: windowToken }, { token: DOCUMENT }], target: i0.ɵɵFactoryTarget.Injectable });
+GoogleTagManagerService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: GoogleTagManagerService, providedIn: 'root' });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: GoogleTagManagerService, decorators: [{
             type: Injectable,
             args: [{
                     providedIn: 'root'
@@ -630,10 +632,10 @@ class ManageSessionServices {
     appStateChanges() {
         return this.appStateEmitter.asObservable();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: ManageSessionServices, deps: [{ token: i1$1.Idle }, { token: i2$2.Keepalive }], target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: ManageSessionServices, providedIn: 'root' }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: ManageSessionServices, decorators: [{
+ManageSessionServices.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: ManageSessionServices, deps: [{ token: i1$1.Idle }, { token: i2$2.Keepalive }], target: i0.ɵɵFactoryTarget.Injectable });
+ManageSessionServices.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: ManageSessionServices, providedIn: 'root' });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: ManageSessionServices, decorators: [{
             type: Injectable,
             args: [{
                     providedIn: 'root'
@@ -716,10 +718,10 @@ class TimeoutNotificationsService {
     notificationOnChange() {
         return this.eventEmitter.asObservable();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: TimeoutNotificationsService, deps: [{ token: i1$1.Idle }, { token: i2$2.Keepalive }], target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: TimeoutNotificationsService, providedIn: 'root' }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: TimeoutNotificationsService, decorators: [{
+TimeoutNotificationsService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: TimeoutNotificationsService, deps: [{ token: i1$1.Idle }, { token: i2$2.Keepalive }], target: i0.ɵɵFactoryTarget.Injectable });
+TimeoutNotificationsService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: TimeoutNotificationsService, providedIn: 'root' });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: TimeoutNotificationsService, decorators: [{
             type: Injectable,
             args: [{
                     providedIn: 'root'
@@ -734,10 +736,10 @@ class RoleService {
     set roles(roles) {
         this.pRoles.next(roles);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: RoleService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: RoleService, providedIn: 'root' }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: RoleService, decorators: [{
+RoleService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: RoleService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+RoleService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: RoleService, providedIn: 'root' });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: RoleService, decorators: [{
             type: Injectable,
             args: [{
                     providedIn: 'root'
@@ -765,10 +767,10 @@ class RoleGuard {
             return match || this.router.parseUrl(route.data.noRoleMatchRedirect);
         }));
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: RoleGuard, deps: [{ token: RoleService }, { token: i2.Router }], target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: RoleGuard, providedIn: 'root' }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: RoleGuard, decorators: [{
+RoleGuard.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: RoleGuard, deps: [{ token: RoleService }, { token: i2.Router }], target: i0.ɵɵFactoryTarget.Injectable });
+RoleGuard.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: RoleGuard, providedIn: 'root' });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: RoleGuard, decorators: [{
             type: Injectable,
             args: [{
                     providedIn: 'root'
@@ -807,10 +809,10 @@ class CookieService {
     checkCookie(key) {
         return this.document.cookie.split('; ').some(item => item.trim().startsWith(`${key}=`));
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: CookieService, deps: [{ token: DOCUMENT }], target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: CookieService, providedIn: 'root' }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: CookieService, decorators: [{
+CookieService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: CookieService, deps: [{ token: DOCUMENT }], target: i0.ɵɵFactoryTarget.Injectable });
+CookieService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: CookieService, providedIn: 'root' });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: CookieService, decorators: [{
             type: Injectable,
             args: [{
                     providedIn: 'root'
@@ -847,10 +849,10 @@ class LoadingService {
         const timestamp = window.performance.now();
         return `common-lib-loading-${timestamp}`; // format: [source-library]-[unique incrementing number]
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: LoadingService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: LoadingService, providedIn: 'root' }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: LoadingService, decorators: [{
+LoadingService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: LoadingService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+LoadingService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: LoadingService, providedIn: 'root' });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: LoadingService, decorators: [{
             type: Injectable,
             args: [{
                     providedIn: 'root'
@@ -939,10 +941,10 @@ class FilterService {
         }
         return userId;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: FilterService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: FilterService, providedIn: 'root' }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: FilterService, decorators: [{
+FilterService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: FilterService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+FilterService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: FilterService, providedIn: 'root' });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: FilterService, decorators: [{
             type: Injectable,
             args: [{
                     providedIn: 'root'
@@ -950,7 +952,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.7", ngImpor
         }] });
 
 class RefDataDataAccessService {
-    static { this.refDataUrl = '/api/ref-data'; }
     constructor(http) {
         this.http = http;
     }
@@ -968,10 +969,11 @@ class RefDataDataAccessService {
     getLocations() {
         return this.http.get(`${RefDataDataAccessService.refDataUrl}/locations`);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: RefDataDataAccessService, deps: [{ token: i1$2.HttpClient }], target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: RefDataDataAccessService, providedIn: 'root' }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: RefDataDataAccessService, decorators: [{
+RefDataDataAccessService.refDataUrl = '/api/ref-data';
+RefDataDataAccessService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: RefDataDataAccessService, deps: [{ token: i1$2.HttpClient }], target: i0.ɵɵFactoryTarget.Injectable });
+RefDataDataAccessService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: RefDataDataAccessService, providedIn: 'root' });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: RefDataDataAccessService, decorators: [{
             type: Injectable,
             args: [{
                     providedIn: 'root'
@@ -996,10 +998,10 @@ class RefDataService {
         });
         return forkJoin(observables).pipe(map((values) => values.reduce((acc, val) => acc.concat(val)), []), take(1));
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: RefDataService, deps: [{ token: RefDataDataAccessService }], target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: RefDataService, providedIn: 'root' }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: RefDataService, decorators: [{
+RefDataService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: RefDataService, deps: [{ token: RefDataDataAccessService }], target: i0.ɵɵFactoryTarget.Injectable });
+RefDataService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: RefDataService, providedIn: 'root' });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: RefDataService, decorators: [{
             type: Injectable,
             args: [{
                     providedIn: 'root'
@@ -1111,10 +1113,10 @@ class SessionStorageService {
     clear() {
         sessionStorage.clear();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: SessionStorageService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: SessionStorageService, providedIn: 'root' }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: SessionStorageService, decorators: [{
+SessionStorageService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SessionStorageService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+SessionStorageService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SessionStorageService, providedIn: 'root' });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SessionStorageService, decorators: [{
             type: Injectable,
             args: [{
                     providedIn: 'root'
@@ -1122,7 +1124,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.7", ngImpor
         }] });
 
 class FindAPersonService {
-    static { this.caseworkersKey = 'caseworkers'; }
     constructor(http, sessionStorageService) {
         this.http = http;
         this.sessionStorageService = sessionStorageService;
@@ -1214,10 +1215,11 @@ class FindAPersonService {
     searchJudicial(value, serviceId) {
         return this.http.post('api/prd/judicial/getJudicialUsersSearch', { searchString: value, serviceCode: serviceId });
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: FindAPersonService, deps: [{ token: i1$2.HttpClient }, { token: SessionStorageService }], target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: FindAPersonService, providedIn: 'root' }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: FindAPersonService, decorators: [{
+FindAPersonService.caseworkersKey = 'caseworkers';
+FindAPersonService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: FindAPersonService, deps: [{ token: i1$2.HttpClient }, { token: SessionStorageService }], target: i0.ɵɵFactoryTarget.Injectable });
+FindAPersonService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: FindAPersonService, providedIn: 'root' });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: FindAPersonService, decorators: [{
             type: Injectable,
             args: [{
                     providedIn: 'root'
@@ -1303,10 +1305,10 @@ class FindPersonComponent {
     onInput() {
         this.personFieldChanged.emit();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: FindPersonComponent, deps: [{ token: FindAPersonService }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.7", type: FindPersonComponent, selector: "xuilib-find-person", inputs: { title: "title", boldTitle: "boldTitle", subTitle: "subTitle", domain: "domain", findPersonGroup: "findPersonGroup", selectedPerson: "selectedPerson", submitted: "submitted", userIncluded: "userIncluded", assignedUser: "assignedUser", placeholderContent: "placeholderContent", isNoResultsShown: "isNoResultsShown", showUpdatedColor: "showUpdatedColor", selectedPersons: "selectedPersons", errorMessage: "errorMessage", idValue: "idValue", services: "services", disabled: "disabled" }, outputs: { personSelected: "personSelected", personFieldChanged: "personFieldChanged" }, ngImport: i0, template: "<h1 class=\"govuk-heading-l\" *ngIf=\"title && title.length\">\n  <span class=\"govuk-caption-l\">{{title}}</span>\n  {{boldTitle}}\n</h1>\n<div class=\"govuk-form-group\" [formGroup]=\"findPersonGroup\"\n     [ngClass]=\"{'form-group-error': findPersonGroup.get('findPersonControl').invalid && submitted}\">\n  <fieldset class=\"govuk-fieldset\" aria-describedby=\"sub-title-hint\">\n    <div id=\"sub-title-hint\" class=\"govuk-hint\" *ngIf=\"subTitle && subTitle.length\">\n      {{subTitle}}\n    </div>\n    <span id=\"validation-error\" class=\"govuk-error-message\" *ngIf=\"findPersonGroup && findPersonGroup.errors\">\n        <span class=\"govuk-visually-hidden\">Error:</span>{{findPersonGroup.errors.error ? findPersonGroup.errors.error : errorMessage}}\n    </span>\n    <input id=\"inputSelectPerson{{idValue}}\" type=\"text\" aria-label=\"select a person\"\n           formControlName=\"findPersonControl\"\n           [matAutocomplete]=\"auto\"\n           class=\"govuk-input govuk-!-width-one-third\"\n           [placeholder]=\"placeholderContent\"\n           [attr.disabled]=\"disabled\"\n           (input)=\"onInput()\">\n    <mat-autocomplete autoActiveFirstOption #auto=\"matAutocomplete\" (optionSelected)=\"onSelectionChange($event.option.value)\">\n      <mat-option *ngFor=\"let option of filteredOptions\"\n                  [value]=\"option\"\n                  [ngClass]=\"{'hide-autocomplete': !showAutocomplete, 'select-option': showUpdatedColor}\">\n        {{getDisplayName(option)}}\n      </mat-option>\n      <mat-option [ngClass]=\"{'select-option': showUpdatedColor}\" *ngIf=\"isNoResultsShown && !filteredOptions.length && showAutocomplete\">No results found</mat-option>\n    </mat-autocomplete>\n  </fieldset>\n</div>\n", styles: [".mat-option:hover{background:#2596be}.mat-option.select-option:hover{background:#1d70b8;color:#fff}.hide-autocomplete{display:none}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2$3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2$3.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i2$3.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: i4.MatLegacyAutocomplete, selector: "mat-autocomplete", inputs: ["disableRipple"], exportAs: ["matAutocomplete"] }, { kind: "directive", type: i4.MatLegacyAutocompleteTrigger, selector: "input[matAutocomplete], textarea[matAutocomplete]", exportAs: ["matAutocompleteTrigger"] }, { kind: "component", type: i5.MatLegacyOption, selector: "mat-option", exportAs: ["matOption"] }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: FindPersonComponent, decorators: [{
+FindPersonComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: FindPersonComponent, deps: [{ token: FindAPersonService }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
+FindPersonComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: FindPersonComponent, selector: "xuilib-find-person", inputs: { title: "title", boldTitle: "boldTitle", subTitle: "subTitle", domain: "domain", findPersonGroup: "findPersonGroup", selectedPerson: "selectedPerson", submitted: "submitted", userIncluded: "userIncluded", assignedUser: "assignedUser", placeholderContent: "placeholderContent", isNoResultsShown: "isNoResultsShown", showUpdatedColor: "showUpdatedColor", selectedPersons: "selectedPersons", errorMessage: "errorMessage", idValue: "idValue", services: "services", disabled: "disabled" }, outputs: { personSelected: "personSelected", personFieldChanged: "personFieldChanged" }, ngImport: i0, template: "<h1 class=\"govuk-heading-l\" *ngIf=\"title && title.length\">\n  <span class=\"govuk-caption-l\">{{title}}</span>\n  {{boldTitle}}\n</h1>\n<div class=\"govuk-form-group\" [formGroup]=\"findPersonGroup\"\n     [ngClass]=\"{'form-group-error': findPersonGroup.get('findPersonControl').invalid && submitted}\">\n  <fieldset class=\"govuk-fieldset\" aria-describedby=\"sub-title-hint\">\n    <div id=\"sub-title-hint\" class=\"govuk-hint\" *ngIf=\"subTitle && subTitle.length\">\n      {{subTitle}}\n    </div>\n    <span id=\"validation-error\" class=\"govuk-error-message\" *ngIf=\"findPersonGroup && findPersonGroup.errors\">\n        <span class=\"govuk-visually-hidden\">Error:</span>{{findPersonGroup.errors.error ? findPersonGroup.errors.error : errorMessage}}\n    </span>\n    <input id=\"inputSelectPerson{{idValue}}\" type=\"text\" aria-label=\"select a person\"\n           formControlName=\"findPersonControl\"\n           [matAutocomplete]=\"auto\"\n           class=\"govuk-input govuk-!-width-one-third\"\n           [placeholder]=\"placeholderContent\"\n           [attr.disabled]=\"disabled\"\n           (input)=\"onInput()\">\n    <mat-autocomplete autoActiveFirstOption #auto=\"matAutocomplete\" (optionSelected)=\"onSelectionChange($event.option.value)\">\n      <mat-option *ngFor=\"let option of filteredOptions\"\n                  [value]=\"option\"\n                  [ngClass]=\"{'hide-autocomplete': !showAutocomplete, 'select-option': showUpdatedColor}\">\n        {{getDisplayName(option)}}\n      </mat-option>\n      <mat-option [ngClass]=\"{'select-option': showUpdatedColor}\" *ngIf=\"isNoResultsShown && !filteredOptions.length && showAutocomplete\">No results found</mat-option>\n    </mat-autocomplete>\n  </fieldset>\n</div>\n", styles: [".mat-option:hover{background:#2596be}.mat-option.select-option:hover{background:#1d70b8;color:#fff}.hide-autocomplete{display:none}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2$3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2$3.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i2$3.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: i4.MatLegacyAutocomplete, selector: "mat-autocomplete", inputs: ["disableRipple"], exportAs: ["matAutocomplete"] }, { kind: "directive", type: i4.MatLegacyAutocompleteTrigger, selector: "input[matAutocomplete], textarea[matAutocomplete]", exportAs: ["matAutocompleteTrigger"] }, { kind: "component", type: i5.MatLegacyOption, selector: "mat-option", exportAs: ["matOption"] }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: FindPersonComponent, decorators: [{
             type: Component,
             args: [{ selector: 'xuilib-find-person', template: "<h1 class=\"govuk-heading-l\" *ngIf=\"title && title.length\">\n  <span class=\"govuk-caption-l\">{{title}}</span>\n  {{boldTitle}}\n</h1>\n<div class=\"govuk-form-group\" [formGroup]=\"findPersonGroup\"\n     [ngClass]=\"{'form-group-error': findPersonGroup.get('findPersonControl').invalid && submitted}\">\n  <fieldset class=\"govuk-fieldset\" aria-describedby=\"sub-title-hint\">\n    <div id=\"sub-title-hint\" class=\"govuk-hint\" *ngIf=\"subTitle && subTitle.length\">\n      {{subTitle}}\n    </div>\n    <span id=\"validation-error\" class=\"govuk-error-message\" *ngIf=\"findPersonGroup && findPersonGroup.errors\">\n        <span class=\"govuk-visually-hidden\">Error:</span>{{findPersonGroup.errors.error ? findPersonGroup.errors.error : errorMessage}}\n    </span>\n    <input id=\"inputSelectPerson{{idValue}}\" type=\"text\" aria-label=\"select a person\"\n           formControlName=\"findPersonControl\"\n           [matAutocomplete]=\"auto\"\n           class=\"govuk-input govuk-!-width-one-third\"\n           [placeholder]=\"placeholderContent\"\n           [attr.disabled]=\"disabled\"\n           (input)=\"onInput()\">\n    <mat-autocomplete autoActiveFirstOption #auto=\"matAutocomplete\" (optionSelected)=\"onSelectionChange($event.option.value)\">\n      <mat-option *ngFor=\"let option of filteredOptions\"\n                  [value]=\"option\"\n                  [ngClass]=\"{'hide-autocomplete': !showAutocomplete, 'select-option': showUpdatedColor}\">\n        {{getDisplayName(option)}}\n      </mat-option>\n      <mat-option [ngClass]=\"{'select-option': showUpdatedColor}\" *ngIf=\"isNoResultsShown && !filteredOptions.length && showAutocomplete\">No results found</mat-option>\n    </mat-autocomplete>\n  </fieldset>\n</div>\n", styles: [".mat-option:hover{background:#2596be}.mat-option.select-option:hover{background:#1d70b8;color:#fff}.hide-autocomplete{display:none}\n"] }]
         }], ctorParameters: function () { return [{ type: FindAPersonService }, { type: i0.ChangeDetectorRef }]; }, propDecorators: { personSelected: [{
@@ -1376,10 +1378,10 @@ class LocationService {
     searchLocations(serviceIds, locationType, searchTerm) {
         return this.http.get(`api/prd/location/getLocations?serviceIds=${serviceIds}&locationType=${locationType}&searchTerm=${searchTerm}`);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: LocationService, deps: [{ token: i1$2.HttpClient }], target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: LocationService, providedIn: 'root' }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: LocationService, decorators: [{
+LocationService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: LocationService, deps: [{ token: i1$2.HttpClient }], target: i0.ɵɵFactoryTarget.Injectable });
+LocationService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: LocationService, providedIn: 'root' });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: LocationService, decorators: [{
             type: Injectable,
             args: [{
                     providedIn: 'root'
@@ -1387,13 +1389,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.7", ngImpor
         }], ctorParameters: function () { return [{ type: i1$2.HttpClient }]; } });
 
 class SearchLocationComponent {
-    get reset() {
-        return this.pReset;
-    }
-    set reset(value) {
-        this.pReset = value;
-        this.resetSearchTerm();
-    }
     constructor(locationService, sessionStorageService, refDataService) {
         this.locationService = locationService;
         this.sessionStorageService = sessionStorageService;
@@ -1415,6 +1410,13 @@ class SearchLocationComponent {
         this.pReset = true;
         this.debounceTimeInput = 300;
     }
+    get reset() {
+        return this.pReset;
+    }
+    set reset(value) {
+        this.pReset = value;
+        this.resetSearchTerm();
+    }
     ngOnInit() {
         const searchInputChanges$ = this.searchTermFormControl.valueChanges
             .pipe(tap((term) => this.locationTermSearchInputChanged.emit(term)));
@@ -1506,10 +1508,10 @@ class SearchLocationComponent {
         }
         return locations.filter(location => !selectedLocations.map(selectedLocation => selectedLocation.epimms_id).includes(location.epimms_id) && location[this.propertyNameFilter]);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: SearchLocationComponent, deps: [{ token: LocationService }, { token: SessionStorageService }, { token: RefDataService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.7", type: SearchLocationComponent, selector: "exui-search-location", inputs: { form: "form", field: "field", disabled: "disabled", singleMode: "singleMode", locationType: "locationType", serviceIds: "serviceIds", submitted: "submitted", bookingCheck: "bookingCheck", selectedLocations: "selectedLocations", propertyNameFilter: "propertyNameFilter", delay: "delay", reset: "reset" }, outputs: { locationSelected: "locationSelected", locationTermSearchInputChanged: "locationTermSearchInputChanged", searchLocationChanged: "searchLocationChanged" }, ngImport: i0, template: "<div class=\"auto-complete-container\">\n  <input\n    id=\"inputLocationSearch\"\n    (input)=\"onInput()\"\n    [formControl]=\"searchTermFormControl\"\n    [matAutocomplete]=\"autoSearchLocation\"\n    class=\"govuk-input\"\n    [attr.disabled]=\"disabled\">\n  <mat-autocomplete class=\"mat-autocomplete-panel-extend\" autoActiveFirstOption #autoSearchLocation=\"matAutocomplete\">\n    <ng-container *ngIf=\"filteredList$ | async as filteredList\">\n      <ng-container *ngIf=\"filteredList && filteredList.length >= 0\">\n        <mat-option *ngFor=\"let location of filteredList\" (onSelectionChange)=\"onSelectedLocation(location)\">\n          {{ location[propertyNameFilter] }}\n        </mat-option>\n        <mat-option *ngIf=\"filteredList.length === 0\">No results found</mat-option>\n      </ng-container>\n    </ng-container>\n  </mat-autocomplete>\n</div>\n", styles: [".autocomplete__input--show-all-values{padding:5px 34px 5px 5px;cursor:pointer}.autocomplete__dropdown-arrow-down{z-index:-1;display:inline-block;position:absolute;right:8px;width:24px;height:24px;top:10px}.autocomplete__menu{background-color:#fff;border:2px solid #0b0c0c;border-top:0;color:#0b0c0c;margin:0;max-height:342px;overflow-x:hidden;padding:0;width:calc(100% - 4px)}.autocomplete__menu--visible{display:block}.autocomplete__menu--hidden{display:none}.autocomplete__menu--overlay{box-shadow:#00000042 0 2px 6px;left:0;position:absolute;top:100%;z-index:100}.autocomplete__menu--inline{position:relative}.autocomplete__option{border-bottom:solid #b1b4b6;border-width:1px 0;cursor:pointer;display:block;position:relative}.autocomplete__option>*{pointer-events:none}.autocomplete__option:first-of-type{border-top-width:0}.autocomplete__option:last-of-type{border-bottom-width:0}.autocomplete__option--odd{background-color:#fafafa}.autocomplete__option--focused,.autocomplete__option:hover{background-color:#1d70b8;border-color:#1d70b8;color:#fff;outline:0}.autocomplete__option--no-results{background-color:#fafafa;color:#646b6f;cursor:not-allowed}.autocomplete__hint,.autocomplete__input,.autocomplete__option{font-size:13px;line-height:1.25}.autocomplete__hint,.autocomplete__option{padding:5px}@media (min-width: 641px){.autocomplete__hint,.autocomplete__input,.autocomplete__option{font-size:13px;line-height:1.31579}}.div-action{display:inline-block}.add-location{display:inline}.remove-location-button{margin:5px}.hide-autocomplete{display:none}.auto-complete-container{display:inline-block;margin-right:4px;width:calc(100% - 4px)}.autocomplete__input{line-height:24px;font-size:19px}\n"], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2$3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$3.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "component", type: i4.MatLegacyAutocomplete, selector: "mat-autocomplete", inputs: ["disableRipple"], exportAs: ["matAutocomplete"] }, { kind: "directive", type: i4.MatLegacyAutocompleteTrigger, selector: "input[matAutocomplete], textarea[matAutocomplete]", exportAs: ["matAutocompleteTrigger"] }, { kind: "component", type: i5.MatLegacyOption, selector: "mat-option", exportAs: ["matOption"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: SearchLocationComponent, decorators: [{
+SearchLocationComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SearchLocationComponent, deps: [{ token: LocationService }, { token: SessionStorageService }, { token: RefDataService }], target: i0.ɵɵFactoryTarget.Component });
+SearchLocationComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: SearchLocationComponent, selector: "exui-search-location", inputs: { form: "form", field: "field", disabled: "disabled", singleMode: "singleMode", locationType: "locationType", serviceIds: "serviceIds", submitted: "submitted", bookingCheck: "bookingCheck", selectedLocations: "selectedLocations", propertyNameFilter: "propertyNameFilter", delay: "delay", reset: "reset" }, outputs: { locationSelected: "locationSelected", locationTermSearchInputChanged: "locationTermSearchInputChanged", searchLocationChanged: "searchLocationChanged" }, ngImport: i0, template: "<div class=\"auto-complete-container\">\n  <input\n    id=\"inputLocationSearch\"\n    (input)=\"onInput()\"\n    [formControl]=\"searchTermFormControl\"\n    [matAutocomplete]=\"autoSearchLocation\"\n    class=\"govuk-input\"\n    [attr.disabled]=\"disabled\">\n  <mat-autocomplete class=\"mat-autocomplete-panel-extend\" autoActiveFirstOption #autoSearchLocation=\"matAutocomplete\">\n    <ng-container *ngIf=\"filteredList$ | async as filteredList\">\n      <ng-container *ngIf=\"filteredList && filteredList.length >= 0\">\n        <mat-option *ngFor=\"let location of filteredList\" (onSelectionChange)=\"onSelectedLocation(location)\">\n          {{ location[propertyNameFilter] }}\n        </mat-option>\n        <mat-option *ngIf=\"filteredList.length === 0\">No results found</mat-option>\n      </ng-container>\n    </ng-container>\n  </mat-autocomplete>\n</div>\n", styles: [".autocomplete__input--show-all-values{padding:5px 34px 5px 5px;cursor:pointer}.autocomplete__dropdown-arrow-down{z-index:-1;display:inline-block;position:absolute;right:8px;width:24px;height:24px;top:10px}.autocomplete__menu{background-color:#fff;border:2px solid #0b0c0c;border-top:0;color:#0b0c0c;margin:0;max-height:342px;overflow-x:hidden;padding:0;width:calc(100% - 4px)}.autocomplete__menu--visible{display:block}.autocomplete__menu--hidden{display:none}.autocomplete__menu--overlay{box-shadow:#00000042 0 2px 6px;left:0;position:absolute;top:100%;z-index:100}.autocomplete__menu--inline{position:relative}.autocomplete__option{border-bottom:solid #b1b4b6;border-width:1px 0;cursor:pointer;display:block;position:relative}.autocomplete__option>*{pointer-events:none}.autocomplete__option:first-of-type{border-top-width:0}.autocomplete__option:last-of-type{border-bottom-width:0}.autocomplete__option--odd{background-color:#fafafa}.autocomplete__option--focused,.autocomplete__option:hover{background-color:#1d70b8;border-color:#1d70b8;color:#fff;outline:0}.autocomplete__option--no-results{background-color:#fafafa;color:#646b6f;cursor:not-allowed}.autocomplete__hint,.autocomplete__input,.autocomplete__option{font-size:13px;line-height:1.25}.autocomplete__hint,.autocomplete__option{padding:5px}@media (min-width: 641px){.autocomplete__hint,.autocomplete__input,.autocomplete__option{font-size:13px;line-height:1.31579}}.div-action{display:inline-block}.add-location{display:inline}.remove-location-button{margin:5px}.hide-autocomplete{display:none}.auto-complete-container{display:inline-block;margin-right:4px;width:calc(100% - 4px)}.autocomplete__input{line-height:24px;font-size:19px}\n"], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2$3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$3.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "component", type: i4.MatLegacyAutocomplete, selector: "mat-autocomplete", inputs: ["disableRipple"], exportAs: ["matAutocomplete"] }, { kind: "directive", type: i4.MatLegacyAutocompleteTrigger, selector: "input[matAutocomplete], textarea[matAutocomplete]", exportAs: ["matAutocompleteTrigger"] }, { kind: "component", type: i5.MatLegacyOption, selector: "mat-option", exportAs: ["matOption"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SearchLocationComponent, decorators: [{
             type: Component,
             args: [{ selector: 'exui-search-location', template: "<div class=\"auto-complete-container\">\n  <input\n    id=\"inputLocationSearch\"\n    (input)=\"onInput()\"\n    [formControl]=\"searchTermFormControl\"\n    [matAutocomplete]=\"autoSearchLocation\"\n    class=\"govuk-input\"\n    [attr.disabled]=\"disabled\">\n  <mat-autocomplete class=\"mat-autocomplete-panel-extend\" autoActiveFirstOption #autoSearchLocation=\"matAutocomplete\">\n    <ng-container *ngIf=\"filteredList$ | async as filteredList\">\n      <ng-container *ngIf=\"filteredList && filteredList.length >= 0\">\n        <mat-option *ngFor=\"let location of filteredList\" (onSelectionChange)=\"onSelectedLocation(location)\">\n          {{ location[propertyNameFilter] }}\n        </mat-option>\n        <mat-option *ngIf=\"filteredList.length === 0\">No results found</mat-option>\n      </ng-container>\n    </ng-container>\n  </mat-autocomplete>\n</div>\n", styles: [".autocomplete__input--show-all-values{padding:5px 34px 5px 5px;cursor:pointer}.autocomplete__dropdown-arrow-down{z-index:-1;display:inline-block;position:absolute;right:8px;width:24px;height:24px;top:10px}.autocomplete__menu{background-color:#fff;border:2px solid #0b0c0c;border-top:0;color:#0b0c0c;margin:0;max-height:342px;overflow-x:hidden;padding:0;width:calc(100% - 4px)}.autocomplete__menu--visible{display:block}.autocomplete__menu--hidden{display:none}.autocomplete__menu--overlay{box-shadow:#00000042 0 2px 6px;left:0;position:absolute;top:100%;z-index:100}.autocomplete__menu--inline{position:relative}.autocomplete__option{border-bottom:solid #b1b4b6;border-width:1px 0;cursor:pointer;display:block;position:relative}.autocomplete__option>*{pointer-events:none}.autocomplete__option:first-of-type{border-top-width:0}.autocomplete__option:last-of-type{border-bottom-width:0}.autocomplete__option--odd{background-color:#fafafa}.autocomplete__option--focused,.autocomplete__option:hover{background-color:#1d70b8;border-color:#1d70b8;color:#fff;outline:0}.autocomplete__option--no-results{background-color:#fafafa;color:#646b6f;cursor:not-allowed}.autocomplete__hint,.autocomplete__input,.autocomplete__option{font-size:13px;line-height:1.25}.autocomplete__hint,.autocomplete__option{padding:5px}@media (min-width: 641px){.autocomplete__hint,.autocomplete__input,.autocomplete__option{font-size:13px;line-height:1.31579}}.div-action{display:inline-block}.add-location{display:inline}.remove-location-button{margin:5px}.hide-autocomplete{display:none}.auto-complete-container{display:inline-block;margin-right:4px;width:calc(100% - 4px)}.autocomplete__input{line-height:24px;font-size:19px}\n"] }]
         }], ctorParameters: function () { return [{ type: LocationService }, { type: SessionStorageService }, { type: RefDataService }]; }, propDecorators: { form: [{
@@ -1659,10 +1661,10 @@ class FindLocationComponent {
     ngOnDestroy() {
         this.formSubmissionEventSubscription?.unsubscribe();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: FindLocationComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.7", type: FindLocationComponent, selector: "xuilib-find-location", inputs: { submitted: "submitted", enableAddLocationButton: "enableAddLocationButton", form: "form", field: "field", fields: "fields", locationTitle: "locationTitle", disableInputField: "disableInputField", formSubmissionEvent$: "formSubmissionEvent$", disabled: "disabled", services: "services" }, outputs: { locationFieldChanged: "locationFieldChanged" }, viewQueries: [{ propertyName: "searchLocationComponent", first: true, predicate: SearchLocationComponent, descendants: true, static: true }], ngImport: i0, template: "<div class=\"location-picker-custom\">\n  <div class=\"search-location\">\n    <div>\n      <label id=\"input-selected-location-label\" *ngIf=\"locationTitle\">{{locationTitle}}</label>\n    </div>\n    <exui-search-location class=\"search-location\"\n                          [form]=\"form\"\n                          [field]=\"field\"\n                          [selectedLocations]=\"selectedLocations\"\n                          [delay]=\"300\"\n                          [disabled]=\"disabled\"\n                          [singleMode]=\"field.maxSelected === 1\"\n                          [bookingCheck]=\"field.bookingCheckType\"\n                          [serviceIds]=\"serviceIds\"\n                          [propertyNameFilter]=\"propertyNameFilter\"\n                          (locationTermSearchInputChanged)=\"onInputChanged($event)\"\n                          (locationSelected)=\"onLocationSelected($event)\"\n                          (searchLocationChanged)=\"onSearchInputChanged()\"\n                          [locationType]=\"'case-management'\">\n    </exui-search-location>\n  </div>\n\n  <div>\n    <a href=\"javascript:void(0)\" (click)=\"addLocation()\" class=\"govuk-button add-location-button\" data-module=\"govuk-button\" *ngIf=\"enableAddLocationButton\">\n      Add location\n    </a>\n  </div>\n\n  <ul class=\"hmcts-filter-tags selection-container\" *ngIf=\"field.maxSelected != 1\">\n    <li class=\"location-selection\"  *ngFor=\"let selection of selectedLocations\">\n      <a class=\"hmcts-filter__tag\" (click)=\"removeLocation(selection)\" href=\"javascript:void(0)\">\n        {{ selection[propertyNameFilter] }}\n      </a>\n    </li>\n  </ul>\n</div>\n", styles: [".add-location-button{margin-top:10px;margin-bottom:0}.search-location__input-container{display:flex}.search-location .auto-complete-container{min-width:unset;width:calc(100% - 4px)}.search-location__input{flex:1 0 auto}.search-location .govuk-button--secondary{background-color:#ddd}\n"], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: SearchLocationComponent, selector: "exui-search-location", inputs: ["form", "field", "disabled", "singleMode", "locationType", "serviceIds", "submitted", "bookingCheck", "selectedLocations", "propertyNameFilter", "delay", "reset"], outputs: ["locationSelected", "locationTermSearchInputChanged", "searchLocationChanged"] }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: FindLocationComponent, decorators: [{
+FindLocationComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: FindLocationComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+FindLocationComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: FindLocationComponent, selector: "xuilib-find-location", inputs: { submitted: "submitted", enableAddLocationButton: "enableAddLocationButton", form: "form", field: "field", fields: "fields", locationTitle: "locationTitle", disableInputField: "disableInputField", formSubmissionEvent$: "formSubmissionEvent$", disabled: "disabled", services: "services" }, outputs: { locationFieldChanged: "locationFieldChanged" }, viewQueries: [{ propertyName: "searchLocationComponent", first: true, predicate: SearchLocationComponent, descendants: true, static: true }], ngImport: i0, template: "<div class=\"location-picker-custom\">\n  <div class=\"search-location\">\n    <div>\n      <label id=\"input-selected-location-label\" *ngIf=\"locationTitle\">{{locationTitle}}</label>\n    </div>\n    <exui-search-location class=\"search-location\"\n                          [form]=\"form\"\n                          [field]=\"field\"\n                          [selectedLocations]=\"selectedLocations\"\n                          [delay]=\"300\"\n                          [disabled]=\"disabled\"\n                          [singleMode]=\"field.maxSelected === 1\"\n                          [bookingCheck]=\"field.bookingCheckType\"\n                          [serviceIds]=\"serviceIds\"\n                          [propertyNameFilter]=\"propertyNameFilter\"\n                          (locationTermSearchInputChanged)=\"onInputChanged($event)\"\n                          (locationSelected)=\"onLocationSelected($event)\"\n                          (searchLocationChanged)=\"onSearchInputChanged()\"\n                          [locationType]=\"'case-management'\">\n    </exui-search-location>\n  </div>\n\n  <div>\n    <a href=\"javascript:void(0)\" (click)=\"addLocation()\" class=\"govuk-button add-location-button\" data-module=\"govuk-button\" *ngIf=\"enableAddLocationButton\">\n      Add location\n    </a>\n  </div>\n\n  <ul class=\"hmcts-filter-tags selection-container\" *ngIf=\"field.maxSelected != 1\">\n    <li class=\"location-selection\"  *ngFor=\"let selection of selectedLocations\">\n      <a class=\"hmcts-filter__tag\" (click)=\"removeLocation(selection)\" href=\"javascript:void(0)\">\n        {{ selection[propertyNameFilter] }}\n      </a>\n    </li>\n  </ul>\n</div>\n", styles: [".add-location-button{margin-top:10px;margin-bottom:0}.search-location__input-container{display:flex}.search-location .auto-complete-container{min-width:unset;width:calc(100% - 4px)}.search-location__input{flex:1 0 auto}.search-location .govuk-button--secondary{background-color:#ddd}\n"], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: SearchLocationComponent, selector: "exui-search-location", inputs: ["form", "field", "disabled", "singleMode", "locationType", "serviceIds", "submitted", "bookingCheck", "selectedLocations", "propertyNameFilter", "delay", "reset"], outputs: ["locationSelected", "locationTermSearchInputChanged", "searchLocationChanged"] }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: FindLocationComponent, decorators: [{
             type: Component,
             args: [{ selector: 'xuilib-find-location', template: "<div class=\"location-picker-custom\">\n  <div class=\"search-location\">\n    <div>\n      <label id=\"input-selected-location-label\" *ngIf=\"locationTitle\">{{locationTitle}}</label>\n    </div>\n    <exui-search-location class=\"search-location\"\n                          [form]=\"form\"\n                          [field]=\"field\"\n                          [selectedLocations]=\"selectedLocations\"\n                          [delay]=\"300\"\n                          [disabled]=\"disabled\"\n                          [singleMode]=\"field.maxSelected === 1\"\n                          [bookingCheck]=\"field.bookingCheckType\"\n                          [serviceIds]=\"serviceIds\"\n                          [propertyNameFilter]=\"propertyNameFilter\"\n                          (locationTermSearchInputChanged)=\"onInputChanged($event)\"\n                          (locationSelected)=\"onLocationSelected($event)\"\n                          (searchLocationChanged)=\"onSearchInputChanged()\"\n                          [locationType]=\"'case-management'\">\n    </exui-search-location>\n  </div>\n\n  <div>\n    <a href=\"javascript:void(0)\" (click)=\"addLocation()\" class=\"govuk-button add-location-button\" data-module=\"govuk-button\" *ngIf=\"enableAddLocationButton\">\n      Add location\n    </a>\n  </div>\n\n  <ul class=\"hmcts-filter-tags selection-container\" *ngIf=\"field.maxSelected != 1\">\n    <li class=\"location-selection\"  *ngFor=\"let selection of selectedLocations\">\n      <a class=\"hmcts-filter__tag\" (click)=\"removeLocation(selection)\" href=\"javascript:void(0)\">\n        {{ selection[propertyNameFilter] }}\n      </a>\n    </li>\n  </ul>\n</div>\n", styles: [".add-location-button{margin-top:10px;margin-bottom:0}.search-location__input-container{display:flex}.search-location .auto-complete-container{min-width:unset;width:calc(100% - 4px)}.search-location__input{flex:1 0 auto}.search-location .govuk-button--secondary{background-color:#ddd}\n"] }]
         }], propDecorators: { locationFieldChanged: [{
@@ -1693,7 +1695,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.7", ngImpor
             }] } });
 
 class TaskNameService {
-    static { this.taskNamesKey = 'taskNames'; }
     constructor(http, sessionStorageService) {
         this.http = http;
         this.sessionStorageService = sessionStorageService;
@@ -1709,10 +1710,11 @@ class TaskNameService {
         }
         return this.http.post(`/workallocation/taskNames`, { service }).pipe(tap(taskNames => this.sessionStorageService.setItem(serviceTaskTypeKey, JSON.stringify(taskNames))));
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: TaskNameService, deps: [{ token: i1$2.HttpClient }, { token: SessionStorageService }], target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: TaskNameService, providedIn: 'root' }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: TaskNameService, decorators: [{
+TaskNameService.taskNamesKey = 'taskNames';
+TaskNameService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: TaskNameService, deps: [{ token: i1$2.HttpClient }, { token: SessionStorageService }], target: i0.ɵɵFactoryTarget.Injectable });
+TaskNameService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: TaskNameService, providedIn: 'root' });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: TaskNameService, decorators: [{
             type: Injectable,
             args: [{
                     providedIn: 'root'
@@ -1778,10 +1780,10 @@ class FindTaskNameComponent {
     onInput() {
         this.taskNameFieldChanged.emit();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: FindTaskNameComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: TaskNameService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.7", type: FindTaskNameComponent, selector: "xuilib-find-task-name", inputs: { title: "title", boldTitle: "boldTitle", subTitle: "subTitle", domain: "domain", findTaskNameGroup: "findTaskNameGroup", selectedTaskName: "selectedTaskName", submitted: "submitted", assignedUser: "assignedUser", placeholderContent: "placeholderContent", isNoResultsShown: "isNoResultsShown", showUpdatedColor: "showUpdatedColor", selectedTaskNames: "selectedTaskNames", errorMessage: "errorMessage", idValue: "idValue", services: "services", disabled: "disabled" }, outputs: { taskNameSelected: "taskNameSelected", taskNameFieldChanged: "taskNameFieldChanged" }, ngImport: i0, template: "<h1 class=\"govuk-heading-l\" *ngIf=\"title && title.length\">\n  <span class=\"govuk-caption-l\">{{title}}</span>\n  {{boldTitle}}\n</h1>\n<div class=\"govuk-form-group\" [formGroup]=\"findTaskNameGroup\"\n     [ngClass]=\"{'form-group-error': findTaskNameGroup.get('findTaskNameControl')?.invalid && submitted}\">\n  <fieldset class=\"govuk-fieldset\" aria-describedby=\"sub-title-hint\">\n    <div id=\"sub-title-hint\" class=\"govuk-hint\" *ngIf=\"subTitle && subTitle.length\">\n      {{subTitle}}\n    </div>\n    <span id=\"validation-error\" class=\"govuk-error-message\" *ngIf=\"findTaskNameGroup && findTaskNameGroup.errors\">\n        <span class=\"govuk-visually-hidden\">Error:</span>{{findTaskNameGroup.errors.error ? findTaskNameGroup.errors.error : errorMessage}}\n    </span>\n    <input id=\"inputSelectTaskName{{idValue}}\" type=\"text\" aria-label=\"select a task name\"\n           formControlName=\"findTaskNameControl\"\n           [matAutocomplete]=\"auto\"\n           class=\"govuk-input govuk-!-width-one-third\"\n           [placeholder]=\"placeholderContent\"\n           [attr.disabled]=\"disabled\"\n           (input)=\"onInput()\">\n    <mat-autocomplete autoActiveFirstOption #auto=\"matAutocomplete\" (optionSelected)=\"onSelectionChange($event.option.value)\">\n      <mat-option *ngFor=\"let option of filteredOptions\"\n                  [value]=\"option\"\n                  [ngClass]=\"{'hide-autocomplete': !showAutocomplete, 'select-option': showUpdatedColor}\">\n                  {{ getTaskTypeName(option) }}\n      </mat-option>\n      <mat-option [ngClass]=\"{'select-option': showUpdatedColor}\" *ngIf=\"isNoResultsShown && !filteredOptions.length && showAutocomplete\">No results found</mat-option>\n    </mat-autocomplete>\n  </fieldset>\n</div>\n", styles: [""], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2$3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2$3.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i2$3.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: i4.MatLegacyAutocomplete, selector: "mat-autocomplete", inputs: ["disableRipple"], exportAs: ["matAutocomplete"] }, { kind: "directive", type: i4.MatLegacyAutocompleteTrigger, selector: "input[matAutocomplete], textarea[matAutocomplete]", exportAs: ["matAutocompleteTrigger"] }, { kind: "component", type: i5.MatLegacyOption, selector: "mat-option", exportAs: ["matOption"] }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: FindTaskNameComponent, decorators: [{
+FindTaskNameComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: FindTaskNameComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: TaskNameService }], target: i0.ɵɵFactoryTarget.Component });
+FindTaskNameComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: FindTaskNameComponent, selector: "xuilib-find-task-name", inputs: { title: "title", boldTitle: "boldTitle", subTitle: "subTitle", domain: "domain", findTaskNameGroup: "findTaskNameGroup", selectedTaskName: "selectedTaskName", submitted: "submitted", assignedUser: "assignedUser", placeholderContent: "placeholderContent", isNoResultsShown: "isNoResultsShown", showUpdatedColor: "showUpdatedColor", selectedTaskNames: "selectedTaskNames", errorMessage: "errorMessage", idValue: "idValue", services: "services", disabled: "disabled" }, outputs: { taskNameSelected: "taskNameSelected", taskNameFieldChanged: "taskNameFieldChanged" }, ngImport: i0, template: "<h1 class=\"govuk-heading-l\" *ngIf=\"title && title.length\">\n  <span class=\"govuk-caption-l\">{{title}}</span>\n  {{boldTitle}}\n</h1>\n<div class=\"govuk-form-group\" [formGroup]=\"findTaskNameGroup\"\n     [ngClass]=\"{'form-group-error': findTaskNameGroup.get('findTaskNameControl')?.invalid && submitted}\">\n  <fieldset class=\"govuk-fieldset\" aria-describedby=\"sub-title-hint\">\n    <div id=\"sub-title-hint\" class=\"govuk-hint\" *ngIf=\"subTitle && subTitle.length\">\n      {{subTitle}}\n    </div>\n    <span id=\"validation-error\" class=\"govuk-error-message\" *ngIf=\"findTaskNameGroup && findTaskNameGroup.errors\">\n        <span class=\"govuk-visually-hidden\">Error:</span>{{findTaskNameGroup.errors.error ? findTaskNameGroup.errors.error : errorMessage}}\n    </span>\n    <input id=\"inputSelectTaskName{{idValue}}\" type=\"text\" aria-label=\"select a task name\"\n           formControlName=\"findTaskNameControl\"\n           [matAutocomplete]=\"auto\"\n           class=\"govuk-input govuk-!-width-one-third\"\n           [placeholder]=\"placeholderContent\"\n           [attr.disabled]=\"disabled\"\n           (input)=\"onInput()\">\n    <mat-autocomplete autoActiveFirstOption #auto=\"matAutocomplete\" (optionSelected)=\"onSelectionChange($event.option.value)\">\n      <mat-option *ngFor=\"let option of filteredOptions\"\n                  [value]=\"option\"\n                  [ngClass]=\"{'hide-autocomplete': !showAutocomplete, 'select-option': showUpdatedColor}\">\n                  {{ getTaskTypeName(option) }}\n      </mat-option>\n      <mat-option [ngClass]=\"{'select-option': showUpdatedColor}\" *ngIf=\"isNoResultsShown && !filteredOptions.length && showAutocomplete\">No results found</mat-option>\n    </mat-autocomplete>\n  </fieldset>\n</div>\n", styles: [""], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2$3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2$3.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i2$3.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: i4.MatLegacyAutocomplete, selector: "mat-autocomplete", inputs: ["disableRipple"], exportAs: ["matAutocomplete"] }, { kind: "directive", type: i4.MatLegacyAutocompleteTrigger, selector: "input[matAutocomplete], textarea[matAutocomplete]", exportAs: ["matAutocompleteTrigger"] }, { kind: "component", type: i5.MatLegacyOption, selector: "mat-option", exportAs: ["matOption"] }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: FindTaskNameComponent, decorators: [{
             type: Component,
             args: [{ selector: 'xuilib-find-task-name', template: "<h1 class=\"govuk-heading-l\" *ngIf=\"title && title.length\">\n  <span class=\"govuk-caption-l\">{{title}}</span>\n  {{boldTitle}}\n</h1>\n<div class=\"govuk-form-group\" [formGroup]=\"findTaskNameGroup\"\n     [ngClass]=\"{'form-group-error': findTaskNameGroup.get('findTaskNameControl')?.invalid && submitted}\">\n  <fieldset class=\"govuk-fieldset\" aria-describedby=\"sub-title-hint\">\n    <div id=\"sub-title-hint\" class=\"govuk-hint\" *ngIf=\"subTitle && subTitle.length\">\n      {{subTitle}}\n    </div>\n    <span id=\"validation-error\" class=\"govuk-error-message\" *ngIf=\"findTaskNameGroup && findTaskNameGroup.errors\">\n        <span class=\"govuk-visually-hidden\">Error:</span>{{findTaskNameGroup.errors.error ? findTaskNameGroup.errors.error : errorMessage}}\n    </span>\n    <input id=\"inputSelectTaskName{{idValue}}\" type=\"text\" aria-label=\"select a task name\"\n           formControlName=\"findTaskNameControl\"\n           [matAutocomplete]=\"auto\"\n           class=\"govuk-input govuk-!-width-one-third\"\n           [placeholder]=\"placeholderContent\"\n           [attr.disabled]=\"disabled\"\n           (input)=\"onInput()\">\n    <mat-autocomplete autoActiveFirstOption #auto=\"matAutocomplete\" (optionSelected)=\"onSelectionChange($event.option.value)\">\n      <mat-option *ngFor=\"let option of filteredOptions\"\n                  [value]=\"option\"\n                  [ngClass]=\"{'hide-autocomplete': !showAutocomplete, 'select-option': showUpdatedColor}\">\n                  {{ getTaskTypeName(option) }}\n      </mat-option>\n      <mat-option [ngClass]=\"{'select-option': showUpdatedColor}\" *ngIf=\"isNoResultsShown && !filteredOptions.length && showAutocomplete\">No results found</mat-option>\n    </mat-autocomplete>\n  </fieldset>\n</div>\n" }]
         }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }, { type: TaskNameService }]; }, propDecorators: { taskNameSelected: [{
@@ -1845,10 +1847,10 @@ class SearchServiceComponent {
             this.optionChanged.emit(selectedService);
         }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: SearchServiceComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.7", type: SearchServiceComponent, selector: "exui-search-service", inputs: { options: "options", selectedOptions: "selectedOptions", disabled: "disabled", showAutocomplete: "showAutocomplete" }, outputs: { optionChanged: "optionChanged" }, ngImport: i0, template: "<div class=\"auto-complete-container\">\n  <input id=\"inputServiceSearch\"\n         class=\"govuk-input\"\n         [(ngModel)]=\"searchTerm\"\n         [matAutocomplete]=\"autoSearchService\"\n         [attr.disabled]=\"disabled\">\n  <mat-autocomplete class=\"mat-autocomplete-panel-extend\" autoActiveFirstOption #autoSearchService=\"matAutocomplete\">\n    <mat-option *ngFor=\"let service of filteredOptions\" (onSelectionChange)=\"onSelectionChanged($event)\" [value]=\"service.label\">\n      {{ service.label }}\n    </mat-option>\n    <mat-option *ngIf=\"!filteredOptions?.length && showAutocomplete\">\n      No results found\n    </mat-option>\n  </mat-autocomplete>\n</div>\n", styles: [".autocomplete__input--show-all-values{padding:5px 34px 5px 5px;cursor:pointer}.autocomplete__dropdown-arrow-down{z-index:-1;display:inline-block;position:absolute;right:8px;width:24px;height:24px;top:10px}.autocomplete__menu{background-color:#fff;border:2px solid #0b0c0c;border-top:0;color:#0b0c0c;margin:0;max-height:342px;overflow-x:hidden;padding:0;width:100%;width:calc(100% - 4px)}.autocomplete__menu--visible{display:block}.autocomplete__menu--hidden{display:none}.autocomplete__menu--overlay{box-shadow:#00000042 0 2px 6px;left:0;position:absolute;top:100%;z-index:100}.autocomplete__menu--inline{position:relative}.autocomplete__option{border-bottom:solid #b1b4b6;border-width:1px 0;cursor:pointer;display:block;position:relative}.autocomplete__option>*{pointer-events:none}.autocomplete__option:first-of-type{border-top-width:0}.autocomplete__option:last-of-type{border-bottom-width:0}.autocomplete__option--odd{background-color:#fafafa}.autocomplete__option--focused,.autocomplete__option:hover{background-color:#1d70b8;border-color:#1d70b8;color:#fff;outline:0}.autocomplete__option--no-results{background-color:#fafafa;color:#646b6f;cursor:not-allowed}.autocomplete__hint,.autocomplete__input,.autocomplete__option{font-size:13px;line-height:1.25}.autocomplete__hint,.autocomplete__option{padding:5px}@media (min-width: 641px){.autocomplete__hint,.autocomplete__input,.autocomplete__option{font-size:13px;line-height:1.31579}}.div-action{display:inline-block}.add-location{display:inline}.remove-location-button{margin:5px}.hide-autocomplete{display:none}.auto-complete-container{min-width:250px;display:inline-block;margin-right:4px}.autocomplete__input{line-height:24px;font-size:19px}\n"], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2$3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i4.MatLegacyAutocomplete, selector: "mat-autocomplete", inputs: ["disableRipple"], exportAs: ["matAutocomplete"] }, { kind: "directive", type: i4.MatLegacyAutocompleteTrigger, selector: "input[matAutocomplete], textarea[matAutocomplete]", exportAs: ["matAutocompleteTrigger"] }, { kind: "component", type: i5.MatLegacyOption, selector: "mat-option", exportAs: ["matOption"] }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: SearchServiceComponent, decorators: [{
+SearchServiceComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SearchServiceComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+SearchServiceComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: SearchServiceComponent, selector: "exui-search-service", inputs: { options: "options", selectedOptions: "selectedOptions", disabled: "disabled", showAutocomplete: "showAutocomplete" }, outputs: { optionChanged: "optionChanged" }, ngImport: i0, template: "<div class=\"auto-complete-container\">\n  <input id=\"inputServiceSearch\"\n         class=\"govuk-input\"\n         [(ngModel)]=\"searchTerm\"\n         [matAutocomplete]=\"autoSearchService\"\n         [attr.disabled]=\"disabled\">\n  <mat-autocomplete class=\"mat-autocomplete-panel-extend\" autoActiveFirstOption #autoSearchService=\"matAutocomplete\">\n    <mat-option *ngFor=\"let service of filteredOptions\" (onSelectionChange)=\"onSelectionChanged($event)\" [value]=\"service.label\">\n      {{ service.label }}\n    </mat-option>\n    <mat-option *ngIf=\"!filteredOptions?.length && showAutocomplete\">\n      No results found\n    </mat-option>\n  </mat-autocomplete>\n</div>\n", styles: [".autocomplete__input--show-all-values{padding:5px 34px 5px 5px;cursor:pointer}.autocomplete__dropdown-arrow-down{z-index:-1;display:inline-block;position:absolute;right:8px;width:24px;height:24px;top:10px}.autocomplete__menu{background-color:#fff;border:2px solid #0b0c0c;border-top:0;color:#0b0c0c;margin:0;max-height:342px;overflow-x:hidden;padding:0;width:100%;width:calc(100% - 4px)}.autocomplete__menu--visible{display:block}.autocomplete__menu--hidden{display:none}.autocomplete__menu--overlay{box-shadow:#00000042 0 2px 6px;left:0;position:absolute;top:100%;z-index:100}.autocomplete__menu--inline{position:relative}.autocomplete__option{border-bottom:solid #b1b4b6;border-width:1px 0;cursor:pointer;display:block;position:relative}.autocomplete__option>*{pointer-events:none}.autocomplete__option:first-of-type{border-top-width:0}.autocomplete__option:last-of-type{border-bottom-width:0}.autocomplete__option--odd{background-color:#fafafa}.autocomplete__option--focused,.autocomplete__option:hover{background-color:#1d70b8;border-color:#1d70b8;color:#fff;outline:0}.autocomplete__option--no-results{background-color:#fafafa;color:#646b6f;cursor:not-allowed}.autocomplete__hint,.autocomplete__input,.autocomplete__option{font-size:13px;line-height:1.25}.autocomplete__hint,.autocomplete__option{padding:5px}@media (min-width: 641px){.autocomplete__hint,.autocomplete__input,.autocomplete__option{font-size:13px;line-height:1.31579}}.div-action{display:inline-block}.add-location{display:inline}.remove-location-button{margin:5px}.hide-autocomplete{display:none}.auto-complete-container{min-width:250px;display:inline-block;margin-right:4px}.autocomplete__input{line-height:24px;font-size:19px}\n"], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2$3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i4.MatLegacyAutocomplete, selector: "mat-autocomplete", inputs: ["disableRipple"], exportAs: ["matAutocomplete"] }, { kind: "directive", type: i4.MatLegacyAutocompleteTrigger, selector: "input[matAutocomplete], textarea[matAutocomplete]", exportAs: ["matAutocompleteTrigger"] }, { kind: "component", type: i5.MatLegacyOption, selector: "mat-option", exportAs: ["matOption"] }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SearchServiceComponent, decorators: [{
             type: Component,
             args: [{ selector: 'exui-search-service', template: "<div class=\"auto-complete-container\">\n  <input id=\"inputServiceSearch\"\n         class=\"govuk-input\"\n         [(ngModel)]=\"searchTerm\"\n         [matAutocomplete]=\"autoSearchService\"\n         [attr.disabled]=\"disabled\">\n  <mat-autocomplete class=\"mat-autocomplete-panel-extend\" autoActiveFirstOption #autoSearchService=\"matAutocomplete\">\n    <mat-option *ngFor=\"let service of filteredOptions\" (onSelectionChange)=\"onSelectionChanged($event)\" [value]=\"service.label\">\n      {{ service.label }}\n    </mat-option>\n    <mat-option *ngIf=\"!filteredOptions?.length && showAutocomplete\">\n      No results found\n    </mat-option>\n  </mat-autocomplete>\n</div>\n", styles: [".autocomplete__input--show-all-values{padding:5px 34px 5px 5px;cursor:pointer}.autocomplete__dropdown-arrow-down{z-index:-1;display:inline-block;position:absolute;right:8px;width:24px;height:24px;top:10px}.autocomplete__menu{background-color:#fff;border:2px solid #0b0c0c;border-top:0;color:#0b0c0c;margin:0;max-height:342px;overflow-x:hidden;padding:0;width:100%;width:calc(100% - 4px)}.autocomplete__menu--visible{display:block}.autocomplete__menu--hidden{display:none}.autocomplete__menu--overlay{box-shadow:#00000042 0 2px 6px;left:0;position:absolute;top:100%;z-index:100}.autocomplete__menu--inline{position:relative}.autocomplete__option{border-bottom:solid #b1b4b6;border-width:1px 0;cursor:pointer;display:block;position:relative}.autocomplete__option>*{pointer-events:none}.autocomplete__option:first-of-type{border-top-width:0}.autocomplete__option:last-of-type{border-bottom-width:0}.autocomplete__option--odd{background-color:#fafafa}.autocomplete__option--focused,.autocomplete__option:hover{background-color:#1d70b8;border-color:#1d70b8;color:#fff;outline:0}.autocomplete__option--no-results{background-color:#fafafa;color:#646b6f;cursor:not-allowed}.autocomplete__hint,.autocomplete__input,.autocomplete__option{font-size:13px;line-height:1.25}.autocomplete__hint,.autocomplete__option{padding:5px}@media (min-width: 641px){.autocomplete__hint,.autocomplete__input,.autocomplete__option{font-size:13px;line-height:1.31579}}.div-action{display:inline-block}.add-location{display:inline}.remove-location-button{margin:5px}.hide-autocomplete{display:none}.auto-complete-container{min-width:250px;display:inline-block;margin-right:4px}.autocomplete__input{line-height:24px;font-size:19px}\n"] }]
         }], propDecorators: { options: [{
@@ -1952,10 +1954,10 @@ class FindServiceComponent {
     ngOnDestroy() {
         this.formSubmissionEventSubscription?.unsubscribe();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: FindServiceComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.7", type: FindServiceComponent, selector: "xuilib-find-service", inputs: { field: "field", serviceTitle: "serviceTitle", form: "form", disabled: "disabled", formSubmissionEvent$: "formSubmissionEvent$" }, outputs: { serviceFieldChanged: "serviceFieldChanged" }, viewQueries: [{ propertyName: "searchServiceComponent", first: true, predicate: SearchServiceComponent, descendants: true, static: true }], ngImport: i0, template: "<div class=\"service-picker-custom\">\n  <div class=\"search-service\">\n    <div class=\"govuk-body\">\n      <label id=\"selectServiceSearch-label\" for=\"serviceSearch__select\" *ngIf=\"serviceTitle\">\n        {{ serviceTitle }}\n      </label>\n    </div>\n    <div class=\"search-service__input-container\">\n      <exui-search-service class=\"search-service__input\"\n        [options]=\"field.options\"\n        [selectedOptions]=\"selectedServices\"\n        [disabled]=\"disabled\"\n        (optionChanged)=\"onOptionSelected($event)\">\n      </exui-search-service>\n      <a href=\"javascript:void(0)\" (click)=\"addOption(tempSelectedService)\"\n        class=\"govuk-button govuk-button--secondary govuk-!-margin-bottom-0\" data-module=\"govuk-button\"\n        *ngIf=\"field?.enableAddButton\" id=\"add-service\">\n        Add\n      </a>\n    </div>\n  </div>\n  <ul class=\"hmcts-filter-tags selection-container\" *ngIf=\"field.maxSelected != 1\">\n    <li class=\"location-selection\" *ngFor=\"let selection of selectedServices\">\n      <a class=\"hmcts-filter__tag\" (click)=\"removeOption(selection)\" href=\"javascript:void(0)\">\n        {{ selection.label }}\n      </a>\n    </li>\n  </ul>\n</div>\n", styles: ["#add-service{background-color:#ddd}\n"], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: SearchServiceComponent, selector: "exui-search-service", inputs: ["options", "selectedOptions", "disabled", "showAutocomplete"], outputs: ["optionChanged"] }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: FindServiceComponent, decorators: [{
+FindServiceComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: FindServiceComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+FindServiceComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: FindServiceComponent, selector: "xuilib-find-service", inputs: { field: "field", serviceTitle: "serviceTitle", form: "form", disabled: "disabled", formSubmissionEvent$: "formSubmissionEvent$" }, outputs: { serviceFieldChanged: "serviceFieldChanged" }, viewQueries: [{ propertyName: "searchServiceComponent", first: true, predicate: SearchServiceComponent, descendants: true, static: true }], ngImport: i0, template: "<div class=\"service-picker-custom\">\n  <div class=\"search-service\">\n    <div class=\"govuk-body\">\n      <label id=\"selectServiceSearch-label\" for=\"serviceSearch__select\" *ngIf=\"serviceTitle\">\n        {{ serviceTitle }}\n      </label>\n    </div>\n    <div class=\"search-service__input-container\">\n      <exui-search-service class=\"search-service__input\"\n        [options]=\"field.options\"\n        [selectedOptions]=\"selectedServices\"\n        [disabled]=\"disabled\"\n        (optionChanged)=\"onOptionSelected($event)\">\n      </exui-search-service>\n      <a href=\"javascript:void(0)\" (click)=\"addOption(tempSelectedService)\"\n        class=\"govuk-button govuk-button--secondary govuk-!-margin-bottom-0\" data-module=\"govuk-button\"\n        *ngIf=\"field?.enableAddButton\" id=\"add-service\">\n        Add\n      </a>\n    </div>\n  </div>\n  <ul class=\"hmcts-filter-tags selection-container\" *ngIf=\"field.maxSelected != 1\">\n    <li class=\"location-selection\" *ngFor=\"let selection of selectedServices\">\n      <a class=\"hmcts-filter__tag\" (click)=\"removeOption(selection)\" href=\"javascript:void(0)\">\n        {{ selection.label }}\n      </a>\n    </li>\n  </ul>\n</div>\n", styles: ["#add-service{background-color:#ddd}\n"], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: SearchServiceComponent, selector: "exui-search-service", inputs: ["options", "selectedOptions", "disabled", "showAutocomplete"], outputs: ["optionChanged"] }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: FindServiceComponent, decorators: [{
             type: Component,
             args: [{ selector: 'xuilib-find-service', template: "<div class=\"service-picker-custom\">\n  <div class=\"search-service\">\n    <div class=\"govuk-body\">\n      <label id=\"selectServiceSearch-label\" for=\"serviceSearch__select\" *ngIf=\"serviceTitle\">\n        {{ serviceTitle }}\n      </label>\n    </div>\n    <div class=\"search-service__input-container\">\n      <exui-search-service class=\"search-service__input\"\n        [options]=\"field.options\"\n        [selectedOptions]=\"selectedServices\"\n        [disabled]=\"disabled\"\n        (optionChanged)=\"onOptionSelected($event)\">\n      </exui-search-service>\n      <a href=\"javascript:void(0)\" (click)=\"addOption(tempSelectedService)\"\n        class=\"govuk-button govuk-button--secondary govuk-!-margin-bottom-0\" data-module=\"govuk-button\"\n        *ngIf=\"field?.enableAddButton\" id=\"add-service\">\n        Add\n      </a>\n    </div>\n  </div>\n  <ul class=\"hmcts-filter-tags selection-container\" *ngIf=\"field.maxSelected != 1\">\n    <li class=\"location-selection\" *ngFor=\"let selection of selectedServices\">\n      <a class=\"hmcts-filter__tag\" (click)=\"removeOption(selection)\" href=\"javascript:void(0)\">\n        {{ selection.label }}\n      </a>\n    </li>\n  </ul>\n</div>\n", styles: ["#add-service{background-color:#ddd}\n"] }]
         }], propDecorators: { field: [{
@@ -1980,10 +1982,10 @@ class CapitalizePipe {
         const lowerCaseString = value.toLowerCase();
         return lowerCaseString.charAt(0).toUpperCase() + lowerCaseString.slice(1);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: CapitalizePipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe }); }
-    static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "16.1.7", ngImport: i0, type: CapitalizePipe, name: "capitalize" }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: CapitalizePipe, decorators: [{
+CapitalizePipe.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: CapitalizePipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe });
+CapitalizePipe.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "15.2.9", ngImport: i0, type: CapitalizePipe, name: "capitalize" });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: CapitalizePipe, decorators: [{
             type: Pipe,
             args: [{ name: 'capitalize' }]
         }] });
@@ -2599,10 +2601,10 @@ class GenericFilterComponent {
         });
         return sortedResults;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: GenericFilterComponent, deps: [{ token: FilterService }, { token: i2$3.UntypedFormBuilder }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.7", type: GenericFilterComponent, selector: "xuilib-generic-filter", inputs: { config: "config", settings: "settings" }, ngImport: i0, template: "<form [formGroup]=\"form\" (ngSubmit)=\"applyFilter(form)\">\n  <div class=\"contain-classes\" *ngFor=\"let field of config.fields\">\n    <hr *ngIf=\"field.lineBreakBefore\" class=\"govuk-section-break govuk-section-break--visible elevated-break\">\n    <ng-container [ngSwitch]=\"field.type\">\n      <ng-container *ngSwitchCase=\"'group-title'\">\n        <div [class]=\"field.titleClasses ? field.titleClasses: 'govuk-label govuk-label--m govuk-!-margin-bottom-4'\">\n          {{ field.name | capitalize }}\n        </div>\n    </ng-container>\n      <ng-container *ngSwitchDefault>\n    <div class=\"govuk-form-group xui-generic-filter\"\n         [hidden]=\"hidden(field, form)\"\n         [id]=\"field.name\"\n         [ngClass]=\"{'form-group-error': submitted && (form.get(field.name).errors?.required || form.get(field.name).errors?.minlength || form.get(field.name).errors?.maxLength)}\">\n        <div *ngIf=\"field.title\" class=\"xui-generic-filter__field-title\">\n          <h3 [class]=\"field.titleClasses ? field.titleClasses : 'govuk-heading-s'\" style=\"margin-bottom: 0!important\">\n            {{field.title | capitalize}}\n          </h3>\n          <div *ngIf=\"field?.titleHint\" class=\"govuk-!-margin-left-2\">\n            {{ field.titleHint }}\n          </div>\n        </div>\n      <p class=\"govuk-body\" *ngIf=\"field.subTitle\">{{field.subTitle}}</p>\n      <div *ngIf=\"field.hintText\"\n        [id]=\"field.hintText + '-hint'\" class=\"govuk-hint\">\n        {{ field.hintText }}\n      </div>\n      <span [id]=\"field.name + '-error'\" class=\"govuk-error-message\" *ngIf=\"field.displayMinSelectedError && submitted && (form.get(field.name).errors?.required || form.get(field.name).errors?.minlength)\">\n        <span class=\"govuk-visually-hidden\">Error:</span> {{field.minSelectedError}}\n      </span>\n      <span [id]=\"field.name + '-error'\" class=\"govuk-error-message\" *ngIf=\"field.displayMaxSelectedError && submitted && form.get(field.name).errors?.maxLength\">\n        <span class=\"govuk-visually-hidden\">Error:</span> {{field.maxSelectedError}}\n      </span>\n      <span [id]=\"field.name + '-error'\" class=\"govuk-error-message\"\n        *ngIf=\"field.emailError && submitted && form.get(field.name).errors?.email\">\n        <span class=\"govuk-visually-hidden\">Error:</span> {{field.emailError}}\n      </span>\n        <div class=\"govuk-body\"  [class.govuk-body--maxWidth480px]=\"field.maxWidth480px\" [ngSwitch]=\"field.type\">\n        <ng-container *ngSwitchCase=\"'select'\">\n          <select class=\"govuk-select\" (change)=\"fieldChanged(field, form)\" [attr.disabled]=\"disabled(field, form)\" [name]=\"'select_' + field.name\" [id]=\"'select_' + field.name\" [formControlName]=\"field.name\">\n            <option disabled selected hidden value=\"\">{{field.disabledText}}</option>\n            <option *ngIf=\"field.defaultOption\" [attr.selected]=\"true\" [value]=\"field.defaultOption.key\">{{field.defaultOption.label}}</option>\n            <option class=\"govuk-radios__item\" *ngFor=\"let item of field.options\" [value]=\"item.key\">{{item.label}}</option>\n          </select>\n        </ng-container>\n        <ng-container *ngSwitchCase=\"'group-select'\">\n          <select class=\"govuk-select\" (change)=\"fieldChanged(field, form)\" [attr.disabled]=\"disabled(field, form)\" [name]=\"'select_' + field.name\" [id]=\"'select_' + field.name\" [formControlName]=\"field.name\">\n            <option disabled selected hidden value=\"\">{{field.disabledText}}</option>\n            <option *ngIf=\"field.defaultOption\" selected [value]=\"field.defaultOption.key\">{{field.defaultOption.label}}</option>\n            <optgroup *ngFor = 'let grp of filteredSkillsByServices' label=\"{{grp.group | titlecase}}\">\n              <option *ngFor = 'let item of grp.options' [value]=\"item.key\">{{item.label}}</option>\n            </optgroup>\n          </select>\n        </ng-container>\n        <ng-container *ngSwitchCase=\"'checkbox'\">\n          <div class=\"govuk-checkboxes govuk-checkboxes--small\" [formGroupName]=\"field.name\" [attr.field]=\"field.name\" [id]=\"'checkbox_' + field.name\">\n            <div *ngFor=\"let item of field.options; let i = index\" class=\"govuk-checkboxes__item\">\n              <input type=\"checkbox\" class=\"govuk-checkboxes__input\"\n                     [attr.disabled]=\"disabled(field, form)\"\n                     [formControlName]=\"i\"\n                     (change)=\"toggleSelectAll($event, form, item, field)\"\n                     [value]=\"item.key\" [id]=\"'checkbox_' + field.name + item.key\"\n                     [name]=\"'checkbox_' + field.name + item.key\"\n              />\n              <label\n                [for]=\"'checkbox_' + field.name + item.key\"\n                class=\"govuk-label govuk-checkboxes__label\"\n                [ngClass]=\"{'govuk-!-font-weight-bold': item.selectAll}\"\n              >{{item.label}}</label>\n            </div>\n          </div>\n        </ng-container>\n        <ng-container *ngSwitchCase=\"'nested-checkbox'\">\n          <div class=\"govuk-checkboxes govuk-checkboxes--small\" [formGroupName]=\"field.name\" [attr.field]=\"field.name\" [id]=\"'checkbox_' + field.name\">\n            <div *ngFor=\"let item of filteredSkillsByServicesCheckbox; let i = index\" class=\"govuk-checkboxes__item\">\n              <input type=\"checkbox\" class=\"govuk-checkboxes__input\"\n                     [attr.disabled]=\"disabled(field, form)\"\n                     [formControlName]=\"i\"\n                     (change)=\"toggleSelectAll($event, form, item, field)\"\n                     [value]=\"item.key\" [id]=\"'checkbox_' + field.name + item.key\"\n                     [name]=\"'checkbox_' + field.name + item.key\"\n              />\n              <label\n                [for]=\"'checkbox_' + field.name + item.key\"\n                class=\"govuk-label govuk-checkboxes__label\"\n                [ngClass]=\"{'govuk-!-font-weight-bold': item.selectAll}\"\n              >{{item.label}}</label>\n            </div>\n          </div>\n        </ng-container>\n        <ng-container *ngSwitchCase=\"'checkbox-large'\">\n          <div class=\"govuk-checkboxes\" [formGroupName]=\"field.name\" [attr.field]=\"field.name\" [id]=\"'checkbox_' + field.name\">\n            <div *ngFor=\"let item of field.options; let i = index\" class=\"govuk-checkboxes__item\">\n              <input type=\"checkbox\" class=\"govuk-checkboxes__input\"\n                     [attr.disabled]=\"disabled(field, form)\"\n                     [formControlName]=\"i\"\n                     (change)=\"toggleSelectAll($event, form, item, field)\"\n                     [value]=\"item.key\" [id]=\"'checkbox_' + field.name + item.key\"\n                     [name]=\"'checkbox_' + field.name + item.key\"\n              />\n              <label\n                [for]=\"'checkbox_' + field.name + item.key\"\n                class=\"govuk-label govuk-checkboxes__label\"\n                [ngClass]=\"{'govuk-!-font-weight-bold': item.selectAll}\"\n              >{{item.label}}</label>\n            </div>\n          </div>\n        </ng-container>\n        <ng-container *ngSwitchCase=\"'radio'\">\n          <div class=\"govuk-radios\">\n            <div *ngFor=\"let item of field.options\" class=\"govuk-radios__item\">\n              <input type=\"radio\"\n                     [formControlName]=\"field.name\"\n                     [id]=\"'radio_' + item.key\"\n                     [attr.disabled]=\"disabled(field, form)\"\n                     [checked]=\"item.key === form.get(field.name).value\"\n                     class=\"govuk-radios__input\"\n                     [value]=\"item.key\"\n                     (change)=\"fieldChanged(field, form)\"\n              />\n              <label [for]=\"'radio_' + item.key\" class=\"govuk-label govuk-radios__label\">{{item.label}}</label>\n            </div>\n          </div>\n        </ng-container>\n        <ng-container *ngSwitchCase=\"'find-person'\">\n          <xuilib-find-person subTitle=\"\" (personSelected)=\"updatePersonControls($event, field)\"\n                              (personFieldChanged)=\"inputChanged(field)\"\n                              [submitted]=\"submitted\"\n                              [disabled]=\"disabled(field, form)\"\n                              [domain]=\"form.get(field.domainField)?.value\"\n                              [findPersonGroup]=\"form\"\n                              [selectedPerson]=\"form.get(field.name)?.value?.email\"\n                              [userIncluded]=\"false\"\n                              [placeholderContent]=\"field.placeholderContent ? field.placeholderContent : ''\"\n                              [services]=\"form.get(field.servicesField)?.value\"\n          ></xuilib-find-person>\n        </ng-container>\n        <ng-container *ngSwitchCase=\"'find-location'\">\n          <xuilib-find-location (locationFieldChanged)=\"inputChanged(field)\"\n                                [form]=\"form\"\n                                [fields]=\"config.fields\"\n                                [locationTitle]=\"field.locationTitle\"\n                                [enableAddLocationButton]=\"field.enableAddButton\"\n                                [disabled]=\"disabled(field, form)\"\n                                [disableInputField]=\"field.disable\"\n                                [submitted]=\"submitted\"\n                                [field]=\"field\"\n                                [services]=\"form.get(field.findLocationField)?.value\"\n                                [formSubmissionEvent$]=\"formSubmissionEvent$\"\n          ></xuilib-find-location>\n        </ng-container>\n        <ng-container *ngSwitchCase=\"'find-task-name'\">\n          <xuilib-find-task-name subTitle=\"\" (taskNameSelected)=\"updateTaskNameControls($event, field)\"\n                              (taskNameFieldChanged)=\"inputChanged(field)\"\n                              [submitted]=\"submitted\"\n                              [disabled]=\"disabled(field, form)\"\n                              [domain]=\"form.get(field.domainField)?.value\"\n                              [findTaskNameGroup]=\"form\"\n                              [selectedTaskName]=\"form.get(field.name)?.value?.task_type_name\"\n                              [placeholderContent]=\"field.placeholderContent ? field.placeholderContent : ''\"\n                              [services]=\"form.get(field.servicesField)?.value\"\n          ></xuilib-find-task-name>\n        </ng-container>\n        <ng-container *ngSwitchCase=\"'find-service'\">\n          <xuilib-find-service (serviceFieldChanged)=\"inputServiceChanged(field)\"\n                               [field]=\"field\"\n                               [form]=\"form\"\n                               [formSubmissionEvent$]=\"formSubmissionEvent$\"\n                               [disabled]=\"disabled(field, form)\">\n          </xuilib-find-service>\n        </ng-container>\n        <ng-container *ngSwitchCase=\"'text-input'\">\n          <input class=\"govuk-input\" type=\"text\"\n                 [formControlName]=\"field.name\"\n                 [id]=\"field.name\"\n                 [attr.disabled]=\"disabled(field, form)\"\n                 (change)=\"fieldChanged(field, form)\"\n                 [attr.maxlength]=\"field.maxlength ? field.maxlength : null\"\n                 [readonly]=\"field.readonly\"\n          />\n        </ng-container>\n        <ng-container *ngSwitchCase=\"'email-input'\">\n          <input class=\"govuk-input\" type=\"email\"\n                 [formControlName]=\"field.name\"\n                 [id]=\"field.name\"\n                 [attr.disabled]=\"disabled(field, form)\"\n                 (change)=\"fieldChanged(field, form)\"\n                 [readonly]=\"field.readonly\"\n          />\n        </ng-container>\n      </div>\n    </div>\n  </ng-container>\n</ng-container>\n  </div>\n  <hr class=\"govuk-section-break govuk-section-break--m govuk-section-break--visible\"/>\n  <div class=\"govuk-grid-row\">\n    <div class=\"govuk-grid-column-full\">\n      <button\n        class=\"govuk-button govuk-!-margin-right-1 govuk-!-margin-bottom-0\"\n        type=\"submit\"\n        id=\"applyFilter\"\n        [disabled]=\"config.enableDisabledButton && form.invalid\"\n      >{{config.applyButtonText || 'Apply'}}</button>\n      <button *ngIf=\"config.showCancelFilterButton\"\n        class=\"govuk-button govuk-button--secondary govuk-!-margin-bottom-0\"\n        type=\"button\"\n        id=\"cancelFilter\"\n        (click)=\"cancelFilter()\">{{ config.cancelButtonText || 'Cancel'}}</button>\n    </div>\n  </div>\n</form>\n", styles: [".contain-classes .elevated-break{margin-bottom:20px}@media (min-width: 40.0625em){.contain-classes .elevated-break{margin-bottom:30px}}.contain-classes .govuk-body--maxWidth480px{max-width:480px}.contain-classes .xui-generic-filter .select-all{margin-bottom:10px}.contain-classes .xui-generic-filter .govuk-checkboxes{display:flex;flex-direction:column;flex-wrap:wrap}.contain-classes .xui-generic-filter .govuk-checkboxes>div{flex-grow:1;flex-shrink:0}.contain-classes .xui-generic-filter__field-title{display:flex;align-items:center;margin-bottom:10px}.contain-classes .govuk-select{width:100%}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i1.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "directive", type: i1.NgSwitchDefault, selector: "[ngSwitchDefault]" }, { kind: "directive", type: i2$3.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i2$3.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i2$3.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i2$3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2$3.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { kind: "directive", type: i2$3.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { kind: "directive", type: i2$3.RadioControlValueAccessor, selector: "input[type=radio][formControlName],input[type=radio][formControl],input[type=radio][ngModel]", inputs: ["name", "formControlName", "value"] }, { kind: "directive", type: i2$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2$3.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i2$3.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: i2$3.FormGroupName, selector: "[formGroupName]", inputs: ["formGroupName"] }, { kind: "component", type: FindPersonComponent, selector: "xuilib-find-person", inputs: ["title", "boldTitle", "subTitle", "domain", "findPersonGroup", "selectedPerson", "submitted", "userIncluded", "assignedUser", "placeholderContent", "isNoResultsShown", "showUpdatedColor", "selectedPersons", "errorMessage", "idValue", "services", "disabled"], outputs: ["personSelected", "personFieldChanged"] }, { kind: "component", type: FindLocationComponent, selector: "xuilib-find-location", inputs: ["submitted", "enableAddLocationButton", "form", "field", "fields", "locationTitle", "disableInputField", "formSubmissionEvent$", "disabled", "services"], outputs: ["locationFieldChanged"] }, { kind: "component", type: FindTaskNameComponent, selector: "xuilib-find-task-name", inputs: ["title", "boldTitle", "subTitle", "domain", "findTaskNameGroup", "selectedTaskName", "submitted", "assignedUser", "placeholderContent", "isNoResultsShown", "showUpdatedColor", "selectedTaskNames", "errorMessage", "idValue", "services", "disabled"], outputs: ["taskNameSelected", "taskNameFieldChanged"] }, { kind: "component", type: FindServiceComponent, selector: "xuilib-find-service", inputs: ["field", "serviceTitle", "form", "disabled", "formSubmissionEvent$"], outputs: ["serviceFieldChanged"] }, { kind: "pipe", type: i1.TitleCasePipe, name: "titlecase" }, { kind: "pipe", type: CapitalizePipe, name: "capitalize" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: GenericFilterComponent, decorators: [{
+GenericFilterComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: GenericFilterComponent, deps: [{ token: FilterService }, { token: i2$3.UntypedFormBuilder }], target: i0.ɵɵFactoryTarget.Component });
+GenericFilterComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: GenericFilterComponent, selector: "xuilib-generic-filter", inputs: { config: "config", settings: "settings" }, ngImport: i0, template: "<form [formGroup]=\"form\" (ngSubmit)=\"applyFilter(form)\">\n  <div class=\"contain-classes\" *ngFor=\"let field of config.fields\">\n    <hr *ngIf=\"field.lineBreakBefore\" class=\"govuk-section-break govuk-section-break--visible elevated-break\">\n    <ng-container [ngSwitch]=\"field.type\">\n      <ng-container *ngSwitchCase=\"'group-title'\">\n        <div [class]=\"field.titleClasses ? field.titleClasses: 'govuk-label govuk-label--m govuk-!-margin-bottom-4'\">\n          {{ field.name | capitalize }}\n        </div>\n    </ng-container>\n      <ng-container *ngSwitchDefault>\n    <div class=\"govuk-form-group xui-generic-filter\"\n         [hidden]=\"hidden(field, form)\"\n         [id]=\"field.name\"\n         [ngClass]=\"{'form-group-error': submitted && (form.get(field.name).errors?.required || form.get(field.name).errors?.minlength || form.get(field.name).errors?.maxLength)}\">\n        <div *ngIf=\"field.title\" class=\"xui-generic-filter__field-title\">\n          <h3 [class]=\"field.titleClasses ? field.titleClasses : 'govuk-heading-s'\" style=\"margin-bottom: 0!important\">\n            {{field.title | capitalize}}\n          </h3>\n          <div *ngIf=\"field?.titleHint\" class=\"govuk-!-margin-left-2\">\n            {{ field.titleHint }}\n          </div>\n        </div>\n      <p class=\"govuk-body\" *ngIf=\"field.subTitle\">{{field.subTitle}}</p>\n      <div *ngIf=\"field.hintText\"\n        [id]=\"field.hintText + '-hint'\" class=\"govuk-hint\">\n        {{ field.hintText }}\n      </div>\n      <span [id]=\"field.name + '-error'\" class=\"govuk-error-message\" *ngIf=\"field.displayMinSelectedError && submitted && (form.get(field.name).errors?.required || form.get(field.name).errors?.minlength)\">\n        <span class=\"govuk-visually-hidden\">Error:</span> {{field.minSelectedError}}\n      </span>\n      <span [id]=\"field.name + '-error'\" class=\"govuk-error-message\" *ngIf=\"field.displayMaxSelectedError && submitted && form.get(field.name).errors?.maxLength\">\n        <span class=\"govuk-visually-hidden\">Error:</span> {{field.maxSelectedError}}\n      </span>\n      <span [id]=\"field.name + '-error'\" class=\"govuk-error-message\"\n        *ngIf=\"field.emailError && submitted && form.get(field.name).errors?.email\">\n        <span class=\"govuk-visually-hidden\">Error:</span> {{field.emailError}}\n      </span>\n        <div class=\"govuk-body\"  [class.govuk-body--maxWidth480px]=\"field.maxWidth480px\" [ngSwitch]=\"field.type\">\n        <ng-container *ngSwitchCase=\"'select'\">\n          <select class=\"govuk-select\" (change)=\"fieldChanged(field, form)\" [attr.disabled]=\"disabled(field, form)\" [name]=\"'select_' + field.name\" [id]=\"'select_' + field.name\" [formControlName]=\"field.name\">\n            <option disabled selected hidden value=\"\">{{field.disabledText}}</option>\n            <option *ngIf=\"field.defaultOption\" [attr.selected]=\"true\" [value]=\"field.defaultOption.key\">{{field.defaultOption.label}}</option>\n            <option class=\"govuk-radios__item\" *ngFor=\"let item of field.options\" [value]=\"item.key\">{{item.label}}</option>\n          </select>\n        </ng-container>\n        <ng-container *ngSwitchCase=\"'group-select'\">\n          <select class=\"govuk-select\" (change)=\"fieldChanged(field, form)\" [attr.disabled]=\"disabled(field, form)\" [name]=\"'select_' + field.name\" [id]=\"'select_' + field.name\" [formControlName]=\"field.name\">\n            <option disabled selected hidden value=\"\">{{field.disabledText}}</option>\n            <option *ngIf=\"field.defaultOption\" selected [value]=\"field.defaultOption.key\">{{field.defaultOption.label}}</option>\n            <optgroup *ngFor = 'let grp of filteredSkillsByServices' label=\"{{grp.group | titlecase}}\">\n              <option *ngFor = 'let item of grp.options' [value]=\"item.key\">{{item.label}}</option>\n            </optgroup>\n          </select>\n        </ng-container>\n        <ng-container *ngSwitchCase=\"'checkbox'\">\n          <div class=\"govuk-checkboxes govuk-checkboxes--small\" [formGroupName]=\"field.name\" [attr.field]=\"field.name\" [id]=\"'checkbox_' + field.name\">\n            <div *ngFor=\"let item of field.options; let i = index\" class=\"govuk-checkboxes__item\">\n              <input type=\"checkbox\" class=\"govuk-checkboxes__input\"\n                     [attr.disabled]=\"disabled(field, form)\"\n                     [formControlName]=\"i\"\n                     (change)=\"toggleSelectAll($event, form, item, field)\"\n                     [value]=\"item.key\" [id]=\"'checkbox_' + field.name + item.key\"\n                     [name]=\"'checkbox_' + field.name + item.key\"\n              />\n              <label\n                [for]=\"'checkbox_' + field.name + item.key\"\n                class=\"govuk-label govuk-checkboxes__label\"\n                [ngClass]=\"{'govuk-!-font-weight-bold': item.selectAll}\"\n              >{{item.label}}</label>\n            </div>\n          </div>\n        </ng-container>\n        <ng-container *ngSwitchCase=\"'nested-checkbox'\">\n          <div class=\"govuk-checkboxes govuk-checkboxes--small\" [formGroupName]=\"field.name\" [attr.field]=\"field.name\" [id]=\"'checkbox_' + field.name\">\n            <div *ngFor=\"let item of filteredSkillsByServicesCheckbox; let i = index\" class=\"govuk-checkboxes__item\">\n              <input type=\"checkbox\" class=\"govuk-checkboxes__input\"\n                     [attr.disabled]=\"disabled(field, form)\"\n                     [formControlName]=\"i\"\n                     (change)=\"toggleSelectAll($event, form, item, field)\"\n                     [value]=\"item.key\" [id]=\"'checkbox_' + field.name + item.key\"\n                     [name]=\"'checkbox_' + field.name + item.key\"\n              />\n              <label\n                [for]=\"'checkbox_' + field.name + item.key\"\n                class=\"govuk-label govuk-checkboxes__label\"\n                [ngClass]=\"{'govuk-!-font-weight-bold': item.selectAll}\"\n              >{{item.label}}</label>\n            </div>\n          </div>\n        </ng-container>\n        <ng-container *ngSwitchCase=\"'checkbox-large'\">\n          <div class=\"govuk-checkboxes\" [formGroupName]=\"field.name\" [attr.field]=\"field.name\" [id]=\"'checkbox_' + field.name\">\n            <div *ngFor=\"let item of field.options; let i = index\" class=\"govuk-checkboxes__item\">\n              <input type=\"checkbox\" class=\"govuk-checkboxes__input\"\n                     [attr.disabled]=\"disabled(field, form)\"\n                     [formControlName]=\"i\"\n                     (change)=\"toggleSelectAll($event, form, item, field)\"\n                     [value]=\"item.key\" [id]=\"'checkbox_' + field.name + item.key\"\n                     [name]=\"'checkbox_' + field.name + item.key\"\n              />\n              <label\n                [for]=\"'checkbox_' + field.name + item.key\"\n                class=\"govuk-label govuk-checkboxes__label\"\n                [ngClass]=\"{'govuk-!-font-weight-bold': item.selectAll}\"\n              >{{item.label}}</label>\n            </div>\n          </div>\n        </ng-container>\n        <ng-container *ngSwitchCase=\"'radio'\">\n          <div class=\"govuk-radios\">\n            <div *ngFor=\"let item of field.options\" class=\"govuk-radios__item\">\n              <input type=\"radio\"\n                     [formControlName]=\"field.name\"\n                     [id]=\"'radio_' + item.key\"\n                     [attr.disabled]=\"disabled(field, form)\"\n                     [checked]=\"item.key === form.get(field.name).value\"\n                     class=\"govuk-radios__input\"\n                     [value]=\"item.key\"\n                     (change)=\"fieldChanged(field, form)\"\n              />\n              <label [for]=\"'radio_' + item.key\" class=\"govuk-label govuk-radios__label\">{{item.label}}</label>\n            </div>\n          </div>\n        </ng-container>\n        <ng-container *ngSwitchCase=\"'find-person'\">\n          <xuilib-find-person subTitle=\"\" (personSelected)=\"updatePersonControls($event, field)\"\n                              (personFieldChanged)=\"inputChanged(field)\"\n                              [submitted]=\"submitted\"\n                              [disabled]=\"disabled(field, form)\"\n                              [domain]=\"form.get(field.domainField)?.value\"\n                              [findPersonGroup]=\"form\"\n                              [selectedPerson]=\"form.get(field.name)?.value?.email\"\n                              [userIncluded]=\"false\"\n                              [placeholderContent]=\"field.placeholderContent ? field.placeholderContent : ''\"\n                              [services]=\"form.get(field.servicesField)?.value\"\n          ></xuilib-find-person>\n        </ng-container>\n        <ng-container *ngSwitchCase=\"'find-location'\">\n          <xuilib-find-location (locationFieldChanged)=\"inputChanged(field)\"\n                                [form]=\"form\"\n                                [fields]=\"config.fields\"\n                                [locationTitle]=\"field.locationTitle\"\n                                [enableAddLocationButton]=\"field.enableAddButton\"\n                                [disabled]=\"disabled(field, form)\"\n                                [disableInputField]=\"field.disable\"\n                                [submitted]=\"submitted\"\n                                [field]=\"field\"\n                                [services]=\"form.get(field.findLocationField)?.value\"\n                                [formSubmissionEvent$]=\"formSubmissionEvent$\"\n          ></xuilib-find-location>\n        </ng-container>\n        <ng-container *ngSwitchCase=\"'find-task-name'\">\n          <xuilib-find-task-name subTitle=\"\" (taskNameSelected)=\"updateTaskNameControls($event, field)\"\n                              (taskNameFieldChanged)=\"inputChanged(field)\"\n                              [submitted]=\"submitted\"\n                              [disabled]=\"disabled(field, form)\"\n                              [domain]=\"form.get(field.domainField)?.value\"\n                              [findTaskNameGroup]=\"form\"\n                              [selectedTaskName]=\"form.get(field.name)?.value?.task_type_name\"\n                              [placeholderContent]=\"field.placeholderContent ? field.placeholderContent : ''\"\n                              [services]=\"form.get(field.servicesField)?.value\"\n          ></xuilib-find-task-name>\n        </ng-container>\n        <ng-container *ngSwitchCase=\"'find-service'\">\n          <xuilib-find-service (serviceFieldChanged)=\"inputServiceChanged(field)\"\n                               [field]=\"field\"\n                               [form]=\"form\"\n                               [formSubmissionEvent$]=\"formSubmissionEvent$\"\n                               [disabled]=\"disabled(field, form)\">\n          </xuilib-find-service>\n        </ng-container>\n        <ng-container *ngSwitchCase=\"'text-input'\">\n          <input class=\"govuk-input\" type=\"text\"\n                 [formControlName]=\"field.name\"\n                 [id]=\"field.name\"\n                 [attr.disabled]=\"disabled(field, form)\"\n                 (change)=\"fieldChanged(field, form)\"\n                 [attr.maxlength]=\"field.maxlength ? field.maxlength : null\"\n                 [readonly]=\"field.readonly\"\n          />\n        </ng-container>\n        <ng-container *ngSwitchCase=\"'email-input'\">\n          <input class=\"govuk-input\" type=\"email\"\n                 [formControlName]=\"field.name\"\n                 [id]=\"field.name\"\n                 [attr.disabled]=\"disabled(field, form)\"\n                 (change)=\"fieldChanged(field, form)\"\n                 [readonly]=\"field.readonly\"\n          />\n        </ng-container>\n      </div>\n    </div>\n  </ng-container>\n</ng-container>\n  </div>\n  <hr class=\"govuk-section-break govuk-section-break--m govuk-section-break--visible\"/>\n  <div class=\"govuk-grid-row\">\n    <div class=\"govuk-grid-column-full\">\n      <button\n        class=\"govuk-button govuk-!-margin-right-1 govuk-!-margin-bottom-0\"\n        type=\"submit\"\n        id=\"applyFilter\"\n        [disabled]=\"config.enableDisabledButton && form.invalid\"\n      >{{config.applyButtonText || 'Apply'}}</button>\n      <button *ngIf=\"config.showCancelFilterButton\"\n        class=\"govuk-button govuk-button--secondary govuk-!-margin-bottom-0\"\n        type=\"button\"\n        id=\"cancelFilter\"\n        (click)=\"cancelFilter()\">{{ config.cancelButtonText || 'Cancel'}}</button>\n    </div>\n  </div>\n</form>\n", styles: [".contain-classes .elevated-break{margin-bottom:20px}@media (min-width: 40.0625em){.contain-classes .elevated-break{margin-bottom:30px}}.contain-classes .govuk-body--maxWidth480px{max-width:480px}.contain-classes .xui-generic-filter .select-all{margin-bottom:10px}.contain-classes .xui-generic-filter .govuk-checkboxes{display:flex;flex-direction:column;flex-wrap:wrap}.contain-classes .xui-generic-filter .govuk-checkboxes>div{flex-grow:1;flex-shrink:0}.contain-classes .xui-generic-filter__field-title{display:flex;align-items:center;margin-bottom:10px}.contain-classes .govuk-select{width:100%}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i1.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "directive", type: i1.NgSwitchDefault, selector: "[ngSwitchDefault]" }, { kind: "directive", type: i2$3.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i2$3.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i2$3.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i2$3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2$3.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { kind: "directive", type: i2$3.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { kind: "directive", type: i2$3.RadioControlValueAccessor, selector: "input[type=radio][formControlName],input[type=radio][formControl],input[type=radio][ngModel]", inputs: ["name", "formControlName", "value"] }, { kind: "directive", type: i2$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2$3.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { kind: "directive", type: i2$3.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i2$3.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: i2$3.FormGroupName, selector: "[formGroupName]", inputs: ["formGroupName"] }, { kind: "component", type: FindPersonComponent, selector: "xuilib-find-person", inputs: ["title", "boldTitle", "subTitle", "domain", "findPersonGroup", "selectedPerson", "submitted", "userIncluded", "assignedUser", "placeholderContent", "isNoResultsShown", "showUpdatedColor", "selectedPersons", "errorMessage", "idValue", "services", "disabled"], outputs: ["personSelected", "personFieldChanged"] }, { kind: "component", type: FindLocationComponent, selector: "xuilib-find-location", inputs: ["submitted", "enableAddLocationButton", "form", "field", "fields", "locationTitle", "disableInputField", "formSubmissionEvent$", "disabled", "services"], outputs: ["locationFieldChanged"] }, { kind: "component", type: FindTaskNameComponent, selector: "xuilib-find-task-name", inputs: ["title", "boldTitle", "subTitle", "domain", "findTaskNameGroup", "selectedTaskName", "submitted", "assignedUser", "placeholderContent", "isNoResultsShown", "showUpdatedColor", "selectedTaskNames", "errorMessage", "idValue", "services", "disabled"], outputs: ["taskNameSelected", "taskNameFieldChanged"] }, { kind: "component", type: FindServiceComponent, selector: "xuilib-find-service", inputs: ["field", "serviceTitle", "form", "disabled", "formSubmissionEvent$"], outputs: ["serviceFieldChanged"] }, { kind: "pipe", type: i1.TitleCasePipe, name: "titlecase" }, { kind: "pipe", type: CapitalizePipe, name: "capitalize" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: GenericFilterComponent, decorators: [{
             type: Component,
             args: [{ selector: 'xuilib-generic-filter', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: "<form [formGroup]=\"form\" (ngSubmit)=\"applyFilter(form)\">\n  <div class=\"contain-classes\" *ngFor=\"let field of config.fields\">\n    <hr *ngIf=\"field.lineBreakBefore\" class=\"govuk-section-break govuk-section-break--visible elevated-break\">\n    <ng-container [ngSwitch]=\"field.type\">\n      <ng-container *ngSwitchCase=\"'group-title'\">\n        <div [class]=\"field.titleClasses ? field.titleClasses: 'govuk-label govuk-label--m govuk-!-margin-bottom-4'\">\n          {{ field.name | capitalize }}\n        </div>\n    </ng-container>\n      <ng-container *ngSwitchDefault>\n    <div class=\"govuk-form-group xui-generic-filter\"\n         [hidden]=\"hidden(field, form)\"\n         [id]=\"field.name\"\n         [ngClass]=\"{'form-group-error': submitted && (form.get(field.name).errors?.required || form.get(field.name).errors?.minlength || form.get(field.name).errors?.maxLength)}\">\n        <div *ngIf=\"field.title\" class=\"xui-generic-filter__field-title\">\n          <h3 [class]=\"field.titleClasses ? field.titleClasses : 'govuk-heading-s'\" style=\"margin-bottom: 0!important\">\n            {{field.title | capitalize}}\n          </h3>\n          <div *ngIf=\"field?.titleHint\" class=\"govuk-!-margin-left-2\">\n            {{ field.titleHint }}\n          </div>\n        </div>\n      <p class=\"govuk-body\" *ngIf=\"field.subTitle\">{{field.subTitle}}</p>\n      <div *ngIf=\"field.hintText\"\n        [id]=\"field.hintText + '-hint'\" class=\"govuk-hint\">\n        {{ field.hintText }}\n      </div>\n      <span [id]=\"field.name + '-error'\" class=\"govuk-error-message\" *ngIf=\"field.displayMinSelectedError && submitted && (form.get(field.name).errors?.required || form.get(field.name).errors?.minlength)\">\n        <span class=\"govuk-visually-hidden\">Error:</span> {{field.minSelectedError}}\n      </span>\n      <span [id]=\"field.name + '-error'\" class=\"govuk-error-message\" *ngIf=\"field.displayMaxSelectedError && submitted && form.get(field.name).errors?.maxLength\">\n        <span class=\"govuk-visually-hidden\">Error:</span> {{field.maxSelectedError}}\n      </span>\n      <span [id]=\"field.name + '-error'\" class=\"govuk-error-message\"\n        *ngIf=\"field.emailError && submitted && form.get(field.name).errors?.email\">\n        <span class=\"govuk-visually-hidden\">Error:</span> {{field.emailError}}\n      </span>\n        <div class=\"govuk-body\"  [class.govuk-body--maxWidth480px]=\"field.maxWidth480px\" [ngSwitch]=\"field.type\">\n        <ng-container *ngSwitchCase=\"'select'\">\n          <select class=\"govuk-select\" (change)=\"fieldChanged(field, form)\" [attr.disabled]=\"disabled(field, form)\" [name]=\"'select_' + field.name\" [id]=\"'select_' + field.name\" [formControlName]=\"field.name\">\n            <option disabled selected hidden value=\"\">{{field.disabledText}}</option>\n            <option *ngIf=\"field.defaultOption\" [attr.selected]=\"true\" [value]=\"field.defaultOption.key\">{{field.defaultOption.label}}</option>\n            <option class=\"govuk-radios__item\" *ngFor=\"let item of field.options\" [value]=\"item.key\">{{item.label}}</option>\n          </select>\n        </ng-container>\n        <ng-container *ngSwitchCase=\"'group-select'\">\n          <select class=\"govuk-select\" (change)=\"fieldChanged(field, form)\" [attr.disabled]=\"disabled(field, form)\" [name]=\"'select_' + field.name\" [id]=\"'select_' + field.name\" [formControlName]=\"field.name\">\n            <option disabled selected hidden value=\"\">{{field.disabledText}}</option>\n            <option *ngIf=\"field.defaultOption\" selected [value]=\"field.defaultOption.key\">{{field.defaultOption.label}}</option>\n            <optgroup *ngFor = 'let grp of filteredSkillsByServices' label=\"{{grp.group | titlecase}}\">\n              <option *ngFor = 'let item of grp.options' [value]=\"item.key\">{{item.label}}</option>\n            </optgroup>\n          </select>\n        </ng-container>\n        <ng-container *ngSwitchCase=\"'checkbox'\">\n          <div class=\"govuk-checkboxes govuk-checkboxes--small\" [formGroupName]=\"field.name\" [attr.field]=\"field.name\" [id]=\"'checkbox_' + field.name\">\n            <div *ngFor=\"let item of field.options; let i = index\" class=\"govuk-checkboxes__item\">\n              <input type=\"checkbox\" class=\"govuk-checkboxes__input\"\n                     [attr.disabled]=\"disabled(field, form)\"\n                     [formControlName]=\"i\"\n                     (change)=\"toggleSelectAll($event, form, item, field)\"\n                     [value]=\"item.key\" [id]=\"'checkbox_' + field.name + item.key\"\n                     [name]=\"'checkbox_' + field.name + item.key\"\n              />\n              <label\n                [for]=\"'checkbox_' + field.name + item.key\"\n                class=\"govuk-label govuk-checkboxes__label\"\n                [ngClass]=\"{'govuk-!-font-weight-bold': item.selectAll}\"\n              >{{item.label}}</label>\n            </div>\n          </div>\n        </ng-container>\n        <ng-container *ngSwitchCase=\"'nested-checkbox'\">\n          <div class=\"govuk-checkboxes govuk-checkboxes--small\" [formGroupName]=\"field.name\" [attr.field]=\"field.name\" [id]=\"'checkbox_' + field.name\">\n            <div *ngFor=\"let item of filteredSkillsByServicesCheckbox; let i = index\" class=\"govuk-checkboxes__item\">\n              <input type=\"checkbox\" class=\"govuk-checkboxes__input\"\n                     [attr.disabled]=\"disabled(field, form)\"\n                     [formControlName]=\"i\"\n                     (change)=\"toggleSelectAll($event, form, item, field)\"\n                     [value]=\"item.key\" [id]=\"'checkbox_' + field.name + item.key\"\n                     [name]=\"'checkbox_' + field.name + item.key\"\n              />\n              <label\n                [for]=\"'checkbox_' + field.name + item.key\"\n                class=\"govuk-label govuk-checkboxes__label\"\n                [ngClass]=\"{'govuk-!-font-weight-bold': item.selectAll}\"\n              >{{item.label}}</label>\n            </div>\n          </div>\n        </ng-container>\n        <ng-container *ngSwitchCase=\"'checkbox-large'\">\n          <div class=\"govuk-checkboxes\" [formGroupName]=\"field.name\" [attr.field]=\"field.name\" [id]=\"'checkbox_' + field.name\">\n            <div *ngFor=\"let item of field.options; let i = index\" class=\"govuk-checkboxes__item\">\n              <input type=\"checkbox\" class=\"govuk-checkboxes__input\"\n                     [attr.disabled]=\"disabled(field, form)\"\n                     [formControlName]=\"i\"\n                     (change)=\"toggleSelectAll($event, form, item, field)\"\n                     [value]=\"item.key\" [id]=\"'checkbox_' + field.name + item.key\"\n                     [name]=\"'checkbox_' + field.name + item.key\"\n              />\n              <label\n                [for]=\"'checkbox_' + field.name + item.key\"\n                class=\"govuk-label govuk-checkboxes__label\"\n                [ngClass]=\"{'govuk-!-font-weight-bold': item.selectAll}\"\n              >{{item.label}}</label>\n            </div>\n          </div>\n        </ng-container>\n        <ng-container *ngSwitchCase=\"'radio'\">\n          <div class=\"govuk-radios\">\n            <div *ngFor=\"let item of field.options\" class=\"govuk-radios__item\">\n              <input type=\"radio\"\n                     [formControlName]=\"field.name\"\n                     [id]=\"'radio_' + item.key\"\n                     [attr.disabled]=\"disabled(field, form)\"\n                     [checked]=\"item.key === form.get(field.name).value\"\n                     class=\"govuk-radios__input\"\n                     [value]=\"item.key\"\n                     (change)=\"fieldChanged(field, form)\"\n              />\n              <label [for]=\"'radio_' + item.key\" class=\"govuk-label govuk-radios__label\">{{item.label}}</label>\n            </div>\n          </div>\n        </ng-container>\n        <ng-container *ngSwitchCase=\"'find-person'\">\n          <xuilib-find-person subTitle=\"\" (personSelected)=\"updatePersonControls($event, field)\"\n                              (personFieldChanged)=\"inputChanged(field)\"\n                              [submitted]=\"submitted\"\n                              [disabled]=\"disabled(field, form)\"\n                              [domain]=\"form.get(field.domainField)?.value\"\n                              [findPersonGroup]=\"form\"\n                              [selectedPerson]=\"form.get(field.name)?.value?.email\"\n                              [userIncluded]=\"false\"\n                              [placeholderContent]=\"field.placeholderContent ? field.placeholderContent : ''\"\n                              [services]=\"form.get(field.servicesField)?.value\"\n          ></xuilib-find-person>\n        </ng-container>\n        <ng-container *ngSwitchCase=\"'find-location'\">\n          <xuilib-find-location (locationFieldChanged)=\"inputChanged(field)\"\n                                [form]=\"form\"\n                                [fields]=\"config.fields\"\n                                [locationTitle]=\"field.locationTitle\"\n                                [enableAddLocationButton]=\"field.enableAddButton\"\n                                [disabled]=\"disabled(field, form)\"\n                                [disableInputField]=\"field.disable\"\n                                [submitted]=\"submitted\"\n                                [field]=\"field\"\n                                [services]=\"form.get(field.findLocationField)?.value\"\n                                [formSubmissionEvent$]=\"formSubmissionEvent$\"\n          ></xuilib-find-location>\n        </ng-container>\n        <ng-container *ngSwitchCase=\"'find-task-name'\">\n          <xuilib-find-task-name subTitle=\"\" (taskNameSelected)=\"updateTaskNameControls($event, field)\"\n                              (taskNameFieldChanged)=\"inputChanged(field)\"\n                              [submitted]=\"submitted\"\n                              [disabled]=\"disabled(field, form)\"\n                              [domain]=\"form.get(field.domainField)?.value\"\n                              [findTaskNameGroup]=\"form\"\n                              [selectedTaskName]=\"form.get(field.name)?.value?.task_type_name\"\n                              [placeholderContent]=\"field.placeholderContent ? field.placeholderContent : ''\"\n                              [services]=\"form.get(field.servicesField)?.value\"\n          ></xuilib-find-task-name>\n        </ng-container>\n        <ng-container *ngSwitchCase=\"'find-service'\">\n          <xuilib-find-service (serviceFieldChanged)=\"inputServiceChanged(field)\"\n                               [field]=\"field\"\n                               [form]=\"form\"\n                               [formSubmissionEvent$]=\"formSubmissionEvent$\"\n                               [disabled]=\"disabled(field, form)\">\n          </xuilib-find-service>\n        </ng-container>\n        <ng-container *ngSwitchCase=\"'text-input'\">\n          <input class=\"govuk-input\" type=\"text\"\n                 [formControlName]=\"field.name\"\n                 [id]=\"field.name\"\n                 [attr.disabled]=\"disabled(field, form)\"\n                 (change)=\"fieldChanged(field, form)\"\n                 [attr.maxlength]=\"field.maxlength ? field.maxlength : null\"\n                 [readonly]=\"field.readonly\"\n          />\n        </ng-container>\n        <ng-container *ngSwitchCase=\"'email-input'\">\n          <input class=\"govuk-input\" type=\"email\"\n                 [formControlName]=\"field.name\"\n                 [id]=\"field.name\"\n                 [attr.disabled]=\"disabled(field, form)\"\n                 (change)=\"fieldChanged(field, form)\"\n                 [readonly]=\"field.readonly\"\n          />\n        </ng-container>\n      </div>\n    </div>\n  </ng-container>\n</ng-container>\n  </div>\n  <hr class=\"govuk-section-break govuk-section-break--m govuk-section-break--visible\"/>\n  <div class=\"govuk-grid-row\">\n    <div class=\"govuk-grid-column-full\">\n      <button\n        class=\"govuk-button govuk-!-margin-right-1 govuk-!-margin-bottom-0\"\n        type=\"submit\"\n        id=\"applyFilter\"\n        [disabled]=\"config.enableDisabledButton && form.invalid\"\n      >{{config.applyButtonText || 'Apply'}}</button>\n      <button *ngIf=\"config.showCancelFilterButton\"\n        class=\"govuk-button govuk-button--secondary govuk-!-margin-bottom-0\"\n        type=\"button\"\n        id=\"cancelFilter\"\n        (click)=\"cancelFilter()\">{{ config.cancelButtonText || 'Cancel'}}</button>\n    </div>\n  </div>\n</form>\n", styles: [".contain-classes .elevated-break{margin-bottom:20px}@media (min-width: 40.0625em){.contain-classes .elevated-break{margin-bottom:30px}}.contain-classes .govuk-body--maxWidth480px{max-width:480px}.contain-classes .xui-generic-filter .select-all{margin-bottom:10px}.contain-classes .xui-generic-filter .govuk-checkboxes{display:flex;flex-direction:column;flex-wrap:wrap}.contain-classes .xui-generic-filter .govuk-checkboxes>div{flex-grow:1;flex-shrink:0}.contain-classes .xui-generic-filter__field-title{display:flex;align-items:center;margin-bottom:10px}.contain-classes .govuk-select{width:100%}\n"] }]
         }], ctorParameters: function () { return [{ type: FilterService }, { type: i2$3.UntypedFormBuilder }]; }, propDecorators: { config: [{
@@ -2623,10 +2625,10 @@ class HmctsSessionDialogComponent {
     onClose() {
         this.close.emit();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: HmctsSessionDialogComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.7", type: HmctsSessionDialogComponent, selector: "xuilib-session-dialog", inputs: { positionTop: "positionTop" }, outputs: { close: "close" }, ngImport: i0, template: "<div class=\"gem-c-modal-dialogue\" data-module=\"modal-dialogue\" id=\"modal-default\" style=\"display: block;\">\n  <div class=\"gem-c-modal-dialogue__overlay\"></div>\n  <dialog class=\"gem-c-modal-dialogue__box\" aria-modal=\"true\" role=\"dialog\" tabindex=\"0\" [ngStyle]=\"{'margin-top': positionTop}\">\n    <div class=\"gem-c-modal-dialogue__header\">\n      <svg role=\"presentation\" focusable=\"false\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 38 38\" height=\"33\" width=\"33\">\n        <style type=\"text/css\">\n          .st0{fill:#FFFFFF;}\n        </style>\n        <g id=\"_4_-_granular_components_warning_icon\" transform=\"translate(0.5 0.5)\">\n          <g id=\"Warning_icon\" transform=\"translate(0)\">\n            <path id=\"Exclusion_1\" class=\"st0\" d=\"M18.5,37.5c-5.04,0.01-9.88-1.99-13.44-5.57C1.49,28.38-0.51,23.54-0.5,18.5\n              c-0.01-5.04,1.99-9.88,5.56-13.43C8.62,1.49,13.46-0.51,18.5-0.5c5.04-0.01,9.88,1.99,13.44,5.56c3.57,3.56,5.58,8.39,5.56,13.44\n              c0.01,5.04-1.99,9.88-5.56,13.44C28.38,35.51,23.54,37.51,18.5,37.5z M18.52,24.29c-0.4,0-0.8,0.08-1.17,0.23\n              c-0.36,0.15-0.69,0.37-0.97,0.64c-0.28,0.27-0.5,0.59-0.65,0.95c-0.16,0.36-0.24,0.76-0.23,1.15c0,0.4,0.08,0.8,0.23,1.17\n              c0.15,0.36,0.37,0.68,0.65,0.96c0.28,0.27,0.61,0.49,0.97,0.64c0.37,0.16,0.77,0.24,1.17,0.24c0.4,0,0.79-0.08,1.15-0.24\n              c0.35-0.15,0.67-0.37,0.95-0.64c0.27-0.27,0.49-0.6,0.64-0.96c0.16-0.37,0.24-0.77,0.23-1.17c0-0.4-0.08-0.79-0.23-1.15\n              c-0.15-0.35-0.37-0.67-0.64-0.95c-0.27-0.27-0.6-0.49-0.95-0.64C19.31,24.37,18.92,24.29,18.52,24.29L18.52,24.29z M16.11,7.5\n              l0.42,14.87h3.91L20.86,7.5H16.11z\"/>\n          </g>\n        </g>\n      </svg>\n      <div class=\"gem-c-modal-dialogue__title\">We are about to sign you out</div>\n    </div>\n    <div class=\"gem-c-modal-dialogue__content\">\n      <ng-content></ng-content>\n    </div>\n  </dialog>\n</div>\n", styles: [".gem-c-modal-dialogue{display:none;position:fixed;z-index:1000;top:0;left:0;width:100%;height:100%;overflow-x:hidden;overflow-y:scroll;outline:0}.gem-c-modal-dialogue__box{display:block;position:fixed;background:#ffffff;inset:0;width:100%;height:100%;margin:0;padding:0;overflow-y:auto;border:0;font-family:GDS Transport,Arial,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-weight:400;font-size:16px;font-size:1rem;line-height:1.25;color:#0b0c0c}.gem-c-modal-dialogue__box:focus{outline:3px solid #ffdd00}@media print{.gem-c-modal-dialogue__box{font-family:sans-serif}}@media (min-width: 40.0625em){.gem-c-modal-dialogue__box{font-size:1.1875rem;line-height:1.3157894737}}@media print{.gem-c-modal-dialogue__box{font-size:14pt;line-height:1.15}}@media print{.gem-c-modal-dialogue__box{color:#000}}@media (min-width: 40.0625em){.gem-c-modal-dialogue__box{position:relative;top:inherit;right:inherit;bottom:inherit;left:inherit;width:auto;max-width:640px;height:auto;margin:30px auto;border:2px solid #0b0c0c}}@media (min-width: 40.0625em){.gem-c-modal-dialogue__box--wide{max-width:960px}}@media (min-width: 40.0625em) and (max-width: 64em){.gem-c-modal-dialogue__box--wide{margin:30px}}.gem-c-modal-dialogue__overlay{position:fixed;inset:0;width:100%;height:100%;opacity:.8;background:#0b0c0c;pointer-events:none;touch-action:none}@media screen{.gem-o-template--modal{overflow-y:inherit}}.gem-o-template__body--modal{overflow:hidden}.gem-o-template__body--blur .govuk-skip-link,.gem-o-template__body--blur .govuk-header,.gem-o-template__body--blur .govuk-phase-banner,.gem-o-template__body--blur .govuk-width-container .govuk-back-link,.gem-o-template__body--blur .govuk-footer,.gem-o-template__body--blur .govuk-main-wrapper{filter:blur(2px)}.govuk-warning-text__icon{margin:0 0 0 12px}.gem-c-modal-dialogue__header{padding:9px 15px 10px;color:#fff;background:#d4351d;display:flex}.gem-c-modal-dialogue__title{margin:5px 0 4px 12px}.gem-c-modal-dialogue__logotype-crown{fill:currentColor;vertical-align:middle}.gem-c-modal-dialogue__logotype-crown-fallback-image{width:30px;height:26px;border:0;vertical-align:middle}.gem-c-modal-dialogue__content{padding:15px;background:#ffffff}.gem-c-modal-dialogue__close-button{position:absolute;top:0;right:0;width:44px;height:44px;border:0;color:#fff;background:none;cursor:pointer;font-family:GDS Transport,Arial,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-weight:700;font-size:1.5rem;line-height:1.3}@media print{.gem-c-modal-dialogue__close-button{font-family:sans-serif}}@media (min-width: 40.0625em){.gem-c-modal-dialogue__close-button{font-size:2.25rem;line-height:1.3}}@media print{.gem-c-modal-dialogue__close-button{font-size:24pt;line-height:1.3}}@media (max-width: 40.0525em){.gem-c-modal-dialogue__close-button{font-size:36px;line-height:1.3}}.gem-c-modal-dialogue__close-button:focus,.gem-c-modal-dialogue__close-button:hover{color:#0b0c0c;box-shadow:0 -2px #fd0,0 4px #0b0c0c;text-decoration:none;outline:none;background:#ffdd00}\n"], dependencies: [{ kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: HmctsSessionDialogComponent, decorators: [{
+HmctsSessionDialogComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: HmctsSessionDialogComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+HmctsSessionDialogComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: HmctsSessionDialogComponent, selector: "xuilib-session-dialog", inputs: { positionTop: "positionTop" }, outputs: { close: "close" }, ngImport: i0, template: "<div class=\"gem-c-modal-dialogue\" data-module=\"modal-dialogue\" id=\"modal-default\" style=\"display: block;\">\n  <div class=\"gem-c-modal-dialogue__overlay\"></div>\n  <dialog class=\"gem-c-modal-dialogue__box\" aria-modal=\"true\" role=\"dialog\" tabindex=\"0\" [ngStyle]=\"{'margin-top': positionTop}\">\n    <div class=\"gem-c-modal-dialogue__header\">\n      <svg role=\"presentation\" focusable=\"false\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 38 38\" height=\"33\" width=\"33\">\n        <style type=\"text/css\">\n          .st0{fill:#FFFFFF;}\n        </style>\n        <g id=\"_4_-_granular_components_warning_icon\" transform=\"translate(0.5 0.5)\">\n          <g id=\"Warning_icon\" transform=\"translate(0)\">\n            <path id=\"Exclusion_1\" class=\"st0\" d=\"M18.5,37.5c-5.04,0.01-9.88-1.99-13.44-5.57C1.49,28.38-0.51,23.54-0.5,18.5\n              c-0.01-5.04,1.99-9.88,5.56-13.43C8.62,1.49,13.46-0.51,18.5-0.5c5.04-0.01,9.88,1.99,13.44,5.56c3.57,3.56,5.58,8.39,5.56,13.44\n              c0.01,5.04-1.99,9.88-5.56,13.44C28.38,35.51,23.54,37.51,18.5,37.5z M18.52,24.29c-0.4,0-0.8,0.08-1.17,0.23\n              c-0.36,0.15-0.69,0.37-0.97,0.64c-0.28,0.27-0.5,0.59-0.65,0.95c-0.16,0.36-0.24,0.76-0.23,1.15c0,0.4,0.08,0.8,0.23,1.17\n              c0.15,0.36,0.37,0.68,0.65,0.96c0.28,0.27,0.61,0.49,0.97,0.64c0.37,0.16,0.77,0.24,1.17,0.24c0.4,0,0.79-0.08,1.15-0.24\n              c0.35-0.15,0.67-0.37,0.95-0.64c0.27-0.27,0.49-0.6,0.64-0.96c0.16-0.37,0.24-0.77,0.23-1.17c0-0.4-0.08-0.79-0.23-1.15\n              c-0.15-0.35-0.37-0.67-0.64-0.95c-0.27-0.27-0.6-0.49-0.95-0.64C19.31,24.37,18.92,24.29,18.52,24.29L18.52,24.29z M16.11,7.5\n              l0.42,14.87h3.91L20.86,7.5H16.11z\"/>\n          </g>\n        </g>\n      </svg>\n      <div class=\"gem-c-modal-dialogue__title\">We are about to sign you out</div>\n    </div>\n    <div class=\"gem-c-modal-dialogue__content\">\n      <ng-content></ng-content>\n    </div>\n  </dialog>\n</div>\n", styles: [".gem-c-modal-dialogue{display:none;position:fixed;z-index:1000;top:0;left:0;width:100%;height:100%;overflow-x:hidden;overflow-y:scroll;outline:0}.gem-c-modal-dialogue__box{display:block;position:fixed;background:#ffffff;inset:0;width:100%;height:100%;margin:0;padding:0;overflow-y:auto;border:0;font-family:GDS Transport,Arial,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-weight:400;font-size:16px;font-size:1rem;line-height:1.25;color:#0b0c0c}.gem-c-modal-dialogue__box:focus{outline:3px solid #ffdd00}@media print{.gem-c-modal-dialogue__box{font-family:sans-serif}}@media (min-width: 40.0625em){.gem-c-modal-dialogue__box{font-size:1.1875rem;line-height:1.3157894737}}@media print{.gem-c-modal-dialogue__box{font-size:14pt;line-height:1.15}}@media print{.gem-c-modal-dialogue__box{color:#000}}@media (min-width: 40.0625em){.gem-c-modal-dialogue__box{position:relative;top:inherit;right:inherit;bottom:inherit;left:inherit;width:auto;max-width:640px;height:auto;margin:30px auto;border:2px solid #0b0c0c}}@media (min-width: 40.0625em){.gem-c-modal-dialogue__box--wide{max-width:960px}}@media (min-width: 40.0625em) and (max-width: 64em){.gem-c-modal-dialogue__box--wide{margin:30px}}.gem-c-modal-dialogue__overlay{position:fixed;inset:0;width:100%;height:100%;opacity:.8;background:#0b0c0c;pointer-events:none;touch-action:none}@media screen{.gem-o-template--modal{overflow-y:inherit}}.gem-o-template__body--modal{overflow:hidden}.gem-o-template__body--blur .govuk-skip-link,.gem-o-template__body--blur .govuk-header,.gem-o-template__body--blur .govuk-phase-banner,.gem-o-template__body--blur .govuk-width-container .govuk-back-link,.gem-o-template__body--blur .govuk-footer,.gem-o-template__body--blur .govuk-main-wrapper{filter:blur(2px)}.govuk-warning-text__icon{margin:0 0 0 12px}.gem-c-modal-dialogue__header{padding:9px 15px 10px;color:#fff;background:#d4351d;display:flex}.gem-c-modal-dialogue__title{margin:5px 0 4px 12px}.gem-c-modal-dialogue__logotype-crown{fill:currentColor;vertical-align:middle}.gem-c-modal-dialogue__logotype-crown-fallback-image{width:30px;height:26px;border:0;vertical-align:middle}.gem-c-modal-dialogue__content{padding:15px;background:#ffffff}.gem-c-modal-dialogue__close-button{position:absolute;top:0;right:0;width:44px;height:44px;border:0;color:#fff;background:none;cursor:pointer;font-family:GDS Transport,Arial,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-weight:700;font-size:1.5rem;line-height:1.3}@media print{.gem-c-modal-dialogue__close-button{font-family:sans-serif}}@media (min-width: 40.0625em){.gem-c-modal-dialogue__close-button{font-size:2.25rem;line-height:1.3}}@media print{.gem-c-modal-dialogue__close-button{font-size:24pt;line-height:1.3}}@media (max-width: 40.0525em){.gem-c-modal-dialogue__close-button{font-size:36px;line-height:1.3}}.gem-c-modal-dialogue__close-button:focus,.gem-c-modal-dialogue__close-button:hover{color:#0b0c0c;box-shadow:0 -2px #fd0,0 4px #0b0c0c;text-decoration:none;outline:none;background:#ffdd00}\n"], dependencies: [{ kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: HmctsSessionDialogComponent, decorators: [{
             type: Component,
             args: [{ selector: 'xuilib-session-dialog', template: "<div class=\"gem-c-modal-dialogue\" data-module=\"modal-dialogue\" id=\"modal-default\" style=\"display: block;\">\n  <div class=\"gem-c-modal-dialogue__overlay\"></div>\n  <dialog class=\"gem-c-modal-dialogue__box\" aria-modal=\"true\" role=\"dialog\" tabindex=\"0\" [ngStyle]=\"{'margin-top': positionTop}\">\n    <div class=\"gem-c-modal-dialogue__header\">\n      <svg role=\"presentation\" focusable=\"false\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 38 38\" height=\"33\" width=\"33\">\n        <style type=\"text/css\">\n          .st0{fill:#FFFFFF;}\n        </style>\n        <g id=\"_4_-_granular_components_warning_icon\" transform=\"translate(0.5 0.5)\">\n          <g id=\"Warning_icon\" transform=\"translate(0)\">\n            <path id=\"Exclusion_1\" class=\"st0\" d=\"M18.5,37.5c-5.04,0.01-9.88-1.99-13.44-5.57C1.49,28.38-0.51,23.54-0.5,18.5\n              c-0.01-5.04,1.99-9.88,5.56-13.43C8.62,1.49,13.46-0.51,18.5-0.5c5.04-0.01,9.88,1.99,13.44,5.56c3.57,3.56,5.58,8.39,5.56,13.44\n              c0.01,5.04-1.99,9.88-5.56,13.44C28.38,35.51,23.54,37.51,18.5,37.5z M18.52,24.29c-0.4,0-0.8,0.08-1.17,0.23\n              c-0.36,0.15-0.69,0.37-0.97,0.64c-0.28,0.27-0.5,0.59-0.65,0.95c-0.16,0.36-0.24,0.76-0.23,1.15c0,0.4,0.08,0.8,0.23,1.17\n              c0.15,0.36,0.37,0.68,0.65,0.96c0.28,0.27,0.61,0.49,0.97,0.64c0.37,0.16,0.77,0.24,1.17,0.24c0.4,0,0.79-0.08,1.15-0.24\n              c0.35-0.15,0.67-0.37,0.95-0.64c0.27-0.27,0.49-0.6,0.64-0.96c0.16-0.37,0.24-0.77,0.23-1.17c0-0.4-0.08-0.79-0.23-1.15\n              c-0.15-0.35-0.37-0.67-0.64-0.95c-0.27-0.27-0.6-0.49-0.95-0.64C19.31,24.37,18.92,24.29,18.52,24.29L18.52,24.29z M16.11,7.5\n              l0.42,14.87h3.91L20.86,7.5H16.11z\"/>\n          </g>\n        </g>\n      </svg>\n      <div class=\"gem-c-modal-dialogue__title\">We are about to sign you out</div>\n    </div>\n    <div class=\"gem-c-modal-dialogue__content\">\n      <ng-content></ng-content>\n    </div>\n  </dialog>\n</div>\n", styles: [".gem-c-modal-dialogue{display:none;position:fixed;z-index:1000;top:0;left:0;width:100%;height:100%;overflow-x:hidden;overflow-y:scroll;outline:0}.gem-c-modal-dialogue__box{display:block;position:fixed;background:#ffffff;inset:0;width:100%;height:100%;margin:0;padding:0;overflow-y:auto;border:0;font-family:GDS Transport,Arial,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-weight:400;font-size:16px;font-size:1rem;line-height:1.25;color:#0b0c0c}.gem-c-modal-dialogue__box:focus{outline:3px solid #ffdd00}@media print{.gem-c-modal-dialogue__box{font-family:sans-serif}}@media (min-width: 40.0625em){.gem-c-modal-dialogue__box{font-size:1.1875rem;line-height:1.3157894737}}@media print{.gem-c-modal-dialogue__box{font-size:14pt;line-height:1.15}}@media print{.gem-c-modal-dialogue__box{color:#000}}@media (min-width: 40.0625em){.gem-c-modal-dialogue__box{position:relative;top:inherit;right:inherit;bottom:inherit;left:inherit;width:auto;max-width:640px;height:auto;margin:30px auto;border:2px solid #0b0c0c}}@media (min-width: 40.0625em){.gem-c-modal-dialogue__box--wide{max-width:960px}}@media (min-width: 40.0625em) and (max-width: 64em){.gem-c-modal-dialogue__box--wide{margin:30px}}.gem-c-modal-dialogue__overlay{position:fixed;inset:0;width:100%;height:100%;opacity:.8;background:#0b0c0c;pointer-events:none;touch-action:none}@media screen{.gem-o-template--modal{overflow-y:inherit}}.gem-o-template__body--modal{overflow:hidden}.gem-o-template__body--blur .govuk-skip-link,.gem-o-template__body--blur .govuk-header,.gem-o-template__body--blur .govuk-phase-banner,.gem-o-template__body--blur .govuk-width-container .govuk-back-link,.gem-o-template__body--blur .govuk-footer,.gem-o-template__body--blur .govuk-main-wrapper{filter:blur(2px)}.govuk-warning-text__icon{margin:0 0 0 12px}.gem-c-modal-dialogue__header{padding:9px 15px 10px;color:#fff;background:#d4351d;display:flex}.gem-c-modal-dialogue__title{margin:5px 0 4px 12px}.gem-c-modal-dialogue__logotype-crown{fill:currentColor;vertical-align:middle}.gem-c-modal-dialogue__logotype-crown-fallback-image{width:30px;height:26px;border:0;vertical-align:middle}.gem-c-modal-dialogue__content{padding:15px;background:#ffffff}.gem-c-modal-dialogue__close-button{position:absolute;top:0;right:0;width:44px;height:44px;border:0;color:#fff;background:none;cursor:pointer;font-family:GDS Transport,Arial,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-weight:700;font-size:1.5rem;line-height:1.3}@media print{.gem-c-modal-dialogue__close-button{font-family:sans-serif}}@media (min-width: 40.0625em){.gem-c-modal-dialogue__close-button{font-size:2.25rem;line-height:1.3}}@media print{.gem-c-modal-dialogue__close-button{font-size:24pt;line-height:1.3}}@media (max-width: 40.0525em){.gem-c-modal-dialogue__close-button{font-size:36px;line-height:1.3}}.gem-c-modal-dialogue__close-button:focus,.gem-c-modal-dialogue__close-button:hover{color:#0b0c0c;box-shadow:0 -2px #fd0,0 4px #0b0c0c;text-decoration:none;outline:none;background:#ffdd00}\n"] }]
         }], ctorParameters: function () { return []; }, propDecorators: { positionTop: [{
@@ -2643,10 +2645,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.7", ngImpor
 * */
 class GovUkLabelComponent {
     constructor() { }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: GovUkLabelComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.7", type: GovUkLabelComponent, selector: "xuilib-gov-label", inputs: { config: "config" }, ngImport: i0, template: "<h1 *ngIf=\"config.isPageHeading else noHeading\">\n  <label *ngIf=\"config.label\" [for]=\"config.id\" [class]=\"config.classes + ' govuk-label'\">\n    <span>{{ config.label }}</span>\n    <span class=\"govuk-label__optional\" *ngIf=\"config.optional\">(optional)</span>\n  </label>\n</h1>\n<ng-template #noHeading>\n  <label *ngIf=\"config.label\" [for]=\"config.id\" [class]=\"config.classes + ' govuk-label'\">\n    <span>{{ config.label }}</span>\n    <span class=\"govuk-label__optional\" *ngIf=\"config.optional\">(optional)</span>\n  </label>\n</ng-template>\n", styles: [".govuk-label{display:flex;align-items:center;flex-wrap:wrap}.govuk-label__optional{font-weight:400;font-size:16px;display:inline-block;margin-left:.75rem}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: GovUkLabelComponent, decorators: [{
+GovUkLabelComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: GovUkLabelComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+GovUkLabelComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: GovUkLabelComponent, selector: "xuilib-gov-label", inputs: { config: "config" }, ngImport: i0, template: "<h1 *ngIf=\"config.isPageHeading else noHeading\">\n  <label *ngIf=\"config.label\" [for]=\"config.id\" [class]=\"config.classes + ' govuk-label'\">\n    <span>{{ config.label }}</span>\n    <span class=\"govuk-label__optional\" *ngIf=\"config.optional\">(optional)</span>\n  </label>\n</h1>\n<ng-template #noHeading>\n  <label *ngIf=\"config.label\" [for]=\"config.id\" [class]=\"config.classes + ' govuk-label'\">\n    <span>{{ config.label }}</span>\n    <span class=\"govuk-label__optional\" *ngIf=\"config.optional\">(optional)</span>\n  </label>\n</ng-template>\n", styles: [".govuk-label{display:flex;align-items:center;flex-wrap:wrap}.govuk-label__optional{font-weight:400;font-size:16px;display:inline-block;margin-left:.75rem}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: GovUkLabelComponent, decorators: [{
             type: Component,
             args: [{ selector: 'xuilib-gov-label', template: "<h1 *ngIf=\"config.isPageHeading else noHeading\">\n  <label *ngIf=\"config.label\" [for]=\"config.id\" [class]=\"config.classes + ' govuk-label'\">\n    <span>{{ config.label }}</span>\n    <span class=\"govuk-label__optional\" *ngIf=\"config.optional\">(optional)</span>\n  </label>\n</h1>\n<ng-template #noHeading>\n  <label *ngIf=\"config.label\" [for]=\"config.id\" [class]=\"config.classes + ' govuk-label'\">\n    <span>{{ config.label }}</span>\n    <span class=\"govuk-label__optional\" *ngIf=\"config.optional\">(optional)</span>\n  </label>\n</ng-template>\n", styles: [".govuk-label{display:flex;align-items:center;flex-wrap:wrap}.govuk-label__optional{font-weight:400;font-size:16px;display:inline-block;margin-left:.75rem}\n"] }]
         }], ctorParameters: function () { return []; }, propDecorators: { config: [{
@@ -2671,10 +2673,10 @@ class RemoveHostDirective {
         }
         parentElement.removeChild(nativeElement);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: RemoveHostDirective, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.1.7", type: RemoveHostDirective, selector: "[appRemoveHost]", ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: RemoveHostDirective, decorators: [{
+RemoveHostDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: RemoveHostDirective, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive });
+RemoveHostDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.2.9", type: RemoveHostDirective, selector: "[appRemoveHost]", ngImport: i0 });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: RemoveHostDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: '[appRemoveHost]'
@@ -2696,10 +2698,10 @@ class GovUkCheckboxComponent {
         this.config.classes = this.config.classes ?
             this.config.classes.concat(' govuk-checkboxes__label') : 'govuk-checkboxes__label';
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: GovUkCheckboxComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.7", type: GovUkCheckboxComponent, selector: "xuilib-gov-checkbox", inputs: { group: "group", config: "config", isChecked: "isChecked" }, ngImport: i0, template: "<div class=\"govuk-checkboxes__item\" [formGroup]=\"group\">\n  <input class=\"govuk-checkboxes__input\" type=\"checkbox\" [attr.aria-describedby]=\"config.hint ? config.value+'-item-hint' : null\"\n  [id]=\"config.id\" [name]=\"config.name\" [formControlName]=\"config.value\" [checked]=\"isChecked\">\n  <xuilib-gov-label appRemoveHost [config]=\"config\"></xuilib-gov-label>\n  <span [id]=\"config.value+'-item-hint'\" class=\"govuk-hint govuk-checkboxes__hint\">\n    {{config.hint}}\n  </span>\n</div>", dependencies: [{ kind: "directive", type: i2$3.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { kind: "directive", type: i2$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2$3.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i2$3.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: GovUkLabelComponent, selector: "xuilib-gov-label", inputs: ["config"] }, { kind: "directive", type: RemoveHostDirective, selector: "[appRemoveHost]" }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: GovUkCheckboxComponent, decorators: [{
+GovUkCheckboxComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: GovUkCheckboxComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+GovUkCheckboxComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: GovUkCheckboxComponent, selector: "xuilib-gov-checkbox", inputs: { group: "group", config: "config", isChecked: "isChecked" }, ngImport: i0, template: "<div class=\"govuk-checkboxes__item\" [formGroup]=\"group\">\n  <input class=\"govuk-checkboxes__input\" type=\"checkbox\" [attr.aria-describedby]=\"config.hint ? config.value+'-item-hint' : null\"\n  [id]=\"config.id\" [name]=\"config.name\" [formControlName]=\"config.value\" [checked]=\"isChecked\">\n  <xuilib-gov-label appRemoveHost [config]=\"config\"></xuilib-gov-label>\n  <span [id]=\"config.value+'-item-hint'\" class=\"govuk-hint govuk-checkboxes__hint\">\n    {{config.hint}}\n  </span>\n</div>", dependencies: [{ kind: "directive", type: i2$3.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { kind: "directive", type: i2$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2$3.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i2$3.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: GovUkLabelComponent, selector: "xuilib-gov-label", inputs: ["config"] }, { kind: "directive", type: RemoveHostDirective, selector: "[appRemoveHost]" }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: GovUkCheckboxComponent, decorators: [{
             type: Component,
             args: [{ selector: 'xuilib-gov-checkbox', template: "<div class=\"govuk-checkboxes__item\" [formGroup]=\"group\">\n  <input class=\"govuk-checkboxes__input\" type=\"checkbox\" [attr.aria-describedby]=\"config.hint ? config.value+'-item-hint' : null\"\n  [id]=\"config.id\" [name]=\"config.name\" [formControlName]=\"config.value\" [checked]=\"isChecked\">\n  <xuilib-gov-label appRemoveHost [config]=\"config\"></xuilib-gov-label>\n  <span [id]=\"config.value+'-item-hint'\" class=\"govuk-hint govuk-checkboxes__hint\">\n    {{config.hint}}\n  </span>\n</div>" }]
         }], ctorParameters: function () { return []; }, propDecorators: { group: [{
@@ -2718,10 +2720,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.7", ngImpor
 * */
 class GovUkErrorMessageComponent {
     constructor() { }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: GovUkErrorMessageComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.7", type: GovUkErrorMessageComponent, selector: " xuilib-gov-uk-error-message", inputs: { config: "config", errorMessage: "errorMessage" }, ngImport: i0, template: "<span class=\"govuk-error-message\" [id]=\"config.id + '-error'\" *ngFor=\"let message of errorMessage?.messages\">\n  <span class=\"govuk-visually-hidden\">Error:</span>{{message}}\n</span>", dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: GovUkErrorMessageComponent, decorators: [{
+GovUkErrorMessageComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: GovUkErrorMessageComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+GovUkErrorMessageComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: GovUkErrorMessageComponent, selector: " xuilib-gov-uk-error-message", inputs: { config: "config", errorMessage: "errorMessage" }, ngImport: i0, template: "<span class=\"govuk-error-message\" [id]=\"config.id + '-error'\" *ngFor=\"let message of errorMessage?.messages\">\n  <span class=\"govuk-visually-hidden\">Error:</span>{{message}}\n</span>", dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: GovUkErrorMessageComponent, decorators: [{
             type: Component,
             args: [{ selector: ' xuilib-gov-uk-error-message', template: "<span class=\"govuk-error-message\" [id]=\"config.id + '-error'\" *ngFor=\"let message of errorMessage?.messages\">\n  <span class=\"govuk-visually-hidden\">Error:</span>{{message}}\n</span>" }]
         }], ctorParameters: function () { return []; }, propDecorators: { config: [{
@@ -2765,10 +2767,10 @@ class GovUkFieldsetComponent {
     setDescribedBy() {
         return HtmlTemplatesHelper.setDescribedBy(this.errorMessage, this.config);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: GovUkFieldsetComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.7", type: GovUkFieldsetComponent, selector: "xuilib-gov-uk-fieldset", inputs: { config: "config", errorMessage: "errorMessage" }, ngImport: i0, template: "<fieldset class=\"govuk-fieldset\" [attr.aria-describedby]=\"setDescribedBy()\">\n  <legend [class]=\"config.classes + ' govuk-fieldset__legend'\" *ngIf=\"!config.isPageHeading\">\n    {{config.legend}}\n  </legend>\n\n  <legend [class]=\"config.classes + ' govuk-fieldset__legend'\" *ngIf=\"config.isPageHeading\">\n    <h1>{{config.legend}}</h1>\n  </legend>\n\n  <span [id]=\"config.id+'-hint'\" class=\"govuk-hint\" *ngIf=\"config.hint\">\n    {{config.hint}}\n  </span>\n  <ng-content></ng-content>\n</fieldset>", dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: GovUkFieldsetComponent, decorators: [{
+GovUkFieldsetComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: GovUkFieldsetComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+GovUkFieldsetComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: GovUkFieldsetComponent, selector: "xuilib-gov-uk-fieldset", inputs: { config: "config", errorMessage: "errorMessage" }, ngImport: i0, template: "<fieldset class=\"govuk-fieldset\" [attr.aria-describedby]=\"setDescribedBy()\">\n  <legend [class]=\"config.classes + ' govuk-fieldset__legend'\" *ngIf=\"!config.isPageHeading\">\n    {{config.legend}}\n  </legend>\n\n  <legend [class]=\"config.classes + ' govuk-fieldset__legend'\" *ngIf=\"config.isPageHeading\">\n    <h1>{{config.legend}}</h1>\n  </legend>\n\n  <span [id]=\"config.id+'-hint'\" class=\"govuk-hint\" *ngIf=\"config.hint\">\n    {{config.hint}}\n  </span>\n  <ng-content></ng-content>\n</fieldset>", dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: GovUkFieldsetComponent, decorators: [{
             type: Component,
             args: [{ selector: 'xuilib-gov-uk-fieldset', template: "<fieldset class=\"govuk-fieldset\" [attr.aria-describedby]=\"setDescribedBy()\">\n  <legend [class]=\"config.classes + ' govuk-fieldset__legend'\" *ngIf=\"!config.isPageHeading\">\n    {{config.legend}}\n  </legend>\n\n  <legend [class]=\"config.classes + ' govuk-fieldset__legend'\" *ngIf=\"config.isPageHeading\">\n    <h1>{{config.legend}}</h1>\n  </legend>\n\n  <span [id]=\"config.id+'-hint'\" class=\"govuk-hint\" *ngIf=\"config.hint\">\n    {{config.hint}}\n  </span>\n  <ng-content></ng-content>\n</fieldset>" }]
         }], ctorParameters: function () { return []; }, propDecorators: { config: [{
@@ -2785,10 +2787,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.7", ngImpor
 * */
 class GovUkFormGroupWrapperComponent {
     constructor() { }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: GovUkFormGroupWrapperComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.7", type: GovUkFormGroupWrapperComponent, selector: "xuilib-gov-uk-form-group-wrapper", inputs: { error: "error", group: "group", config: "config" }, ngImport: i0, template: "<div class=\"govuk-form-group\" [attr.formGroupName]=\"group\" [ngClass]=\"{'govuk-form-group--error': (error?.isInvalid)}\">\n  <xuilib-gov-uk-fieldset\n    [config]=\"{legend: config.legend, classes: 'govuk-label--m', id: config.key, hint: config.hint, isPageHeading: config.isPageHeading}\"\n    [errorMessage]=\"error\">\n\n    <xuilib-gov-uk-error-message [config]=\"{id: group}\" [errorMessage]=\"error\"></xuilib-gov-uk-error-message>\n\n    <ng-content></ng-content>\n\n  </xuilib-gov-uk-fieldset>\n</div>", dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: GovUkErrorMessageComponent, selector: " xuilib-gov-uk-error-message", inputs: ["config", "errorMessage"] }, { kind: "component", type: GovUkFieldsetComponent, selector: "xuilib-gov-uk-fieldset", inputs: ["config", "errorMessage"] }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: GovUkFormGroupWrapperComponent, decorators: [{
+GovUkFormGroupWrapperComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: GovUkFormGroupWrapperComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+GovUkFormGroupWrapperComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: GovUkFormGroupWrapperComponent, selector: "xuilib-gov-uk-form-group-wrapper", inputs: { error: "error", group: "group", config: "config" }, ngImport: i0, template: "<div class=\"govuk-form-group\" [attr.formGroupName]=\"group\" [ngClass]=\"{'govuk-form-group--error': (error?.isInvalid)}\">\n  <xuilib-gov-uk-fieldset\n    [config]=\"{legend: config.legend, classes: 'govuk-label--m', id: config.key, hint: config.hint, isPageHeading: config.isPageHeading}\"\n    [errorMessage]=\"error\">\n\n    <xuilib-gov-uk-error-message [config]=\"{id: group}\" [errorMessage]=\"error\"></xuilib-gov-uk-error-message>\n\n    <ng-content></ng-content>\n\n  </xuilib-gov-uk-fieldset>\n</div>", dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2$3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2$3.FormGroupName, selector: "[formGroupName]", inputs: ["formGroupName"] }, { kind: "component", type: GovUkErrorMessageComponent, selector: " xuilib-gov-uk-error-message", inputs: ["config", "errorMessage"] }, { kind: "component", type: GovUkFieldsetComponent, selector: "xuilib-gov-uk-fieldset", inputs: ["config", "errorMessage"] }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: GovUkFormGroupWrapperComponent, decorators: [{
             type: Component,
             args: [{ selector: 'xuilib-gov-uk-form-group-wrapper', template: "<div class=\"govuk-form-group\" [attr.formGroupName]=\"group\" [ngClass]=\"{'govuk-form-group--error': (error?.isInvalid)}\">\n  <xuilib-gov-uk-fieldset\n    [config]=\"{legend: config.legend, classes: 'govuk-label--m', id: config.key, hint: config.hint, isPageHeading: config.isPageHeading}\"\n    [errorMessage]=\"error\">\n\n    <xuilib-gov-uk-error-message [config]=\"{id: group}\" [errorMessage]=\"error\"></xuilib-gov-uk-error-message>\n\n    <ng-content></ng-content>\n\n  </xuilib-gov-uk-fieldset>\n</div>" }]
         }], ctorParameters: function () { return []; }, propDecorators: { error: [{
@@ -2806,10 +2808,10 @@ class InviteUserPermissionComponent {
         this.isPuiOrganisationManager = false;
         this.isPuiFinanceManager = false;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: InviteUserPermissionComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.7", type: InviteUserPermissionComponent, selector: "xuilib-invite-permission-form", inputs: { inviteUserForm: "inviteUserForm", isPuiCaseManager: "isPuiCaseManager", isPuiUserManager: "isPuiUserManager", isPuiOrganisationManager: "isPuiOrganisationManager", isPuiFinanceManager: "isPuiFinanceManager", errorMessages: "errorMessages" }, ngImport: i0, template: "  <!--permissions -->\n  <ng-container [formGroup]=\"inviteUserForm\">\n  <xuilib-gov-uk-form-group-wrapper\n    [config]=\"{hint: 'Choose what the user will be able to do. You can change this later.', legend: 'Permissions', key: 'roles'}\"\n    [formGroupName]=\"'roles'\"\n    [error]=\"errorMessages\">\n\n    <div class=\"govuk-checkboxes\">\n      <xuilib-gov-checkbox\n        [group]=\"inviteUserForm.controls['roles']\"\n        [isChecked]=\"isPuiCaseManager\"\n        [config]=\"{value: 'pui-case-manager',  label: 'Manage Cases', name: 'roles', hint: 'View, create and progress cases.', focusOn: 'roles'}\">\n      </xuilib-gov-checkbox>\n\n      <xuilib-gov-checkbox\n        [group]=\"inviteUserForm.controls['roles']\"\n        [isChecked]=\"isPuiUserManager\"\n        [config]=\"{value: 'pui-user-manager', label: 'Manage Users', name: 'roles',\n        hint: 'Invite users.'}\">\n      </xuilib-gov-checkbox>\n\n      <xuilib-gov-checkbox\n        [group]=\"inviteUserForm.controls['roles']\"\n        [isChecked]=\"isPuiOrganisationManager\"\n        [config]=\"{value: 'pui-organisation-manager', label: 'Manage Organisation', name: 'roles',\n        hint: 'View organisation name and addresses.'}\">\n      </xuilib-gov-checkbox>\n\n      <!-- <xuilib-gov-checkbox\n        [group]=\"inviteUserForm.controls['roles']\"\n        [isChecked]=\"isPuiFinanceManager\"\n        [config]=\"{value: 'pui-finance-manager', label: 'Manage Payments', name: 'roles',\n        hint: 'View account balances, available credit and transactions.'}\">\n      </xuilib-gov-checkbox> -->\n    </div>\n\n  </xuilib-gov-uk-form-group-wrapper>\n</ng-container>", dependencies: [{ kind: "directive", type: i2$3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2$3.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i2$3.FormGroupName, selector: "[formGroupName]", inputs: ["formGroupName"] }, { kind: "component", type: GovUkCheckboxComponent, selector: "xuilib-gov-checkbox", inputs: ["group", "config", "isChecked"] }, { kind: "component", type: GovUkFormGroupWrapperComponent, selector: "xuilib-gov-uk-form-group-wrapper", inputs: ["error", "group", "config"] }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: InviteUserPermissionComponent, decorators: [{
+InviteUserPermissionComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: InviteUserPermissionComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+InviteUserPermissionComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: InviteUserPermissionComponent, selector: "xuilib-invite-permission-form", inputs: { inviteUserForm: "inviteUserForm", isPuiCaseManager: "isPuiCaseManager", isPuiUserManager: "isPuiUserManager", isPuiOrganisationManager: "isPuiOrganisationManager", isPuiFinanceManager: "isPuiFinanceManager", errorMessages: "errorMessages" }, ngImport: i0, template: "  <!--permissions -->\n  <ng-container [formGroup]=\"inviteUserForm\">\n  <xuilib-gov-uk-form-group-wrapper\n    [config]=\"{hint: 'Choose what the user will be able to do. You can change this later.', legend: 'Permissions', key: 'roles'}\"\n    [formGroupName]=\"'roles'\"\n    [error]=\"errorMessages\">\n\n    <div class=\"govuk-checkboxes\">\n      <xuilib-gov-checkbox\n        [group]=\"inviteUserForm.controls['roles']\"\n        [isChecked]=\"isPuiCaseManager\"\n        [config]=\"{value: 'pui-case-manager',  label: 'Manage Cases', name: 'roles', hint: 'View, create and progress cases.', focusOn: 'roles'}\">\n      </xuilib-gov-checkbox>\n\n      <xuilib-gov-checkbox\n        [group]=\"inviteUserForm.controls['roles']\"\n        [isChecked]=\"isPuiUserManager\"\n        [config]=\"{value: 'pui-user-manager', label: 'Manage Users', name: 'roles',\n        hint: 'Invite users.'}\">\n      </xuilib-gov-checkbox>\n\n      <xuilib-gov-checkbox\n        [group]=\"inviteUserForm.controls['roles']\"\n        [isChecked]=\"isPuiOrganisationManager\"\n        [config]=\"{value: 'pui-organisation-manager', label: 'Manage Organisation', name: 'roles',\n        hint: 'View organisation name and addresses.'}\">\n      </xuilib-gov-checkbox>\n\n      <!-- <xuilib-gov-checkbox\n        [group]=\"inviteUserForm.controls['roles']\"\n        [isChecked]=\"isPuiFinanceManager\"\n        [config]=\"{value: 'pui-finance-manager', label: 'Manage Payments', name: 'roles',\n        hint: 'View account balances, available credit and transactions.'}\">\n      </xuilib-gov-checkbox> -->\n    </div>\n\n  </xuilib-gov-uk-form-group-wrapper>\n</ng-container>", dependencies: [{ kind: "directive", type: i2$3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2$3.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i2$3.FormGroupName, selector: "[formGroupName]", inputs: ["formGroupName"] }, { kind: "component", type: GovUkCheckboxComponent, selector: "xuilib-gov-checkbox", inputs: ["group", "config", "isChecked"] }, { kind: "component", type: GovUkFormGroupWrapperComponent, selector: "xuilib-gov-uk-form-group-wrapper", inputs: ["error", "group", "config"] }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: InviteUserPermissionComponent, decorators: [{
             type: Component,
             args: [{ selector: 'xuilib-invite-permission-form', template: "  <!--permissions -->\n  <ng-container [formGroup]=\"inviteUserForm\">\n  <xuilib-gov-uk-form-group-wrapper\n    [config]=\"{hint: 'Choose what the user will be able to do. You can change this later.', legend: 'Permissions', key: 'roles'}\"\n    [formGroupName]=\"'roles'\"\n    [error]=\"errorMessages\">\n\n    <div class=\"govuk-checkboxes\">\n      <xuilib-gov-checkbox\n        [group]=\"inviteUserForm.controls['roles']\"\n        [isChecked]=\"isPuiCaseManager\"\n        [config]=\"{value: 'pui-case-manager',  label: 'Manage Cases', name: 'roles', hint: 'View, create and progress cases.', focusOn: 'roles'}\">\n      </xuilib-gov-checkbox>\n\n      <xuilib-gov-checkbox\n        [group]=\"inviteUserForm.controls['roles']\"\n        [isChecked]=\"isPuiUserManager\"\n        [config]=\"{value: 'pui-user-manager', label: 'Manage Users', name: 'roles',\n        hint: 'Invite users.'}\">\n      </xuilib-gov-checkbox>\n\n      <xuilib-gov-checkbox\n        [group]=\"inviteUserForm.controls['roles']\"\n        [isChecked]=\"isPuiOrganisationManager\"\n        [config]=\"{value: 'pui-organisation-manager', label: 'Manage Organisation', name: 'roles',\n        hint: 'View organisation name and addresses.'}\">\n      </xuilib-gov-checkbox>\n\n      <!-- <xuilib-gov-checkbox\n        [group]=\"inviteUserForm.controls['roles']\"\n        [isChecked]=\"isPuiFinanceManager\"\n        [config]=\"{value: 'pui-finance-manager', label: 'Manage Payments', name: 'roles',\n        hint: 'View account balances, available credit and transactions.'}\">\n      </xuilib-gov-checkbox> -->\n    </div>\n\n  </xuilib-gov-uk-form-group-wrapper>\n</ng-container>" }]
         }], propDecorators: { inviteUserForm: [{
@@ -2842,10 +2844,10 @@ class GovUkInputComponent {
     setDescribedBy() {
         return HtmlTemplatesHelper.setDescribedBy(this.errorMessage, this.config);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: GovUkInputComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.7", type: GovUkInputComponent, selector: "xuilib-gov-uk-input", inputs: { errorMessage: "errorMessage", group: "group", config: "config" }, ngImport: i0, template: "<div class=\"govuk-form-group gov-uk-input\" [formGroup]=\"group\"\n[ngClass]=\"{'govuk-form-group--error': errorMessage?.isInvalid}\">\n\n<xuilib-gov-label [config]=\"config\"></xuilib-gov-label>\n\n<span *ngIf=\"config.hint\" [id]=\"config.id +'-hint'\" class=\"govuk-hint\">\n  {{config.hint}}\n</span>\n\n<xuilib-gov-uk-error-message [config]=\"config\" [errorMessage]=\"errorMessage\"></xuilib-gov-uk-error-message>\n\n<input class=\"govuk-input\"\n       [class.govuk-!-width-full]=\"config.fullWidth\"\n       [ngClass]=\"{'govuk-input--error': errorMessage?.isInvalid}\"\n       [id]=\"config.id\"\n       [name]=\"config.name\"\n       [type]=\"config.type\"\n       [attr.aria-invalid]=\"errorMessage?.isInvalid\"\n       [formControlName]=\"config.name\"\n       [attr.aria-describedby]='setDescribedBy()'>\n</div>\n", styles: [".gov-uk-input input:disabled{background:#b1b4b6}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2$3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2$3.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i2$3.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: GovUkLabelComponent, selector: "xuilib-gov-label", inputs: ["config"] }, { kind: "component", type: GovUkErrorMessageComponent, selector: " xuilib-gov-uk-error-message", inputs: ["config", "errorMessage"] }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: GovUkInputComponent, decorators: [{
+GovUkInputComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: GovUkInputComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+GovUkInputComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: GovUkInputComponent, selector: "xuilib-gov-uk-input", inputs: { errorMessage: "errorMessage", group: "group", config: "config" }, ngImport: i0, template: "<div class=\"govuk-form-group gov-uk-input\" [formGroup]=\"group\"\n[ngClass]=\"{'govuk-form-group--error': errorMessage?.isInvalid}\">\n\n<xuilib-gov-label [config]=\"config\"></xuilib-gov-label>\n\n<span *ngIf=\"config.hint\" [id]=\"config.id +'-hint'\" class=\"govuk-hint\">\n  {{config.hint}}\n</span>\n\n<xuilib-gov-uk-error-message [config]=\"config\" [errorMessage]=\"errorMessage\"></xuilib-gov-uk-error-message>\n\n<input class=\"govuk-input\"\n       [class.govuk-!-width-full]=\"config.fullWidth\"\n       [ngClass]=\"{'govuk-input--error': errorMessage?.isInvalid}\"\n       [id]=\"config.id\"\n       [name]=\"config.name\"\n       [type]=\"config.type\"\n       [attr.aria-invalid]=\"errorMessage?.isInvalid\"\n       [formControlName]=\"config.name\"\n       [attr.aria-describedby]='setDescribedBy()'>\n</div>\n", styles: [".gov-uk-input input:disabled{background:#b1b4b6}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2$3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2$3.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i2$3.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: GovUkLabelComponent, selector: "xuilib-gov-label", inputs: ["config"] }, { kind: "component", type: GovUkErrorMessageComponent, selector: " xuilib-gov-uk-error-message", inputs: ["config", "errorMessage"] }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: GovUkInputComponent, decorators: [{
             type: Component,
             args: [{ selector: 'xuilib-gov-uk-input', template: "<div class=\"govuk-form-group gov-uk-input\" [formGroup]=\"group\"\n[ngClass]=\"{'govuk-form-group--error': errorMessage?.isInvalid}\">\n\n<xuilib-gov-label [config]=\"config\"></xuilib-gov-label>\n\n<span *ngIf=\"config.hint\" [id]=\"config.id +'-hint'\" class=\"govuk-hint\">\n  {{config.hint}}\n</span>\n\n<xuilib-gov-uk-error-message [config]=\"config\" [errorMessage]=\"errorMessage\"></xuilib-gov-uk-error-message>\n\n<input class=\"govuk-input\"\n       [class.govuk-!-width-full]=\"config.fullWidth\"\n       [ngClass]=\"{'govuk-input--error': errorMessage?.isInvalid}\"\n       [id]=\"config.id\"\n       [name]=\"config.name\"\n       [type]=\"config.type\"\n       [attr.aria-invalid]=\"errorMessage?.isInvalid\"\n       [formControlName]=\"config.name\"\n       [attr.aria-describedby]='setDescribedBy()'>\n</div>\n", styles: [".gov-uk-input input:disabled{background:#b1b4b6}\n"] }]
         }], ctorParameters: function () { return []; }, propDecorators: { errorMessage: [{
@@ -2866,10 +2868,10 @@ class InviteUserFormComponent {
     onSubmit() {
         this.submitForm.emit();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: InviteUserFormComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.7", type: InviteUserFormComponent, selector: "xuilib-invite-user-form", inputs: { inviteUserForm: "inviteUserForm", errorMessages: "errorMessages" }, outputs: { submitForm: "submitForm" }, ngImport: i0, template: "\n<form [formGroup]=\"inviteUserForm\" (ngSubmit)=\"onSubmit()\" >\n\n  <xuilib-gov-uk-input\n    [config]=\"{label: 'First name', hint: 'Include all middle names.', name: 'firstName', id: 'firstName', type: 'text', classes: 'testClass'}\"\n    [errorMessage]=\"isInvalid.firstName\"\n    [group]=\"inviteUserForm\">\n  </xuilib-gov-uk-input>\n\n  <xuilib-gov-uk-input\n    [config]=\"{label: 'Last name', name: 'lastName', id: 'lastName', type: 'text'}\"\n    [errorMessage]=\"isInvalid.lastName\"\n    [group]=\"inviteUserForm\">\n  </xuilib-gov-uk-input>\n\n  <xuilib-gov-uk-input\n    [config]=\"{label: 'Email address', name: 'email', id: 'email', type: 'email'}\"\n    [errorMessage]=\"isInvalid.email\"\n    [group]=\"inviteUserForm\">\n  </xuilib-gov-uk-input>\n\n  <xuilib-invite-permission-form [inviteUserForm]=\"inviteUserForm\" [errorMessages]=\"isInvalid.roles\">\n  </xuilib-invite-permission-form>\n\n  <button type=\"submit\" class=\"govuk-button\">\n    Send invitation\n  </button>\n</form>\n", dependencies: [{ kind: "directive", type: i2$3.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i2$3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2$3.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "component", type: InviteUserPermissionComponent, selector: "xuilib-invite-permission-form", inputs: ["inviteUserForm", "isPuiCaseManager", "isPuiUserManager", "isPuiOrganisationManager", "isPuiFinanceManager", "errorMessages"] }, { kind: "component", type: GovUkInputComponent, selector: "xuilib-gov-uk-input", inputs: ["errorMessage", "group", "config"] }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: InviteUserFormComponent, decorators: [{
+InviteUserFormComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: InviteUserFormComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+InviteUserFormComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: InviteUserFormComponent, selector: "xuilib-invite-user-form", inputs: { inviteUserForm: "inviteUserForm", errorMessages: "errorMessages" }, outputs: { submitForm: "submitForm" }, ngImport: i0, template: "\n<form [formGroup]=\"inviteUserForm\" (ngSubmit)=\"onSubmit()\" >\n\n  <xuilib-gov-uk-input\n    [config]=\"{label: 'First name', hint: 'Include all middle names.', name: 'firstName', id: 'firstName', type: 'text', classes: 'testClass'}\"\n    [errorMessage]=\"isInvalid.firstName\"\n    [group]=\"inviteUserForm\">\n  </xuilib-gov-uk-input>\n\n  <xuilib-gov-uk-input\n    [config]=\"{label: 'Last name', name: 'lastName', id: 'lastName', type: 'text'}\"\n    [errorMessage]=\"isInvalid.lastName\"\n    [group]=\"inviteUserForm\">\n  </xuilib-gov-uk-input>\n\n  <xuilib-gov-uk-input\n    [config]=\"{label: 'Email address', name: 'email', id: 'email', type: 'email'}\"\n    [errorMessage]=\"isInvalid.email\"\n    [group]=\"inviteUserForm\">\n  </xuilib-gov-uk-input>\n\n  <xuilib-invite-permission-form [inviteUserForm]=\"inviteUserForm\" [errorMessages]=\"isInvalid.roles\">\n  </xuilib-invite-permission-form>\n\n  <button type=\"submit\" class=\"govuk-button\">\n    Send invitation\n  </button>\n</form>\n", dependencies: [{ kind: "directive", type: i2$3.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i2$3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2$3.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "component", type: InviteUserPermissionComponent, selector: "xuilib-invite-permission-form", inputs: ["inviteUserForm", "isPuiCaseManager", "isPuiUserManager", "isPuiOrganisationManager", "isPuiFinanceManager", "errorMessages"] }, { kind: "component", type: GovUkInputComponent, selector: "xuilib-gov-uk-input", inputs: ["errorMessage", "group", "config"] }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: InviteUserFormComponent, decorators: [{
             type: Component,
             args: [{ selector: 'xuilib-invite-user-form', template: "\n<form [formGroup]=\"inviteUserForm\" (ngSubmit)=\"onSubmit()\" >\n\n  <xuilib-gov-uk-input\n    [config]=\"{label: 'First name', hint: 'Include all middle names.', name: 'firstName', id: 'firstName', type: 'text', classes: 'testClass'}\"\n    [errorMessage]=\"isInvalid.firstName\"\n    [group]=\"inviteUserForm\">\n  </xuilib-gov-uk-input>\n\n  <xuilib-gov-uk-input\n    [config]=\"{label: 'Last name', name: 'lastName', id: 'lastName', type: 'text'}\"\n    [errorMessage]=\"isInvalid.lastName\"\n    [group]=\"inviteUserForm\">\n  </xuilib-gov-uk-input>\n\n  <xuilib-gov-uk-input\n    [config]=\"{label: 'Email address', name: 'email', id: 'email', type: 'email'}\"\n    [errorMessage]=\"isInvalid.email\"\n    [group]=\"inviteUserForm\">\n  </xuilib-gov-uk-input>\n\n  <xuilib-invite-permission-form [inviteUserForm]=\"inviteUserForm\" [errorMessages]=\"isInvalid.roles\">\n  </xuilib-invite-permission-form>\n\n  <button type=\"submit\" class=\"govuk-button\">\n    Send invitation\n  </button>\n</form>\n" }]
         }], propDecorators: { submitForm: [{
@@ -2884,10 +2886,10 @@ class LoadingSpinnerComponent {
     constructor() {
         this.loadingText = 'Loading';
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: LoadingSpinnerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.7", type: LoadingSpinnerComponent, selector: "xuilib-loading-spinner", inputs: { loadingText: "loadingText" }, ngImport: i0, template: "<div class=\"spinner-container\">\n    <div class=\"spinner-inner-container\">\n        <p>{{loadingText}}</p>\n        <div class=\"spinner\" style=\"margin: auto;\"></div>\n    </div>\n</div>\n", styles: [".spinner-container{position:fixed;top:0;left:0;height:100%;width:100%;display:flex;justify-content:center;align-items:center;background:rgba(255,255,255,.5);z-index:99}.spinner-container .spinner-inner-container p{text-align:center}.spinner-container .spinner-inner-container .spinner{border:10px solid #dddddd;border-top:10px solid #000000;border-radius:50%;width:40px;height:40px;animation:spin 1s linear infinite}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}\n"], encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: LoadingSpinnerComponent, decorators: [{
+LoadingSpinnerComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: LoadingSpinnerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+LoadingSpinnerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: LoadingSpinnerComponent, selector: "xuilib-loading-spinner", inputs: { loadingText: "loadingText" }, ngImport: i0, template: "<div class=\"spinner-container\">\n    <div class=\"spinner-inner-container\">\n        <p>{{loadingText}}</p>\n        <div class=\"spinner\" style=\"margin: auto;\"></div>\n    </div>\n</div>\n", styles: [".spinner-container{position:fixed;top:0;left:0;height:100%;width:100%;display:flex;justify-content:center;align-items:center;background:rgba(255,255,255,.5);z-index:99}.spinner-container .spinner-inner-container p{text-align:center}.spinner-container .spinner-inner-container .spinner{border:10px solid #dddddd;border-top:10px solid #000000;border-radius:50%;width:40px;height:40px;animation:spin 1s linear infinite}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}\n"], encapsulation: i0.ViewEncapsulation.None });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: LoadingSpinnerComponent, decorators: [{
             type: Component,
             args: [{ selector: 'xuilib-loading-spinner', encapsulation: ViewEncapsulation.None, template: "<div class=\"spinner-container\">\n    <div class=\"spinner-inner-container\">\n        <p>{{loadingText}}</p>\n        <div class=\"spinner\" style=\"margin: auto;\"></div>\n    </div>\n</div>\n", styles: [".spinner-container{position:fixed;top:0;left:0;height:100%;width:100%;display:flex;justify-content:center;align-items:center;background:rgba(255,255,255,.5);z-index:99}.spinner-container .spinner-inner-container p{text-align:center}.spinner-container .spinner-inner-container .spinner{border:10px solid #dddddd;border-top:10px solid #000000;border-radius:50%;width:40px;height:40px;animation:spin 1s linear infinite}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}\n"] }]
         }], propDecorators: { loadingText: [{
@@ -2895,13 +2897,13 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.7", ngImpor
             }] } });
 
 class CaseSharingStateService {
-    get state() {
-        return this.subject.asObservable().pipe(distinctUntilChanged());
-    }
     constructor() {
         this.caseState = [];
         this.subject = new BehaviorSubject(this.caseState);
     }
+    get state() {
+        return this.subject.asObservable().pipe(distinctUntilChanged());
+    }
     setCases(cases) {
         this.caseState = [];
         cases.forEach(aCase => {
@@ -3050,10 +3052,10 @@ class CaseSharingStateService {
         }
         return false;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: CaseSharingStateService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: CaseSharingStateService, providedIn: 'root' }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: CaseSharingStateService, decorators: [{
+CaseSharingStateService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: CaseSharingStateService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+CaseSharingStateService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: CaseSharingStateService, providedIn: 'root' });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: CaseSharingStateService, decorators: [{
             type: Injectable,
             args: [{
                     providedIn: 'root'
@@ -3078,10 +3080,10 @@ class SelectedCaseConfirmComponent {
         }
         return this.sharedCase.pendingUnshares && this.sharedCase.pendingUnshares.length > 0;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: SelectedCaseConfirmComponent, deps: [{ token: CaseSharingStateService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.7", type: SelectedCaseConfirmComponent, selector: "xuilib-selected-case-confirm", inputs: { sharedCase: "sharedCase", changeLink: "changeLink" }, ngImport: i0, template: "<div id=\"user-access-block-{{ sharedCase.caseId }}\" *ngIf=\"showUserAccessBlock()\">\n  <h2 class=\"govuk-heading-m case-share-confirm__title\">{{ sharedCase.caseTitle }}</h2>\n  <div class=\"case-share-confirm__caption-area\">\n    <div class=\"govuk-caption-m case-share-confirm__caption\">\n      {{ sharedCase.caseId }}\n    </div>\n    <a [routerLink]=\"changeLink\" class=\"case-share-confirm__change-link govuk-link govuk-!-font-size-19\">Change</a>\n  </div>\n  <table class=\"govuk-table\">\n    <thead class=\"govuk-table__head\">\n    <tr class=\"govuk-table__row\">\n      <th class=\"govuk-table__header govuk-table-column-header\" scope=\"col\">Name</th>\n      <th class=\"govuk-table__header govuk-table-column-header\" scope=\"col\">Email address</th>\n      <th class=\"govuk-table__header govuk-table-column-actions\" scope=\"col\">Actions</th>\n    </tr>\n    </thead>\n    <tbody class=\"govuk-table__body\">\n    <tr class=\"govuk-table__row\" *ngFor=\"let user of sharedCase.pendingShares; trackBy: trackByUserId\">\n      <td class=\"govuk-table__cell\">{{ user.firstName + ' ' + user.lastName }}</td>\n      <td class=\"govuk-table__cell\">{{ user.email }}</td>\n      <td class=\"govuk-table__cell\">\n        <span class=\"hmcts-badge\">To be added</span>\n      </td>\n    </tr>\n    <tr class=\"govuk-table__row\" *ngFor=\"let user of sharedCase.pendingUnshares; trackBy: trackByUserId\">\n      <td class=\"govuk-table__cell\">{{ user.firstName + ' ' + user.lastName }}</td>\n      <td class=\"govuk-table__cell\">{{ user.email }}</td>\n      <td class=\"govuk-table__cell\">\n        <span class=\"hmcts-badge hmcts-badge--red\">To be removed</span>\n      </td>\n    </tr>\n    </tbody>\n  </table>\n</div>\n", styles: [".case-share-confirm__title{margin-bottom:0}.case-share-confirm__caption-area{border-bottom:1px solid #b1b4b6;padding-bottom:10px;display:inline-block;width:100%;clear:both}.case-share-confirm__caption{float:left}.case-share-confirm__change-link{float:right}.govuk-table-column-header{width:45%}.govuk-table-column-actions{width:10%}\n"], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: SelectedCaseConfirmComponent, decorators: [{
+SelectedCaseConfirmComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SelectedCaseConfirmComponent, deps: [{ token: CaseSharingStateService }], target: i0.ɵɵFactoryTarget.Component });
+SelectedCaseConfirmComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: SelectedCaseConfirmComponent, selector: "xuilib-selected-case-confirm", inputs: { sharedCase: "sharedCase", changeLink: "changeLink" }, ngImport: i0, template: "<div id=\"user-access-block-{{ sharedCase.caseId }}\" *ngIf=\"showUserAccessBlock()\">\n  <h2 class=\"govuk-heading-m case-share-confirm__title\">{{ sharedCase.caseTitle }}</h2>\n  <div class=\"case-share-confirm__caption-area\">\n    <div class=\"govuk-caption-m case-share-confirm__caption\">\n      {{ sharedCase.caseId }}\n    </div>\n    <a [routerLink]=\"changeLink\" class=\"case-share-confirm__change-link govuk-link govuk-!-font-size-19\">Change</a>\n  </div>\n  <table class=\"govuk-table\">\n    <thead class=\"govuk-table__head\">\n    <tr class=\"govuk-table__row\">\n      <th class=\"govuk-table__header govuk-table-column-header\" scope=\"col\">Name</th>\n      <th class=\"govuk-table__header govuk-table-column-header\" scope=\"col\">Email address</th>\n      <th class=\"govuk-table__header govuk-table-column-actions\" scope=\"col\">Actions</th>\n    </tr>\n    </thead>\n    <tbody class=\"govuk-table__body\">\n    <tr class=\"govuk-table__row\" *ngFor=\"let user of sharedCase.pendingShares; trackBy: trackByUserId\">\n      <td class=\"govuk-table__cell\">{{ user.firstName + ' ' + user.lastName }}</td>\n      <td class=\"govuk-table__cell\">{{ user.email }}</td>\n      <td class=\"govuk-table__cell\">\n        <span class=\"hmcts-badge\">To be added</span>\n      </td>\n    </tr>\n    <tr class=\"govuk-table__row\" *ngFor=\"let user of sharedCase.pendingUnshares; trackBy: trackByUserId\">\n      <td class=\"govuk-table__cell\">{{ user.firstName + ' ' + user.lastName }}</td>\n      <td class=\"govuk-table__cell\">{{ user.email }}</td>\n      <td class=\"govuk-table__cell\">\n        <span class=\"hmcts-badge hmcts-badge--red\">To be removed</span>\n      </td>\n    </tr>\n    </tbody>\n  </table>\n</div>\n", styles: [".case-share-confirm__title{margin-bottom:0}.case-share-confirm__caption-area{border-bottom:1px solid #b1b4b6;padding-bottom:10px;display:inline-block;width:100%;clear:both}.case-share-confirm__caption{float:left}.case-share-confirm__change-link{float:right}.govuk-table-column-header{width:45%}.govuk-table-column-actions{width:10%}\n"], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SelectedCaseConfirmComponent, decorators: [{
             type: Component,
             args: [{ selector: 'xuilib-selected-case-confirm', template: "<div id=\"user-access-block-{{ sharedCase.caseId }}\" *ngIf=\"showUserAccessBlock()\">\n  <h2 class=\"govuk-heading-m case-share-confirm__title\">{{ sharedCase.caseTitle }}</h2>\n  <div class=\"case-share-confirm__caption-area\">\n    <div class=\"govuk-caption-m case-share-confirm__caption\">\n      {{ sharedCase.caseId }}\n    </div>\n    <a [routerLink]=\"changeLink\" class=\"case-share-confirm__change-link govuk-link govuk-!-font-size-19\">Change</a>\n  </div>\n  <table class=\"govuk-table\">\n    <thead class=\"govuk-table__head\">\n    <tr class=\"govuk-table__row\">\n      <th class=\"govuk-table__header govuk-table-column-header\" scope=\"col\">Name</th>\n      <th class=\"govuk-table__header govuk-table-column-header\" scope=\"col\">Email address</th>\n      <th class=\"govuk-table__header govuk-table-column-actions\" scope=\"col\">Actions</th>\n    </tr>\n    </thead>\n    <tbody class=\"govuk-table__body\">\n    <tr class=\"govuk-table__row\" *ngFor=\"let user of sharedCase.pendingShares; trackBy: trackByUserId\">\n      <td class=\"govuk-table__cell\">{{ user.firstName + ' ' + user.lastName }}</td>\n      <td class=\"govuk-table__cell\">{{ user.email }}</td>\n      <td class=\"govuk-table__cell\">\n        <span class=\"hmcts-badge\">To be added</span>\n      </td>\n    </tr>\n    <tr class=\"govuk-table__row\" *ngFor=\"let user of sharedCase.pendingUnshares; trackBy: trackByUserId\">\n      <td class=\"govuk-table__cell\">{{ user.firstName + ' ' + user.lastName }}</td>\n      <td class=\"govuk-table__cell\">{{ user.email }}</td>\n      <td class=\"govuk-table__cell\">\n        <span class=\"hmcts-badge hmcts-badge--red\">To be removed</span>\n      </td>\n    </tr>\n    </tbody>\n  </table>\n</div>\n", styles: [".case-share-confirm__title{margin-bottom:0}.case-share-confirm__caption-area{border-bottom:1px solid #b1b4b6;padding-bottom:10px;display:inline-block;width:100%;clear:both}.case-share-confirm__caption{float:left}.case-share-confirm__change-link{float:right}.govuk-table-column-header{width:45%}.govuk-table-column-actions{width:10%}\n"] }]
         }], ctorParameters: function () { return [{ type: CaseSharingStateService }]; }, propDecorators: { sharedCase: [{
@@ -3224,10 +3226,10 @@ class SelectedCaseComponent {
     buildElementId(elementName) {
         return `${elementName}-${this.sharedCase.caseId}`;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: SelectedCaseComponent, deps: [{ token: CaseSharingStateService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.7", type: SelectedCaseComponent, selector: "xuilib-selected-case", inputs: { sharedCase: "sharedCase", selectedUser: "selectedUser", opened: "opened", removeUserFromCaseToggleOn: "removeUserFromCaseToggleOn", caseCount: "caseCount" }, outputs: { unselect: "unselect", synchronizeStore: "synchronizeStore" }, usesOnChanges: true, ngImport: i0, template: "<div id=\"{{buildElementId('govuk-accordion__section')}}\" class=\"govuk-accordion__section\">\n  <div class=\"govuk-grid-row govuk-case-header\">\n    <div class=\"govuk-grid-column-three-quarters\">\n      <h3 id=\"{{buildElementId('case-title')}}\" class=\"govuk-case-title\">{{ sharedCase.caseTitle }}</h3>\n      <h1 id=\"{{buildElementId('case-id')}}\" class=\"govuk-case-sub-title\">{{ sharedCase.caseId }}</h1>\n    </div>\n    <div class=\"govuk-grid-column-twenty-percent\">\n      <button *ngIf=\"caseCount > 1\"\n        id=\"{{buildElementId('btn-deselect-case')}}\" \n        class=\"govuk-button hmcts-button--secondary\" \n        (click)=\"onDeselect(sharedCase)\" \n        title=\"Deselect case\">Deselect case\n      </button>\n    </div>\n    <div class=\"govuk-accordion__section-header govuk-grid-column-five-percent\">\n      <div class=\"govuk-accordion__section-heading\">\n        <button type=\"button\" id=\"{{buildElementId('accordion-with-summary-sections-heading')}}\"\n              aria-controls=\"accordion-with-summary-sections-content-1\" class=\"govuk-accordion__section-button\"\n              aria-describedby=\"accordion-with-summary-sections-summary-1\" aria-expanded=\"false\" title=\"Expand or Collapse\">\n        <span class=\"govuk-accordion__icon\" aria-hidden=\"true\"></span></button>\n      </div>\n    </div>\n  </div>\n  <div id=\"{{buildElementId('accordion-with-summary-sections-content')}}\" class=\"govuk-accordion__section-content\"\n       aria-labelledby=\"buildElementId('accordion-with-summary-sections-heading')\" >\n    <div class=\"govuk-grid-row\" *ngIf=\"showNoUsersAccessInfo()\">\n      <span id=\"{{buildElementId('access-info-no-user')}}\" class=\"govuk-div-align-left\">No users from your organisation currently have access to this case.</span>\n    </div>\n    <div class=\"govuk-grid-row\" *ngIf=\"showUserHasAccessInfo()\">\n      <span id=\"{{buildElementId('access-info-has-users')}}\" class=\"govuk-div-align-left\">Users from your organisation with access to this case.</span>\n    </div>\n    <table class=\"govuk-table\" *ngIf=\"showUserAccessTable()\">\n      <thead class=\"govuk-table__head\">\n      <tr class=\"govuk-table__row\">\n        <th id=\"{{buildElementId('name-heading')}}\" class=\"govuk-table__header govuk-table-column-header\" scope=\"col\">Name</th>\n        <th id=\"{{buildElementId('email-heading')}}\" class=\"govuk-table__header govuk-table-column-header\" scope=\"col\">Email address</th>\n        <th id=\"{{buildElementId('action-heading')}}\" class=\"govuk-table__header govuk-table-column-actions\" scope=\"col\">Actions</th>\n        <th id=\"{{buildElementId('label-heading')}}\" class=\"govuk-table__header govuk-table-column-label\" scope=\"col\">Status</th>\n      </tr>\n      </thead>\n      <tbody class=\"govuk-table__body\">\n        <tr class=\"govuk-table__row\" *ngFor=\"let user of combinedSortedShares; index as idx; trackBy: trackByUserId\">\n          <td id=\"user-full-name-{{ userIdSetter(canCancel(sharedCase.caseId, user) | async, idx) }}\" class=\"govuk-table__cell\">{{ user.firstName + ' ' + user.lastName }}</td>\n          <td id=\"user-email-{{ userIdSetter(canCancel(sharedCase.caseId, user) | async, idx) }}\" class=\"govuk-table__cell\">{{ user.email }}</td>\n          <td class=\"govuk-table__cell\">\n            <a *ngIf=\"canRemove(sharedCase.caseId, user) | async\" (click)=\"onRemove(user, sharedCase)\" href=\"javascript:void(0);\">Remove <span class=\"govuk-visually-hidden\">{{ user.firstName + ' ' + user.lastName }} from case</span></a>\n            <a *ngIf=\"canCancel(sharedCase.caseId, user) | async\" (click)=\"onCancel(user, sharedCase)\" href=\"javascript:void(0);\">Cancel <span class=\"govuk-visually-hidden\">adding {{ user.firstName + ' ' + user.lastName }} to case</span></a>\n          </td>\n          <td class=\"govuk-table__cell\">\n            <span *ngIf=\"isToBeRemoved(sharedCase.caseId, user) | async\" class=\"hmcts-badge hmcts-badge--red\">To be removed</span>\n            <span *ngIf=\"isToBeAdded(sharedCase.caseId, user) | async\" class=\"hmcts-badge\">To be added</span>\n          </td>\n        </tr>\n      </tbody>\n    </table>\n  </div>\n</div>\n", styles: [".govuk-case-header{border-top:1px solid #bfc1c3}.govuk-case-title{font-family:nta,Arial,sans-serif;font-size:24px;color:#005ea5;font-weight:700;padding-left:0}.govuk-case-sub-title{font-family:nta,Arial,sans-serif;font-size:1rem!important;color:#6f777b;font-weight:400;padding-left:0}.govuk-grid-row{margin-left:0;margin-right:0}.govuk-grid-column-three-quarters{padding-top:5px;padding-left:0}.govuk-grid-column-twenty-percent{box-sizing:border-box;padding-top:10px;width:20%;float:left}.govuk-grid-column-five-percent{box-sizing:border-box;padding-top:15px;width:5%;float:left}.govuk-table-column-header{width:38%}.govuk-table-column-actions,.govuk-table-column-label{width:12%}.govuk-div-align-left{font-family:nta,Arial,sans-serif;font-size:1.1875rem!important;line-height:1.31579!important;text-align:left;margin-bottom:20px;padding-left:0;color:#0b0c0c}.govuk-accordion__section-header{border-top:0}.govuk-accordion__section-content{padding-top:0}\n"], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: SelectedCaseComponent, decorators: [{
+SelectedCaseComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SelectedCaseComponent, deps: [{ token: CaseSharingStateService }], target: i0.ɵɵFactoryTarget.Component });
+SelectedCaseComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: SelectedCaseComponent, selector: "xuilib-selected-case", inputs: { sharedCase: "sharedCase", selectedUser: "selectedUser", opened: "opened", removeUserFromCaseToggleOn: "removeUserFromCaseToggleOn", caseCount: "caseCount" }, outputs: { unselect: "unselect", synchronizeStore: "synchronizeStore" }, usesOnChanges: true, ngImport: i0, template: "<div id=\"{{buildElementId('govuk-accordion__section')}}\" class=\"govuk-accordion__section\">\n  <div class=\"govuk-grid-row govuk-case-header\">\n    <div class=\"govuk-grid-column-three-quarters\">\n      <h3 id=\"{{buildElementId('case-title')}}\" class=\"govuk-case-title\">{{ sharedCase.caseTitle }}</h3>\n      <h1 id=\"{{buildElementId('case-id')}}\" class=\"govuk-case-sub-title\">{{ sharedCase.caseId }}</h1>\n    </div>\n    <div class=\"govuk-grid-column-twenty-percent\">\n      <button *ngIf=\"caseCount > 1\"\n        id=\"{{buildElementId('btn-deselect-case')}}\" \n        class=\"govuk-button hmcts-button--secondary\" \n        (click)=\"onDeselect(sharedCase)\" \n        title=\"Deselect case\">Deselect case\n      </button>\n    </div>\n    <div class=\"govuk-accordion__section-header govuk-grid-column-five-percent\">\n      <div class=\"govuk-accordion__section-heading\">\n        <button type=\"button\" id=\"{{buildElementId('accordion-with-summary-sections-heading')}}\"\n              aria-controls=\"accordion-with-summary-sections-content-1\" class=\"govuk-accordion__section-button\"\n              aria-describedby=\"accordion-with-summary-sections-summary-1\" aria-expanded=\"false\" title=\"Expand or Collapse\">\n        <span class=\"govuk-accordion__icon\" aria-hidden=\"true\"></span></button>\n      </div>\n    </div>\n  </div>\n  <div id=\"{{buildElementId('accordion-with-summary-sections-content')}}\" class=\"govuk-accordion__section-content\"\n       aria-labelledby=\"buildElementId('accordion-with-summary-sections-heading')\" >\n    <div class=\"govuk-grid-row\" *ngIf=\"showNoUsersAccessInfo()\">\n      <span id=\"{{buildElementId('access-info-no-user')}}\" class=\"govuk-div-align-left\">No users from your organisation currently have access to this case.</span>\n    </div>\n    <div class=\"govuk-grid-row\" *ngIf=\"showUserHasAccessInfo()\">\n      <span id=\"{{buildElementId('access-info-has-users')}}\" class=\"govuk-div-align-left\">Users from your organisation with access to this case.</span>\n    </div>\n    <table class=\"govuk-table\" *ngIf=\"showUserAccessTable()\">\n      <thead class=\"govuk-table__head\">\n      <tr class=\"govuk-table__row\">\n        <th id=\"{{buildElementId('name-heading')}}\" class=\"govuk-table__header govuk-table-column-header\" scope=\"col\">Name</th>\n        <th id=\"{{buildElementId('email-heading')}}\" class=\"govuk-table__header govuk-table-column-header\" scope=\"col\">Email address</th>\n        <th id=\"{{buildElementId('action-heading')}}\" class=\"govuk-table__header govuk-table-column-actions\" scope=\"col\">Actions</th>\n        <th id=\"{{buildElementId('label-heading')}}\" class=\"govuk-table__header govuk-table-column-label\" scope=\"col\">Status</th>\n      </tr>\n      </thead>\n      <tbody class=\"govuk-table__body\">\n        <tr class=\"govuk-table__row\" *ngFor=\"let user of combinedSortedShares; index as idx; trackBy: trackByUserId\">\n          <td id=\"user-full-name-{{ userIdSetter(canCancel(sharedCase.caseId, user) | async, idx) }}\" class=\"govuk-table__cell\">{{ user.firstName + ' ' + user.lastName }}</td>\n          <td id=\"user-email-{{ userIdSetter(canCancel(sharedCase.caseId, user) | async, idx) }}\" class=\"govuk-table__cell\">{{ user.email }}</td>\n          <td class=\"govuk-table__cell\">\n            <a *ngIf=\"canRemove(sharedCase.caseId, user) | async\" (click)=\"onRemove(user, sharedCase)\" href=\"javascript:void(0);\">Remove <span class=\"govuk-visually-hidden\">{{ user.firstName + ' ' + user.lastName }} from case</span></a>\n            <a *ngIf=\"canCancel(sharedCase.caseId, user) | async\" (click)=\"onCancel(user, sharedCase)\" href=\"javascript:void(0);\">Cancel <span class=\"govuk-visually-hidden\">adding {{ user.firstName + ' ' + user.lastName }} to case</span></a>\n          </td>\n          <td class=\"govuk-table__cell\">\n            <span *ngIf=\"isToBeRemoved(sharedCase.caseId, user) | async\" class=\"hmcts-badge hmcts-badge--red\">To be removed</span>\n            <span *ngIf=\"isToBeAdded(sharedCase.caseId, user) | async\" class=\"hmcts-badge\">To be added</span>\n          </td>\n        </tr>\n      </tbody>\n    </table>\n  </div>\n</div>\n", styles: [".govuk-case-header{border-top:1px solid #bfc1c3}.govuk-case-title{font-family:nta,Arial,sans-serif;font-size:24px;color:#005ea5;font-weight:700;padding-left:0}.govuk-case-sub-title{font-family:nta,Arial,sans-serif;font-size:1rem!important;color:#6f777b;font-weight:400;padding-left:0}.govuk-grid-row{margin-left:0;margin-right:0}.govuk-grid-column-three-quarters{padding-top:5px;padding-left:0}.govuk-grid-column-twenty-percent{box-sizing:border-box;padding-top:10px;width:20%;float:left}.govuk-grid-column-five-percent{box-sizing:border-box;padding-top:15px;width:5%;float:left}.govuk-table-column-header{width:38%}.govuk-table-column-actions,.govuk-table-column-label{width:12%}.govuk-div-align-left{font-family:nta,Arial,sans-serif;font-size:1.1875rem!important;line-height:1.31579!important;text-align:left;margin-bottom:20px;padding-left:0;color:#0b0c0c}.govuk-accordion__section-header{border-top:0}.govuk-accordion__section-content{padding-top:0}\n"], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SelectedCaseComponent, decorators: [{
             type: Component,
             args: [{ selector: 'xuilib-selected-case', template: "<div id=\"{{buildElementId('govuk-accordion__section')}}\" class=\"govuk-accordion__section\">\n  <div class=\"govuk-grid-row govuk-case-header\">\n    <div class=\"govuk-grid-column-three-quarters\">\n      <h3 id=\"{{buildElementId('case-title')}}\" class=\"govuk-case-title\">{{ sharedCase.caseTitle }}</h3>\n      <h1 id=\"{{buildElementId('case-id')}}\" class=\"govuk-case-sub-title\">{{ sharedCase.caseId }}</h1>\n    </div>\n    <div class=\"govuk-grid-column-twenty-percent\">\n      <button *ngIf=\"caseCount > 1\"\n        id=\"{{buildElementId('btn-deselect-case')}}\" \n        class=\"govuk-button hmcts-button--secondary\" \n        (click)=\"onDeselect(sharedCase)\" \n        title=\"Deselect case\">Deselect case\n      </button>\n    </div>\n    <div class=\"govuk-accordion__section-header govuk-grid-column-five-percent\">\n      <div class=\"govuk-accordion__section-heading\">\n        <button type=\"button\" id=\"{{buildElementId('accordion-with-summary-sections-heading')}}\"\n              aria-controls=\"accordion-with-summary-sections-content-1\" class=\"govuk-accordion__section-button\"\n              aria-describedby=\"accordion-with-summary-sections-summary-1\" aria-expanded=\"false\" title=\"Expand or Collapse\">\n        <span class=\"govuk-accordion__icon\" aria-hidden=\"true\"></span></button>\n      </div>\n    </div>\n  </div>\n  <div id=\"{{buildElementId('accordion-with-summary-sections-content')}}\" class=\"govuk-accordion__section-content\"\n       aria-labelledby=\"buildElementId('accordion-with-summary-sections-heading')\" >\n    <div class=\"govuk-grid-row\" *ngIf=\"showNoUsersAccessInfo()\">\n      <span id=\"{{buildElementId('access-info-no-user')}}\" class=\"govuk-div-align-left\">No users from your organisation currently have access to this case.</span>\n    </div>\n    <div class=\"govuk-grid-row\" *ngIf=\"showUserHasAccessInfo()\">\n      <span id=\"{{buildElementId('access-info-has-users')}}\" class=\"govuk-div-align-left\">Users from your organisation with access to this case.</span>\n    </div>\n    <table class=\"govuk-table\" *ngIf=\"showUserAccessTable()\">\n      <thead class=\"govuk-table__head\">\n      <tr class=\"govuk-table__row\">\n        <th id=\"{{buildElementId('name-heading')}}\" class=\"govuk-table__header govuk-table-column-header\" scope=\"col\">Name</th>\n        <th id=\"{{buildElementId('email-heading')}}\" class=\"govuk-table__header govuk-table-column-header\" scope=\"col\">Email address</th>\n        <th id=\"{{buildElementId('action-heading')}}\" class=\"govuk-table__header govuk-table-column-actions\" scope=\"col\">Actions</th>\n        <th id=\"{{buildElementId('label-heading')}}\" class=\"govuk-table__header govuk-table-column-label\" scope=\"col\">Status</th>\n      </tr>\n      </thead>\n      <tbody class=\"govuk-table__body\">\n        <tr class=\"govuk-table__row\" *ngFor=\"let user of combinedSortedShares; index as idx; trackBy: trackByUserId\">\n          <td id=\"user-full-name-{{ userIdSetter(canCancel(sharedCase.caseId, user) | async, idx) }}\" class=\"govuk-table__cell\">{{ user.firstName + ' ' + user.lastName }}</td>\n          <td id=\"user-email-{{ userIdSetter(canCancel(sharedCase.caseId, user) | async, idx) }}\" class=\"govuk-table__cell\">{{ user.email }}</td>\n          <td class=\"govuk-table__cell\">\n            <a *ngIf=\"canRemove(sharedCase.caseId, user) | async\" (click)=\"onRemove(user, sharedCase)\" href=\"javascript:void(0);\">Remove <span class=\"govuk-visually-hidden\">{{ user.firstName + ' ' + user.lastName }} from case</span></a>\n            <a *ngIf=\"canCancel(sharedCase.caseId, user) | async\" (click)=\"onCancel(user, sharedCase)\" href=\"javascript:void(0);\">Cancel <span class=\"govuk-visually-hidden\">adding {{ user.firstName + ' ' + user.lastName }} to case</span></a>\n          </td>\n          <td class=\"govuk-table__cell\">\n            <span *ngIf=\"isToBeRemoved(sharedCase.caseId, user) | async\" class=\"hmcts-badge hmcts-badge--red\">To be removed</span>\n            <span *ngIf=\"isToBeAdded(sharedCase.caseId, user) | async\" class=\"hmcts-badge\">To be added</span>\n          </td>\n        </tr>\n      </tbody>\n    </table>\n  </div>\n</div>\n", styles: [".govuk-case-header{border-top:1px solid #bfc1c3}.govuk-case-title{font-family:nta,Arial,sans-serif;font-size:24px;color:#005ea5;font-weight:700;padding-left:0}.govuk-case-sub-title{font-family:nta,Arial,sans-serif;font-size:1rem!important;color:#6f777b;font-weight:400;padding-left:0}.govuk-grid-row{margin-left:0;margin-right:0}.govuk-grid-column-three-quarters{padding-top:5px;padding-left:0}.govuk-grid-column-twenty-percent{box-sizing:border-box;padding-top:10px;width:20%;float:left}.govuk-grid-column-five-percent{box-sizing:border-box;padding-top:15px;width:5%;float:left}.govuk-table-column-header{width:38%}.govuk-table-column-actions,.govuk-table-column-label{width:12%}.govuk-div-align-left{font-family:nta,Arial,sans-serif;font-size:1.1875rem!important;line-height:1.31579!important;text-align:left;margin-bottom:20px;padding-left:0;color:#0b0c0c}.govuk-accordion__section-header{border-top:0}.govuk-accordion__section-content{padding-top:0}\n"] }]
         }], ctorParameters: function () { return [{ type: CaseSharingStateService }]; }, propDecorators: { sharedCase: [{
@@ -3272,10 +3274,10 @@ class SelectedCaseListComponent {
     trackByCaseId(sharedCase) {
         return sharedCase.caseId;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: SelectedCaseListComponent, deps: [{ token: CaseSharingStateService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.7", type: SelectedCaseListComponent, selector: "xuilib-selected-case-list", inputs: { shareCases$: "shareCases$", removeUserFromCaseToggleOn: "removeUserFromCaseToggleOn", toConfirm: "toConfirm", changeLink: "changeLink" }, outputs: { unselect: "unselect", synchronizeStore: "synchronizeStore" }, ngImport: i0, template: "<ng-container *ngIf=\"!toConfirm\">\n  <xuilib-selected-case\n    *ngFor=\"let sharedCase of (shareCases$ | async); trackBy: trackByCaseId\"\n    [sharedCase]=\"sharedCase\"\n    [caseCount]=\"caseCount\"\n    [removeUserFromCaseToggleOn]=\"removeUserFromCaseToggleOn\"\n    (unselect)=\"onUnselect($event)\"\n    (synchronizeStore)=\"onSynchronizeStore($event)\"\n    >\n  </xuilib-selected-case>\n</ng-container>\n\n<ng-container *ngIf=\"toConfirm\">\n  <xuilib-selected-case-confirm\n    *ngFor=\"let sharedCase of (shareCases$ | async); trackBy: trackByCaseId\"\n    [sharedCase]=\"sharedCase\"\n    [changeLink]=\"changeLink\">\n  </xuilib-selected-case-confirm>\n</ng-container>\n", styles: [""], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: SelectedCaseComponent, selector: "xuilib-selected-case", inputs: ["sharedCase", "selectedUser", "opened", "removeUserFromCaseToggleOn", "caseCount"], outputs: ["unselect", "synchronizeStore"] }, { kind: "component", type: SelectedCaseConfirmComponent, selector: "xuilib-selected-case-confirm", inputs: ["sharedCase", "changeLink"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: SelectedCaseListComponent, decorators: [{
+SelectedCaseListComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SelectedCaseListComponent, deps: [{ token: CaseSharingStateService }], target: i0.ɵɵFactoryTarget.Component });
+SelectedCaseListComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: SelectedCaseListComponent, selector: "xuilib-selected-case-list", inputs: { shareCases$: "shareCases$", removeUserFromCaseToggleOn: "removeUserFromCaseToggleOn", toConfirm: "toConfirm", changeLink: "changeLink" }, outputs: { unselect: "unselect", synchronizeStore: "synchronizeStore" }, ngImport: i0, template: "<ng-container *ngIf=\"!toConfirm\">\n  <xuilib-selected-case\n    *ngFor=\"let sharedCase of (shareCases$ | async); trackBy: trackByCaseId\"\n    [sharedCase]=\"sharedCase\"\n    [caseCount]=\"caseCount\"\n    [removeUserFromCaseToggleOn]=\"removeUserFromCaseToggleOn\"\n    (unselect)=\"onUnselect($event)\"\n    (synchronizeStore)=\"onSynchronizeStore($event)\"\n    >\n  </xuilib-selected-case>\n</ng-container>\n\n<ng-container *ngIf=\"toConfirm\">\n  <xuilib-selected-case-confirm\n    *ngFor=\"let sharedCase of (shareCases$ | async); trackBy: trackByCaseId\"\n    [sharedCase]=\"sharedCase\"\n    [changeLink]=\"changeLink\">\n  </xuilib-selected-case-confirm>\n</ng-container>\n", styles: [""], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: SelectedCaseComponent, selector: "xuilib-selected-case", inputs: ["sharedCase", "selectedUser", "opened", "removeUserFromCaseToggleOn", "caseCount"], outputs: ["unselect", "synchronizeStore"] }, { kind: "component", type: SelectedCaseConfirmComponent, selector: "xuilib-selected-case-confirm", inputs: ["sharedCase", "changeLink"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SelectedCaseListComponent, decorators: [{
             type: Component,
             args: [{ selector: 'xuilib-selected-case-list', template: "<ng-container *ngIf=\"!toConfirm\">\n  <xuilib-selected-case\n    *ngFor=\"let sharedCase of (shareCases$ | async); trackBy: trackByCaseId\"\n    [sharedCase]=\"sharedCase\"\n    [caseCount]=\"caseCount\"\n    [removeUserFromCaseToggleOn]=\"removeUserFromCaseToggleOn\"\n    (unselect)=\"onUnselect($event)\"\n    (synchronizeStore)=\"onSynchronizeStore($event)\"\n    >\n  </xuilib-selected-case>\n</ng-container>\n\n<ng-container *ngIf=\"toConfirm\">\n  <xuilib-selected-case-confirm\n    *ngFor=\"let sharedCase of (shareCases$ | async); trackBy: trackByCaseId\"\n    [sharedCase]=\"sharedCase\"\n    [changeLink]=\"changeLink\">\n  </xuilib-selected-case-confirm>\n</ng-container>\n" }]
         }], ctorParameters: function () { return [{ type: CaseSharingStateService }]; }, propDecorators: { shareCases$: [{
@@ -3299,10 +3301,10 @@ class ServiceMessageComponent {
     onHideMessageEvent(key) {
         this.hideMessage.emit(key);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: ServiceMessageComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.7", type: ServiceMessageComponent, selector: "xuilib-service-message", inputs: { message: "message", key: "key" }, outputs: { hideMessage: "hideMessage" }, ngImport: i0, template: "<div class=\"hmcts-banner hmcts-banner--warning\">\n\n    <svg class=\"hmcts-banner__icon\" fill=\"currentColor\" role=\"presentation\" focusable=\"false\"\n        xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 25 25\" height=\"25\" width=\"25\">\n        <path d=\"M13.6,15.4h-2.3v-4.5h2.3V15.4z M13.6,19.8h-2.3v-2.2h2.3V19.8z M0,23.2h25L12.5,2L0,23.2z\" />\n    </svg>\n\n    <div class=\"hmcts-banner__message\">\n        <span class=\"hmcts-banner__assistive\">Warning</span>\n        <h2 class=\"govuk-heading-s\" [innerHTML]=\"message\"></h2>\n        <a [routerLink]=\"[]\" class=\"govuk-link--no-visited-state\" (click)=\"onHideMessageEvent(key)\">Hide message</a>\n    </div>\n\n</div>", dependencies: [{ kind: "directive", type: i2.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: ServiceMessageComponent, decorators: [{
+ServiceMessageComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: ServiceMessageComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+ServiceMessageComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: ServiceMessageComponent, selector: "xuilib-service-message", inputs: { message: "message", key: "key" }, outputs: { hideMessage: "hideMessage" }, ngImport: i0, template: "<div class=\"hmcts-banner hmcts-banner--warning\">\n\n    <svg class=\"hmcts-banner__icon\" fill=\"currentColor\" role=\"presentation\" focusable=\"false\"\n        xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 25 25\" height=\"25\" width=\"25\">\n        <path d=\"M13.6,15.4h-2.3v-4.5h2.3V15.4z M13.6,19.8h-2.3v-2.2h2.3V19.8z M0,23.2h25L12.5,2L0,23.2z\" />\n    </svg>\n\n    <div class=\"hmcts-banner__message\">\n        <span class=\"hmcts-banner__assistive\">Warning</span>\n        <h2 class=\"govuk-heading-s\" [innerHTML]=\"message\"></h2>\n        <a [routerLink]=\"[]\" class=\"govuk-link--no-visited-state\" (click)=\"onHideMessageEvent(key)\">Hide message</a>\n    </div>\n\n</div>", dependencies: [{ kind: "directive", type: i2.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: ServiceMessageComponent, decorators: [{
             type: Component,
             args: [{ selector: 'xuilib-service-message', template: "<div class=\"hmcts-banner hmcts-banner--warning\">\n\n    <svg class=\"hmcts-banner__icon\" fill=\"currentColor\" role=\"presentation\" focusable=\"false\"\n        xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 25 25\" height=\"25\" width=\"25\">\n        <path d=\"M13.6,15.4h-2.3v-4.5h2.3V15.4z M13.6,19.8h-2.3v-2.2h2.3V19.8z M0,23.2h25L12.5,2L0,23.2z\" />\n    </svg>\n\n    <div class=\"hmcts-banner__message\">\n        <span class=\"hmcts-banner__assistive\">Warning</span>\n        <h2 class=\"govuk-heading-s\" [innerHTML]=\"message\"></h2>\n        <a [routerLink]=\"[]\" class=\"govuk-link--no-visited-state\" (click)=\"onHideMessageEvent(key)\">Hide message</a>\n    </div>\n\n</div>" }]
         }], ctorParameters: function () { return []; }, propDecorators: { message: [{
@@ -3343,10 +3345,10 @@ class ServiceMessagesComponent {
         this.hiddenBanners.push(key);
         window.sessionStorage.setItem(this.serviceMessageCookie, JSON.stringify(this.hiddenBanners));
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: ServiceMessagesComponent, deps: [{ token: FeatureToggleService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.7", type: ServiceMessagesComponent, selector: "xuilib-service-messages", inputs: { userRoles: "userRoles", featureToggleKey: "featureToggleKey", serviceMessageCookie: "serviceMessageCookie" }, ngImport: i0, template: "<div *ngIf=\"filteredMessages?.size > 0\" class=\"govuk-width-container govuk-!-margin-top-6\">\n    <xuilib-service-message *ngFor=\"let message of filteredMessages | keyvalue\" [key]=\"message.key\"\n        [message]=\"message.value\" (hideMessage)=\"hideMessage($event)\"></xuilib-service-message>\n</div>", dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: ServiceMessageComponent, selector: "xuilib-service-message", inputs: ["message", "key"], outputs: ["hideMessage"] }, { kind: "pipe", type: i1.KeyValuePipe, name: "keyvalue" }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: ServiceMessagesComponent, decorators: [{
+ServiceMessagesComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: ServiceMessagesComponent, deps: [{ token: FeatureToggleService }], target: i0.ɵɵFactoryTarget.Component });
+ServiceMessagesComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: ServiceMessagesComponent, selector: "xuilib-service-messages", inputs: { userRoles: "userRoles", featureToggleKey: "featureToggleKey", serviceMessageCookie: "serviceMessageCookie" }, ngImport: i0, template: "<div *ngIf=\"filteredMessages?.size > 0\" class=\"govuk-width-container govuk-!-margin-top-6\">\n    <xuilib-service-message *ngFor=\"let message of filteredMessages | keyvalue\" [key]=\"message.key\"\n        [message]=\"message.value\" (hideMessage)=\"hideMessage($event)\"></xuilib-service-message>\n</div>", dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: ServiceMessageComponent, selector: "xuilib-service-message", inputs: ["message", "key"], outputs: ["hideMessage"] }, { kind: "pipe", type: i1.KeyValuePipe, name: "keyvalue" }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: ServiceMessagesComponent, decorators: [{
             type: Component,
             args: [{ selector: 'xuilib-service-messages', template: "<div *ngIf=\"filteredMessages?.size > 0\" class=\"govuk-width-container govuk-!-margin-top-6\">\n    <xuilib-service-message *ngFor=\"let message of filteredMessages | keyvalue\" [key]=\"message.key\"\n        [message]=\"message.value\" (hideMessage)=\"hideMessage($event)\"></xuilib-service-message>\n</div>" }]
         }], ctorParameters: function () { return [{ type: FeatureToggleService }]; }, propDecorators: { userRoles: [{
@@ -3371,10 +3373,10 @@ class ShareCaseConfirmComponent {
         });
         this.shareCases$ = this.stateService.state;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: ShareCaseConfirmComponent, deps: [{ token: CaseSharingStateService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.7", type: ShareCaseConfirmComponent, selector: "xuilib-share-case-confirm", inputs: { shareCases$: "shareCases$", changeLink: "changeLink", completeLink: "completeLink" }, ngImport: i0, template: "<div id=\"casesToConfirm\">\n  <h3 class=\"govuk-heading-l\">Cases</h3>\n  <div *ngIf=\"shareCases && shareCases.length > 0\" id=\"summarySections\">\n    <xuilib-selected-case-list\n      [shareCases$]=\"shareCases$\"\n      [toConfirm]=\"true\"\n      [changeLink]=\"changeLink\">\n    </xuilib-selected-case-list>\n  </div>\n\n  <div id=\"noCaseDisplay\" *ngIf=\"shareCases && shareCases.length === 0\" class=\"govuk-hint\">\n    No cases to display.\n  </div>\n\n</div>\n\n<div id=\"share-case-nav\" *ngIf=\"shareCases && shareCases.length > 0\">\n  <button class=\"govuk-button\" title=\"Confirm\" [routerLink]=\"completeLink\">Confirm</button>\n</div>\n", styles: [""], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "component", type: SelectedCaseListComponent, selector: "xuilib-selected-case-list", inputs: ["shareCases$", "removeUserFromCaseToggleOn", "toConfirm", "changeLink"], outputs: ["unselect", "synchronizeStore"] }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: ShareCaseConfirmComponent, decorators: [{
+ShareCaseConfirmComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: ShareCaseConfirmComponent, deps: [{ token: CaseSharingStateService }], target: i0.ɵɵFactoryTarget.Component });
+ShareCaseConfirmComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: ShareCaseConfirmComponent, selector: "xuilib-share-case-confirm", inputs: { shareCases$: "shareCases$", changeLink: "changeLink", completeLink: "completeLink" }, ngImport: i0, template: "<div id=\"casesToConfirm\">\n  <h3 class=\"govuk-heading-l\">Cases</h3>\n  <div *ngIf=\"shareCases && shareCases.length > 0\" id=\"summarySections\">\n    <xuilib-selected-case-list\n      [shareCases$]=\"shareCases$\"\n      [toConfirm]=\"true\"\n      [changeLink]=\"changeLink\">\n    </xuilib-selected-case-list>\n  </div>\n\n  <div id=\"noCaseDisplay\" *ngIf=\"shareCases && shareCases.length === 0\" class=\"govuk-hint\">\n    No cases to display.\n  </div>\n\n</div>\n\n<div id=\"share-case-nav\" *ngIf=\"shareCases && shareCases.length > 0\">\n  <button class=\"govuk-button\" title=\"Confirm\" [routerLink]=\"completeLink\">Confirm</button>\n</div>\n", styles: [""], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "component", type: SelectedCaseListComponent, selector: "xuilib-selected-case-list", inputs: ["shareCases$", "removeUserFromCaseToggleOn", "toConfirm", "changeLink"], outputs: ["unselect", "synchronizeStore"] }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: ShareCaseConfirmComponent, decorators: [{
             type: Component,
             args: [{ selector: 'xuilib-share-case-confirm', template: "<div id=\"casesToConfirm\">\n  <h3 class=\"govuk-heading-l\">Cases</h3>\n  <div *ngIf=\"shareCases && shareCases.length > 0\" id=\"summarySections\">\n    <xuilib-selected-case-list\n      [shareCases$]=\"shareCases$\"\n      [toConfirm]=\"true\"\n      [changeLink]=\"changeLink\">\n    </xuilib-selected-case-list>\n  </div>\n\n  <div id=\"noCaseDisplay\" *ngIf=\"shareCases && shareCases.length === 0\" class=\"govuk-hint\">\n    No cases to display.\n  </div>\n\n</div>\n\n<div id=\"share-case-nav\" *ngIf=\"shareCases && shareCases.length > 0\">\n  <button class=\"govuk-button\" title=\"Confirm\" [routerLink]=\"completeLink\">Confirm</button>\n</div>\n" }]
         }], ctorParameters: function () { return [{ type: CaseSharingStateService }]; }, propDecorators: { shareCases$: [{
@@ -3426,10 +3428,10 @@ class UserSelectComponent {
         }
         return [];
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: UserSelectComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.7", type: UserSelectComponent, selector: "xuilib-user-select", inputs: { users: "users" }, outputs: { selected: "selected" }, ngImport: i0, template: "<input class=\"govuk-input\" type=\"text\" [matAutocomplete]=\"dropdown\" [formControl]=\"control\" (ngModelChange)=\"onUserChange($event)\" aria-labelledby=\"add-user-hint\">\n\n<mat-autocomplete #dropdown=\"matAutocomplete\" [displayWith]=\"displayValue\" autoActiveFirstOption (optionSelected)=\"onSelected($event)\">\n  <mat-option *ngFor=\"let user of filteredUsers | async\" [value]=\"user\">\n    {{ user.firstName }} {{ user.lastName }} - {{ user.email }}\n  </mat-option>\n</mat-autocomplete>", styles: [""], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2$3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$3.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "component", type: i4.MatLegacyAutocomplete, selector: "mat-autocomplete", inputs: ["disableRipple"], exportAs: ["matAutocomplete"] }, { kind: "directive", type: i4.MatLegacyAutocompleteTrigger, selector: "input[matAutocomplete], textarea[matAutocomplete]", exportAs: ["matAutocompleteTrigger"] }, { kind: "component", type: i5.MatLegacyOption, selector: "mat-option", exportAs: ["matOption"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: UserSelectComponent, decorators: [{
+UserSelectComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: UserSelectComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+UserSelectComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: UserSelectComponent, selector: "xuilib-user-select", inputs: { users: "users" }, outputs: { selected: "selected" }, ngImport: i0, template: "<input class=\"govuk-input\" type=\"text\" [matAutocomplete]=\"dropdown\" [formControl]=\"control\" (ngModelChange)=\"onUserChange($event)\" aria-labelledby=\"add-user-hint\">\n\n<mat-autocomplete #dropdown=\"matAutocomplete\" [displayWith]=\"displayValue\" autoActiveFirstOption (optionSelected)=\"onSelected($event)\">\n  <mat-option *ngFor=\"let user of filteredUsers | async\" [value]=\"user\">\n    {{ user.firstName }} {{ user.lastName }} - {{ user.email }}\n  </mat-option>\n</mat-autocomplete>", styles: [""], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2$3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$3.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "component", type: i4.MatLegacyAutocomplete, selector: "mat-autocomplete", inputs: ["disableRipple"], exportAs: ["matAutocomplete"] }, { kind: "directive", type: i4.MatLegacyAutocompleteTrigger, selector: "input[matAutocomplete], textarea[matAutocomplete]", exportAs: ["matAutocompleteTrigger"] }, { kind: "component", type: i5.MatLegacyOption, selector: "mat-option", exportAs: ["matOption"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: UserSelectComponent, decorators: [{
             type: Component,
             args: [{ selector: 'xuilib-user-select', template: "<input class=\"govuk-input\" type=\"text\" [matAutocomplete]=\"dropdown\" [formControl]=\"control\" (ngModelChange)=\"onUserChange($event)\" aria-labelledby=\"add-user-hint\">\n\n<mat-autocomplete #dropdown=\"matAutocomplete\" [displayWith]=\"displayValue\" autoActiveFirstOption (optionSelected)=\"onSelected($event)\">\n  <mat-option *ngFor=\"let user of filteredUsers | async\" [value]=\"user\">\n    {{ user.firstName }} {{ user.lastName }} - {{ user.email }}\n  </mat-option>\n</mat-autocomplete>" }]
         }], ctorParameters: function () { return []; }, propDecorators: { users: [{
@@ -3445,12 +3447,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.7", ngImpor
   Component is also responsible for scrolling. Up and Down the page when user click on links
 */
 class HmctsErrorSummaryComponent {
-    set errorMessages(value) {
-        this.messages = value;
-    }
     constructor(document) {
         this.document = document;
     }
+    set errorMessages(value) {
+        this.messages = value;
+    }
     ngAfterViewInit() {
         this.scrollTo('errorSummary');
     }
@@ -3468,10 +3470,10 @@ class HmctsErrorSummaryComponent {
     hasElement(selector) {
         return this.document.querySelector(`#${selector}`);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: HmctsErrorSummaryComponent, deps: [{ token: DOCUMENT }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.7", type: HmctsErrorSummaryComponent, selector: "xuilib-hmcts-error-summary", inputs: { errorMessages: "errorMessages", header: "header", showWarningMessage: "showWarningMessage" }, usesOnChanges: true, ngImport: i0, template: "<!-- div *ngIf=\"!showWarningMessage && messages && messages.length > 0\" id=\"errorSummary\" class=\"govuk-error-summary\" aria-labelledby=\"error-summary-title\" role=\"alert\" tabindex=\"-1\"\n      data-module=\"error-summary\">\n  <h2 class=\"govuk-error-summary__title\" id=\"error-summary-title\">\n    {{header}}\n  </h2>\n  <div class=\"govuk-error-summary__body\">\n    <ul class=\"govuk-list govuk-error-summary__list\">\n      <li *ngFor=\"let message of messages\">\n        <a (click)=\"scrollTo(message['id'])\" [routerLink]=\"[][]\" [fragment]=\"message['id']\"\n          *ngIf=\"hasElement(message['id'])\">{{message['message']}}</a>\n        <span *ngIf=\"!hasElement(message['id'])\">{{message['message']}}</span>\n      </li>\n    </ul>\n  </div>\n</div>\n<div *ngIf=\"showWarningMessage\" class=\"hmcts-banner hmcts-banner--warning\">\n  <svg class=\"hmcts-banner__icon\" fill=\"currentColor\" role=\"presentation\" focusable=\"false\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 25 25\" height=\"25\" width=\"25\">\n  <path d=\"M13.6,15.4h-2.3v-4.5h2.3V15.4z M13.6,19.8h-2.3v-2.2h2.3V19.8z M0,23.2h25L12.5,2L0,23.2z\" /></svg>\n  <div class=\"hmcts-banner__message\">\n      <span class=\"hmcts-banner__assistive\">Warning</span>\n      <p class=\"govuk-body\" *ngFor=\"let message of messages\">{{ message['message'] }}</p>\n  </div>\n</div -->\n" }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: HmctsErrorSummaryComponent, decorators: [{
+HmctsErrorSummaryComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: HmctsErrorSummaryComponent, deps: [{ token: DOCUMENT }], target: i0.ɵɵFactoryTarget.Component });
+HmctsErrorSummaryComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: HmctsErrorSummaryComponent, selector: "xuilib-hmcts-error-summary", inputs: { errorMessages: "errorMessages", header: "header", showWarningMessage: "showWarningMessage" }, usesOnChanges: true, ngImport: i0, template: "<!-- div *ngIf=\"!showWarningMessage && messages && messages.length > 0\" id=\"errorSummary\" class=\"govuk-error-summary\" aria-labelledby=\"error-summary-title\" role=\"alert\" tabindex=\"-1\"\n      data-module=\"error-summary\">\n  <h2 class=\"govuk-error-summary__title\" id=\"error-summary-title\">\n    {{header}}\n  </h2>\n  <div class=\"govuk-error-summary__body\">\n    <ul class=\"govuk-list govuk-error-summary__list\">\n      <li *ngFor=\"let message of messages\">\n        <a (click)=\"scrollTo(message['id'])\" [routerLink]=\"[][]\" [fragment]=\"message['id']\"\n          *ngIf=\"hasElement(message['id'])\">{{message['message']}}</a>\n        <span *ngIf=\"!hasElement(message['id'])\">{{message['message']}}</span>\n      </li>\n    </ul>\n  </div>\n</div>\n<div *ngIf=\"showWarningMessage\" class=\"hmcts-banner hmcts-banner--warning\">\n  <svg class=\"hmcts-banner__icon\" fill=\"currentColor\" role=\"presentation\" focusable=\"false\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 25 25\" height=\"25\" width=\"25\">\n  <path d=\"M13.6,15.4h-2.3v-4.5h2.3V15.4z M13.6,19.8h-2.3v-2.2h2.3V19.8z M0,23.2h25L12.5,2L0,23.2z\" /></svg>\n  <div class=\"hmcts-banner__message\">\n      <span class=\"hmcts-banner__assistive\">Warning</span>\n      <p class=\"govuk-body\" *ngFor=\"let message of messages\">{{ message['message'] }}</p>\n  </div>\n</div -->\n" });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: HmctsErrorSummaryComponent, decorators: [{
             type: Component,
             args: [{ selector: 'xuilib-hmcts-error-summary', template: "<!-- div *ngIf=\"!showWarningMessage && messages && messages.length > 0\" id=\"errorSummary\" class=\"govuk-error-summary\" aria-labelledby=\"error-summary-title\" role=\"alert\" tabindex=\"-1\"\n      data-module=\"error-summary\">\n  <h2 class=\"govuk-error-summary__title\" id=\"error-summary-title\">\n    {{header}}\n  </h2>\n  <div class=\"govuk-error-summary__body\">\n    <ul class=\"govuk-list govuk-error-summary__list\">\n      <li *ngFor=\"let message of messages\">\n        <a (click)=\"scrollTo(message['id'])\" [routerLink]=\"[][]\" [fragment]=\"message['id']\"\n          *ngIf=\"hasElement(message['id'])\">{{message['message']}}</a>\n        <span *ngIf=\"!hasElement(message['id'])\">{{message['message']}}</span>\n      </li>\n    </ul>\n  </div>\n</div>\n<div *ngIf=\"showWarningMessage\" class=\"hmcts-banner hmcts-banner--warning\">\n  <svg class=\"hmcts-banner__icon\" fill=\"currentColor\" role=\"presentation\" focusable=\"false\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 25 25\" height=\"25\" width=\"25\">\n  <path d=\"M13.6,15.4h-2.3v-4.5h2.3V15.4z M13.6,19.8h-2.3v-2.2h2.3V19.8z M0,23.2h25L12.5,2L0,23.2z\" /></svg>\n  <div class=\"hmcts-banner__message\">\n      <span class=\"hmcts-banner__assistive\">Warning</span>\n      <p class=\"govuk-body\" *ngFor=\"let message of messages\">{{ message['message'] }}</p>\n  </div>\n</div -->\n" }]
         }], ctorParameters: function () { return [{ type: undefined, decorators: [{
@@ -3656,10 +3658,10 @@ class ShareCaseComponent {
                 (!sharedCase.pendingShares || sharedCase.pendingShares.length === 0);
         });
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: ShareCaseComponent, deps: [{ token: CaseSharingStateService }, { token: i2.Router }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.7", type: ShareCaseComponent, selector: "xuilib-share-case", inputs: { removeUserFromCaseToggleOn: "removeUserFromCaseToggleOn", shareCases$: "shareCases$", users: "users", confirmLink: "confirmLink", cancelLink: "cancelLink", addUserLabel: "addUserLabel", showRemoveUsers: "showRemoveUsers", fnTitle: "fnTitle", title: "title" }, outputs: { unselect: "unselect", synchronizeStore: "synchronizeStore" }, viewQueries: [{ propertyName: "userSelect", first: true, predicate: UserSelectComponent, descendants: true, static: true }], ngImport: i0, template: "<xuilib-hmcts-error-summary\n  [errorMessages]=\"validationErrors\"\n  [header]=\"'There is a problem'\"\n></xuilib-hmcts-error-summary>\n<h1 *ngIf=\"title\" class=\"govuk-heading-xl govuk-!-margin-top-2\">\n  <span *ngIf=\"fnTitle\" class=\"govuk-caption-xl\">{{fnTitle}}</span>\n  {{title}}\n</h1>\n<div id=\"add-user\">\n  <div class=\"govuk-form-group\">\n    <label class=\"govuk-label govuk-!-font-weight-bold\" for=\"add-user-input\">{{addUserLabel}}</label>\n    <span id=\"add-user-hint\" class=\"govuk-hint\">\n      Search by name or email address. You can share access with as many people as you need.\n    </span>\n    <div class=\"govuk-grid-row\">\n      <div class=\"govuk-grid-column-two-thirds\">\n        <xuilib-user-select\n          id=\"add-user-input\"\n          aria-describedby=\"add-user-hint\"\n          [users]=\"users\"\n          (selected)=\"onSelectedUser($event)\">\n        </xuilib-user-select>\n      </div>\n      <div class=\"govuk-grid-column-one-thirds\">\n        <button id=\"btn-add-user\" (click)=\"addUser()\" class=\"govuk-button govuk-button--secondary\" [disabled]=\"isDisabledAdd()\" title=\"Add user to selected cases\">Add</button>\n      </div>\n    </div>\n    <details id=\"add-user-help\" class=\"govuk-details\" data-module=\"govuk-details\">\n      <summary class=\"govuk-details__summary\">\n      <span id=\"content-why-can-not-find-email\" class=\"govuk-details__summary-text\">\n        Can't find an email address?\n      </span>\n      </summary>\n      <div id=\"content-reason-can-not-find-email\" class=\"govuk-details__text\">\n        If you can't find your colleague's email address, they will need to complete their registration. Contact your\n        administrator for help.\n      </div>\n    </details>\n  </div>\n  <div class=\"govuk-form-group\" *ngIf=\"showRemoveUsers\">\n    <label class=\"govuk-label govuk-!-font-weight-bold\" for=\"remove-user-input\">Remove a person from all cases</label>\n    <span id=\"remove-user-hint\" class=\"govuk-hint\">\n      Select a person to remove them from all selected cases.\n    </span>\n    <div class=\"govuk-grid-row\">\n      <div class=\"govuk-grid-column-two-thirds\">\n        <select [(ngModel)]=\"selectedUserToRemove\" class=\"govuk-select\" id=\"remove-user-input\" aria-describedby=\"remove-user-hint\">\n          <option [ngValue]=\"null\" selected>Select a person</option>\n          <option *ngFor=\"let user of assignedUsers\" [ngValue]=\"user\">{{user.firstName}} {{user.lastName}} - {{user.email}}</option>\n        </select>\n      </div>\n      <div class=\"govuk-grid-column-one-thirds\">\n        <button id=\"btn-remove-user\" (click)=\"removeUser()\" class=\"govuk-button govuk-button--secondary\" title=\"Remove user from selected cases\">Remove</button>\n      </div>\n    </div>\n  </div>\n</div>\n\n<div id=\"cases\" [ngClass]=\"{'govuk-form-group--error': shareCaseErrorMessage.messages && shareCaseErrorMessage.messages.length > 0}\">\n  <h3 id=\"title-selected-cases\" class=\"govuk-heading-m\">Selected cases</h3>\n  <xuilib-gov-uk-error-message [config]=\"selectedCasesErrorMessageConfig\" [errorMessage]=\"shareCaseErrorMessage\"></xuilib-gov-uk-error-message>\n  <div *ngIf=\"shareCases && shareCases.length > 0\" class=\"govuk-accordion\" data-module=\"govuk-accordion\" id=\"accordion-with-summary-sections\">\n    <xuilib-selected-case-list\n      [shareCases$]=\"shareCases$\"\n      [removeUserFromCaseToggleOn]=\"removeUserFromCaseToggleOn\"\n      (unselect)=\"onUnselect($event)\"\n      (synchronizeStore)=\"onSynchronizeStore($event)\"\n    >\n    </xuilib-selected-case-list>\n  </div>\n\n  <div id=\"noCaseDisplay\" *ngIf=\"shareCases && shareCases.length === 0\" class=\"govuk-hint\"\n    [ngClass]=\"{'govuk-form-group--error': shareCaseErrorMessage.messages && shareCaseErrorMessage.messages.length > 0}\">\n    No cases to display.\n  </div>\n\n</div>\n\n<div id=\"share-case-nav\" class=\"govuk-button-group\">\n  <button id=\"btn-continue\" class=\"govuk-button\" data-module=\"govuk-button\" (click)=\"onContinue()\" title=\"Continue\">Continue</button>\n  <button id=\"btn-cancel\" class=\"govuk-button govuk-button--secondary\" data-module=\"govuk-button\" title=\"Cancel\" [routerLink]=\"cancelLink\">Cancel</button>\n</div>\n", styles: ["select{width:100%}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2$3.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i2$3.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i2$3.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { kind: "directive", type: i2$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i2.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "component", type: SelectedCaseListComponent, selector: "xuilib-selected-case-list", inputs: ["shareCases$", "removeUserFromCaseToggleOn", "toConfirm", "changeLink"], outputs: ["unselect", "synchronizeStore"] }, { kind: "component", type: UserSelectComponent, selector: "xuilib-user-select", inputs: ["users"], outputs: ["selected"] }, { kind: "component", type: HmctsErrorSummaryComponent, selector: "xuilib-hmcts-error-summary", inputs: ["errorMessages", "header", "showWarningMessage"] }, { kind: "component", type: GovUkErrorMessageComponent, selector: " xuilib-gov-uk-error-message", inputs: ["config", "errorMessage"] }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: ShareCaseComponent, decorators: [{
+ShareCaseComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: ShareCaseComponent, deps: [{ token: CaseSharingStateService }, { token: i2.Router }], target: i0.ɵɵFactoryTarget.Component });
+ShareCaseComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: ShareCaseComponent, selector: "xuilib-share-case", inputs: { removeUserFromCaseToggleOn: "removeUserFromCaseToggleOn", shareCases$: "shareCases$", users: "users", confirmLink: "confirmLink", cancelLink: "cancelLink", addUserLabel: "addUserLabel", showRemoveUsers: "showRemoveUsers", fnTitle: "fnTitle", title: "title" }, outputs: { unselect: "unselect", synchronizeStore: "synchronizeStore" }, viewQueries: [{ propertyName: "userSelect", first: true, predicate: UserSelectComponent, descendants: true, static: true }], ngImport: i0, template: "<xuilib-hmcts-error-summary\n  [errorMessages]=\"validationErrors\"\n  [header]=\"'There is a problem'\"\n></xuilib-hmcts-error-summary>\n<h1 *ngIf=\"title\" class=\"govuk-heading-xl govuk-!-margin-top-2\">\n  <span *ngIf=\"fnTitle\" class=\"govuk-caption-xl\">{{fnTitle}}</span>\n  {{title}}\n</h1>\n<div id=\"add-user\">\n  <div class=\"govuk-form-group\">\n    <label class=\"govuk-label govuk-!-font-weight-bold\" for=\"add-user-input\">{{addUserLabel}}</label>\n    <span id=\"add-user-hint\" class=\"govuk-hint\">\n      Search by name or email address. You can share access with as many people as you need.\n    </span>\n    <div class=\"govuk-grid-row\">\n      <div class=\"govuk-grid-column-two-thirds\">\n        <xuilib-user-select\n          id=\"add-user-input\"\n          aria-describedby=\"add-user-hint\"\n          [users]=\"users\"\n          (selected)=\"onSelectedUser($event)\">\n        </xuilib-user-select>\n      </div>\n      <div class=\"govuk-grid-column-one-thirds\">\n        <button id=\"btn-add-user\" (click)=\"addUser()\" class=\"govuk-button govuk-button--secondary\" [disabled]=\"isDisabledAdd()\" title=\"Add user to selected cases\">Add</button>\n      </div>\n    </div>\n    <details id=\"add-user-help\" class=\"govuk-details\" data-module=\"govuk-details\">\n      <summary class=\"govuk-details__summary\">\n      <span id=\"content-why-can-not-find-email\" class=\"govuk-details__summary-text\">\n        Can't find an email address?\n      </span>\n      </summary>\n      <div id=\"content-reason-can-not-find-email\" class=\"govuk-details__text\">\n        If you can't find your colleague's email address, they will need to complete their registration. Contact your\n        administrator for help.\n      </div>\n    </details>\n  </div>\n  <div class=\"govuk-form-group\" *ngIf=\"showRemoveUsers\">\n    <label class=\"govuk-label govuk-!-font-weight-bold\" for=\"remove-user-input\">Remove a person from all cases</label>\n    <span id=\"remove-user-hint\" class=\"govuk-hint\">\n      Select a person to remove them from all selected cases.\n    </span>\n    <div class=\"govuk-grid-row\">\n      <div class=\"govuk-grid-column-two-thirds\">\n        <select [(ngModel)]=\"selectedUserToRemove\" class=\"govuk-select\" id=\"remove-user-input\" aria-describedby=\"remove-user-hint\">\n          <option [ngValue]=\"null\" selected>Select a person</option>\n          <option *ngFor=\"let user of assignedUsers\" [ngValue]=\"user\">{{user.firstName}} {{user.lastName}} - {{user.email}}</option>\n        </select>\n      </div>\n      <div class=\"govuk-grid-column-one-thirds\">\n        <button id=\"btn-remove-user\" (click)=\"removeUser()\" class=\"govuk-button govuk-button--secondary\" title=\"Remove user from selected cases\">Remove</button>\n      </div>\n    </div>\n  </div>\n</div>\n\n<div id=\"cases\" [ngClass]=\"{'govuk-form-group--error': shareCaseErrorMessage.messages && shareCaseErrorMessage.messages.length > 0}\">\n  <h3 id=\"title-selected-cases\" class=\"govuk-heading-m\">Selected cases</h3>\n  <xuilib-gov-uk-error-message [config]=\"selectedCasesErrorMessageConfig\" [errorMessage]=\"shareCaseErrorMessage\"></xuilib-gov-uk-error-message>\n  <div *ngIf=\"shareCases && shareCases.length > 0\" class=\"govuk-accordion\" data-module=\"govuk-accordion\" id=\"accordion-with-summary-sections\">\n    <xuilib-selected-case-list\n      [shareCases$]=\"shareCases$\"\n      [removeUserFromCaseToggleOn]=\"removeUserFromCaseToggleOn\"\n      (unselect)=\"onUnselect($event)\"\n      (synchronizeStore)=\"onSynchronizeStore($event)\"\n    >\n    </xuilib-selected-case-list>\n  </div>\n\n  <div id=\"noCaseDisplay\" *ngIf=\"shareCases && shareCases.length === 0\" class=\"govuk-hint\"\n    [ngClass]=\"{'govuk-form-group--error': shareCaseErrorMessage.messages && shareCaseErrorMessage.messages.length > 0}\">\n    No cases to display.\n  </div>\n\n</div>\n\n<div id=\"share-case-nav\" class=\"govuk-button-group\">\n  <button id=\"btn-continue\" class=\"govuk-button\" data-module=\"govuk-button\" (click)=\"onContinue()\" title=\"Continue\">Continue</button>\n  <button id=\"btn-cancel\" class=\"govuk-button govuk-button--secondary\" data-module=\"govuk-button\" title=\"Cancel\" [routerLink]=\"cancelLink\">Cancel</button>\n</div>\n", styles: ["select{width:100%}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2$3.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i2$3.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i2$3.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { kind: "directive", type: i2$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i2.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "component", type: SelectedCaseListComponent, selector: "xuilib-selected-case-list", inputs: ["shareCases$", "removeUserFromCaseToggleOn", "toConfirm", "changeLink"], outputs: ["unselect", "synchronizeStore"] }, { kind: "component", type: UserSelectComponent, selector: "xuilib-user-select", inputs: ["users"], outputs: ["selected"] }, { kind: "component", type: HmctsErrorSummaryComponent, selector: "xuilib-hmcts-error-summary", inputs: ["errorMessages", "header", "showWarningMessage"] }, { kind: "component", type: GovUkErrorMessageComponent, selector: " xuilib-gov-uk-error-message", inputs: ["config", "errorMessage"] }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: ShareCaseComponent, decorators: [{
             type: Component,
             args: [{ selector: 'xuilib-share-case', template: "<xuilib-hmcts-error-summary\n  [errorMessages]=\"validationErrors\"\n  [header]=\"'There is a problem'\"\n></xuilib-hmcts-error-summary>\n<h1 *ngIf=\"title\" class=\"govuk-heading-xl govuk-!-margin-top-2\">\n  <span *ngIf=\"fnTitle\" class=\"govuk-caption-xl\">{{fnTitle}}</span>\n  {{title}}\n</h1>\n<div id=\"add-user\">\n  <div class=\"govuk-form-group\">\n    <label class=\"govuk-label govuk-!-font-weight-bold\" for=\"add-user-input\">{{addUserLabel}}</label>\n    <span id=\"add-user-hint\" class=\"govuk-hint\">\n      Search by name or email address. You can share access with as many people as you need.\n    </span>\n    <div class=\"govuk-grid-row\">\n      <div class=\"govuk-grid-column-two-thirds\">\n        <xuilib-user-select\n          id=\"add-user-input\"\n          aria-describedby=\"add-user-hint\"\n          [users]=\"users\"\n          (selected)=\"onSelectedUser($event)\">\n        </xuilib-user-select>\n      </div>\n      <div class=\"govuk-grid-column-one-thirds\">\n        <button id=\"btn-add-user\" (click)=\"addUser()\" class=\"govuk-button govuk-button--secondary\" [disabled]=\"isDisabledAdd()\" title=\"Add user to selected cases\">Add</button>\n      </div>\n    </div>\n    <details id=\"add-user-help\" class=\"govuk-details\" data-module=\"govuk-details\">\n      <summary class=\"govuk-details__summary\">\n      <span id=\"content-why-can-not-find-email\" class=\"govuk-details__summary-text\">\n        Can't find an email address?\n      </span>\n      </summary>\n      <div id=\"content-reason-can-not-find-email\" class=\"govuk-details__text\">\n        If you can't find your colleague's email address, they will need to complete their registration. Contact your\n        administrator for help.\n      </div>\n    </details>\n  </div>\n  <div class=\"govuk-form-group\" *ngIf=\"showRemoveUsers\">\n    <label class=\"govuk-label govuk-!-font-weight-bold\" for=\"remove-user-input\">Remove a person from all cases</label>\n    <span id=\"remove-user-hint\" class=\"govuk-hint\">\n      Select a person to remove them from all selected cases.\n    </span>\n    <div class=\"govuk-grid-row\">\n      <div class=\"govuk-grid-column-two-thirds\">\n        <select [(ngModel)]=\"selectedUserToRemove\" class=\"govuk-select\" id=\"remove-user-input\" aria-describedby=\"remove-user-hint\">\n          <option [ngValue]=\"null\" selected>Select a person</option>\n          <option *ngFor=\"let user of assignedUsers\" [ngValue]=\"user\">{{user.firstName}} {{user.lastName}} - {{user.email}}</option>\n        </select>\n      </div>\n      <div class=\"govuk-grid-column-one-thirds\">\n        <button id=\"btn-remove-user\" (click)=\"removeUser()\" class=\"govuk-button govuk-button--secondary\" title=\"Remove user from selected cases\">Remove</button>\n      </div>\n    </div>\n  </div>\n</div>\n\n<div id=\"cases\" [ngClass]=\"{'govuk-form-group--error': shareCaseErrorMessage.messages && shareCaseErrorMessage.messages.length > 0}\">\n  <h3 id=\"title-selected-cases\" class=\"govuk-heading-m\">Selected cases</h3>\n  <xuilib-gov-uk-error-message [config]=\"selectedCasesErrorMessageConfig\" [errorMessage]=\"shareCaseErrorMessage\"></xuilib-gov-uk-error-message>\n  <div *ngIf=\"shareCases && shareCases.length > 0\" class=\"govuk-accordion\" data-module=\"govuk-accordion\" id=\"accordion-with-summary-sections\">\n    <xuilib-selected-case-list\n      [shareCases$]=\"shareCases$\"\n      [removeUserFromCaseToggleOn]=\"removeUserFromCaseToggleOn\"\n      (unselect)=\"onUnselect($event)\"\n      (synchronizeStore)=\"onSynchronizeStore($event)\"\n    >\n    </xuilib-selected-case-list>\n  </div>\n\n  <div id=\"noCaseDisplay\" *ngIf=\"shareCases && shareCases.length === 0\" class=\"govuk-hint\"\n    [ngClass]=\"{'govuk-form-group--error': shareCaseErrorMessage.messages && shareCaseErrorMessage.messages.length > 0}\">\n    No cases to display.\n  </div>\n\n</div>\n\n<div id=\"share-case-nav\" class=\"govuk-button-group\">\n  <button id=\"btn-continue\" class=\"govuk-button\" data-module=\"govuk-button\" (click)=\"onContinue()\" title=\"Continue\">Continue</button>\n  <button id=\"btn-cancel\" class=\"govuk-button govuk-button--secondary\" data-module=\"govuk-button\" title=\"Cancel\" [routerLink]=\"cancelLink\">Cancel</button>\n</div>\n", styles: ["select{width:100%}\n"] }]
         }], ctorParameters: function () { return [{ type: CaseSharingStateService }, { type: i2.Router }]; }, propDecorators: { removeUserFromCaseToggleOn: [{
@@ -3696,10 +3698,10 @@ class TabComponent {
     tabChanged(event) {
         this.tabChange.emit(event);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: TabComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.7", type: TabComponent, selector: "xuilib-tab", inputs: { tabItems: "tabItems" }, outputs: { tabChange: "tabChange" }, ngImport: i0, template: "<mat-tab-group animationDuration=\"0ms\" (selectedTabChange)=\"tabChanged($event)\">\n    <mat-tab *ngFor=\"let tabItem of tabItems; let last = last;\" [label]=\"tabItem.text\">\n    </mat-tab>\n</mat-tab-group>", dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "component", type: i2$4.MatLegacyTabGroup, selector: "mat-tab-group", inputs: ["color", "disableRipple"], exportAs: ["matTabGroup"] }, { kind: "component", type: i2$4.MatLegacyTab, selector: "mat-tab", inputs: ["disabled"], exportAs: ["matTab"] }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: TabComponent, decorators: [{
+TabComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: TabComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+TabComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: TabComponent, selector: "xuilib-tab", inputs: { tabItems: "tabItems" }, outputs: { tabChange: "tabChange" }, ngImport: i0, template: "<mat-tab-group animationDuration=\"0ms\" (selectedTabChange)=\"tabChanged($event)\">\n    <mat-tab *ngFor=\"let tabItem of tabItems; let last = last;\" [label]=\"tabItem.text\">\n    </mat-tab>\n</mat-tab-group>", dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "component", type: i2$4.MatLegacyTabGroup, selector: "mat-tab-group", inputs: ["color", "disableRipple"], exportAs: ["matTabGroup"] }, { kind: "component", type: i2$4.MatLegacyTab, selector: "mat-tab", inputs: ["disabled"], exportAs: ["matTab"] }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: TabComponent, decorators: [{
             type: Component,
             args: [{ selector: 'xuilib-tab', template: "<mat-tab-group animationDuration=\"0ms\" (selectedTabChange)=\"tabChanged($event)\">\n    <mat-tab *ngFor=\"let tabItem of tabItems; let last = last;\" [label]=\"tabItem.text\">\n    </mat-tab>\n</mat-tab-group>" }]
         }], ctorParameters: function () { return []; }, propDecorators: { tabItems: [{
@@ -3715,10 +3717,10 @@ class TcConfirmComponent {
     onClick() {
         this.confirm.emit();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: TcConfirmComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.7", type: TcConfirmComponent, selector: "xuilib-tc-confirm", inputs: { buttonText: "buttonText" }, outputs: { confirm: "confirm" }, ngImport: i0, template: "<div class=\"govuk-width-container\">\n  <main role=\"main\" class=\"govuk-main-wrapper\">\n    <div class=\"govuk-grid-row\">\n      <div class=\"govuk-grid-column-two-thirds\">\n        <div class=\"column-two-thirds\">\n          <h1 class=\"govuk-heading-xl\">Using this service</h1>\n          <h2 class=\"govuk-heading-m\">Terms and conditions</h2>\n          <p>We've recently updated the\n            <a\n              routerLink=\"/terms-and-conditions\"\n              rel=\"noopener noreferrer\"\n              target=\"_blank\"\n              >terms and conditions</a\n            >.\n          </p>\n          <p>You must review and accept them.\n          </p>\n          <p>\n            <button class=\"govuk-button\" (click)=\"onClick()\">\n              {{ buttonText }}\n            </button>\n          </p>\n        </div>\n      </div>\n    </div>\n    <div class=\"govuk-grid-column-one-third\"></div>\n  </main>\n</div>\n", styles: [""], dependencies: [{ kind: "directive", type: i2.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: TcConfirmComponent, decorators: [{
+TcConfirmComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: TcConfirmComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+TcConfirmComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: TcConfirmComponent, selector: "xuilib-tc-confirm", inputs: { buttonText: "buttonText" }, outputs: { confirm: "confirm" }, ngImport: i0, template: "<div class=\"govuk-width-container\">\n  <main role=\"main\" class=\"govuk-main-wrapper\">\n    <div class=\"govuk-grid-row\">\n      <div class=\"govuk-grid-column-two-thirds\">\n        <div class=\"column-two-thirds\">\n          <h1 class=\"govuk-heading-xl\">Using this service</h1>\n          <h2 class=\"govuk-heading-m\">Terms and conditions</h2>\n          <p>We've recently updated the\n            <a\n              routerLink=\"/terms-and-conditions\"\n              rel=\"noopener noreferrer\"\n              target=\"_blank\"\n              >terms and conditions</a\n            >.\n          </p>\n          <p>You must review and accept them.\n          </p>\n          <p>\n            <button class=\"govuk-button\" (click)=\"onClick()\">\n              {{ buttonText }}\n            </button>\n          </p>\n        </div>\n      </div>\n    </div>\n    <div class=\"govuk-grid-column-one-third\"></div>\n  </main>\n</div>\n", styles: [""], dependencies: [{ kind: "directive", type: i2.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: TcConfirmComponent, decorators: [{
             type: Component,
             args: [{ selector: 'xuilib-tc-confirm', template: "<div class=\"govuk-width-container\">\n  <main role=\"main\" class=\"govuk-main-wrapper\">\n    <div class=\"govuk-grid-row\">\n      <div class=\"govuk-grid-column-two-thirds\">\n        <div class=\"column-two-thirds\">\n          <h1 class=\"govuk-heading-xl\">Using this service</h1>\n          <h2 class=\"govuk-heading-m\">Terms and conditions</h2>\n          <p>We've recently updated the\n            <a\n              routerLink=\"/terms-and-conditions\"\n              rel=\"noopener noreferrer\"\n              target=\"_blank\"\n              >terms and conditions</a\n            >.\n          </p>\n          <p>You must review and accept them.\n          </p>\n          <p>\n            <button class=\"govuk-button\" (click)=\"onClick()\">\n              {{ buttonText }}\n            </button>\n          </p>\n        </div>\n      </div>\n    </div>\n    <div class=\"govuk-grid-column-one-third\"></div>\n  </main>\n</div>\n" }]
         }], ctorParameters: function () { return []; }, propDecorators: { buttonText: [{
@@ -3729,30 +3731,30 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.7", ngImpor
 
 class TcDisplayHtmlComponent {
     constructor() { }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: TcDisplayHtmlComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.7", type: TcDisplayHtmlComponent, selector: "xuilib-tc-display-html", ngImport: i0, template: "<ng-content></ng-content>", styles: [":host{display:block;width:100%}\n"] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: TcDisplayHtmlComponent, decorators: [{
+TcDisplayHtmlComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: TcDisplayHtmlComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+TcDisplayHtmlComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: TcDisplayHtmlComponent, selector: "xuilib-tc-display-html", ngImport: i0, template: "<ng-content></ng-content>", styles: [":host{display:block;width:100%}\n"] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: TcDisplayHtmlComponent, decorators: [{
             type: Component,
             args: [{ selector: 'xuilib-tc-display-html', template: "<ng-content></ng-content>", styles: [":host{display:block;width:100%}\n"] }]
         }], ctorParameters: function () { return []; } });
 
 class TcDisplayPlainComponent {
     constructor() { }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: TcDisplayPlainComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.7", type: TcDisplayPlainComponent, selector: "xuilib-tc-display-plain", ngImport: i0, template: "<ng-content></ng-content>", styles: [":host{display:block;width:100%}\n"] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: TcDisplayPlainComponent, decorators: [{
+TcDisplayPlainComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: TcDisplayPlainComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+TcDisplayPlainComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: TcDisplayPlainComponent, selector: "xuilib-tc-display-plain", ngImport: i0, template: "<ng-content></ng-content>", styles: [":host{display:block;width:100%}\n"] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: TcDisplayPlainComponent, decorators: [{
             type: Component,
             args: [{ selector: 'xuilib-tc-display-plain', template: "<ng-content></ng-content>", styles: [":host{display:block;width:100%}\n"] }]
         }], ctorParameters: function () { return []; } });
 
 class TermsAndConditionsComponent {
     constructor() { }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: TermsAndConditionsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.7", type: TermsAndConditionsComponent, selector: "xuilib-terms-and-conditions", inputs: { document: "document" }, ngImport: i0, template: "<ng-container [ngSwitch]=\"document.mimeType\">\n  <xuilib-tc-display-html *ngSwitchCase=\"'text/html'\">\n    <div [innerHTML]=\"document.content\"></div>\n  </xuilib-tc-display-html>\n  <xuilib-tc-display-plain *ngSwitchCase=\"'text/plain'\">\n    {{ document.content }}\n  </xuilib-tc-display-plain>\n  <div *ngSwitchDefault>\n    An error occured. Please try again.\n  </div>\n</ng-container>\n", styles: [":host{display:block;width:100%}\n"], dependencies: [{ kind: "directive", type: i1.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i1.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "directive", type: i1.NgSwitchDefault, selector: "[ngSwitchDefault]" }, { kind: "component", type: TcDisplayHtmlComponent, selector: "xuilib-tc-display-html" }, { kind: "component", type: TcDisplayPlainComponent, selector: "xuilib-tc-display-plain" }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: TermsAndConditionsComponent, decorators: [{
+TermsAndConditionsComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: TermsAndConditionsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+TermsAndConditionsComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: TermsAndConditionsComponent, selector: "xuilib-terms-and-conditions", inputs: { document: "document" }, ngImport: i0, template: "<ng-container [ngSwitch]=\"document.mimeType\">\n  <xuilib-tc-display-html *ngSwitchCase=\"'text/html'\">\n    <div [innerHTML]=\"document.content\"></div>\n  </xuilib-tc-display-html>\n  <xuilib-tc-display-plain *ngSwitchCase=\"'text/plain'\">\n    {{ document.content }}\n  </xuilib-tc-display-plain>\n  <div *ngSwitchDefault>\n    An error occured. Please try again.\n  </div>\n</ng-container>\n", styles: [":host{display:block;width:100%}\n"], dependencies: [{ kind: "directive", type: i1.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i1.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "directive", type: i1.NgSwitchDefault, selector: "[ngSwitchDefault]" }, { kind: "component", type: TcDisplayHtmlComponent, selector: "xuilib-tc-display-html" }, { kind: "component", type: TcDisplayPlainComponent, selector: "xuilib-tc-display-plain" }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: TermsAndConditionsComponent, decorators: [{
             type: Component,
             args: [{ selector: 'xuilib-terms-and-conditions', template: "<ng-container [ngSwitch]=\"document.mimeType\">\n  <xuilib-tc-display-html *ngSwitchCase=\"'text/html'\">\n    <div [innerHTML]=\"document.content\"></div>\n  </xuilib-tc-display-html>\n  <xuilib-tc-display-plain *ngSwitchCase=\"'text/plain'\">\n    {{ document.content }}\n  </xuilib-tc-display-plain>\n  <div *ngSwitchDefault>\n    An error occured. Please try again.\n  </div>\n</ng-container>\n", styles: [":host{display:block;width:100%}\n"] }]
         }], ctorParameters: function () { return []; }, propDecorators: { document: [{
@@ -3779,10 +3781,10 @@ class UserDetailsComponent {
         }
         return false;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: UserDetailsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.7", type: UserDetailsComponent, selector: "xuilib-user-details", inputs: { user: "user", editPermissionRouterLink: "editPermissionRouterLink", warningTitle: "warningTitle", showEditLink: "showEditLink", showHelpLink: "showHelpLink", suspendHelpLink: "suspendHelpLink", showSuspendUserButton: "showSuspendUserButton" }, outputs: { suspendUserEvent: "suspendUserEvent", reinvite: "reinvite" }, ngImport: i0, template: "<div class=\"govuk-warning-text\" *ngIf=\"warningTitle && warningTitle !== ''\">\n<span class=\"govuk-warning-text__icon\">!</span>\n<strong class=\"govuk-warning-text__text\">\n    {{ warningTitle }}\n</strong>\n</div>\n<table class=\"govuk-table\" *ngIf=\"user\">\n  <tbody class=\"govuk-table__body\">\n    <tr class=\"govuk-table__row\">\n        <th class=\"govuk-table__header\" scope=\"row\">Name</th>\n        <td class=\"govuk-table__cell\">{{user.fullName}}</td>\n        <td class=\"govuk-table__cell\"></td>\n    </tr>\n    <tr class=\"govuk-table__row\">\n        <th class=\"govuk-table__header\" scope=\"row\">Email address</th>\n        <td class=\"govuk-table__cell\">{{user.email}}</td>\n        <td class=\"govuk-table__cell\"></td>\n    </tr>\n    <tr class=\"govuk-table__row\" *ngIf=\"!user.resendInvite\">\n        <th class=\"govuk-table__header\" scope=\"row\">Permissions</th>\n        <td class=\"govuk-table__cell\">\n          <div *ngIf=\"user.manageOrganisations === 'Yes'\">Manage organisations</div>\n          <div *ngIf=\"user.manageUsers === 'Yes'\">Manage users</div>\n          <div *ngIf=\"user.manageCases === 'Yes'\">Manage cases</div>\n          <div *ngIf=\"userHasRole('pui-caa')\">Case access administrator</div>\n          <div *ngIf=\"userHasRole('pui-finance-manager')\">Manage fee accounts</div>\n        </td>\n        <td class=\"govuk-table__cell\"><a *ngIf=\"editPermissionRouterLink && showEditLink\" [routerLink]=\"editPermissionRouterLink\">Change <span class=\"govuk-visually-hidden\">roles</span></a></td>\n    </tr>\n  </tbody>\n</table>\n<button *ngIf=\"showSuspendUserButton\" class=\"govuk-button govuk-button--warning\" (click)=\"suspendUser(user)\">\n  Suspend account\n</button>\n<div *ngIf=\"user && user.resendInvite\">\n  <div class=\"govuk-inset-text\">\n    <p>This user has already been invited but has not activated their account.</p>\n    <p>If you resend an invitation, they'll receive an email from HM Courts and Tribunals to finish setting up their account.</p>\n    <p>You can't invite the same user more than once an hour.</p>\n  </div>\n  <a role=\"button\" draggable=\"false\" class=\"govuk-button\" (click)=\"reinviteClick(user)\" id=\"resend-invite-button\">\n      Resend invitation\n  </a>\n</div>\n<p class=\"govuk-body\" *ngIf=\"showHelpLink && suspendHelpLink\"><a [routerLink]=\"suspendHelpLink\" target=\"_blank\">Get help</a> to reactivate this account.</p>\n", styles: [":host{display:block}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: UserDetailsComponent, decorators: [{
+UserDetailsComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: UserDetailsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+UserDetailsComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: UserDetailsComponent, selector: "xuilib-user-details", inputs: { user: "user", editPermissionRouterLink: "editPermissionRouterLink", warningTitle: "warningTitle", showEditLink: "showEditLink", showHelpLink: "showHelpLink", suspendHelpLink: "suspendHelpLink", showSuspendUserButton: "showSuspendUserButton" }, outputs: { suspendUserEvent: "suspendUserEvent", reinvite: "reinvite" }, ngImport: i0, template: "<div class=\"govuk-warning-text\" *ngIf=\"warningTitle && warningTitle !== ''\">\n<span class=\"govuk-warning-text__icon\">!</span>\n<strong class=\"govuk-warning-text__text\">\n    {{ warningTitle }}\n</strong>\n</div>\n<table class=\"govuk-table\" *ngIf=\"user\">\n  <tbody class=\"govuk-table__body\">\n    <tr class=\"govuk-table__row\">\n        <th class=\"govuk-table__header\" scope=\"row\">Name</th>\n        <td class=\"govuk-table__cell\">{{user.fullName}}</td>\n        <td class=\"govuk-table__cell\"></td>\n    </tr>\n    <tr class=\"govuk-table__row\">\n        <th class=\"govuk-table__header\" scope=\"row\">Email address</th>\n        <td class=\"govuk-table__cell\">{{user.email}}</td>\n        <td class=\"govuk-table__cell\"></td>\n    </tr>\n    <tr class=\"govuk-table__row\" *ngIf=\"!user.resendInvite\">\n        <th class=\"govuk-table__header\" scope=\"row\">Permissions</th>\n        <td class=\"govuk-table__cell\">\n          <div *ngIf=\"user.manageOrganisations === 'Yes'\">Manage organisations</div>\n          <div *ngIf=\"user.manageUsers === 'Yes'\">Manage users</div>\n          <div *ngIf=\"user.manageCases === 'Yes'\">Manage cases</div>\n          <div *ngIf=\"userHasRole('pui-caa')\">Case access administrator</div>\n          <div *ngIf=\"userHasRole('pui-finance-manager')\">Manage fee accounts</div>\n        </td>\n        <td class=\"govuk-table__cell\"><a *ngIf=\"editPermissionRouterLink && showEditLink\" [routerLink]=\"editPermissionRouterLink\">Change <span class=\"govuk-visually-hidden\">roles</span></a></td>\n    </tr>\n  </tbody>\n</table>\n<button *ngIf=\"showSuspendUserButton\" class=\"govuk-button govuk-button--warning\" (click)=\"suspendUser(user)\">\n  Suspend account\n</button>\n<div *ngIf=\"user && user.resendInvite\">\n  <div class=\"govuk-inset-text\">\n    <p>This user has already been invited but has not activated their account.</p>\n    <p>If you resend an invitation, they'll receive an email from HM Courts and Tribunals to finish setting up their account.</p>\n    <p>You can't invite the same user more than once an hour.</p>\n  </div>\n  <a role=\"button\" draggable=\"false\" class=\"govuk-button\" (click)=\"reinviteClick(user)\" id=\"resend-invite-button\">\n      Resend invitation\n  </a>\n</div>\n<p class=\"govuk-body\" *ngIf=\"showHelpLink && suspendHelpLink\"><a [routerLink]=\"suspendHelpLink\" target=\"_blank\">Get help</a> to reactivate this account.</p>\n", styles: [":host{display:block}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: UserDetailsComponent, decorators: [{
             type: Component,
             args: [{ selector: 'xuilib-user-details', template: "<div class=\"govuk-warning-text\" *ngIf=\"warningTitle && warningTitle !== ''\">\n<span class=\"govuk-warning-text__icon\">!</span>\n<strong class=\"govuk-warning-text__text\">\n    {{ warningTitle }}\n</strong>\n</div>\n<table class=\"govuk-table\" *ngIf=\"user\">\n  <tbody class=\"govuk-table__body\">\n    <tr class=\"govuk-table__row\">\n        <th class=\"govuk-table__header\" scope=\"row\">Name</th>\n        <td class=\"govuk-table__cell\">{{user.fullName}}</td>\n        <td class=\"govuk-table__cell\"></td>\n    </tr>\n    <tr class=\"govuk-table__row\">\n        <th class=\"govuk-table__header\" scope=\"row\">Email address</th>\n        <td class=\"govuk-table__cell\">{{user.email}}</td>\n        <td class=\"govuk-table__cell\"></td>\n    </tr>\n    <tr class=\"govuk-table__row\" *ngIf=\"!user.resendInvite\">\n        <th class=\"govuk-table__header\" scope=\"row\">Permissions</th>\n        <td class=\"govuk-table__cell\">\n          <div *ngIf=\"user.manageOrganisations === 'Yes'\">Manage organisations</div>\n          <div *ngIf=\"user.manageUsers === 'Yes'\">Manage users</div>\n          <div *ngIf=\"user.manageCases === 'Yes'\">Manage cases</div>\n          <div *ngIf=\"userHasRole('pui-caa')\">Case access administrator</div>\n          <div *ngIf=\"userHasRole('pui-finance-manager')\">Manage fee accounts</div>\n        </td>\n        <td class=\"govuk-table__cell\"><a *ngIf=\"editPermissionRouterLink && showEditLink\" [routerLink]=\"editPermissionRouterLink\">Change <span class=\"govuk-visually-hidden\">roles</span></a></td>\n    </tr>\n  </tbody>\n</table>\n<button *ngIf=\"showSuspendUserButton\" class=\"govuk-button govuk-button--warning\" (click)=\"suspendUser(user)\">\n  Suspend account\n</button>\n<div *ngIf=\"user && user.resendInvite\">\n  <div class=\"govuk-inset-text\">\n    <p>This user has already been invited but has not activated their account.</p>\n    <p>If you resend an invitation, they'll receive an email from HM Courts and Tribunals to finish setting up their account.</p>\n    <p>You can't invite the same user more than once an hour.</p>\n  </div>\n  <a role=\"button\" draggable=\"false\" class=\"govuk-button\" (click)=\"reinviteClick(user)\" id=\"resend-invite-button\">\n      Resend invitation\n  </a>\n</div>\n<p class=\"govuk-body\" *ngIf=\"showHelpLink && suspendHelpLink\"><a [routerLink]=\"suspendHelpLink\" target=\"_blank\">Get help</a> to reactivate this account.</p>\n", styles: [":host{display:block}\n"] }]
         }], propDecorators: { user: [{
@@ -3805,6 +3807,37 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.7", ngImpor
                 type: Output
             }] } });
 
+class HmctsPaginationComponent {
+    constructor() {
+        this.maxSize = 7;
+        this.pageSize = 10;
+        this.showPageNumbers = true;
+        this.showResultCount = true;
+        this.pageChange = new EventEmitter();
+        this.pageBoundsCorrection = new EventEmitter();
+    }
+}
+HmctsPaginationComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: HmctsPaginationComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+HmctsPaginationComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: HmctsPaginationComponent, selector: "xuilib-hmcts-pagination", inputs: { id: "id", maxSize: "maxSize", pageSize: "pageSize", showPageNumbers: "showPageNumbers", showResultCount: "showResultCount" }, outputs: { pageChange: "pageChange", pageBoundsCorrection: "pageBoundsCorrection" }, ngImport: i0, template: "<!-- pagination-template #p=\"paginationApi\" [id]=\"id\" [maxSize]=\"maxSize\" (pageChange)=\"pageChange.emit($event)\"\n  (pageBoundsCorrection)=\"pageBoundsCorrection.emit($event)\">\n\n  <nav class=\"hmcts-pagination\" id=\"pagination-label\">\n    <p class=\"govuk-visually-hidden\" aria-labelledby=\"pagination-label\">Pagination navigation</p>\n    <ul class=\"hmcts-pagination__list\" *ngIf=\"!(p.pages.length <= 1)\">\n\n      <li class=\"hmcts-pagination__item  hmcts-pagination__item--prev\" [class.disabled]=\"p.isFirstPage()\">\n        <a [routerLink]=\"[][]\" class=\"hmcts-pagination__link\" *ngIf=\"1 < p.getCurrent()\" (keyup.enter)=\"p.previous()\"\n          (click)=\"p.previous()\">Previous <span class=\"govuk-visually-hidden\">set of pages</span></a>\n      </li>\n\n      <ng-container *ngIf=\"showPageNumbers\">\n        <li class=\"hmcts-pagination__item\" [class.hmcts-pagination__item--active]=\"p.getCurrent() === page.value\"\n          [class.hmcts-pagination__item--dots]=\"page.label === '...'\" *ngFor=\"let page of p.pages\">\n          <a class=\"hmcts-pagination__link\" [routerLink]=\"[][]\" (keyup.enter)=\"p.setCurrent(page.value)\"\n            (click)=\"p.setCurrent(page.value)\" *ngIf=\"p.getCurrent() !== page.value\">\n            <span class=\"govuk-visually-hidden\">page </span>\n            <span>{{ (page.label === '...') ? page.label : (page.label | number:'') }}</span>\n          </a>\n          <ng-container *ngIf=\"p.getCurrent() === page.value\">\n            <span>{{ (page.label === '...') ? page.label : (page.label | number:'') }}</span>\n          </ng-container>\n        </li>\n      </ng-container>\n\n      <li class=\"hmcts-pagination__item  hmcts-pagination__item--next\" [class.disabled]=\"p.isLastPage()\">\n        <a [routerLink]=\"[][]\" class=\"hmcts-pagination__link\" *ngIf=\"!p.isLastPage()\" (keyup.enter)=\"p.next()\"\n          (click)=\"p.next()\">Next<span class=\"govuk-visually-hidden\"> page</span></a>\n      </li>\n\n    </ul>\n    <p class=\"hmcts-pagination__results\" *ngIf=\"showResultCount\">Showing <b>{{(p.getCurrent() * pageSize) - pageSize + 1}}</b>\n      to <b>{{ p.getCurrent() * pageSize > p.getTotalItems() ? p.getTotalItems() : p.getCurrent() *\n        pageSize}}</b> of <b>{{p.getTotalItems()}}</b> results</p>\n  </nav>\n\n</pagination-template -->\n", styles: [".hmcts-pagination__results{float:right}\n"] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: HmctsPaginationComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'xuilib-hmcts-pagination', template: "<!-- pagination-template #p=\"paginationApi\" [id]=\"id\" [maxSize]=\"maxSize\" (pageChange)=\"pageChange.emit($event)\"\n  (pageBoundsCorrection)=\"pageBoundsCorrection.emit($event)\">\n\n  <nav class=\"hmcts-pagination\" id=\"pagination-label\">\n    <p class=\"govuk-visually-hidden\" aria-labelledby=\"pagination-label\">Pagination navigation</p>\n    <ul class=\"hmcts-pagination__list\" *ngIf=\"!(p.pages.length <= 1)\">\n\n      <li class=\"hmcts-pagination__item  hmcts-pagination__item--prev\" [class.disabled]=\"p.isFirstPage()\">\n        <a [routerLink]=\"[][]\" class=\"hmcts-pagination__link\" *ngIf=\"1 < p.getCurrent()\" (keyup.enter)=\"p.previous()\"\n          (click)=\"p.previous()\">Previous <span class=\"govuk-visually-hidden\">set of pages</span></a>\n      </li>\n\n      <ng-container *ngIf=\"showPageNumbers\">\n        <li class=\"hmcts-pagination__item\" [class.hmcts-pagination__item--active]=\"p.getCurrent() === page.value\"\n          [class.hmcts-pagination__item--dots]=\"page.label === '...'\" *ngFor=\"let page of p.pages\">\n          <a class=\"hmcts-pagination__link\" [routerLink]=\"[][]\" (keyup.enter)=\"p.setCurrent(page.value)\"\n            (click)=\"p.setCurrent(page.value)\" *ngIf=\"p.getCurrent() !== page.value\">\n            <span class=\"govuk-visually-hidden\">page </span>\n            <span>{{ (page.label === '...') ? page.label : (page.label | number:'') }}</span>\n          </a>\n          <ng-container *ngIf=\"p.getCurrent() === page.value\">\n            <span>{{ (page.label === '...') ? page.label : (page.label | number:'') }}</span>\n          </ng-container>\n        </li>\n      </ng-container>\n\n      <li class=\"hmcts-pagination__item  hmcts-pagination__item--next\" [class.disabled]=\"p.isLastPage()\">\n        <a [routerLink]=\"[][]\" class=\"hmcts-pagination__link\" *ngIf=\"!p.isLastPage()\" (keyup.enter)=\"p.next()\"\n          (click)=\"p.next()\">Next<span class=\"govuk-visually-hidden\"> page</span></a>\n      </li>\n\n    </ul>\n    <p class=\"hmcts-pagination__results\" *ngIf=\"showResultCount\">Showing <b>{{(p.getCurrent() * pageSize) - pageSize + 1}}</b>\n      to <b>{{ p.getCurrent() * pageSize > p.getTotalItems() ? p.getTotalItems() : p.getCurrent() *\n        pageSize}}</b> of <b>{{p.getTotalItems()}}</b> results</p>\n  </nav>\n\n</pagination-template -->\n", styles: [".hmcts-pagination__results{float:right}\n"] }]
+        }], propDecorators: { id: [{
+                type: Input
+            }], maxSize: [{
+                type: Input
+            }], pageSize: [{
+                type: Input
+            }], showPageNumbers: [{
+                type: Input
+            }], showResultCount: [{
+                type: Input
+            }], pageChange: [{
+                type: Output
+            }], pageBoundsCorrection: [{
+                type: Output
+            }] } });
+
 class UserListComponent {
     constructor() {
         this.users = [];
@@ -3821,12 +3854,12 @@ class UserListComponent {
         this.currentPageNumber = pageNumber;
         this.pageChange.emit(pageNumber);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: UserListComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.7", type: UserListComponent, selector: "xuilib-user-list", inputs: { users: "users", currentPageNumber: "currentPageNumber", pageTotalSize: "pageTotalSize" }, outputs: { userClick: "userClick", pageChange: "pageChange" }, ngImport: i0, template: "<!-- table class=\"govuk-table\">\n\n    <thead clas=\"govuk-table__head\">\n        <tr class=\"govuk-table__row\">\n            <th class=\"govuk-table__header\" scope=\"col\">Name</th>\n            <th class=\"govuk-table__header\" scope=\"col\">Email</th>\n            <th class=\"govuk-table__header\" scope=\"col\">Status</th>\n        </tr>\n    </thead>\n    <tbody class=\"govuk-table__body\">\n      <ng-container *ngFor=\"let u of users | paginate: { itemsPerPage: pagination.itemsPerPage, currentPage: currentPageNumber, totalItems: pagination.totalItems }\">\n        <tr class=\"govuk-table__row\" data-selector=\"table-row\">\n            <td class=\"govuk-table__cell\" data-selector=\"table-cell\">\n              <a class=\"govuk-link\" [attr.title]=\"u.routerLinkTitle\" [routerLink]=\"u.routerLink\" (click)=\"onUserClick(u)\">{{ u.fullName }}</a>\n            </td>\n            <td class=\"govuk-table__cell\" data-selector=\"table-cell\">{{ u.email }}</td>\n            <td class=\"govuk-table__cell\" data-selector=\"table-cell\">{{ u.status }}</td>\n        </tr>\n      </ng-container>\n    </tbody>\n</table>\n<xuilib-hmcts-pagination (pageChange)=\"emitPageClickEvent($event)\" [pageSize]=\"pagination.itemsPerPage\"></xuilib-hmcts-pagination -->\n", styles: [":host{display:block}\n"] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: UserListComponent, decorators: [{
+UserListComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: UserListComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+UserListComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: UserListComponent, selector: "xuilib-user-list", inputs: { users: "users", currentPageNumber: "currentPageNumber", pageTotalSize: "pageTotalSize" }, outputs: { userClick: "userClick", pageChange: "pageChange" }, ngImport: i0, template: "<table class=\"govuk-table\">\n\n    <thead clas=\"govuk-table__head\">\n        <tr class=\"govuk-table__row\">\n            <th class=\"govuk-table__header\" scope=\"col\">Name</th>\n            <th class=\"govuk-table__header\" scope=\"col\">Email</th>\n            <th class=\"govuk-table__header\" scope=\"col\">Status</th>\n        </tr>\n    </thead>\n    <tbody class=\"govuk-table__body\">\n      <ng-container *ngFor=\"let u of users | paginate: { itemsPerPage: pagination.itemsPerPage, currentPage: currentPageNumber, totalItems: pagination.totalItems }\">\n        <tr class=\"govuk-table__row\" data-selector=\"table-row\">\n            <td class=\"govuk-table__cell\" data-selector=\"table-cell\">\n              <a class=\"govuk-link\" [attr.title]=\"u.routerLinkTitle\" [routerLink]=\"u.routerLink\" (click)=\"onUserClick(u)\">{{ u.fullName }}</a>\n            </td>\n            <td class=\"govuk-table__cell\" data-selector=\"table-cell\">{{ u.email }}</td>\n            <td class=\"govuk-table__cell\" data-selector=\"table-cell\">{{ u.status }}</td>\n        </tr>\n      </ng-container>\n    </tbody>\n</table>\n<xuilib-hmcts-pagination (pageChange)=\"emitPageClickEvent($event)\" [pageSize]=\"pagination.itemsPerPage\"></xuilib-hmcts-pagination>\n", styles: [":host{display:block}\n"], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "component", type: HmctsPaginationComponent, selector: "xuilib-hmcts-pagination", inputs: ["id", "maxSize", "pageSize", "showPageNumbers", "showResultCount"], outputs: ["pageChange", "pageBoundsCorrection"] }, { kind: "pipe", type: i4$1.PaginatePipe, name: "paginate" }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: UserListComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'xuilib-user-list', template: "<!-- table class=\"govuk-table\">\n\n    <thead clas=\"govuk-table__head\">\n        <tr class=\"govuk-table__row\">\n            <th class=\"govuk-table__header\" scope=\"col\">Name</th>\n            <th class=\"govuk-table__header\" scope=\"col\">Email</th>\n            <th class=\"govuk-table__header\" scope=\"col\">Status</th>\n        </tr>\n    </thead>\n    <tbody class=\"govuk-table__body\">\n      <ng-container *ngFor=\"let u of users | paginate: { itemsPerPage: pagination.itemsPerPage, currentPage: currentPageNumber, totalItems: pagination.totalItems }\">\n        <tr class=\"govuk-table__row\" data-selector=\"table-row\">\n            <td class=\"govuk-table__cell\" data-selector=\"table-cell\">\n              <a class=\"govuk-link\" [attr.title]=\"u.routerLinkTitle\" [routerLink]=\"u.routerLink\" (click)=\"onUserClick(u)\">{{ u.fullName }}</a>\n            </td>\n            <td class=\"govuk-table__cell\" data-selector=\"table-cell\">{{ u.email }}</td>\n            <td class=\"govuk-table__cell\" data-selector=\"table-cell\">{{ u.status }}</td>\n        </tr>\n      </ng-container>\n    </tbody>\n</table>\n<xuilib-hmcts-pagination (pageChange)=\"emitPageClickEvent($event)\" [pageSize]=\"pagination.itemsPerPage\"></xuilib-hmcts-pagination -->\n", styles: [":host{display:block}\n"] }]
+            args: [{ selector: 'xuilib-user-list', template: "<table class=\"govuk-table\">\n\n    <thead clas=\"govuk-table__head\">\n        <tr class=\"govuk-table__row\">\n            <th class=\"govuk-table__header\" scope=\"col\">Name</th>\n            <th class=\"govuk-table__header\" scope=\"col\">Email</th>\n            <th class=\"govuk-table__header\" scope=\"col\">Status</th>\n        </tr>\n    </thead>\n    <tbody class=\"govuk-table__body\">\n      <ng-container *ngFor=\"let u of users | paginate: { itemsPerPage: pagination.itemsPerPage, currentPage: currentPageNumber, totalItems: pagination.totalItems }\">\n        <tr class=\"govuk-table__row\" data-selector=\"table-row\">\n            <td class=\"govuk-table__cell\" data-selector=\"table-cell\">\n              <a class=\"govuk-link\" [attr.title]=\"u.routerLinkTitle\" [routerLink]=\"u.routerLink\" (click)=\"onUserClick(u)\">{{ u.fullName }}</a>\n            </td>\n            <td class=\"govuk-table__cell\" data-selector=\"table-cell\">{{ u.email }}</td>\n            <td class=\"govuk-table__cell\" data-selector=\"table-cell\">{{ u.status }}</td>\n        </tr>\n      </ng-container>\n    </tbody>\n</table>\n<xuilib-hmcts-pagination (pageChange)=\"emitPageClickEvent($event)\" [pageSize]=\"pagination.itemsPerPage\"></xuilib-hmcts-pagination>\n", styles: [":host{display:block}\n"] }]
         }], propDecorators: { users: [{
                 type: Input
             }], currentPageNumber: [{
@@ -3886,10 +3919,10 @@ class CookieBannerComponent {
         now.setTime(expireTime);
         return now.toUTCString();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: CookieBannerComponent, deps: [{ token: CookieService }, { token: windowToken }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.7", type: CookieBannerComponent, selector: "xuilib-cookie-banner", inputs: { identifier: "identifier", appName: "appName" }, outputs: { rejectionNotifier: "rejectionNotifier", acceptanceNotifier: "acceptanceNotifier" }, ngImport: i0, template: "<div class=\"govuk-cookie-banner \" role=\"region\" attr.aria-label=\"'Cookies on {{appName}}'\" *ngIf=\"isCookieBannerVisible\">\n  <div class=\"govuk-cookie-banner__message govuk-width-container\">\n\n    <div class=\"govuk-grid-row\">\n      <div class=\"govuk-grid-column-two-thirds\">\n        <h2 class=\"govuk-cookie-banner__heading govuk-heading-m\">Cookies on {{appName}}</h2>\n\n        <div class=\"govuk-cookie-banner__content\">\n          <p>We use some essential cookies to make this service work.</p>\n          <p>We\u2019d also like to use analytics cookies so we can understand how you use the service and make improvements.</p>\n        </div>\n      </div>\n    </div>\n\n    <div class=\"govuk-button-group\">\n      <button value=\"accept\" type=\"button\" name=\"cookies\" class=\"govuk-button\" data-module=\"govuk-button\" (click)=\"acceptCookie()\">\n        Accept analytics cookies\n      </button>\n      <button value=\"reject\" type=\"button\" name=\"cookies\" class=\"govuk-button\" data-module=\"govuk-button\" (click)=\"rejectCookie()\">\n        Reject analytics cookies\n      </button>\n      <a class=\"govuk-link\" routerLink=\"/cookies\">View cookies</a>\n    </div>\n  </div>\n</div>", dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: CookieBannerComponent, decorators: [{
+CookieBannerComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: CookieBannerComponent, deps: [{ token: CookieService }, { token: windowToken }], target: i0.ɵɵFactoryTarget.Component });
+CookieBannerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: CookieBannerComponent, selector: "xuilib-cookie-banner", inputs: { identifier: "identifier", appName: "appName" }, outputs: { rejectionNotifier: "rejectionNotifier", acceptanceNotifier: "acceptanceNotifier" }, ngImport: i0, template: "<div class=\"govuk-cookie-banner \" role=\"region\" attr.aria-label=\"'Cookies on {{appName}}'\" *ngIf=\"isCookieBannerVisible\">\n  <div class=\"govuk-cookie-banner__message govuk-width-container\">\n\n    <div class=\"govuk-grid-row\">\n      <div class=\"govuk-grid-column-two-thirds\">\n        <h2 class=\"govuk-cookie-banner__heading govuk-heading-m\">Cookies on {{appName}}</h2>\n\n        <div class=\"govuk-cookie-banner__content\">\n          <p>We use some essential cookies to make this service work.</p>\n          <p>We\u2019d also like to use analytics cookies so we can understand how you use the service and make improvements.</p>\n        </div>\n      </div>\n    </div>\n\n    <div class=\"govuk-button-group\">\n      <button value=\"accept\" type=\"button\" name=\"cookies\" class=\"govuk-button\" data-module=\"govuk-button\" (click)=\"acceptCookie()\">\n        Accept analytics cookies\n      </button>\n      <button value=\"reject\" type=\"button\" name=\"cookies\" class=\"govuk-button\" data-module=\"govuk-button\" (click)=\"rejectCookie()\">\n        Reject analytics cookies\n      </button>\n      <a class=\"govuk-link\" routerLink=\"/cookies\">View cookies</a>\n    </div>\n  </div>\n</div>", dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: CookieBannerComponent, decorators: [{
             type: Component,
             args: [{ selector: 'xuilib-cookie-banner', template: "<div class=\"govuk-cookie-banner \" role=\"region\" attr.aria-label=\"'Cookies on {{appName}}'\" *ngIf=\"isCookieBannerVisible\">\n  <div class=\"govuk-cookie-banner__message govuk-width-container\">\n\n    <div class=\"govuk-grid-row\">\n      <div class=\"govuk-grid-column-two-thirds\">\n        <h2 class=\"govuk-cookie-banner__heading govuk-heading-m\">Cookies on {{appName}}</h2>\n\n        <div class=\"govuk-cookie-banner__content\">\n          <p>We use some essential cookies to make this service work.</p>\n          <p>We\u2019d also like to use analytics cookies so we can understand how you use the service and make improvements.</p>\n        </div>\n      </div>\n    </div>\n\n    <div class=\"govuk-button-group\">\n      <button value=\"accept\" type=\"button\" name=\"cookies\" class=\"govuk-button\" data-module=\"govuk-button\" (click)=\"acceptCookie()\">\n        Accept analytics cookies\n      </button>\n      <button value=\"reject\" type=\"button\" name=\"cookies\" class=\"govuk-button\" data-module=\"govuk-button\" (click)=\"rejectCookie()\">\n        Reject analytics cookies\n      </button>\n      <a class=\"govuk-link\" routerLink=\"/cookies\">View cookies</a>\n    </div>\n  </div>\n</div>" }]
         }], ctorParameters: function () { return [{ type: CookieService }, { type: undefined, decorators: [{
@@ -3916,10 +3949,10 @@ class PaginationComponent {
     onNext() {
         this.nextPage.emit(null);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: PaginationComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.7", type: PaginationComponent, selector: "xuilib-pagination", inputs: { moreItems: "moreItems", firstRecord: "firstRecord" }, outputs: { previousPage: "previousPage", nextPage: "nextPage" }, ngImport: i0, template: "<nav class=\"hmcts-pagination\" id=\"pagination-label\">\n\n  <p class=\"govuk-visually-hidden\" aria-labelledby=\"pagination-label\">Pagination navigation</p>\n\n  <ul class=\"hmcts-pagination__list\">\n    <li class=\"hmcts-pagination__item  hmcts-pagination__item--prev\">\n      <a *ngIf=\"firstRecord > 1; else noPrevious\" class=\"hmcts-pagination__link\" (click)=\"onPrevious()\" href=\"javascript:void(0)\">\n        Previous page\n      </a>\n      <ng-template #noPrevious>\n        <span class=\"hmcts-pagination__link\">Previous page</span>\n      </ng-template>\n    </li>\n\n    <li class=\"hmcts-pagination__item  hmcts-pagination__item--next\">\n      <a *ngIf=\"moreItems; else noNext\" class=\"hmcts-pagination__link\" (click)=\"onNext()\" href=\"javascript:void(0)\">Next page</a>\n      <ng-template #noNext>\n        <span class=\"hmcts-pagination__link\">Next page</span>\n      </ng-template>\n    </li>\n  </ul>\n</nav>\n", styles: ["span.hmcts-pagination__link:hover{color:revert}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: PaginationComponent, decorators: [{
+PaginationComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: PaginationComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+PaginationComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: PaginationComponent, selector: "xuilib-pagination", inputs: { moreItems: "moreItems", firstRecord: "firstRecord" }, outputs: { previousPage: "previousPage", nextPage: "nextPage" }, ngImport: i0, template: "<nav class=\"hmcts-pagination\" id=\"pagination-label\">\n\n  <p class=\"govuk-visually-hidden\" aria-labelledby=\"pagination-label\">Pagination navigation</p>\n\n  <ul class=\"hmcts-pagination__list\">\n    <li class=\"hmcts-pagination__item  hmcts-pagination__item--prev\">\n      <a *ngIf=\"firstRecord > 1; else noPrevious\" class=\"hmcts-pagination__link\" (click)=\"onPrevious()\" href=\"javascript:void(0)\">\n        Previous page\n      </a>\n      <ng-template #noPrevious>\n        <span class=\"hmcts-pagination__link\">Previous page</span>\n      </ng-template>\n    </li>\n\n    <li class=\"hmcts-pagination__item  hmcts-pagination__item--next\">\n      <a *ngIf=\"moreItems; else noNext\" class=\"hmcts-pagination__link\" (click)=\"onNext()\" href=\"javascript:void(0)\">Next page</a>\n      <ng-template #noNext>\n        <span class=\"hmcts-pagination__link\">Next page</span>\n      </ng-template>\n    </li>\n  </ul>\n</nav>\n", styles: ["span.hmcts-pagination__link:hover{color:revert}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: PaginationComponent, decorators: [{
             type: Component,
             args: [{ selector: 'xuilib-pagination', template: "<nav class=\"hmcts-pagination\" id=\"pagination-label\">\n\n  <p class=\"govuk-visually-hidden\" aria-labelledby=\"pagination-label\">Pagination navigation</p>\n\n  <ul class=\"hmcts-pagination__list\">\n    <li class=\"hmcts-pagination__item  hmcts-pagination__item--prev\">\n      <a *ngIf=\"firstRecord > 1; else noPrevious\" class=\"hmcts-pagination__link\" (click)=\"onPrevious()\" href=\"javascript:void(0)\">\n        Previous page\n      </a>\n      <ng-template #noPrevious>\n        <span class=\"hmcts-pagination__link\">Previous page</span>\n      </ng-template>\n    </li>\n\n    <li class=\"hmcts-pagination__item  hmcts-pagination__item--next\">\n      <a *ngIf=\"moreItems; else noNext\" class=\"hmcts-pagination__link\" (click)=\"onNext()\" href=\"javascript:void(0)\">Next page</a>\n      <ng-template #noNext>\n        <span class=\"hmcts-pagination__link\">Next page</span>\n      </ng-template>\n    </li>\n  </ul>\n</nav>\n", styles: ["span.hmcts-pagination__link:hover{color:revert}\n"] }]
         }], ctorParameters: function () { return []; }, propDecorators: { moreItems: [{
@@ -4025,10 +4058,10 @@ class SearchVenueComponent {
         return this.findLocationFormGroup && this.findLocationFormGroup.controls && this.findLocationFormGroup.controls.locationSelectedFormControl.value ?
             this.findLocationFormGroup.controls.locationSelectedFormControl.value.court_name : '';
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: SearchVenueComponent, deps: [{ token: LocationService }, { token: i2$3.UntypedFormBuilder }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.7", type: SearchVenueComponent, selector: "xuilib-search-venue", inputs: { control: "control", disabled: "disabled", locationType: "locationType", selectedLocations: "selectedLocations", serviceIds: "serviceIds", submitted: "submitted", showAutocomplete: "showAutocomplete", displayedLocations: "displayedLocations" }, outputs: { locationChanged: "locationChanged" }, viewQueries: [{ propertyName: "autoCompleteInputBox", first: true, predicate: ["inputSelectedLocation"], descendants: true, read: ElementRef }], ngImport: i0, template: "<div class=\"auto-complete-container\">\n  <div *ngIf=\"readyAfterContent\" class=\"autocomplete__wrapper\">\n    <input\n      [formControl]=\"findLocationFormGroup.controls.findLocationFormControl\"\n      [matAutocomplete]=\"autoSearchLocation\"\n      (keydown)=\"onKeyDown()\"\n      (keyup)=\"onKeyUp($event)\"\n      (focus)=\"onFocus()\"\n      class=\"autocomplete__input autocomplete__input--default search-box\"\n      [attr.disabled]=\"!disabled ? null: disabled\"\n      [value]=\"getControlCourtNameValue()\"\n      #inputSelectedLocation>\n    <mat-autocomplete class=\"mat-autocomplete-panel-extend\" autoActiveFirstOption #autoSearchLocation=\"matAutocomplete\">\n      <mat-option *ngFor=\"let location of displayedLocationsDuplicationFiltered\"\n                  [value]=\"getDisplayName(location)\"\n                  (onSelectionChange)=\"onSelectionChange(location)\"\n                  [ngClass]=\"{'hide-autocomplete': !showAutocomplete}\">\n        {{ getDisplayName(location) }}\n      </mat-option>\n      <mat-option *ngIf=\"!displayedLocationsDuplicationFiltered?.length && showAutocomplete && !searchInProgress\">{{ 'No results found' }}</mat-option>\n    </mat-autocomplete>\n  </div>\n</div>\n", styles: [".autocomplete__input{-webkit-appearance:none;border:2px solid #0b0c0c;border-radius:0;box-sizing:border-box;-moz-box-sizing:border-box;-webkit-box-sizing:border-box;margin-bottom:0;width:100%;line-height:24px;font-size:19px;background-color:transparent;position:relative}.autocomplete__hint{color:#b1b4b6;position:absolute}.autocomplete__input--default{padding:5px}.autocomplete__input--focused{outline:3px solid #fd0;outline-offset:0;box-shadow:inset 0 0 0 2px}.autocomplete__input--show-all-values{padding:5px 34px 5px 5px;cursor:pointer}.autocomplete__dropdown-arrow-down{z-index:-1;display:inline-block;position:absolute;right:8px;width:24px;height:24px;top:10px}.autocomplete__menu{background-color:#fff;border:2px solid #0b0c0c;border-top:0;color:#0b0c0c;margin:0;max-height:342px;overflow-x:hidden;padding:0;width:100%;width:calc(100% - 4px)}.autocomplete__menu--visible{display:block}.autocomplete__menu--hidden{display:none}.autocomplete__menu--overlay{box-shadow:#00000042 0 2px 6px;left:0;position:absolute;top:100%;z-index:100}.autocomplete__menu--inline{position:relative}.autocomplete__option{border-bottom:solid #b1b4b6;border-width:1px 0;cursor:pointer;display:block;position:relative}.autocomplete__option>*{pointer-events:none}.autocomplete__option:first-of-type{border-top-width:0}.autocomplete__option:last-of-type{border-bottom-width:0}.autocomplete__option--odd{background-color:#fafafa}.autocomplete__option--focused,.autocomplete__option:hover{background-color:#1d70b8;border-color:#1d70b8;color:#fff;outline:0}.autocomplete__option--no-results{background-color:#fafafa;color:#646b6f;cursor:not-allowed}.autocomplete__hint,.autocomplete__input,.autocomplete__option{font-size:13px;line-height:1.25}.autocomplete__hint,.autocomplete__option{padding:5px}@media (min-width: 641px){.autocomplete__hint,.autocomplete__input,.autocomplete__option{font-size:13px;line-height:1.31579}}.div-action{display:inline-block}.add-location{display:inline}.remove-location-button{margin:5px}.hide-autocomplete{display:none}.auto-complete-container{min-width:550px;display:inline-block;margin-right:4px}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2$3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$3.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "component", type: i4.MatLegacyAutocomplete, selector: "mat-autocomplete", inputs: ["disableRipple"], exportAs: ["matAutocomplete"] }, { kind: "directive", type: i4.MatLegacyAutocompleteTrigger, selector: "input[matAutocomplete], textarea[matAutocomplete]", exportAs: ["matAutocompleteTrigger"] }, { kind: "component", type: i5.MatLegacyOption, selector: "mat-option", exportAs: ["matOption"] }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: SearchVenueComponent, decorators: [{
+SearchVenueComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SearchVenueComponent, deps: [{ token: LocationService }, { token: i2$3.UntypedFormBuilder }], target: i0.ɵɵFactoryTarget.Component });
+SearchVenueComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: SearchVenueComponent, selector: "xuilib-search-venue", inputs: { control: "control", disabled: "disabled", locationType: "locationType", selectedLocations: "selectedLocations", serviceIds: "serviceIds", submitted: "submitted", showAutocomplete: "showAutocomplete", displayedLocations: "displayedLocations" }, outputs: { locationChanged: "locationChanged" }, viewQueries: [{ propertyName: "autoCompleteInputBox", first: true, predicate: ["inputSelectedLocation"], descendants: true, read: ElementRef }], ngImport: i0, template: "<div class=\"auto-complete-container\">\n  <div *ngIf=\"readyAfterContent\" class=\"autocomplete__wrapper\">\n    <input\n      [formControl]=\"findLocationFormGroup.controls.findLocationFormControl\"\n      [matAutocomplete]=\"autoSearchLocation\"\n      (keydown)=\"onKeyDown()\"\n      (keyup)=\"onKeyUp($event)\"\n      (focus)=\"onFocus()\"\n      class=\"autocomplete__input autocomplete__input--default search-box\"\n      [attr.disabled]=\"!disabled ? null: disabled\"\n      [value]=\"getControlCourtNameValue()\"\n      #inputSelectedLocation>\n    <mat-autocomplete class=\"mat-autocomplete-panel-extend\" autoActiveFirstOption #autoSearchLocation=\"matAutocomplete\">\n      <mat-option *ngFor=\"let location of displayedLocationsDuplicationFiltered\"\n                  [value]=\"getDisplayName(location)\"\n                  (onSelectionChange)=\"onSelectionChange(location)\"\n                  [ngClass]=\"{'hide-autocomplete': !showAutocomplete}\">\n        {{ getDisplayName(location) }}\n      </mat-option>\n      <mat-option *ngIf=\"!displayedLocationsDuplicationFiltered?.length && showAutocomplete && !searchInProgress\">{{ 'No results found' }}</mat-option>\n    </mat-autocomplete>\n  </div>\n</div>\n", styles: [".autocomplete__input{-webkit-appearance:none;border:2px solid #0b0c0c;border-radius:0;box-sizing:border-box;-moz-box-sizing:border-box;-webkit-box-sizing:border-box;margin-bottom:0;width:100%;line-height:24px;font-size:19px;background-color:transparent;position:relative}.autocomplete__hint{color:#b1b4b6;position:absolute}.autocomplete__input--default{padding:5px}.autocomplete__input--focused{outline:3px solid #fd0;outline-offset:0;box-shadow:inset 0 0 0 2px}.autocomplete__input--show-all-values{padding:5px 34px 5px 5px;cursor:pointer}.autocomplete__dropdown-arrow-down{z-index:-1;display:inline-block;position:absolute;right:8px;width:24px;height:24px;top:10px}.autocomplete__menu{background-color:#fff;border:2px solid #0b0c0c;border-top:0;color:#0b0c0c;margin:0;max-height:342px;overflow-x:hidden;padding:0;width:100%;width:calc(100% - 4px)}.autocomplete__menu--visible{display:block}.autocomplete__menu--hidden{display:none}.autocomplete__menu--overlay{box-shadow:#00000042 0 2px 6px;left:0;position:absolute;top:100%;z-index:100}.autocomplete__menu--inline{position:relative}.autocomplete__option{border-bottom:solid #b1b4b6;border-width:1px 0;cursor:pointer;display:block;position:relative}.autocomplete__option>*{pointer-events:none}.autocomplete__option:first-of-type{border-top-width:0}.autocomplete__option:last-of-type{border-bottom-width:0}.autocomplete__option--odd{background-color:#fafafa}.autocomplete__option--focused,.autocomplete__option:hover{background-color:#1d70b8;border-color:#1d70b8;color:#fff;outline:0}.autocomplete__option--no-results{background-color:#fafafa;color:#646b6f;cursor:not-allowed}.autocomplete__hint,.autocomplete__input,.autocomplete__option{font-size:13px;line-height:1.25}.autocomplete__hint,.autocomplete__option{padding:5px}@media (min-width: 641px){.autocomplete__hint,.autocomplete__input,.autocomplete__option{font-size:13px;line-height:1.31579}}.div-action{display:inline-block}.add-location{display:inline}.remove-location-button{margin:5px}.hide-autocomplete{display:none}.auto-complete-container{min-width:550px;display:inline-block;margin-right:4px}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2$3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$3.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "component", type: i4.MatLegacyAutocomplete, selector: "mat-autocomplete", inputs: ["disableRipple"], exportAs: ["matAutocomplete"] }, { kind: "directive", type: i4.MatLegacyAutocompleteTrigger, selector: "input[matAutocomplete], textarea[matAutocomplete]", exportAs: ["matAutocompleteTrigger"] }, { kind: "component", type: i5.MatLegacyOption, selector: "mat-option", exportAs: ["matOption"] }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SearchVenueComponent, decorators: [{
             type: Component,
             args: [{ selector: 'xuilib-search-venue', template: "<div class=\"auto-complete-container\">\n  <div *ngIf=\"readyAfterContent\" class=\"autocomplete__wrapper\">\n    <input\n      [formControl]=\"findLocationFormGroup.controls.findLocationFormControl\"\n      [matAutocomplete]=\"autoSearchLocation\"\n      (keydown)=\"onKeyDown()\"\n      (keyup)=\"onKeyUp($event)\"\n      (focus)=\"onFocus()\"\n      class=\"autocomplete__input autocomplete__input--default search-box\"\n      [attr.disabled]=\"!disabled ? null: disabled\"\n      [value]=\"getControlCourtNameValue()\"\n      #inputSelectedLocation>\n    <mat-autocomplete class=\"mat-autocomplete-panel-extend\" autoActiveFirstOption #autoSearchLocation=\"matAutocomplete\">\n      <mat-option *ngFor=\"let location of displayedLocationsDuplicationFiltered\"\n                  [value]=\"getDisplayName(location)\"\n                  (onSelectionChange)=\"onSelectionChange(location)\"\n                  [ngClass]=\"{'hide-autocomplete': !showAutocomplete}\">\n        {{ getDisplayName(location) }}\n      </mat-option>\n      <mat-option *ngIf=\"!displayedLocationsDuplicationFiltered?.length && showAutocomplete && !searchInProgress\">{{ 'No results found' }}</mat-option>\n    </mat-autocomplete>\n  </div>\n</div>\n", styles: [".autocomplete__input{-webkit-appearance:none;border:2px solid #0b0c0c;border-radius:0;box-sizing:border-box;-moz-box-sizing:border-box;-webkit-box-sizing:border-box;margin-bottom:0;width:100%;line-height:24px;font-size:19px;background-color:transparent;position:relative}.autocomplete__hint{color:#b1b4b6;position:absolute}.autocomplete__input--default{padding:5px}.autocomplete__input--focused{outline:3px solid #fd0;outline-offset:0;box-shadow:inset 0 0 0 2px}.autocomplete__input--show-all-values{padding:5px 34px 5px 5px;cursor:pointer}.autocomplete__dropdown-arrow-down{z-index:-1;display:inline-block;position:absolute;right:8px;width:24px;height:24px;top:10px}.autocomplete__menu{background-color:#fff;border:2px solid #0b0c0c;border-top:0;color:#0b0c0c;margin:0;max-height:342px;overflow-x:hidden;padding:0;width:100%;width:calc(100% - 4px)}.autocomplete__menu--visible{display:block}.autocomplete__menu--hidden{display:none}.autocomplete__menu--overlay{box-shadow:#00000042 0 2px 6px;left:0;position:absolute;top:100%;z-index:100}.autocomplete__menu--inline{position:relative}.autocomplete__option{border-bottom:solid #b1b4b6;border-width:1px 0;cursor:pointer;display:block;position:relative}.autocomplete__option>*{pointer-events:none}.autocomplete__option:first-of-type{border-top-width:0}.autocomplete__option:last-of-type{border-bottom-width:0}.autocomplete__option--odd{background-color:#fafafa}.autocomplete__option--focused,.autocomplete__option:hover{background-color:#1d70b8;border-color:#1d70b8;color:#fff;outline:0}.autocomplete__option--no-results{background-color:#fafafa;color:#646b6f;cursor:not-allowed}.autocomplete__hint,.autocomplete__input,.autocomplete__option{font-size:13px;line-height:1.25}.autocomplete__hint,.autocomplete__option{padding:5px}@media (min-width: 641px){.autocomplete__hint,.autocomplete__input,.autocomplete__option{font-size:13px;line-height:1.31579}}.div-action{display:inline-block}.add-location{display:inline}.remove-location-button{margin:5px}.hide-autocomplete{display:none}.auto-complete-container{min-width:550px;display:inline-block;margin-right:4px}\n"] }]
         }], ctorParameters: function () { return [{ type: LocationService }, { type: i2$3.UntypedFormBuilder }]; }, propDecorators: { control: [{
@@ -4148,10 +4181,10 @@ class SearchJudicialsComponent {
         return this.formGroup && this.formGroup.controls && this.formGroup.controls.selectedFormControl.value ?
             this.getDisplayName(this.formGroup.controls.selectedFormControl.value) : '';
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: SearchJudicialsComponent, deps: [{ token: FindAPersonService }, { token: i2$3.UntypedFormBuilder }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.7", type: SearchJudicialsComponent, selector: "xuilib-search-judicials", inputs: { control: "control", disabled: "disabled", selectedJudicials: "selectedJudicials", submitted: "submitted", placeholderContent: "placeholderContent", showAutocomplete: "showAutocomplete", displayedJudicials: "displayedJudicials", idValue: "idValue", errorMessage: "errorMessage", serviceId: "serviceId" }, outputs: { judicialChanged: "judicialChanged" }, viewQueries: [{ propertyName: "autoCompleteInputBox", first: true, predicate: ["inputSelection"], descendants: true, read: ElementRef, static: true }], ngImport: i0, template: "<div class=\"govuk-form-group\">\n  <input id=\"inputSelectPerson{{idValue}}\" [placeholder]=\"placeholderContent\" [formControl]=\"formGroup.controls.formControl\"\n    [matAutocomplete]=\"autoComplete\" (keydown)=\"onKeyDown()\" (keyup)=\"onKeyUp($event)\" (focus)=\"onFocus()\"\n    class=\"govuk-input\" [attr.disabled]=\"!disabled ? null: disabled\" [value]=\"getControlValueDisplayText()\"\n    #inputSelection>\n  <mat-autocomplete autoActiveFirstOption #autoComplete=\"matAutocomplete\">\n    <mat-option *ngFor=\"let judicial of displayedJudicialsDuplicationFiltered\" class=\"select-option\"\n      [value]=\"getDisplayName(judicial)\" (onSelectionChange)=\"onSelectionChange(judicial)\"\n      [ngClass]=\"{'hide-autocomplete': !showAutocomplete}\">\n      {{ getDisplayName(judicial) }}\n    </mat-option>\n    <mat-option class=\"select-option\"\n      *ngIf=\"!displayedJudicialsDuplicationFiltered?.length && showAutocomplete && !searchInProgress\">\n      {{ 'No results found' }}</mat-option>\n  </mat-autocomplete>\n</div>\n", styles: [".hide-autocomplete{display:none}.mat-option:hover{background:#2596be}.mat-option.select-option:hover{background:#1d70b8;color:#fff}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2$3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$3.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "component", type: i4.MatLegacyAutocomplete, selector: "mat-autocomplete", inputs: ["disableRipple"], exportAs: ["matAutocomplete"] }, { kind: "directive", type: i4.MatLegacyAutocompleteTrigger, selector: "input[matAutocomplete], textarea[matAutocomplete]", exportAs: ["matAutocompleteTrigger"] }, { kind: "component", type: i5.MatLegacyOption, selector: "mat-option", exportAs: ["matOption"] }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: SearchJudicialsComponent, decorators: [{
+SearchJudicialsComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SearchJudicialsComponent, deps: [{ token: FindAPersonService }, { token: i2$3.UntypedFormBuilder }], target: i0.ɵɵFactoryTarget.Component });
+SearchJudicialsComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: SearchJudicialsComponent, selector: "xuilib-search-judicials", inputs: { control: "control", disabled: "disabled", selectedJudicials: "selectedJudicials", submitted: "submitted", placeholderContent: "placeholderContent", showAutocomplete: "showAutocomplete", displayedJudicials: "displayedJudicials", idValue: "idValue", errorMessage: "errorMessage", serviceId: "serviceId" }, outputs: { judicialChanged: "judicialChanged" }, viewQueries: [{ propertyName: "autoCompleteInputBox", first: true, predicate: ["inputSelection"], descendants: true, read: ElementRef, static: true }], ngImport: i0, template: "<div class=\"govuk-form-group\">\n  <input id=\"inputSelectPerson{{idValue}}\" [placeholder]=\"placeholderContent\" [formControl]=\"formGroup.controls.formControl\"\n    [matAutocomplete]=\"autoComplete\" (keydown)=\"onKeyDown()\" (keyup)=\"onKeyUp($event)\" (focus)=\"onFocus()\"\n    class=\"govuk-input\" [attr.disabled]=\"!disabled ? null: disabled\" [value]=\"getControlValueDisplayText()\"\n    #inputSelection>\n  <mat-autocomplete autoActiveFirstOption #autoComplete=\"matAutocomplete\">\n    <mat-option *ngFor=\"let judicial of displayedJudicialsDuplicationFiltered\" class=\"select-option\"\n      [value]=\"getDisplayName(judicial)\" (onSelectionChange)=\"onSelectionChange(judicial)\"\n      [ngClass]=\"{'hide-autocomplete': !showAutocomplete}\">\n      {{ getDisplayName(judicial) }}\n    </mat-option>\n    <mat-option class=\"select-option\"\n      *ngIf=\"!displayedJudicialsDuplicationFiltered?.length && showAutocomplete && !searchInProgress\">\n      {{ 'No results found' }}</mat-option>\n  </mat-autocomplete>\n</div>\n", styles: [".hide-autocomplete{display:none}.mat-option:hover{background:#2596be}.mat-option.select-option:hover{background:#1d70b8;color:#fff}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2$3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$3.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "component", type: i4.MatLegacyAutocomplete, selector: "mat-autocomplete", inputs: ["disableRipple"], exportAs: ["matAutocomplete"] }, { kind: "directive", type: i4.MatLegacyAutocompleteTrigger, selector: "input[matAutocomplete], textarea[matAutocomplete]", exportAs: ["matAutocompleteTrigger"] }, { kind: "component", type: i5.MatLegacyOption, selector: "mat-option", exportAs: ["matOption"] }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SearchJudicialsComponent, decorators: [{
             type: Component,
             args: [{ selector: 'xuilib-search-judicials', template: "<div class=\"govuk-form-group\">\n  <input id=\"inputSelectPerson{{idValue}}\" [placeholder]=\"placeholderContent\" [formControl]=\"formGroup.controls.formControl\"\n    [matAutocomplete]=\"autoComplete\" (keydown)=\"onKeyDown()\" (keyup)=\"onKeyUp($event)\" (focus)=\"onFocus()\"\n    class=\"govuk-input\" [attr.disabled]=\"!disabled ? null: disabled\" [value]=\"getControlValueDisplayText()\"\n    #inputSelection>\n  <mat-autocomplete autoActiveFirstOption #autoComplete=\"matAutocomplete\">\n    <mat-option *ngFor=\"let judicial of displayedJudicialsDuplicationFiltered\" class=\"select-option\"\n      [value]=\"getDisplayName(judicial)\" (onSelectionChange)=\"onSelectionChange(judicial)\"\n      [ngClass]=\"{'hide-autocomplete': !showAutocomplete}\">\n      {{ getDisplayName(judicial) }}\n    </mat-option>\n    <mat-option class=\"select-option\"\n      *ngIf=\"!displayedJudicialsDuplicationFiltered?.length && showAutocomplete && !searchInProgress\">\n      {{ 'No results found' }}</mat-option>\n  </mat-autocomplete>\n</div>\n", styles: [".hide-autocomplete{display:none}.mat-option:hover{background:#2596be}.mat-option.select-option:hover{background:#1d70b8;color:#fff}\n"] }]
         }], ctorParameters: function () { return [{ type: FindAPersonService }, { type: i2$3.UntypedFormBuilder }]; }, propDecorators: { control: [{
@@ -4193,10 +4226,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.7", ngImpor
  */
 class ExuiPageWrapperComponent {
     constructor() { }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: ExuiPageWrapperComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.7", type: ExuiPageWrapperComponent, selector: "exui-page-wrapper", inputs: { backLink: "backLink", title: "title", fnTitle: "fnTitle" }, ngImport: i0, template: "<div class=\"page\">\n  <a *ngIf=\"backLink\" [routerLink]=\"backLink\" class=\"govuk-back-link\">Back</a>\n  <div class=\"govuk-width-container\">\n    <main id=\"content\" role=\"main\" class=\"govuk-main-wrapper\">\n      <div class=\"govuk-grid-row\">\n        <h1 *ngIf=\"title\" class=\"govuk-heading-xl\">\n          <span *ngIf=\"fnTitle\" class=\"govuk-caption-xl\">{{fnTitle}}</span>\n          {{title}}\n        </h1>\n        <ng-content>\n\n        </ng-content>\n      </div>\n    </main>\n  </div>\n</div>\n", styles: [".page{width:100%}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: ExuiPageWrapperComponent, decorators: [{
+ExuiPageWrapperComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: ExuiPageWrapperComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+ExuiPageWrapperComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: ExuiPageWrapperComponent, selector: "exui-page-wrapper", inputs: { backLink: "backLink", title: "title", fnTitle: "fnTitle" }, ngImport: i0, template: "<div class=\"page\">\n  <a *ngIf=\"backLink\" [routerLink]=\"backLink\" class=\"govuk-back-link\">Back</a>\n  <div class=\"govuk-width-container\">\n    <main id=\"content\" role=\"main\" class=\"govuk-main-wrapper\">\n      <div class=\"govuk-grid-row\">\n        <h1 *ngIf=\"title\" class=\"govuk-heading-xl\">\n          <span *ngIf=\"fnTitle\" class=\"govuk-caption-xl\">{{fnTitle}}</span>\n          {{title}}\n        </h1>\n        <ng-content>\n\n        </ng-content>\n      </div>\n    </main>\n  </div>\n</div>\n", styles: [".page{width:100%}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: ExuiPageWrapperComponent, decorators: [{
             type: Component,
             args: [{ selector: 'exui-page-wrapper', template: "<div class=\"page\">\n  <a *ngIf=\"backLink\" [routerLink]=\"backLink\" class=\"govuk-back-link\">Back</a>\n  <div class=\"govuk-width-container\">\n    <main id=\"content\" role=\"main\" class=\"govuk-main-wrapper\">\n      <div class=\"govuk-grid-row\">\n        <h1 *ngIf=\"title\" class=\"govuk-heading-xl\">\n          <span *ngIf=\"fnTitle\" class=\"govuk-caption-xl\">{{fnTitle}}</span>\n          {{title}}\n        </h1>\n        <ng-content>\n\n        </ng-content>\n      </div>\n    </main>\n  </div>\n</div>\n", styles: [".page{width:100%}\n"] }]
         }], ctorParameters: function () { return []; }, propDecorators: { backLink: [{
@@ -4208,15 +4241,15 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.7", ngImpor
             }] } });
 
 class FeatureToggleDirective {
-    set xuilibFeatureToggle(feature) {
-        this.feature = feature;
-        this.updateSubscription();
-    }
     constructor(service, viewContainer, templateRef) {
         this.service = service;
         this.viewContainer = viewContainer;
         this.templateRef = templateRef;
     }
+    set xuilibFeatureToggle(feature) {
+        this.feature = feature;
+        this.updateSubscription();
+    }
     ngOnDestroy() {
         if (this.subscription) {
             this.subscription.unsubscribe();
@@ -4232,10 +4265,10 @@ class FeatureToggleDirective {
             }
         });
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: FeatureToggleDirective, deps: [{ token: FeatureToggleService }, { token: i0.ViewContainerRef }, { token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.1.7", type: FeatureToggleDirective, selector: "[xuilibFeatureToggle]", inputs: { xuilibFeatureToggle: "xuilibFeatureToggle" }, ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: FeatureToggleDirective, decorators: [{
+FeatureToggleDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: FeatureToggleDirective, deps: [{ token: FeatureToggleService }, { token: i0.ViewContainerRef }, { token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive });
+FeatureToggleDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.2.9", type: FeatureToggleDirective, selector: "[xuilibFeatureToggle]", inputs: { xuilibFeatureToggle: "xuilibFeatureToggle" }, ngImport: i0 });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: FeatureToggleDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: '[xuilibFeatureToggle]'
@@ -4259,10 +4292,10 @@ class LetDirective {
     set xuilibLet(condition) {
         this.context.$implicit = this.context.xuilibLet = condition;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: LetDirective, deps: [{ token: i0.ViewContainerRef }, { token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.1.7", type: LetDirective, selector: "[xuilibLet]", inputs: { xuilibLet: "xuilibLet" }, ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: LetDirective, decorators: [{
+LetDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: LetDirective, deps: [{ token: i0.ViewContainerRef }, { token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive });
+LetDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.2.9", type: LetDirective, selector: "[xuilibLet]", inputs: { xuilibLet: "xuilibLet" }, ngImport: i0 });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: LetDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: '[xuilibLet]'
@@ -4313,10 +4346,10 @@ class GovUkCheckboxesComponent {
             return [this.items];
         }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: GovUkCheckboxesComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.7", type: GovUkCheckboxesComponent, selector: "xuilib-gov-uk-checkboxes", inputs: { group: "group", config: "config", items: "items", errorMessage: "errorMessage" }, ngImport: i0, template: "<div class=\"govuk-form-group gov-uk-input\" [formGroup]=\"group\"\n     [ngClass]=\"{'govuk-form-group--error': errorMessage?.isInvalid}\">\n\n  <xuilib-gov-label [config]=\"config\"></xuilib-gov-label>\n\n  <span *ngIf=\"config.hint\" [id]=\"config.id +'-hint'\" class=\"govuk-hint\">\n    {{config.hint}}\n  </span>\n\n  <xuilib-gov-uk-error-message [config]=\"config\" [errorMessage]=\"errorMessage\"></xuilib-gov-uk-error-message>\n\n  <div class=\"govuk-checkboxes govuk-checkboxes--small govuk-checkboxes-multi-column\" data-module=\"govuk-checkboxes\">\n    <div class=\"govuk-checkboxes-multi-column__single\" *ngFor=\"let columnItems of columns\">\n      <div class=\"govuk-checkboxes__item\" *ngFor=\"let item of columnItems\">\n        <input type=\"checkbox\" class=\"govuk-checkboxes__input\"\n               [id]=\"item.id\" [name]=\"item.id\" [checked]=\"isChecked(item.value)\" [value]=\"item.value\"\n               [attr.aria-describedby]=\"setDescribedBy()\"\n               (change)=\"onChecked($event.target.checked, item.value)\"\n        >\n        <label class=\"govuk-label govuk-checkboxes__label\" [for]=\"item.id\">\n          {{ item.label }}\n        </label>\n        <div *ngIf=\"item.hint\" class=\"govuk-hint govuk-checkboxes__hint\">\n          {{ item.hint }}\n        </div>\n      </div>\n    </div>\n  </div>\n</div>\n", styles: [".govuk-checkboxes-multi-column{display:flex;flex-wrap:wrap;margin-left:-20px;margin-right:-20px}.govuk-checkboxes-multi-column__single{padding-left:20px;padding-right:20px}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2$3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2$3.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "component", type: GovUkLabelComponent, selector: "xuilib-gov-label", inputs: ["config"] }, { kind: "component", type: GovUkErrorMessageComponent, selector: " xuilib-gov-uk-error-message", inputs: ["config", "errorMessage"] }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: GovUkCheckboxesComponent, decorators: [{
+GovUkCheckboxesComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: GovUkCheckboxesComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+GovUkCheckboxesComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: GovUkCheckboxesComponent, selector: "xuilib-gov-uk-checkboxes", inputs: { group: "group", config: "config", items: "items", errorMessage: "errorMessage" }, ngImport: i0, template: "<div class=\"govuk-form-group gov-uk-input\" [formGroup]=\"group\"\n     [ngClass]=\"{'govuk-form-group--error': errorMessage?.isInvalid}\">\n\n  <xuilib-gov-label [config]=\"config\"></xuilib-gov-label>\n\n  <span *ngIf=\"config.hint\" [id]=\"config.id +'-hint'\" class=\"govuk-hint\">\n    {{config.hint}}\n  </span>\n\n  <xuilib-gov-uk-error-message [config]=\"config\" [errorMessage]=\"errorMessage\"></xuilib-gov-uk-error-message>\n\n  <div class=\"govuk-checkboxes govuk-checkboxes--small govuk-checkboxes-multi-column\" data-module=\"govuk-checkboxes\">\n    <div class=\"govuk-checkboxes-multi-column__single\" *ngFor=\"let columnItems of columns\">\n      <div class=\"govuk-checkboxes__item\" *ngFor=\"let item of columnItems\">\n        <input type=\"checkbox\" class=\"govuk-checkboxes__input\"\n               [id]=\"item.id\" [name]=\"item.id\" [checked]=\"isChecked(item.value)\" [value]=\"item.value\"\n               [attr.aria-describedby]=\"setDescribedBy()\"\n               (change)=\"onChecked($event.target.checked, item.value)\"\n        >\n        <label class=\"govuk-label govuk-checkboxes__label\" [for]=\"item.id\">\n          {{ item.label }}\n        </label>\n        <div *ngIf=\"item.hint\" class=\"govuk-hint govuk-checkboxes__hint\">\n          {{ item.hint }}\n        </div>\n      </div>\n    </div>\n  </div>\n</div>\n", styles: [".govuk-checkboxes-multi-column{display:flex;flex-wrap:wrap;margin-left:-20px;margin-right:-20px}.govuk-checkboxes-multi-column__single{padding-left:20px;padding-right:20px}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2$3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2$3.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "component", type: GovUkLabelComponent, selector: "xuilib-gov-label", inputs: ["config"] }, { kind: "component", type: GovUkErrorMessageComponent, selector: " xuilib-gov-uk-error-message", inputs: ["config", "errorMessage"] }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: GovUkCheckboxesComponent, decorators: [{
             type: Component,
             args: [{ selector: 'xuilib-gov-uk-checkboxes', template: "<div class=\"govuk-form-group gov-uk-input\" [formGroup]=\"group\"\n     [ngClass]=\"{'govuk-form-group--error': errorMessage?.isInvalid}\">\n\n  <xuilib-gov-label [config]=\"config\"></xuilib-gov-label>\n\n  <span *ngIf=\"config.hint\" [id]=\"config.id +'-hint'\" class=\"govuk-hint\">\n    {{config.hint}}\n  </span>\n\n  <xuilib-gov-uk-error-message [config]=\"config\" [errorMessage]=\"errorMessage\"></xuilib-gov-uk-error-message>\n\n  <div class=\"govuk-checkboxes govuk-checkboxes--small govuk-checkboxes-multi-column\" data-module=\"govuk-checkboxes\">\n    <div class=\"govuk-checkboxes-multi-column__single\" *ngFor=\"let columnItems of columns\">\n      <div class=\"govuk-checkboxes__item\" *ngFor=\"let item of columnItems\">\n        <input type=\"checkbox\" class=\"govuk-checkboxes__input\"\n               [id]=\"item.id\" [name]=\"item.id\" [checked]=\"isChecked(item.value)\" [value]=\"item.value\"\n               [attr.aria-describedby]=\"setDescribedBy()\"\n               (change)=\"onChecked($event.target.checked, item.value)\"\n        >\n        <label class=\"govuk-label govuk-checkboxes__label\" [for]=\"item.id\">\n          {{ item.label }}\n        </label>\n        <div *ngIf=\"item.hint\" class=\"govuk-hint govuk-checkboxes__hint\">\n          {{ item.hint }}\n        </div>\n      </div>\n    </div>\n  </div>\n</div>\n", styles: [".govuk-checkboxes-multi-column{display:flex;flex-wrap:wrap;margin-left:-20px;margin-right:-20px}.govuk-checkboxes-multi-column__single{padding-left:20px;padding-right:20px}\n"] }]
         }], propDecorators: { group: [{
@@ -4376,10 +4409,10 @@ class GovUkDateComponent {
             return !this.isValidDate(new Date(year, month, day), month, +year) ? { dateComponent: true } : null;
         };
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: GovUkDateComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.7", type: GovUkDateComponent, selector: "xuilib-gov-uk-date", inputs: { config: "config", errorMessage: "errorMessage", formGroup: "formGroup", isOptional: "isOptional" }, ngImport: i0, template: "<div class=\"govuk-form-group\" [ngClass]=\"{'govuk-form-group--error': errorMessage?.isInvalid}\" [formGroup]=\"formGroup\">\n  <div class=\"date-input-container\">\n    <xuilib-gov-uk-fieldset\n      [config]=\"{\n        legend: config.label || 'Date component',\n        classes: config.classes || 'govuk-label--m',\n        id: config.id,\n        hint: config.hint != null ? config.hint : 'For example, 12 11 2007',\n        isPageHeading: config.isPageHeading || false}\"\n      [errorMessage]=\"errorMessage\">\n      <xuilib-gov-uk-error-message\n        [config]=\"{id: 'passport'}\"\n        *ngIf=\"errorMessage\"\n        [errorMessage]=\"errorMessage\">\n      </xuilib-gov-uk-error-message>\n      <div class=\"govuk-date-input\" [id]=\"config.id+'-date'\">\n        <div class=\"govuk-date-input__item\">\n          <div class=\"govuk-form-group\">\n            <xuilib-gov-label\n              [config]=\"{label: 'Day', name: config.id+'-day', id: config.id+'-day', classes: 'govuk-date-input__label'}\">\n            </xuilib-gov-label>\n            <input class=\"govuk-input govuk-date-input__input govuk-input--width-2\"\n                   [ngClass]=\"{'govuk-input--error': errorMessage?.isInvalid}\"\n                   [id]=\"config.id\"\n                   [name]=\"config.id+'-day'\" type=\"number\" value=\"\" pattern=\"[0-9]*\"\n                   [formControlName]=\"config.id+'_day'\">\n          </div>\n        </div>\n        <div class=\"govuk-date-input__item\">\n          <div class=\"govuk-form-group\">\n            <xuilib-gov-label\n              [config]=\"{label: 'Month', name: config.id+'-month', id: config.id+'-month', classes: 'govuk-date-input__label'}\">\n            </xuilib-gov-label>\n            <input class=\"govuk-input govuk-date-input__input govuk-input--width-2\"\n                   [ngClass]=\"{'govuk-input--error': errorMessage?.isInvalid}\"\n                   [id]=\"config.id+'-month'\"\n                   [name]=\"config.id+'-month'\" type=\"number\" value=\"\" pattern=\"[0-9]*\"\n                   [formControlName]=\"config.id+'_month'\">\n          </div>\n        </div>\n        <div class=\"govuk-date-input__item\">\n          <div class=\"govuk-form-group\">\n            <xuilib-gov-label\n              [config]=\"{label: 'Year', name: config.id+'-year', id: config.id+'-year', classes: 'govuk-date-input__label'}\">\n            </xuilib-gov-label>\n            <input class=\"govuk-input govuk-date-input__input govuk-input--width-4\"\n                   [ngClass]=\"{'govuk-input--error': errorMessage?.isInvalid}\"\n                   [id]=\"config.id+'-year'\"\n                   [name]=\"config.id+'-year'\" type=\"number\" value=\"\" pattern=\"[0-9]*\"\n                   [formControlName]=\"config.id+'_year'\">\n          </div>\n        </div>\n      </div>\n    </xuilib-gov-uk-fieldset>\n  </div>\n</div>\n", styles: [".govuk-form-group .date-input-container{margin-bottom:30px}.govuk-form-group .date-input-container .govuk-date-input .govuk-date-input__item .govuk-form-group{margin-bottom:0}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2$3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2$3.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { kind: "directive", type: i2$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2$3.PatternValidator, selector: "[pattern][formControlName],[pattern][formControl],[pattern][ngModel]", inputs: ["pattern"] }, { kind: "directive", type: i2$3.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i2$3.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: GovUkLabelComponent, selector: "xuilib-gov-label", inputs: ["config"] }, { kind: "component", type: GovUkErrorMessageComponent, selector: " xuilib-gov-uk-error-message", inputs: ["config", "errorMessage"] }, { kind: "component", type: GovUkFieldsetComponent, selector: "xuilib-gov-uk-fieldset", inputs: ["config", "errorMessage"] }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: GovUkDateComponent, decorators: [{
+GovUkDateComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: GovUkDateComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+GovUkDateComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: GovUkDateComponent, selector: "xuilib-gov-uk-date", inputs: { config: "config", errorMessage: "errorMessage", formGroup: "formGroup", isOptional: "isOptional" }, ngImport: i0, template: "<div class=\"govuk-form-group\" [ngClass]=\"{'govuk-form-group--error': errorMessage?.isInvalid}\" [formGroup]=\"formGroup\">\n  <div class=\"date-input-container\">\n    <xuilib-gov-uk-fieldset\n      [config]=\"{\n        legend: config.label || 'Date component',\n        classes: config.classes || 'govuk-label--m',\n        id: config.id,\n        hint: config.hint != null ? config.hint : 'For example, 12 11 2007',\n        isPageHeading: config.isPageHeading || false}\"\n      [errorMessage]=\"errorMessage\">\n      <xuilib-gov-uk-error-message\n        [config]=\"{id: 'passport'}\"\n        *ngIf=\"errorMessage\"\n        [errorMessage]=\"errorMessage\">\n      </xuilib-gov-uk-error-message>\n      <div class=\"govuk-date-input\" [id]=\"config.id+'-date'\">\n        <div class=\"govuk-date-input__item\">\n          <div class=\"govuk-form-group\">\n            <xuilib-gov-label\n              [config]=\"{label: 'Day', name: config.id+'-day', id: config.id+'-day', classes: 'govuk-date-input__label'}\">\n            </xuilib-gov-label>\n            <input class=\"govuk-input govuk-date-input__input govuk-input--width-2\"\n                   [ngClass]=\"{'govuk-input--error': errorMessage?.isInvalid}\"\n                   [id]=\"config.id\"\n                   [name]=\"config.id+'-day'\" type=\"number\" value=\"\" pattern=\"[0-9]*\"\n                   [formControlName]=\"config.id+'_day'\">\n          </div>\n        </div>\n        <div class=\"govuk-date-input__item\">\n          <div class=\"govuk-form-group\">\n            <xuilib-gov-label\n              [config]=\"{label: 'Month', name: config.id+'-month', id: config.id+'-month', classes: 'govuk-date-input__label'}\">\n            </xuilib-gov-label>\n            <input class=\"govuk-input govuk-date-input__input govuk-input--width-2\"\n                   [ngClass]=\"{'govuk-input--error': errorMessage?.isInvalid}\"\n                   [id]=\"config.id+'-month'\"\n                   [name]=\"config.id+'-month'\" type=\"number\" value=\"\" pattern=\"[0-9]*\"\n                   [formControlName]=\"config.id+'_month'\">\n          </div>\n        </div>\n        <div class=\"govuk-date-input__item\">\n          <div class=\"govuk-form-group\">\n            <xuilib-gov-label\n              [config]=\"{label: 'Year', name: config.id+'-year', id: config.id+'-year', classes: 'govuk-date-input__label'}\">\n            </xuilib-gov-label>\n            <input class=\"govuk-input govuk-date-input__input govuk-input--width-4\"\n                   [ngClass]=\"{'govuk-input--error': errorMessage?.isInvalid}\"\n                   [id]=\"config.id+'-year'\"\n                   [name]=\"config.id+'-year'\" type=\"number\" value=\"\" pattern=\"[0-9]*\"\n                   [formControlName]=\"config.id+'_year'\">\n          </div>\n        </div>\n      </div>\n    </xuilib-gov-uk-fieldset>\n  </div>\n</div>\n", styles: [".govuk-form-group .date-input-container{margin-bottom:30px}.govuk-form-group .date-input-container .govuk-date-input .govuk-date-input__item .govuk-form-group{margin-bottom:0}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2$3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2$3.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { kind: "directive", type: i2$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2$3.PatternValidator, selector: "[pattern][formControlName],[pattern][formControl],[pattern][ngModel]", inputs: ["pattern"] }, { kind: "directive", type: i2$3.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i2$3.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: GovUkLabelComponent, selector: "xuilib-gov-label", inputs: ["config"] }, { kind: "component", type: GovUkErrorMessageComponent, selector: " xuilib-gov-uk-error-message", inputs: ["config", "errorMessage"] }, { kind: "component", type: GovUkFieldsetComponent, selector: "xuilib-gov-uk-fieldset", inputs: ["config", "errorMessage"] }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: GovUkDateComponent, decorators: [{
             type: Component,
             args: [{ selector: 'xuilib-gov-uk-date', template: "<div class=\"govuk-form-group\" [ngClass]=\"{'govuk-form-group--error': errorMessage?.isInvalid}\" [formGroup]=\"formGroup\">\n  <div class=\"date-input-container\">\n    <xuilib-gov-uk-fieldset\n      [config]=\"{\n        legend: config.label || 'Date component',\n        classes: config.classes || 'govuk-label--m',\n        id: config.id,\n        hint: config.hint != null ? config.hint : 'For example, 12 11 2007',\n        isPageHeading: config.isPageHeading || false}\"\n      [errorMessage]=\"errorMessage\">\n      <xuilib-gov-uk-error-message\n        [config]=\"{id: 'passport'}\"\n        *ngIf=\"errorMessage\"\n        [errorMessage]=\"errorMessage\">\n      </xuilib-gov-uk-error-message>\n      <div class=\"govuk-date-input\" [id]=\"config.id+'-date'\">\n        <div class=\"govuk-date-input__item\">\n          <div class=\"govuk-form-group\">\n            <xuilib-gov-label\n              [config]=\"{label: 'Day', name: config.id+'-day', id: config.id+'-day', classes: 'govuk-date-input__label'}\">\n            </xuilib-gov-label>\n            <input class=\"govuk-input govuk-date-input__input govuk-input--width-2\"\n                   [ngClass]=\"{'govuk-input--error': errorMessage?.isInvalid}\"\n                   [id]=\"config.id\"\n                   [name]=\"config.id+'-day'\" type=\"number\" value=\"\" pattern=\"[0-9]*\"\n                   [formControlName]=\"config.id+'_day'\">\n          </div>\n        </div>\n        <div class=\"govuk-date-input__item\">\n          <div class=\"govuk-form-group\">\n            <xuilib-gov-label\n              [config]=\"{label: 'Month', name: config.id+'-month', id: config.id+'-month', classes: 'govuk-date-input__label'}\">\n            </xuilib-gov-label>\n            <input class=\"govuk-input govuk-date-input__input govuk-input--width-2\"\n                   [ngClass]=\"{'govuk-input--error': errorMessage?.isInvalid}\"\n                   [id]=\"config.id+'-month'\"\n                   [name]=\"config.id+'-month'\" type=\"number\" value=\"\" pattern=\"[0-9]*\"\n                   [formControlName]=\"config.id+'_month'\">\n          </div>\n        </div>\n        <div class=\"govuk-date-input__item\">\n          <div class=\"govuk-form-group\">\n            <xuilib-gov-label\n              [config]=\"{label: 'Year', name: config.id+'-year', id: config.id+'-year', classes: 'govuk-date-input__label'}\">\n            </xuilib-gov-label>\n            <input class=\"govuk-input govuk-date-input__input govuk-input--width-4\"\n                   [ngClass]=\"{'govuk-input--error': errorMessage?.isInvalid}\"\n                   [id]=\"config.id+'-year'\"\n                   [name]=\"config.id+'-year'\" type=\"number\" value=\"\" pattern=\"[0-9]*\"\n                   [formControlName]=\"config.id+'_year'\">\n          </div>\n        </div>\n      </div>\n    </xuilib-gov-uk-fieldset>\n  </div>\n</div>\n", styles: [".govuk-form-group .date-input-container{margin-bottom:30px}.govuk-form-group .date-input-container .govuk-date-input .govuk-date-input__item .govuk-form-group{margin-bottom:0}\n"] }]
         }], ctorParameters: function () { return []; }, propDecorators: { config: [{
@@ -4410,10 +4443,10 @@ class GovUkFileUploadComponent {
     setDescribedBy() {
         return HtmlTemplatesHelper.setDescribedBy(this.errorMessage, this.config);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: GovUkFileUploadComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.7", type: GovUkFileUploadComponent, selector: "xuilib-gov-uk-file-upload", inputs: { errorMessage: "errorMessage", group: "group", config: "config" }, ngImport: i0, template: "<div class=\"govuk-form-group\" [formGroup]=\"group\"\n         [ngClass]=\"{'govuk-form-group--error': errorMessage?.isInvalid}\">\n\n      <xuilib-gov-label [config]=\"config\"></xuilib-gov-label>\n\n      <span *ngIf=\"config.hint\" [id]=\"config.id +'-hint'\" class=\"govuk-hint\">\n          {{config.hint}}\n      </span>\n\n      <xuilib-gov-uk-error-message [config]=\"config\" [errorMessage]=\"errorMessage\"></xuilib-gov-uk-error-message>\n\n      <input class=\"govuk-file-upload\"\n             *ngIf=\"reloadInput\"\n             [formControlName]=\"config.id\"\n             [ngClass]=\"{'govuk-file-upload--error': errorMessage?.isInvalid}\"\n             [id]=\"config.id\" [name]=\"config.name\"\n             [attr.aria-describedby]=\"setDescribedBy()\"\n             type=\"file\">\n    </div>", dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2$3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2$3.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i2$3.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: GovUkLabelComponent, selector: "xuilib-gov-label", inputs: ["config"] }, { kind: "component", type: GovUkErrorMessageComponent, selector: " xuilib-gov-uk-error-message", inputs: ["config", "errorMessage"] }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: GovUkFileUploadComponent, decorators: [{
+GovUkFileUploadComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: GovUkFileUploadComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+GovUkFileUploadComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: GovUkFileUploadComponent, selector: "xuilib-gov-uk-file-upload", inputs: { errorMessage: "errorMessage", group: "group", config: "config" }, ngImport: i0, template: "<div class=\"govuk-form-group\" [formGroup]=\"group\"\n         [ngClass]=\"{'govuk-form-group--error': errorMessage?.isInvalid}\">\n\n      <xuilib-gov-label [config]=\"config\"></xuilib-gov-label>\n\n      <span *ngIf=\"config.hint\" [id]=\"config.id +'-hint'\" class=\"govuk-hint\">\n          {{config.hint}}\n      </span>\n\n      <xuilib-gov-uk-error-message [config]=\"config\" [errorMessage]=\"errorMessage\"></xuilib-gov-uk-error-message>\n\n      <input class=\"govuk-file-upload\"\n             *ngIf=\"reloadInput\"\n             [formControlName]=\"config.id\"\n             [ngClass]=\"{'govuk-file-upload--error': errorMessage?.isInvalid}\"\n             [id]=\"config.id\" [name]=\"config.name\"\n             [attr.aria-describedby]=\"setDescribedBy()\"\n             type=\"file\">\n    </div>", dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2$3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2$3.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i2$3.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: GovUkLabelComponent, selector: "xuilib-gov-label", inputs: ["config"] }, { kind: "component", type: GovUkErrorMessageComponent, selector: " xuilib-gov-uk-error-message", inputs: ["config", "errorMessage"] }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: GovUkFileUploadComponent, decorators: [{
             type: Component,
             args: [{ selector: 'xuilib-gov-uk-file-upload', template: "<div class=\"govuk-form-group\" [formGroup]=\"group\"\n         [ngClass]=\"{'govuk-form-group--error': errorMessage?.isInvalid}\">\n\n      <xuilib-gov-label [config]=\"config\"></xuilib-gov-label>\n\n      <span *ngIf=\"config.hint\" [id]=\"config.id +'-hint'\" class=\"govuk-hint\">\n          {{config.hint}}\n      </span>\n\n      <xuilib-gov-uk-error-message [config]=\"config\" [errorMessage]=\"errorMessage\"></xuilib-gov-uk-error-message>\n\n      <input class=\"govuk-file-upload\"\n             *ngIf=\"reloadInput\"\n             [formControlName]=\"config.id\"\n             [ngClass]=\"{'govuk-file-upload--error': errorMessage?.isInvalid}\"\n             [id]=\"config.id\" [name]=\"config.name\"\n             [attr.aria-describedby]=\"setDescribedBy()\"\n             type=\"file\">\n    </div>" }]
         }], ctorParameters: function () { return []; }, propDecorators: { errorMessage: [{
@@ -4442,10 +4475,10 @@ class GovUkRadioComponent {
         this.config.classes = this.config.classes ?
             this.config.classes.concat(' govuk-radios__label') : 'govuk-radios__label';
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: GovUkRadioComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.7", type: GovUkRadioComponent, selector: "xuilib-gov-radio", inputs: { group: "group", config: "config" }, ngImport: i0, template: "<div class=\"govuk-radios__item\" [formGroup]=\"group\">\n  <input [className]=\"'govuk-radios__input ' + config.classes\"\n         [id]=\"config.id\"\n         [value]=\"config.value\" type=\"radio\"\n         [attr.data-aria-controls]=\"config.id\"\n         [name]=\"config.name\"\n         [formControl]=\"group.controls[config.name]\">\n  <xuilib-gov-label appRemoveHost [config]=\"config\"></xuilib-gov-label>\n</div>", dependencies: [{ kind: "directive", type: i2$3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2$3.RadioControlValueAccessor, selector: "input[type=radio][formControlName],input[type=radio][formControl],input[type=radio][ngModel]", inputs: ["name", "formControlName", "value"] }, { kind: "directive", type: i2$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2$3.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: i2$3.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "component", type: GovUkLabelComponent, selector: "xuilib-gov-label", inputs: ["config"] }, { kind: "directive", type: RemoveHostDirective, selector: "[appRemoveHost]" }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: GovUkRadioComponent, decorators: [{
+GovUkRadioComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: GovUkRadioComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+GovUkRadioComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: GovUkRadioComponent, selector: "xuilib-gov-radio", inputs: { group: "group", config: "config" }, ngImport: i0, template: "<div class=\"govuk-radios__item\" [formGroup]=\"group\">\n  <input [className]=\"'govuk-radios__input ' + config.classes\"\n         [id]=\"config.id\"\n         [value]=\"config.value\" type=\"radio\"\n         [attr.data-aria-controls]=\"config.id\"\n         [name]=\"config.name\"\n         [formControl]=\"group.controls[config.name]\">\n  <xuilib-gov-label appRemoveHost [config]=\"config\"></xuilib-gov-label>\n</div>", dependencies: [{ kind: "directive", type: i2$3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2$3.RadioControlValueAccessor, selector: "input[type=radio][formControlName],input[type=radio][formControl],input[type=radio][ngModel]", inputs: ["name", "formControlName", "value"] }, { kind: "directive", type: i2$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2$3.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: i2$3.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "component", type: GovUkLabelComponent, selector: "xuilib-gov-label", inputs: ["config"] }, { kind: "directive", type: RemoveHostDirective, selector: "[appRemoveHost]" }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: GovUkRadioComponent, decorators: [{
             type: Component,
             args: [{ selector: 'xuilib-gov-radio', template: "<div class=\"govuk-radios__item\" [formGroup]=\"group\">\n  <input [className]=\"'govuk-radios__input ' + config.classes\"\n         [id]=\"config.id\"\n         [value]=\"config.value\" type=\"radio\"\n         [attr.data-aria-controls]=\"config.id\"\n         [name]=\"config.name\"\n         [formControl]=\"group.controls[config.name]\">\n  <xuilib-gov-label appRemoveHost [config]=\"config\"></xuilib-gov-label>\n</div>" }]
         }], ctorParameters: function () { return []; }, propDecorators: { group: [{
@@ -4462,10 +4495,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.7", ngImpor
 * @param: errors - array of error stings
 * */
 class GovUkRadiosComponent {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: GovUkRadiosComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.7", type: GovUkRadiosComponent, selector: "xuilib-gov-uk-radios", inputs: { options: "options", errors: "errors" }, ngImport: i0, template: "<xuilib-gov-uk-form-group-wrapper\n[error]=\"errors\"\n[config]=\"options.config\"\n[group]=\"options.key\">\n<div class=\"govuk-radios\">\n  <xuilib-gov-radio\n    appRemoveHost\n    *ngFor=\"let item of options.items\"\n    [group]=\"options.group\"\n    [config]=\"item.config\">\n  </xuilib-gov-radio>\n</div>\n</xuilib-gov-uk-form-group-wrapper>", dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "component", type: GovUkFormGroupWrapperComponent, selector: "xuilib-gov-uk-form-group-wrapper", inputs: ["error", "group", "config"] }, { kind: "component", type: GovUkRadioComponent, selector: "xuilib-gov-radio", inputs: ["group", "config"] }, { kind: "directive", type: RemoveHostDirective, selector: "[appRemoveHost]" }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: GovUkRadiosComponent, decorators: [{
+GovUkRadiosComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: GovUkRadiosComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+GovUkRadiosComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: GovUkRadiosComponent, selector: "xuilib-gov-uk-radios", inputs: { options: "options", errors: "errors" }, ngImport: i0, template: "<xuilib-gov-uk-form-group-wrapper\n[error]=\"errors\"\n[config]=\"options.config\"\n[group]=\"options.key\">\n<div class=\"govuk-radios\">\n  <xuilib-gov-radio\n    appRemoveHost\n    *ngFor=\"let item of options.items\"\n    [group]=\"options.group\"\n    [config]=\"item.config\">\n  </xuilib-gov-radio>\n</div>\n</xuilib-gov-uk-form-group-wrapper>", dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "component", type: GovUkFormGroupWrapperComponent, selector: "xuilib-gov-uk-form-group-wrapper", inputs: ["error", "group", "config"] }, { kind: "component", type: GovUkRadioComponent, selector: "xuilib-gov-radio", inputs: ["group", "config"] }, { kind: "directive", type: RemoveHostDirective, selector: "[appRemoveHost]" }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: GovUkRadiosComponent, decorators: [{
             type: Component,
             args: [{ selector: 'xuilib-gov-uk-radios', template: "<xuilib-gov-uk-form-group-wrapper\n[error]=\"errors\"\n[config]=\"options.config\"\n[group]=\"options.key\">\n<div class=\"govuk-radios\">\n  <xuilib-gov-radio\n    appRemoveHost\n    *ngFor=\"let item of options.items\"\n    [group]=\"options.group\"\n    [config]=\"item.config\">\n  </xuilib-gov-radio>\n</div>\n</xuilib-gov-uk-form-group-wrapper>" }]
         }], propDecorators: { options: [{
@@ -4483,10 +4516,10 @@ class GovUkSelectComponent {
     setDescribedBy() {
         return HtmlTemplatesHelper.setDescribedBy(this.errorMessage, this.config);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: GovUkSelectComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.7", type: GovUkSelectComponent, selector: "xuilib-gov-select", inputs: { errorMessage: "errorMessage", group: "group", config: "config", items: "items" }, ngImport: i0, template: "<div class=\"govuk-form-group\" [formGroup]=\"group\"\n[ngClass]=\"{'govuk-form-group--error': errorMessage?.isInvalid}\">\n<xuilib-gov-label [config]=\"config\"></xuilib-gov-label>\n<span *ngIf=\"config.hint\" [id]=\"config.id +'-hint'\" class=\"govuk-hint\">\n {{config.hint}}\n</span>\n<xuilib-gov-uk-error-message [config]=\"config\" [errorMessage]=\"errorMessage\"></xuilib-gov-uk-error-message>\n\n<select class=\"govuk-select\"\n        [class.govuk-!-width-full]=\"config.fullWidth\"\n        [id]=\"config.id\" [name]=\"config.id\" [formControlName]=\"config.id\" [attr.aria-describedby]='setDescribedBy()'>\n  <option value=\"{{item.value}}\" *ngFor=\"let item of items\">{{item.label}}</option>\n</select>\n</div>\n", dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2$3.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i2$3.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i2$3.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { kind: "directive", type: i2$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2$3.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i2$3.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: GovUkLabelComponent, selector: "xuilib-gov-label", inputs: ["config"] }, { kind: "component", type: GovUkErrorMessageComponent, selector: " xuilib-gov-uk-error-message", inputs: ["config", "errorMessage"] }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: GovUkSelectComponent, decorators: [{
+GovUkSelectComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: GovUkSelectComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+GovUkSelectComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: GovUkSelectComponent, selector: "xuilib-gov-select", inputs: { errorMessage: "errorMessage", group: "group", config: "config", items: "items" }, ngImport: i0, template: "<div class=\"govuk-form-group\" [formGroup]=\"group\"\n[ngClass]=\"{'govuk-form-group--error': errorMessage?.isInvalid}\">\n<xuilib-gov-label [config]=\"config\"></xuilib-gov-label>\n<span *ngIf=\"config.hint\" [id]=\"config.id +'-hint'\" class=\"govuk-hint\">\n {{config.hint}}\n</span>\n<xuilib-gov-uk-error-message [config]=\"config\" [errorMessage]=\"errorMessage\"></xuilib-gov-uk-error-message>\n\n<select class=\"govuk-select\"\n        [class.govuk-!-width-full]=\"config.fullWidth\"\n        [id]=\"config.id\" [name]=\"config.id\" [formControlName]=\"config.id\" [attr.aria-describedby]='setDescribedBy()'>\n  <option value=\"{{item.value}}\" *ngFor=\"let item of items\">{{item.label}}</option>\n</select>\n</div>\n", dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2$3.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i2$3.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i2$3.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { kind: "directive", type: i2$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2$3.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i2$3.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: GovUkLabelComponent, selector: "xuilib-gov-label", inputs: ["config"] }, { kind: "component", type: GovUkErrorMessageComponent, selector: " xuilib-gov-uk-error-message", inputs: ["config", "errorMessage"] }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: GovUkSelectComponent, decorators: [{
             type: Component,
             args: [{ selector: 'xuilib-gov-select', template: "<div class=\"govuk-form-group\" [formGroup]=\"group\"\n[ngClass]=\"{'govuk-form-group--error': errorMessage?.isInvalid}\">\n<xuilib-gov-label [config]=\"config\"></xuilib-gov-label>\n<span *ngIf=\"config.hint\" [id]=\"config.id +'-hint'\" class=\"govuk-hint\">\n {{config.hint}}\n</span>\n<xuilib-gov-uk-error-message [config]=\"config\" [errorMessage]=\"errorMessage\"></xuilib-gov-uk-error-message>\n\n<select class=\"govuk-select\"\n        [class.govuk-!-width-full]=\"config.fullWidth\"\n        [id]=\"config.id\" [name]=\"config.id\" [formControlName]=\"config.id\" [attr.aria-describedby]='setDescribedBy()'>\n  <option value=\"{{item.value}}\" *ngFor=\"let item of items\">{{item.label}}</option>\n</select>\n</div>\n" }]
         }], ctorParameters: function () { return []; }, propDecorators: { errorMessage: [{
@@ -4512,10 +4545,10 @@ class GovukTableComponent {
     formatDate(date) {
         return formatDate(date, 'dd/MM/yyyy', 'en-UK');
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: GovukTableComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.7", type: GovukTableComponent, selector: "xuilib-gov-uk-table", inputs: { classes: "classes", caption: "caption", firstCellIsHeader: "firstCellIsHeader", rows: "rows", columnConfig: "columnConfig" }, ngImport: i0, template: "<table class=\"{{'govuk-table ' + classes}}\">\n    <caption class=\"govuk-table__caption\">{{caption}}</caption>\n    <thead class=\"govuk-table__head\" >\n    <tr class=\"govuk-table__row\">\n        <th class=\"govuk-table__header\" scope=\"col\" *ngFor=\"let h of columnConfig\">{{h.header}}</th>\n    </tr>\n    </thead>\n    <tbody class=\"govuk-table__body\">\n    <tr data-selector=\"table-row\" class=\"govuk-table__row\" *ngFor=\"let r of rows\">\n        <ng-container *ngFor=\"let col of columnConfig; first as isFirst\">\n            <th data-selector=\"table-header\" class=\"govuk-table__header\" scope=\"row\"  *ngIf=\"isFirst && firstCellIsHeader\">\n                <ng-container *ngIf=\"!col.type || col.type === 'text' || !r.routerLink\">{{r[col.key]}}</ng-container>\n                <ng-container *ngIf=\"col.type === 'link' && r.routerLink\">\n                    <a class=\"govuk-link\" [routerLink]=\"r.routerLink\">{{r[col.key]}}</a>\n                </ng-container>\n            </th>\n            <td data-selector=\"table-cell\" class=\"govuk-table__cell\"  *ngIf=\"!(isFirst && firstCellIsHeader)\">\n                <ng-container *ngIf=\"col.type === 'date'\">{{formatDate(r[col.key])}}</ng-container>\n                <ng-container *ngIf=\"!col.type || col.type === 'text' || !r.routerLink\">{{r[col.key]}}</ng-container>\n                <ng-container *ngIf=\"col.type === 'link' && r.routerLink\">\n                    <a class=\"govuk-link\" [routerLink]=\"r.routerLink\">{{r[col.key]}}</a>\n                </ng-container>\n            </td>\n        </ng-container>\n    </tr>\n    </tbody>\n</table>\n", styles: [""], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: GovukTableComponent, decorators: [{
+GovukTableComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: GovukTableComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+GovukTableComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: GovukTableComponent, selector: "xuilib-gov-uk-table", inputs: { classes: "classes", caption: "caption", firstCellIsHeader: "firstCellIsHeader", rows: "rows", columnConfig: "columnConfig" }, ngImport: i0, template: "<table class=\"{{'govuk-table ' + classes}}\">\n    <caption class=\"govuk-table__caption\">{{caption}}</caption>\n    <thead class=\"govuk-table__head\" >\n    <tr class=\"govuk-table__row\">\n        <th class=\"govuk-table__header\" scope=\"col\" *ngFor=\"let h of columnConfig\">{{h.header}}</th>\n    </tr>\n    </thead>\n    <tbody class=\"govuk-table__body\">\n    <tr data-selector=\"table-row\" class=\"govuk-table__row\" *ngFor=\"let r of rows\">\n        <ng-container *ngFor=\"let col of columnConfig; first as isFirst\">\n            <th data-selector=\"table-header\" class=\"govuk-table__header\" scope=\"row\"  *ngIf=\"isFirst && firstCellIsHeader\">\n                <ng-container *ngIf=\"!col.type || col.type === 'text' || !r.routerLink\">{{r[col.key]}}</ng-container>\n                <ng-container *ngIf=\"col.type === 'link' && r.routerLink\">\n                    <a class=\"govuk-link\" [routerLink]=\"r.routerLink\">{{r[col.key]}}</a>\n                </ng-container>\n            </th>\n            <td data-selector=\"table-cell\" class=\"govuk-table__cell\"  *ngIf=\"!(isFirst && firstCellIsHeader)\">\n                <ng-container *ngIf=\"col.type === 'date'\">{{formatDate(r[col.key])}}</ng-container>\n                <ng-container *ngIf=\"!col.type || col.type === 'text' || !r.routerLink\">{{r[col.key]}}</ng-container>\n                <ng-container *ngIf=\"col.type === 'link' && r.routerLink\">\n                    <a class=\"govuk-link\" [routerLink]=\"r.routerLink\">{{r[col.key]}}</a>\n                </ng-container>\n            </td>\n        </ng-container>\n    </tr>\n    </tbody>\n</table>\n", styles: [""], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: GovukTableComponent, decorators: [{
             type: Component,
             args: [{ selector: 'xuilib-gov-uk-table', template: "<table class=\"{{'govuk-table ' + classes}}\">\n    <caption class=\"govuk-table__caption\">{{caption}}</caption>\n    <thead class=\"govuk-table__head\" >\n    <tr class=\"govuk-table__row\">\n        <th class=\"govuk-table__header\" scope=\"col\" *ngFor=\"let h of columnConfig\">{{h.header}}</th>\n    </tr>\n    </thead>\n    <tbody class=\"govuk-table__body\">\n    <tr data-selector=\"table-row\" class=\"govuk-table__row\" *ngFor=\"let r of rows\">\n        <ng-container *ngFor=\"let col of columnConfig; first as isFirst\">\n            <th data-selector=\"table-header\" class=\"govuk-table__header\" scope=\"row\"  *ngIf=\"isFirst && firstCellIsHeader\">\n                <ng-container *ngIf=\"!col.type || col.type === 'text' || !r.routerLink\">{{r[col.key]}}</ng-container>\n                <ng-container *ngIf=\"col.type === 'link' && r.routerLink\">\n                    <a class=\"govuk-link\" [routerLink]=\"r.routerLink\">{{r[col.key]}}</a>\n                </ng-container>\n            </th>\n            <td data-selector=\"table-cell\" class=\"govuk-table__cell\"  *ngIf=\"!(isFirst && firstCellIsHeader)\">\n                <ng-container *ngIf=\"col.type === 'date'\">{{formatDate(r[col.key])}}</ng-container>\n                <ng-container *ngIf=\"!col.type || col.type === 'text' || !r.routerLink\">{{r[col.key]}}</ng-container>\n                <ng-container *ngIf=\"col.type === 'link' && r.routerLink\">\n                    <a class=\"govuk-link\" [routerLink]=\"r.routerLink\">{{r[col.key]}}</a>\n                </ng-container>\n            </td>\n        </ng-container>\n    </tr>\n    </tbody>\n</table>\n" }]
         }], ctorParameters: function () { return []; }, propDecorators: { classes: [{
@@ -4548,10 +4581,10 @@ class GovUkTextareaComponent {
     setDescribedBy() {
         return HtmlTemplatesHelper.setDescribedBy(this.errorMessage, this.config);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: GovUkTextareaComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.7", type: GovUkTextareaComponent, selector: "xuilib-gov-uk-textarea", inputs: { config: "config", errorMessage: "errorMessage", group: "group" }, ngImport: i0, template: "<div [formGroup]=\"group\" \nclass=\"govuk-form-group\" [ngClass]=\"{'govuk-form-group--error': errorMessage?.isInvalid}\">\n<xuilib-gov-label [config]=\"config\"></xuilib-gov-label>\n<span id=\"more-detail-hint\" class=\"govuk-hint\">\n  {{config.hint}}\n</span>\n<xuilib-gov-uk-error-message [config]=\"config\" [errorMessage]=\"errorMessage\"></xuilib-gov-uk-error-message>\n<textarea\n  class=\"govuk-textarea\" [formControlName]=\"config.key\"\n  [ngClass]=\"{'govuk-textarea--error': errorMessage?.isInvalid}\"\n  [id]=\"config.id\" name=\"more-detail\" [rows]=\"config.rows\" [attr.aria-describedby]=\"setDescribedBy()\"></textarea>\n</div>", dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2$3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2$3.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i2$3.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: GovUkLabelComponent, selector: "xuilib-gov-label", inputs: ["config"] }, { kind: "component", type: GovUkErrorMessageComponent, selector: " xuilib-gov-uk-error-message", inputs: ["config", "errorMessage"] }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: GovUkTextareaComponent, decorators: [{
+GovUkTextareaComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: GovUkTextareaComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+GovUkTextareaComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: GovUkTextareaComponent, selector: "xuilib-gov-uk-textarea", inputs: { config: "config", errorMessage: "errorMessage", group: "group" }, ngImport: i0, template: "<div [formGroup]=\"group\" \nclass=\"govuk-form-group\" [ngClass]=\"{'govuk-form-group--error': errorMessage?.isInvalid}\">\n<xuilib-gov-label [config]=\"config\"></xuilib-gov-label>\n<span id=\"more-detail-hint\" class=\"govuk-hint\">\n  {{config.hint}}\n</span>\n<xuilib-gov-uk-error-message [config]=\"config\" [errorMessage]=\"errorMessage\"></xuilib-gov-uk-error-message>\n<textarea\n  class=\"govuk-textarea\" [formControlName]=\"config.key\"\n  [ngClass]=\"{'govuk-textarea--error': errorMessage?.isInvalid}\"\n  [id]=\"config.id\" name=\"more-detail\" [rows]=\"config.rows\" [attr.aria-describedby]=\"setDescribedBy()\"></textarea>\n</div>", dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2$3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2$3.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i2$3.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: GovUkLabelComponent, selector: "xuilib-gov-label", inputs: ["config"] }, { kind: "component", type: GovUkErrorMessageComponent, selector: " xuilib-gov-uk-error-message", inputs: ["config", "errorMessage"] }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: GovUkTextareaComponent, decorators: [{
             type: Component,
             args: [{ selector: 'xuilib-gov-uk-textarea', template: "<div [formGroup]=\"group\" \nclass=\"govuk-form-group\" [ngClass]=\"{'govuk-form-group--error': errorMessage?.isInvalid}\">\n<xuilib-gov-label [config]=\"config\"></xuilib-gov-label>\n<span id=\"more-detail-hint\" class=\"govuk-hint\">\n  {{config.hint}}\n</span>\n<xuilib-gov-uk-error-message [config]=\"config\" [errorMessage]=\"errorMessage\"></xuilib-gov-uk-error-message>\n<textarea\n  class=\"govuk-textarea\" [formControlName]=\"config.key\"\n  [ngClass]=\"{'govuk-textarea--error': errorMessage?.isInvalid}\"\n  [id]=\"config.id\" name=\"more-detail\" [rows]=\"config.rows\" [attr.aria-describedby]=\"setDescribedBy()\"></textarea>\n</div>" }]
         }], propDecorators: { config: [{
@@ -4568,10 +4601,10 @@ class HmctsBannerComponent {
         this.showMessageIcon = false;
         this.messageBoldText = false;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: HmctsBannerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.7", type: HmctsBannerComponent, selector: "xuilib-hmcts-banner", inputs: { message: "message", type: "type", title: "title", showMessageIcon: "showMessageIcon", messageBoldText: "messageBoldText" }, ngImport: i0, template: "<ng-container *ngIf=\"message && type\">\n  <div *ngIf=\"title\"\n    class=\"hmcts-banner-title hmcts-banner-title--{{ type }}\">\n    {{ title }}\n  </div>\n  <div class=\"hmcts-banner hmcts-banner--{{ type }}\">\n    <ng-container *ngIf=\"showMessageIcon\">\n      <ng-container [ngSwitch]=\"type\">\n        <ng-container *ngSwitchCase=\"'warning'\">\n          <svg class=\"hmcts-banner__icon hmcts-banner__icon--warning\" fill=\"currentColor\" role=\"presentation\" focusable=\"false\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 25 25\" height=\"25\" width=\"25\">\n            <path d=\"M13.6,15.4h-2.3v-4.5h2.3V15.4z M13.6,19.8h-2.3v-2.2h2.3V19.8z M0,23.2h25L12.5,2L0,23.2z\"></path>\n          </svg>\n        </ng-container>\n        <ng-container *ngSwitchCase=\"'success'\">\n          <svg class=\"hmcts-banner__icon hmcts-banner__icon--success\" fill=\"currentColor\" role=\"presentation\" focusable=\"false\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 25 25\" height=\"25\" width=\"25\">\n            <path d=\"M25,6.2L8.7,23.2L0,14.1l4-4.2l4.7,4.9L21,2L25,6.2z\"></path>\n          </svg>\n        </ng-container>\n        <ng-container *ngSwitchCase=\"'information'\">\n          <svg class=\"hmcts-banner__icon hmcts-banner__icon--information\" fill=\"currentColor\" role=\"presentation\" focusable=\"false\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 25 25\" height=\"25\" width=\"25\">\n            <path d=\"M13.7,18.5h-2.4v-2.4h2.4V18.5z M12.5,13.7c-0.7,0-1.2-0.5-1.2-1.2V7.7c0-0.7,0.5-1.2,1.2-1.2s1.2,0.5,1.2,1.2v4.8\n  C13.7,13.2,13.2,13.7,12.5,13.7z M12.5,0.5c-6.6,0-12,5.4-12,12s5.4,12,12,12s12-5.4,12-12S19.1,0.5,12.5,0.5z\"></path>\n          </svg>\n        </ng-container>\n      </ng-container>\n    </ng-container>\n\n    <div class=\"hmcts-banner__message\" [class.hmcts-banner__message--bold]=\"messageBoldText\">\n      <span class=\"hmcts-banner__assistive\">{{ type }}</span>\n      <span class=\"hmcts-banner__message-text govuk-!-font-weight-bold\">{{ message }}</span>\n    </div>\n  </div>\n</ng-container>\n", styles: [".hmcts-banner-title{color:govuk-colour(\"white\");background-color:govuk-colour(\"blue\");font-weight:700;padding:10px 15px 5px}.hmcts-banner-title--success{background-color:govuk-colour(\"green\")}.hmcts-banner-title--warning{background-color:govuk-colour(\"red\")}.hmcts-banner__message--bold{font-weight:700}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i1.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: HmctsBannerComponent, decorators: [{
+HmctsBannerComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: HmctsBannerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+HmctsBannerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: HmctsBannerComponent, selector: "xuilib-hmcts-banner", inputs: { message: "message", type: "type", title: "title", showMessageIcon: "showMessageIcon", messageBoldText: "messageBoldText" }, ngImport: i0, template: "<ng-container *ngIf=\"message && type\">\n  <div *ngIf=\"title\"\n    class=\"hmcts-banner-title hmcts-banner-title--{{ type }}\">\n    {{ title }}\n  </div>\n  <div class=\"hmcts-banner hmcts-banner--{{ type }}\">\n    <ng-container *ngIf=\"showMessageIcon\">\n      <ng-container [ngSwitch]=\"type\">\n        <ng-container *ngSwitchCase=\"'warning'\">\n          <svg class=\"hmcts-banner__icon hmcts-banner__icon--warning\" fill=\"currentColor\" role=\"presentation\" focusable=\"false\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 25 25\" height=\"25\" width=\"25\">\n            <path d=\"M13.6,15.4h-2.3v-4.5h2.3V15.4z M13.6,19.8h-2.3v-2.2h2.3V19.8z M0,23.2h25L12.5,2L0,23.2z\"></path>\n          </svg>\n        </ng-container>\n        <ng-container *ngSwitchCase=\"'success'\">\n          <svg class=\"hmcts-banner__icon hmcts-banner__icon--success\" fill=\"currentColor\" role=\"presentation\" focusable=\"false\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 25 25\" height=\"25\" width=\"25\">\n            <path d=\"M25,6.2L8.7,23.2L0,14.1l4-4.2l4.7,4.9L21,2L25,6.2z\"></path>\n          </svg>\n        </ng-container>\n        <ng-container *ngSwitchCase=\"'information'\">\n          <svg class=\"hmcts-banner__icon hmcts-banner__icon--information\" fill=\"currentColor\" role=\"presentation\" focusable=\"false\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 25 25\" height=\"25\" width=\"25\">\n            <path d=\"M13.7,18.5h-2.4v-2.4h2.4V18.5z M12.5,13.7c-0.7,0-1.2-0.5-1.2-1.2V7.7c0-0.7,0.5-1.2,1.2-1.2s1.2,0.5,1.2,1.2v4.8\n  C13.7,13.2,13.2,13.7,12.5,13.7z M12.5,0.5c-6.6,0-12,5.4-12,12s5.4,12,12,12s12-5.4,12-12S19.1,0.5,12.5,0.5z\"></path>\n          </svg>\n        </ng-container>\n      </ng-container>\n    </ng-container>\n\n    <div class=\"hmcts-banner__message\" [class.hmcts-banner__message--bold]=\"messageBoldText\">\n      <span class=\"hmcts-banner__assistive\">{{ type }}</span>\n      <span class=\"hmcts-banner__message-text govuk-!-font-weight-bold\">{{ message }}</span>\n    </div>\n  </div>\n</ng-container>\n", styles: [".hmcts-banner-title{color:govuk-colour(\"white\");background-color:govuk-colour(\"blue\");font-weight:700;padding:10px 15px 5px}.hmcts-banner-title--success{background-color:govuk-colour(\"green\")}.hmcts-banner-title--warning{background-color:govuk-colour(\"red\")}.hmcts-banner__message--bold{font-weight:700}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i1.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: HmctsBannerComponent, decorators: [{
             type: Component,
             args: [{ selector: 'xuilib-hmcts-banner', template: "<ng-container *ngIf=\"message && type\">\n  <div *ngIf=\"title\"\n    class=\"hmcts-banner-title hmcts-banner-title--{{ type }}\">\n    {{ title }}\n  </div>\n  <div class=\"hmcts-banner hmcts-banner--{{ type }}\">\n    <ng-container *ngIf=\"showMessageIcon\">\n      <ng-container [ngSwitch]=\"type\">\n        <ng-container *ngSwitchCase=\"'warning'\">\n          <svg class=\"hmcts-banner__icon hmcts-banner__icon--warning\" fill=\"currentColor\" role=\"presentation\" focusable=\"false\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 25 25\" height=\"25\" width=\"25\">\n            <path d=\"M13.6,15.4h-2.3v-4.5h2.3V15.4z M13.6,19.8h-2.3v-2.2h2.3V19.8z M0,23.2h25L12.5,2L0,23.2z\"></path>\n          </svg>\n        </ng-container>\n        <ng-container *ngSwitchCase=\"'success'\">\n          <svg class=\"hmcts-banner__icon hmcts-banner__icon--success\" fill=\"currentColor\" role=\"presentation\" focusable=\"false\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 25 25\" height=\"25\" width=\"25\">\n            <path d=\"M25,6.2L8.7,23.2L0,14.1l4-4.2l4.7,4.9L21,2L25,6.2z\"></path>\n          </svg>\n        </ng-container>\n        <ng-container *ngSwitchCase=\"'information'\">\n          <svg class=\"hmcts-banner__icon hmcts-banner__icon--information\" fill=\"currentColor\" role=\"presentation\" focusable=\"false\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 25 25\" height=\"25\" width=\"25\">\n            <path d=\"M13.7,18.5h-2.4v-2.4h2.4V18.5z M12.5,13.7c-0.7,0-1.2-0.5-1.2-1.2V7.7c0-0.7,0.5-1.2,1.2-1.2s1.2,0.5,1.2,1.2v4.8\n  C13.7,13.2,13.2,13.7,12.5,13.7z M12.5,0.5c-6.6,0-12,5.4-12,12s5.4,12,12,12s12-5.4,12-12S19.1,0.5,12.5,0.5z\"></path>\n          </svg>\n        </ng-container>\n      </ng-container>\n    </ng-container>\n\n    <div class=\"hmcts-banner__message\" [class.hmcts-banner__message--bold]=\"messageBoldText\">\n      <span class=\"hmcts-banner__assistive\">{{ type }}</span>\n      <span class=\"hmcts-banner__message-text govuk-!-font-weight-bold\">{{ message }}</span>\n    </div>\n  </div>\n</ng-container>\n", styles: [".hmcts-banner-title{color:govuk-colour(\"white\");background-color:govuk-colour(\"blue\");font-weight:700;padding:10px 15px 5px}.hmcts-banner-title--success{background-color:govuk-colour(\"green\")}.hmcts-banner-title--warning{background-color:govuk-colour(\"red\")}.hmcts-banner__message--bold{font-weight:700}\n"] }]
         }], propDecorators: { message: [{
@@ -4587,14 +4620,14 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.7", ngImpor
             }] } });
 
 class HmctsIdentityBarComponent {
+    constructor() { }
     set content(value) {
         this.value = value.name;
     }
-    constructor() { }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: HmctsIdentityBarComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.7", type: HmctsIdentityBarComponent, selector: "xuilib-hmcts-identity-bar", inputs: { content: "content" }, ngImport: i0, template: "<div class=\"hmcts-identity-bar\" *ngIf=\"value\">\n\n    <div class=\"hmcts-identity-bar__container\">\n\n        <div class=\"hmcts-identity-bar__details\">\n        \n            <span class=\"hmcts-identity-bar__title\">{{value}}</span>\n        \n        </div>        \n\n    </div>\n\n</div>", styles: [""], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: HmctsIdentityBarComponent, decorators: [{
+HmctsIdentityBarComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: HmctsIdentityBarComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+HmctsIdentityBarComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: HmctsIdentityBarComponent, selector: "xuilib-hmcts-identity-bar", inputs: { content: "content" }, ngImport: i0, template: "<div class=\"hmcts-identity-bar\" *ngIf=\"value\">\n\n    <div class=\"hmcts-identity-bar__container\">\n\n        <div class=\"hmcts-identity-bar__details\">\n        \n            <span class=\"hmcts-identity-bar__title\">{{value}}</span>\n        \n        </div>        \n\n    </div>\n\n</div>", styles: [""], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: HmctsIdentityBarComponent, decorators: [{
             type: Component,
             args: [{ selector: 'xuilib-hmcts-identity-bar', template: "<div class=\"hmcts-identity-bar\" *ngIf=\"value\">\n\n    <div class=\"hmcts-identity-bar__container\">\n\n        <div class=\"hmcts-identity-bar__details\">\n        \n            <span class=\"hmcts-identity-bar__title\">{{value}}</span>\n        \n        </div>        \n\n    </div>\n\n</div>" }]
         }], ctorParameters: function () { return []; }, propDecorators: { content: [{
@@ -4611,22 +4644,22 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.7", ngImpor
 * @prop back link, title (title), summaryErrors (array of errors)
 * */
 class HmctsMainWrapperComponent {
-    set banner(value) {
-        this.bannerData = value;
-    }
     constructor() {
         this.backEvent = new EventEmitter();
     }
+    set banner(value) {
+        this.bannerData = value;
+    }
     ngOnInit() {
         this.hasBackLink = this.backLink !== undefined || this.backEvent.observers.length > 0;
     }
     onGoBack() {
         this.backEvent.emit();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: HmctsMainWrapperComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.7", type: HmctsMainWrapperComponent, selector: "xuilib-hmcts-main-wrapper", inputs: { backLink: "backLink", title: "title", summaryErrors: "summaryErrors", banner: "banner", actionButtons: "actionButtons", showWarningMessage: "showWarningMessage" }, outputs: { backEvent: "backEvent" }, ngImport: i0, template: "<a *ngIf=\"hasBackLink\" [routerLink]=\"backLink\" (click)=\"onGoBack()\" class=\"govuk-back-link\">Back</a>\n<main id=\"content\" role=\"main\" class=\"govuk-main-wrapper\">\n  <div class=\"govuk-grid-row\">\n    <div class=\"govuk-grid-column-two-thirds\">\n      <xuilib-hmcts-error-summary\n        *ngIf=\"summaryErrors && !summaryErrors.isFromValid\"\n        [errorMessages]=\"summaryErrors.items\"\n        [header]=\"summaryErrors.header\"\n        [showWarningMessage]=\"showWarningMessage\">\n      </xuilib-hmcts-error-summary>\n      <xuilib-hmcts-banner *ngIf=\"bannerData\"\n                           [type]=\"bannerData.type\"\n                           [message]=\"bannerData.message\"\n      ></xuilib-hmcts-banner>\n      <h1 *ngIf=\"title\" class=\"govuk-heading-xl\">{{title}}</h1>\n      <ng-content></ng-content>\n    </div>\n    <div class=\"govuk-grid-column-one-third\" *ngIf=\"actionButtons?.length > 0\">\n      <div class=\"hmcts-page-heading__actions-wrapper\">\n        <a\n          *ngFor=\"let actionButton of actionButtons\"\n          (click)=\"actionButton.action()\"\n          role=\"button\"\n          draggable=\"false\"\n          class=\"govuk-button {{ actionButton.class }}\"\n        >{{ actionButton.name }}</a>\n      </div>\n    </div>\n  </div>\n</main>\n", dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "component", type: HmctsErrorSummaryComponent, selector: "xuilib-hmcts-error-summary", inputs: ["errorMessages", "header", "showWarningMessage"] }, { kind: "component", type: HmctsBannerComponent, selector: "xuilib-hmcts-banner", inputs: ["message", "type", "title", "showMessageIcon", "messageBoldText"] }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: HmctsMainWrapperComponent, decorators: [{
+HmctsMainWrapperComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: HmctsMainWrapperComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+HmctsMainWrapperComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: HmctsMainWrapperComponent, selector: "xuilib-hmcts-main-wrapper", inputs: { backLink: "backLink", title: "title", summaryErrors: "summaryErrors", banner: "banner", actionButtons: "actionButtons", showWarningMessage: "showWarningMessage" }, outputs: { backEvent: "backEvent" }, ngImport: i0, template: "<a *ngIf=\"hasBackLink\" [routerLink]=\"backLink\" (click)=\"onGoBack()\" class=\"govuk-back-link\">Back</a>\n<main id=\"content\" role=\"main\" class=\"govuk-main-wrapper\">\n  <div class=\"govuk-grid-row\">\n    <div class=\"govuk-grid-column-two-thirds\">\n      <xuilib-hmcts-error-summary\n        *ngIf=\"summaryErrors && !summaryErrors.isFromValid\"\n        [errorMessages]=\"summaryErrors.items\"\n        [header]=\"summaryErrors.header\"\n        [showWarningMessage]=\"showWarningMessage\">\n      </xuilib-hmcts-error-summary>\n      <xuilib-hmcts-banner *ngIf=\"bannerData\"\n                           [type]=\"bannerData.type\"\n                           [message]=\"bannerData.message\"\n      ></xuilib-hmcts-banner>\n      <h1 *ngIf=\"title\" class=\"govuk-heading-xl\">{{title}}</h1>\n      <ng-content></ng-content>\n    </div>\n    <div class=\"govuk-grid-column-one-third\" *ngIf=\"actionButtons?.length > 0\">\n      <div class=\"hmcts-page-heading__actions-wrapper\">\n        <a\n          *ngFor=\"let actionButton of actionButtons\"\n          (click)=\"actionButton.action()\"\n          role=\"button\"\n          draggable=\"false\"\n          class=\"govuk-button {{ actionButton.class }}\"\n        >{{ actionButton.name }}</a>\n      </div>\n    </div>\n  </div>\n</main>\n", dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "component", type: HmctsErrorSummaryComponent, selector: "xuilib-hmcts-error-summary", inputs: ["errorMessages", "header", "showWarningMessage"] }, { kind: "component", type: HmctsBannerComponent, selector: "xuilib-hmcts-banner", inputs: ["message", "type", "title", "showMessageIcon", "messageBoldText"] }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: HmctsMainWrapperComponent, decorators: [{
             type: Component,
             args: [{ selector: 'xuilib-hmcts-main-wrapper', template: "<a *ngIf=\"hasBackLink\" [routerLink]=\"backLink\" (click)=\"onGoBack()\" class=\"govuk-back-link\">Back</a>\n<main id=\"content\" role=\"main\" class=\"govuk-main-wrapper\">\n  <div class=\"govuk-grid-row\">\n    <div class=\"govuk-grid-column-two-thirds\">\n      <xuilib-hmcts-error-summary\n        *ngIf=\"summaryErrors && !summaryErrors.isFromValid\"\n        [errorMessages]=\"summaryErrors.items\"\n        [header]=\"summaryErrors.header\"\n        [showWarningMessage]=\"showWarningMessage\">\n      </xuilib-hmcts-error-summary>\n      <xuilib-hmcts-banner *ngIf=\"bannerData\"\n                           [type]=\"bannerData.type\"\n                           [message]=\"bannerData.message\"\n      ></xuilib-hmcts-banner>\n      <h1 *ngIf=\"title\" class=\"govuk-heading-xl\">{{title}}</h1>\n      <ng-content></ng-content>\n    </div>\n    <div class=\"govuk-grid-column-one-third\" *ngIf=\"actionButtons?.length > 0\">\n      <div class=\"hmcts-page-heading__actions-wrapper\">\n        <a\n          *ngFor=\"let actionButton of actionButtons\"\n          (click)=\"actionButton.action()\"\n          role=\"button\"\n          draggable=\"false\"\n          class=\"govuk-button {{ actionButton.class }}\"\n        >{{ actionButton.name }}</a>\n      </div>\n    </div>\n  </div>\n</main>\n" }]
         }], ctorParameters: function () { return []; }, propDecorators: { backLink: [{
@@ -4645,47 +4678,16 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.7", ngImpor
                 type: Output
             }] } });
 
-class HmctsPaginationComponent {
+class HmctsPrimaryNavigationComponent {
     constructor() {
-        this.maxSize = 7;
-        this.pageSize = 10;
-        this.showPageNumbers = true;
-        this.showResultCount = true;
-        this.pageChange = new EventEmitter();
-        this.pageBoundsCorrection = new EventEmitter();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: HmctsPaginationComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.7", type: HmctsPaginationComponent, selector: "xuilib-hmcts-pagination", inputs: { id: "id", maxSize: "maxSize", pageSize: "pageSize", showPageNumbers: "showPageNumbers", showResultCount: "showResultCount" }, outputs: { pageChange: "pageChange", pageBoundsCorrection: "pageBoundsCorrection" }, ngImport: i0, template: "<!-- pagination-template #p=\"paginationApi\" [id]=\"id\" [maxSize]=\"maxSize\" (pageChange)=\"pageChange.emit($event)\"\n  (pageBoundsCorrection)=\"pageBoundsCorrection.emit($event)\">\n\n  <nav class=\"hmcts-pagination\" id=\"pagination-label\">\n    <p class=\"govuk-visually-hidden\" aria-labelledby=\"pagination-label\">Pagination navigation</p>\n    <ul class=\"hmcts-pagination__list\" *ngIf=\"!(p.pages.length <= 1)\">\n\n      <li class=\"hmcts-pagination__item  hmcts-pagination__item--prev\" [class.disabled]=\"p.isFirstPage()\">\n        <a [routerLink]=\"[][]\" class=\"hmcts-pagination__link\" *ngIf=\"1 < p.getCurrent()\" (keyup.enter)=\"p.previous()\"\n          (click)=\"p.previous()\">Previous <span class=\"govuk-visually-hidden\">set of pages</span></a>\n      </li>\n\n      <ng-container *ngIf=\"showPageNumbers\">\n        <li class=\"hmcts-pagination__item\" [class.hmcts-pagination__item--active]=\"p.getCurrent() === page.value\"\n          [class.hmcts-pagination__item--dots]=\"page.label === '...'\" *ngFor=\"let page of p.pages\">\n          <a class=\"hmcts-pagination__link\" [routerLink]=\"[][]\" (keyup.enter)=\"p.setCurrent(page.value)\"\n            (click)=\"p.setCurrent(page.value)\" *ngIf=\"p.getCurrent() !== page.value\">\n            <span class=\"govuk-visually-hidden\">page </span>\n            <span>{{ (page.label === '...') ? page.label : (page.label | number:'') }}</span>\n          </a>\n          <ng-container *ngIf=\"p.getCurrent() === page.value\">\n            <span>{{ (page.label === '...') ? page.label : (page.label | number:'') }}</span>\n          </ng-container>\n        </li>\n      </ng-container>\n\n      <li class=\"hmcts-pagination__item  hmcts-pagination__item--next\" [class.disabled]=\"p.isLastPage()\">\n        <a [routerLink]=\"[][]\" class=\"hmcts-pagination__link\" *ngIf=\"!p.isLastPage()\" (keyup.enter)=\"p.next()\"\n          (click)=\"p.next()\">Next<span class=\"govuk-visually-hidden\"> page</span></a>\n      </li>\n\n    </ul>\n    <p class=\"hmcts-pagination__results\" *ngIf=\"showResultCount\">Showing <b>{{(p.getCurrent() * pageSize) - pageSize + 1}}</b>\n      to <b>{{ p.getCurrent() * pageSize > p.getTotalItems() ? p.getTotalItems() : p.getCurrent() *\n        pageSize}}</b> of <b>{{p.getTotalItems()}}</b> results</p>\n  </nav>\n\n</pagination-template -->\n", styles: [".hmcts-pagination__results{float:right}\n"] }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: HmctsPaginationComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'xuilib-hmcts-pagination', template: "<!-- pagination-template #p=\"paginationApi\" [id]=\"id\" [maxSize]=\"maxSize\" (pageChange)=\"pageChange.emit($event)\"\n  (pageBoundsCorrection)=\"pageBoundsCorrection.emit($event)\">\n\n  <nav class=\"hmcts-pagination\" id=\"pagination-label\">\n    <p class=\"govuk-visually-hidden\" aria-labelledby=\"pagination-label\">Pagination navigation</p>\n    <ul class=\"hmcts-pagination__list\" *ngIf=\"!(p.pages.length <= 1)\">\n\n      <li class=\"hmcts-pagination__item  hmcts-pagination__item--prev\" [class.disabled]=\"p.isFirstPage()\">\n        <a [routerLink]=\"[][]\" class=\"hmcts-pagination__link\" *ngIf=\"1 < p.getCurrent()\" (keyup.enter)=\"p.previous()\"\n          (click)=\"p.previous()\">Previous <span class=\"govuk-visually-hidden\">set of pages</span></a>\n      </li>\n\n      <ng-container *ngIf=\"showPageNumbers\">\n        <li class=\"hmcts-pagination__item\" [class.hmcts-pagination__item--active]=\"p.getCurrent() === page.value\"\n          [class.hmcts-pagination__item--dots]=\"page.label === '...'\" *ngFor=\"let page of p.pages\">\n          <a class=\"hmcts-pagination__link\" [routerLink]=\"[][]\" (keyup.enter)=\"p.setCurrent(page.value)\"\n            (click)=\"p.setCurrent(page.value)\" *ngIf=\"p.getCurrent() !== page.value\">\n            <span class=\"govuk-visually-hidden\">page </span>\n            <span>{{ (page.label === '...') ? page.label : (page.label | number:'') }}</span>\n          </a>\n          <ng-container *ngIf=\"p.getCurrent() === page.value\">\n            <span>{{ (page.label === '...') ? page.label : (page.label | number:'') }}</span>\n          </ng-container>\n        </li>\n      </ng-container>\n\n      <li class=\"hmcts-pagination__item  hmcts-pagination__item--next\" [class.disabled]=\"p.isLastPage()\">\n        <a [routerLink]=\"[][]\" class=\"hmcts-pagination__link\" *ngIf=\"!p.isLastPage()\" (keyup.enter)=\"p.next()\"\n          (click)=\"p.next()\">Next<span class=\"govuk-visually-hidden\"> page</span></a>\n      </li>\n\n    </ul>\n    <p class=\"hmcts-pagination__results\" *ngIf=\"showResultCount\">Showing <b>{{(p.getCurrent() * pageSize) - pageSize + 1}}</b>\n      to <b>{{ p.getCurrent() * pageSize > p.getTotalItems() ? p.getTotalItems() : p.getCurrent() *\n        pageSize}}</b> of <b>{{p.getTotalItems()}}</b> results</p>\n  </nav>\n\n</pagination-template -->\n", styles: [".hmcts-pagination__results{float:right}\n"] }]
-        }], propDecorators: { id: [{
-                type: Input
-            }], maxSize: [{
-                type: Input
-            }], pageSize: [{
-                type: Input
-            }], showPageNumbers: [{
-                type: Input
-            }], showResultCount: [{
-                type: Input
-            }], pageChange: [{
-                type: Output
-            }], pageBoundsCorrection: [{
-                type: Output
-            }] } });
-
-class HmctsPrimaryNavigationComponent {
     set userLoggedIn(value) {
         this.isUserLoggedIn = value;
     }
-    constructor() {
-    }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: HmctsPrimaryNavigationComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.7", type: HmctsPrimaryNavigationComponent, selector: "xuilib-hmcts-primary-navigation", inputs: { userLoggedIn: "userLoggedIn", label: "label", items: "items", isBrandedHeader: "isBrandedHeader" }, ngImport: i0, template: "<nav *ngIf=\"isUserLoggedIn\" class=\"hmcts-primary-navigation\" [attr.aria-label]=\"label\">\n  <div class=\"hmcts-primary-navigation__container\">\n    <div class=\"govuk-header__logo\" *ngIf=\"isBrandedHeader\"></div>\n    <ul class=\"hmcts-primary-navigation__list\">\n      <li class=\"hmcts-primary-navigation__item\"  *ngFor=\"let item of items\">\n          <a class=\"hmcts-primary-navigation__link\" [attr.aria-current]=\"item.active ? true: null\" [routerLink]=\"item.href\" [innerHTML]=\"item.text\"></a>\n      </li>\n    </ul>\n  </div>\n</nav>\n", styles: [""], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: HmctsPrimaryNavigationComponent, decorators: [{
+HmctsPrimaryNavigationComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: HmctsPrimaryNavigationComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+HmctsPrimaryNavigationComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: HmctsPrimaryNavigationComponent, selector: "xuilib-hmcts-primary-navigation", inputs: { userLoggedIn: "userLoggedIn", label: "label", items: "items", isBrandedHeader: "isBrandedHeader" }, ngImport: i0, template: "<nav *ngIf=\"isUserLoggedIn\" class=\"hmcts-primary-navigation\" [attr.aria-label]=\"label\">\n  <div class=\"hmcts-primary-navigation__container\">\n    <div class=\"govuk-header__logo\" *ngIf=\"isBrandedHeader\"></div>\n    <ul class=\"hmcts-primary-navigation__list\">\n      <li class=\"hmcts-primary-navigation__item\"  *ngFor=\"let item of items\">\n          <a class=\"hmcts-primary-navigation__link\" [attr.aria-current]=\"item.active ? true: null\" [routerLink]=\"item.href\" [innerHTML]=\"item.text\"></a>\n      </li>\n    </ul>\n  </div>\n</nav>\n", styles: [""], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: HmctsPrimaryNavigationComponent, decorators: [{
             type: Component,
             args: [{ selector: 'xuilib-hmcts-primary-navigation', template: "<nav *ngIf=\"isUserLoggedIn\" class=\"hmcts-primary-navigation\" [attr.aria-label]=\"label\">\n  <div class=\"hmcts-primary-navigation__container\">\n    <div class=\"govuk-header__logo\" *ngIf=\"isBrandedHeader\"></div>\n    <ul class=\"hmcts-primary-navigation__list\">\n      <li class=\"hmcts-primary-navigation__item\"  *ngFor=\"let item of items\">\n          <a class=\"hmcts-primary-navigation__link\" [attr.aria-current]=\"item.active ? true: null\" [routerLink]=\"item.href\" [innerHTML]=\"item.text\"></a>\n      </li>\n    </ul>\n  </div>\n</nav>\n" }]
         }], ctorParameters: function () { return []; }, propDecorators: { userLoggedIn: [{
@@ -4699,10 +4701,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.7", ngImpor
             }] } });
 
 class HmctsSubNavigationComponent {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: HmctsSubNavigationComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.7", type: HmctsSubNavigationComponent, selector: "xuilib-hmcts-sub-navigation", inputs: { label: "label", items: "items" }, ngImport: i0, template: "<nav class=\"hmcts-sub-navigation\" attr.aria-label=\"{{label}}\" role=\"navigation\" *ngIf=\"items\">\n    <ul class=\"hmcts-sub-navigation__list\">\n        <li class=\"hmcts-sub-navigation__item\" *ngFor=\"let item of items\">\n            <a data-selector=\"sub-nav-link\" class=\"hmcts-sub-navigation__link\" [routerLink]=\"item.href\"\n               [attr.aria-current]=\"item.active ? 'page' : null\">\n                {{item.text}}\n\n                <span *ngIf=\"item.roundel && item.roundel > 0 \" class=\"xui-alert-link__number\"> {{item.roundel}} </span>\n            </a>\n        </li>\n    </ul>\n</nav>\n", styles: [".xui-alert-link__number{font-family:nta,Arial,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-weight:400;font-size:14px;font-size:.875rem;line-height:1.78571;border-radius:50%;background-color:#1d70b8;color:#fff;font-weight:700;width:25px;height:25px;margin-left:5px;text-align:center;display:inline-block;text-decoration:none}\n"], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: HmctsSubNavigationComponent, decorators: [{
+HmctsSubNavigationComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: HmctsSubNavigationComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+HmctsSubNavigationComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: HmctsSubNavigationComponent, selector: "xuilib-hmcts-sub-navigation", inputs: { label: "label", items: "items" }, ngImport: i0, template: "<nav class=\"hmcts-sub-navigation\" attr.aria-label=\"{{label}}\" role=\"navigation\" *ngIf=\"items\">\n    <ul class=\"hmcts-sub-navigation__list\">\n        <li class=\"hmcts-sub-navigation__item\" *ngFor=\"let item of items\">\n            <a data-selector=\"sub-nav-link\" class=\"hmcts-sub-navigation__link\" [routerLink]=\"item.href\"\n               [attr.aria-current]=\"item.active ? 'page' : null\">\n                {{item.text}}\n\n                <span *ngIf=\"item.roundel && item.roundel > 0 \" class=\"xui-alert-link__number\"> {{item.roundel}} </span>\n            </a>\n        </li>\n    </ul>\n</nav>\n", styles: [".xui-alert-link__number{font-family:nta,Arial,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-weight:400;font-size:14px;font-size:.875rem;line-height:1.78571;border-radius:50%;background-color:#1d70b8;color:#fff;font-weight:700;width:25px;height:25px;margin-left:5px;text-align:center;display:inline-block;text-decoration:none}\n"], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: HmctsSubNavigationComponent, decorators: [{
             type: Component,
             args: [{ selector: 'xuilib-hmcts-sub-navigation', template: "<nav class=\"hmcts-sub-navigation\" attr.aria-label=\"{{label}}\" role=\"navigation\" *ngIf=\"items\">\n    <ul class=\"hmcts-sub-navigation__list\">\n        <li class=\"hmcts-sub-navigation__item\" *ngFor=\"let item of items\">\n            <a data-selector=\"sub-nav-link\" class=\"hmcts-sub-navigation__link\" [routerLink]=\"item.href\"\n               [attr.aria-current]=\"item.active ? 'page' : null\">\n                {{item.text}}\n\n                <span *ngIf=\"item.roundel && item.roundel > 0 \" class=\"xui-alert-link__number\"> {{item.roundel}} </span>\n            </a>\n        </li>\n    </ul>\n</nav>\n", styles: [".xui-alert-link__number{font-family:nta,Arial,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-weight:400;font-size:14px;font-size:.875rem;line-height:1.78571;border-radius:50%;background-color:#1d70b8;color:#fff;font-weight:700;width:25px;height:25px;margin-left:5px;text-align:center;display:inline-block;text-decoration:none}\n"] }]
         }], propDecorators: { label: [{
@@ -4778,137 +4780,139 @@ const pipes = [
     CapitalizePipe
 ];
 class ExuiCommonLibModule {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: ExuiCommonLibModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "16.1.7", ngImport: i0, type: ExuiCommonLibModule, declarations: [ExuiPageWrapperComponent,
-            TermsAndConditionsComponent,
-            TcDisplayHtmlComponent,
-            TcDisplayPlainComponent,
-            TcConfirmComponent,
-            ContactDetailsComponent,
-            FeatureToggleDirective,
-            LetDirective,
-            HmctsSessionDialogComponent,
-            UserListComponent,
-            UserDetailsComponent,
-            InviteUserPermissionComponent,
-            InviteUserFormComponent,
-            ShareCaseComponent,
-            ShareCaseConfirmComponent,
-            SelectedCaseListComponent,
-            SelectedCaseComponent,
-            SelectedCaseConfirmComponent,
-            UserSelectComponent,
-            TabComponent,
-            AccessibilityComponent,
-            DueDateComponent,
-            CheckboxListComponent,
-            ServiceMessageComponent,
-            ServiceMessagesComponent,
-            LoadingSpinnerComponent,
-            GenericFilterComponent,
-            CookieBannerComponent,
-            FindPersonComponent,
-            SearchJudicialsComponent,
-            FindLocationComponent,
-            FindTaskNameComponent,
-            SearchLocationComponent,
-            FindServiceComponent,
-            SearchServiceComponent,
-            SearchVenueComponent,
-            PaginationComponent, HmctsIdentityBarComponent,
-            HmctsPaginationComponent,
-            HmctsSubNavigationComponent,
-            HmctsPrimaryNavigationComponent,
-            HmctsErrorSummaryComponent,
-            HmctsMainWrapperComponent,
-            HmctsBannerComponent,
-            GovukTableComponent,
-            GovUkInputComponent,
-            GovUkCheckboxComponent,
-            GovUkFormGroupWrapperComponent,
-            GovUkLabelComponent,
-            GovUkErrorMessageComponent,
-            GovUkFieldsetComponent,
-            GovUkDateComponent,
-            GovUkCheckboxesComponent,
-            GovUkRadioComponent,
-            GovUkRadiosComponent,
-            GovUkSelectComponent,
-            GovUkTextareaComponent,
-            GovUkFileUploadComponent,
-            RemoveHostDirective, CapitalizePipe], imports: [CommonModule,
-            FormsModule,
-            ReactiveFormsModule, i2.RouterModule, MatLegacyAutocompleteModule,
-            MatLegacyTabsModule,
-            MatLegacyInputModule], exports: [ExuiPageWrapperComponent,
-            TermsAndConditionsComponent,
-            TcDisplayHtmlComponent,
-            TcDisplayPlainComponent,
-            TcConfirmComponent,
-            ContactDetailsComponent,
-            FeatureToggleDirective,
-            LetDirective,
-            HmctsSessionDialogComponent,
-            UserListComponent,
-            UserDetailsComponent,
-            InviteUserPermissionComponent,
-            InviteUserFormComponent,
-            ShareCaseComponent,
-            ShareCaseConfirmComponent,
-            SelectedCaseListComponent,
-            SelectedCaseComponent,
-            SelectedCaseConfirmComponent,
-            UserSelectComponent,
-            TabComponent,
-            AccessibilityComponent,
-            DueDateComponent,
-            CheckboxListComponent,
-            ServiceMessageComponent,
-            ServiceMessagesComponent,
-            LoadingSpinnerComponent,
-            GenericFilterComponent,
-            CookieBannerComponent,
-            FindPersonComponent,
-            SearchJudicialsComponent,
-            FindLocationComponent,
-            FindTaskNameComponent,
-            SearchLocationComponent,
-            FindServiceComponent,
-            SearchServiceComponent,
-            SearchVenueComponent,
-            PaginationComponent, HmctsIdentityBarComponent,
-            HmctsPaginationComponent,
-            HmctsSubNavigationComponent,
-            HmctsPrimaryNavigationComponent,
-            HmctsErrorSummaryComponent,
-            HmctsMainWrapperComponent,
-            HmctsBannerComponent,
-            GovukTableComponent,
-            GovUkInputComponent,
-            GovUkCheckboxComponent,
-            GovUkFormGroupWrapperComponent,
-            GovUkLabelComponent,
-            GovUkErrorMessageComponent,
-            GovUkFieldsetComponent,
-            GovUkDateComponent,
-            GovUkCheckboxesComponent,
-            GovUkRadioComponent,
-            GovUkRadiosComponent,
-            GovUkSelectComponent,
-            GovUkTextareaComponent,
-            GovUkFileUploadComponent,
-            RemoveHostDirective, CapitalizePipe] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: ExuiCommonLibModule, providers: [
-            { provide: windowToken, useFactory: windowProvider }
-        ], imports: [CommonModule,
-            FormsModule,
-            ReactiveFormsModule,
-            RouterModule.forChild([]),
-            MatLegacyAutocompleteModule,
-            MatLegacyTabsModule,
-            MatLegacyInputModule] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: ExuiCommonLibModule, decorators: [{
+ExuiCommonLibModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: ExuiCommonLibModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+ExuiCommonLibModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.9", ngImport: i0, type: ExuiCommonLibModule, declarations: [ExuiPageWrapperComponent,
+        TermsAndConditionsComponent,
+        TcDisplayHtmlComponent,
+        TcDisplayPlainComponent,
+        TcConfirmComponent,
+        ContactDetailsComponent,
+        FeatureToggleDirective,
+        LetDirective,
+        HmctsSessionDialogComponent,
+        UserListComponent,
+        UserDetailsComponent,
+        InviteUserPermissionComponent,
+        InviteUserFormComponent,
+        ShareCaseComponent,
+        ShareCaseConfirmComponent,
+        SelectedCaseListComponent,
+        SelectedCaseComponent,
+        SelectedCaseConfirmComponent,
+        UserSelectComponent,
+        TabComponent,
+        AccessibilityComponent,
+        DueDateComponent,
+        CheckboxListComponent,
+        ServiceMessageComponent,
+        ServiceMessagesComponent,
+        LoadingSpinnerComponent,
+        GenericFilterComponent,
+        CookieBannerComponent,
+        FindPersonComponent,
+        SearchJudicialsComponent,
+        FindLocationComponent,
+        FindTaskNameComponent,
+        SearchLocationComponent,
+        FindServiceComponent,
+        SearchServiceComponent,
+        SearchVenueComponent,
+        PaginationComponent, HmctsIdentityBarComponent,
+        HmctsPaginationComponent,
+        HmctsSubNavigationComponent,
+        HmctsPrimaryNavigationComponent,
+        HmctsErrorSummaryComponent,
+        HmctsMainWrapperComponent,
+        HmctsBannerComponent,
+        GovukTableComponent,
+        GovUkInputComponent,
+        GovUkCheckboxComponent,
+        GovUkFormGroupWrapperComponent,
+        GovUkLabelComponent,
+        GovUkErrorMessageComponent,
+        GovUkFieldsetComponent,
+        GovUkDateComponent,
+        GovUkCheckboxesComponent,
+        GovUkRadioComponent,
+        GovUkRadiosComponent,
+        GovUkSelectComponent,
+        GovUkTextareaComponent,
+        GovUkFileUploadComponent,
+        RemoveHostDirective, CapitalizePipe], imports: [CommonModule,
+        FormsModule,
+        ReactiveFormsModule, i2.RouterModule, MatLegacyAutocompleteModule,
+        MatLegacyTabsModule,
+        MatLegacyInputModule,
+        NgxPaginationModule], exports: [ExuiPageWrapperComponent,
+        TermsAndConditionsComponent,
+        TcDisplayHtmlComponent,
+        TcDisplayPlainComponent,
+        TcConfirmComponent,
+        ContactDetailsComponent,
+        FeatureToggleDirective,
+        LetDirective,
+        HmctsSessionDialogComponent,
+        UserListComponent,
+        UserDetailsComponent,
+        InviteUserPermissionComponent,
+        InviteUserFormComponent,
+        ShareCaseComponent,
+        ShareCaseConfirmComponent,
+        SelectedCaseListComponent,
+        SelectedCaseComponent,
+        SelectedCaseConfirmComponent,
+        UserSelectComponent,
+        TabComponent,
+        AccessibilityComponent,
+        DueDateComponent,
+        CheckboxListComponent,
+        ServiceMessageComponent,
+        ServiceMessagesComponent,
+        LoadingSpinnerComponent,
+        GenericFilterComponent,
+        CookieBannerComponent,
+        FindPersonComponent,
+        SearchJudicialsComponent,
+        FindLocationComponent,
+        FindTaskNameComponent,
+        SearchLocationComponent,
+        FindServiceComponent,
+        SearchServiceComponent,
+        SearchVenueComponent,
+        PaginationComponent, HmctsIdentityBarComponent,
+        HmctsPaginationComponent,
+        HmctsSubNavigationComponent,
+        HmctsPrimaryNavigationComponent,
+        HmctsErrorSummaryComponent,
+        HmctsMainWrapperComponent,
+        HmctsBannerComponent,
+        GovukTableComponent,
+        GovUkInputComponent,
+        GovUkCheckboxComponent,
+        GovUkFormGroupWrapperComponent,
+        GovUkLabelComponent,
+        GovUkErrorMessageComponent,
+        GovUkFieldsetComponent,
+        GovUkDateComponent,
+        GovUkCheckboxesComponent,
+        GovUkRadioComponent,
+        GovUkRadiosComponent,
+        GovUkSelectComponent,
+        GovUkTextareaComponent,
+        GovUkFileUploadComponent,
+        RemoveHostDirective, PaginatePipe, CapitalizePipe] });
+ExuiCommonLibModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: ExuiCommonLibModule, providers: [
+        { provide: windowToken, useFactory: windowProvider }
+    ], imports: [CommonModule,
+        FormsModule,
+        ReactiveFormsModule,
+        RouterModule.forChild([]),
+        MatLegacyAutocompleteModule,
+        MatLegacyTabsModule,
+        MatLegacyInputModule,
+        NgxPaginationModule] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: ExuiCommonLibModule, decorators: [{
             type: NgModule,
             args: [{
                     declarations: [
@@ -4923,7 +4927,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.7", ngImpor
                         RouterModule.forChild([]),
                         MatLegacyAutocompleteModule,
                         MatLegacyTabsModule,
-                        MatLegacyInputModule
+                        MatLegacyInputModule,
+                        NgxPaginationModule
                     ],
                     providers: [
                         { provide: windowToken, useFactory: windowProvider }
@@ -4931,6 +4936,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.7", ngImpor
                     exports: [
                         ...COMMON_COMPONENTS,
                         ...GOV_UI_COMPONENTS,
+                        PaginatePipe,
                         ...pipes
                     ]
                 }]
@@ -4938,10 +4944,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.7", ngImpor
 
 class GovUiService {
     constructor() { }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: GovUiService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: GovUiService, providedIn: 'root' }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: GovUiService, decorators: [{
+GovUiService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: GovUiService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+GovUiService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: GovUiService, providedIn: 'root' });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: GovUiService, decorators: [{
             type: Injectable,
             args: [{
                     providedIn: 'root'