@itcenteratunihelsinki/huds-lib 0.9.9 → 0.10.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/components/hy-ingress.js +1 -1
- package/components/site-search.js +10 -7
- package/dist/cjs/hy-breadcrumbs_15.cjs.entry.js +11 -8
- package/dist/collection/components/hy-ingress/ingress.css +4 -36
- package/dist/collection/components/hy-site-header/site-search/site-search.css +320 -0
- package/dist/collection/components/hy-site-header/site-search/site-search.js +9 -6
- package/dist/esm/hy-breadcrumbs_15.entry.js +11 -8
- package/dist/huds-lib/hy-breadcrumbs_15.entry.js +1 -1
- package/dist/types/components/hy-site-header/site-search/site-search.d.ts +1 -0
- package/package.json +2 -2
|
@@ -95,6 +95,9 @@ export class SiteSearch {
|
|
|
95
95
|
// Without setTimeout it will not focus the input because it hasn't rendered yet.
|
|
96
96
|
setTimeout(() => {
|
|
97
97
|
const searchInput = this.el.shadowRoot.querySelector("input#search");
|
|
98
|
+
if (window.registerNavSearchInput && searchInput) {
|
|
99
|
+
window.registerNavSearchInput('#cludo-search-form input#search');
|
|
100
|
+
}
|
|
98
101
|
searchInput === null || searchInput === void 0 ? void 0 : searchInput.focus();
|
|
99
102
|
});
|
|
100
103
|
}
|
|
@@ -107,24 +110,24 @@ export class SiteSearch {
|
|
|
107
110
|
render() {
|
|
108
111
|
const currentPageUrlPathName = window.location.pathname;
|
|
109
112
|
const searchPagePathNames = ["/fi/haku", "/en/search", "/sv/sök"];
|
|
110
|
-
return (h("div", { key: '
|
|
113
|
+
return (h("div", { key: '14308fcbac8e2b4c7e7b4a3393b8ddbc48ada624', class: {
|
|
111
114
|
"site-search": true,
|
|
112
115
|
"site-search__is-open": this.isSearchPanelOpen,
|
|
113
116
|
"is-group": this.isGroup,
|
|
114
|
-
} }, h("button", { key: '
|
|
117
|
+
} }, h("button", { key: '99285de74d03d93fae04aa14781f3465d4afa2dd', "aria-label": this.showLabel ? this._labels["open"] : "", "aria-expanded": `${this.isSearchPanelOpen}`, class: {
|
|
115
118
|
"button--search": true,
|
|
116
119
|
"is-open--menu": this.isAlternative,
|
|
117
120
|
"is-open": this.isSearchPanelOpen,
|
|
118
121
|
"is-active": searchPagePathNames.some((item) => item === currentPageUrlPathName),
|
|
119
|
-
}, onClick: (e) => this.handleSearchPanelToggle(e), disabled: searchPagePathNames.some((item) => item === currentPageUrlPathName) ? true : false }, this.showLabel ? (h("span", { class: { "button--search__label": true, "button--search__label__group": this.isGroup } }, this._labels["label"])) : (""), h("hy-icon", { key: '
|
|
122
|
+
}, onClick: (e) => this.handleSearchPanelToggle(e), disabled: searchPagePathNames.some((item) => item === currentPageUrlPathName) ? true : false }, this.showLabel ? (h("span", { class: { "button--search__label": true, "button--search__label__group": this.isGroup } }, this._labels["label"])) : (""), h("hy-icon", { key: 'f609b6379b4d3be08c203f7b00d6b231e7135e7d', icon: "hy-icon-search", size: this.size, fill: this.color })), (!this.isLuomusGroup && this.isSearchPanelOpen) && (h("div", { key: '77a1cb514c734d144a6e17e0f892edbe09508d9d', class: {
|
|
120
123
|
"site-search__panel": true,
|
|
121
124
|
"site-search__panel__is-open": this.isSearchPanelOpen,
|
|
122
|
-
}, "aria-hidden": `${!this.isSearchPanelOpen}` }, h("div", { key: '
|
|
125
|
+
}, "aria-hidden": `${!this.isSearchPanelOpen}` }, h("div", { key: 'f1d57468a0d5188b138854b44a68ad6b45c6aff5', class: "site-search__panel__content" }, h("div", { key: '5ac01fafec4b9b0bc210eb9ec6065275f819b077', class: "site-search__panel__wrapper" }, h("div", { key: 'f0d2267d4045c0398d251461f43e7361ff906e7d', class: "site-search__panel__title" }, h("div", { key: '858202623ac82e4cbc75d7d66e668c5996f7d1a9', class: "site-search__panel__title__group" }, h("span", { key: '1d6b1d760629248039847b6a64b3e33c5e7c4249', class: "panel-title" }, this.searchTitleLabel), h("div", { key: '430867474c934f0d562673c60064f0b648fa43a2', class: "description" }, this.searchDescriptionLabel))), h("div", { key: 'b081666de8a7e01d68f3ed067a01ee7c76efe340', id: "cludo-search-results", class: "container_12" }, h("div", { key: 'f00c982e682076d504b45a96e194bfd8fd031d5d', class: "search-banner" }), h("div", { key: 'b1e748ca993e15b8f9247d1e47ecc05f98b1be9d', class: "search-filters search-filters-mobile" }), h("div", { key: '361b42614a73eca060df72392c295e1442f3544b', class: "col-md-12" }, h("div", { key: '7f53b4d4a31fed81263c9681cb394d80111894a6', style: { margin: "20px 0 32px" }, id: "cludo-search-content-form" }, h("hy-search-field", { key: 'afd8412f607636cd8022feb96ad9a53021d6ba82', "input-id": "search", label: "" }))), h("div", { key: '209b848f4c5c16e51e4d78da3a394c3714861aa8', class: "col-md-3" }, h("div", { key: '5bf7e7a5d5218a11174758356c3fe8b9ef7b6e1e', class: "search-filters", "aria-controls": "search-results" })), h("div", { key: 'a801c5fdbb998e6c2dfa6457c25ff7ed18d6e561', class: "col-md-9" }, h("div", { key: '36e3d2b77d365ff50d2542f288d134769d9a77cd', class: "search-results-container" }, h("hy-paragraph-text", { key: '223f7604ab9a457ae375bb6bd81b7643450c384c' }, h("div", { key: '3315875631f74684d7416544462fc6804f213187', class: "search-result-count" })), h("div", { key: '645c792076ad5a67fa27907630518d47b2ff1796', class: "search-did-you-mean", role: "Complementary" }), h("div", { key: 'ce78be3a28bb44aa4a29cf7905c653ea6cfc14ea', class: "search-results", role: "region", id: "search-results", "aria-live": "polite" })))), this._searchTools && this._searchTools.length > 0 && (h("div", { key: '4a6f518bf6d40be1e82ff1bcbe9aee1d3575ebcd', class: "site-search__panel__tools" }, h("div", { key: 'a3cd2c0329258d5d7d0795aa0f2705badc679903', class: "title" }, this.searchToolsLabel), h("div", { key: 'd069bbf2cb1d48683b66c15359e5e97a2ea6eece', class: "list" }, this._searchTools.map((i) => {
|
|
123
126
|
let searchToolTarget = i.isExternal ? "_blank" : "_self";
|
|
124
127
|
return (h("a", { class: "search-special-tool", href: i.url, target: searchToolTarget }, h("hy-icon", { icon: "hy-icon-arrow-to-right", size: 24, fill: ColorVariant.black }), h("span", { class: "label" }, i.label), h("span", { class: "description" }, i.description)));
|
|
125
|
-
})))), h("button", { key: '
|
|
128
|
+
})))), h("button", { key: '06a6bdcec4873807cb9b08ff615842fc7409f0f7', onClick: () => this.closeSearchPanel(), class: {
|
|
126
129
|
"site-search__panel__panel-toggle": true,
|
|
127
|
-
}, "aria-label": this.searchCloseLabel, "aria-expanded": `${this.isSearchPanelOpen}` }, h("span", { key: '
|
|
130
|
+
}, "aria-label": this.searchCloseLabel, "aria-expanded": `${this.isSearchPanelOpen}` }, h("span", { key: 'ba2030a8c26279c9531018e9d7223ba1c389703e', class: "site-search__panel__panel-toggle__label" }, h("span", { key: 'ff78542648700dc2091aae9fb91021732571b7c1', class: "site-search__panel__panel-toggle__label__title", tabindex: "0" }, this.searchCloseLabel), h("hy-icon", { key: '77e09522c187f3a5a2c56c7e5570703c696547dc', icon: "hy-icon-remove", size: 16, fill: ColorVariant.black })))), h("div", { key: 'fba05c54c93798a58549aa126cffb676376821c7', class: "site-search__panel__space-box", onClick: () => this.closeSearchPanel() }))))));
|
|
128
131
|
}
|
|
129
132
|
static get is() { return "hy-site-search"; }
|
|
130
133
|
static get encapsulation() { return "shadow"; }
|
|
@@ -319,7 +319,7 @@ Heading.style = {
|
|
|
319
319
|
wide: HyHeadingWideStyle0
|
|
320
320
|
};
|
|
321
321
|
|
|
322
|
-
const ingressCss = "*{-webkit-box-sizing:border-box;box-sizing:border-box}:host{display:block}p.hy-ingress{color:var(--ds-palette-black-95);font-family:var(--ds-fontFamily-body);font-size:var(--ds-fontSize-
|
|
322
|
+
const ingressCss = "*{-webkit-box-sizing:border-box;box-sizing:border-box}:host{display:block}p.hy-ingress{color:var(--ds-palette-black-95);font-family:var(--ds-fontFamily-body);font-size:var(--ds-fontSize-18);font-weight:var(--ds-fontWeight-regular);letter-spacing:var(--ds-letterSpacing-wide);line-height:var(--ds-lineHeight-large);-ms-hyphens:auto;hyphens:auto;text-wrap:pretty;margin:0 0 2rem}@media (min-width: 60rem){p.hy-ingress{font-size:var(--ds-fontSize-20)}}@media (min-width: 60rem){p.hy-ingress{margin:0 0 2.25rem}}@media (min-width: 1601px){p.hy-ingress{margin:0 0 3rem}}@media (min-width: 75.0625rem){p.hy-ingress__large{color:var(--ds-palette-black-95);font-family:var(--ds-fontFamily-body);font-size:var(--ds-fontSize-18);font-weight:var(--ds-fontWeight-regular);letter-spacing:var(--ds-letterSpacing-wide);line-height:var(--ds-lineHeight-large);-ms-hyphens:auto;hyphens:auto;text-wrap:pretty;margin:0 0 3rem}}@media (min-width: 75.0625rem) and (min-width: 60rem){p.hy-ingress__large{font-size:var(--ds-fontSize-20)}}";
|
|
323
323
|
const HyIngressStyle0 = ingressCss;
|
|
324
324
|
|
|
325
325
|
const Ingress = class {
|
|
@@ -807,7 +807,7 @@ const SiteLogo = class {
|
|
|
807
807
|
};
|
|
808
808
|
SiteLogo.style = HySiteLogoStyle0;
|
|
809
809
|
|
|
810
|
-
const siteSearchCss = "*{-webkit-box-sizing:border-box;box-sizing:border-box}.button--search{font-size:0.75rem;line-height:24px;font-weight:400;-webkit-box-align:center;-ms-flex-align:center;align-items:center;background:transparent;border:0 none;color:var(--brand-main-nearly-black);display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row;font-family:var(--main-font-family);height:100%;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;letter-spacing:-0.5px;width:44px}@media (min-width: 75.0625rem){.button--search{display:inline-grid;grid-template-columns:repeat(2, auto);gap:4px;width:auto}}@media (min-width: 1601px){.button--search{font-size:0.875rem;line-height:24px}}.button--search:hover:not([disabled]){color:var(--brand-main);cursor:pointer}.button--search:hover:not([disabled]) svg{fill:var(--brand-main)}.button--search:focus:not([disabled]){outline:solid 2px var(--additional-yellow);outline-offset:2px}.button--search.is-active,.button--search[aria-expanded=true]{position:relative}.button--search.is-active:after,.button--search[aria-expanded=true]:after{content:\"\";position:absolute;height:4px;right:0;bottom:-1px;left:0;background-color:var(--grayscale-black)}.is-group .button--search{color:var(--grayscale-white)}.is-group .button--search:hover:not([disabled]){color:var(--grayscale-medium);cursor:pointer}.is-group .button--search:hover:not([disabled]) svg{fill:var(--grayscale-medium)}.button--search.is-open--menu{position:absolute;right:50px;top:15px;z-index:101}.button--search__label{display:none;visibility:hidden}@media (min-width: 75.0625rem){.button--search__label{display:block;visibility:visible;-webkit-box-ordinal-group:3;-ms-flex-order:2;order:2}}.site-search{height:100%}.site-search__panel{display:none}.site-search__panel__is-open{background-color:rgba(0, 0, 0, 0.5);border-top:1px solid rgba(0, 0, 0, 0.1);display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;font-family:var(--main-font-family);left:0;height:100vh;position:absolute;width:100%;z-index:520}.site-search__panel__title__group{-webkit-box-align:baseline;-ms-flex-align:baseline;align-items:baseline;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column}@media (min-width: 60rem){.site-search__panel__title__group{-webkit-box-align:baseline;-ms-flex-align:baseline;align-items:baseline;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row;-webkit-box-pack:start;-ms-flex-pack:start;justify-content:flex-start}}.site-search__panel__title .panel-title{font-size:2rem;line-height:32px;font-weight:700;color:var(--grayscale-black);letter-spacing:-1px;margin-bottom:12px;margin-top:20px;text-transform:uppercase}@media (min-width: 30rem){.site-search__panel__title .panel-title{font-size:2.875rem;line-height:48px;letter-spacing:-1.5px;margin-top:24px}}@media (min-width: 1601px){.site-search__panel__title .panel-title{font-size:3.25rem;line-height:54px;letter-spacing:-1.6px}}.site-search__panel__title .description{font-size:0.75rem;line-height:16px;color:var(--grayscale-black);letter-spacing:-0.2px;margin-bottom:16px;padding:0}@media (min-width: 30rem){.site-search__panel__title .description{font-size:1rem;line-height:22px;letter-spacing:-0.1px;margin-bottom:18px}}@media (min-width: 60rem){.site-search__panel__title .description{font-size:1.125rem;line-height:24px;letter-spacing:-0.1px;padding-left:8px}}@media (min-width: 1601px){.site-search__panel__title .description{font-size:1.25rem;line-height:28px;letter-spacing:-0.2px;padding-left:12px}}.site-search__panel__content{background-color:var(--grayscale-light);width:100%}.site-search__panel__space-box{height:100%;width:100%}.site-search__panel__wrapper{margin:0 auto;max-width:100%;padding:0 1rem 2rem;width:100%}@media (min-width: 30rem){.site-search__panel__wrapper{max-width:1216px;padding:0 0 2rem}}@media (min-width: 1601px){.site-search__panel__wrapper{padding:0 0 4rem}}.site-search__panel__panel-toggle{background-color:transparent;border:none;position:absolute;right:1rem;top:25px}@media (min-width: 30rem){.site-search__panel__panel-toggle{right:2rem;top:36px}}@media (min-width: 1601px){.site-search__panel__panel-toggle{top:45px}}.site-search__panel__panel-toggle__label{font-size:0.875rem;line-height:22px;font-weight:700;-webkit-box-align:center;-ms-flex-align:center;align-items:center;color:var(--grayscale-black);display:-webkit-box;display:-ms-flexbox;display:flex;letter-spacing:-0.44px;text-transform:uppercase}.site-search__panel__panel-toggle__label__title{padding-right:8px}@media (min-width: 1601px){.site-search__panel__panel-toggle__label{font-size:1.125rem;line-height:22px;letter-spacing:-0.56px}}.site-search__panel__panel-toggle:focus:not([disabled]),.site-search__panel__panel-toggle:hover:not([disabled]){cursor:pointer}.site-search__panel__panel-toggle:focus:not([disabled]) span,.site-search__panel__panel-toggle:hover:not([disabled]) span{color:var(--brand-main)}.site-search__panel__panel-toggle:focus:not([disabled]) svg,.site-search__panel__panel-toggle:hover:not([disabled]) svg{fill:var(--brand-main)}.site-search__panel__tools .title{font-size:1rem;line-height:20px;font-weight:700;color:var(--brand-main-nearly-black);letter-spacing:-0.5px;text-transform:uppercase}@media (min-width: 30rem){.site-search__panel__tools .title{font-size:1.125rem;line-height:24px;letter-spacing:-0.56px;margin:32px 0 16px}}.site-search__panel__tools .list a.search-special-tool{-webkit-box-align:center;-ms-flex-align:center;align-items:center;background-color:var(--grayscale-white);display:-webkit-box;display:-ms-flexbox;display:flex;margin-bottom:8px;text-decoration:none}.site-search__panel__tools .list a.search-special-tool .label{font-size:0.875rem;line-height:16px;font-weight:700;color:var(--brand-main-nearly-black);letter-spacing:-0.44px;padding-left:8px}@media (min-width: 30rem){.site-search__panel__tools .list a.search-special-tool .label{font-size:1rem;line-height:20px;letter-spacing:-0.5px;padding-left:12px}}.site-search__panel__tools .list a.search-special-tool .description{display:none}@media (min-width: 60rem){.site-search__panel__tools .list a.search-special-tool .description{font-size:0.875rem;line-height:18px;color:var(--grayscale-dark);display:-webkit-box;display:-ms-flexbox;display:flex;letter-spacing:-0.2px;padding-left:12px}}@media (min-width: 1601px){.site-search__panel__tools .list a.search-special-tool .description{font-size:1rem;line-height:24px;color:var(--grayscale-dark);display:-webkit-box;display:-ms-flexbox;display:flex;letter-spacing:0;padding-left:12px}}.site-search__panel__tools .list a.search-special-tool hy-icon{height:40px;width:40px}.site-search__panel__tools .list a.search-special-tool hy-icon svg{background-color:var(--brand-main-light);fill:var(--grayscale-white);height:40px;padding:7px;width:40px}";
|
|
810
|
+
const siteSearchCss = "*{-webkit-box-sizing:border-box;box-sizing:border-box}.button--search{font-size:0.75rem;line-height:24px;font-weight:400;-webkit-box-align:center;-ms-flex-align:center;align-items:center;background:transparent;border:0 none;color:var(--brand-main-nearly-black);display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row;font-family:var(--main-font-family);height:100%;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;letter-spacing:-0.5px;width:44px}@media (min-width: 75.0625rem){.button--search{display:inline-grid;grid-template-columns:repeat(2, auto);gap:4px;width:auto}}@media (min-width: 1601px){.button--search{font-size:0.875rem;line-height:24px}}.button--search:hover:not([disabled]){color:var(--brand-main);cursor:pointer}.button--search:hover:not([disabled]) svg{fill:var(--brand-main)}.button--search:focus:not([disabled]){outline:solid 2px var(--additional-yellow);outline-offset:2px}.button--search.is-active,.button--search[aria-expanded=true]{position:relative}.button--search.is-active:after,.button--search[aria-expanded=true]:after{content:\"\";position:absolute;height:4px;right:0;bottom:-1px;left:0;background-color:var(--grayscale-black)}.is-group .button--search{color:var(--grayscale-white)}.is-group .button--search:hover:not([disabled]){color:var(--grayscale-medium);cursor:pointer}.is-group .button--search:hover:not([disabled]) svg{fill:var(--grayscale-medium)}.button--search.is-open--menu{position:absolute;right:50px;top:15px;z-index:101}.button--search__label{display:none;visibility:hidden}@media (min-width: 75.0625rem){.button--search__label{display:block;visibility:visible;-webkit-box-ordinal-group:3;-ms-flex-order:2;order:2}}.site-search{height:100%}.site-search__panel{display:none}.site-search__panel__is-open{background-color:rgba(0, 0, 0, 0.5);border-top:1px solid rgba(0, 0, 0, 0.1);display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;font-family:var(--main-font-family);left:0;height:100vh;position:absolute;width:100%;z-index:520}.site-search__panel__title__group{-webkit-box-align:baseline;-ms-flex-align:baseline;align-items:baseline;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column}@media (min-width: 60rem){.site-search__panel__title__group{-webkit-box-align:baseline;-ms-flex-align:baseline;align-items:baseline;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row;-webkit-box-pack:start;-ms-flex-pack:start;justify-content:flex-start}}.site-search__panel__title .panel-title{font-size:2rem;line-height:32px;font-weight:700;color:var(--grayscale-black);letter-spacing:-1px;margin-bottom:12px;margin-top:20px;text-transform:uppercase}@media (min-width: 30rem){.site-search__panel__title .panel-title{font-size:2.875rem;line-height:48px;letter-spacing:-1.5px;margin-top:24px}}@media (min-width: 1601px){.site-search__panel__title .panel-title{font-size:3.25rem;line-height:54px;letter-spacing:-1.6px}}.site-search__panel__title .description{font-size:0.75rem;line-height:16px;color:var(--grayscale-black);letter-spacing:-0.2px;margin-bottom:16px;padding:0}@media (min-width: 30rem){.site-search__panel__title .description{font-size:1rem;line-height:22px;letter-spacing:-0.1px;margin-bottom:18px}}@media (min-width: 60rem){.site-search__panel__title .description{font-size:1.125rem;line-height:24px;letter-spacing:-0.1px;padding-left:8px}}@media (min-width: 1601px){.site-search__panel__title .description{font-size:1.25rem;line-height:28px;letter-spacing:-0.2px;padding-left:12px}}.site-search__panel__content{background-color:var(--grayscale-light);width:100%}.site-search__panel__space-box{height:100%;width:100%}.site-search__panel__wrapper{margin:0 auto;max-width:100%;padding:0 1rem 2rem;width:100%}@media (min-width: 30rem){.site-search__panel__wrapper{max-width:1216px;padding:0 0 2rem}}@media (min-width: 1601px){.site-search__panel__wrapper{padding:0 0 4rem}}.site-search__panel__panel-toggle{background-color:transparent;border:none;position:absolute;right:1rem;top:25px}@media (min-width: 30rem){.site-search__panel__panel-toggle{right:2rem;top:36px}}@media (min-width: 1601px){.site-search__panel__panel-toggle{top:45px}}.site-search__panel__panel-toggle__label{font-size:0.875rem;line-height:22px;font-weight:700;-webkit-box-align:center;-ms-flex-align:center;align-items:center;color:var(--grayscale-black);display:-webkit-box;display:-ms-flexbox;display:flex;letter-spacing:-0.44px;text-transform:uppercase}.site-search__panel__panel-toggle__label__title{padding-right:8px}@media (min-width: 1601px){.site-search__panel__panel-toggle__label{font-size:1.125rem;line-height:22px;letter-spacing:-0.56px}}.site-search__panel__panel-toggle:focus:not([disabled]),.site-search__panel__panel-toggle:hover:not([disabled]){cursor:pointer}.site-search__panel__panel-toggle:focus:not([disabled]) span,.site-search__panel__panel-toggle:hover:not([disabled]) span{color:var(--brand-main)}.site-search__panel__panel-toggle:focus:not([disabled]) svg,.site-search__panel__panel-toggle:hover:not([disabled]) svg{fill:var(--brand-main)}.site-search__panel__tools .title{font-size:1rem;line-height:20px;font-weight:700;color:var(--brand-main-nearly-black);letter-spacing:-0.5px;text-transform:uppercase}@media (min-width: 30rem){.site-search__panel__tools .title{font-size:1.125rem;line-height:24px;letter-spacing:-0.56px;margin:32px 0 16px}}.site-search__panel__tools .list a.search-special-tool{-webkit-box-align:center;-ms-flex-align:center;align-items:center;background-color:var(--grayscale-white);display:-webkit-box;display:-ms-flexbox;display:flex;margin-bottom:8px;text-decoration:none}.site-search__panel__tools .list a.search-special-tool .label{font-size:0.875rem;line-height:16px;font-weight:700;color:var(--brand-main-nearly-black);letter-spacing:-0.44px;padding-left:8px}@media (min-width: 30rem){.site-search__panel__tools .list a.search-special-tool .label{font-size:1rem;line-height:20px;letter-spacing:-0.5px;padding-left:12px}}.site-search__panel__tools .list a.search-special-tool .description{display:none}@media (min-width: 60rem){.site-search__panel__tools .list a.search-special-tool .description{font-size:0.875rem;line-height:18px;color:var(--grayscale-dark);display:-webkit-box;display:-ms-flexbox;display:flex;letter-spacing:-0.2px;padding-left:12px}}@media (min-width: 1601px){.site-search__panel__tools .list a.search-special-tool .description{font-size:1rem;line-height:24px;color:var(--grayscale-dark);display:-webkit-box;display:-ms-flexbox;display:flex;letter-spacing:0;padding-left:12px}}.site-search__panel__tools .list a.search-special-tool hy-icon{height:40px;width:40px}.site-search__panel__tools .list a.search-special-tool hy-icon svg{background-color:var(--brand-main-light);fill:var(--grayscale-white);height:40px;padding:7px;width:40px}#search_autocomplete .cludo-sayt__no-result-text p a:focus,#search_autocomplete .cludo-sayt__no-result-text p a:hover,#search_autocomplete .cludo-sayt__results-tophit a:focus h3,#search_autocomplete .cludo-sayt__results-tophit a:hover h3,#search_autocomplete .cludo-sayt__results-tophit-title-link:focus,#search_autocomplete .cludo-sayt__results-tophit-title-link:hover,#search_autocomplete .cludo-sayt__results-tophit.active h3,#search_autocomplete .cludo-sayt__results-tophit.people-result a:focus h3,#search_autocomplete .cludo-sayt__results-tophit.people-result a:hover h3{text-decoration:underline}#search_autocomplete{position:absolute;width:100%;top:100%;left:0;padding:0;z-index:5}#search_autocomplete *{font-family:\"Open Sans\", Helvetica, Arial, sans-serif}#search_autocomplete h3{font-size:0.875rem;width:-webkit-fit-content;width:-moz-fit-content;width:fit-content}#search_autocomplete .cludo-sayt{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;width:100%;background-color:#fff;-webkit-box-shadow:0 2px 8px 0 rgba(0, 0, 0, 0.1);box-shadow:0 2px 8px 0 rgba(0, 0, 0, 0.1);margin:0;padding:12px 15px;border:1px solid #d2d2d2}#search_autocomplete .cludo-sayt h3{line-height:1.25rem}#search_autocomplete .cludo-sayt__suggestions{border-bottom:1px solid #d2d2d2}#search_autocomplete .cludo-sayt__suggestions>h3{margin:0;white-space:nowrap}#search_autocomplete .cludo-sayt__suggestions::-webkit-scrollbar{height:8px}#search_autocomplete .cludo-sayt__suggestions::-webkit-scrollbar:empty{display:none}#search_autocomplete .cludo-sayt__suggestions::-webkit-scrollbar-thumb{background:#c7c7c7;border-radius:20px;cursor:pointer}#search_autocomplete .cludo-sayt__suggestions::-webkit-scrollbar-thumb:hover{background:#878787}#search_autocomplete .cludo-sayt__suggestions-list{display:-webkit-box;display:-ms-flexbox;display:flex;gap:12px;overflow-x:scroll;overflow-y:hidden;padding:8px 0 12px;margin:0;list-style-type:none}#search_autocomplete .cludo-sayt__suggestion{white-space:nowrap;background-color:#f5f5f5;padding:10.05px 18.76px;border-radius:16.75px;font-size:0.813rem;cursor:pointer}#search_autocomplete .cludo-sayt__suggestion.active,#search_autocomplete .cludo-sayt__suggestion:focus,#search_autocomplete .cludo-sayt__suggestion:hover{color:#107eab;text-decoration:underline}#search_autocomplete .cludo-sayt__results{padding:1rem 0}#search_autocomplete .cludo-sayt__people-search-categories>div{margin-top:24px}#search_autocomplete .cludo-sayt__results-tophit-container:not(:last-child){margin-bottom:24px}#search_autocomplete .cludo-sayt__results-tophit-title{display:-webkit-box;display:-ms-flexbox;display:flex;gap:8px;-webkit-box-align:center;-ms-flex-align:center;align-items:center;margin:0 0 16px;color:#000;font-weight:600}#search_autocomplete .cludo-sayt__results-tophit-title-link{color:#107eab;font-weight:600;cursor:pointer}#search_autocomplete .cludo-sayt__results-tophit-title-no-link{color:#107eab;font-weight:600}#search_autocomplete .cludo-sayt__no-result-text p{margin:0;padding:0;color:#222;font-size:0.875rem;font-weight:600}#search_autocomplete .cludo-sayt__no-result-text p a{color:#107eab;text-decoration:none;cursor:pointer}#search_autocomplete .cludo-sayt__results-tophits{margin:0;padding:0;list-style-type:none}#search_autocomplete .cludo-sayt__results-tophit:not(:last-of-type){margin-bottom:16px}#search_autocomplete .cludo-sayt__results-tophit.tool a{display:-webkit-box !important;display:-ms-flexbox !important;display:flex !important;gap:8px;-webkit-box-align:center;-ms-flex-align:center;align-items:center}#search_autocomplete .cludo-sayt__results-tophit.tool a .cludo-sayt__tool{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;width:34px;height:34px;border-radius:5px;background-color:#107eab;color:#fff;font-size:14px;font-weight:600}#search_autocomplete .cludo-sayt__results-tophit a{display:block;font-weight:600;font-size:0.875rem;text-decoration:none;cursor:pointer}#search_autocomplete .cludo-sayt__results-tophit a h3{font-weight:500;color:#222;margin:0}#search_autocomplete .cludo-sayt__results-tophit a span{color:#979797;font-size:0.688rem}#search_autocomplete .cludo-sayt__results-tophit.people-result a{display:-webkit-box;display:-ms-flexbox;display:flex;gap:8px;color:#222}#search_autocomplete .cludo-sayt__results-tophit.people-result .people-result__image{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;width:60px;min-width:60px;height:60px;min-height:60px;border-radius:0;background-color:var(--brand-main-light);background-size:cover;color:var(--grayscale-white);font-size:1rem;line-height:32px;font-weight:700;letter-spacing:0.48px;overflow:hidden}#search_autocomplete .cludo-sayt__results-tophit.people-result .people-result__image img{width:100%}#search_autocomplete .cludo-sayt__results-tophit.people-result .people-result__content h3{font-size:1rem;font-weight:700}#search_autocomplete .cludo-sayt__results-tophit.people-result .people-result__content p{margin:0;font-weight:400}#search_autocomplete .cludo-sayt__all-results{border-top:1px solid #d2d2d2;padding-top:16px}@media (min-width: 931px){#search_autocomplete .cludo-sayt{width:100%;background-color:#fff;-webkit-box-shadow:0 2px 8px 0 rgba(0, 0, 0, 0.1);box-shadow:0 2px 8px 0 rgba(0, 0, 0, 0.1);margin:0;padding:0 16px;border:1px solid #d2d2d2}#search_autocomplete .cludo-sayt__suggestions{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;gap:12px;overflow-x:scroll;overflow-y:hidden}#search_autocomplete .cludo-sayt__suggestions-list{overflow:visible;padding:12px 0}#search_autocomplete .cludo-sayt__results{padding:0;display:grid;grid-template-columns:1fr 1fr}#search_autocomplete .cludo-sayt__main-search-categories{padding:1rem}#search_autocomplete .cludo-sayt__people-search-categories{border-left:1px solid #d2d2d2;padding:1rem}#search_autocomplete .cludo-sayt__people-search-categories>div{margin-top:0}#search_autocomplete .cludo-sayt__all-results{padding:16px 0}}#search_autocomplete .cludo-sayt__all-results a{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;gap:8px;width:-webkit-fit-content;width:-moz-fit-content;width:fit-content;margin:0 auto;border:none;background-color:#107eab;color:#fff;font-weight:700;font-size:1rem;padding:13px 16px;cursor:pointer}#search_autocomplete .cludo-sayt__all-results a:focus,#search_autocomplete .cludo-sayt__all-results a:hover{background:#005379}#search_autocomplete .cludo-sayt__other{padding:22px 0}#search_autocomplete .cludo-sayt__other h3{font-size:18px;letter-spacing:-0.56px;margin-bottom:7.5px}.cludo-sr-only{position:absolute;width:1px;height:1px;padding:0;overflow:hidden;clip:rect(0, 0, 0, 0);border:0}";
|
|
811
811
|
const HySiteSearchStyle0 = siteSearchCss;
|
|
812
812
|
|
|
813
813
|
const SiteSearch = class {
|
|
@@ -906,6 +906,9 @@ const SiteSearch = class {
|
|
|
906
906
|
// Without setTimeout it will not focus the input because it hasn't rendered yet.
|
|
907
907
|
setTimeout(() => {
|
|
908
908
|
const searchInput = this.el.shadowRoot.querySelector("input#search");
|
|
909
|
+
if (window.registerNavSearchInput && searchInput) {
|
|
910
|
+
window.registerNavSearchInput('#cludo-search-form input#search');
|
|
911
|
+
}
|
|
909
912
|
searchInput === null || searchInput === void 0 ? void 0 : searchInput.focus();
|
|
910
913
|
});
|
|
911
914
|
}
|
|
@@ -918,24 +921,24 @@ const SiteSearch = class {
|
|
|
918
921
|
render() {
|
|
919
922
|
const currentPageUrlPathName = window.location.pathname;
|
|
920
923
|
const searchPagePathNames = ["/fi/haku", "/en/search", "/sv/sök"];
|
|
921
|
-
return (h("div", { key: '
|
|
924
|
+
return (h("div", { key: '14308fcbac8e2b4c7e7b4a3393b8ddbc48ada624', class: {
|
|
922
925
|
"site-search": true,
|
|
923
926
|
"site-search__is-open": this.isSearchPanelOpen,
|
|
924
927
|
"is-group": this.isGroup,
|
|
925
|
-
} }, h("button", { key: '
|
|
928
|
+
} }, h("button", { key: '99285de74d03d93fae04aa14781f3465d4afa2dd', "aria-label": this.showLabel ? this._labels["open"] : "", "aria-expanded": `${this.isSearchPanelOpen}`, class: {
|
|
926
929
|
"button--search": true,
|
|
927
930
|
"is-open--menu": this.isAlternative,
|
|
928
931
|
"is-open": this.isSearchPanelOpen,
|
|
929
932
|
"is-active": searchPagePathNames.some((item) => item === currentPageUrlPathName),
|
|
930
|
-
}, onClick: (e) => this.handleSearchPanelToggle(e), disabled: searchPagePathNames.some((item) => item === currentPageUrlPathName) ? true : false }, this.showLabel ? (h("span", { class: { "button--search__label": true, "button--search__label__group": this.isGroup } }, this._labels["label"])) : (""), h("hy-icon", { key: '
|
|
933
|
+
}, onClick: (e) => this.handleSearchPanelToggle(e), disabled: searchPagePathNames.some((item) => item === currentPageUrlPathName) ? true : false }, this.showLabel ? (h("span", { class: { "button--search__label": true, "button--search__label__group": this.isGroup } }, this._labels["label"])) : (""), h("hy-icon", { key: 'f609b6379b4d3be08c203f7b00d6b231e7135e7d', icon: "hy-icon-search", size: this.size, fill: this.color })), (!this.isLuomusGroup && this.isSearchPanelOpen) && (h("div", { key: '77a1cb514c734d144a6e17e0f892edbe09508d9d', class: {
|
|
931
934
|
"site-search__panel": true,
|
|
932
935
|
"site-search__panel__is-open": this.isSearchPanelOpen,
|
|
933
|
-
}, "aria-hidden": `${!this.isSearchPanelOpen}` }, h("div", { key: '
|
|
936
|
+
}, "aria-hidden": `${!this.isSearchPanelOpen}` }, h("div", { key: 'f1d57468a0d5188b138854b44a68ad6b45c6aff5', class: "site-search__panel__content" }, h("div", { key: '5ac01fafec4b9b0bc210eb9ec6065275f819b077', class: "site-search__panel__wrapper" }, h("div", { key: 'f0d2267d4045c0398d251461f43e7361ff906e7d', class: "site-search__panel__title" }, h("div", { key: '858202623ac82e4cbc75d7d66e668c5996f7d1a9', class: "site-search__panel__title__group" }, h("span", { key: '1d6b1d760629248039847b6a64b3e33c5e7c4249', class: "panel-title" }, this.searchTitleLabel), h("div", { key: '430867474c934f0d562673c60064f0b648fa43a2', class: "description" }, this.searchDescriptionLabel))), h("div", { key: 'b081666de8a7e01d68f3ed067a01ee7c76efe340', id: "cludo-search-results", class: "container_12" }, h("div", { key: 'f00c982e682076d504b45a96e194bfd8fd031d5d', class: "search-banner" }), h("div", { key: 'b1e748ca993e15b8f9247d1e47ecc05f98b1be9d', class: "search-filters search-filters-mobile" }), h("div", { key: '361b42614a73eca060df72392c295e1442f3544b', class: "col-md-12" }, h("div", { key: '7f53b4d4a31fed81263c9681cb394d80111894a6', style: { margin: "20px 0 32px" }, id: "cludo-search-content-form" }, h("hy-search-field", { key: 'afd8412f607636cd8022feb96ad9a53021d6ba82', "input-id": "search", label: "" }))), h("div", { key: '209b848f4c5c16e51e4d78da3a394c3714861aa8', class: "col-md-3" }, h("div", { key: '5bf7e7a5d5218a11174758356c3fe8b9ef7b6e1e', class: "search-filters", "aria-controls": "search-results" })), h("div", { key: 'a801c5fdbb998e6c2dfa6457c25ff7ed18d6e561', class: "col-md-9" }, h("div", { key: '36e3d2b77d365ff50d2542f288d134769d9a77cd', class: "search-results-container" }, h("hy-paragraph-text", { key: '223f7604ab9a457ae375bb6bd81b7643450c384c' }, h("div", { key: '3315875631f74684d7416544462fc6804f213187', class: "search-result-count" })), h("div", { key: '645c792076ad5a67fa27907630518d47b2ff1796', class: "search-did-you-mean", role: "Complementary" }), h("div", { key: 'ce78be3a28bb44aa4a29cf7905c653ea6cfc14ea', class: "search-results", role: "region", id: "search-results", "aria-live": "polite" })))), this._searchTools && this._searchTools.length > 0 && (h("div", { key: '4a6f518bf6d40be1e82ff1bcbe9aee1d3575ebcd', class: "site-search__panel__tools" }, h("div", { key: 'a3cd2c0329258d5d7d0795aa0f2705badc679903', class: "title" }, this.searchToolsLabel), h("div", { key: 'd069bbf2cb1d48683b66c15359e5e97a2ea6eece', class: "list" }, this._searchTools.map((i) => {
|
|
934
937
|
let searchToolTarget = i.isExternal ? "_blank" : "_self";
|
|
935
938
|
return (h("a", { class: "search-special-tool", href: i.url, target: searchToolTarget }, h("hy-icon", { icon: "hy-icon-arrow-to-right", size: 24, fill: ColorVariant.black }), h("span", { class: "label" }, i.label), h("span", { class: "description" }, i.description)));
|
|
936
|
-
})))), h("button", { key: '
|
|
939
|
+
})))), h("button", { key: '06a6bdcec4873807cb9b08ff615842fc7409f0f7', onClick: () => this.closeSearchPanel(), class: {
|
|
937
940
|
"site-search__panel__panel-toggle": true,
|
|
938
|
-
}, "aria-label": this.searchCloseLabel, "aria-expanded": `${this.isSearchPanelOpen}` }, h("span", { key: '
|
|
941
|
+
}, "aria-label": this.searchCloseLabel, "aria-expanded": `${this.isSearchPanelOpen}` }, h("span", { key: 'ba2030a8c26279c9531018e9d7223ba1c389703e', class: "site-search__panel__panel-toggle__label" }, h("span", { key: 'ff78542648700dc2091aae9fb91021732571b7c1', class: "site-search__panel__panel-toggle__label__title", tabindex: "0" }, this.searchCloseLabel), h("hy-icon", { key: '77e09522c187f3a5a2c56c7e5570703c696547dc', icon: "hy-icon-remove", size: 16, fill: ColorVariant.black })))), h("div", { key: 'fba05c54c93798a58549aa126cffb676376821c7', class: "site-search__panel__space-box", onClick: () => this.closeSearchPanel() }))))));
|
|
939
942
|
}
|
|
940
943
|
get el() { return getElement(this); }
|
|
941
944
|
};
|