scb-wc 0.1.55 → 0.1.57
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.
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
const __vite__mapDeps=(i,m=__vite__mapDeps,d=(m.f||(m.f=["../scb-drawer/scb-drawer.js","../../vendor/decorate.js","../../vendor/vendor.js","../../vendor/vendor-lit.js","../scb-divider/scb-divider.js","../../vendor/assertClassBrand.js","../scb-menu/scb-menu.js","../scb-menu/scb-menu-item.js","../../vendor/preload-helper.js","../scb-chevron/scb-chevron.js","../scb-menu/scb-menu-section.js","../scb-menu/scb-sub-menu.js"])))=>i.map(i=>d[i]);
|
|
2
|
-
import"../../vendor/vendor-material.js";import{_ as
|
|
2
|
+
import"../../vendor/vendor-material.js";import{_ as E,b as P,g as I,h as c,m as x,v as f,y as g}from"../../vendor/vendor.js";import"../../vendor/vendor-lit.js";import{t as n}from"../../vendor/decorate.js";import"../scb-button/scb-button.js";import{t as M}from"../../vendor/preload-helper.js";import"../scb-icon-button/scb-icon-button.js";import"../scb-search/scb-search.js";import"../scb-dropdown/scb-dropdown.js";import"../scb-grid/scb-grid-item.js";import"../scb-grid/scb-grid.js";import"../scb-skeleton/scb-skeleton.js";(function(){try{var b=typeof globalThis<"u"?globalThis:window;if(!b.__scb_ce_guard_installed__){b.__scb_ce_guard_installed__=!0;var e=customElements.define.bind(customElements);customElements.define=function(t,s,r){try{customElements.get(t)||e(t,s,r)}catch(a){var i=String(a||"");if(i.indexOf("already been used")===-1&&i.indexOf("NotSupportedError")===-1)throw a}}}}catch{}})();var A,$,z=0,N=()=>{if(typeof window>"u"||typeof document>"u"||!("customElements"in window)||document.head.querySelector("style[data-scb-header-pre-upgrade]"))return;const b=document.createElement("style");b.setAttribute("data-scb-header-pre-upgrade",""),b.textContent=`
|
|
3
3
|
scb-header:not(:defined),
|
|
4
4
|
scb-header[data-upgrading] {
|
|
5
5
|
display: block;
|
|
@@ -50,24 +50,36 @@ import"../../vendor/vendor-material.js";import{_ as M,b as E,g as P,h as c,m as
|
|
|
50
50
|
);
|
|
51
51
|
}
|
|
52
52
|
}
|
|
53
|
-
`,document.head.appendChild(b);const e=l=>{const u=String(l??"").trim();if(u)return/^\d+$/.test(u)?`var(--spacing-${Math.max(0,Math.min(14,parseInt(u,10)))})`:u},t=l=>{const u=String(l??"").trim();if(!u)return!1;try{const p=JSON.parse(u);return Array.isArray(p)&&p.length>0}catch{return!1}},s=l=>l!=null&&!/^(false|0|off|no)$/i.test(l.trim()),r=l=>{for(const u of Array.from(l.children)){const p=u.tagName.toLowerCase();if(p==="scb-header-tab"||p==="scb-dropdown")return!0}return!1},i=l=>{r(l)||t(l.getAttribute("tabs"))||s(l.getAttribute("reserve-tabs"))||s(l.getAttribute("layout-pending"))?l.setAttribute("data-pre-has-tabs",""):l.removeAttribute("data-pre-has-tabs");const u=e(l.getAttribute("spacing")),p=e(l.getAttribute("spacing-top"))??u,y=e(l.getAttribute("spacing-bottom"))??u;p?l.style.setProperty("--scb-header-spacing-block-start",p):l.style.removeProperty("--scb-header-spacing-block-start"),y?l.style.setProperty("--scb-header-spacing-block-end",y):l.style.removeProperty("--scb-header-spacing-block-end");const h=(l.getAttribute("logo-width")??"").trim();h?l.style.setProperty("--scb-header-pre-logo-w",h):l.style.removeProperty("--scb-header-pre-logo-w");const _=(l.getAttribute("logo-height")??"").trim();_?l.style.setProperty("--scb-header-pre-logo-img-h",_):l.style.removeProperty("--scb-header-pre-logo-img-h");const g=(l.getAttribute("search-height")??"").trim();g?l.style.setProperty("--scb-header-pre-control-size",g):l.style.removeProperty("--scb-header-pre-control-size")};document.querySelectorAll("scb-header").forEach(i);const d=new MutationObserver(l=>{for(const u of l){if(u.type==="attributes"){const p=u.target;p instanceof HTMLElement&&p.tagName.toLowerCase()==="scb-header"&&i(p);continue}if(u.type==="childList"){const p=[...Array.from(u.addedNodes),...Array.from(u.removedNodes)];for(const y of p){if(!(y instanceof HTMLElement))continue;if(y.tagName.toLowerCase()==="scb-header"){i(y);continue}const h=y.closest?.("scb-header");h&&i(h)}}}});d.observe(document.documentElement,{subtree:!0,childList:!0,attributes:!0,attributeFilter:["tabs","spacing","spacing-top","spacing-bottom","logo-width","logo-height","logo-aspect-ratio","logo-alt","logotype-text","search-height","reserve-tabs","layout-pending"]}),customElements.whenDefined("scb-header").then(()=>{d.disconnect()})};N();var T={fromAttribute:b=>b==null?!0:!/^(false|0|off|no)$/i.test(b),toAttribute:b=>String(!!b)},A={fromAttribute:b=>b==null?!1:!/^(false|0|off|no)$/i.test(b),toAttribute:b=>b?"":null},z={fromAttribute:b=>b==="small"||b==="large"?b:"medium",toAttribute:b=>{const e=String(b??"");return e==="small"||e==="large"?e:null}},o=(S=class extends M{constructor(){super(),this.maxWidth="1440px",this.spacing=void 0,this.spacingTop=void 0,this.spacingBottom=void 0,this.size="medium",this.logoText="",this.logotypeText="",this.logoAlt="",this.logoHref="/",this.logoSrc="",this.logoWidth="",this.logoHeight="",this.logoAspectRatio="",this.logoInvertDm=!1,this.banner=!1,this.tabs=[],this.activeTab=null,this.reserveTabs=!1,this.layoutPending=!1,this.utilityItems=[],this.searchButtonLabel="Sök",this.menuButtonLabel="Meny",this.deferDrawer=!1,this.showDrawer=!0,this.alwaysShowMenuButton=!1,this.showSearch=!0,this.includeUtilityInMenu=!1,this.drawerOverlay=!0,this.searchText="",this._drawerId="main-drawer",this._menuExpanded=!1,this._searchId="header-search",this._drawerReady=!1,this._initialUpgradeComplete=!1,this._slotNavItems=[],this._slotUtils=[],this._slotMenu=[],this._measureScheduled=!1,this._scheduleMeasure=()=>{this.layoutPending||this._measureScheduled||(this._measureScheduled=!0,requestAnimationFrame(()=>{this._measureScheduled=!1,this._measure()}))},this._onWindowResize=()=>{this._scheduleMeasure()},this._onMenuSelect=t=>{const s=t.detail;this.dispatchEvent(new CustomEvent("scb-menu-select",{detail:s,bubbles:!0,composed:!0})),this.dispatchEvent(new CustomEvent("scbmenuselect",{detail:s,bubbles:!0,composed:!0}));const r=s?.item,i=typeof s?.href=="string"?s.href:typeof s?.itemHref=="string"?s.itemHref:typeof s?.item_href=="string"?s.item_href:"",a=r?r.getAttribute("item-href")??r.getAttribute("href")??"":"";String(i||a||"").trim()&&this._closeDrawerNow()},this._collapsed=!1,this._unlockAtWidth=0,this._hideLogoText=!1,this._logoTextUnlockAt=0,this._slotWatchers=[],this._harvestPending=!1,this._harvest=(t={})=>{const s=Array.from(this.children),r=[],i=[],a=[];let d=-1;const l=h=>({label:h.getAttribute("label")??"",href:h.getAttribute("href")??void 0,icon:h.getAttribute("icon")??void 0});for(const h of s){const _=h.tagName.toLowerCase();if(_==="scb-header-tab"){const g=h.getAttribute("label")??"",w=h.getAttribute("href"),v=w&&w.trim()!==""?w:void 0;(h.hasAttribute("selected")||h.getAttribute("selected")==="true"||h.getAttribute("active")==="true"||h.getAttribute("aria-current")==="page")&&d===-1&&(d=r.length),r.push({kind:"tab",label:g,href:v});continue}if(_==="scb-badge"){const g=h.querySelector("scb-dropdown");if(g){const w=g.getAttribute("label")??"";(g.hasAttribute("selected")||g.getAttribute("selected")==="true"||g.getAttribute("active")==="true"||g.getAttribute("aria-current")==="page")&&d===-1&&(d=r.length);const v=`scb-header-tab-${r.length}`;h.getAttribute("slot")!==v&&h.setAttribute("slot",v),g.hasAttribute("slot")&&g.removeAttribute("slot"),g.hasAttribute("as-tab")||g.setAttribute("as-tab",""),r.push({kind:"dropdown",slotName:v,label:w});continue}}if(_==="scb-dropdown"){const g=h.getAttribute("label")??"";(h.hasAttribute("selected")||h.getAttribute("selected")==="true"||h.getAttribute("active")==="true"||h.getAttribute("aria-current")==="page")&&d===-1&&(d=r.length);const w=`scb-header-tab-${r.length}`;h.getAttribute("slot")!==w&&h.setAttribute("slot",w),h.hasAttribute("as-tab")||h.setAttribute("as-tab",""),r.push({kind:"dropdown",slotName:w,label:g});continue}if(_==="scb-header-utility"){i.push({label:h.getAttribute("label")??"",href:h.getAttribute("href")??"#",target:h.getAttribute("target")??void 0});continue}if(_==="scb-header-menu-group"){const g={label:h.getAttribute("label")??"",icon:h.getAttribute("icon")??void 0,children:[]};h.querySelectorAll("scb-header-menu-item").forEach(w=>g.children.push(l(w))),a.push(g);continue}_==="scb-header-menu-item"&&a.push(l(h))}const u=!this._sameNavItems(this._slotNavItems,r),p=!this._sameUtilityItems(this._slotUtils,i),y=!this._sameMenuNodes(this._slotMenu,a);u&&(this._slotNavItems=r),p&&(this._slotUtils=i),y&&(this._slotMenu=a),!this.hasAttribute("active-tab")&&d>=0&&this.activeTab!==d&&(this.activeTab=d),(t.scheduleMeasure??!0)&&queueMicrotask(()=>{this.updateComplete.then(()=>{this._scheduleMeasure()})})},this._measure=()=>{if(this.layoutPending)return;const t=this._top,s=this._logoGroup;if(!t||!s)return;const r=window.innerWidth,i=t.clientWidth,a=this._overflows(this._util),d=this._tabsOverflows(),l=r<this.BP_MD||a||d;this._collapsed?!l&&i>=this._unlockAtWidth&&this._setCollapsed(!1):l&&(this._unlockAtWidth=i+this._HYST,this._setCollapsed(!0));let u=!1;if(this.showSearch&&r>=this.BP_SM&&r<this.BP_MD&&this._searchWrap){const y=getComputedStyle(this._searchWrap),h=Math.max(this._num(y.minWidth,this._tokenPx("--scb-header-search-min",250)),this._tokenPx("--scb-header-search-min",250)),_=this._num(getComputedStyle(t).gap,this._tokenPx("--spacing-7",24)),g=this.showDrawer&&(this.alwaysShowMenuButton||r<this.BP_MD||this._collapsed)?this._menuBtn?.getBoundingClientRect().width||this._tokenPx("--icon-size-extra-extra-large",48):0;u=s.getBoundingClientRect().width+_+h+_+g+8>i+.5}this._setHideSearch(u);let p=!1;if(this.showDrawer&&(this.alwaysShowMenuButton||r<this.BP_MD||this._collapsed)&&!this._visible(this._util)&&!this._visible(this._searchWrap)){const y=this._num(getComputedStyle(t).gap,this._tokenPx("--spacing-7",24)),h=this._menuBtn?.getBoundingClientRect().width||this._tokenPx("--icon-size-extra-extra-large",48),_=(this._logoGroup?.getBoundingClientRect().width||0)+y+h;this._hideLogoText?p=!(i>=this._logoTextUnlockAt):_>i+.5&&(p=!0,this._logoTextUnlockAt=i+this._HYST)}else p=!1,this._logoTextUnlockAt=0;this._setHideLogoText(p)},this._onDrawerOpened=()=>{this._menuExpanded=!0,this._syncMenuBtnAria(),this.dispatchEvent(new CustomEvent("drawer-open",{bubbles:!0,composed:!0})),this.dispatchEvent(new CustomEvent("draweropen",{bubbles:!0,composed:!0}))},this._onDrawerClosed=()=>{this._menuExpanded=!1,this._syncMenuBtnAria(),this.dispatchEvent(new CustomEvent("drawer-close",{bubbles:!0,composed:!0})),this.dispatchEvent(new CustomEvent("drawerclose",{bubbles:!0,composed:!0}))},this._onMenuClick=async t=>{this.showDrawer&&(this.dispatchEvent(new CustomEvent("menu-click",{bubbles:!0,composed:!0})),this.dispatchEvent(new CustomEvent("menuclick",{bubbles:!0,composed:!0})),!this._drawerReady&&(t.stopPropagation(),await this._ensureDrawerReady(),await this.updateComplete,this._openDrawerNow()))},this._onSearchClick=t=>{const s=this._searchEl;if(s?.submit&&typeof s.submit=="function"){s.submit();return}const r=s?.value??"";this.searchText=r,this.dispatchEvent(new CustomEvent("search-click",{detail:{value:r},bubbles:!0,composed:!0})),this.dispatchEvent(new CustomEvent("searchclick",{detail:{value:r},bubbles:!0,composed:!0})),s?.focus?.()},this._onTabClick=t=>{const s=t.currentTarget;if(!s)return;const r=s.tagName.toLowerCase()==="a";if(r&&(t.defaultPrevented||t.button!==0||t.metaKey||t.ctrlKey||t.shiftKey||t.altKey))return;const i=s.getAttribute("data-index"),a=i!=null?Number(i):0,d=this._getNavItems()[a];if(d?.kind==="dropdown")return;this.activeTab=a;const l=d?.kind==="tab"?d.href??"":"",u=new CustomEvent("tab-change",{detail:{index:a,href:l},bubbles:!0,composed:!0,cancelable:!0}),p=new CustomEvent("tabchange",{detail:{index:a,href:l},bubbles:!0,composed:!0,cancelable:!0});!(this.dispatchEvent(u)&&this.dispatchEvent(p))&&r&&t.preventDefault()},this._onDropdownTabActivate=t=>{const s=t.detail?.dataIndex,r=typeof s=="number"?s:typeof s=="string"?Number(s):this._readTabIndexFromEvent(t);if(r==null||!Number.isFinite(r))return;const i=this._getNavItems();r<0||r>=i.length||i[r]?.kind==="dropdown"&&(this.activeTab=r,this.dispatchEvent(new CustomEvent("tab-change",{detail:{index:r,href:""},bubbles:!0,composed:!0,cancelable:!0})),this.dispatchEvent(new CustomEvent("tabchange",{detail:{index:r,href:""},bubbles:!0,composed:!0,cancelable:!0})))},this._onTabsKeydown=t=>{const s=t.key;if(s!=="ArrowLeft"&&s!=="ArrowRight"&&s!=="Home"&&s!=="End")return;const r=this._getNavItems();if(!r.length)return;const i=this._readTabIndexFromEvent(t);if(i==null)return;let a=Math.max(0,Math.min(r.length-1,i));s==="ArrowRight"?a=(a+1)%r.length:s==="ArrowLeft"?a=(a-1+r.length)%r.length:s==="Home"?a=0:s==="End"&&(a=r.length-1),t.preventDefault(),this._focusTabAtIndex(a)},this._onSearchInput=t=>{this.searchText=t.detail?.value??"",this.dispatchEvent(new CustomEvent("search-input",{detail:{value:this.searchText},bubbles:!0,composed:!0})),this.dispatchEvent(new CustomEvent("searchinput",{detail:{value:this.searchText},bubbles:!0,composed:!0})),this.dispatchEvent(new CustomEvent("search-text-change",{detail:{value:this.searchText},bubbles:!0,composed:!0})),this.dispatchEvent(new CustomEvent("searchtextchange",{detail:{value:this.searchText},bubbles:!0,composed:!0}))},this._onSearchSubmit=t=>{this.searchText=t.detail?.value??"",this.dispatchEvent(new CustomEvent("search-change",{detail:{value:this.searchText,active:t.detail?.active},bubbles:!0,composed:!0})),this.dispatchEvent(new CustomEvent("searchchange",{detail:{value:this.searchText,active:t.detail?.active},bubbles:!0,composed:!0}))},this._onSearchClear=()=>{this.searchText="",this.dispatchEvent(new CustomEvent("search-text-change",{detail:{value:""},bubbles:!0,composed:!0})),this.dispatchEvent(new CustomEvent("searchtextchange",{detail:{value:""},bubbles:!0,composed:!0}))};const e=++I;this._drawerId=`scb-header-drawer-${e}`,this._searchId=`scb-header-search-${e}`}requestLayout(){this.layoutPending||(this.setAttribute("data-layout-settling",""),this.updateComplete.then(()=>{this.isConnected&&(this._measure(),this.removeAttribute("data-layout-settling"))}))}get _HYST(){return this._tokenPx("--spacing-11",64)}get BP_SM(){return this._tokenPx("--bp-sm",C.BP_SM_DEFAULT)}get BP_MD(){return this._tokenPx("--bp-md",C.BP_MD_DEFAULT)}_scheduleHarvest(){this._harvestPending||(this._harvestPending=!0,queueMicrotask(()=>{this._harvestPending=!1,this._harvest()}))}get _top(){return this.renderRoot.querySelector(".top-row")}get _util(){return this.renderRoot.querySelector(".utility")}get _logoGroup(){return this.renderRoot.querySelector(".logo-wrap")||this.renderRoot.querySelector(".logo-group")}get _searchWrap(){return this.renderRoot.querySelector(".search")}get _menuBtn(){return this.renderRoot.querySelector(".menu-trigger")}get _searchEl(){return this.renderRoot.querySelector(`#${this._searchId}`)}get _tabsNav(){return this.renderRoot.querySelector(".tabs-nav")}_attachSlotObservers(){this._slotMo?.disconnect(),this._slotWatchers.forEach(i=>i.disconnect()),this._slotWatchers=[];const e=["label","href","icon","target","selected","aria-current","active"],t=i=>{const a=new MutationObserver(d=>{this._scheduleHarvest()});this._slotWatchers.push(a),a.observe(i,{attributes:!0,attributeFilter:e})},s=()=>{this._slotWatchers.forEach(a=>a.disconnect()),this._slotWatchers=[];const i=Array.from(this.children);for(const a of i){const d=a.tagName.toLowerCase();if((d==="scb-header-tab"||d==="scb-dropdown"||d==="scb-header-utility"||d==="scb-header-menu-item"||d==="scb-header-menu-group"||d==="scb-badge")&&t(a),d==="scb-badge"){const l=a,u=new MutationObserver(y=>{s(),this._scheduleHarvest()});this._slotWatchers.push(u),u.observe(l,{childList:!0});const p=l.querySelector("scb-dropdown");p&&t(p);continue}if(d==="scb-header-menu-group"){const l=a,u=new MutationObserver(p=>{s(),this._scheduleHarvest()});this._slotWatchers.push(u),u.observe(l,{childList:!0,subtree:!0}),l.querySelectorAll("scb-header-menu-item").forEach(p=>t(p))}}},r=new MutationObserver(i=>{let a=!1;for(const d of i)if(d.type==="childList"){a=!0;break}a&&s(),this._scheduleHarvest()});this._slotMo=r,r.observe(this,{childList:!0}),s()}_sameNavItems(e,t){if(e.length!==t.length)return!1;for(let s=0;s<e.length;s+=1){const r=e[s],i=t[s];if(!r||!i||r.kind!==i.kind||r.label!==i.label)return!1;if(r.kind==="tab"&&i.kind==="tab"){if((r.href??"")!==(i.href??""))return!1}else if(r.kind==="dropdown"&&i.kind==="dropdown"&&r.slotName!==i.slotName)return!1}return!0}_sameUtilityItems(e,t){if(e.length!==t.length)return!1;for(let s=0;s<e.length;s+=1){const r=e[s],i=t[s];if(!r||!i||r.label!==i.label||r.href!==i.href||(r.target??"")!==(i.target??""))return!1}return!0}_sameMenuNodes(e,t){if(e.length!==t.length)return!1;for(let s=0;s<e.length;s+=1){const r=e[s],i=t[s];if(!r||!i||r.label!==i.label||(r.href??"")!==(i.href??"")||(r.icon??"")!==(i.icon??"")||!this._sameMenuNodes(r.children??[],i.children??[]))return!1}return!0}_setCollapsed(e){this._collapsed!==e&&(this._collapsed=e,e?this.setAttribute("data-collapsed",""):this.removeAttribute("data-collapsed"))}_setHideSearch(e){e?this.setAttribute("data-hide-search",""):this.removeAttribute("data-hide-search")}_setHideLogoText(e){this._hideLogoText!==e&&(this._hideLogoText=e,e?this.setAttribute("data-hide-logo-text",""):this.removeAttribute("data-hide-logo-text"))}_num(e,t){const s=Number.parseFloat(String(e??"").trim());return Number.isFinite(s)?s:t}_tokenPx(e,t){const s=getComputedStyle(this);return this._num(s.getPropertyValue(e),t)}_visible(e){return e?getComputedStyle(e).display!=="none":!1}_overflows(e){return!e||!this._visible(e)?!1:e.scrollWidth>e.clientWidth+1}_tabsOverflows(){const e=this._tabsNav;if(!e||!this._visible(e))return!1;const t=Array.from(e.querySelectorAll(".tab-wrap"));if(t.length===0)return!1;const s=e.getBoundingClientRect();let r=s.left;for(const i of t){const a=i.getBoundingClientRect();a.width<=0||a.right>r&&(r=a.right)}return r-s.left>s.width+1}connectedCallback(){super.connectedCallback(),this._initialUpgradeComplete||this.setAttribute("data-upgrading",""),this._harvest({scheduleMeasure:!1}),this._attachSlotObservers()}_finishInitialUpgrade(){this._initialUpgradeComplete||(this._initialUpgradeComplete=!0,requestAnimationFrame(()=>{this.isConnected&&(this._measure(),this.removeAttribute("data-upgrading"))}))}firstUpdated(){this.showDrawer&&!this.deferDrawer&&this._ensureDrawerReady(),this.updateComplete.then(()=>{this._harvest({scheduleMeasure:!1}),this._attachSlotObservers(),this._syncDropdownTabs(),this._finishInitialUpgrade()});const e=this._top;e&&(this._ro=new ResizeObserver(()=>this._scheduleMeasure()),this._ro.observe(e)),window.addEventListener("resize",this._onWindowResize,{passive:!0})}updated(e){e.has("searchMax")&&this.style.setProperty("--scb-header-search-max",this.searchMax??"380px"),e.has("searchMin")&&this.style.setProperty("--scb-header-search-min",this.searchMin??"250px"),e.has("searchHeight")&&(this.searchHeight&&this.searchHeight.trim()?this.style.setProperty("--scb-search-height",this.searchHeight.trim()):this.style.removeProperty("--scb-search-height")),(e.has("logoWidth")||e.has("logoHeight")||e.has("logoAspectRatio"))&&this._applyLogoSizing(),(e.has("spacing")||e.has("spacingTop")||e.has("spacingBottom"))&&this._applySpacing(),(e.has("utilityItems")||e.has("tabs")||e.has("logoText")||e.has("logotypeText")||e.has("logoSrc")||e.has("logoWidth")||e.has("logoHeight")||e.has("logoAspectRatio")||e.has("activeTab")||e.has("_slotNavItems")||e.has("_slotUtils")||e.has("_slotMenu")||e.has("showDrawer")||e.has("alwaysShowMenuButton")||e.has("showSearch")||e.has("layoutPending")||e.has("searchMax")||e.has("searchMin")||e.has("size"))&&this.updateComplete.then(()=>{this._scheduleMeasure()}),(e.has("showDrawer")||e.has("deferDrawer"))&&this.showDrawer&&!this.deferDrawer&&this._ensureDrawerReady(),e.has("layoutPending")&&!this.layoutPending&&this.requestLayout(),(e.has("activeTab")||e.has("_slotNavItems")||e.has("tabs")||e.has("size"))&&this.updateComplete.then(()=>{this._syncDropdownTabs()})}disconnectedCallback(){this._ro?.disconnect(),this._slotMo?.disconnect(),this._slotWatchers.forEach(e=>e.disconnect()),this._slotWatchers=[],window.removeEventListener("resize",this._onWindowResize),super.disconnectedCallback()}_mapSpacingToken(e){if(!e)return;const t=String(e).trim();if(t)return/^\d+$/.test(t)?`var(--spacing-${Math.max(0,Math.min(14,parseInt(t,10)))})`:t}_applySpacing(){const e=this._mapSpacingToken(this.spacing),t=this._mapSpacingToken(this.spacingTop)??e,s=this._mapSpacingToken(this.spacingBottom)??e;t?this.style.setProperty("--scb-header-spacing-block-start",t):this.style.removeProperty("--scb-header-spacing-block-start"),s?this.style.setProperty("--scb-header-spacing-block-end",s):this.style.removeProperty("--scb-header-spacing-block-end")}_applyLogoSizing(){const e=(this.logoWidth??"").trim(),t=(this.logoHeight??"").trim(),s=(this.logoAspectRatio??"").trim();e?this.style.setProperty("--scb-header-logo-img-w",e):this.style.removeProperty("--scb-header-logo-img-w"),t?this.style.setProperty("--scb-header-logo-img-h",t):e?this.style.setProperty("--scb-header-logo-img-h","auto"):this.style.removeProperty("--scb-header-logo-img-h"),s?this.style.setProperty("--scb-header-logo-img-aspect-ratio",s):this.style.removeProperty("--scb-header-logo-img-aspect-ratio")}_closeDrawerNow(){const e=this.renderRoot.querySelector(`#${this._drawerId}`);e&&(e.open=!1)}_openDrawerNow(){const e=this.renderRoot.querySelector(`#${this._drawerId}`);e&&(e.open=!0)}async _ensureDrawerReady(){this._drawerReady||(this._drawerImportPromise??(this._drawerImportPromise=Promise.all([$(()=>import("../scb-drawer/scb-drawer.js"),__vite__mapDeps([0,1,2,3,4,5]),import.meta.url),$(()=>import("../scb-menu/scb-menu.js"),__vite__mapDeps([6,5,1,2,3,4,7,8,9,10,11]),import.meta.url)]).then(()=>{})),await this._drawerImportPromise,this._drawerReady=!0)}_syncMenuBtnAria(){this.renderRoot.querySelectorAll(".menu-trigger").forEach(e=>{e.setAttribute("aria-expanded",String(this._menuExpanded))})}_getNavItems(){return this._slotNavItems.length?this._slotNavItems:(this.tabs??[]).map(e=>({kind:"tab",...e}))}_getDropdownForSlot(e){const t=this.querySelector(`[slot="${e}"]`);return t?t.tagName.toLowerCase()==="scb-dropdown"?t:t.querySelector("scb-dropdown"):null}_syncDropdownTabs(){this._getNavItems().forEach((e,t)=>{if(e.kind!=="dropdown")return;const s=this._getDropdownForSlot(e.slotName);if(!s)return;const r=String(t);s.getAttribute("data-index")!==r&&s.setAttribute("data-index",r),s.hasAttribute("as-tab")||s.setAttribute("as-tab","");const i=this.size,a=s;a?.size!==i&&(a.size=i),t===this.activeTab?s.getAttribute("aria-current")!=="page"&&s.setAttribute("aria-current","page"):s.hasAttribute("aria-current")&&s.removeAttribute("aria-current")})}_readTabIndexFromEvent(e){const t=e.composedPath?e.composedPath():[];for(const s of t){if(!(s instanceof HTMLElement))continue;const r=s.getAttribute("data-index");if(r==null)continue;const i=Number(r);if(Number.isFinite(i))return i}return null}_focusTabAtIndex(e){const t=this._getNavItems()[e];if(t){if(t.kind==="dropdown"){this._getDropdownForSlot(t.slotName)?.focus?.();return}this.renderRoot.querySelector(`.tab-link[data-index="${e}"]`)?.focus?.()}}_renderMenuNodes(e){return!e||e.length===0?m``:m`${e.map(t=>this._renderMenuNode(t))}`}_renderMenuNode(e){const t=Array.isArray(e.children)&&e.children.length>0,s=(e.href??"").trim(),r=(e.icon??"").trim();return m`
|
|
53
|
+
`,document.head.appendChild(b);const e=l=>{const u=String(l??"").trim();if(u)return/^\d+$/.test(u)?`var(--spacing-${Math.max(0,Math.min(14,parseInt(u,10)))})`:u},t=l=>{const u=String(l??"").trim();if(!u)return!1;try{const p=JSON.parse(u);return Array.isArray(p)&&p.length>0}catch{return!1}},s=l=>l!=null&&!/^(false|0|off|no)$/i.test(l.trim()),r=l=>{for(const u of Array.from(l.children)){const p=u.tagName.toLowerCase();if(p==="scb-header-tab"||p==="scb-dropdown")return!0}return!1},i=l=>{r(l)||t(l.getAttribute("tabs"))||s(l.getAttribute("reserve-tabs"))||s(l.getAttribute("layout-pending"))?l.setAttribute("data-pre-has-tabs",""):l.removeAttribute("data-pre-has-tabs");const u=e(l.getAttribute("spacing")),p=e(l.getAttribute("spacing-top"))??u,v=e(l.getAttribute("spacing-bottom"))??u;p?l.style.setProperty("--scb-header-spacing-block-start",p):l.style.removeProperty("--scb-header-spacing-block-start"),v?l.style.setProperty("--scb-header-spacing-block-end",v):l.style.removeProperty("--scb-header-spacing-block-end");const h=(l.getAttribute("logo-width")??"").trim();h?l.style.setProperty("--scb-header-pre-logo-w",h):l.style.removeProperty("--scb-header-pre-logo-w");const y=(l.getAttribute("logo-height")??"").trim();y?l.style.setProperty("--scb-header-pre-logo-img-h",y):l.style.removeProperty("--scb-header-pre-logo-img-h");const m=(l.getAttribute("search-height")??"").trim();m?l.style.setProperty("--scb-header-pre-control-size",m):l.style.removeProperty("--scb-header-pre-control-size")};document.querySelectorAll("scb-header").forEach(i);const d=new MutationObserver(l=>{for(const u of l){if(u.type==="attributes"){const p=u.target;p instanceof HTMLElement&&p.tagName.toLowerCase()==="scb-header"&&i(p);continue}if(u.type==="childList"){const p=[...Array.from(u.addedNodes),...Array.from(u.removedNodes)];for(const v of p){if(!(v instanceof HTMLElement))continue;if(v.tagName.toLowerCase()==="scb-header"){i(v);continue}const h=v.closest?.("scb-header");h&&i(h)}}}});d.observe(document.documentElement,{subtree:!0,childList:!0,attributes:!0,attributeFilter:["tabs","spacing","spacing-top","spacing-bottom","logo-width","logo-height","logo-aspect-ratio","logo-alt","logotype-text","search-height","reserve-tabs","layout-pending"]}),customElements.whenDefined("scb-header").then(()=>{d.disconnect()})};N();var T={fromAttribute:b=>b==null?!0:!/^(false|0|off|no)$/i.test(b),toAttribute:b=>String(!!b)},k={fromAttribute:b=>b==null?!1:!/^(false|0|off|no)$/i.test(b),toAttribute:b=>b?"":null},D={fromAttribute:b=>b==="small"||b==="large"?b:"medium",toAttribute:b=>{const e=String(b??"");return e==="small"||e==="large"?e:null}},o=(A=class extends E{constructor(){super(),this.maxWidth="1440px",this.spacing=void 0,this.spacingTop=void 0,this.spacingBottom=void 0,this.size="medium",this.logoText="",this.logotypeText="",this.logoAlt="",this.logoHref="/",this.logoSrc="",this.logoWidth="",this.logoHeight="",this.logoAspectRatio="",this.logoInvertDm=!1,this.banner=!1,this.tabs=[],this.activeTab=null,this.reserveTabs=!1,this.layoutPending=!1,this.utilityItems=[],this.searchButtonLabel="Sök",this.menuButtonLabel="Meny",this.deferDrawer=!1,this.showDrawer=!0,this.alwaysShowMenuButton=!1,this.showSearch=!0,this.includeUtilityInMenu=!1,this.drawerOverlay=!0,this.searchText="",this._drawerId="main-drawer",this._menuExpanded=!1,this._searchId="header-search",this._drawerReady=!1,this._mobileSearchOpen=!1,this._initialUpgradeComplete=!1,this._slotNavItems=[],this._slotUtils=[],this._slotMenu=[],this._measureScheduled=!1,this._scheduleMeasure=()=>{this.layoutPending||this._measureScheduled||(this._measureScheduled=!0,requestAnimationFrame(()=>{this._measureScheduled=!1,this._measure()}))},this._onWindowResize=()=>{window.innerWidth>=this.BP_SM&&this._mobileSearchOpen&&this._setMobileSearchOpen(!1),this._scheduleMeasure()},this._onMenuSelect=t=>{const s=t.detail;this.dispatchEvent(new CustomEvent("scb-menu-select",{detail:s,bubbles:!0,composed:!0})),this.dispatchEvent(new CustomEvent("scbmenuselect",{detail:s,bubbles:!0,composed:!0}));const r=s?.item,i=typeof s?.href=="string"?s.href:typeof s?.itemHref=="string"?s.itemHref:typeof s?.item_href=="string"?s.item_href:"",a=r?r.getAttribute("item-href")??r.getAttribute("href")??"":"";String(i||a||"").trim()&&this._closeDrawerNow()},this._collapsed=!1,this._unlockAtWidth=0,this._hideLogoText=!1,this._logoTextUnlockAt=0,this._slotWatchers=[],this._harvestPending=!1,this._harvest=(t={})=>{const s=Array.from(this.children),r=[],i=[],a=[];let d=-1;const l=h=>({label:h.getAttribute("label")??"",href:h.getAttribute("href")??void 0,icon:h.getAttribute("icon")??void 0});for(const h of s){const y=h.tagName.toLowerCase();if(y==="scb-header-tab"){const m=h.getAttribute("label")??"",_=h.getAttribute("href"),S=_&&_.trim()!==""?_:void 0;(h.hasAttribute("selected")||h.getAttribute("selected")==="true"||h.getAttribute("active")==="true"||h.getAttribute("aria-current")==="page")&&d===-1&&(d=r.length),r.push({kind:"tab",label:m,href:S});continue}if(y==="scb-badge"){const m=h.querySelector("scb-dropdown");if(m){const _=m.getAttribute("label")??"";(m.hasAttribute("selected")||m.getAttribute("selected")==="true"||m.getAttribute("active")==="true"||m.getAttribute("aria-current")==="page")&&d===-1&&(d=r.length);const S=`scb-header-tab-${r.length}`;h.getAttribute("slot")!==S&&h.setAttribute("slot",S),m.hasAttribute("slot")&&m.removeAttribute("slot"),m.hasAttribute("as-tab")||m.setAttribute("as-tab",""),r.push({kind:"dropdown",slotName:S,label:_});continue}}if(y==="scb-dropdown"){const m=h.getAttribute("label")??"";(h.hasAttribute("selected")||h.getAttribute("selected")==="true"||h.getAttribute("active")==="true"||h.getAttribute("aria-current")==="page")&&d===-1&&(d=r.length);const _=`scb-header-tab-${r.length}`;h.getAttribute("slot")!==_&&h.setAttribute("slot",_),h.hasAttribute("as-tab")||h.setAttribute("as-tab",""),r.push({kind:"dropdown",slotName:_,label:m});continue}if(y==="scb-header-utility"){i.push({label:h.getAttribute("label")??"",href:h.getAttribute("href")??"#",target:h.getAttribute("target")??void 0});continue}if(y==="scb-header-menu-group"){const m={label:h.getAttribute("label")??"",icon:h.getAttribute("icon")??void 0,children:[]};h.querySelectorAll("scb-header-menu-item").forEach(_=>m.children.push(l(_))),a.push(m);continue}y==="scb-header-menu-item"&&a.push(l(h))}const u=!this._sameNavItems(this._slotNavItems,r),p=!this._sameUtilityItems(this._slotUtils,i),v=!this._sameMenuNodes(this._slotMenu,a);u&&(this._slotNavItems=r),p&&(this._slotUtils=i),v&&(this._slotMenu=a),!this.hasAttribute("active-tab")&&d>=0&&this.activeTab!==d&&(this.activeTab=d),(t.scheduleMeasure??!0)&&queueMicrotask(()=>{this.updateComplete.then(()=>{this._scheduleMeasure()})})},this._measure=()=>{if(this.layoutPending)return;const t=this._top,s=this._logoGroup;if(!t||!s)return;const r=window.innerWidth,i=t.clientWidth,a=this._overflows(this._util),d=this._tabsOverflows(),l=r<this.BP_MD||a||d;this._collapsed?!l&&i>=this._unlockAtWidth&&this._setCollapsed(!1):l&&(this._unlockAtWidth=i+this._HYST,this._setCollapsed(!0));let u=!1;if(this.showSearch&&r>=this.BP_SM&&r<this.BP_MD&&this._searchWrap){const v=getComputedStyle(this._searchWrap),h=Math.max(this._num(v.minWidth,this._tokenPx("--scb-header-search-min",250)),this._tokenPx("--scb-header-search-min",250)),y=this._num(getComputedStyle(t).gap,this._tokenPx("--spacing-7",24)),m=this.showDrawer&&(this.alwaysShowMenuButton||r<this.BP_MD||this._collapsed)?this._menuBtn?.getBoundingClientRect().width||this._tokenPx("--icon-size-extra-extra-large",48):0;u=s.getBoundingClientRect().width+y+h+y+m+8>i+.5}this._setHideSearch(u);let p=!1;if(this.showDrawer&&(this.alwaysShowMenuButton||r<this.BP_MD||this._collapsed)&&!this._visible(this._util)&&!this._visible(this._searchWrap)){const v=this._num(getComputedStyle(t).gap,this._tokenPx("--spacing-7",24)),h=this._menuBtn?.getBoundingClientRect().width||this._tokenPx("--icon-size-extra-extra-large",48),y=(this._logoGroup?.getBoundingClientRect().width||0)+v+h;this._hideLogoText?p=!(i>=this._logoTextUnlockAt):y>i+.5&&(p=!0,this._logoTextUnlockAt=i+this._HYST)}else p=!1,this._logoTextUnlockAt=0;this._setHideLogoText(p)},this._onDrawerOpened=()=>{this._menuExpanded=!0,this._syncMenuBtnAria(),this.dispatchEvent(new CustomEvent("drawer-open",{bubbles:!0,composed:!0})),this.dispatchEvent(new CustomEvent("draweropen",{bubbles:!0,composed:!0}))},this._onDrawerClosed=()=>{this._menuExpanded=!1,this._syncMenuBtnAria(),this.dispatchEvent(new CustomEvent("drawer-close",{bubbles:!0,composed:!0})),this.dispatchEvent(new CustomEvent("drawerclose",{bubbles:!0,composed:!0}))},this._onMenuClick=async t=>{this.showDrawer&&(this._setMobileSearchOpen(!1),this.dispatchEvent(new CustomEvent("menu-click",{bubbles:!0,composed:!0})),this.dispatchEvent(new CustomEvent("menuclick",{bubbles:!0,composed:!0})),!this._drawerReady&&(t.stopPropagation(),await this._ensureDrawerReady(),await this.updateComplete,this._openDrawerNow()))},this._onSearchClick=t=>{const s=this._searchEl;if(s?.submit&&typeof s.submit=="function"){s.submit();return}const r=s?.value??"";this.searchText=r,this.dispatchEvent(new CustomEvent("search-click",{detail:{value:r},bubbles:!0,composed:!0})),this.dispatchEvent(new CustomEvent("searchclick",{detail:{value:r},bubbles:!0,composed:!0})),s?.focus?.()},this._onMobileSearchToggle=()=>{const t=!this._mobileSearchOpen;this._setMobileSearchOpen(t),t&&this.updateComplete.then(()=>{this.renderRoot.querySelector(".mobile-search-panel scb-search")?.focus?.()})},this._onTabClick=t=>{const s=t.currentTarget;if(!s)return;const r=s.tagName.toLowerCase()==="a";if(r&&(t.defaultPrevented||t.button!==0||t.metaKey||t.ctrlKey||t.shiftKey||t.altKey))return;const i=s.getAttribute("data-index"),a=i!=null?Number(i):0,d=this._getNavItems()[a];if(d?.kind==="dropdown")return;this.activeTab=a;const l=d?.kind==="tab"?d.href??"":"",u=new CustomEvent("tab-change",{detail:{index:a,href:l},bubbles:!0,composed:!0,cancelable:!0}),p=new CustomEvent("tabchange",{detail:{index:a,href:l},bubbles:!0,composed:!0,cancelable:!0});!(this.dispatchEvent(u)&&this.dispatchEvent(p))&&r&&t.preventDefault()},this._onDropdownTabActivate=t=>{const s=t.detail?.dataIndex,r=typeof s=="number"?s:typeof s=="string"?Number(s):this._readTabIndexFromEvent(t);if(r==null||!Number.isFinite(r))return;const i=this._getNavItems();r<0||r>=i.length||i[r]?.kind==="dropdown"&&(this.activeTab=r,this.dispatchEvent(new CustomEvent("tab-change",{detail:{index:r,href:""},bubbles:!0,composed:!0,cancelable:!0})),this.dispatchEvent(new CustomEvent("tabchange",{detail:{index:r,href:""},bubbles:!0,composed:!0,cancelable:!0})))},this._onTabsKeydown=t=>{const s=t.key;if(s!=="ArrowLeft"&&s!=="ArrowRight"&&s!=="Home"&&s!=="End")return;const r=this._getNavItems();if(!r.length)return;const i=this._readTabIndexFromEvent(t);if(i==null)return;let a=Math.max(0,Math.min(r.length-1,i));s==="ArrowRight"?a=(a+1)%r.length:s==="ArrowLeft"?a=(a-1+r.length)%r.length:s==="Home"?a=0:s==="End"&&(a=r.length-1),t.preventDefault(),this._focusTabAtIndex(a)},this._onSearchInput=t=>{this.searchText=t.detail?.value??"",this.dispatchEvent(new CustomEvent("search-input",{detail:{value:this.searchText},bubbles:!0,composed:!0})),this.dispatchEvent(new CustomEvent("searchinput",{detail:{value:this.searchText},bubbles:!0,composed:!0})),this.dispatchEvent(new CustomEvent("search-text-change",{detail:{value:this.searchText},bubbles:!0,composed:!0})),this.dispatchEvent(new CustomEvent("searchtextchange",{detail:{value:this.searchText},bubbles:!0,composed:!0}))},this._onSearchSubmit=t=>{this.searchText=t.detail?.value??"",this.dispatchEvent(new CustomEvent("search-change",{detail:{value:this.searchText,active:t.detail?.active},bubbles:!0,composed:!0})),this.dispatchEvent(new CustomEvent("searchchange",{detail:{value:this.searchText,active:t.detail?.active},bubbles:!0,composed:!0}))},this._onSearchClear=()=>{this.searchText="",this.dispatchEvent(new CustomEvent("search-text-change",{detail:{value:""},bubbles:!0,composed:!0})),this.dispatchEvent(new CustomEvent("searchtextchange",{detail:{value:""},bubbles:!0,composed:!0}))};const e=++z;this._drawerId=`scb-header-drawer-${e}`,this._searchId=`scb-header-search-${e}`}requestLayout(){this.layoutPending||(this.setAttribute("data-layout-settling",""),this.updateComplete.then(()=>{this.isConnected&&(this._measure(),this.removeAttribute("data-layout-settling"))}))}get _HYST(){return this._tokenPx("--spacing-11",64)}get BP_SM(){return this._tokenPx("--bp-sm",$.BP_SM_DEFAULT)}get BP_MD(){return this._tokenPx("--bp-md",$.BP_MD_DEFAULT)}_scheduleHarvest(){this._harvestPending||(this._harvestPending=!0,queueMicrotask(()=>{this._harvestPending=!1,this._harvest()}))}get _top(){return this.renderRoot.querySelector(".top-row")}get _util(){return this.renderRoot.querySelector(".utility")}get _logoGroup(){return this.renderRoot.querySelector(".logo-wrap")||this.renderRoot.querySelector(".logo-group")}get _searchWrap(){return this.renderRoot.querySelector(".search")}get _menuBtn(){return this.renderRoot.querySelector(".menu-trigger")}get _searchEl(){return this.renderRoot.querySelector(`#${this._searchId}`)}get _tabsNav(){return this.renderRoot.querySelector(".tabs-nav")}_attachSlotObservers(){this._slotMo?.disconnect(),this._slotWatchers.forEach(i=>i.disconnect()),this._slotWatchers=[];const e=["label","href","icon","target","selected","aria-current","active"],t=i=>{const a=new MutationObserver(d=>{this._scheduleHarvest()});this._slotWatchers.push(a),a.observe(i,{attributes:!0,attributeFilter:e})},s=()=>{this._slotWatchers.forEach(a=>a.disconnect()),this._slotWatchers=[];const i=Array.from(this.children);for(const a of i){const d=a.tagName.toLowerCase();if((d==="scb-header-tab"||d==="scb-dropdown"||d==="scb-header-utility"||d==="scb-header-menu-item"||d==="scb-header-menu-group"||d==="scb-badge")&&t(a),d==="scb-badge"){const l=a,u=new MutationObserver(v=>{s(),this._scheduleHarvest()});this._slotWatchers.push(u),u.observe(l,{childList:!0});const p=l.querySelector("scb-dropdown");p&&t(p);continue}if(d==="scb-header-menu-group"){const l=a,u=new MutationObserver(p=>{s(),this._scheduleHarvest()});this._slotWatchers.push(u),u.observe(l,{childList:!0,subtree:!0}),l.querySelectorAll("scb-header-menu-item").forEach(p=>t(p))}}},r=new MutationObserver(i=>{let a=!1;for(const d of i)if(d.type==="childList"){a=!0;break}a&&s(),this._scheduleHarvest()});this._slotMo=r,r.observe(this,{childList:!0}),s()}_sameNavItems(e,t){if(e.length!==t.length)return!1;for(let s=0;s<e.length;s+=1){const r=e[s],i=t[s];if(!r||!i||r.kind!==i.kind||r.label!==i.label)return!1;if(r.kind==="tab"&&i.kind==="tab"){if((r.href??"")!==(i.href??""))return!1}else if(r.kind==="dropdown"&&i.kind==="dropdown"&&r.slotName!==i.slotName)return!1}return!0}_sameUtilityItems(e,t){if(e.length!==t.length)return!1;for(let s=0;s<e.length;s+=1){const r=e[s],i=t[s];if(!r||!i||r.label!==i.label||r.href!==i.href||(r.target??"")!==(i.target??""))return!1}return!0}_sameMenuNodes(e,t){if(e.length!==t.length)return!1;for(let s=0;s<e.length;s+=1){const r=e[s],i=t[s];if(!r||!i||r.label!==i.label||(r.href??"")!==(i.href??"")||(r.icon??"")!==(i.icon??"")||!this._sameMenuNodes(r.children??[],i.children??[]))return!1}return!0}_setCollapsed(e){this._collapsed!==e&&(this._collapsed=e,e?this.setAttribute("data-collapsed",""):this.removeAttribute("data-collapsed"))}_setHideSearch(e){e?this.setAttribute("data-hide-search",""):this.removeAttribute("data-hide-search")}_setHideLogoText(e){this._hideLogoText!==e&&(this._hideLogoText=e,e?this.setAttribute("data-hide-logo-text",""):this.removeAttribute("data-hide-logo-text"))}_setMobileSearchOpen(e){this._mobileSearchOpen!==e&&(this._mobileSearchOpen=e,this.toggleAttribute("data-mobile-search-open",e))}_num(e,t){const s=Number.parseFloat(String(e??"").trim());return Number.isFinite(s)?s:t}_tokenPx(e,t){const s=getComputedStyle(this);return this._num(s.getPropertyValue(e),t)}_visible(e){return e?getComputedStyle(e).display!=="none":!1}_overflows(e){return!e||!this._visible(e)?!1:e.scrollWidth>e.clientWidth+1}_tabsOverflows(){const e=this._tabsNav;if(!e||!this._visible(e))return!1;const t=Array.from(e.querySelectorAll(".tab-wrap"));if(t.length===0)return!1;const s=e.getBoundingClientRect();let r=s.left;for(const i of t){const a=i.getBoundingClientRect();a.width<=0||a.right>r&&(r=a.right)}return r-s.left>s.width+1}connectedCallback(){super.connectedCallback(),this._initialUpgradeComplete||this.setAttribute("data-upgrading",""),this._harvest({scheduleMeasure:!1}),this._attachSlotObservers()}_finishInitialUpgrade(){this._initialUpgradeComplete||(this._initialUpgradeComplete=!0,requestAnimationFrame(()=>{this.isConnected&&(this._measure(),this.removeAttribute("data-upgrading"))}))}firstUpdated(){this.showDrawer&&!this.deferDrawer&&this._ensureDrawerReady(),this.updateComplete.then(()=>{this._harvest({scheduleMeasure:!1}),this._attachSlotObservers(),this._syncDropdownTabs(),this._finishInitialUpgrade()});const e=this._top;e&&(this._ro=new ResizeObserver(()=>this._scheduleMeasure()),this._ro.observe(e)),window.addEventListener("resize",this._onWindowResize,{passive:!0})}updated(e){e.has("searchMax")&&this.style.setProperty("--scb-header-search-max",this.searchMax??"380px"),e.has("searchMin")&&this.style.setProperty("--scb-header-search-min",this.searchMin??"250px"),e.has("searchHeight")&&(this.searchHeight&&this.searchHeight.trim()?this.style.setProperty("--scb-search-height",this.searchHeight.trim()):this.style.removeProperty("--scb-search-height")),(e.has("logoWidth")||e.has("logoHeight")||e.has("logoAspectRatio"))&&this._applyLogoSizing(),(e.has("spacing")||e.has("spacingTop")||e.has("spacingBottom"))&&this._applySpacing(),(e.has("utilityItems")||e.has("tabs")||e.has("logoText")||e.has("logotypeText")||e.has("logoSrc")||e.has("logoWidth")||e.has("logoHeight")||e.has("logoAspectRatio")||e.has("activeTab")||e.has("_slotNavItems")||e.has("_slotUtils")||e.has("_slotMenu")||e.has("showDrawer")||e.has("alwaysShowMenuButton")||e.has("showSearch")||e.has("layoutPending")||e.has("searchMax")||e.has("searchMin")||e.has("size"))&&this.updateComplete.then(()=>{this._scheduleMeasure()}),(e.has("showDrawer")||e.has("deferDrawer"))&&this.showDrawer&&!this.deferDrawer&&this._ensureDrawerReady(),e.has("showSearch")&&!this.showSearch&&this._setMobileSearchOpen(!1),e.has("layoutPending")&&!this.layoutPending&&this.requestLayout(),(e.has("activeTab")||e.has("_slotNavItems")||e.has("tabs")||e.has("size"))&&this.updateComplete.then(()=>{this._syncDropdownTabs()})}disconnectedCallback(){this._ro?.disconnect(),this._slotMo?.disconnect(),this._slotWatchers.forEach(e=>e.disconnect()),this._slotWatchers=[],window.removeEventListener("resize",this._onWindowResize),super.disconnectedCallback()}_mapSpacingToken(e){if(!e)return;const t=String(e).trim();if(t)return/^\d+$/.test(t)?`var(--spacing-${Math.max(0,Math.min(14,parseInt(t,10)))})`:t}_applySpacing(){const e=this._mapSpacingToken(this.spacing),t=this._mapSpacingToken(this.spacingTop)??e,s=this._mapSpacingToken(this.spacingBottom)??e;t?this.style.setProperty("--scb-header-spacing-block-start",t):this.style.removeProperty("--scb-header-spacing-block-start"),s?this.style.setProperty("--scb-header-spacing-block-end",s):this.style.removeProperty("--scb-header-spacing-block-end")}_applyLogoSizing(){const e=(this.logoWidth??"").trim(),t=(this.logoHeight??"").trim(),s=(this.logoAspectRatio??"").trim();e?this.style.setProperty("--scb-header-logo-img-w",e):this.style.removeProperty("--scb-header-logo-img-w"),t?this.style.setProperty("--scb-header-logo-img-h",t):e?this.style.setProperty("--scb-header-logo-img-h","auto"):this.style.removeProperty("--scb-header-logo-img-h"),s?this.style.setProperty("--scb-header-logo-img-aspect-ratio",s):this.style.removeProperty("--scb-header-logo-img-aspect-ratio")}_closeDrawerNow(){const e=this.renderRoot.querySelector(`#${this._drawerId}`);e&&(e.open=!1)}_openDrawerNow(){const e=this.renderRoot.querySelector(`#${this._drawerId}`);e&&(e.open=!0)}async _ensureDrawerReady(){this._drawerReady||(this._drawerImportPromise??(this._drawerImportPromise=Promise.all([M(()=>import("../scb-drawer/scb-drawer.js"),__vite__mapDeps([0,1,2,3,4,5]),import.meta.url),M(()=>import("../scb-menu/scb-menu.js"),__vite__mapDeps([6,5,1,2,3,4,7,8,9,10,11]),import.meta.url)]).then(()=>{})),await this._drawerImportPromise,this._drawerReady=!0)}_syncMenuBtnAria(){this.renderRoot.querySelectorAll(".menu-trigger").forEach(e=>{e.setAttribute("aria-expanded",String(this._menuExpanded))})}_getNavItems(){return this._slotNavItems.length?this._slotNavItems:(this.tabs??[]).map(e=>({kind:"tab",...e}))}_getDropdownForSlot(e){const t=this.querySelector(`[slot="${e}"]`);return t?t.tagName.toLowerCase()==="scb-dropdown"?t:t.querySelector("scb-dropdown"):null}_syncDropdownTabs(){this._getNavItems().forEach((e,t)=>{if(e.kind!=="dropdown")return;const s=this._getDropdownForSlot(e.slotName);if(!s)return;const r=String(t);s.getAttribute("data-index")!==r&&s.setAttribute("data-index",r),s.hasAttribute("as-tab")||s.setAttribute("as-tab","");const i=this.size,a=s;a?.size!==i&&(a.size=i),t===this.activeTab?s.getAttribute("aria-current")!=="page"&&s.setAttribute("aria-current","page"):s.hasAttribute("aria-current")&&s.removeAttribute("aria-current")})}_readTabIndexFromEvent(e){const t=e.composedPath?e.composedPath():[];for(const s of t){if(!(s instanceof HTMLElement))continue;const r=s.getAttribute("data-index");if(r==null)continue;const i=Number(r);if(Number.isFinite(i))return i}return null}_focusTabAtIndex(e){const t=this._getNavItems()[e];if(t){if(t.kind==="dropdown"){this._getDropdownForSlot(t.slotName)?.focus?.();return}this.renderRoot.querySelector(`.tab-link[data-index="${e}"]`)?.focus?.()}}_renderMenuNodes(e){return!e||e.length===0?g``:g`${e.map(t=>this._renderMenuNode(t))}`}_renderMenuNode(e){const t=Array.isArray(e.children)&&e.children.length>0,s=(e.href??"").trim(),r=(e.icon??"").trim();return g`
|
|
54
54
|
<scb-menu-item
|
|
55
55
|
label=${e.label}
|
|
56
56
|
?selected=${!1}
|
|
57
57
|
leading-icon=${r||f}
|
|
58
58
|
item-href=${s||f}
|
|
59
59
|
>
|
|
60
|
-
${t?
|
|
60
|
+
${t?g`
|
|
61
61
|
<scb-sub-menu label=${e.label}>
|
|
62
62
|
${e.children.map(i=>this._renderMenuNode(i))}
|
|
63
63
|
</scb-sub-menu>
|
|
64
64
|
`:f}
|
|
65
65
|
</scb-menu-item>
|
|
66
|
-
`}_syncFlags(e,t){this.toggleAttribute("data-no-utility",e),this.toggleAttribute("data-no-search",t)}_renderMenuButton(e=""){return
|
|
66
|
+
`}_syncFlags(e,t){this.toggleAttribute("data-no-utility",e),this.toggleAttribute("data-no-search",t)}_renderMenuButton(e="",t=!1){const s=e?`menu-trigger ${e}`:"menu-trigger",r=(this.menuButtonLabel??"").trim()||"Meny";return t?g`
|
|
67
|
+
<scb-icon-button
|
|
68
|
+
class=${s}
|
|
69
|
+
icon="menu"
|
|
70
|
+
.size=${this.size}
|
|
71
|
+
aria-label=${r}
|
|
72
|
+
aria-controls=${this._drawerId}
|
|
73
|
+
aria-haspopup="dialog"
|
|
74
|
+
aria-expanded=${String(this._menuExpanded)}
|
|
75
|
+
title="Öppna meny"
|
|
76
|
+
@click=${this._onMenuClick}
|
|
77
|
+
></scb-icon-button>
|
|
78
|
+
`:g`
|
|
67
79
|
<scb-button
|
|
68
|
-
class=${
|
|
80
|
+
class=${s}
|
|
69
81
|
variant="text"
|
|
70
|
-
label=${
|
|
82
|
+
label=${r}
|
|
71
83
|
icon="menu"
|
|
72
84
|
trailing-icon
|
|
73
85
|
.size=${this.size}
|
|
@@ -77,7 +89,7 @@ import"../../vendor/vendor-material.js";import{_ as M,b as E,g as P,h as c,m as
|
|
|
77
89
|
title="Öppna meny"
|
|
78
90
|
@click=${this._onMenuClick}
|
|
79
91
|
></scb-button>
|
|
80
|
-
`}render(){const e=this._getNavItems(),t=this._slotUtils.length?this._slotUtils:this.utilityItems,s=this._slotMenu.length?this._slotMenu:this.menuData??[],r=this.logoText||this.logotypeText,i=this.logoAlt||r||"Gå till startsidan",a=this.querySelector('[slot="drawer-menu"]')!==null;this._syncFlags(t.length===0,!this.showSearch);const d=this.searchHeight&&this.searchHeight.trim()?`--scb-search-height:${this.searchHeight.trim()}`:f,l=e.length>0||this.reserveTabs||this.layoutPending,u=(this.reserveTabs||this.layoutPending)&&(this.layoutPending||e.length===0),p=this.showDrawer&&(!this.deferDrawer||this._drawerReady),
|
|
92
|
+
`}render(){const e=this._getNavItems(),t=this._slotUtils.length?this._slotUtils:this.utilityItems,s=this._slotMenu.length?this._slotMenu:this.menuData??[],r=this.logoText||this.logotypeText,i=this.logoAlt||r||"Gå till startsidan",a=this.querySelector('[slot="drawer-menu"]')!==null;this._syncFlags(t.length===0,!this.showSearch);const d=this.searchHeight&&this.searchHeight.trim()?`--scb-search-height:${this.searchHeight.trim()}`:f,l=e.length>0||this.reserveTabs||this.layoutPending,u=(this.reserveTabs||this.layoutPending)&&(this.layoutPending||e.length===0),p=this.showDrawer&&(!this.deferDrawer||this._drawerReady),v=typeof window<"u"&&window.innerWidth>=this.BP_MD,h=this.showDrawer&&(v?this.alwaysShowMenuButton||this._collapsed:!0),y=h&&!v,m=h&&v,_=(this.searchButtonLabel??"").trim()||"Sök",S=this.showSearch&&!this._mobileSearchOpen;return g`
|
|
81
93
|
<slot
|
|
82
94
|
id="data-slot"
|
|
83
95
|
@slotchange=${()=>{this._harvest(),this._attachSlotObservers()}}
|
|
@@ -116,16 +128,17 @@ import"../../vendor/vendor-material.js";import{_ as M,b as E,g as P,h as c,m as
|
|
|
116
128
|
|
|
117
129
|
<div class="actions">
|
|
118
130
|
<nav class="utility" aria-label="Funktionslänkar">
|
|
119
|
-
${t.map(
|
|
120
|
-
<scb-
|
|
121
|
-
|
|
122
|
-
.
|
|
123
|
-
|
|
124
|
-
|
|
131
|
+
${t.map(w=>g`
|
|
132
|
+
<scb-button
|
|
133
|
+
variant="text"
|
|
134
|
+
.href=${w.href}
|
|
135
|
+
.target=${w.target??""}
|
|
136
|
+
label=${w.label}
|
|
137
|
+
></scb-button>
|
|
125
138
|
`)}
|
|
126
139
|
</nav>
|
|
127
140
|
|
|
128
|
-
${this.showSearch?
|
|
141
|
+
${this.showSearch?g`
|
|
129
142
|
<div class="search" style=${d}>
|
|
130
143
|
<scb-search
|
|
131
144
|
id=${this._searchId}
|
|
@@ -139,15 +152,44 @@ import"../../vendor/vendor-material.js";import{_ as M,b as E,g as P,h as c,m as
|
|
|
139
152
|
></scb-search>
|
|
140
153
|
<scb-button
|
|
141
154
|
variant="filled-tonal"
|
|
142
|
-
label=${
|
|
155
|
+
label=${_}
|
|
143
156
|
.size=${this.size}
|
|
144
157
|
@click=${this._onSearchClick}
|
|
145
158
|
></scb-button>
|
|
146
159
|
</div>
|
|
147
160
|
`:f}
|
|
148
|
-
${
|
|
161
|
+
${S?g`
|
|
162
|
+
<scb-icon-button
|
|
163
|
+
class="mobile-search-trigger"
|
|
164
|
+
variant="filled-tonal"
|
|
165
|
+
icon="search"
|
|
166
|
+
.size=${this.size}
|
|
167
|
+
@click=${this._onMobileSearchToggle}
|
|
168
|
+
></scb-icon-button>
|
|
169
|
+
`:f}
|
|
170
|
+
${y?this._renderMenuButton("",!0):f}
|
|
149
171
|
</div>
|
|
150
172
|
|
|
173
|
+
${this.showSearch&&this._mobileSearchOpen?g`
|
|
174
|
+
<div class="mobile-search-panel" style=${d}>
|
|
175
|
+
<scb-search
|
|
176
|
+
.size=${this.size}
|
|
177
|
+
style=${d}
|
|
178
|
+
.value=${this.searchText}
|
|
179
|
+
.supportingText=${this.searchPlaceholder??""}
|
|
180
|
+
@scb-search-input=${this._onSearchInput}
|
|
181
|
+
@scb-search-submit=${this._onSearchSubmit}
|
|
182
|
+
@scb-search-clear=${this._onSearchClear}
|
|
183
|
+
></scb-search>
|
|
184
|
+
<scb-icon-button
|
|
185
|
+
variant="filled-tonal"
|
|
186
|
+
icon="close"
|
|
187
|
+
.size=${this.size}
|
|
188
|
+
@click=${this._onMobileSearchToggle}
|
|
189
|
+
></scb-icon-button>
|
|
190
|
+
</div>
|
|
191
|
+
`:f}
|
|
192
|
+
|
|
151
193
|
</div>
|
|
152
194
|
</scb-grid-item>
|
|
153
195
|
|
|
@@ -157,13 +199,13 @@ import"../../vendor/vendor-material.js";import{_ as M,b as E,g as P,h as c,m as
|
|
|
157
199
|
col-span-expanded="12"
|
|
158
200
|
>
|
|
159
201
|
<div class="tabs-row">
|
|
160
|
-
${l?u?
|
|
202
|
+
${l?u?g`
|
|
161
203
|
<div class="tabs-inset">
|
|
162
204
|
<div class="tabs-nav tabs-nav--skeleton" aria-hidden="true">
|
|
163
205
|
${this._renderTabSkeletons()}
|
|
164
206
|
</div>
|
|
165
207
|
</div>
|
|
166
|
-
`:e.length?
|
|
208
|
+
`:e.length?g`
|
|
167
209
|
<div class="tabs-inset">
|
|
168
210
|
<nav
|
|
169
211
|
class="tabs-nav"
|
|
@@ -171,33 +213,33 @@ import"../../vendor/vendor-material.js";import{_ as M,b as E,g as P,h as c,m as
|
|
|
171
213
|
@keydown=${this._onTabsKeydown}
|
|
172
214
|
@scb-dropdown-tab-activate=${this._onDropdownTabActivate}
|
|
173
215
|
>
|
|
174
|
-
${e.map((
|
|
216
|
+
${e.map((w,C)=>w.kind==="dropdown"?g`
|
|
175
217
|
<div class="tab-wrap">
|
|
176
|
-
<slot name=${
|
|
218
|
+
<slot name=${w.slotName}></slot>
|
|
177
219
|
</div>
|
|
178
|
-
`:
|
|
220
|
+
`:w.href?g`
|
|
179
221
|
<div class="tab-wrap">
|
|
180
222
|
<a
|
|
181
223
|
class="tab-link"
|
|
182
|
-
href=${
|
|
183
|
-
data-index=${
|
|
184
|
-
aria-current=${
|
|
224
|
+
href=${w.href}
|
|
225
|
+
data-index=${C}
|
|
226
|
+
aria-current=${C===this.activeTab?"page":f}
|
|
185
227
|
@click=${this._onTabClick}
|
|
186
228
|
>
|
|
187
|
-
${
|
|
229
|
+
${w.label}
|
|
188
230
|
</a>
|
|
189
231
|
<md-focus-ring></md-focus-ring>
|
|
190
232
|
</div>
|
|
191
|
-
`:
|
|
233
|
+
`:g`
|
|
192
234
|
<div class="tab-wrap">
|
|
193
235
|
<button
|
|
194
236
|
type="button"
|
|
195
237
|
class="tab-link"
|
|
196
|
-
data-index=${
|
|
197
|
-
aria-current=${
|
|
238
|
+
data-index=${C}
|
|
239
|
+
aria-current=${C===this.activeTab?"page":f}
|
|
198
240
|
@click=${this._onTabClick}
|
|
199
241
|
>
|
|
200
|
-
${
|
|
242
|
+
${w.label}
|
|
201
243
|
</button>
|
|
202
244
|
<md-focus-ring></md-focus-ring>
|
|
203
245
|
</div>
|
|
@@ -206,14 +248,14 @@ import"../../vendor/vendor-material.js";import{_ as M,b as E,g as P,h as c,m as
|
|
|
206
248
|
</div>
|
|
207
249
|
`:f:f}
|
|
208
250
|
|
|
209
|
-
${
|
|
251
|
+
${m?this._renderMenuButton("menu-trigger--tabs-right"):f}
|
|
210
252
|
</div>
|
|
211
253
|
</scb-grid-item>
|
|
212
254
|
</scb-grid>
|
|
213
255
|
<div class="divider" role="presentation"></div>
|
|
214
256
|
</div>
|
|
215
257
|
|
|
216
|
-
${p?
|
|
258
|
+
${p?g`
|
|
217
259
|
<scb-drawer
|
|
218
260
|
id=${this._drawerId}
|
|
219
261
|
floating
|
|
@@ -228,7 +270,7 @@ import"../../vendor/vendor-material.js";import{_ as M,b as E,g as P,h as c,m as
|
|
|
228
270
|
>
|
|
229
271
|
<slot name="drawer-menu"></slot>
|
|
230
272
|
|
|
231
|
-
${a?f:
|
|
273
|
+
${a?f:g`
|
|
232
274
|
<scb-menu
|
|
233
275
|
.label=${this.menuLabel??""}
|
|
234
276
|
.subLabel=${this.menuSubLabel??""}
|
|
@@ -238,7 +280,7 @@ import"../../vendor/vendor-material.js";import{_ as M,b as E,g as P,h as c,m as
|
|
|
238
280
|
.supportingText=${this.menuSearchPlaceholder??""}
|
|
239
281
|
></scb-search>
|
|
240
282
|
|
|
241
|
-
${this.menuSectionLabel?
|
|
283
|
+
${this.menuSectionLabel?g`
|
|
242
284
|
<scb-menu-section
|
|
243
285
|
.label=${this.menuSectionLabel}
|
|
244
286
|
></scb-menu-section>
|
|
@@ -246,12 +288,12 @@ import"../../vendor/vendor-material.js";import{_ as M,b as E,g as P,h as c,m as
|
|
|
246
288
|
|
|
247
289
|
${this._renderMenuNodes(s)}
|
|
248
290
|
|
|
249
|
-
${this.includeUtilityInMenu&&(t?.length??0)>0?
|
|
291
|
+
${this.includeUtilityInMenu&&(t?.length??0)>0?g`
|
|
250
292
|
<scb-menu-section label=''></scb-menu-section>
|
|
251
|
-
${t.map(
|
|
293
|
+
${t.map(w=>g`
|
|
252
294
|
<scb-menu-item
|
|
253
|
-
label=${
|
|
254
|
-
item-href=${
|
|
295
|
+
label=${w.label}
|
|
296
|
+
item-href=${w.href}
|
|
255
297
|
></scb-menu-item>
|
|
256
298
|
`)}
|
|
257
299
|
`:f}
|
|
@@ -259,7 +301,7 @@ import"../../vendor/vendor-material.js";import{_ as M,b as E,g as P,h as c,m as
|
|
|
259
301
|
`}
|
|
260
302
|
</scb-drawer>
|
|
261
303
|
`:f}
|
|
262
|
-
`}_renderTabSkeletons(){const e=["96px","72px","88px","64px"],t=(this.reserveTabsWidths??"").split(/[\s,]+/).map(a=>a.trim()).filter(Boolean).map(a=>/^\d+(?:\.\d+)?$/.test(a)?`${a}px`:a),s=t.length>0?t:e,r=Number(this.reserveTabsCount),i=Number.isFinite(r)&&r>0?Math.floor(r):t.length>0?t.length:e.length;return
|
|
304
|
+
`}_renderTabSkeletons(){const e=["96px","72px","88px","64px"],t=(this.reserveTabsWidths??"").split(/[\s,]+/).map(a=>a.trim()).filter(Boolean).map(a=>/^\d+(?:\.\d+)?$/.test(a)?`${a}px`:a),s=t.length>0?t:e,r=Number(this.reserveTabsCount),i=Number.isFinite(r)&&r>0?Math.floor(r):t.length>0?t.length:e.length;return g`${Array.from({length:i},(a,d)=>s[d%s.length]).map(a=>g`<scb-skeleton variant="rounded" width=${a} height="16px"></scb-skeleton>`)}`}_renderLogo(){const e=(this.logoSrc??"").trim();return e?g`<img class="logo" src=${e} alt="" aria-hidden="true" />`:g`
|
|
263
305
|
<svg
|
|
264
306
|
class="logo"
|
|
265
307
|
viewBox="0 0 48 54"
|
|
@@ -293,7 +335,7 @@ import"../../vendor/vendor-material.js";import{_ as M,b as E,g as P,h as c,m as
|
|
|
293
335
|
</clipPath>
|
|
294
336
|
</defs>
|
|
295
337
|
</svg>
|
|
296
|
-
`}},
|
|
338
|
+
`}},$=A,A._JSON_ARRAY={fromAttribute:b=>{if(b==null||b==="")return[];try{const e=JSON.parse(b);return Array.isArray(e)?e:[]}catch{return[]}},toAttribute:b=>b==null?null:JSON.stringify(b)},A.BP_SM_DEFAULT=600,A.BP_MD_DEFAULT=840,A.styles=P`
|
|
297
339
|
:host {
|
|
298
340
|
display: block;
|
|
299
341
|
margin-block-start: var(--scb-header-spacing-block-start, 0);
|
|
@@ -413,6 +455,7 @@ import"../../vendor/vendor-material.js";import{_ as M,b as E,g as P,h as c,m as
|
|
|
413
455
|
gap: var(--spacing-7, 24px);
|
|
414
456
|
padding-block: var(--spacing-5, 16px);
|
|
415
457
|
min-width: 0;
|
|
458
|
+
position: relative;
|
|
416
459
|
}
|
|
417
460
|
|
|
418
461
|
.logo-wrap {
|
|
@@ -496,9 +539,9 @@ import"../../vendor/vendor-material.js";import{_ as M,b as E,g as P,h as c,m as
|
|
|
496
539
|
.actions {
|
|
497
540
|
display: flex;
|
|
498
541
|
align-items: center;
|
|
499
|
-
gap: var(--spacing-7, 24px);
|
|
500
542
|
margin-left: auto;
|
|
501
543
|
width: 100%;
|
|
544
|
+
gap: var(--spacing-3, 8px);
|
|
502
545
|
justify-content: flex-end;
|
|
503
546
|
min-width: 0;
|
|
504
547
|
}
|
|
@@ -507,26 +550,8 @@ import"../../vendor/vendor-material.js";import{_ as M,b as E,g as P,h as c,m as
|
|
|
507
550
|
display: none;
|
|
508
551
|
flex-wrap: nowrap;
|
|
509
552
|
align-items: center;
|
|
510
|
-
gap: var(--spacing-5, 16px);
|
|
511
553
|
min-width: 0;
|
|
512
554
|
}
|
|
513
|
-
.utility scb-link {
|
|
514
|
-
font-family: var(--md-sys-typescale-body-medium-font, var(--brand-font)),
|
|
515
|
-
sans-serif;
|
|
516
|
-
font-size: var(
|
|
517
|
-
--scb-header-utility-font-size,
|
|
518
|
-
var(--md-sys-typescale-body-medium-size)
|
|
519
|
-
);
|
|
520
|
-
line-height: var(
|
|
521
|
-
--scb-header-utility-line-height,
|
|
522
|
-
var(--md-sys-typescale-body-medium-line-height)
|
|
523
|
-
);
|
|
524
|
-
font-weight: var(--md-sys-typescale-body-medium-weight);
|
|
525
|
-
letter-spacing: var(--md-sys-typescale-body-medium-tracking);
|
|
526
|
-
--scb-link-color: var(--md-sys-color-primary);
|
|
527
|
-
--scb-link-white-space: nowrap;
|
|
528
|
-
}
|
|
529
|
-
|
|
530
555
|
|
|
531
556
|
@media (min-width: 840px) {
|
|
532
557
|
.utility {
|
|
@@ -547,7 +572,7 @@ import"../../vendor/vendor-material.js";import{_ as M,b as E,g as P,h as c,m as
|
|
|
547
572
|
|
|
548
573
|
.menu-trigger {
|
|
549
574
|
display: none;
|
|
550
|
-
align-self:
|
|
575
|
+
align-self: center;
|
|
551
576
|
color: var(--md-sys-color-on-surface, #1b1b1f);
|
|
552
577
|
--md-sys-color-primary: var(--md-sys-color-on-surface, #1b1b1f);
|
|
553
578
|
}
|
|
@@ -592,6 +617,46 @@ import"../../vendor/vendor-material.js";import{_ as M,b as E,g as P,h as c,m as
|
|
|
592
617
|
display: flex;
|
|
593
618
|
}
|
|
594
619
|
}
|
|
620
|
+
|
|
621
|
+
.mobile-search-trigger {
|
|
622
|
+
display: inline-flex;
|
|
623
|
+
color: var(--md-sys-color-on-surface, #1b1b1f);
|
|
624
|
+
--md-sys-color-primary: var(--md-sys-color-on-surface, #1b1b1f);
|
|
625
|
+
}
|
|
626
|
+
|
|
627
|
+
@media (min-width: 600px) {
|
|
628
|
+
.mobile-search-trigger {
|
|
629
|
+
display: none;
|
|
630
|
+
}
|
|
631
|
+
}
|
|
632
|
+
|
|
633
|
+
.mobile-search-panel {
|
|
634
|
+
display: none;
|
|
635
|
+
position: absolute;
|
|
636
|
+
inset: 0;
|
|
637
|
+
z-index: 2;
|
|
638
|
+
align-items: center;
|
|
639
|
+
gap: var(--spacing-3, 8px);
|
|
640
|
+
padding-block: var(--spacing-5, 16px);
|
|
641
|
+
background: var(--scb-header-background, transparent);
|
|
642
|
+
}
|
|
643
|
+
|
|
644
|
+
.mobile-search-panel scb-search {
|
|
645
|
+
flex: 1 1 auto;
|
|
646
|
+
min-width: 0;
|
|
647
|
+
}
|
|
648
|
+
|
|
649
|
+
@media (max-width: 599.98px) {
|
|
650
|
+
:host([data-mobile-search-open]) .mobile-search-panel {
|
|
651
|
+
display: flex;
|
|
652
|
+
}
|
|
653
|
+
|
|
654
|
+
:host([data-mobile-search-open]) .logo-wrap,
|
|
655
|
+
:host([data-mobile-search-open]) .actions {
|
|
656
|
+
visibility: hidden;
|
|
657
|
+
pointer-events: none;
|
|
658
|
+
}
|
|
659
|
+
}
|
|
595
660
|
@media (min-width: 600px) and (max-width: 839.98px) {
|
|
596
661
|
:host([data-hide-search]) .search {
|
|
597
662
|
display: none !important;
|
|
@@ -734,4 +799,4 @@ import"../../vendor/vendor-material.js";import{_ as M,b as E,g as P,h as c,m as
|
|
|
734
799
|
:host([data-hide-logo-text]) .logo-text {
|
|
735
800
|
display: none;
|
|
736
801
|
}
|
|
737
|
-
`,
|
|
802
|
+
`,A);n([c({type:String,attribute:"max-width"})],o.prototype,"maxWidth",void 0);n([c({type:String,reflect:!0})],o.prototype,"spacing",void 0);n([c({type:String,attribute:"spacing-top",reflect:!0})],o.prototype,"spacingTop",void 0);n([c({type:String,attribute:"spacing-bottom",reflect:!0})],o.prototype,"spacingBottom",void 0);n([c({type:String,reflect:!0,converter:D})],o.prototype,"size",void 0);n([c({type:String,attribute:"logo-text"})],o.prototype,"logoText",void 0);n([c({type:String,attribute:"logotype-text"})],o.prototype,"logotypeText",void 0);n([c({type:String,attribute:"logo-alt"})],o.prototype,"logoAlt",void 0);n([c({type:String,attribute:"logo-href"})],o.prototype,"logoHref",void 0);n([c({type:String,attribute:"logo-src"})],o.prototype,"logoSrc",void 0);n([c({type:String,attribute:"logo-width"})],o.prototype,"logoWidth",void 0);n([c({type:String,attribute:"logo-height"})],o.prototype,"logoHeight",void 0);n([c({type:String,attribute:"logo-aspect-ratio"})],o.prototype,"logoAspectRatio",void 0);n([c({type:Boolean,attribute:"logo-invert-dm",reflect:!0,converter:k})],o.prototype,"logoInvertDm",void 0);n([c({type:Boolean,reflect:!0})],o.prototype,"banner",void 0);n([c({type:String,attribute:"banner-label"})],o.prototype,"bannerLabel",void 0);n([c({type:Array,attribute:"tabs",converter:o._JSON_ARRAY})],o.prototype,"tabs",void 0);n([c({type:Number,attribute:"active-tab"})],o.prototype,"activeTab",void 0);n([c({type:Boolean,attribute:"reserve-tabs",reflect:!0,converter:k})],o.prototype,"reserveTabs",void 0);n([c({type:Number,attribute:"reserve-tabs-count"})],o.prototype,"reserveTabsCount",void 0);n([c({type:String,attribute:"reserve-tabs-widths"})],o.prototype,"reserveTabsWidths",void 0);n([c({type:Boolean,attribute:"layout-pending",reflect:!0,converter:k})],o.prototype,"layoutPending",void 0);n([c({type:Array,attribute:"utility-items",converter:o._JSON_ARRAY})],o.prototype,"utilityItems",void 0);n([c({type:String,attribute:"search-placeholder"})],o.prototype,"searchPlaceholder",void 0);n([c({type:String,attribute:"search-button-label"})],o.prototype,"searchButtonLabel",void 0);n([c({type:String,attribute:"menu-label"})],o.prototype,"menuLabel",void 0);n([c({type:String,attribute:"menu-button-label"})],o.prototype,"menuButtonLabel",void 0);n([c({type:String,attribute:"menu-sub-label"})],o.prototype,"menuSubLabel",void 0);n([c({type:String,attribute:"menu-section-label"})],o.prototype,"menuSectionLabel",void 0);n([c({type:String,attribute:"menu-search-placeholder"})],o.prototype,"menuSearchPlaceholder",void 0);n([c({type:Array,attribute:"menu-data",converter:o._JSON_ARRAY})],o.prototype,"menuData",void 0);n([c({type:Boolean,attribute:"defer-drawer",reflect:!0,converter:k})],o.prototype,"deferDrawer",void 0);n([c({type:Boolean,attribute:"show-drawer",reflect:!0,converter:T})],o.prototype,"showDrawer",void 0);n([c({type:Boolean,attribute:"always-show-menu-button",reflect:!0,converter:k})],o.prototype,"alwaysShowMenuButton",void 0);n([c({type:Boolean,attribute:"show-search",reflect:!0,converter:T})],o.prototype,"showSearch",void 0);n([c({type:Boolean,attribute:"include-utility-in-menu",reflect:!0,converter:k})],o.prototype,"includeUtilityInMenu",void 0);n([c({type:Boolean,attribute:"drawer-overlay",reflect:!0,converter:T})],o.prototype,"drawerOverlay",void 0);n([c({type:String,attribute:"search-max"})],o.prototype,"searchMax",void 0);n([c({type:String,attribute:"search-min"})],o.prototype,"searchMin",void 0);n([c({type:String,attribute:"search-height"})],o.prototype,"searchHeight",void 0);n([c({type:String,attribute:"search-text",reflect:!0})],o.prototype,"searchText",void 0);n([x()],o.prototype,"_drawerId",void 0);n([x()],o.prototype,"_menuExpanded",void 0);n([x()],o.prototype,"_searchId",void 0);n([x()],o.prototype,"_drawerReady",void 0);n([x()],o.prototype,"_mobileSearchOpen",void 0);n([x()],o.prototype,"_slotNavItems",void 0);n([x()],o.prototype,"_slotUtils",void 0);n([x()],o.prototype,"_slotMenu",void 0);n([x()],o.prototype,"_collapsed",void 0);n([x()],o.prototype,"_hideLogoText",void 0);o=$=n([I("scb-header")],o);
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "scb-wc",
|
|
3
|
-
"version": "0.1.
|
|
3
|
+
"version": "0.1.57",
|
|
4
4
|
"type": "module",
|
|
5
5
|
"main": "index.js",
|
|
6
6
|
"module": "index.js",
|
|
@@ -440,5 +440,5 @@
|
|
|
440
440
|
},
|
|
441
441
|
"./mvc/*": "./mvc/*"
|
|
442
442
|
},
|
|
443
|
-
"buildHash": "
|
|
443
|
+
"buildHash": "55CE80097ADD971C7298BACA2D1F913AA7A12D418DD2DF9155E2438DC81FA6CB"
|
|
444
444
|
}
|
|
@@ -63,6 +63,7 @@ export declare class ScbHeader extends LitElement {
|
|
|
63
63
|
private _menuExpanded;
|
|
64
64
|
private _searchId;
|
|
65
65
|
private _drawerReady;
|
|
66
|
+
private _mobileSearchOpen;
|
|
66
67
|
private _drawerImportPromise?;
|
|
67
68
|
private _initialUpgradeComplete;
|
|
68
69
|
private _slotNavItems;
|
|
@@ -103,6 +104,7 @@ export declare class ScbHeader extends LitElement {
|
|
|
103
104
|
private _setCollapsed;
|
|
104
105
|
private _setHideSearch;
|
|
105
106
|
private _setHideLogoText;
|
|
107
|
+
private _setMobileSearchOpen;
|
|
106
108
|
private _num;
|
|
107
109
|
private _tokenPx;
|
|
108
110
|
private _visible;
|
|
@@ -125,6 +127,7 @@ export declare class ScbHeader extends LitElement {
|
|
|
125
127
|
private _syncMenuBtnAria;
|
|
126
128
|
private _onMenuClick;
|
|
127
129
|
private _onSearchClick;
|
|
130
|
+
private _onMobileSearchToggle;
|
|
128
131
|
private _getNavItems;
|
|
129
132
|
private _getDropdownForSlot;
|
|
130
133
|
private _syncDropdownTabs;
|
package/scb-header/scb-header.js
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { __decorate as e } from "../_virtual/_@oxc-project_runtime@0.126.0/helpers/decorate.js";
|
|
2
2
|
import "../scb-button/scb-button.js";
|
|
3
|
+
import "../scb-icon-button/scb-icon-button.js";
|
|
3
4
|
import "../scb-search/scb-search.js";
|
|
4
|
-
import "../scb-link/scb-link.js";
|
|
5
5
|
import "../scb-dropdown/scb-dropdown.js";
|
|
6
6
|
import "../scb-grid/scb-grid-item.js";
|
|
7
7
|
import "../scb-grid/scb-grid.js";
|
|
@@ -105,12 +105,12 @@ var u = {
|
|
|
105
105
|
c = this;
|
|
106
106
|
}
|
|
107
107
|
constructor() {
|
|
108
|
-
super(), this.maxWidth = "1440px", this.spacing = void 0, this.spacingTop = void 0, this.spacingBottom = void 0, this.size = "medium", this.logoText = "", this.logotypeText = "", this.logoAlt = "", this.logoHref = "/", this.logoSrc = "", this.logoWidth = "", this.logoHeight = "", this.logoAspectRatio = "", this.logoInvertDm = !1, this.banner = !1, this.tabs = [], this.activeTab = null, this.reserveTabs = !1, this.layoutPending = !1, this.utilityItems = [], this.searchButtonLabel = "Sök", this.menuButtonLabel = "Meny", this.deferDrawer = !1, this.showDrawer = !0, this.alwaysShowMenuButton = !1, this.showSearch = !0, this.includeUtilityInMenu = !1, this.drawerOverlay = !0, this.searchText = "", this._drawerId = "main-drawer", this._menuExpanded = !1, this._searchId = "header-search", this._drawerReady = !1, this._initialUpgradeComplete = !1, this._slotNavItems = [], this._slotUtils = [], this._slotMenu = [], this._measureScheduled = !1, this._scheduleMeasure = () => {
|
|
108
|
+
super(), this.maxWidth = "1440px", this.spacing = void 0, this.spacingTop = void 0, this.spacingBottom = void 0, this.size = "medium", this.logoText = "", this.logotypeText = "", this.logoAlt = "", this.logoHref = "/", this.logoSrc = "", this.logoWidth = "", this.logoHeight = "", this.logoAspectRatio = "", this.logoInvertDm = !1, this.banner = !1, this.tabs = [], this.activeTab = null, this.reserveTabs = !1, this.layoutPending = !1, this.utilityItems = [], this.searchButtonLabel = "Sök", this.menuButtonLabel = "Meny", this.deferDrawer = !1, this.showDrawer = !0, this.alwaysShowMenuButton = !1, this.showSearch = !0, this.includeUtilityInMenu = !1, this.drawerOverlay = !0, this.searchText = "", this._drawerId = "main-drawer", this._menuExpanded = !1, this._searchId = "header-search", this._drawerReady = !1, this._mobileSearchOpen = !1, this._initialUpgradeComplete = !1, this._slotNavItems = [], this._slotUtils = [], this._slotMenu = [], this._measureScheduled = !1, this._scheduleMeasure = () => {
|
|
109
109
|
this.layoutPending || this._measureScheduled || (this._measureScheduled = !0, requestAnimationFrame(() => {
|
|
110
110
|
this._measureScheduled = !1, this._measure();
|
|
111
111
|
}));
|
|
112
112
|
}, this._onWindowResize = () => {
|
|
113
|
-
this._scheduleMeasure();
|
|
113
|
+
window.innerWidth >= this.BP_SM && this._mobileSearchOpen && this._setMobileSearchOpen(!1), this._scheduleMeasure();
|
|
114
114
|
}, this._onMenuSelect = (e) => {
|
|
115
115
|
let t = e.detail;
|
|
116
116
|
this.dispatchEvent(new CustomEvent("scb-menu-select", {
|
|
@@ -226,7 +226,7 @@ var u = {
|
|
|
226
226
|
composed: !0
|
|
227
227
|
}));
|
|
228
228
|
}, this._onMenuClick = async (e) => {
|
|
229
|
-
this.showDrawer && (this.dispatchEvent(new CustomEvent("menu-click", {
|
|
229
|
+
this.showDrawer && (this._setMobileSearchOpen(!1), this.dispatchEvent(new CustomEvent("menu-click", {
|
|
230
230
|
bubbles: !0,
|
|
231
231
|
composed: !0
|
|
232
232
|
})), this.dispatchEvent(new CustomEvent("menuclick", {
|
|
@@ -249,6 +249,11 @@ var u = {
|
|
|
249
249
|
bubbles: !0,
|
|
250
250
|
composed: !0
|
|
251
251
|
})), t?.focus?.();
|
|
252
|
+
}, this._onMobileSearchToggle = () => {
|
|
253
|
+
let e = !this._mobileSearchOpen;
|
|
254
|
+
this._setMobileSearchOpen(e), e && this.updateComplete.then(() => {
|
|
255
|
+
this.renderRoot.querySelector(".mobile-search-panel scb-search")?.focus?.();
|
|
256
|
+
});
|
|
252
257
|
}, this._onTabClick = (e) => {
|
|
253
258
|
let t = e.currentTarget;
|
|
254
259
|
if (!t) return;
|
|
@@ -513,6 +518,7 @@ var u = {
|
|
|
513
518
|
gap: var(--spacing-7, 24px);
|
|
514
519
|
padding-block: var(--spacing-5, 16px);
|
|
515
520
|
min-width: 0;
|
|
521
|
+
position: relative;
|
|
516
522
|
}
|
|
517
523
|
|
|
518
524
|
.logo-wrap {
|
|
@@ -596,9 +602,9 @@ var u = {
|
|
|
596
602
|
.actions {
|
|
597
603
|
display: flex;
|
|
598
604
|
align-items: center;
|
|
599
|
-
gap: var(--spacing-7, 24px);
|
|
600
605
|
margin-left: auto;
|
|
601
606
|
width: 100%;
|
|
607
|
+
gap: var(--spacing-3, 8px);
|
|
602
608
|
justify-content: flex-end;
|
|
603
609
|
min-width: 0;
|
|
604
610
|
}
|
|
@@ -607,26 +613,8 @@ var u = {
|
|
|
607
613
|
display: none;
|
|
608
614
|
flex-wrap: nowrap;
|
|
609
615
|
align-items: center;
|
|
610
|
-
gap: var(--spacing-5, 16px);
|
|
611
616
|
min-width: 0;
|
|
612
617
|
}
|
|
613
|
-
.utility scb-link {
|
|
614
|
-
font-family: var(--md-sys-typescale-body-medium-font, var(--brand-font)),
|
|
615
|
-
sans-serif;
|
|
616
|
-
font-size: var(
|
|
617
|
-
--scb-header-utility-font-size,
|
|
618
|
-
var(--md-sys-typescale-body-medium-size)
|
|
619
|
-
);
|
|
620
|
-
line-height: var(
|
|
621
|
-
--scb-header-utility-line-height,
|
|
622
|
-
var(--md-sys-typescale-body-medium-line-height)
|
|
623
|
-
);
|
|
624
|
-
font-weight: var(--md-sys-typescale-body-medium-weight);
|
|
625
|
-
letter-spacing: var(--md-sys-typescale-body-medium-tracking);
|
|
626
|
-
--scb-link-color: var(--md-sys-color-primary);
|
|
627
|
-
--scb-link-white-space: nowrap;
|
|
628
|
-
}
|
|
629
|
-
|
|
630
618
|
|
|
631
619
|
@media (min-width: 840px) {
|
|
632
620
|
.utility {
|
|
@@ -647,7 +635,7 @@ var u = {
|
|
|
647
635
|
|
|
648
636
|
.menu-trigger {
|
|
649
637
|
display: none;
|
|
650
|
-
align-self:
|
|
638
|
+
align-self: center;
|
|
651
639
|
color: var(--md-sys-color-on-surface, #1b1b1f);
|
|
652
640
|
--md-sys-color-primary: var(--md-sys-color-on-surface, #1b1b1f);
|
|
653
641
|
}
|
|
@@ -692,6 +680,46 @@ var u = {
|
|
|
692
680
|
display: flex;
|
|
693
681
|
}
|
|
694
682
|
}
|
|
683
|
+
|
|
684
|
+
.mobile-search-trigger {
|
|
685
|
+
display: inline-flex;
|
|
686
|
+
color: var(--md-sys-color-on-surface, #1b1b1f);
|
|
687
|
+
--md-sys-color-primary: var(--md-sys-color-on-surface, #1b1b1f);
|
|
688
|
+
}
|
|
689
|
+
|
|
690
|
+
@media (min-width: 600px) {
|
|
691
|
+
.mobile-search-trigger {
|
|
692
|
+
display: none;
|
|
693
|
+
}
|
|
694
|
+
}
|
|
695
|
+
|
|
696
|
+
.mobile-search-panel {
|
|
697
|
+
display: none;
|
|
698
|
+
position: absolute;
|
|
699
|
+
inset: 0;
|
|
700
|
+
z-index: 2;
|
|
701
|
+
align-items: center;
|
|
702
|
+
gap: var(--spacing-3, 8px);
|
|
703
|
+
padding-block: var(--spacing-5, 16px);
|
|
704
|
+
background: var(--scb-header-background, transparent);
|
|
705
|
+
}
|
|
706
|
+
|
|
707
|
+
.mobile-search-panel scb-search {
|
|
708
|
+
flex: 1 1 auto;
|
|
709
|
+
min-width: 0;
|
|
710
|
+
}
|
|
711
|
+
|
|
712
|
+
@media (max-width: 599.98px) {
|
|
713
|
+
:host([data-mobile-search-open]) .mobile-search-panel {
|
|
714
|
+
display: flex;
|
|
715
|
+
}
|
|
716
|
+
|
|
717
|
+
:host([data-mobile-search-open]) .logo-wrap,
|
|
718
|
+
:host([data-mobile-search-open]) .actions {
|
|
719
|
+
visibility: hidden;
|
|
720
|
+
pointer-events: none;
|
|
721
|
+
}
|
|
722
|
+
}
|
|
695
723
|
@media (min-width: 600px) and (max-width: 839.98px) {
|
|
696
724
|
:host([data-hide-search]) .search {
|
|
697
725
|
display: none !important;
|
|
@@ -945,6 +973,9 @@ var u = {
|
|
|
945
973
|
_setHideLogoText(e) {
|
|
946
974
|
this._hideLogoText !== e && (this._hideLogoText = e, e ? this.setAttribute("data-hide-logo-text", "") : this.removeAttribute("data-hide-logo-text"));
|
|
947
975
|
}
|
|
976
|
+
_setMobileSearchOpen(e) {
|
|
977
|
+
this._mobileSearchOpen !== e && (this._mobileSearchOpen = e, this.toggleAttribute("data-mobile-search-open", e));
|
|
978
|
+
}
|
|
948
979
|
_num(e, t) {
|
|
949
980
|
let n = Number.parseFloat(String(e ?? "").trim());
|
|
950
981
|
return Number.isFinite(n) ? n : t;
|
|
@@ -989,7 +1020,7 @@ var u = {
|
|
|
989
1020
|
updated(e) {
|
|
990
1021
|
e.has("searchMax") && this.style.setProperty("--scb-header-search-max", this.searchMax ?? "380px"), e.has("searchMin") && this.style.setProperty("--scb-header-search-min", this.searchMin ?? "250px"), e.has("searchHeight") && (this.searchHeight && this.searchHeight.trim() ? this.style.setProperty("--scb-search-height", this.searchHeight.trim()) : this.style.removeProperty("--scb-search-height")), (e.has("logoWidth") || e.has("logoHeight") || e.has("logoAspectRatio")) && this._applyLogoSizing(), (e.has("spacing") || e.has("spacingTop") || e.has("spacingBottom")) && this._applySpacing(), (e.has("utilityItems") || e.has("tabs") || e.has("logoText") || e.has("logotypeText") || e.has("logoSrc") || e.has("logoWidth") || e.has("logoHeight") || e.has("logoAspectRatio") || e.has("activeTab") || e.has("_slotNavItems") || e.has("_slotUtils") || e.has("_slotMenu") || e.has("showDrawer") || e.has("alwaysShowMenuButton") || e.has("showSearch") || e.has("layoutPending") || e.has("searchMax") || e.has("searchMin") || e.has("size")) && this.updateComplete.then(() => {
|
|
991
1022
|
this._scheduleMeasure();
|
|
992
|
-
}), (e.has("showDrawer") || e.has("deferDrawer")) && this.showDrawer && !this.deferDrawer && this._ensureDrawerReady(), e.has("layoutPending") && !this.layoutPending && this.requestLayout(), (e.has("activeTab") || e.has("_slotNavItems") || e.has("tabs") || e.has("size")) && this.updateComplete.then(() => {
|
|
1023
|
+
}), (e.has("showDrawer") || e.has("deferDrawer")) && this.showDrawer && !this.deferDrawer && this._ensureDrawerReady(), e.has("showSearch") && !this.showSearch && this._setMobileSearchOpen(!1), e.has("layoutPending") && !this.layoutPending && this.requestLayout(), (e.has("activeTab") || e.has("_slotNavItems") || e.has("tabs") || e.has("size")) && this.updateComplete.then(() => {
|
|
993
1024
|
this._syncDropdownTabs();
|
|
994
1025
|
});
|
|
995
1026
|
}
|
|
@@ -1090,12 +1121,25 @@ var u = {
|
|
|
1090
1121
|
_syncFlags(e, t) {
|
|
1091
1122
|
this.toggleAttribute("data-no-utility", e), this.toggleAttribute("data-no-search", t);
|
|
1092
1123
|
}
|
|
1093
|
-
_renderMenuButton(e = "") {
|
|
1094
|
-
|
|
1124
|
+
_renderMenuButton(e = "", t = !1) {
|
|
1125
|
+
let n = e ? `menu-trigger ${e}` : "menu-trigger", i = (this.menuButtonLabel ?? "").trim() || "Meny";
|
|
1126
|
+
return t ? r`
|
|
1127
|
+
<scb-icon-button
|
|
1128
|
+
class=${n}
|
|
1129
|
+
icon="menu"
|
|
1130
|
+
.size=${this.size}
|
|
1131
|
+
aria-label=${i}
|
|
1132
|
+
aria-controls=${this._drawerId}
|
|
1133
|
+
aria-haspopup="dialog"
|
|
1134
|
+
aria-expanded=${String(this._menuExpanded)}
|
|
1135
|
+
title="Öppna meny"
|
|
1136
|
+
@click=${this._onMenuClick}
|
|
1137
|
+
></scb-icon-button>
|
|
1138
|
+
` : r`
|
|
1095
1139
|
<scb-button
|
|
1096
|
-
class=${
|
|
1140
|
+
class=${n}
|
|
1097
1141
|
variant="text"
|
|
1098
|
-
label=${
|
|
1142
|
+
label=${i}
|
|
1099
1143
|
icon="menu"
|
|
1100
1144
|
trailing-icon
|
|
1101
1145
|
.size=${this.size}
|
|
@@ -1110,7 +1154,7 @@ var u = {
|
|
|
1110
1154
|
render() {
|
|
1111
1155
|
let e = this._getNavItems(), t = this._slotUtils.length ? this._slotUtils : this.utilityItems, n = this._slotMenu.length ? this._slotMenu : this.menuData ?? [], a = this.logoText || this.logotypeText, o = this.logoAlt || a || "Gå till startsidan", s = this.querySelector("[slot=\"drawer-menu\"]") !== null;
|
|
1112
1156
|
this._syncFlags(t.length === 0, !this.showSearch);
|
|
1113
|
-
let c = this.searchHeight && this.searchHeight.trim() ? `--scb-search-height:${this.searchHeight.trim()}` : i, l = e.length > 0 || this.reserveTabs || this.layoutPending, u = (this.reserveTabs || this.layoutPending) && (this.layoutPending || e.length === 0), d = this.showDrawer && (!this.deferDrawer || this._drawerReady), f = typeof window < "u" && window.innerWidth >= this.BP_MD, p = this.showDrawer && (f ? this.alwaysShowMenuButton || this._collapsed : !0), m = p && !f, h = p && f, g = (this.searchButtonLabel ?? "").trim() || "Sök";
|
|
1157
|
+
let c = this.searchHeight && this.searchHeight.trim() ? `--scb-search-height:${this.searchHeight.trim()}` : i, l = e.length > 0 || this.reserveTabs || this.layoutPending, u = (this.reserveTabs || this.layoutPending) && (this.layoutPending || e.length === 0), d = this.showDrawer && (!this.deferDrawer || this._drawerReady), f = typeof window < "u" && window.innerWidth >= this.BP_MD, p = this.showDrawer && (f ? this.alwaysShowMenuButton || this._collapsed : !0), m = p && !f, h = p && f, g = (this.searchButtonLabel ?? "").trim() || "Sök", _ = this.showSearch && !this._mobileSearchOpen;
|
|
1114
1158
|
return r`
|
|
1115
1159
|
<slot
|
|
1116
1160
|
id="data-slot"
|
|
@@ -1153,11 +1197,12 @@ var u = {
|
|
|
1153
1197
|
<div class="actions">
|
|
1154
1198
|
<nav class="utility" aria-label="Funktionslänkar">
|
|
1155
1199
|
${t.map((e) => r`
|
|
1156
|
-
<scb-
|
|
1200
|
+
<scb-button
|
|
1201
|
+
variant="text"
|
|
1157
1202
|
.href=${e.href}
|
|
1158
|
-
.target=${e.target ??
|
|
1159
|
-
|
|
1160
|
-
>
|
|
1203
|
+
.target=${e.target ?? ""}
|
|
1204
|
+
label=${e.label}
|
|
1205
|
+
></scb-button>
|
|
1161
1206
|
`)}
|
|
1162
1207
|
</nav>
|
|
1163
1208
|
|
|
@@ -1181,9 +1226,38 @@ var u = {
|
|
|
1181
1226
|
></scb-button>
|
|
1182
1227
|
</div>
|
|
1183
1228
|
` : i}
|
|
1184
|
-
${
|
|
1229
|
+
${_ ? r`
|
|
1230
|
+
<scb-icon-button
|
|
1231
|
+
class="mobile-search-trigger"
|
|
1232
|
+
variant="filled-tonal"
|
|
1233
|
+
icon="search"
|
|
1234
|
+
.size=${this.size}
|
|
1235
|
+
@click=${this._onMobileSearchToggle}
|
|
1236
|
+
></scb-icon-button>
|
|
1237
|
+
` : i}
|
|
1238
|
+
${m ? this._renderMenuButton("", !0) : i}
|
|
1185
1239
|
</div>
|
|
1186
1240
|
|
|
1241
|
+
${this.showSearch && this._mobileSearchOpen ? r`
|
|
1242
|
+
<div class="mobile-search-panel" style=${c}>
|
|
1243
|
+
<scb-search
|
|
1244
|
+
.size=${this.size}
|
|
1245
|
+
style=${c}
|
|
1246
|
+
.value=${this.searchText}
|
|
1247
|
+
.supportingText=${this.searchPlaceholder ?? ""}
|
|
1248
|
+
@scb-search-input=${this._onSearchInput}
|
|
1249
|
+
@scb-search-submit=${this._onSearchSubmit}
|
|
1250
|
+
@scb-search-clear=${this._onSearchClear}
|
|
1251
|
+
></scb-search>
|
|
1252
|
+
<scb-icon-button
|
|
1253
|
+
variant="filled-tonal"
|
|
1254
|
+
icon="close"
|
|
1255
|
+
.size=${this.size}
|
|
1256
|
+
@click=${this._onMobileSearchToggle}
|
|
1257
|
+
></scb-icon-button>
|
|
1258
|
+
</div>
|
|
1259
|
+
` : i}
|
|
1260
|
+
|
|
1187
1261
|
</div>
|
|
1188
1262
|
</scb-grid-item>
|
|
1189
1263
|
|
|
@@ -1493,6 +1567,6 @@ e([o({
|
|
|
1493
1567
|
type: String,
|
|
1494
1568
|
attribute: "search-text",
|
|
1495
1569
|
reflect: !0
|
|
1496
|
-
})], p.prototype, "searchText", void 0), e([s()], p.prototype, "_drawerId", void 0), e([s()], p.prototype, "_menuExpanded", void 0), e([s()], p.prototype, "_searchId", void 0), e([s()], p.prototype, "_drawerReady", void 0), e([s()], p.prototype, "_slotNavItems", void 0), e([s()], p.prototype, "_slotUtils", void 0), e([s()], p.prototype, "_slotMenu", void 0), e([s()], p.prototype, "_collapsed", void 0), e([s()], p.prototype, "_hideLogoText", void 0), p = c = e([a("scb-header")], p);
|
|
1570
|
+
})], p.prototype, "searchText", void 0), e([s()], p.prototype, "_drawerId", void 0), e([s()], p.prototype, "_menuExpanded", void 0), e([s()], p.prototype, "_searchId", void 0), e([s()], p.prototype, "_drawerReady", void 0), e([s()], p.prototype, "_mobileSearchOpen", void 0), e([s()], p.prototype, "_slotNavItems", void 0), e([s()], p.prototype, "_slotUtils", void 0), e([s()], p.prototype, "_slotMenu", void 0), e([s()], p.prototype, "_collapsed", void 0), e([s()], p.prototype, "_hideLogoText", void 0), p = c = e([a("scb-header")], p);
|
|
1497
1571
|
//#endregion
|
|
1498
1572
|
export { p as ScbHeader };
|
package/scb-wc.bundle.js
CHANGED
|
@@ -8919,7 +8919,7 @@
|
|
|
8919
8919
|
);
|
|
8920
8920
|
}
|
|
8921
8921
|
}
|
|
8922
|
-
`,document.head.appendChild(e);let t=e=>{let t=String(e??``).trim();if(t)return/^\d+$/.test(t)?`var(--spacing-${Math.max(0,Math.min(14,parseInt(t,10)))})`:t},n=e=>{let t=String(e??``).trim();if(!t)return!1;try{let e=JSON.parse(t);return Array.isArray(e)&&e.length>0}catch{return!1}},r=e=>e!=null&&!/^(false|0|off|no)$/i.test(e.trim()),i=e=>{for(let t of Array.from(e.children)){let e=t.tagName.toLowerCase();if(e===`scb-header-tab`||e===`scb-dropdown`)return!0}return!1},a=e=>{i(e)||n(e.getAttribute(`tabs`))||r(e.getAttribute(`reserve-tabs`))||r(e.getAttribute(`layout-pending`))?e.setAttribute(`data-pre-has-tabs`,``):e.removeAttribute(`data-pre-has-tabs`);let a=t(e.getAttribute(`spacing`)),o=t(e.getAttribute(`spacing-top`))??a,s=t(e.getAttribute(`spacing-bottom`))??a;o?e.style.setProperty(`--scb-header-spacing-block-start`,o):e.style.removeProperty(`--scb-header-spacing-block-start`),s?e.style.setProperty(`--scb-header-spacing-block-end`,s):e.style.removeProperty(`--scb-header-spacing-block-end`);let c=(e.getAttribute(`logo-width`)??``).trim();c?e.style.setProperty(`--scb-header-pre-logo-w`,c):e.style.removeProperty(`--scb-header-pre-logo-w`);let l=(e.getAttribute(`logo-height`)??``).trim();l?e.style.setProperty(`--scb-header-pre-logo-img-h`,l):e.style.removeProperty(`--scb-header-pre-logo-img-h`);let u=(e.getAttribute(`search-height`)??``).trim();u?e.style.setProperty(`--scb-header-pre-control-size`,u):e.style.removeProperty(`--scb-header-pre-control-size`)};document.querySelectorAll(`scb-header`).forEach(a);let o=new MutationObserver(e=>{for(let t of e){if(t.type===`attributes`){let e=t.target;e instanceof HTMLElement&&e.tagName.toLowerCase()===`scb-header`&&a(e);continue}if(t.type===`childList`){let e=[...Array.from(t.addedNodes),...Array.from(t.removedNodes)];for(let t of e){if(!(t instanceof HTMLElement))continue;if(t.tagName.toLowerCase()===`scb-header`){a(t);continue}let e=t.closest?.(`scb-header`);e&&a(e)}}}});o.observe(document.documentElement,{subtree:!0,childList:!0,attributes:!0,attributeFilter:[`tabs`,`spacing`,`spacing-top`,`spacing-bottom`,`logo-width`,`logo-height`,`logo-aspect-ratio`,`logo-alt`,`logotype-text`,`search-height`,`reserve-tabs`,`layout-pending`]}),customElements.whenDefined(`scb-header`).then(()=>{o.disconnect()})})();var yu={fromAttribute:e=>e==null?!0:!/^(false|0|off|no)$/i.test(e),toAttribute:e=>String(!!e)},bu={fromAttribute:e=>e==null?!1:!/^(false|0|off|no)$/i.test(e),toAttribute:e=>e?``:null},xu={fromAttribute:e=>e===`small`||e===`large`?e:`medium`,toAttribute:e=>{let t=String(e??``);return t===`small`||t===`large`?t:null}},Y=class extends S{static{_u=this}constructor(){super(),this.maxWidth=`1440px`,this.spacing=void 0,this.spacingTop=void 0,this.spacingBottom=void 0,this.size=`medium`,this.logoText=``,this.logotypeText=``,this.logoAlt=``,this.logoHref=`/`,this.logoSrc=``,this.logoWidth=``,this.logoHeight=``,this.logoAspectRatio=``,this.logoInvertDm=!1,this.banner=!1,this.tabs=[],this.activeTab=null,this.reserveTabs=!1,this.layoutPending=!1,this.utilityItems=[],this.searchButtonLabel=`Sök`,this.menuButtonLabel=`Meny`,this.deferDrawer=!1,this.showDrawer=!0,this.alwaysShowMenuButton=!1,this.showSearch=!0,this.includeUtilityInMenu=!1,this.drawerOverlay=!0,this.searchText=``,this._drawerId=`main-drawer`,this._menuExpanded=!1,this._searchId=`header-search`,this._drawerReady=!1,this._initialUpgradeComplete=!1,this._slotNavItems=[],this._slotUtils=[],this._slotMenu=[],this._measureScheduled=!1,this._scheduleMeasure=()=>{this.layoutPending||this._measureScheduled||(this._measureScheduled=!0,requestAnimationFrame(()=>{this._measureScheduled=!1,this._measure()}))},this._onWindowResize=()=>{this._scheduleMeasure()},this._onMenuSelect=e=>{let t=e.detail;this.dispatchEvent(new CustomEvent(`scb-menu-select`,{detail:t,bubbles:!0,composed:!0})),this.dispatchEvent(new CustomEvent(`scbmenuselect`,{detail:t,bubbles:!0,composed:!0}));let n=t?.item,r=typeof t?.href==`string`?t.href:typeof t?.itemHref==`string`?t.itemHref:typeof t?.item_href==`string`?t.item_href:``,i=n?n.getAttribute(`item-href`)??n.getAttribute(`href`)??``:``;String(r||i||``).trim()&&this._closeDrawerNow()},this._collapsed=!1,this._unlockAtWidth=0,this._hideLogoText=!1,this._logoTextUnlockAt=0,this._slotWatchers=[],this._harvestPending=!1,this._harvest=(e={})=>{let t=Array.from(this.children),n=[],r=[],i=[],a=-1,o=e=>({label:e.getAttribute(`label`)??``,href:e.getAttribute(`href`)??void 0,icon:e.getAttribute(`icon`)??void 0});for(let e of t){let t=e.tagName.toLowerCase();if(t===`scb-header-tab`){let t=e.getAttribute(`label`)??``,r=e.getAttribute(`href`),i=r&&r.trim()!==``?r:void 0;(e.hasAttribute(`selected`)||e.getAttribute(`selected`)===`true`||e.getAttribute(`active`)===`true`||e.getAttribute(`aria-current`)===`page`)&&a===-1&&(a=n.length),n.push({kind:`tab`,label:t,href:i});continue}if(t===`scb-badge`){let t=e.querySelector(`scb-dropdown`);if(t){let r=t.getAttribute(`label`)??``;(t.hasAttribute(`selected`)||t.getAttribute(`selected`)===`true`||t.getAttribute(`active`)===`true`||t.getAttribute(`aria-current`)===`page`)&&a===-1&&(a=n.length);let i=`scb-header-tab-${n.length}`;e.getAttribute(`slot`)!==i&&e.setAttribute(`slot`,i),t.hasAttribute(`slot`)&&t.removeAttribute(`slot`),t.hasAttribute(`as-tab`)||t.setAttribute(`as-tab`,``),n.push({kind:`dropdown`,slotName:i,label:r});continue}}if(t===`scb-dropdown`){let t=e.getAttribute(`label`)??``;(e.hasAttribute(`selected`)||e.getAttribute(`selected`)===`true`||e.getAttribute(`active`)===`true`||e.getAttribute(`aria-current`)===`page`)&&a===-1&&(a=n.length);let r=`scb-header-tab-${n.length}`;e.getAttribute(`slot`)!==r&&e.setAttribute(`slot`,r),e.hasAttribute(`as-tab`)||e.setAttribute(`as-tab`,``),n.push({kind:`dropdown`,slotName:r,label:t});continue}if(t===`scb-header-utility`){r.push({label:e.getAttribute(`label`)??``,href:e.getAttribute(`href`)??`#`,target:e.getAttribute(`target`)??void 0});continue}if(t===`scb-header-menu-group`){let t={label:e.getAttribute(`label`)??``,icon:e.getAttribute(`icon`)??void 0,children:[]};e.querySelectorAll(`scb-header-menu-item`).forEach(e=>t.children.push(o(e))),i.push(t);continue}t===`scb-header-menu-item`&&i.push(o(e))}let s=!this._sameNavItems(this._slotNavItems,n),c=!this._sameUtilityItems(this._slotUtils,r),l=!this._sameMenuNodes(this._slotMenu,i);s&&(this._slotNavItems=n),c&&(this._slotUtils=r),l&&(this._slotMenu=i),!this.hasAttribute(`active-tab`)&&a>=0&&this.activeTab!==a&&(this.activeTab=a),(e.scheduleMeasure??!0)&&queueMicrotask(()=>{this.updateComplete.then(()=>{this._scheduleMeasure()})})},this._measure=()=>{if(this.layoutPending)return;let e=this._top,t=this._logoGroup;if(!e||!t)return;let n=window.innerWidth,r=e.clientWidth,i=this._overflows(this._util),a=this._tabsOverflows(),o=n<this.BP_MD||i||a;this._collapsed?!o&&r>=this._unlockAtWidth&&this._setCollapsed(!1):o&&(this._unlockAtWidth=r+this._HYST,this._setCollapsed(!0));let s=!1;if(this.showSearch&&n>=this.BP_SM&&n<this.BP_MD&&this._searchWrap){let i=getComputedStyle(this._searchWrap),a=Math.max(this._num(i.minWidth,this._tokenPx(`--scb-header-search-min`,250)),this._tokenPx(`--scb-header-search-min`,250)),o=this._num(getComputedStyle(e).gap,this._tokenPx(`--spacing-7`,24)),c=this.showDrawer&&(this.alwaysShowMenuButton||n<this.BP_MD||this._collapsed)?this._menuBtn?.getBoundingClientRect().width||this._tokenPx(`--icon-size-extra-extra-large`,48):0;s=t.getBoundingClientRect().width+o+a+o+c+8>r+.5}this._setHideSearch(s);let c=!1;if(this.showDrawer&&(this.alwaysShowMenuButton||n<this.BP_MD||this._collapsed)&&!this._visible(this._util)&&!this._visible(this._searchWrap)){let t=this._num(getComputedStyle(e).gap,this._tokenPx(`--spacing-7`,24)),n=this._menuBtn?.getBoundingClientRect().width||this._tokenPx(`--icon-size-extra-extra-large`,48),i=(this._logoGroup?.getBoundingClientRect().width||0)+t+n;this._hideLogoText?c=!(r>=this._logoTextUnlockAt):i>r+.5&&(c=!0,this._logoTextUnlockAt=r+this._HYST)}else c=!1,this._logoTextUnlockAt=0;this._setHideLogoText(c)},this._onDrawerOpened=()=>{this._menuExpanded=!0,this._syncMenuBtnAria(),this.dispatchEvent(new CustomEvent(`drawer-open`,{bubbles:!0,composed:!0})),this.dispatchEvent(new CustomEvent(`draweropen`,{bubbles:!0,composed:!0}))},this._onDrawerClosed=()=>{this._menuExpanded=!1,this._syncMenuBtnAria(),this.dispatchEvent(new CustomEvent(`drawer-close`,{bubbles:!0,composed:!0})),this.dispatchEvent(new CustomEvent(`drawerclose`,{bubbles:!0,composed:!0}))},this._onMenuClick=async e=>{this.showDrawer&&(this.dispatchEvent(new CustomEvent(`menu-click`,{bubbles:!0,composed:!0})),this.dispatchEvent(new CustomEvent(`menuclick`,{bubbles:!0,composed:!0})),!this._drawerReady&&(e.stopPropagation(),await this._ensureDrawerReady(),await this.updateComplete,this._openDrawerNow()))},this._onSearchClick=e=>{let t=this._searchEl;if(t?.submit&&typeof t.submit==`function`){t.submit();return}let n=t?.value??``;this.searchText=n,this.dispatchEvent(new CustomEvent(`search-click`,{detail:{value:n},bubbles:!0,composed:!0})),this.dispatchEvent(new CustomEvent(`searchclick`,{detail:{value:n},bubbles:!0,composed:!0})),t?.focus?.()},this._onTabClick=e=>{let t=e.currentTarget;if(!t)return;let n=t.tagName.toLowerCase()===`a`;if(n&&(e.defaultPrevented||e.button!==0||e.metaKey||e.ctrlKey||e.shiftKey||e.altKey))return;let r=t.getAttribute(`data-index`),i=r==null?0:Number(r),a=this._getNavItems()[i];if(a?.kind===`dropdown`)return;this.activeTab=i;let o=a?.kind===`tab`?a.href??``:``,s=new CustomEvent(`tab-change`,{detail:{index:i,href:o},bubbles:!0,composed:!0,cancelable:!0}),c=new CustomEvent(`tabchange`,{detail:{index:i,href:o},bubbles:!0,composed:!0,cancelable:!0});!(this.dispatchEvent(s)&&this.dispatchEvent(c))&&n&&e.preventDefault()},this._onDropdownTabActivate=e=>{let t=e.detail?.dataIndex,n=typeof t==`number`?t:typeof t==`string`?Number(t):this._readTabIndexFromEvent(e);if(n==null||!Number.isFinite(n))return;let r=this._getNavItems();n<0||n>=r.length||r[n]?.kind===`dropdown`&&(this.activeTab=n,this.dispatchEvent(new CustomEvent(`tab-change`,{detail:{index:n,href:``},bubbles:!0,composed:!0,cancelable:!0})),this.dispatchEvent(new CustomEvent(`tabchange`,{detail:{index:n,href:``},bubbles:!0,composed:!0,cancelable:!0})))},this._onTabsKeydown=e=>{let t=e.key;if(t!==`ArrowLeft`&&t!==`ArrowRight`&&t!==`Home`&&t!==`End`)return;let n=this._getNavItems();if(!n.length)return;let r=this._readTabIndexFromEvent(e);if(r==null)return;let i=Math.max(0,Math.min(n.length-1,r));t===`ArrowRight`?i=(i+1)%n.length:t===`ArrowLeft`?i=(i-1+n.length)%n.length:t===`Home`?i=0:t===`End`&&(i=n.length-1),e.preventDefault(),this._focusTabAtIndex(i)},this._onSearchInput=e=>{this.searchText=e.detail?.value??``,this.dispatchEvent(new CustomEvent(`search-input`,{detail:{value:this.searchText},bubbles:!0,composed:!0})),this.dispatchEvent(new CustomEvent(`searchinput`,{detail:{value:this.searchText},bubbles:!0,composed:!0})),this.dispatchEvent(new CustomEvent(`search-text-change`,{detail:{value:this.searchText},bubbles:!0,composed:!0})),this.dispatchEvent(new CustomEvent(`searchtextchange`,{detail:{value:this.searchText},bubbles:!0,composed:!0}))},this._onSearchSubmit=e=>{this.searchText=e.detail?.value??``,this.dispatchEvent(new CustomEvent(`search-change`,{detail:{value:this.searchText,active:e.detail?.active},bubbles:!0,composed:!0})),this.dispatchEvent(new CustomEvent(`searchchange`,{detail:{value:this.searchText,active:e.detail?.active},bubbles:!0,composed:!0}))},this._onSearchClear=()=>{this.searchText=``,this.dispatchEvent(new CustomEvent(`search-text-change`,{detail:{value:``},bubbles:!0,composed:!0})),this.dispatchEvent(new CustomEvent(`searchtextchange`,{detail:{value:``},bubbles:!0,composed:!0}))};let e=++vu;this._drawerId=`scb-header-drawer-${e}`,this._searchId=`scb-header-search-${e}`}static{this._JSON_ARRAY={fromAttribute:e=>{if(e==null||e===``)return[];try{let t=JSON.parse(e);return Array.isArray(t)?t:[]}catch{return[]}},toAttribute:e=>e==null?null:JSON.stringify(e)}}requestLayout(){this.layoutPending||(this.setAttribute(`data-layout-settling`,``),this.updateComplete.then(()=>{this.isConnected&&(this._measure(),this.removeAttribute(`data-layout-settling`))}))}static{this.BP_SM_DEFAULT=600}static{this.BP_MD_DEFAULT=840}get _HYST(){return this._tokenPx(`--spacing-11`,64)}get BP_SM(){return this._tokenPx(`--bp-sm`,_u.BP_SM_DEFAULT)}get BP_MD(){return this._tokenPx(`--bp-md`,_u.BP_MD_DEFAULT)}_scheduleHarvest(){this._harvestPending||(this._harvestPending=!0,queueMicrotask(()=>{this._harvestPending=!1,this._harvest()}))}static{this.styles=p`
|
|
8922
|
+
`,document.head.appendChild(e);let t=e=>{let t=String(e??``).trim();if(t)return/^\d+$/.test(t)?`var(--spacing-${Math.max(0,Math.min(14,parseInt(t,10)))})`:t},n=e=>{let t=String(e??``).trim();if(!t)return!1;try{let e=JSON.parse(t);return Array.isArray(e)&&e.length>0}catch{return!1}},r=e=>e!=null&&!/^(false|0|off|no)$/i.test(e.trim()),i=e=>{for(let t of Array.from(e.children)){let e=t.tagName.toLowerCase();if(e===`scb-header-tab`||e===`scb-dropdown`)return!0}return!1},a=e=>{i(e)||n(e.getAttribute(`tabs`))||r(e.getAttribute(`reserve-tabs`))||r(e.getAttribute(`layout-pending`))?e.setAttribute(`data-pre-has-tabs`,``):e.removeAttribute(`data-pre-has-tabs`);let a=t(e.getAttribute(`spacing`)),o=t(e.getAttribute(`spacing-top`))??a,s=t(e.getAttribute(`spacing-bottom`))??a;o?e.style.setProperty(`--scb-header-spacing-block-start`,o):e.style.removeProperty(`--scb-header-spacing-block-start`),s?e.style.setProperty(`--scb-header-spacing-block-end`,s):e.style.removeProperty(`--scb-header-spacing-block-end`);let c=(e.getAttribute(`logo-width`)??``).trim();c?e.style.setProperty(`--scb-header-pre-logo-w`,c):e.style.removeProperty(`--scb-header-pre-logo-w`);let l=(e.getAttribute(`logo-height`)??``).trim();l?e.style.setProperty(`--scb-header-pre-logo-img-h`,l):e.style.removeProperty(`--scb-header-pre-logo-img-h`);let u=(e.getAttribute(`search-height`)??``).trim();u?e.style.setProperty(`--scb-header-pre-control-size`,u):e.style.removeProperty(`--scb-header-pre-control-size`)};document.querySelectorAll(`scb-header`).forEach(a);let o=new MutationObserver(e=>{for(let t of e){if(t.type===`attributes`){let e=t.target;e instanceof HTMLElement&&e.tagName.toLowerCase()===`scb-header`&&a(e);continue}if(t.type===`childList`){let e=[...Array.from(t.addedNodes),...Array.from(t.removedNodes)];for(let t of e){if(!(t instanceof HTMLElement))continue;if(t.tagName.toLowerCase()===`scb-header`){a(t);continue}let e=t.closest?.(`scb-header`);e&&a(e)}}}});o.observe(document.documentElement,{subtree:!0,childList:!0,attributes:!0,attributeFilter:[`tabs`,`spacing`,`spacing-top`,`spacing-bottom`,`logo-width`,`logo-height`,`logo-aspect-ratio`,`logo-alt`,`logotype-text`,`search-height`,`reserve-tabs`,`layout-pending`]}),customElements.whenDefined(`scb-header`).then(()=>{o.disconnect()})})();var yu={fromAttribute:e=>e==null?!0:!/^(false|0|off|no)$/i.test(e),toAttribute:e=>String(!!e)},bu={fromAttribute:e=>e==null?!1:!/^(false|0|off|no)$/i.test(e),toAttribute:e=>e?``:null},xu={fromAttribute:e=>e===`small`||e===`large`?e:`medium`,toAttribute:e=>{let t=String(e??``);return t===`small`||t===`large`?t:null}},Y=class extends S{static{_u=this}constructor(){super(),this.maxWidth=`1440px`,this.spacing=void 0,this.spacingTop=void 0,this.spacingBottom=void 0,this.size=`medium`,this.logoText=``,this.logotypeText=``,this.logoAlt=``,this.logoHref=`/`,this.logoSrc=``,this.logoWidth=``,this.logoHeight=``,this.logoAspectRatio=``,this.logoInvertDm=!1,this.banner=!1,this.tabs=[],this.activeTab=null,this.reserveTabs=!1,this.layoutPending=!1,this.utilityItems=[],this.searchButtonLabel=`Sök`,this.menuButtonLabel=`Meny`,this.deferDrawer=!1,this.showDrawer=!0,this.alwaysShowMenuButton=!1,this.showSearch=!0,this.includeUtilityInMenu=!1,this.drawerOverlay=!0,this.searchText=``,this._drawerId=`main-drawer`,this._menuExpanded=!1,this._searchId=`header-search`,this._drawerReady=!1,this._mobileSearchOpen=!1,this._initialUpgradeComplete=!1,this._slotNavItems=[],this._slotUtils=[],this._slotMenu=[],this._measureScheduled=!1,this._scheduleMeasure=()=>{this.layoutPending||this._measureScheduled||(this._measureScheduled=!0,requestAnimationFrame(()=>{this._measureScheduled=!1,this._measure()}))},this._onWindowResize=()=>{window.innerWidth>=this.BP_SM&&this._mobileSearchOpen&&this._setMobileSearchOpen(!1),this._scheduleMeasure()},this._onMenuSelect=e=>{let t=e.detail;this.dispatchEvent(new CustomEvent(`scb-menu-select`,{detail:t,bubbles:!0,composed:!0})),this.dispatchEvent(new CustomEvent(`scbmenuselect`,{detail:t,bubbles:!0,composed:!0}));let n=t?.item,r=typeof t?.href==`string`?t.href:typeof t?.itemHref==`string`?t.itemHref:typeof t?.item_href==`string`?t.item_href:``,i=n?n.getAttribute(`item-href`)??n.getAttribute(`href`)??``:``;String(r||i||``).trim()&&this._closeDrawerNow()},this._collapsed=!1,this._unlockAtWidth=0,this._hideLogoText=!1,this._logoTextUnlockAt=0,this._slotWatchers=[],this._harvestPending=!1,this._harvest=(e={})=>{let t=Array.from(this.children),n=[],r=[],i=[],a=-1,o=e=>({label:e.getAttribute(`label`)??``,href:e.getAttribute(`href`)??void 0,icon:e.getAttribute(`icon`)??void 0});for(let e of t){let t=e.tagName.toLowerCase();if(t===`scb-header-tab`){let t=e.getAttribute(`label`)??``,r=e.getAttribute(`href`),i=r&&r.trim()!==``?r:void 0;(e.hasAttribute(`selected`)||e.getAttribute(`selected`)===`true`||e.getAttribute(`active`)===`true`||e.getAttribute(`aria-current`)===`page`)&&a===-1&&(a=n.length),n.push({kind:`tab`,label:t,href:i});continue}if(t===`scb-badge`){let t=e.querySelector(`scb-dropdown`);if(t){let r=t.getAttribute(`label`)??``;(t.hasAttribute(`selected`)||t.getAttribute(`selected`)===`true`||t.getAttribute(`active`)===`true`||t.getAttribute(`aria-current`)===`page`)&&a===-1&&(a=n.length);let i=`scb-header-tab-${n.length}`;e.getAttribute(`slot`)!==i&&e.setAttribute(`slot`,i),t.hasAttribute(`slot`)&&t.removeAttribute(`slot`),t.hasAttribute(`as-tab`)||t.setAttribute(`as-tab`,``),n.push({kind:`dropdown`,slotName:i,label:r});continue}}if(t===`scb-dropdown`){let t=e.getAttribute(`label`)??``;(e.hasAttribute(`selected`)||e.getAttribute(`selected`)===`true`||e.getAttribute(`active`)===`true`||e.getAttribute(`aria-current`)===`page`)&&a===-1&&(a=n.length);let r=`scb-header-tab-${n.length}`;e.getAttribute(`slot`)!==r&&e.setAttribute(`slot`,r),e.hasAttribute(`as-tab`)||e.setAttribute(`as-tab`,``),n.push({kind:`dropdown`,slotName:r,label:t});continue}if(t===`scb-header-utility`){r.push({label:e.getAttribute(`label`)??``,href:e.getAttribute(`href`)??`#`,target:e.getAttribute(`target`)??void 0});continue}if(t===`scb-header-menu-group`){let t={label:e.getAttribute(`label`)??``,icon:e.getAttribute(`icon`)??void 0,children:[]};e.querySelectorAll(`scb-header-menu-item`).forEach(e=>t.children.push(o(e))),i.push(t);continue}t===`scb-header-menu-item`&&i.push(o(e))}let s=!this._sameNavItems(this._slotNavItems,n),c=!this._sameUtilityItems(this._slotUtils,r),l=!this._sameMenuNodes(this._slotMenu,i);s&&(this._slotNavItems=n),c&&(this._slotUtils=r),l&&(this._slotMenu=i),!this.hasAttribute(`active-tab`)&&a>=0&&this.activeTab!==a&&(this.activeTab=a),(e.scheduleMeasure??!0)&&queueMicrotask(()=>{this.updateComplete.then(()=>{this._scheduleMeasure()})})},this._measure=()=>{if(this.layoutPending)return;let e=this._top,t=this._logoGroup;if(!e||!t)return;let n=window.innerWidth,r=e.clientWidth,i=this._overflows(this._util),a=this._tabsOverflows(),o=n<this.BP_MD||i||a;this._collapsed?!o&&r>=this._unlockAtWidth&&this._setCollapsed(!1):o&&(this._unlockAtWidth=r+this._HYST,this._setCollapsed(!0));let s=!1;if(this.showSearch&&n>=this.BP_SM&&n<this.BP_MD&&this._searchWrap){let i=getComputedStyle(this._searchWrap),a=Math.max(this._num(i.minWidth,this._tokenPx(`--scb-header-search-min`,250)),this._tokenPx(`--scb-header-search-min`,250)),o=this._num(getComputedStyle(e).gap,this._tokenPx(`--spacing-7`,24)),c=this.showDrawer&&(this.alwaysShowMenuButton||n<this.BP_MD||this._collapsed)?this._menuBtn?.getBoundingClientRect().width||this._tokenPx(`--icon-size-extra-extra-large`,48):0;s=t.getBoundingClientRect().width+o+a+o+c+8>r+.5}this._setHideSearch(s);let c=!1;if(this.showDrawer&&(this.alwaysShowMenuButton||n<this.BP_MD||this._collapsed)&&!this._visible(this._util)&&!this._visible(this._searchWrap)){let t=this._num(getComputedStyle(e).gap,this._tokenPx(`--spacing-7`,24)),n=this._menuBtn?.getBoundingClientRect().width||this._tokenPx(`--icon-size-extra-extra-large`,48),i=(this._logoGroup?.getBoundingClientRect().width||0)+t+n;this._hideLogoText?c=!(r>=this._logoTextUnlockAt):i>r+.5&&(c=!0,this._logoTextUnlockAt=r+this._HYST)}else c=!1,this._logoTextUnlockAt=0;this._setHideLogoText(c)},this._onDrawerOpened=()=>{this._menuExpanded=!0,this._syncMenuBtnAria(),this.dispatchEvent(new CustomEvent(`drawer-open`,{bubbles:!0,composed:!0})),this.dispatchEvent(new CustomEvent(`draweropen`,{bubbles:!0,composed:!0}))},this._onDrawerClosed=()=>{this._menuExpanded=!1,this._syncMenuBtnAria(),this.dispatchEvent(new CustomEvent(`drawer-close`,{bubbles:!0,composed:!0})),this.dispatchEvent(new CustomEvent(`drawerclose`,{bubbles:!0,composed:!0}))},this._onMenuClick=async e=>{this.showDrawer&&(this._setMobileSearchOpen(!1),this.dispatchEvent(new CustomEvent(`menu-click`,{bubbles:!0,composed:!0})),this.dispatchEvent(new CustomEvent(`menuclick`,{bubbles:!0,composed:!0})),!this._drawerReady&&(e.stopPropagation(),await this._ensureDrawerReady(),await this.updateComplete,this._openDrawerNow()))},this._onSearchClick=e=>{let t=this._searchEl;if(t?.submit&&typeof t.submit==`function`){t.submit();return}let n=t?.value??``;this.searchText=n,this.dispatchEvent(new CustomEvent(`search-click`,{detail:{value:n},bubbles:!0,composed:!0})),this.dispatchEvent(new CustomEvent(`searchclick`,{detail:{value:n},bubbles:!0,composed:!0})),t?.focus?.()},this._onMobileSearchToggle=()=>{let e=!this._mobileSearchOpen;this._setMobileSearchOpen(e),e&&this.updateComplete.then(()=>{this.renderRoot.querySelector(`.mobile-search-panel scb-search`)?.focus?.()})},this._onTabClick=e=>{let t=e.currentTarget;if(!t)return;let n=t.tagName.toLowerCase()===`a`;if(n&&(e.defaultPrevented||e.button!==0||e.metaKey||e.ctrlKey||e.shiftKey||e.altKey))return;let r=t.getAttribute(`data-index`),i=r==null?0:Number(r),a=this._getNavItems()[i];if(a?.kind===`dropdown`)return;this.activeTab=i;let o=a?.kind===`tab`?a.href??``:``,s=new CustomEvent(`tab-change`,{detail:{index:i,href:o},bubbles:!0,composed:!0,cancelable:!0}),c=new CustomEvent(`tabchange`,{detail:{index:i,href:o},bubbles:!0,composed:!0,cancelable:!0});!(this.dispatchEvent(s)&&this.dispatchEvent(c))&&n&&e.preventDefault()},this._onDropdownTabActivate=e=>{let t=e.detail?.dataIndex,n=typeof t==`number`?t:typeof t==`string`?Number(t):this._readTabIndexFromEvent(e);if(n==null||!Number.isFinite(n))return;let r=this._getNavItems();n<0||n>=r.length||r[n]?.kind===`dropdown`&&(this.activeTab=n,this.dispatchEvent(new CustomEvent(`tab-change`,{detail:{index:n,href:``},bubbles:!0,composed:!0,cancelable:!0})),this.dispatchEvent(new CustomEvent(`tabchange`,{detail:{index:n,href:``},bubbles:!0,composed:!0,cancelable:!0})))},this._onTabsKeydown=e=>{let t=e.key;if(t!==`ArrowLeft`&&t!==`ArrowRight`&&t!==`Home`&&t!==`End`)return;let n=this._getNavItems();if(!n.length)return;let r=this._readTabIndexFromEvent(e);if(r==null)return;let i=Math.max(0,Math.min(n.length-1,r));t===`ArrowRight`?i=(i+1)%n.length:t===`ArrowLeft`?i=(i-1+n.length)%n.length:t===`Home`?i=0:t===`End`&&(i=n.length-1),e.preventDefault(),this._focusTabAtIndex(i)},this._onSearchInput=e=>{this.searchText=e.detail?.value??``,this.dispatchEvent(new CustomEvent(`search-input`,{detail:{value:this.searchText},bubbles:!0,composed:!0})),this.dispatchEvent(new CustomEvent(`searchinput`,{detail:{value:this.searchText},bubbles:!0,composed:!0})),this.dispatchEvent(new CustomEvent(`search-text-change`,{detail:{value:this.searchText},bubbles:!0,composed:!0})),this.dispatchEvent(new CustomEvent(`searchtextchange`,{detail:{value:this.searchText},bubbles:!0,composed:!0}))},this._onSearchSubmit=e=>{this.searchText=e.detail?.value??``,this.dispatchEvent(new CustomEvent(`search-change`,{detail:{value:this.searchText,active:e.detail?.active},bubbles:!0,composed:!0})),this.dispatchEvent(new CustomEvent(`searchchange`,{detail:{value:this.searchText,active:e.detail?.active},bubbles:!0,composed:!0}))},this._onSearchClear=()=>{this.searchText=``,this.dispatchEvent(new CustomEvent(`search-text-change`,{detail:{value:``},bubbles:!0,composed:!0})),this.dispatchEvent(new CustomEvent(`searchtextchange`,{detail:{value:``},bubbles:!0,composed:!0}))};let e=++vu;this._drawerId=`scb-header-drawer-${e}`,this._searchId=`scb-header-search-${e}`}static{this._JSON_ARRAY={fromAttribute:e=>{if(e==null||e===``)return[];try{let t=JSON.parse(e);return Array.isArray(t)?t:[]}catch{return[]}},toAttribute:e=>e==null?null:JSON.stringify(e)}}requestLayout(){this.layoutPending||(this.setAttribute(`data-layout-settling`,``),this.updateComplete.then(()=>{this.isConnected&&(this._measure(),this.removeAttribute(`data-layout-settling`))}))}static{this.BP_SM_DEFAULT=600}static{this.BP_MD_DEFAULT=840}get _HYST(){return this._tokenPx(`--spacing-11`,64)}get BP_SM(){return this._tokenPx(`--bp-sm`,_u.BP_SM_DEFAULT)}get BP_MD(){return this._tokenPx(`--bp-md`,_u.BP_MD_DEFAULT)}_scheduleHarvest(){this._harvestPending||(this._harvestPending=!0,queueMicrotask(()=>{this._harvestPending=!1,this._harvest()}))}static{this.styles=p`
|
|
8923
8923
|
:host {
|
|
8924
8924
|
display: block;
|
|
8925
8925
|
margin-block-start: var(--scb-header-spacing-block-start, 0);
|
|
@@ -9039,6 +9039,7 @@
|
|
|
9039
9039
|
gap: var(--spacing-7, 24px);
|
|
9040
9040
|
padding-block: var(--spacing-5, 16px);
|
|
9041
9041
|
min-width: 0;
|
|
9042
|
+
position: relative;
|
|
9042
9043
|
}
|
|
9043
9044
|
|
|
9044
9045
|
.logo-wrap {
|
|
@@ -9122,9 +9123,9 @@
|
|
|
9122
9123
|
.actions {
|
|
9123
9124
|
display: flex;
|
|
9124
9125
|
align-items: center;
|
|
9125
|
-
gap: var(--spacing-7, 24px);
|
|
9126
9126
|
margin-left: auto;
|
|
9127
9127
|
width: 100%;
|
|
9128
|
+
gap: var(--spacing-3, 8px);
|
|
9128
9129
|
justify-content: flex-end;
|
|
9129
9130
|
min-width: 0;
|
|
9130
9131
|
}
|
|
@@ -9133,26 +9134,8 @@
|
|
|
9133
9134
|
display: none;
|
|
9134
9135
|
flex-wrap: nowrap;
|
|
9135
9136
|
align-items: center;
|
|
9136
|
-
gap: var(--spacing-5, 16px);
|
|
9137
9137
|
min-width: 0;
|
|
9138
9138
|
}
|
|
9139
|
-
.utility scb-link {
|
|
9140
|
-
font-family: var(--md-sys-typescale-body-medium-font, var(--brand-font)),
|
|
9141
|
-
sans-serif;
|
|
9142
|
-
font-size: var(
|
|
9143
|
-
--scb-header-utility-font-size,
|
|
9144
|
-
var(--md-sys-typescale-body-medium-size)
|
|
9145
|
-
);
|
|
9146
|
-
line-height: var(
|
|
9147
|
-
--scb-header-utility-line-height,
|
|
9148
|
-
var(--md-sys-typescale-body-medium-line-height)
|
|
9149
|
-
);
|
|
9150
|
-
font-weight: var(--md-sys-typescale-body-medium-weight);
|
|
9151
|
-
letter-spacing: var(--md-sys-typescale-body-medium-tracking);
|
|
9152
|
-
--scb-link-color: var(--md-sys-color-primary);
|
|
9153
|
-
--scb-link-white-space: nowrap;
|
|
9154
|
-
}
|
|
9155
|
-
|
|
9156
9139
|
|
|
9157
9140
|
@media (min-width: 840px) {
|
|
9158
9141
|
.utility {
|
|
@@ -9173,7 +9156,7 @@
|
|
|
9173
9156
|
|
|
9174
9157
|
.menu-trigger {
|
|
9175
9158
|
display: none;
|
|
9176
|
-
align-self:
|
|
9159
|
+
align-self: center;
|
|
9177
9160
|
color: var(--md-sys-color-on-surface, #1b1b1f);
|
|
9178
9161
|
--md-sys-color-primary: var(--md-sys-color-on-surface, #1b1b1f);
|
|
9179
9162
|
}
|
|
@@ -9218,6 +9201,46 @@
|
|
|
9218
9201
|
display: flex;
|
|
9219
9202
|
}
|
|
9220
9203
|
}
|
|
9204
|
+
|
|
9205
|
+
.mobile-search-trigger {
|
|
9206
|
+
display: inline-flex;
|
|
9207
|
+
color: var(--md-sys-color-on-surface, #1b1b1f);
|
|
9208
|
+
--md-sys-color-primary: var(--md-sys-color-on-surface, #1b1b1f);
|
|
9209
|
+
}
|
|
9210
|
+
|
|
9211
|
+
@media (min-width: 600px) {
|
|
9212
|
+
.mobile-search-trigger {
|
|
9213
|
+
display: none;
|
|
9214
|
+
}
|
|
9215
|
+
}
|
|
9216
|
+
|
|
9217
|
+
.mobile-search-panel {
|
|
9218
|
+
display: none;
|
|
9219
|
+
position: absolute;
|
|
9220
|
+
inset: 0;
|
|
9221
|
+
z-index: 2;
|
|
9222
|
+
align-items: center;
|
|
9223
|
+
gap: var(--spacing-3, 8px);
|
|
9224
|
+
padding-block: var(--spacing-5, 16px);
|
|
9225
|
+
background: var(--scb-header-background, transparent);
|
|
9226
|
+
}
|
|
9227
|
+
|
|
9228
|
+
.mobile-search-panel scb-search {
|
|
9229
|
+
flex: 1 1 auto;
|
|
9230
|
+
min-width: 0;
|
|
9231
|
+
}
|
|
9232
|
+
|
|
9233
|
+
@media (max-width: 599.98px) {
|
|
9234
|
+
:host([data-mobile-search-open]) .mobile-search-panel {
|
|
9235
|
+
display: flex;
|
|
9236
|
+
}
|
|
9237
|
+
|
|
9238
|
+
:host([data-mobile-search-open]) .logo-wrap,
|
|
9239
|
+
:host([data-mobile-search-open]) .actions {
|
|
9240
|
+
visibility: hidden;
|
|
9241
|
+
pointer-events: none;
|
|
9242
|
+
}
|
|
9243
|
+
}
|
|
9221
9244
|
@media (min-width: 600px) and (max-width: 839.98px) {
|
|
9222
9245
|
:host([data-hide-search]) .search {
|
|
9223
9246
|
display: none !important;
|
|
@@ -9360,7 +9383,7 @@
|
|
|
9360
9383
|
:host([data-hide-logo-text]) .logo-text {
|
|
9361
9384
|
display: none;
|
|
9362
9385
|
}
|
|
9363
|
-
`}get _top(){return this.renderRoot.querySelector(`.top-row`)}get _util(){return this.renderRoot.querySelector(`.utility`)}get _logoGroup(){return this.renderRoot.querySelector(`.logo-wrap`)||this.renderRoot.querySelector(`.logo-group`)}get _searchWrap(){return this.renderRoot.querySelector(`.search`)}get _menuBtn(){return this.renderRoot.querySelector(`.menu-trigger`)}get _searchEl(){return this.renderRoot.querySelector(`#${this._searchId}`)}get _tabsNav(){return this.renderRoot.querySelector(`.tabs-nav`)}_attachSlotObservers(){this._slotMo?.disconnect(),this._slotWatchers.forEach(e=>e.disconnect()),this._slotWatchers=[];let e=[`label`,`href`,`icon`,`target`,`selected`,`aria-current`,`active`],t=t=>{let n=new MutationObserver(e=>{this._scheduleHarvest()});this._slotWatchers.push(n),n.observe(t,{attributes:!0,attributeFilter:e})},n=()=>{this._slotWatchers.forEach(e=>e.disconnect()),this._slotWatchers=[];let e=Array.from(this.children);for(let r of e){let e=r.tagName.toLowerCase();if((e===`scb-header-tab`||e===`scb-dropdown`||e===`scb-header-utility`||e===`scb-header-menu-item`||e===`scb-header-menu-group`||e===`scb-badge`)&&t(r),e===`scb-badge`){let e=r,i=new MutationObserver(e=>{n(),this._scheduleHarvest()});this._slotWatchers.push(i),i.observe(e,{childList:!0});let a=e.querySelector(`scb-dropdown`);a&&t(a);continue}if(e===`scb-header-menu-group`){let e=r,i=new MutationObserver(e=>{n(),this._scheduleHarvest()});this._slotWatchers.push(i),i.observe(e,{childList:!0,subtree:!0}),e.querySelectorAll(`scb-header-menu-item`).forEach(e=>t(e))}}},r=new MutationObserver(e=>{let t=!1;for(let n of e)if(n.type===`childList`){t=!0;break}t&&n(),this._scheduleHarvest()});this._slotMo=r,r.observe(this,{childList:!0}),n()}_sameNavItems(e,t){if(e.length!==t.length)return!1;for(let n=0;n<e.length;n+=1){let r=e[n],i=t[n];if(!r||!i||r.kind!==i.kind||r.label!==i.label)return!1;if(r.kind===`tab`&&i.kind===`tab`){if((r.href??``)!==(i.href??``))return!1}else if(r.kind===`dropdown`&&i.kind===`dropdown`&&r.slotName!==i.slotName)return!1}return!0}_sameUtilityItems(e,t){if(e.length!==t.length)return!1;for(let n=0;n<e.length;n+=1){let r=e[n],i=t[n];if(!r||!i||r.label!==i.label||r.href!==i.href||(r.target??``)!==(i.target??``))return!1}return!0}_sameMenuNodes(e,t){if(e.length!==t.length)return!1;for(let n=0;n<e.length;n+=1){let r=e[n],i=t[n];if(!r||!i||r.label!==i.label||(r.href??``)!==(i.href??``)||(r.icon??``)!==(i.icon??``)||!this._sameMenuNodes(r.children??[],i.children??[]))return!1}return!0}_setCollapsed(e){this._collapsed!==e&&(this._collapsed=e,e?this.setAttribute(`data-collapsed`,``):this.removeAttribute(`data-collapsed`))}_setHideSearch(e){e?this.setAttribute(`data-hide-search`,``):this.removeAttribute(`data-hide-search`)}_setHideLogoText(e){this._hideLogoText!==e&&(this._hideLogoText=e,e?this.setAttribute(`data-hide-logo-text`,``):this.removeAttribute(`data-hide-logo-text`))}_num(e,t){let n=Number.parseFloat(String(e??``).trim());return Number.isFinite(n)?n:t}_tokenPx(e,t){let n=getComputedStyle(this);return this._num(n.getPropertyValue(e),t)}_visible(e){return e?getComputedStyle(e).display!==`none`:!1}_overflows(e){return!e||!this._visible(e)?!1:e.scrollWidth>e.clientWidth+1}_tabsOverflows(){let e=this._tabsNav;if(!e||!this._visible(e))return!1;let t=Array.from(e.querySelectorAll(`.tab-wrap`));if(t.length===0)return!1;let n=e.getBoundingClientRect(),r=n.left;for(let e of t){let t=e.getBoundingClientRect();t.width<=0||t.right>r&&(r=t.right)}return r-n.left>n.width+1}connectedCallback(){super.connectedCallback(),this._initialUpgradeComplete||this.setAttribute(`data-upgrading`,``),this._harvest({scheduleMeasure:!1}),this._attachSlotObservers()}_finishInitialUpgrade(){this._initialUpgradeComplete||(this._initialUpgradeComplete=!0,requestAnimationFrame(()=>{this.isConnected&&(this._measure(),this.removeAttribute(`data-upgrading`))}))}firstUpdated(){this.showDrawer&&!this.deferDrawer&&this._ensureDrawerReady(),this.updateComplete.then(()=>{this._harvest({scheduleMeasure:!1}),this._attachSlotObservers(),this._syncDropdownTabs(),this._finishInitialUpgrade()});let e=this._top;e&&(this._ro=new ResizeObserver(()=>this._scheduleMeasure()),this._ro.observe(e)),window.addEventListener(`resize`,this._onWindowResize,{passive:!0})}updated(e){e.has(`searchMax`)&&this.style.setProperty(`--scb-header-search-max`,this.searchMax??`380px`),e.has(`searchMin`)&&this.style.setProperty(`--scb-header-search-min`,this.searchMin??`250px`),e.has(`searchHeight`)&&(this.searchHeight&&this.searchHeight.trim()?this.style.setProperty(`--scb-search-height`,this.searchHeight.trim()):this.style.removeProperty(`--scb-search-height`)),(e.has(`logoWidth`)||e.has(`logoHeight`)||e.has(`logoAspectRatio`))&&this._applyLogoSizing(),(e.has(`spacing`)||e.has(`spacingTop`)||e.has(`spacingBottom`))&&this._applySpacing(),(e.has(`utilityItems`)||e.has(`tabs`)||e.has(`logoText`)||e.has(`logotypeText`)||e.has(`logoSrc`)||e.has(`logoWidth`)||e.has(`logoHeight`)||e.has(`logoAspectRatio`)||e.has(`activeTab`)||e.has(`_slotNavItems`)||e.has(`_slotUtils`)||e.has(`_slotMenu`)||e.has(`showDrawer`)||e.has(`alwaysShowMenuButton`)||e.has(`showSearch`)||e.has(`layoutPending`)||e.has(`searchMax`)||e.has(`searchMin`)||e.has(`size`))&&this.updateComplete.then(()=>{this._scheduleMeasure()}),(e.has(`showDrawer`)||e.has(`deferDrawer`))&&this.showDrawer&&!this.deferDrawer&&this._ensureDrawerReady(),e.has(`layoutPending`)&&!this.layoutPending&&this.requestLayout(),(e.has(`activeTab`)||e.has(`_slotNavItems`)||e.has(`tabs`)||e.has(`size`))&&this.updateComplete.then(()=>{this._syncDropdownTabs()})}disconnectedCallback(){this._ro?.disconnect(),this._slotMo?.disconnect(),this._slotWatchers.forEach(e=>e.disconnect()),this._slotWatchers=[],window.removeEventListener(`resize`,this._onWindowResize),super.disconnectedCallback()}_mapSpacingToken(e){if(!e)return;let t=String(e).trim();if(t)return/^\d+$/.test(t)?`var(--spacing-${Math.max(0,Math.min(14,parseInt(t,10)))})`:t}_applySpacing(){let e=this._mapSpacingToken(this.spacing),t=this._mapSpacingToken(this.spacingTop)??e,n=this._mapSpacingToken(this.spacingBottom)??e;t?this.style.setProperty(`--scb-header-spacing-block-start`,t):this.style.removeProperty(`--scb-header-spacing-block-start`),n?this.style.setProperty(`--scb-header-spacing-block-end`,n):this.style.removeProperty(`--scb-header-spacing-block-end`)}_applyLogoSizing(){let e=(this.logoWidth??``).trim(),t=(this.logoHeight??``).trim(),n=(this.logoAspectRatio??``).trim();e?this.style.setProperty(`--scb-header-logo-img-w`,e):this.style.removeProperty(`--scb-header-logo-img-w`),t?this.style.setProperty(`--scb-header-logo-img-h`,t):e?this.style.setProperty(`--scb-header-logo-img-h`,`auto`):this.style.removeProperty(`--scb-header-logo-img-h`),n?this.style.setProperty(`--scb-header-logo-img-aspect-ratio`,n):this.style.removeProperty(`--scb-header-logo-img-aspect-ratio`)}_closeDrawerNow(){let e=this.renderRoot.querySelector(`#${this._drawerId}`);e&&(e.open=!1)}_openDrawerNow(){let e=this.renderRoot.querySelector(`#${this._drawerId}`);e&&(e.open=!0)}async _ensureDrawerReady(){this._drawerReady||=(this._drawerImportPromise??=Promise.all([Promise.resolve().then(()=>(Fl(),Ml)),Promise.resolve().then(()=>(gu(),hu))]).then(()=>void 0),await this._drawerImportPromise,!0)}_syncMenuBtnAria(){this.renderRoot.querySelectorAll(`.menu-trigger`).forEach(e=>{e.setAttribute(`aria-expanded`,String(this._menuExpanded))})}_getNavItems(){return this._slotNavItems.length?this._slotNavItems:(this.tabs??[]).map(e=>({kind:`tab`,...e}))}_getDropdownForSlot(e){let t=this.querySelector(`[slot="${e}"]`);return t?t.tagName.toLowerCase()===`scb-dropdown`?t:t.querySelector(`scb-dropdown`):null}_syncDropdownTabs(){this._getNavItems().forEach((e,t)=>{if(e.kind!==`dropdown`)return;let n=this._getDropdownForSlot(e.slotName);if(!n)return;let r=String(t);n.getAttribute(`data-index`)!==r&&n.setAttribute(`data-index`,r),n.hasAttribute(`as-tab`)||n.setAttribute(`as-tab`,``);let i=this.size,a=n;a?.size!==i&&(a.size=i),t===this.activeTab?n.getAttribute(`aria-current`)!==`page`&&n.setAttribute(`aria-current`,`page`):n.hasAttribute(`aria-current`)&&n.removeAttribute(`aria-current`)})}_readTabIndexFromEvent(e){let t=e.composedPath?e.composedPath():[];for(let e of t){if(!(e instanceof HTMLElement))continue;let t=e.getAttribute(`data-index`);if(t==null)continue;let n=Number(t);if(Number.isFinite(n))return n}return null}_focusTabAtIndex(e){let t=this._getNavItems()[e];if(t){if(t.kind===`dropdown`){this._getDropdownForSlot(t.slotName)?.focus?.();return}this.renderRoot.querySelector(`.tab-link[data-index="${e}"]`)?.focus?.()}}_renderMenuNodes(e){return!e||e.length===0?b``:b`${e.map(e=>this._renderMenuNode(e))}`}_renderMenuNode(e){let t=Array.isArray(e.children)&&e.children.length>0,n=(e.href??``).trim(),r=(e.icon??``).trim();return b`
|
|
9386
|
+
`}get _top(){return this.renderRoot.querySelector(`.top-row`)}get _util(){return this.renderRoot.querySelector(`.utility`)}get _logoGroup(){return this.renderRoot.querySelector(`.logo-wrap`)||this.renderRoot.querySelector(`.logo-group`)}get _searchWrap(){return this.renderRoot.querySelector(`.search`)}get _menuBtn(){return this.renderRoot.querySelector(`.menu-trigger`)}get _searchEl(){return this.renderRoot.querySelector(`#${this._searchId}`)}get _tabsNav(){return this.renderRoot.querySelector(`.tabs-nav`)}_attachSlotObservers(){this._slotMo?.disconnect(),this._slotWatchers.forEach(e=>e.disconnect()),this._slotWatchers=[];let e=[`label`,`href`,`icon`,`target`,`selected`,`aria-current`,`active`],t=t=>{let n=new MutationObserver(e=>{this._scheduleHarvest()});this._slotWatchers.push(n),n.observe(t,{attributes:!0,attributeFilter:e})},n=()=>{this._slotWatchers.forEach(e=>e.disconnect()),this._slotWatchers=[];let e=Array.from(this.children);for(let r of e){let e=r.tagName.toLowerCase();if((e===`scb-header-tab`||e===`scb-dropdown`||e===`scb-header-utility`||e===`scb-header-menu-item`||e===`scb-header-menu-group`||e===`scb-badge`)&&t(r),e===`scb-badge`){let e=r,i=new MutationObserver(e=>{n(),this._scheduleHarvest()});this._slotWatchers.push(i),i.observe(e,{childList:!0});let a=e.querySelector(`scb-dropdown`);a&&t(a);continue}if(e===`scb-header-menu-group`){let e=r,i=new MutationObserver(e=>{n(),this._scheduleHarvest()});this._slotWatchers.push(i),i.observe(e,{childList:!0,subtree:!0}),e.querySelectorAll(`scb-header-menu-item`).forEach(e=>t(e))}}},r=new MutationObserver(e=>{let t=!1;for(let n of e)if(n.type===`childList`){t=!0;break}t&&n(),this._scheduleHarvest()});this._slotMo=r,r.observe(this,{childList:!0}),n()}_sameNavItems(e,t){if(e.length!==t.length)return!1;for(let n=0;n<e.length;n+=1){let r=e[n],i=t[n];if(!r||!i||r.kind!==i.kind||r.label!==i.label)return!1;if(r.kind===`tab`&&i.kind===`tab`){if((r.href??``)!==(i.href??``))return!1}else if(r.kind===`dropdown`&&i.kind===`dropdown`&&r.slotName!==i.slotName)return!1}return!0}_sameUtilityItems(e,t){if(e.length!==t.length)return!1;for(let n=0;n<e.length;n+=1){let r=e[n],i=t[n];if(!r||!i||r.label!==i.label||r.href!==i.href||(r.target??``)!==(i.target??``))return!1}return!0}_sameMenuNodes(e,t){if(e.length!==t.length)return!1;for(let n=0;n<e.length;n+=1){let r=e[n],i=t[n];if(!r||!i||r.label!==i.label||(r.href??``)!==(i.href??``)||(r.icon??``)!==(i.icon??``)||!this._sameMenuNodes(r.children??[],i.children??[]))return!1}return!0}_setCollapsed(e){this._collapsed!==e&&(this._collapsed=e,e?this.setAttribute(`data-collapsed`,``):this.removeAttribute(`data-collapsed`))}_setHideSearch(e){e?this.setAttribute(`data-hide-search`,``):this.removeAttribute(`data-hide-search`)}_setHideLogoText(e){this._hideLogoText!==e&&(this._hideLogoText=e,e?this.setAttribute(`data-hide-logo-text`,``):this.removeAttribute(`data-hide-logo-text`))}_setMobileSearchOpen(e){this._mobileSearchOpen!==e&&(this._mobileSearchOpen=e,this.toggleAttribute(`data-mobile-search-open`,e))}_num(e,t){let n=Number.parseFloat(String(e??``).trim());return Number.isFinite(n)?n:t}_tokenPx(e,t){let n=getComputedStyle(this);return this._num(n.getPropertyValue(e),t)}_visible(e){return e?getComputedStyle(e).display!==`none`:!1}_overflows(e){return!e||!this._visible(e)?!1:e.scrollWidth>e.clientWidth+1}_tabsOverflows(){let e=this._tabsNav;if(!e||!this._visible(e))return!1;let t=Array.from(e.querySelectorAll(`.tab-wrap`));if(t.length===0)return!1;let n=e.getBoundingClientRect(),r=n.left;for(let e of t){let t=e.getBoundingClientRect();t.width<=0||t.right>r&&(r=t.right)}return r-n.left>n.width+1}connectedCallback(){super.connectedCallback(),this._initialUpgradeComplete||this.setAttribute(`data-upgrading`,``),this._harvest({scheduleMeasure:!1}),this._attachSlotObservers()}_finishInitialUpgrade(){this._initialUpgradeComplete||(this._initialUpgradeComplete=!0,requestAnimationFrame(()=>{this.isConnected&&(this._measure(),this.removeAttribute(`data-upgrading`))}))}firstUpdated(){this.showDrawer&&!this.deferDrawer&&this._ensureDrawerReady(),this.updateComplete.then(()=>{this._harvest({scheduleMeasure:!1}),this._attachSlotObservers(),this._syncDropdownTabs(),this._finishInitialUpgrade()});let e=this._top;e&&(this._ro=new ResizeObserver(()=>this._scheduleMeasure()),this._ro.observe(e)),window.addEventListener(`resize`,this._onWindowResize,{passive:!0})}updated(e){e.has(`searchMax`)&&this.style.setProperty(`--scb-header-search-max`,this.searchMax??`380px`),e.has(`searchMin`)&&this.style.setProperty(`--scb-header-search-min`,this.searchMin??`250px`),e.has(`searchHeight`)&&(this.searchHeight&&this.searchHeight.trim()?this.style.setProperty(`--scb-search-height`,this.searchHeight.trim()):this.style.removeProperty(`--scb-search-height`)),(e.has(`logoWidth`)||e.has(`logoHeight`)||e.has(`logoAspectRatio`))&&this._applyLogoSizing(),(e.has(`spacing`)||e.has(`spacingTop`)||e.has(`spacingBottom`))&&this._applySpacing(),(e.has(`utilityItems`)||e.has(`tabs`)||e.has(`logoText`)||e.has(`logotypeText`)||e.has(`logoSrc`)||e.has(`logoWidth`)||e.has(`logoHeight`)||e.has(`logoAspectRatio`)||e.has(`activeTab`)||e.has(`_slotNavItems`)||e.has(`_slotUtils`)||e.has(`_slotMenu`)||e.has(`showDrawer`)||e.has(`alwaysShowMenuButton`)||e.has(`showSearch`)||e.has(`layoutPending`)||e.has(`searchMax`)||e.has(`searchMin`)||e.has(`size`))&&this.updateComplete.then(()=>{this._scheduleMeasure()}),(e.has(`showDrawer`)||e.has(`deferDrawer`))&&this.showDrawer&&!this.deferDrawer&&this._ensureDrawerReady(),e.has(`showSearch`)&&!this.showSearch&&this._setMobileSearchOpen(!1),e.has(`layoutPending`)&&!this.layoutPending&&this.requestLayout(),(e.has(`activeTab`)||e.has(`_slotNavItems`)||e.has(`tabs`)||e.has(`size`))&&this.updateComplete.then(()=>{this._syncDropdownTabs()})}disconnectedCallback(){this._ro?.disconnect(),this._slotMo?.disconnect(),this._slotWatchers.forEach(e=>e.disconnect()),this._slotWatchers=[],window.removeEventListener(`resize`,this._onWindowResize),super.disconnectedCallback()}_mapSpacingToken(e){if(!e)return;let t=String(e).trim();if(t)return/^\d+$/.test(t)?`var(--spacing-${Math.max(0,Math.min(14,parseInt(t,10)))})`:t}_applySpacing(){let e=this._mapSpacingToken(this.spacing),t=this._mapSpacingToken(this.spacingTop)??e,n=this._mapSpacingToken(this.spacingBottom)??e;t?this.style.setProperty(`--scb-header-spacing-block-start`,t):this.style.removeProperty(`--scb-header-spacing-block-start`),n?this.style.setProperty(`--scb-header-spacing-block-end`,n):this.style.removeProperty(`--scb-header-spacing-block-end`)}_applyLogoSizing(){let e=(this.logoWidth??``).trim(),t=(this.logoHeight??``).trim(),n=(this.logoAspectRatio??``).trim();e?this.style.setProperty(`--scb-header-logo-img-w`,e):this.style.removeProperty(`--scb-header-logo-img-w`),t?this.style.setProperty(`--scb-header-logo-img-h`,t):e?this.style.setProperty(`--scb-header-logo-img-h`,`auto`):this.style.removeProperty(`--scb-header-logo-img-h`),n?this.style.setProperty(`--scb-header-logo-img-aspect-ratio`,n):this.style.removeProperty(`--scb-header-logo-img-aspect-ratio`)}_closeDrawerNow(){let e=this.renderRoot.querySelector(`#${this._drawerId}`);e&&(e.open=!1)}_openDrawerNow(){let e=this.renderRoot.querySelector(`#${this._drawerId}`);e&&(e.open=!0)}async _ensureDrawerReady(){this._drawerReady||=(this._drawerImportPromise??=Promise.all([Promise.resolve().then(()=>(Fl(),Ml)),Promise.resolve().then(()=>(gu(),hu))]).then(()=>void 0),await this._drawerImportPromise,!0)}_syncMenuBtnAria(){this.renderRoot.querySelectorAll(`.menu-trigger`).forEach(e=>{e.setAttribute(`aria-expanded`,String(this._menuExpanded))})}_getNavItems(){return this._slotNavItems.length?this._slotNavItems:(this.tabs??[]).map(e=>({kind:`tab`,...e}))}_getDropdownForSlot(e){let t=this.querySelector(`[slot="${e}"]`);return t?t.tagName.toLowerCase()===`scb-dropdown`?t:t.querySelector(`scb-dropdown`):null}_syncDropdownTabs(){this._getNavItems().forEach((e,t)=>{if(e.kind!==`dropdown`)return;let n=this._getDropdownForSlot(e.slotName);if(!n)return;let r=String(t);n.getAttribute(`data-index`)!==r&&n.setAttribute(`data-index`,r),n.hasAttribute(`as-tab`)||n.setAttribute(`as-tab`,``);let i=this.size,a=n;a?.size!==i&&(a.size=i),t===this.activeTab?n.getAttribute(`aria-current`)!==`page`&&n.setAttribute(`aria-current`,`page`):n.hasAttribute(`aria-current`)&&n.removeAttribute(`aria-current`)})}_readTabIndexFromEvent(e){let t=e.composedPath?e.composedPath():[];for(let e of t){if(!(e instanceof HTMLElement))continue;let t=e.getAttribute(`data-index`);if(t==null)continue;let n=Number(t);if(Number.isFinite(n))return n}return null}_focusTabAtIndex(e){let t=this._getNavItems()[e];if(t){if(t.kind===`dropdown`){this._getDropdownForSlot(t.slotName)?.focus?.();return}this.renderRoot.querySelector(`.tab-link[data-index="${e}"]`)?.focus?.()}}_renderMenuNodes(e){return!e||e.length===0?b``:b`${e.map(e=>this._renderMenuNode(e))}`}_renderMenuNode(e){let t=Array.isArray(e.children)&&e.children.length>0,n=(e.href??``).trim(),r=(e.icon??``).trim();return b`
|
|
9364
9387
|
<scb-menu-item
|
|
9365
9388
|
label=${e.label}
|
|
9366
9389
|
?selected=${!1}
|
|
@@ -9373,11 +9396,23 @@
|
|
|
9373
9396
|
</scb-sub-menu>
|
|
9374
9397
|
`:x}
|
|
9375
9398
|
</scb-menu-item>
|
|
9376
|
-
`}_syncFlags(e,t){this.toggleAttribute(`data-no-utility`,e),this.toggleAttribute(`data-no-search`,t)}_renderMenuButton(e
|
|
9399
|
+
`}_syncFlags(e,t){this.toggleAttribute(`data-no-utility`,e),this.toggleAttribute(`data-no-search`,t)}_renderMenuButton(e=``,t=!1){let n=e?`menu-trigger ${e}`:`menu-trigger`,r=(this.menuButtonLabel??``).trim()||`Meny`;return t?b`
|
|
9400
|
+
<scb-icon-button
|
|
9401
|
+
class=${n}
|
|
9402
|
+
icon="menu"
|
|
9403
|
+
.size=${this.size}
|
|
9404
|
+
aria-label=${r}
|
|
9405
|
+
aria-controls=${this._drawerId}
|
|
9406
|
+
aria-haspopup="dialog"
|
|
9407
|
+
aria-expanded=${String(this._menuExpanded)}
|
|
9408
|
+
title="Öppna meny"
|
|
9409
|
+
@click=${this._onMenuClick}
|
|
9410
|
+
></scb-icon-button>
|
|
9411
|
+
`:b`
|
|
9377
9412
|
<scb-button
|
|
9378
|
-
class=${
|
|
9413
|
+
class=${n}
|
|
9379
9414
|
variant="text"
|
|
9380
|
-
label=${
|
|
9415
|
+
label=${r}
|
|
9381
9416
|
icon="menu"
|
|
9382
9417
|
trailing-icon
|
|
9383
9418
|
.size=${this.size}
|
|
@@ -9387,7 +9422,7 @@
|
|
|
9387
9422
|
title="Öppna meny"
|
|
9388
9423
|
@click=${this._onMenuClick}
|
|
9389
9424
|
></scb-button>
|
|
9390
|
-
`}render(){let e=this._getNavItems(),t=this._slotUtils.length?this._slotUtils:this.utilityItems,n=this._slotMenu.length?this._slotMenu:this.menuData??[],r=this.logoText||this.logotypeText,i=this.logoAlt||r||`Gå till startsidan`,a=this.querySelector(`[slot="drawer-menu"]`)!==null;this._syncFlags(t.length===0,!this.showSearch);let o=this.searchHeight&&this.searchHeight.trim()?`--scb-search-height:${this.searchHeight.trim()}`:x,s=e.length>0||this.reserveTabs||this.layoutPending,c=(this.reserveTabs||this.layoutPending)&&(this.layoutPending||e.length===0),l=this.showDrawer&&(!this.deferDrawer||this._drawerReady),u=typeof window<`u`&&window.innerWidth>=this.BP_MD,d=this.showDrawer&&(u?this.alwaysShowMenuButton||this._collapsed:!0),f=d&&!u,p=d&&u,m=(this.searchButtonLabel??``).trim()||`Sök
|
|
9425
|
+
`}render(){let e=this._getNavItems(),t=this._slotUtils.length?this._slotUtils:this.utilityItems,n=this._slotMenu.length?this._slotMenu:this.menuData??[],r=this.logoText||this.logotypeText,i=this.logoAlt||r||`Gå till startsidan`,a=this.querySelector(`[slot="drawer-menu"]`)!==null;this._syncFlags(t.length===0,!this.showSearch);let o=this.searchHeight&&this.searchHeight.trim()?`--scb-search-height:${this.searchHeight.trim()}`:x,s=e.length>0||this.reserveTabs||this.layoutPending,c=(this.reserveTabs||this.layoutPending)&&(this.layoutPending||e.length===0),l=this.showDrawer&&(!this.deferDrawer||this._drawerReady),u=typeof window<`u`&&window.innerWidth>=this.BP_MD,d=this.showDrawer&&(u?this.alwaysShowMenuButton||this._collapsed:!0),f=d&&!u,p=d&&u,m=(this.searchButtonLabel??``).trim()||`Sök`,h=this.showSearch&&!this._mobileSearchOpen;return b`
|
|
9391
9426
|
<slot
|
|
9392
9427
|
id="data-slot"
|
|
9393
9428
|
@slotchange=${()=>{this._harvest(),this._attachSlotObservers()}}
|
|
@@ -9427,11 +9462,12 @@
|
|
|
9427
9462
|
<div class="actions">
|
|
9428
9463
|
<nav class="utility" aria-label="Funktionslänkar">
|
|
9429
9464
|
${t.map(e=>b`
|
|
9430
|
-
<scb-
|
|
9465
|
+
<scb-button
|
|
9466
|
+
variant="text"
|
|
9431
9467
|
.href=${e.href}
|
|
9432
|
-
.target=${e.target
|
|
9433
|
-
|
|
9434
|
-
>
|
|
9468
|
+
.target=${e.target??``}
|
|
9469
|
+
label=${e.label}
|
|
9470
|
+
></scb-button>
|
|
9435
9471
|
`)}
|
|
9436
9472
|
</nav>
|
|
9437
9473
|
|
|
@@ -9455,9 +9491,38 @@
|
|
|
9455
9491
|
></scb-button>
|
|
9456
9492
|
</div>
|
|
9457
9493
|
`:x}
|
|
9458
|
-
${
|
|
9494
|
+
${h?b`
|
|
9495
|
+
<scb-icon-button
|
|
9496
|
+
class="mobile-search-trigger"
|
|
9497
|
+
variant="filled-tonal"
|
|
9498
|
+
icon="search"
|
|
9499
|
+
.size=${this.size}
|
|
9500
|
+
@click=${this._onMobileSearchToggle}
|
|
9501
|
+
></scb-icon-button>
|
|
9502
|
+
`:x}
|
|
9503
|
+
${f?this._renderMenuButton(``,!0):x}
|
|
9459
9504
|
</div>
|
|
9460
9505
|
|
|
9506
|
+
${this.showSearch&&this._mobileSearchOpen?b`
|
|
9507
|
+
<div class="mobile-search-panel" style=${o}>
|
|
9508
|
+
<scb-search
|
|
9509
|
+
.size=${this.size}
|
|
9510
|
+
style=${o}
|
|
9511
|
+
.value=${this.searchText}
|
|
9512
|
+
.supportingText=${this.searchPlaceholder??``}
|
|
9513
|
+
@scb-search-input=${this._onSearchInput}
|
|
9514
|
+
@scb-search-submit=${this._onSearchSubmit}
|
|
9515
|
+
@scb-search-clear=${this._onSearchClear}
|
|
9516
|
+
></scb-search>
|
|
9517
|
+
<scb-icon-button
|
|
9518
|
+
variant="filled-tonal"
|
|
9519
|
+
icon="close"
|
|
9520
|
+
.size=${this.size}
|
|
9521
|
+
@click=${this._onMobileSearchToggle}
|
|
9522
|
+
></scb-icon-button>
|
|
9523
|
+
</div>
|
|
9524
|
+
`:x}
|
|
9525
|
+
|
|
9461
9526
|
</div>
|
|
9462
9527
|
</scb-grid-item>
|
|
9463
9528
|
|
|
@@ -9603,7 +9668,7 @@
|
|
|
9603
9668
|
</clipPath>
|
|
9604
9669
|
</defs>
|
|
9605
9670
|
</svg>
|
|
9606
|
-
`}};P([g({type:String,attribute:`max-width`})],Y.prototype,`maxWidth`,void 0),P([g({type:String,reflect:!0})],Y.prototype,`spacing`,void 0),P([g({type:String,attribute:`spacing-top`,reflect:!0})],Y.prototype,`spacingTop`,void 0),P([g({type:String,attribute:`spacing-bottom`,reflect:!0})],Y.prototype,`spacingBottom`,void 0),P([g({type:String,reflect:!0,converter:xu})],Y.prototype,`size`,void 0),P([g({type:String,attribute:`logo-text`})],Y.prototype,`logoText`,void 0),P([g({type:String,attribute:`logotype-text`})],Y.prototype,`logotypeText`,void 0),P([g({type:String,attribute:`logo-alt`})],Y.prototype,`logoAlt`,void 0),P([g({type:String,attribute:`logo-href`})],Y.prototype,`logoHref`,void 0),P([g({type:String,attribute:`logo-src`})],Y.prototype,`logoSrc`,void 0),P([g({type:String,attribute:`logo-width`})],Y.prototype,`logoWidth`,void 0),P([g({type:String,attribute:`logo-height`})],Y.prototype,`logoHeight`,void 0),P([g({type:String,attribute:`logo-aspect-ratio`})],Y.prototype,`logoAspectRatio`,void 0),P([g({type:Boolean,attribute:`logo-invert-dm`,reflect:!0,converter:bu})],Y.prototype,`logoInvertDm`,void 0),P([g({type:Boolean,reflect:!0})],Y.prototype,`banner`,void 0),P([g({type:String,attribute:`banner-label`})],Y.prototype,`bannerLabel`,void 0),P([g({type:Array,attribute:`tabs`,converter:Y._JSON_ARRAY})],Y.prototype,`tabs`,void 0),P([g({type:Number,attribute:`active-tab`})],Y.prototype,`activeTab`,void 0),P([g({type:Boolean,attribute:`reserve-tabs`,reflect:!0,converter:bu})],Y.prototype,`reserveTabs`,void 0),P([g({type:Number,attribute:`reserve-tabs-count`})],Y.prototype,`reserveTabsCount`,void 0),P([g({type:String,attribute:`reserve-tabs-widths`})],Y.prototype,`reserveTabsWidths`,void 0),P([g({type:Boolean,attribute:`layout-pending`,reflect:!0,converter:bu})],Y.prototype,`layoutPending`,void 0),P([g({type:Array,attribute:`utility-items`,converter:Y._JSON_ARRAY})],Y.prototype,`utilityItems`,void 0),P([g({type:String,attribute:`search-placeholder`})],Y.prototype,`searchPlaceholder`,void 0),P([g({type:String,attribute:`search-button-label`})],Y.prototype,`searchButtonLabel`,void 0),P([g({type:String,attribute:`menu-label`})],Y.prototype,`menuLabel`,void 0),P([g({type:String,attribute:`menu-button-label`})],Y.prototype,`menuButtonLabel`,void 0),P([g({type:String,attribute:`menu-sub-label`})],Y.prototype,`menuSubLabel`,void 0),P([g({type:String,attribute:`menu-section-label`})],Y.prototype,`menuSectionLabel`,void 0),P([g({type:String,attribute:`menu-search-placeholder`})],Y.prototype,`menuSearchPlaceholder`,void 0),P([g({type:Array,attribute:`menu-data`,converter:Y._JSON_ARRAY})],Y.prototype,`menuData`,void 0),P([g({type:Boolean,attribute:`defer-drawer`,reflect:!0,converter:bu})],Y.prototype,`deferDrawer`,void 0),P([g({type:Boolean,attribute:`show-drawer`,reflect:!0,converter:yu})],Y.prototype,`showDrawer`,void 0),P([g({type:Boolean,attribute:`always-show-menu-button`,reflect:!0,converter:bu})],Y.prototype,`alwaysShowMenuButton`,void 0),P([g({type:Boolean,attribute:`show-search`,reflect:!0,converter:yu})],Y.prototype,`showSearch`,void 0),P([g({type:Boolean,attribute:`include-utility-in-menu`,reflect:!0,converter:bu})],Y.prototype,`includeUtilityInMenu`,void 0),P([g({type:Boolean,attribute:`drawer-overlay`,reflect:!0,converter:yu})],Y.prototype,`drawerOverlay`,void 0),P([g({type:String,attribute:`search-max`})],Y.prototype,`searchMax`,void 0),P([g({type:String,attribute:`search-min`})],Y.prototype,`searchMin`,void 0),P([g({type:String,attribute:`search-height`})],Y.prototype,`searchHeight`,void 0),P([g({type:String,attribute:`search-text`,reflect:!0})],Y.prototype,`searchText`,void 0),P([_()],Y.prototype,`_drawerId`,void 0),P([_()],Y.prototype,`_menuExpanded`,void 0),P([_()],Y.prototype,`_searchId`,void 0),P([_()],Y.prototype,`_drawerReady`,void 0),P([_()],Y.prototype,`_slotNavItems`,void 0),P([_()],Y.prototype,`_slotUtils`,void 0),P([_()],Y.prototype,`_slotMenu`,void 0),P([_()],Y.prototype,`_collapsed`,void 0),P([_()],Y.prototype,`_hideLogoText`,void 0),Y=_u=P([a(`scb-header`)],Y),C(),y(),w(),F();var Su,Cu={fromAttribute:e=>e??``,toAttribute:e=>typeof e==`string`?e.trim()===``?null:e:null},X=class extends S{static{Su=this}constructor(...e){super(...e),this.keyfigure=0,this.subtitle=``,this.supportingText=``,this.cardHref=``,this.href=``,this.icon=``,this.size=`large`,this.unit=``,this.width=``,this.maxWidth=``,this.height=``,this.maxHeight=``,this.sizing=``,this.spacing=void 0,this.spacingTop=void 0,this.spacingBottom=void 0,this.spacingLeft=void 0,this.spacingRight=void 0,this.__onKeyDown=e=>{let t=this.__effectiveHref;(e.key===`Enter`||e.key===` `)&&t&&(e.preventDefault(),this.__navigate(t,e))},this.__handleHrefNavigation=e=>{let t=this.__effectiveHref;t&&(e.target.closest(`a`)||this.__navigate(t,e))}}static{this.__iconLoaded=!1}static{this.__rippleLoaded=!1}static{this.styles=p`
|
|
9671
|
+
`}};P([g({type:String,attribute:`max-width`})],Y.prototype,`maxWidth`,void 0),P([g({type:String,reflect:!0})],Y.prototype,`spacing`,void 0),P([g({type:String,attribute:`spacing-top`,reflect:!0})],Y.prototype,`spacingTop`,void 0),P([g({type:String,attribute:`spacing-bottom`,reflect:!0})],Y.prototype,`spacingBottom`,void 0),P([g({type:String,reflect:!0,converter:xu})],Y.prototype,`size`,void 0),P([g({type:String,attribute:`logo-text`})],Y.prototype,`logoText`,void 0),P([g({type:String,attribute:`logotype-text`})],Y.prototype,`logotypeText`,void 0),P([g({type:String,attribute:`logo-alt`})],Y.prototype,`logoAlt`,void 0),P([g({type:String,attribute:`logo-href`})],Y.prototype,`logoHref`,void 0),P([g({type:String,attribute:`logo-src`})],Y.prototype,`logoSrc`,void 0),P([g({type:String,attribute:`logo-width`})],Y.prototype,`logoWidth`,void 0),P([g({type:String,attribute:`logo-height`})],Y.prototype,`logoHeight`,void 0),P([g({type:String,attribute:`logo-aspect-ratio`})],Y.prototype,`logoAspectRatio`,void 0),P([g({type:Boolean,attribute:`logo-invert-dm`,reflect:!0,converter:bu})],Y.prototype,`logoInvertDm`,void 0),P([g({type:Boolean,reflect:!0})],Y.prototype,`banner`,void 0),P([g({type:String,attribute:`banner-label`})],Y.prototype,`bannerLabel`,void 0),P([g({type:Array,attribute:`tabs`,converter:Y._JSON_ARRAY})],Y.prototype,`tabs`,void 0),P([g({type:Number,attribute:`active-tab`})],Y.prototype,`activeTab`,void 0),P([g({type:Boolean,attribute:`reserve-tabs`,reflect:!0,converter:bu})],Y.prototype,`reserveTabs`,void 0),P([g({type:Number,attribute:`reserve-tabs-count`})],Y.prototype,`reserveTabsCount`,void 0),P([g({type:String,attribute:`reserve-tabs-widths`})],Y.prototype,`reserveTabsWidths`,void 0),P([g({type:Boolean,attribute:`layout-pending`,reflect:!0,converter:bu})],Y.prototype,`layoutPending`,void 0),P([g({type:Array,attribute:`utility-items`,converter:Y._JSON_ARRAY})],Y.prototype,`utilityItems`,void 0),P([g({type:String,attribute:`search-placeholder`})],Y.prototype,`searchPlaceholder`,void 0),P([g({type:String,attribute:`search-button-label`})],Y.prototype,`searchButtonLabel`,void 0),P([g({type:String,attribute:`menu-label`})],Y.prototype,`menuLabel`,void 0),P([g({type:String,attribute:`menu-button-label`})],Y.prototype,`menuButtonLabel`,void 0),P([g({type:String,attribute:`menu-sub-label`})],Y.prototype,`menuSubLabel`,void 0),P([g({type:String,attribute:`menu-section-label`})],Y.prototype,`menuSectionLabel`,void 0),P([g({type:String,attribute:`menu-search-placeholder`})],Y.prototype,`menuSearchPlaceholder`,void 0),P([g({type:Array,attribute:`menu-data`,converter:Y._JSON_ARRAY})],Y.prototype,`menuData`,void 0),P([g({type:Boolean,attribute:`defer-drawer`,reflect:!0,converter:bu})],Y.prototype,`deferDrawer`,void 0),P([g({type:Boolean,attribute:`show-drawer`,reflect:!0,converter:yu})],Y.prototype,`showDrawer`,void 0),P([g({type:Boolean,attribute:`always-show-menu-button`,reflect:!0,converter:bu})],Y.prototype,`alwaysShowMenuButton`,void 0),P([g({type:Boolean,attribute:`show-search`,reflect:!0,converter:yu})],Y.prototype,`showSearch`,void 0),P([g({type:Boolean,attribute:`include-utility-in-menu`,reflect:!0,converter:bu})],Y.prototype,`includeUtilityInMenu`,void 0),P([g({type:Boolean,attribute:`drawer-overlay`,reflect:!0,converter:yu})],Y.prototype,`drawerOverlay`,void 0),P([g({type:String,attribute:`search-max`})],Y.prototype,`searchMax`,void 0),P([g({type:String,attribute:`search-min`})],Y.prototype,`searchMin`,void 0),P([g({type:String,attribute:`search-height`})],Y.prototype,`searchHeight`,void 0),P([g({type:String,attribute:`search-text`,reflect:!0})],Y.prototype,`searchText`,void 0),P([_()],Y.prototype,`_drawerId`,void 0),P([_()],Y.prototype,`_menuExpanded`,void 0),P([_()],Y.prototype,`_searchId`,void 0),P([_()],Y.prototype,`_drawerReady`,void 0),P([_()],Y.prototype,`_mobileSearchOpen`,void 0),P([_()],Y.prototype,`_slotNavItems`,void 0),P([_()],Y.prototype,`_slotUtils`,void 0),P([_()],Y.prototype,`_slotMenu`,void 0),P([_()],Y.prototype,`_collapsed`,void 0),P([_()],Y.prototype,`_hideLogoText`,void 0),Y=_u=P([a(`scb-header`)],Y),C(),y(),w(),F();var Su,Cu={fromAttribute:e=>e??``,toAttribute:e=>typeof e==`string`?e.trim()===``?null:e:null},X=class extends S{static{Su=this}constructor(...e){super(...e),this.keyfigure=0,this.subtitle=``,this.supportingText=``,this.cardHref=``,this.href=``,this.icon=``,this.size=`large`,this.unit=``,this.width=``,this.maxWidth=``,this.height=``,this.maxHeight=``,this.sizing=``,this.spacing=void 0,this.spacingTop=void 0,this.spacingBottom=void 0,this.spacingLeft=void 0,this.spacingRight=void 0,this.__onKeyDown=e=>{let t=this.__effectiveHref;(e.key===`Enter`||e.key===` `)&&t&&(e.preventDefault(),this.__navigate(t,e))},this.__handleHrefNavigation=e=>{let t=this.__effectiveHref;t&&(e.target.closest(`a`)||this.__navigate(t,e))}}static{this.__iconLoaded=!1}static{this.__rippleLoaded=!1}static{this.styles=p`
|
|
9607
9672
|
:host {
|
|
9608
9673
|
display: block;
|
|
9609
9674
|
box-sizing: border-box;
|