@dubai-design-system/components-js 3.12.2-alpha.0 → 3.12.4

package/dist/collection/assets/img/icn/icn-card-facebook.svg

@@ -1,11 +1,11 @@
-<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
-<g clip-path="url(#clip0_15250_281)">
-<path d="M20 10C20 4.47715 15.5229 0 10 0C4.47715 0 0 4.47715 0 10C0 14.9912 3.65684 19.1283 8.4375 19.8785V12.8906H5.89844V10H8.4375V7.79688C8.4375 5.29063 9.93047 3.90625 12.2146 3.90625C13.3084 3.90625 14.4531 4.10156 14.4531 4.10156V6.5625H13.1922C11.95 6.5625 11.5625 7.3334 11.5625 8.125V10H14.3359L13.8926 12.8906H11.5625V19.8785C16.3432 19.1283 20 14.9912 20 10Z" fill="black"/>
-<path d="M13.8926 12.8906L14.3359 10H11.5625V8.125C11.5625 7.33418 11.95 6.5625 13.1922 6.5625H14.4531V4.10156C14.4531 4.10156 13.3088 3.90625 12.2146 3.90625C9.93047 3.90625 8.4375 5.29063 8.4375 7.79688V10H5.89844V12.8906H8.4375V19.8785C9.47287 20.0405 10.5271 20.0405 11.5625 19.8785V12.8906H13.8926Z" fill="white"/>
-</g>
-<defs>
-<clipPath id="clip0_15250_281">
-<rect width="20" height="20" fill="white"/>
-</clipPath>
-</defs>
-</svg>
+<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g clip-path="url(#clip0_15250_281)">
+<path d="M20 10C20 4.47715 15.5229 0 10 0C4.47715 0 0 4.47715 0 10C0 14.9912 3.65684 19.1283 8.4375 19.8785V12.8906H5.89844V10H8.4375V7.79688C8.4375 5.29063 9.93047 3.90625 12.2146 3.90625C13.3084 3.90625 14.4531 4.10156 14.4531 4.10156V6.5625H13.1922C11.95 6.5625 11.5625 7.3334 11.5625 8.125V10H14.3359L13.8926 12.8906H11.5625V19.8785C16.3432 19.1283 20 14.9912 20 10Z" fill="black"/>
+<path d="M13.8926 12.8906L14.3359 10H11.5625V8.125C11.5625 7.33418 11.95 6.5625 13.1922 6.5625H14.4531V4.10156C14.4531 4.10156 13.3088 3.90625 12.2146 3.90625C9.93047 3.90625 8.4375 5.29063 8.4375 7.79688V10H5.89844V12.8906H8.4375V19.8785C9.47287 20.0405 10.5271 20.0405 11.5625 19.8785V12.8906H13.8926Z" fill="white"/>
+</g>
+<defs>
+<clipPath id="clip0_15250_281">
+<rect width="20" height="20" fill="white"/>
+</clipPath>
+</defs>
+</svg>

package/dist/collection/assets/img/icn/icn-card-linkdin.svg

@@ -1,4 +1,4 @@
-<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path d="M-0.00012207 1.43266C-0.00012207 0.641875 0.661909 0 1.478 0H18.5218C19.3382 0 19.9999 0.641875 19.9999 1.43266V18.5676C19.9999 19.3586 19.3382 20 18.5218 20H1.478C0.661987 20 -0.00012207 19.3587 -0.00012207 18.5678V1.43242V1.43266Z" fill="black"/>
-<path d="M6.07767 16.7374V7.73329H3.08485V16.7374H6.07798H6.07767ZM4.58188 6.50415C5.62532 6.50415 6.27493 5.81274 6.27493 4.94868C6.2554 4.06493 5.62532 3.39282 4.60173 3.39282C3.57743 3.39282 2.90845 4.06493 2.90845 4.9486C2.90845 5.81267 3.55782 6.50407 4.56228 6.50407H4.58165L4.58188 6.50415ZM7.73423 16.7374H10.7268V11.7096C10.7268 11.4409 10.7463 11.1714 10.8254 10.9795C11.0416 10.4416 11.5341 9.88478 12.361 9.88478C13.4437 9.88478 13.877 10.7104 13.877 11.9209V16.7374H16.8695V11.5747C16.8695 8.80915 15.3933 7.5222 13.4243 7.5222C11.81 7.5222 11.101 8.42446 10.7071 9.03899H10.727V7.7336H7.73438C7.77345 8.57829 7.73415 16.7377 7.73415 16.7377L7.73423 16.7374Z" fill="white"/>
-</svg>
+<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M-0.00012207 1.43266C-0.00012207 0.641875 0.661909 0 1.478 0H18.5218C19.3382 0 19.9999 0.641875 19.9999 1.43266V18.5676C19.9999 19.3586 19.3382 20 18.5218 20H1.478C0.661987 20 -0.00012207 19.3587 -0.00012207 18.5678V1.43242V1.43266Z" fill="black"/>
+<path d="M6.07767 16.7374V7.73329H3.08485V16.7374H6.07798H6.07767ZM4.58188 6.50415C5.62532 6.50415 6.27493 5.81274 6.27493 4.94868C6.2554 4.06493 5.62532 3.39282 4.60173 3.39282C3.57743 3.39282 2.90845 4.06493 2.90845 4.9486C2.90845 5.81267 3.55782 6.50407 4.56228 6.50407H4.58165L4.58188 6.50415ZM7.73423 16.7374H10.7268V11.7096C10.7268 11.4409 10.7463 11.1714 10.8254 10.9795C11.0416 10.4416 11.5341 9.88478 12.361 9.88478C13.4437 9.88478 13.877 10.7104 13.877 11.9209V16.7374H16.8695V11.5747C16.8695 8.80915 15.3933 7.5222 13.4243 7.5222C11.81 7.5222 11.101 8.42446 10.7071 9.03899H10.727V7.7336H7.73438C7.77345 8.57829 7.73415 16.7377 7.73415 16.7377L7.73423 16.7374Z" fill="white"/>
+</svg>

package/dist/collection/assets/img/icn/icn-card-telegram.svg

@@ -1,11 +1,11 @@
-<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
-<g clip-path="url(#clip0_15250_290)">
-<path d="M10 20C15.5228 20 20 15.5228 20 10C20 4.47715 15.5228 0 10 0C4.47715 0 0 4.47715 0 10C0 15.5228 4.47715 20 10 20Z" fill="black"/>
-<path fill-rule="evenodd" clip-rule="evenodd" d="M4.52666 9.89446C7.44186 8.62435 9.38579 7.78702 10.3584 7.38246C13.1355 6.22737 13.7126 6.02672 14.0887 6.02009C14.1714 6.01863 14.3564 6.03913 14.4762 6.13635C14.5774 6.21844 14.6052 6.32934 14.6185 6.40717C14.6319 6.485 14.6484 6.6623 14.6353 6.80083C14.4848 8.38207 13.8336 12.2193 13.5023 13.9903C13.3621 14.7397 13.0861 14.991 12.8189 15.0155C12.2382 15.069 11.7972 14.6318 11.2348 14.2631C10.3546 13.6861 9.85741 13.327 9.00309 12.764C8.01578 12.1134 8.65581 11.7558 9.21848 11.1714C9.36573 11.0184 11.9244 8.69115 11.9739 8.48002C11.9801 8.45362 11.9859 8.3552 11.9274 8.30323C11.8689 8.25125 11.7826 8.26903 11.7203 8.28316C11.6321 8.3032 10.226 9.23252 7.50228 11.0711C7.10319 11.3452 6.7417 11.4787 6.41782 11.4717C6.06077 11.464 5.37395 11.2698 4.86336 11.1039C4.23711 10.9003 3.73938 10.7927 3.78272 10.4469C3.8053 10.2669 4.05328 10.0827 4.52666 9.89446Z" fill="white"/>
-</g>
-<defs>
-<clipPath id="clip0_15250_290">
-<rect width="20" height="20" fill="white"/>
-</clipPath>
-</defs>
-</svg>
+<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g clip-path="url(#clip0_15250_290)">
+<path d="M10 20C15.5228 20 20 15.5228 20 10C20 4.47715 15.5228 0 10 0C4.47715 0 0 4.47715 0 10C0 15.5228 4.47715 20 10 20Z" fill="black"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M4.52666 9.89446C7.44186 8.62435 9.38579 7.78702 10.3584 7.38246C13.1355 6.22737 13.7126 6.02672 14.0887 6.02009C14.1714 6.01863 14.3564 6.03913 14.4762 6.13635C14.5774 6.21844 14.6052 6.32934 14.6185 6.40717C14.6319 6.485 14.6484 6.6623 14.6353 6.80083C14.4848 8.38207 13.8336 12.2193 13.5023 13.9903C13.3621 14.7397 13.0861 14.991 12.8189 15.0155C12.2382 15.069 11.7972 14.6318 11.2348 14.2631C10.3546 13.6861 9.85741 13.327 9.00309 12.764C8.01578 12.1134 8.65581 11.7558 9.21848 11.1714C9.36573 11.0184 11.9244 8.69115 11.9739 8.48002C11.9801 8.45362 11.9859 8.3552 11.9274 8.30323C11.8689 8.25125 11.7826 8.26903 11.7203 8.28316C11.6321 8.3032 10.226 9.23252 7.50228 11.0711C7.10319 11.3452 6.7417 11.4787 6.41782 11.4717C6.06077 11.464 5.37395 11.2698 4.86336 11.1039C4.23711 10.9003 3.73938 10.7927 3.78272 10.4469C3.8053 10.2669 4.05328 10.0827 4.52666 9.89446Z" fill="white"/>
+</g>
+<defs>
+<clipPath id="clip0_15250_290">
+<rect width="20" height="20" fill="white"/>
+</clipPath>
+</defs>
+</svg>

package/dist/collection/assets/img/icn/icn-card-twitter-x.svg

@@ -1,10 +1,10 @@
-<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
-<g clip-path="url(#clip0_15250_277)">
-<path d="M10 0C15.5228 5.15406e-07 20 4.47715 20 10C20 15.5228 15.5228 20 10 20C4.47715 20 5.15422e-07 15.5228 0 10C0 4.47715 4.47715 0 10 0ZM8.62012 10.5977L3.80957 15.7939H4.89258L9.10352 11.2441L12.5059 15.7939H16.1904L11.1416 9.04297L15.6182 4.20605H14.5361L10.6572 8.39648L7.52441 4.20605H3.83984L8.62012 10.5977ZM14.5977 14.9961H12.9053L5.43164 5.00391H7.12402L14.5977 14.9961Z" fill="#40484F"/>
-</g>
-<defs>
-<clipPath id="clip0_15250_277">
-<rect width="20" height="20" fill="white"/>
-</clipPath>
-</defs>
-</svg>
+<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g clip-path="url(#clip0_15250_277)">
+<path d="M10 0C15.5228 5.15406e-07 20 4.47715 20 10C20 15.5228 15.5228 20 10 20C4.47715 20 5.15422e-07 15.5228 0 10C0 4.47715 4.47715 0 10 0ZM8.62012 10.5977L3.80957 15.7939H4.89258L9.10352 11.2441L12.5059 15.7939H16.1904L11.1416 9.04297L15.6182 4.20605H14.5361L10.6572 8.39648L7.52441 4.20605H3.83984L8.62012 10.5977ZM14.5977 14.9961H12.9053L5.43164 5.00391H7.12402L14.5977 14.9961Z" fill="#40484F"/>
+</g>
+<defs>
+<clipPath id="clip0_15250_277">
+<rect width="20" height="20" fill="white"/>
+</clipPath>
+</defs>
+</svg>

package/dist/collection/components/dda-header/dda-header-main.css

@@ -490,6 +490,7 @@ ul.main_side_menu li a i {
 
 
 ul.main_side_menu li a:hover,
+ul.main_side_menu li a.active,
 ul.main_side_menu li a.icon_arrow {
     color: var(--dda-color-primary-40);
     border-bottom: solid 2px var(--dda-color-primary-40);

package/dist/collection/components/dda-header/dda-header.js

@@ -306,11 +306,18 @@ export class DdaHeader {
     }
     render() {
         const sideMenuItems = this.parseJsonArray(this.sideMenuItems);
-        return (h("header", { key: '1fca1fcbbe53b183bebbea63511d49941bcc1829', class: 'dda-header' }, h("div", { key: 'c8e021f105e9ea33f10a2cb8c645eeb206948249', class: "dda-head-logo" }, h("a", { key: '675d6670b3d825a31e8272127d81f8d780b602eb', href: this.useNavigator == 'true' ? 'javascript:void(0)' : this.firstLogoHref, onClick: () => (this.useNavigator == 'true' ? this.navigatorClick.emit(this.firstLogoHref) : ''), class: "govt-logo" }, h("img", { key: '2e544626f004f3c293fa292c38914df101e81c56', class: "logo-white", src: this.firstLogoWhiteSrc, alt: `${this.firstLogoAlt} White` }), h("img", { key: 'af78a622ee93523d802bfe7f94f39de02c39376b', class: "logo-colored", src: this.firstLogoSrc, alt: this.firstLogoAlt })), h("a", { key: '5d0b97e7cee5d2522a4fee0efeb688eae8ce1bf1', href: this.useNavigator == 'true' ? 'javascript:void(0)' : this.secondLogoHref, onClick: () => (this.useNavigator == 'true' ? this.navigatorClick.emit(this.secondLogoHref) : ''), class: "entt-logo" }, h("img", { key: '5413b41729179c539ceb8d3248071749fe35e042', class: "logo-white", src: this.secondLogoWhiteSrc, alt: `${this.secondLogoAlt} White` }), h("img", { key: 'f42309e1fbef68101c5cc432e3f1b10c872d5bd5', class: "logo-colored", src: this.secondLogoSrc, alt: this.secondLogoAlt }))), h("div", { key: 'afbbfdeb22b496a7d3cf59d17a0d63af450eee18', class: "dda-menu-container" }, h("div", { key: '6537bf009c9c0725c32045f9fde94264d8e717c4', class: "dda-main-navigation" }, h("div", { key: '796dccf7561faefd40e09c69c8a2478d707785a8', class: `dda-menu-overley ${this.isMenuOpen ? 'show-overley' : ''}`, onClick: this.toggleMenu }), h("div", { key: '7762dc1eb2408f2a274844efd842d1e606bd8909', class: "hamburger-menu", onClick: this.toggleMenu }, h("dda-tooltip", { key: '8c31ad87a163f8a0e351a38177beec91e1e4a9e6', title_text: this.hamburger_menu_button_name, position: "top", class: "dda-d-block" }, h("button", { key: '2aa59266e75a589e24cd43b512b57fb8555b4727', type: "button", class: "hamburger-menu-btn", name: this.hamburger_menu_button_name }, h("span", { key: '6c1598b94a5a014ed0db314f39b493600f241c90', class: "hamburger-line" }), h("span", { key: 'f205824bd55fb989743406749e26c32f4f366487', class: "hamburger-menu-text" }, this.hamburger_menu_button_name)))), h("div", { key: 'f7221895b85857c9dac1e2054dc86bf32c5f11d8', class: "dda-sidemenu", style: { display: this.isMenuOpen ? 'block' : '', insetInlineStart: this.isMenuOpen ? '0px' : '' } }, h("div", { key: 'bfe5ac8cf062cb8a80a25a04accf8142d33a5020', class: "dda-sidemenu-content" }, h("h6", { key: 'eef284c7f6e579ebade512b18ce1fd57b18814c7', class: "dda-side-nav-title" }, this.sideMainMenuTitle), h("ul", { key: 'f276f046cf8c057f9c3e11e72ba31c96a0be7879', class: "main_side_menu" }, sideMenuItems.map((menu, index) => {
+        return (h("header", { key: '320bb6c50e7b88b6b4cb21ecfef032d191b1ceaf', class: 'dda-header' }, h("div", { key: 'b9dc390cf2f78361c907587076afa6a280b965c4', class: "dda-head-logo" }, h("a", { key: 'cec2479d2cfa6ca99d23db53bc98a466b1d2f9b4', href: this.useNavigator == 'true' ? 'javascript:void(0)' : this.firstLogoHref, onClick: () => (this.useNavigator == 'true' ? this.navigatorClick.emit(this.firstLogoHref) : ''), class: "govt-logo" }, h("img", { key: '7f54c29ceee32fd999579f348af0c65c435da84d', class: "logo-white", src: this.firstLogoWhiteSrc, alt: `${this.firstLogoAlt} White` }), h("img", { key: '76edcbdb5ea1f87d34b6542c57245722aa5ca3ff', class: "logo-colored", src: this.firstLogoSrc, alt: this.firstLogoAlt })), h("a", { key: 'c7b14f22807d07889ee5f5a535dc53c4ad6bc39c', href: this.useNavigator == 'true' ? 'javascript:void(0)' : this.secondLogoHref, onClick: () => (this.useNavigator == 'true' ? this.navigatorClick.emit(this.secondLogoHref) : ''), class: "entt-logo" }, h("img", { key: 'f0a94fe0c472e9b07e80d8b798279de859dfa849', class: "logo-white", src: this.secondLogoWhiteSrc, alt: `${this.secondLogoAlt} White` }), h("img", { key: 'd0fe3ae7fae1b52fe722d4b4918c66f878ca9d47', class: "logo-colored", src: this.secondLogoSrc, alt: this.secondLogoAlt }))), h("div", { key: '1f99a3635cdd4b5a0e237636c8d9c1de7866575b', class: "dda-menu-container" }, h("div", { key: '61b2f9fa7fa7b785c7b704ecefe3fc25810330b0', class: "dda-main-navigation" }, h("div", { key: 'a806db8b53d7656cc3443149f472695fcf4d4dd2', class: `dda-menu-overley ${this.isMenuOpen ? 'show-overley' : ''}`, onClick: this.toggleMenu }), h("div", { key: '13ef90fd6e160587806b8c71f52bae47b9d4ced3', class: "hamburger-menu", onClick: this.toggleMenu }, h("dda-tooltip", { key: 'bd5df176d359039da5a796de55cf31d35debf56b', title_text: this.hamburger_menu_button_name, position: "top", class: "dda-d-block" }, h("button", { key: 'c6b26754e52e8b96cf848c05d19b3ad8dfe6f9cf', type: "button", class: "hamburger-menu-btn", name: this.hamburger_menu_button_name }, h("span", { key: '823258e0d23f138541f5efd7770f299dcded3e96', class: "hamburger-line" }), h("span", { key: '10b6deed2384e7140a4d745da369f1f1fbca1f23', class: "hamburger-menu-text" }, this.hamburger_menu_button_name)))), h("div", { key: '96fa55ffff63de37635cd0cfc739b4d882326206', class: "dda-sidemenu", style: { display: this.isMenuOpen ? 'block' : '', insetInlineStart: this.isMenuOpen ? '0px' : '' } }, h("div", { key: '65f7729f0b2d7a826bdd68befb12e7b343dfb99f', class: "dda-sidemenu-content" }, h("h6", { key: '5f95515ab2d4c2da0902b0f567e14cef37c24d9f', class: "dda-side-nav-title" }, this.sideMainMenuTitle), h("ul", { key: '06fa6cfc285874ca162518a9d2d82a7d70be9858', class: "main_side_menu" }, sideMenuItems.map((menu, index) => {
             const currentIndex = `menu-${index}`;
             return (h("li", { key: currentIndex, id: `header_${menu.label}` }, h("a", {
                 // href={menu.href}
-                href: this.useNavigator == 'true' ? 'javascript:void(0)' : menu.href, class: menu.subMenu && menu.subMenu.length > 0 ? 'showSub' : '', onClick: e => {
+                href: this.useNavigator == 'true' ? 'javascript:void(0)' : menu.href,
+                // class={menu.subMenu && menu.subMenu.length > 0 ? 'showSub' : ''}
+                class: [
+                    menu.subMenu && menu.subMenu.length > 0 ? 'showSub' : '',
+                    menu.active === 'true' ? 'active' : ''
+                ]
+                    .filter(Boolean)
+                    .join(' '), onClick: e => {
                     if (menu.subMenu && menu.subMenu.length > 0) {
                         e.preventDefault();
                         const current = e.currentTarget;
@@ -335,15 +342,17 @@ export class DdaHeader {
                     }
                 }
             }, menu.label), this.renderSubMenu(menu.subMenu, currentIndex)));
-        })), this.hideOtherMenu == false && h("h6", { key: 'b1e3eb7d957d7e5059ca53f75c1e1322c87c7af2', class: "dda-side-nav-title" }, this.sideOtherMenuTitle), !this.hideOtherMenu && (h("ul", { key: 'ae51db104eabf9f87e7a0fbf58ed9d385e2576cd', class: "main_side_menu" }, this.parsedOtherMenuItems.map((itemlist, index) => (h("li", { key: `other-${index}` }, h("a", { href: this.useNavigator == 'true' ? 'javascript:void(0)' : itemlist.href, onClick: () => (this.useNavigator == 'true' ? this.navigatorClick.emit(itemlist.href) : '') }, itemlist.label))))))), h("div", { key: 'bbb5da52a89b1c71658e1cf444ce5b7df1b396eb', class: "dda-sidemenu-bottom" }, h("div", { key: 'a2860706eb59902599242ae899032dd3e457afe8', class: "dda-sidemenu-gov-logo" }, h("a", { key: 'f26cb6e1445af7cb7b39919e3c70237ea7afc834', href: this.useNavigator == 'true' ? 'javascript:void(0)' : this.firstLogoHref, onClick: () => (this.useNavigator == 'true' ? this.navigatorClick.emit(this.firstLogoHref) : ''), class: "govt-logo dda-mb-2" }, h("img", { key: '8cba96b1a2db8224f84437187f87e87732258a27', class: "", src: this.firstLogoSrc, alt: this.firstLogoAlt }))), h("div", { key: 'cae57e2e2bfa1a7f2702b4fd9bc4f28a61c8f4eb', class: "dda-toolbar-menu-sidemenu" }, h("ul", { key: 'c3b8cc3dce4dab1df1db0a340f2e1f030e4d15c2' }, this.accessibility_button_id && (h("li", { key: '94f3f17f55aaf53ff71b4ae90e57d45bf2739c2e' }, h("button", { key: '01f1d2214f704c18d488c0aa38ad816f056266ac', name: this.toggle_accessibility_button_name, class: "tool-btn accessibility-btn", type: "button", onClick: this.toggleMobileAccessibilty, id: this.accessibility_button_id }, h("i", { key: '4007025d708498a646074b2f31b2664c95e31def', class: this.accessibility_button_icon_family }, this.accessibility_button_icon_name), h("span", { key: 'bee544b1736e6d9363d4ace94f55a886e6dacdc2', class: "visually-hidden" }, this.accessibility_button_text)))), this.language_text && (h("li", { key: '05161959e65d6d4601100941928ccc53805117d6' }, h("button", { key: '410ef2c2eb38590d855db462256c4a761f27da37', name: this.language_button_name, class: "tool-btn", type: "button", onClick: this.languagehandler }, this.language_text))), this.loginText && (h("li", { key: '2e3dd997a2350bdc73cb9a9edf86a41bb5af963e' }, h("dda-link-button", { key: 'c8737e5925a49c403ef30b8bbd7cb72279f3bce2', button_color: "onsurface-secondary", start_icon: this.loginIcon, custom_class: "tool-btn login-button", link_button_text: this.loginText, onClick: this.toggleLogin,
+        })), this.hideOtherMenu == false && h("h6", { key: '741a87ec2773bfd4599d9dbdf8b7bbfc66644f80', class: "dda-side-nav-title" }, this.sideOtherMenuTitle), !this.hideOtherMenu && (h("ul", { key: 'ad3037fc41ad60202e38f38d08b113368326f698', class: "main_side_menu" }, this.parsedOtherMenuItems.map((itemlist, index) => (h("li", { key: `other-${index}` }, h("a", { href: this.useNavigator == 'true' ? 'javascript:void(0)' : itemlist.href, class: {
+                active: itemlist['active'] === 'true',
+            }, onClick: () => (this.useNavigator == 'true' ? this.navigatorClick.emit(itemlist.href) : '') }, itemlist.label))))))), h("div", { key: 'b4a6bad345a6c30469714a12c1ac0e08a36d0232', class: "dda-sidemenu-bottom" }, h("div", { key: '89d304f277b2fdb2477d9a57080c094ae9d92265', class: "dda-sidemenu-gov-logo" }, h("a", { key: '827000661949876ee2ef140665243ee3e5cd3571', href: this.useNavigator == 'true' ? 'javascript:void(0)' : this.firstLogoHref, onClick: () => (this.useNavigator == 'true' ? this.navigatorClick.emit(this.firstLogoHref) : ''), class: "govt-logo dda-mb-2" }, h("img", { key: '420d364a247b50cbeb590338bde2203e54797ee4', class: "", src: this.firstLogoSrc, alt: this.firstLogoAlt }))), h("div", { key: 'c791779a7b204b807c9ed497717a3e91c1835439', class: "dda-toolbar-menu-sidemenu" }, h("ul", { key: '91cb1fd161897559a85eb632d2d77c7d5ca49c7d' }, this.accessibility_button_id && (h("li", { key: '927a4045d6ee032c3b95d0c7a19e300cadf0c6b9' }, h("button", { key: '4af8d8eed00a40ed281b8efc81281ea62baaa3f6', name: this.toggle_accessibility_button_name, class: "tool-btn accessibility-btn", type: "button", onClick: this.toggleMobileAccessibilty, id: this.accessibility_button_id }, h("i", { key: '0bd5daf86009b0a6f895b1a56974e5c36a50ec7e', class: this.accessibility_button_icon_family }, this.accessibility_button_icon_name), h("span", { key: 'd702a07e54f3ba8800880b5883a457a39ab081f6', class: "visually-hidden" }, this.accessibility_button_text)))), this.language_text && (h("li", { key: '93f6a4161a7a960ee94144bb5474f5f76d4b28d0' }, h("button", { key: '3cd59d02e08967a810b4cc9b20a76ec1b4ead1ba', name: this.language_button_name, class: "tool-btn", type: "button", onClick: this.languagehandler }, this.language_text))), this.loginText && (h("li", { key: '2d93126df5228944ce934ab3b06e396cb4699b69' }, h("dda-link-button", { key: '19c32bb297878743d379bfebb2972d3888e854bc', button_color: "onsurface-secondary", start_icon: this.loginIcon, custom_class: "tool-btn login-button", link_button_text: this.loginText, onClick: this.toggleLogin,
             // href={this.loginLink}
-            href: this.useLoginPopup ? 'javascript:void(0)' : this.loginLink, button_shape: "circle", size: "sm" })))))), h("button", { key: 'fbaef5b1cbfa692e5416fac68bd552966e1ba62b', type: "button", name: this.close_menu_button_name, class: "close-btn side-nav-close-btn", "aria-label": "Close Sidebar", onClick: this.toggleMenu }, h("i", { key: '05391aa8f089d03a0fcadc03baa8c03861210335', class: "material-icons  material-symbols-outlined", "aria-hidden": "true" }, "close")), this.usePredesignedAccessibilityMenu ? (h("div", { class: "dda-accessibility hide-accessibility mobile-accessibility", style: { display: this.isMobileAccessibiltyOpen ? 'block' : 'none' } }, h("div", { class: "mobile-accessibility-content" }, h("div", { class: "dda-row" }, h("div", { class: "dda-col-md-4 dda-accessibility-item" }, h("h6", { class: "h6 Regular dda-mb-1" }, this.contrast_title), h("form", null, h("fieldset", { class: "dda-theme-list" }, h("legend", null, h("p", { class: "body Regular dda-mb-3" }, this.contrast_description)), this.contrast_noraml_text ? (h("dda-radiobutton", { title_text: this.contrast_noraml_text, checked: this.selected_contrast == 'normal', size: "default", variants: "normal", supporting: "", error_message: "", validation_id: "NormalThemeMobile", group_name: "themeselectionMobile", input_id: "NormalThemeMobile", custom_class: "", component_mode: "", aria_label: "radio-button", validation_type: "normal", onChange: this.normalContrasthandler, class: "hydrated" })) : null, this.contrast_color_blind_text ? (h("dda-radiobutton", { title_text: this.contrast_color_blind_text, checked: this.selected_contrast == 'colorblind', size: "default", variants: "normal", supporting: "", error_message: "", validation_id: "ColoursBlindMobile", group_name: "themeselectionMobile", input_id: "ColoursBlindMobile", custom_class: "", component_mode: "", aria_label: "radio-button", validation_type: "normal", onChange: this.blindContrasthandler, class: "hydrated" })) : null, this.contrast_red_weakness_text ? (h("dda-radiobutton", { title_text: this.contrast_red_weakness_text, checked: this.selected_contrast == 'redweakness', size: "default", variants: "normal", supporting: "", error_message: "", validation_id: "RedWeaknessMobile", group_name: "themeselectionMobile", input_id: "RedWeaknessMobile", custom_class: "", component_mode: "", aria_label: "radio-button", validation_type: "normal", onChange: this.redContrasthandler, class: "hydrated" })) : null, this.contrast_green_weakness_text ? (h("dda-radiobutton", { title_text: this.contrast_green_weakness_text, checked: this.selected_contrast == 'greenweakness', size: "default", variants: "normal", supporting: "", error_message: "", validation_id: "GreenWeaknessMobile", group_name: "themeselectionMobile", input_id: "GreenWeaknessMobile", custom_class: "", component_mode: "", aria_label: "radio-button", validation_type: "normal", onChange: this.greenContrasthandler, class: "hydrated" })) : null))), h("div", { class: "dda-col-md-4 dda-accessibility-item" }, h("h6", { class: "h6 Regular dda-mb-1" }, this.screen_reader_title), h("p", { class: "body Regular dda-mb-3" }, this.screen_reader_description), h("div", { class: "rs_skip rsbtn rs_preserve rs_mobile", id: "readspeaker_button1" }, h("a", { rel: "nofollow", href: this.read_speaker_link, role: "button", class: "rsbtn_play circle readspeaker", accessKey: "L", "aria-label": "Listen to this page using ReadSpeaker", "data-rsshortcut": "play", "aria-haspopup": "menu", "data-rs-lang": "en_uk" }, h("i", { class: "material-icons  material-symbols-outlined", "aria-hidden": "true" }, "volume_up")))), h("div", { class: "dda-col-md-4 dda-accessibility-item" }, h("h6", { class: "h6 Regular dda-mb-1" }, this.text_size_title), h("p", { class: "body Regular dda-mb-3" }, this.text_size_description), h("div", { class: "dda-d-flex dda-gap-4" }, h("dda-button", { button_color: this.selected_text_size == 'normal' ? 'default-primary' : 'default-secondary', button_text: "A", icon_button_shape: "circle", custom_class: "", size: "lg", onClick: this.baseTexthandler }), h("dda-button", { button_color: this.selected_text_size == 'large' ? 'default-primary' : 'default-secondary', button_text: "A+", icon_button_shape: "circle", custom_class: "", size: "lg", onClick: this.lgTexthandler }), h("dda-button", { button_color: this.selected_text_size == 'small' ? 'default-primary' : 'default-secondary', button_text: "A-", icon_button_shape: "circle", custom_class: "", size: "lg", onClick: this.smTexthandler }))))), h("button", { type: "button", name: this.close_accessibility_button_name, class: "close-btn close_accessibility", "aria-label": "Close Accessibility", onClick: this.toggleMobileAccessibilty }, h("i", { class: "material-icons  material-symbols-outlined", "aria-hidden": "true" }, "close")))) : null), this.quickLinks && (h("dda-header-menu", { key: '7ab3529adb6e2650e7367dd56832c830d0931c75', "use-navigator": this.useNavigator, "navigator-click": this.navigatorClick, "show-Quick-Links-Icon": this.showQuickLinksIcon, "quick-links": typeof this.quickLinks === 'string' ? this.quickLinks : JSON.stringify(this.quickLinks) }))), h("div", { key: 'c25b82b57acc40c07d3bbed1467788aa27dbe601', class: "dda-mobile-entt-logo" }, h("a", { key: '47920b93875d655c58af890416b02c78210e93ea', href: this.useNavigator == 'true' ? 'javascript:void(0)' : this.secondLogoHref, onClick: () => (this.useNavigator == 'true' ? this.navigatorClick.emit(this.secondLogoHref) : ''), class: "entt-logo" }, h("img", { key: '13dc2f84ee16b5e6d72d595d0c175070947ca66d', class: "logo-colored", src: this.secondLogoSrc, alt: this.secondLogoAlt }), h("img", { key: '14e1ae754cbccf6c9a3c76e95e9e23bab3d202ee', class: "logo-white", src: this.secondLogoWhiteSrc, alt: this.secondLogoAlt }))), h("div", { key: '2ebd495fe949acc922b1d11fae71f597744b9567', class: "dda-mobile-search" }, this.mobileMenuSearchId && (h("a", { key: 'b56a53c30a7b8613b5dba1da39988ded608c062f', href: this.useNavigator == 'true' ? 'javascript:void(0)' : this.mobileMenuSearchUrl, onClick: () => (this.useNavigator == 'true' ? this.navigatorClick.emit(this.mobileMenuSearchUrl) : ''), class: "tool-btn", id: this.mobileMenuSearchId }, h("span", { key: '0f042fecd9d542fa6e7721dc63334e3fa3f2a70e', class: "visualy-hidden" }, this.searchText || 'Search'), h("i", { key: '21f7e78418f8646bda60d435c8652f06ef87c631', class: "material-icons  material-symbols-outlined", "aria-hidden": "true" }, "search")))), h("div", { key: 'aabf69c92f17b5ca0231939eea2835f8ab1541aa', class: "dda-toolbar-menu" }, h("ul", { key: '7c33281968a402d2b1812f9f87c81f195950686e' }, this.search_input_name && (h("li", { key: '7b7b4b3b32a6c03555f375210be0113b4dae44a4' }, h("dda-tooltip", { key: 'b1617941beed195042e7f234246aa5ca82f4228c', title_text: this.search_tooltip || 'Search', description: "", position: "top" }, h("div", { key: 'f64dc3c8c6fcf1dcf17dcd8913d845a1b222ed33', class: "dda-search dda-header-search" }, h("label", { key: '2a1f2708e838eb010eddc88a759af7d1ea2267d9', id: "ddaSearch-label", class: "visualy-hidden", "aria-hidden": "true" }, this.searchText || 'Search'), h("i", { key: '3e6d7678e32bc94c44beda939a0951ab397e123f', class: "material-icons  material-symbols-outlined", "aria-hidden": "true" }, "search"), h("dda-input", { key: 'e4aead90ab9cf0ce31f2b27b506dfdd9aab63882', placeholder: this.search_input_placeholder || 'Search', type: "text", input_id: "ddaSearch", value: this.search_value, input_name: this.search_input_name, aria_label: "input", input_role: "search", error_message: "Error text", validation_type: "normal", validation_id: "validationId", input_status: "normal", size: "default", custom_class: "dda-header-search-input tool-btn", component_mode: "",
+            href: this.useLoginPopup ? 'javascript:void(0)' : this.loginLink, button_shape: "circle", size: "sm" })))))), h("button", { key: '1f2df4dc3905ddb948e8bb55abb764238e131298', type: "button", name: this.close_menu_button_name, class: "close-btn side-nav-close-btn", "aria-label": "Close Sidebar", onClick: this.toggleMenu }, h("i", { key: 'ba70e57cb7cffa77ee5dad748611f8e204ca943f', class: "material-icons  material-symbols-outlined", "aria-hidden": "true" }, "close")), this.usePredesignedAccessibilityMenu ? (h("div", { class: "dda-accessibility hide-accessibility mobile-accessibility", style: { display: this.isMobileAccessibiltyOpen ? 'block' : 'none' } }, h("div", { class: "mobile-accessibility-content" }, h("div", { class: "dda-row" }, h("div", { class: "dda-col-md-4 dda-accessibility-item" }, h("h6", { class: "h6 Regular dda-mb-1" }, this.contrast_title), h("form", null, h("fieldset", { class: "dda-theme-list" }, h("legend", null, h("p", { class: "body Regular dda-mb-3" }, this.contrast_description)), this.contrast_noraml_text ? (h("dda-radiobutton", { title_text: this.contrast_noraml_text, checked: this.selected_contrast == 'normal', size: "default", variants: "normal", supporting: "", error_message: "", validation_id: "NormalThemeMobile", group_name: "themeselectionMobile", input_id: "NormalThemeMobile", custom_class: "", component_mode: "", aria_label: "radio-button", validation_type: "normal", onChange: this.normalContrasthandler, class: "hydrated" })) : null, this.contrast_color_blind_text ? (h("dda-radiobutton", { title_text: this.contrast_color_blind_text, checked: this.selected_contrast == 'colorblind', size: "default", variants: "normal", supporting: "", error_message: "", validation_id: "ColoursBlindMobile", group_name: "themeselectionMobile", input_id: "ColoursBlindMobile", custom_class: "", component_mode: "", aria_label: "radio-button", validation_type: "normal", onChange: this.blindContrasthandler, class: "hydrated" })) : null, this.contrast_red_weakness_text ? (h("dda-radiobutton", { title_text: this.contrast_red_weakness_text, checked: this.selected_contrast == 'redweakness', size: "default", variants: "normal", supporting: "", error_message: "", validation_id: "RedWeaknessMobile", group_name: "themeselectionMobile", input_id: "RedWeaknessMobile", custom_class: "", component_mode: "", aria_label: "radio-button", validation_type: "normal", onChange: this.redContrasthandler, class: "hydrated" })) : null, this.contrast_green_weakness_text ? (h("dda-radiobutton", { title_text: this.contrast_green_weakness_text, checked: this.selected_contrast == 'greenweakness', size: "default", variants: "normal", supporting: "", error_message: "", validation_id: "GreenWeaknessMobile", group_name: "themeselectionMobile", input_id: "GreenWeaknessMobile", custom_class: "", component_mode: "", aria_label: "radio-button", validation_type: "normal", onChange: this.greenContrasthandler, class: "hydrated" })) : null))), h("div", { class: "dda-col-md-4 dda-accessibility-item" }, h("h6", { class: "h6 Regular dda-mb-1" }, this.screen_reader_title), h("p", { class: "body Regular dda-mb-3" }, this.screen_reader_description), h("div", { class: "rs_skip rsbtn rs_preserve rs_mobile", id: "readspeaker_button1" }, h("a", { rel: "nofollow", href: this.read_speaker_link, role: "button", class: "rsbtn_play circle readspeaker", accessKey: "L", "aria-label": "Listen to this page using ReadSpeaker", "data-rsshortcut": "play", "aria-haspopup": "menu", "data-rs-lang": "en_uk" }, h("i", { class: "material-icons  material-symbols-outlined", "aria-hidden": "true" }, "volume_up")))), h("div", { class: "dda-col-md-4 dda-accessibility-item" }, h("h6", { class: "h6 Regular dda-mb-1" }, this.text_size_title), h("p", { class: "body Regular dda-mb-3" }, this.text_size_description), h("div", { class: "dda-d-flex dda-gap-4" }, h("dda-button", { button_color: this.selected_text_size == 'normal' ? 'default-primary' : 'default-secondary', button_text: "A", icon_button_shape: "circle", custom_class: "", size: "lg", onClick: this.baseTexthandler }), h("dda-button", { button_color: this.selected_text_size == 'large' ? 'default-primary' : 'default-secondary', button_text: "A+", icon_button_shape: "circle", custom_class: "", size: "lg", onClick: this.lgTexthandler }), h("dda-button", { button_color: this.selected_text_size == 'small' ? 'default-primary' : 'default-secondary', button_text: "A-", icon_button_shape: "circle", custom_class: "", size: "lg", onClick: this.smTexthandler }))))), h("button", { type: "button", name: this.close_accessibility_button_name, class: "close-btn close_accessibility", "aria-label": "Close Accessibility", onClick: this.toggleMobileAccessibilty }, h("i", { class: "material-icons  material-symbols-outlined", "aria-hidden": "true" }, "close")))) : null), this.quickLinks && (h("dda-header-menu", { key: '8ce70c1329af918f148a721b446749f95726466c', "use-navigator": this.useNavigator, "navigator-click": this.navigatorClick, "show-Quick-Links-Icon": this.showQuickLinksIcon, "quick-links": typeof this.quickLinks === 'string' ? this.quickLinks : JSON.stringify(this.quickLinks) }))), h("div", { key: '6ade94ce121e760e02dbc7b3c9f95b9b055d4c62', class: "dda-mobile-entt-logo" }, h("a", { key: 'd6dbcd698634f25bcfe7a5797caa52db31ece40b', href: this.useNavigator == 'true' ? 'javascript:void(0)' : this.secondLogoHref, onClick: () => (this.useNavigator == 'true' ? this.navigatorClick.emit(this.secondLogoHref) : ''), class: "entt-logo" }, h("img", { key: '5247234ab6d0e4ef3e725bb6fb8e681d796da37b', class: "logo-colored", src: this.secondLogoSrc, alt: this.secondLogoAlt }), h("img", { key: '2adc2e0fecae54e51a825d83883c728ed6d33d64', class: "logo-white", src: this.secondLogoWhiteSrc, alt: this.secondLogoAlt }))), h("div", { key: '6188b81b90ee5d93334862fb5657b4b2bb50472b', class: "dda-mobile-search" }, this.mobileMenuSearchId && (h("a", { key: '563bfd7e62ca7249cff9363451afa622d21e7ec7', href: this.useNavigator == 'true' ? 'javascript:void(0)' : this.mobileMenuSearchUrl, onClick: () => (this.useNavigator == 'true' ? this.navigatorClick.emit(this.mobileMenuSearchUrl) : ''), class: "tool-btn", id: this.mobileMenuSearchId }, h("span", { key: '98773ae4ea5cc8b14e526013114f5a2daf329cbd', class: "visualy-hidden" }, this.searchText || 'Search'), h("i", { key: 'c3ece4911b5d9342544c5a7a815cdf6b0dc7828f', class: "material-icons  material-symbols-outlined", "aria-hidden": "true" }, "search")))), h("div", { key: '9e4a5228941be09ae4c18dfe0507ef213a8ae7ff', class: "dda-toolbar-menu" }, h("ul", { key: 'ae73001a8659b0dcee9c6c3e461bd4503f31ee3e' }, this.search_input_name && (h("li", { key: '301c3ca831b60722f8a37f9fbdf45a6b34bd6af8' }, h("dda-tooltip", { key: 'c7422723142be2307bb5de6c9081fb85037be4fa', title_text: this.search_tooltip || 'Search', description: "", position: "top" }, h("div", { key: '6ef5d28bb31736f71de9d84948723a30242082bb', class: "dda-search dda-header-search" }, h("label", { key: 'e548283a91365210457a77267c6962f7857bc1c6', id: "ddaSearch-label", class: "visualy-hidden", "aria-hidden": "true" }, this.searchText || 'Search'), h("i", { key: '1e4df1482d119718cb0f6b14ebadec67e6972ce9', class: "material-icons  material-symbols-outlined", "aria-hidden": "true" }, "search"), h("dda-input", { key: 'dfe13ea20eb058532ba8558c574fcf9b1a470b37', placeholder: this.search_input_placeholder || 'Search', type: "text", input_id: "ddaSearch", value: this.search_value, input_name: this.search_input_name, aria_label: "input", input_role: "search", error_message: "Error text", validation_type: "normal", validation_id: "validationId", input_status: "normal", size: "default", custom_class: "dda-header-search-input tool-btn", component_mode: "",
             // handleInput={(event) => console.log(event.target.value,"")}
             onKeyPress: e => {
                 if (e.key === 'Enter') {
                     this.searchhandler(e.target.value); // Pass the value to the searchhandler
                 }
-            } }), h("span", { key: 'bf3b40dc2410d8939a7ac9faaa94f5f8026cba5f', id: "validationId", class: "visually-hidden" }, "Enter keywords to search the site."))))), this.accessibility_button_id && (h("li", { key: '84848c1c168f2d38f836b72530e5761ba5a12a9d' }, h("dda-tooltip", { key: '41c543161e317158bcd28828e0d5912f251850b2', title_text: this.accessibility_tooltip, position: "top" }, h("button", { key: '94231a899385b08a928e6b8a08a452a770a36a02', name: this.toggle_accessibility_button_name, class: "tool-btn dda-btn btn-color-onsurface-secondary btn-size-sm btn-shape-circle accessibility-btn", type: "button", onClick: this.toggleAccessibilty, id: this.accessibility_button_id }, h("i", { key: '17f0db306de595cc504b41fc9c610a5964467e38', class: this.accessibility_button_icon_family }, this.accessibility_button_icon_name), h("span", { key: 'e116c1e9bd65d35a254e179a754afa44750087bd', class: "visually-hidden" }, this.accessibility_button_text))), this.usePredesignedAccessibilityMenu ? (h("div", { class: "dda-accessibility-wrap" }, h("div", { class: "dda-accessibility hide-accessibility", style: { display: this.isAccessibiltyOpen ? 'block' : 'none' } }, h("div", { class: "dda-row" }, h("div", { class: "dda-col-md-4 dda-accessibility-item" }, h("h6", { class: "h6 Regular dda-mb-1" }, this.contrast_title), h("form", null, h("fieldset", { class: "dda-theme-list" }, h("legend", null, h("p", { class: "body Regular dda-mb-3" }, this.contrast_description)), this.contrast_noraml_text ? (h("dda-radiobutton", { title_text: this.contrast_noraml_text, checked: this.selected_contrast == 'normal', size: "default", variants: "normal", supporting: "", error_message: "", validation_id: "NormalTheme", group_name: "themeselection", input_id: "NormalTheme", custom_class: "", component_mode: "", aria_label: "radio-button", validation_type: "normal", onChange: this.normalContrasthandler, class: "" })) : null, this.contrast_color_blind_text ? (h("dda-radiobutton", { title_text: this.contrast_color_blind_text, checked: this.selected_contrast == 'colorblind', size: "default", variants: "normal", supporting: "", error_message: "", validation_id: "ColoursBlind", group_name: "themeselection", input_id: "ColoursBlind", custom_class: "", component_mode: "", aria_label: "radio-button", validation_type: "normal", onChange: this.blindContrasthandler, class: "hydrated" })) : null, this.contrast_red_weakness_text ? (h("dda-radiobutton", { title_text: this.contrast_red_weakness_text, checked: this.selected_contrast == 'redweakness', size: "default", variants: "normal", supporting: "", error_message: "", validation_id: "RedWeakness", group_name: "themeselection", input_id: "RedWeakness", custom_class: "", component_mode: "", aria_label: "radio-button", validation_type: "normal", onChange: this.redContrasthandler, class: "hydrated" })) : null, this.contrast_green_weakness_text ? (h("dda-radiobutton", { title_text: this.contrast_green_weakness_text, checked: this.selected_contrast == 'greenweakness', size: "default", variants: "normal", supporting: "", error_message: "", validation_id: "GreenWeakness", group_name: "themeselection", input_id: "GreenWeakness", custom_class: "", component_mode: "", aria_label: "radio-button", validation_type: "normal", onChange: this.greenContrasthandler, class: "hydrated" })) : null))), h("div", { class: "dda-col-md-4 dda-accessibility-item" }, h("h6", { class: "h6 Regular dda-mb-1" }, this.screen_reader_title), h("p", { class: "body Regular dda-mb-3" }, this.screen_reader_description), h("div", { class: "rs_skip rsbtn rs_preserve rs_mobile", id: "readspeaker_button1" }, h("a", { rel: "nofollow", href: this.read_speaker_link, role: "button", class: "rsbtn_play circle readspeaker", accessKey: "L", "aria-label": "Listen to this page using ReadSpeaker", "data-rsshortcut": "play", "aria-haspopup": "menu", "data-rs-lang": "en_uk" }, h("i", { class: "material-icons  material-symbols-outlined", "aria-hidden": "true" }, "volume_up")))), h("div", { class: "dda-col-md-4 dda-accessibility-item" }, h("h6", { class: "h6 Regular dda-mb-1" }, this.text_size_title), h("p", { class: "body Regular dda-mb-3" }, this.text_size_description), h("div", { class: "dda-d-flex dda-gap-4" }, h("dda-button", { button_color: this.selected_text_size == 'normal' ? 'default-primary' : 'default-secondary', button_text: "A", icon_button_shape: "circle", custom_class: "", size: "lg", onClick: this.baseTexthandler }), h("dda-button", { button_color: this.selected_text_size == 'large' ? 'default-primary' : 'default-secondary', button_text: "A+", icon_button_shape: "circle", custom_class: "", size: "lg", onClick: this.lgTexthandler }), h("dda-button", { button_color: this.selected_text_size == 'small' ? 'default-primary' : 'default-secondary', button_text: "A-", icon_button_shape: "circle", custom_class: "", size: "lg", onClick: this.smTexthandler })))), h("button", { type: "button", name: this.close_accessibility_button_name, class: "close-btn close_accessibility", "aria-label": "Close Sidebar", onClick: this.toggleAccessibilty }, h("i", { class: "material-icons  material-symbols-outlined", "aria-hidden": "true" }, "close"))))) : null)), this.language_text && (h("li", { key: 'e0b8b7b57d78c55fb4e024a8f89e13cd0e19e468' }, h("dda-tooltip", { key: 'fd9067c3a2e237352dbbda07b5a7f70d7f616c9f', title_text: this.language_tooltip, position: "top" }, h("dda-button", { key: 'dd916ac1985970aa5adfb661a6165f910d664907', button_color: "onsurface-secondary", custom_class: "tool-btn", button_text: this.language_text, button_shape: "circle", size: "sm", onClick: this.languagehandler })))), this.loginText && (h("li", { key: '3bec421fd54794cbc429020dfd61ee5e11c26584' }, h("dda-tooltip", { key: 'b2b90f4aa9f21ff184a4504f96c449c3ff280d0a', title_text: this.login_tooltip, position: "top" }, h("dda-link-button", { key: '09c5d8101957aaf689490f6dce111f6a7b39fcee', button_color: "onsurface-secondary", start_icon: this.loginIcon, custom_class: "tool-btn login-button", link_button_text: this.loginText, onClick: this.toggleLogin,
+            } }), h("span", { key: 'bbd9ba0cb19e35cb55131e501d0ecc8db1d1d78b', id: "validationId", class: "visually-hidden" }, "Enter keywords to search the site."))))), this.accessibility_button_id && (h("li", { key: 'ba5daef408a4e62e5de995120da79c298e09e261' }, h("dda-tooltip", { key: '2c30e312db252a119a5d10e34290cd8ea59b9236', title_text: this.accessibility_tooltip, position: "top" }, h("button", { key: 'df5f622b45c938efc370aa2da396881ff3d19a7e', name: this.toggle_accessibility_button_name, class: "tool-btn dda-btn btn-color-onsurface-secondary btn-size-sm btn-shape-circle accessibility-btn", type: "button", onClick: this.toggleAccessibilty, id: this.accessibility_button_id }, h("i", { key: '900722b19eece12242382e4d6670a6298d102a9c', class: this.accessibility_button_icon_family }, this.accessibility_button_icon_name), h("span", { key: 'c60cf2232f5856ef39a69f4a22bb23f3f9290574', class: "visually-hidden" }, this.accessibility_button_text))), this.usePredesignedAccessibilityMenu ? (h("div", { class: "dda-accessibility-wrap" }, h("div", { class: "dda-accessibility hide-accessibility", style: { display: this.isAccessibiltyOpen ? 'block' : 'none' } }, h("div", { class: "dda-row" }, h("div", { class: "dda-col-md-4 dda-accessibility-item" }, h("h6", { class: "h6 Regular dda-mb-1" }, this.contrast_title), h("form", null, h("fieldset", { class: "dda-theme-list" }, h("legend", null, h("p", { class: "body Regular dda-mb-3" }, this.contrast_description)), this.contrast_noraml_text ? (h("dda-radiobutton", { title_text: this.contrast_noraml_text, checked: this.selected_contrast == 'normal', size: "default", variants: "normal", supporting: "", error_message: "", validation_id: "NormalTheme", group_name: "themeselection", input_id: "NormalTheme", custom_class: "", component_mode: "", aria_label: "radio-button", validation_type: "normal", onChange: this.normalContrasthandler, class: "" })) : null, this.contrast_color_blind_text ? (h("dda-radiobutton", { title_text: this.contrast_color_blind_text, checked: this.selected_contrast == 'colorblind', size: "default", variants: "normal", supporting: "", error_message: "", validation_id: "ColoursBlind", group_name: "themeselection", input_id: "ColoursBlind", custom_class: "", component_mode: "", aria_label: "radio-button", validation_type: "normal", onChange: this.blindContrasthandler, class: "hydrated" })) : null, this.contrast_red_weakness_text ? (h("dda-radiobutton", { title_text: this.contrast_red_weakness_text, checked: this.selected_contrast == 'redweakness', size: "default", variants: "normal", supporting: "", error_message: "", validation_id: "RedWeakness", group_name: "themeselection", input_id: "RedWeakness", custom_class: "", component_mode: "", aria_label: "radio-button", validation_type: "normal", onChange: this.redContrasthandler, class: "hydrated" })) : null, this.contrast_green_weakness_text ? (h("dda-radiobutton", { title_text: this.contrast_green_weakness_text, checked: this.selected_contrast == 'greenweakness', size: "default", variants: "normal", supporting: "", error_message: "", validation_id: "GreenWeakness", group_name: "themeselection", input_id: "GreenWeakness", custom_class: "", component_mode: "", aria_label: "radio-button", validation_type: "normal", onChange: this.greenContrasthandler, class: "hydrated" })) : null))), h("div", { class: "dda-col-md-4 dda-accessibility-item" }, h("h6", { class: "h6 Regular dda-mb-1" }, this.screen_reader_title), h("p", { class: "body Regular dda-mb-3" }, this.screen_reader_description), h("div", { class: "rs_skip rsbtn rs_preserve rs_mobile", id: "readspeaker_button1" }, h("a", { rel: "nofollow", href: this.read_speaker_link, role: "button", class: "rsbtn_play circle readspeaker", accessKey: "L", "aria-label": "Listen to this page using ReadSpeaker", "data-rsshortcut": "play", "aria-haspopup": "menu", "data-rs-lang": "en_uk" }, h("i", { class: "material-icons  material-symbols-outlined", "aria-hidden": "true" }, "volume_up")))), h("div", { class: "dda-col-md-4 dda-accessibility-item" }, h("h6", { class: "h6 Regular dda-mb-1" }, this.text_size_title), h("p", { class: "body Regular dda-mb-3" }, this.text_size_description), h("div", { class: "dda-d-flex dda-gap-4" }, h("dda-button", { button_color: this.selected_text_size == 'normal' ? 'default-primary' : 'default-secondary', button_text: "A", icon_button_shape: "circle", custom_class: "", size: "lg", onClick: this.baseTexthandler }), h("dda-button", { button_color: this.selected_text_size == 'large' ? 'default-primary' : 'default-secondary', button_text: "A+", icon_button_shape: "circle", custom_class: "", size: "lg", onClick: this.lgTexthandler }), h("dda-button", { button_color: this.selected_text_size == 'small' ? 'default-primary' : 'default-secondary', button_text: "A-", icon_button_shape: "circle", custom_class: "", size: "lg", onClick: this.smTexthandler })))), h("button", { type: "button", name: this.close_accessibility_button_name, class: "close-btn close_accessibility", "aria-label": "Close Sidebar", onClick: this.toggleAccessibilty }, h("i", { class: "material-icons  material-symbols-outlined", "aria-hidden": "true" }, "close"))))) : null)), this.language_text && (h("li", { key: '966aa43db152dad8c71bff787d184cd9e55021ae' }, h("dda-tooltip", { key: 'f4d03817adc85b557d3139560c23a2baaa5244fd', title_text: this.language_tooltip, position: "top" }, h("dda-button", { key: '3cb66d8904d8819263660a3d03d1d7dbec958455', button_color: "onsurface-secondary", custom_class: "tool-btn", button_text: this.language_text, button_shape: "circle", size: "sm", onClick: this.languagehandler })))), this.loginText && (h("li", { key: '0758d5790051c654618e3d959943d2020c13838c' }, h("dda-tooltip", { key: '2ea71290da3ea6530acadd5229f5908a9331971b', title_text: this.login_tooltip, position: "top" }, h("dda-link-button", { key: '0521688ddf1da1f7cf68eab00e91a51b2b79fb3a', button_color: "onsurface-secondary", start_icon: this.loginIcon, custom_class: "tool-btn login-button", link_button_text: this.loginText, onClick: this.toggleLogin,
             // href={this.loginLink}
             href: this.useLoginPopup ? 'javascript:void(0)' : this.loginLink, button_shape: "circle", size: "sm" })))))), this.useLoginPopup ? (h("div", { class: "dda-login-popup desktop", style: { display: this.isDesktopLoginPopupOpen ? 'block' : 'none' } }, this.renderLoginPopup())) : null, this.useLoginPopup ? (h("div", { class: "dda-login-popup mobile", style: { display: this.isMobileLoginPopupOpen ? 'block' : 'none' } }, this.renderLoginPopup())) : null)));
     }