scb-wc-test 0.1.158 → 0.1.159
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,4 +1,4 @@
|
|
|
1
|
-
import{a as w,n as h,r as m,i as x,x as c,E as u,t as S}from"../../vendor/vendor.js";import"../../vendor/vendor-material.js";import"../scb-grid/scb-grid-item.js";import"../scb-grid/scb-grid.js";import"../scb-link/scb-link.js";import"../scb-icon-button/scb-icon-button.js";import"../scb-button/scb-button.js";import"../scb-search/scb-search.js";import"../scb-drawer/scb-drawer.js";import"../scb-dropdown/scb-dropdown.js";import"../scb-grid/scb-stack.js";import"../../vendor/preload-helper.js";import"../scb-tooltip/scb-tooltip.js";import"../scb-list/scb-list.js";import"../scb-list/scb-list-item.js";import"../scb-divider/scb-divider.js";import"../scb-options-menu/scb-options-menu.js";import"../scb-options-menu/scb-options-menu-item.js";import"../scb-options-menu/scb-options-sub-menu.js";(function(){try{var e=typeof globalThis<"u"?globalThis:window;if(!e.__scb_ce_guard_installed__){e.__scb_ce_guard_installed__=!0;var t=customElements.define.bind(customElements);customElements.define=function(r,i,o){try{customElements.get(r)||t(r,i,o)}catch(a){var l=String(a||"");if(l.indexOf("already been used")===-1&&l.indexOf("NotSupportedError")===-1)throw a}}}}catch{}})();var A=Object.defineProperty,C=Object.getOwnPropertyDescriptor,n=(e,t,r,i)=>{for(var o=i>1?void 0:i?C(t,r):t,l=e.length-1,a;l>=0;l--)(a=e[l])&&(o=(i?a(t,r,o):a(o))||o);return i&&o&&A(t,r,o),o};const v={fromAttribute:e=>e==null?!0:!/^(false|0|off|no)$/i.test(e),toAttribute:e=>String(!!e)},k={fromAttribute:e=>e==="small"||e==="large"?e:"medium",toAttribute:e=>{const t=String(e??"");return t==="small"||t==="large"?t:null}};let s=class extends x{constructor(){super(...arguments),this.maxWidth="1440px",this.size="medium",this.logoText="",this.logoHref="/",this.logoSrc="",this.logoHeight="",this.logoInvertDm=!1,this.banner=!1,this.tabs=[],this.activeTab=0,this.utilityItems=[],this.showDrawer=!0,this.showSearch=!0,this.includeUtilityInDrawer=!1,this.drawerOverlay=!0,this.searchText="",this._drawerId="main-drawer",this._drawerExpanded=!1,this._searchId="header-search",this._slotNavItems=[],this._slotUtils=[],this._slotMenu=[],this._measureScheduled=!1,this._scheduleMeasure=()=>{this._measureScheduled||(this._measureScheduled=!0,requestAnimationFrame(()=>{this._measureScheduled=!1,this._measure()}))},this._onWindowResize=()=>{this._scheduleMeasure()},this._onDrawerSelect=e=>{this.dispatchEvent(new CustomEvent("drawer-select",{detail:e.detail,bubbles:!0,composed:!0})),this._closeDrawerNow()},this._collapsed=!1,this._unlockAtWidth=0,this._hideLogoText=!1,this._logoTextUnlockAt=0,this._harvestPending=!1,this._harvest=()=>{const e=Array.from(this.children),t=[],r=[],i=[];let o=-1;const l=a=>({label:a.getAttribute("label")??"",href:a.getAttribute("href")??void 0,icon:a.getAttribute("icon")??void 0});for(const a of e){const b=a.tagName.toLowerCase();if(b==="scb-header-tab"){const d=a.getAttribute("label")??"",g=a.getAttribute("href"),p=g&&g.trim()!==""?g:void 0;(a.hasAttribute("selected")||a.getAttribute("selected")==="true"||a.getAttribute("active")==="true"||a.getAttribute("aria-current")==="page")&&o===-1&&(o=t.length),t.push({kind:"tab",label:d,href:p});continue}if(b==="scb-dropdown"){const d=a.getAttribute("label")??"";(a.hasAttribute("selected")||a.getAttribute("selected")==="true"||a.getAttribute("active")==="true"||a.getAttribute("aria-current")==="page")&&o===-1&&(o=t.length);const p=`scb-header-tab-${t.length}`;a.getAttribute("slot")!==p&&a.setAttribute("slot",p),a.hasAttribute("as-tab")||a.setAttribute("as-tab",""),t.push({kind:"dropdown",slotName:p,label:d});continue}if(b==="scb-header-utility"){r.push({label:a.getAttribute("label")??"",href:a.getAttribute("href")??"#",target:a.getAttribute("target")??void 0});continue}if(b==="scb-header-drawer-group"){const d={label:a.getAttribute("label")??"",icon:a.getAttribute("icon")??void 0,children:[]};a.querySelectorAll("scb-header-drawer-item").forEach(p=>d.children.push(l(p))),i.push(d);continue}b==="scb-header-drawer-item"&&i.push(l(a))}this._slotNavItems=t,this._slotUtils=r,this._slotMenu=i,!this.hasAttribute("active-tab")&&o>=0&&(this.activeTab=o),queueMicrotask(()=>{this.updateComplete.then(()=>{this._scheduleMeasure()})})},this._measure=()=>{const e=this._top,t=this._logoGroup;if(!e||!t)return;const r=window.innerWidth,i=e.clientWidth,o=this._overflows(this._util),l=this._overflows(this._tabsNav),a=r<this.BP_MD||o||l;this._collapsed?!a&&i>=this._unlockAtWidth&&this._setCollapsed(!1):a&&(this._unlockAtWidth=i+this._HYST,this._setCollapsed(!0));let b=!1;if(this.showSearch&&r>=this.BP_SM&&r<this.BP_MD&&this._searchWrap){const p=getComputedStyle(this._searchWrap),y=Math.max(this._num(p.minWidth,this._tokenPx("--scb-header-search-min",320)),this._tokenPx("--scb-header-search-min",320)),f=this._num(getComputedStyle(e).gap,this._tokenPx("--spacing-7",24)),_=this.showDrawer&&(r<this.BP_MD||this._collapsed)?this._menuBtn?.getBoundingClientRect().width||this._tokenPx("--icon-size-large",48):0;b=t.getBoundingClientRect().width+f+y+f+_+8>i+.5}this._setHideSearch(b);let d=!1;if(this.showDrawer&&(r<this.BP_MD||this._collapsed)&&!this._visible(this._util)&&!this._visible(this._searchWrap)){const p=this._num(getComputedStyle(e).gap,this._tokenPx("--spacing-7",24)),y=this._menuBtn?.getBoundingClientRect().width||this._tokenPx("--icon-size-large",48),f=(this._logoGroup?.getBoundingClientRect().width||0)+p+y;this._hideLogoText?d=!(i>=this._logoTextUnlockAt):f>i+.5&&(d=!0,this._logoTextUnlockAt=i+this._HYST)}else d=!1,this._logoTextUnlockAt=0;this._setHideLogoText(d)},this._onMenuClick=async e=>{e.preventDefault(),e.stopPropagation(),this.showDrawer&&(this.dispatchEvent(new CustomEvent("menu-click",{bubbles:!0,composed:!0})),await s._nextFrame(),await s._nextFrame(),this._openDrawerNow())},this._onSearchClick=e=>{const t=this._searchEl;if(t?.submit&&typeof t.submit=="function"){t.submit();return}const r=t?.value??"";this.searchText=r,this.dispatchEvent(new CustomEvent("search-click",{detail:{value:r},bubbles:!0,composed:!0})),t?.focus?.()},this._onTabClick=e=>{const t=e.currentTarget;if(!t)return;const r=t.tagName.toLowerCase()==="a";if(r&&(e.defaultPrevented||e.button!==0||e.metaKey||e.ctrlKey||e.shiftKey||e.altKey))return;const i=t.getAttribute("data-index"),o=i!=null?Number(i):0,a=this._getNavItems()[o];if(a?.kind==="dropdown")return;this.activeTab=o;const b=a?.kind==="tab"?a.href??"":"",d=new CustomEvent("tab-change",{detail:{index:o,href:b},bubbles:!0,composed:!0,cancelable:!0});!this.dispatchEvent(d)&&r&&e.preventDefault()},this._onDropdownTabActivate=e=>{const t=e.detail?.dataIndex,r=typeof t=="number"?t:typeof t=="string"?Number(t):this._readTabIndexFromEvent(e);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._onTabsKeydown=e=>{const t=e.key;if(t!=="ArrowLeft"&&t!=="ArrowRight"&&t!=="Home"&&t!=="End")return;const r=this._getNavItems();if(!r.length)return;const i=this._readTabIndexFromEvent(e);if(i==null)return;let o=Math.max(0,Math.min(r.length-1,i));t==="ArrowRight"?o=(o+1)%r.length:t==="ArrowLeft"?o=(o-1+r.length)%r.length:t==="Home"?o=0:t==="End"&&(o=r.length-1),e.preventDefault(),this._focusTabAtIndex(o)},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("search-text-change",{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._onSearchClear=()=>{this.searchText="",this.dispatchEvent(new CustomEvent("search-text-change",{detail:{value:""},bubbles:!0,composed:!0}))}}get _HYST(){return this._tokenPx("--spacing-11",64)}get BP_SM(){return this._tokenPx("--bp-sm",s.BP_SM_DEFAULT)}get BP_MD(){return this._tokenPx("--bp-md",s.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();const e=new MutationObserver(t=>{this._scheduleHarvest()});this._slotMo=e,e.observe(this,{subtree:!0,childList:!0,attributes:!0,attributeFilter:["label","href","icon","target","selected","aria-current","active"]})}_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 r=Number.parseFloat(String(e??"").trim());return Number.isFinite(r)?r:t}_tokenPx(e,t){const r=getComputedStyle(this);return this._num(r.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}firstUpdated(){this.updateComplete.then(()=>{this._harvest(),this._attachSlotObservers()});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??"480px"),e.has("searchMin")&&this.style.setProperty("--scb-header-search-min",this.searchMin??"320px"),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("logoHeight")&&(this.logoHeight&&this.logoHeight.trim()?this.style.setProperty("--scb-header-logo-img-h",this.logoHeight.trim()):this.style.removeProperty("--scb-header-logo-img-h")),(e.has("utilityItems")||e.has("tabs")||e.has("logoText")||e.has("logoSrc")||e.has("logoHeight")||e.has("activeTab")||e.has("_slotNavItems")||e.has("_slotUtils")||e.has("_slotMenu")||e.has("showDrawer")||e.has("showSearch")||e.has("searchMax")||e.has("searchMin")||e.has("size"))&&this.updateComplete.then(()=>{this._scheduleMeasure()}),(e.has("activeTab")||e.has("_slotNavItems")||e.has("tabs"))&&this.updateComplete.then(()=>{this._syncDropdownTabs()})}disconnectedCallback(){this._ro?.disconnect(),this._slotMo?.disconnect(),window.removeEventListener("resize",this._onWindowResize),super.disconnectedCallback()}_openDrawerNow(){const e=this.renderRoot.querySelector(`#${this._drawerId}`);e&&(e.open=!0,e.setAttribute("open",""),e.show?.(),e.openDrawer?.(),this._drawerExpanded=!0,this._syncMenuBtnAria(),this.dispatchEvent(new CustomEvent("drawer-open",{bubbles:!0,composed:!0})))}_closeDrawerNow(){const e=this.renderRoot.querySelector(`#${this._drawerId}`);e&&(e.open=!1),this._drawerExpanded=!1,this._syncMenuBtnAria(),this.dispatchEvent(new CustomEvent("drawer-close",{bubbles:!0,composed:!0}))}_syncMenuBtnAria(){const e=this.renderRoot.querySelector(".menu-trigger");e&&e.setAttribute("aria-expanded",String(this._drawerExpanded))}_getNavItems(){return this._slotNavItems.length?this._slotNavItems:(this.tabs??[]).map(e=>({kind:"tab",...e}))}_syncDropdownTabs(){this._getNavItems().forEach((t,r)=>{if(t.kind!=="dropdown")return;const i=this.querySelector(`scb-dropdown[slot="${t.slotName}"]`);if(!i)return;const o=String(r);i.getAttribute("data-index")!==o&&i.setAttribute("data-index",o),i.hasAttribute("as-tab")||i.setAttribute("as-tab",""),r===this.activeTab?i.getAttribute("aria-current")!=="page"&&i.setAttribute("aria-current","page"):i.hasAttribute("aria-current")&&i.removeAttribute("aria-current")})}_readTabIndexFromEvent(e){const t=e.composedPath?e.composedPath():[];for(const r of t){if(!(r instanceof HTMLElement))continue;const i=r.getAttribute("data-index");if(i==null)continue;const o=Number(i);if(Number.isFinite(o))return o}return null}_focusTabAtIndex(e){const r=this._getNavItems()[e];if(!r)return;if(r.kind==="dropdown"){this.querySelector(`scb-dropdown[slot="${r.slotName}"]`)?.focus?.();return}this.renderRoot.querySelector(`.tab-link[data-index="${e}"]`)?.focus?.()}_renderDrawerNodes(e){return!e||e.length===0?c``:c`${e.map(t=>{const r=Array.isArray(t.children)&&t.children.length>0;return c`
|
|
1
|
+
import{a as w,n as h,r as m,i as x,x as c,E as u,t as S}from"../../vendor/vendor.js";import"../../vendor/vendor-material.js";import"../scb-grid/scb-grid-item.js";import"../scb-grid/scb-grid.js";import"../scb-link/scb-link.js";import"../scb-icon-button/scb-icon-button.js";import"../scb-button/scb-button.js";import"../scb-search/scb-search.js";import"../scb-drawer/scb-drawer.js";import"../scb-dropdown/scb-dropdown.js";import"../scb-grid/scb-stack.js";import"../../vendor/preload-helper.js";import"../scb-tooltip/scb-tooltip.js";import"../scb-list/scb-list.js";import"../scb-list/scb-list-item.js";import"../scb-divider/scb-divider.js";import"../scb-options-menu/scb-options-menu.js";import"../scb-options-menu/scb-options-menu-item.js";import"../scb-options-menu/scb-options-sub-menu.js";(function(){try{var e=typeof globalThis<"u"?globalThis:window;if(!e.__scb_ce_guard_installed__){e.__scb_ce_guard_installed__=!0;var t=customElements.define.bind(customElements);customElements.define=function(r,i,o){try{customElements.get(r)||t(r,i,o)}catch(a){var l=String(a||"");if(l.indexOf("already been used")===-1&&l.indexOf("NotSupportedError")===-1)throw a}}}}catch{}})();var A=Object.defineProperty,C=Object.getOwnPropertyDescriptor,n=(e,t,r,i)=>{for(var o=i>1?void 0:i?C(t,r):t,l=e.length-1,a;l>=0;l--)(a=e[l])&&(o=(i?a(t,r,o):a(o))||o);return i&&o&&A(t,r,o),o};const v={fromAttribute:e=>e==null?!0:!/^(false|0|off|no)$/i.test(e),toAttribute:e=>String(!!e)},k={fromAttribute:e=>e==="small"||e==="large"?e:"medium",toAttribute:e=>{const t=String(e??"");return t==="small"||t==="large"?t:null}};let s=class extends x{constructor(){super(...arguments),this.maxWidth="1440px",this.size="medium",this.logoText="",this.logoHref="/",this.logoSrc="",this.logoHeight="",this.logoInvertDm=!1,this.banner=!1,this.tabs=[],this.activeTab=null,this.utilityItems=[],this.showDrawer=!0,this.showSearch=!0,this.includeUtilityInDrawer=!1,this.drawerOverlay=!0,this.searchText="",this._drawerId="main-drawer",this._drawerExpanded=!1,this._searchId="header-search",this._slotNavItems=[],this._slotUtils=[],this._slotMenu=[],this._measureScheduled=!1,this._scheduleMeasure=()=>{this._measureScheduled||(this._measureScheduled=!0,requestAnimationFrame(()=>{this._measureScheduled=!1,this._measure()}))},this._onWindowResize=()=>{this._scheduleMeasure()},this._onDrawerSelect=e=>{this.dispatchEvent(new CustomEvent("drawer-select",{detail:e.detail,bubbles:!0,composed:!0})),this._closeDrawerNow()},this._collapsed=!1,this._unlockAtWidth=0,this._hideLogoText=!1,this._logoTextUnlockAt=0,this._harvestPending=!1,this._harvest=()=>{const e=Array.from(this.children),t=[],r=[],i=[];let o=-1;const l=a=>({label:a.getAttribute("label")??"",href:a.getAttribute("href")??void 0,icon:a.getAttribute("icon")??void 0});for(const a of e){const b=a.tagName.toLowerCase();if(b==="scb-header-tab"){const d=a.getAttribute("label")??"",g=a.getAttribute("href"),p=g&&g.trim()!==""?g:void 0;(a.hasAttribute("selected")||a.getAttribute("selected")==="true"||a.getAttribute("active")==="true"||a.getAttribute("aria-current")==="page")&&o===-1&&(o=t.length),t.push({kind:"tab",label:d,href:p});continue}if(b==="scb-dropdown"){const d=a.getAttribute("label")??"";(a.hasAttribute("selected")||a.getAttribute("selected")==="true"||a.getAttribute("active")==="true"||a.getAttribute("aria-current")==="page")&&o===-1&&(o=t.length);const p=`scb-header-tab-${t.length}`;a.getAttribute("slot")!==p&&a.setAttribute("slot",p),a.hasAttribute("as-tab")||a.setAttribute("as-tab",""),t.push({kind:"dropdown",slotName:p,label:d});continue}if(b==="scb-header-utility"){r.push({label:a.getAttribute("label")??"",href:a.getAttribute("href")??"#",target:a.getAttribute("target")??void 0});continue}if(b==="scb-header-drawer-group"){const d={label:a.getAttribute("label")??"",icon:a.getAttribute("icon")??void 0,children:[]};a.querySelectorAll("scb-header-drawer-item").forEach(p=>d.children.push(l(p))),i.push(d);continue}b==="scb-header-drawer-item"&&i.push(l(a))}this._slotNavItems=t,this._slotUtils=r,this._slotMenu=i,!this.hasAttribute("active-tab")&&o>=0&&(this.activeTab=o),queueMicrotask(()=>{this.updateComplete.then(()=>{this._scheduleMeasure()})})},this._measure=()=>{const e=this._top,t=this._logoGroup;if(!e||!t)return;const r=window.innerWidth,i=e.clientWidth,o=this._overflows(this._util),l=this._overflows(this._tabsNav),a=r<this.BP_MD||o||l;this._collapsed?!a&&i>=this._unlockAtWidth&&this._setCollapsed(!1):a&&(this._unlockAtWidth=i+this._HYST,this._setCollapsed(!0));let b=!1;if(this.showSearch&&r>=this.BP_SM&&r<this.BP_MD&&this._searchWrap){const p=getComputedStyle(this._searchWrap),y=Math.max(this._num(p.minWidth,this._tokenPx("--scb-header-search-min",320)),this._tokenPx("--scb-header-search-min",320)),f=this._num(getComputedStyle(e).gap,this._tokenPx("--spacing-7",24)),_=this.showDrawer&&(r<this.BP_MD||this._collapsed)?this._menuBtn?.getBoundingClientRect().width||this._tokenPx("--icon-size-large",48):0;b=t.getBoundingClientRect().width+f+y+f+_+8>i+.5}this._setHideSearch(b);let d=!1;if(this.showDrawer&&(r<this.BP_MD||this._collapsed)&&!this._visible(this._util)&&!this._visible(this._searchWrap)){const p=this._num(getComputedStyle(e).gap,this._tokenPx("--spacing-7",24)),y=this._menuBtn?.getBoundingClientRect().width||this._tokenPx("--icon-size-large",48),f=(this._logoGroup?.getBoundingClientRect().width||0)+p+y;this._hideLogoText?d=!(i>=this._logoTextUnlockAt):f>i+.5&&(d=!0,this._logoTextUnlockAt=i+this._HYST)}else d=!1,this._logoTextUnlockAt=0;this._setHideLogoText(d)},this._onMenuClick=async e=>{e.preventDefault(),e.stopPropagation(),this.showDrawer&&(this.dispatchEvent(new CustomEvent("menu-click",{bubbles:!0,composed:!0})),await s._nextFrame(),await s._nextFrame(),this._openDrawerNow())},this._onSearchClick=e=>{const t=this._searchEl;if(t?.submit&&typeof t.submit=="function"){t.submit();return}const r=t?.value??"";this.searchText=r,this.dispatchEvent(new CustomEvent("search-click",{detail:{value:r},bubbles:!0,composed:!0})),t?.focus?.()},this._onTabClick=e=>{const t=e.currentTarget;if(!t)return;const r=t.tagName.toLowerCase()==="a";if(r&&(e.defaultPrevented||e.button!==0||e.metaKey||e.ctrlKey||e.shiftKey||e.altKey))return;const i=t.getAttribute("data-index"),o=i!=null?Number(i):0,a=this._getNavItems()[o];if(a?.kind==="dropdown")return;this.activeTab=o;const b=a?.kind==="tab"?a.href??"":"",d=new CustomEvent("tab-change",{detail:{index:o,href:b},bubbles:!0,composed:!0,cancelable:!0});!this.dispatchEvent(d)&&r&&e.preventDefault()},this._onDropdownTabActivate=e=>{const t=e.detail?.dataIndex,r=typeof t=="number"?t:typeof t=="string"?Number(t):this._readTabIndexFromEvent(e);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._onTabsKeydown=e=>{const t=e.key;if(t!=="ArrowLeft"&&t!=="ArrowRight"&&t!=="Home"&&t!=="End")return;const r=this._getNavItems();if(!r.length)return;const i=this._readTabIndexFromEvent(e);if(i==null)return;let o=Math.max(0,Math.min(r.length-1,i));t==="ArrowRight"?o=(o+1)%r.length:t==="ArrowLeft"?o=(o-1+r.length)%r.length:t==="Home"?o=0:t==="End"&&(o=r.length-1),e.preventDefault(),this._focusTabAtIndex(o)},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("search-text-change",{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._onSearchClear=()=>{this.searchText="",this.dispatchEvent(new CustomEvent("search-text-change",{detail:{value:""},bubbles:!0,composed:!0}))}}get _HYST(){return this._tokenPx("--spacing-11",64)}get BP_SM(){return this._tokenPx("--bp-sm",s.BP_SM_DEFAULT)}get BP_MD(){return this._tokenPx("--bp-md",s.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();const e=new MutationObserver(t=>{this._scheduleHarvest()});this._slotMo=e,e.observe(this,{subtree:!0,childList:!0,attributes:!0,attributeFilter:["label","href","icon","target","selected","aria-current","active"]})}_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 r=Number.parseFloat(String(e??"").trim());return Number.isFinite(r)?r:t}_tokenPx(e,t){const r=getComputedStyle(this);return this._num(r.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}firstUpdated(){this.updateComplete.then(()=>{this._harvest(),this._attachSlotObservers()});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??"480px"),e.has("searchMin")&&this.style.setProperty("--scb-header-search-min",this.searchMin??"320px"),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("logoHeight")&&(this.logoHeight&&this.logoHeight.trim()?this.style.setProperty("--scb-header-logo-img-h",this.logoHeight.trim()):this.style.removeProperty("--scb-header-logo-img-h")),(e.has("utilityItems")||e.has("tabs")||e.has("logoText")||e.has("logoSrc")||e.has("logoHeight")||e.has("activeTab")||e.has("_slotNavItems")||e.has("_slotUtils")||e.has("_slotMenu")||e.has("showDrawer")||e.has("showSearch")||e.has("searchMax")||e.has("searchMin")||e.has("size"))&&this.updateComplete.then(()=>{this._scheduleMeasure()}),(e.has("activeTab")||e.has("_slotNavItems")||e.has("tabs"))&&this.updateComplete.then(()=>{this._syncDropdownTabs()})}disconnectedCallback(){this._ro?.disconnect(),this._slotMo?.disconnect(),window.removeEventListener("resize",this._onWindowResize),super.disconnectedCallback()}_openDrawerNow(){const e=this.renderRoot.querySelector(`#${this._drawerId}`);e&&(e.open=!0,e.setAttribute("open",""),e.show?.(),e.openDrawer?.(),this._drawerExpanded=!0,this._syncMenuBtnAria(),this.dispatchEvent(new CustomEvent("drawer-open",{bubbles:!0,composed:!0})))}_closeDrawerNow(){const e=this.renderRoot.querySelector(`#${this._drawerId}`);e&&(e.open=!1),this._drawerExpanded=!1,this._syncMenuBtnAria(),this.dispatchEvent(new CustomEvent("drawer-close",{bubbles:!0,composed:!0}))}_syncMenuBtnAria(){const e=this.renderRoot.querySelector(".menu-trigger");e&&e.setAttribute("aria-expanded",String(this._drawerExpanded))}_getNavItems(){return this._slotNavItems.length?this._slotNavItems:(this.tabs??[]).map(e=>({kind:"tab",...e}))}_syncDropdownTabs(){this._getNavItems().forEach((t,r)=>{if(t.kind!=="dropdown")return;const i=this.querySelector(`scb-dropdown[slot="${t.slotName}"]`);if(!i)return;const o=String(r);i.getAttribute("data-index")!==o&&i.setAttribute("data-index",o),i.hasAttribute("as-tab")||i.setAttribute("as-tab",""),r===this.activeTab?i.getAttribute("aria-current")!=="page"&&i.setAttribute("aria-current","page"):i.hasAttribute("aria-current")&&i.removeAttribute("aria-current")})}_readTabIndexFromEvent(e){const t=e.composedPath?e.composedPath():[];for(const r of t){if(!(r instanceof HTMLElement))continue;const i=r.getAttribute("data-index");if(i==null)continue;const o=Number(i);if(Number.isFinite(o))return o}return null}_focusTabAtIndex(e){const r=this._getNavItems()[e];if(!r)return;if(r.kind==="dropdown"){this.querySelector(`scb-dropdown[slot="${r.slotName}"]`)?.focus?.();return}this.renderRoot.querySelector(`.tab-link[data-index="${e}"]`)?.focus?.()}_renderDrawerNodes(e){return!e||e.length===0?c``:c`${e.map(t=>{const r=Array.isArray(t.children)&&t.children.length>0;return c`
|
|
2
2
|
<scb-drawer-item
|
|
3
3
|
label=${t.label}
|
|
4
4
|
?selected=${!1}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "scb-wc-test",
|
|
3
|
-
"version": "0.1.
|
|
3
|
+
"version": "0.1.159",
|
|
4
4
|
"type": "module",
|
|
5
5
|
"main": "index.js",
|
|
6
6
|
"module": "index.js",
|
|
@@ -385,5 +385,5 @@
|
|
|
385
385
|
},
|
|
386
386
|
"./mvc/*": "./mvc/*"
|
|
387
387
|
},
|
|
388
|
-
"buildHash": "
|
|
388
|
+
"buildHash": "ECAF9A1E355C8E83763034217B58B36E81F104F4EDAD07FD47D1E07604A5AE78"
|
|
389
389
|
}
|
|
@@ -27,7 +27,7 @@ export declare class ScbHeader extends LitElement {
|
|
|
27
27
|
bannerLabel?: string;
|
|
28
28
|
private static readonly _JSON_ARRAY;
|
|
29
29
|
tabs: HeaderTab[];
|
|
30
|
-
activeTab: number;
|
|
30
|
+
activeTab: number | null;
|
|
31
31
|
utilityItems: UtilityItem[];
|
|
32
32
|
searchPlaceholder?: string;
|
|
33
33
|
drawerLabel?: string;
|
package/scb-header/scb-header.js
CHANGED
|
@@ -26,7 +26,7 @@ const v = {
|
|
|
26
26
|
};
|
|
27
27
|
let a = class extends C {
|
|
28
28
|
constructor() {
|
|
29
|
-
super(...arguments), this.maxWidth = "1440px", this.size = "medium", this.logoText = "", this.logoHref = "/", this.logoSrc = "", this.logoHeight = "", this.logoInvertDm = !1, this.banner = !1, this.tabs = [], this.activeTab =
|
|
29
|
+
super(...arguments), this.maxWidth = "1440px", this.size = "medium", this.logoText = "", this.logoHref = "/", this.logoSrc = "", this.logoHeight = "", this.logoInvertDm = !1, this.banner = !1, this.tabs = [], this.activeTab = null, this.utilityItems = [], this.showDrawer = !0, this.showSearch = !0, this.includeUtilityInDrawer = !1, this.drawerOverlay = !0, this.searchText = "", this._drawerId = "main-drawer", this._drawerExpanded = !1, this._searchId = "header-search", this._slotNavItems = [], this._slotUtils = [], this._slotMenu = [], this._measureScheduled = !1, this._scheduleMeasure = () => {
|
|
30
30
|
this._measureScheduled || (this._measureScheduled = !0, requestAnimationFrame(() => {
|
|
31
31
|
this._measureScheduled = !1, this._measure();
|
|
32
32
|
}));
|
package/scb-wc-test.bundle.js
CHANGED
|
@@ -6924,7 +6924,7 @@ ${this.value}</textarea
|
|
|
6924
6924
|
:host {
|
|
6925
6925
|
display: none !important;
|
|
6926
6926
|
}
|
|
6927
|
-
`,_o([l({type:String})],a.ScbHeaderTab.prototype,"label",2),_o([l({type:String})],a.ScbHeaderTab.prototype,"href",2),_o([l({type:String,attribute:"drawer-id"})],a.ScbHeaderTab.prototype,"drawerId",2),a.ScbHeaderTab=_o([y("scb-header-tab")],a.ScbHeaderTab);class Pl extends HTMLElement{get label(){return this.getAttribute("label")??""}set label(e){this.setAttribute("label",e)}get href(){return this.getAttribute("href")??"#"}set href(e){this.setAttribute("href",e)}get target(){return this.getAttribute("target")??void 0}set target(e){e==null?this.removeAttribute("target"):this.setAttribute("target",e)}connectedCallback(){this.style.display="none"}}customElements.define("scb-header-utility",Pl);var hb=Object.defineProperty,pb=Object.getOwnPropertyDescriptor,L=(o,e,t,i)=>{for(var r=i>1?void 0:i?pb(e,t):e,s=o.length-1,n;s>=0;s--)(n=o[s])&&(r=(i?n(e,t,r):n(r))||r);return i&&r&&hb(e,t,r),r};const er={fromAttribute:o=>o==null?!0:!/^(false|0|off|no)$/i.test(o),toAttribute:o=>String(!!o)},ub={fromAttribute:o=>o==="small"||o==="large"?o:"medium",toAttribute:o=>{const e=String(o??"");return e==="small"||e==="large"?e:null}};a.ScbHeader=class extends _{constructor(){super(...arguments),this.maxWidth="1440px",this.size="medium",this.logoText="",this.logoHref="/",this.logoSrc="",this.logoHeight="",this.logoInvertDm=!1,this.banner=!1,this.tabs=[],this.activeTab=0,this.utilityItems=[],this.showDrawer=!0,this.showSearch=!0,this.includeUtilityInDrawer=!1,this.drawerOverlay=!0,this.searchText="",this._drawerId="main-drawer",this._drawerExpanded=!1,this._searchId="header-search",this._slotNavItems=[],this._slotUtils=[],this._slotMenu=[],this._measureScheduled=!1,this._scheduleMeasure=()=>{this._measureScheduled||(this._measureScheduled=!0,requestAnimationFrame(()=>{this._measureScheduled=!1,this._measure()}))},this._onWindowResize=()=>{this._scheduleMeasure()},this._onDrawerSelect=e=>{this.dispatchEvent(new CustomEvent("drawer-select",{detail:e.detail,bubbles:!0,composed:!0})),this._closeDrawerNow()},this._collapsed=!1,this._unlockAtWidth=0,this._hideLogoText=!1,this._logoTextUnlockAt=0,this._harvestPending=!1,this._harvest=()=>{const e=Array.from(this.children),t=[],i=[],r=[];let s=-1;const n=d=>({label:d.getAttribute("label")??"",href:d.getAttribute("href")??void 0,icon:d.getAttribute("icon")??void 0});for(const d of e){const h=d.tagName.toLowerCase();if(h==="scb-header-tab"){const u=d.getAttribute("label")??"",m=d.getAttribute("href"),v=m&&m.trim()!==""?m:void 0;(d.hasAttribute("selected")||d.getAttribute("selected")==="true"||d.getAttribute("active")==="true"||d.getAttribute("aria-current")==="page")&&s===-1&&(s=t.length),t.push({kind:"tab",label:u,href:v});continue}if(h==="scb-dropdown"){const u=d.getAttribute("label")??"";(d.hasAttribute("selected")||d.getAttribute("selected")==="true"||d.getAttribute("active")==="true"||d.getAttribute("aria-current")==="page")&&s===-1&&(s=t.length);const v=`scb-header-tab-${t.length}`;d.getAttribute("slot")!==v&&d.setAttribute("slot",v),d.hasAttribute("as-tab")||d.setAttribute("as-tab",""),t.push({kind:"dropdown",slotName:v,label:u});continue}if(h==="scb-header-utility"){i.push({label:d.getAttribute("label")??"",href:d.getAttribute("href")??"#",target:d.getAttribute("target")??void 0});continue}if(h==="scb-header-drawer-group"){const u={label:d.getAttribute("label")??"",icon:d.getAttribute("icon")??void 0,children:[]};d.querySelectorAll("scb-header-drawer-item").forEach(v=>u.children.push(n(v))),r.push(u);continue}h==="scb-header-drawer-item"&&r.push(n(d))}this._slotNavItems=t,this._slotUtils=i,this._slotMenu=r,!this.hasAttribute("active-tab")&&s>=0&&(this.activeTab=s),queueMicrotask(()=>{this.updateComplete.then(()=>{this._scheduleMeasure()})})},this._measure=()=>{var v,x,g;const e=this._top,t=this._logoGroup;if(!e||!t)return;const i=window.innerWidth,r=e.clientWidth,s=this._overflows(this._util),n=this._overflows(this._tabsNav),d=i<this.BP_MD||s||n;this._collapsed?!d&&r>=this._unlockAtWidth&&this._setCollapsed(!1):d&&(this._unlockAtWidth=r+this._HYST,this._setCollapsed(!0));let h=!1;if(this.showSearch&&i>=this.BP_SM&&i<this.BP_MD&&this._searchWrap){const w=getComputedStyle(this._searchWrap),S=Math.max(this._num(w.minWidth,this._tokenPx("--scb-header-search-min",320)),this._tokenPx("--scb-header-search-min",320)),k=this._num(getComputedStyle(e).gap,this._tokenPx("--spacing-7",24)),$=this.showDrawer&&(i<this.BP_MD||this._collapsed)?((v=this._menuBtn)==null?void 0:v.getBoundingClientRect().width)||this._tokenPx("--icon-size-large",48):0;h=t.getBoundingClientRect().width+k+S+k+$+8>r+.5}this._setHideSearch(h);let u=!1;if(this.showDrawer&&(i<this.BP_MD||this._collapsed)&&!this._visible(this._util)&&!this._visible(this._searchWrap)){const w=this._num(getComputedStyle(e).gap,this._tokenPx("--spacing-7",24)),S=((x=this._menuBtn)==null?void 0:x.getBoundingClientRect().width)||this._tokenPx("--icon-size-large",48),k=(((g=this._logoGroup)==null?void 0:g.getBoundingClientRect().width)||0)+w+S;this._hideLogoText?u=!(r>=this._logoTextUnlockAt):k>r+.5&&(u=!0,this._logoTextUnlockAt=r+this._HYST)}else u=!1,this._logoTextUnlockAt=0;this._setHideLogoText(u)},this._onMenuClick=async e=>{e.preventDefault(),e.stopPropagation(),this.showDrawer&&(this.dispatchEvent(new CustomEvent("menu-click",{bubbles:!0,composed:!0})),await a.ScbHeader._nextFrame(),await a.ScbHeader._nextFrame(),this._openDrawerNow())},this._onSearchClick=e=>{var r;const t=this._searchEl;if(t!=null&&t.submit&&typeof t.submit=="function"){t.submit();return}const i=(t==null?void 0:t.value)??"";this.searchText=i,this.dispatchEvent(new CustomEvent("search-click",{detail:{value:i},bubbles:!0,composed:!0})),(r=t==null?void 0:t.focus)==null||r.call(t)},this._onTabClick=e=>{const t=e.currentTarget;if(!t)return;const i=t.tagName.toLowerCase()==="a";if(i&&(e.defaultPrevented||e.button!==0||e.metaKey||e.ctrlKey||e.shiftKey||e.altKey))return;const r=t.getAttribute("data-index"),s=r!=null?Number(r):0,d=this._getNavItems()[s];if((d==null?void 0:d.kind)==="dropdown")return;this.activeTab=s;const h=(d==null?void 0:d.kind)==="tab"?d.href??"":"",u=new CustomEvent("tab-change",{detail:{index:s,href:h},bubbles:!0,composed:!0,cancelable:!0});!this.dispatchEvent(u)&&i&&e.preventDefault()},this._onDropdownTabActivate=e=>{var s,n;const t=(s=e.detail)==null?void 0:s.dataIndex,i=typeof t=="number"?t:typeof t=="string"?Number(t):this._readTabIndexFromEvent(e);if(i==null||!Number.isFinite(i))return;const r=this._getNavItems();i<0||i>=r.length||((n=r[i])==null?void 0:n.kind)==="dropdown"&&(this.activeTab=i,this.dispatchEvent(new CustomEvent("tab-change",{detail:{index:i,href:""},bubbles:!0,composed:!0,cancelable:!0})))},this._onTabsKeydown=e=>{const t=e.key;if(t!=="ArrowLeft"&&t!=="ArrowRight"&&t!=="Home"&&t!=="End")return;const i=this._getNavItems();if(!i.length)return;const r=this._readTabIndexFromEvent(e);if(r==null)return;let s=Math.max(0,Math.min(i.length-1,r));t==="ArrowRight"?s=(s+1)%i.length:t==="ArrowLeft"?s=(s-1+i.length)%i.length:t==="Home"?s=0:t==="End"&&(s=i.length-1),e.preventDefault(),this._focusTabAtIndex(s)},this._onSearchInput=e=>{var t;this.searchText=((t=e.detail)==null?void 0:t.value)??"",this.dispatchEvent(new CustomEvent("search-input",{detail:{value:this.searchText},bubbles:!0,composed:!0})),this.dispatchEvent(new CustomEvent("search-text-change",{detail:{value:this.searchText},bubbles:!0,composed:!0}))},this._onSearchSubmit=e=>{var t,i;this.searchText=((t=e.detail)==null?void 0:t.value)??"",this.dispatchEvent(new CustomEvent("search-change",{detail:{value:this.searchText,active:(i=e.detail)==null?void 0:i.active},bubbles:!0,composed:!0}))},this._onSearchClear=()=>{this.searchText="",this.dispatchEvent(new CustomEvent("search-text-change",{detail:{value:""},bubbles:!0,composed:!0}))}}get _HYST(){return this._tokenPx("--spacing-11",64)}get BP_SM(){return this._tokenPx("--bp-sm",a.ScbHeader.BP_SM_DEFAULT)}get BP_MD(){return this._tokenPx("--bp-md",a.ScbHeader.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(){var t;(t=this._slotMo)==null||t.disconnect();const e=new MutationObserver(i=>{this._scheduleHarvest()});this._slotMo=e,e.observe(this,{subtree:!0,childList:!0,attributes:!0,attributeFilter:["label","href","icon","target","selected","aria-current","active"]})}_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 i=Number.parseFloat(String(e??"").trim());return Number.isFinite(i)?i:t}_tokenPx(e,t){const i=getComputedStyle(this);return this._num(i.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}firstUpdated(){this.updateComplete.then(()=>{this._harvest(),this._attachSlotObservers()});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??"480px"),e.has("searchMin")&&this.style.setProperty("--scb-header-search-min",this.searchMin??"320px"),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("logoHeight")&&(this.logoHeight&&this.logoHeight.trim()?this.style.setProperty("--scb-header-logo-img-h",this.logoHeight.trim()):this.style.removeProperty("--scb-header-logo-img-h")),(e.has("utilityItems")||e.has("tabs")||e.has("logoText")||e.has("logoSrc")||e.has("logoHeight")||e.has("activeTab")||e.has("_slotNavItems")||e.has("_slotUtils")||e.has("_slotMenu")||e.has("showDrawer")||e.has("showSearch")||e.has("searchMax")||e.has("searchMin")||e.has("size"))&&this.updateComplete.then(()=>{this._scheduleMeasure()}),(e.has("activeTab")||e.has("_slotNavItems")||e.has("tabs"))&&this.updateComplete.then(()=>{this._syncDropdownTabs()})}disconnectedCallback(){var e,t;(e=this._ro)==null||e.disconnect(),(t=this._slotMo)==null||t.disconnect(),window.removeEventListener("resize",this._onWindowResize),super.disconnectedCallback()}_openDrawerNow(){var t,i;const e=this.renderRoot.querySelector(`#${this._drawerId}`);e&&(e.open=!0,e.setAttribute("open",""),(t=e.show)==null||t.call(e),(i=e.openDrawer)==null||i.call(e),this._drawerExpanded=!0,this._syncMenuBtnAria(),this.dispatchEvent(new CustomEvent("drawer-open",{bubbles:!0,composed:!0})))}_closeDrawerNow(){const e=this.renderRoot.querySelector(`#${this._drawerId}`);e&&(e.open=!1),this._drawerExpanded=!1,this._syncMenuBtnAria(),this.dispatchEvent(new CustomEvent("drawer-close",{bubbles:!0,composed:!0}))}_syncMenuBtnAria(){const e=this.renderRoot.querySelector(".menu-trigger");e&&e.setAttribute("aria-expanded",String(this._drawerExpanded))}_getNavItems(){return this._slotNavItems.length?this._slotNavItems:(this.tabs??[]).map(e=>({kind:"tab",...e}))}_syncDropdownTabs(){this._getNavItems().forEach((t,i)=>{if(t.kind!=="dropdown")return;const r=this.querySelector(`scb-dropdown[slot="${t.slotName}"]`);if(!r)return;const s=String(i);r.getAttribute("data-index")!==s&&r.setAttribute("data-index",s),r.hasAttribute("as-tab")||r.setAttribute("as-tab",""),i===this.activeTab?r.getAttribute("aria-current")!=="page"&&r.setAttribute("aria-current","page"):r.hasAttribute("aria-current")&&r.removeAttribute("aria-current")})}_readTabIndexFromEvent(e){const t=e.composedPath?e.composedPath():[];for(const i of t){if(!(i instanceof HTMLElement))continue;const r=i.getAttribute("data-index");if(r==null)continue;const s=Number(r);if(Number.isFinite(s))return s}return null}_focusTabAtIndex(e){var s,n;const i=this._getNavItems()[e];if(!i)return;if(i.kind==="dropdown"){const d=this.querySelector(`scb-dropdown[slot="${i.slotName}"]`);(s=d==null?void 0:d.focus)==null||s.call(d);return}const r=this.renderRoot.querySelector(`.tab-link[data-index="${e}"]`);(n=r==null?void 0:r.focus)==null||n.call(r)}_renderDrawerNodes(e){return!e||e.length===0?c``:c`${e.map(t=>{const i=Array.isArray(t.children)&&t.children.length>0;return c`
|
|
6927
|
+
`,_o([l({type:String})],a.ScbHeaderTab.prototype,"label",2),_o([l({type:String})],a.ScbHeaderTab.prototype,"href",2),_o([l({type:String,attribute:"drawer-id"})],a.ScbHeaderTab.prototype,"drawerId",2),a.ScbHeaderTab=_o([y("scb-header-tab")],a.ScbHeaderTab);class Pl extends HTMLElement{get label(){return this.getAttribute("label")??""}set label(e){this.setAttribute("label",e)}get href(){return this.getAttribute("href")??"#"}set href(e){this.setAttribute("href",e)}get target(){return this.getAttribute("target")??void 0}set target(e){e==null?this.removeAttribute("target"):this.setAttribute("target",e)}connectedCallback(){this.style.display="none"}}customElements.define("scb-header-utility",Pl);var hb=Object.defineProperty,pb=Object.getOwnPropertyDescriptor,L=(o,e,t,i)=>{for(var r=i>1?void 0:i?pb(e,t):e,s=o.length-1,n;s>=0;s--)(n=o[s])&&(r=(i?n(e,t,r):n(r))||r);return i&&r&&hb(e,t,r),r};const er={fromAttribute:o=>o==null?!0:!/^(false|0|off|no)$/i.test(o),toAttribute:o=>String(!!o)},ub={fromAttribute:o=>o==="small"||o==="large"?o:"medium",toAttribute:o=>{const e=String(o??"");return e==="small"||e==="large"?e:null}};a.ScbHeader=class extends _{constructor(){super(...arguments),this.maxWidth="1440px",this.size="medium",this.logoText="",this.logoHref="/",this.logoSrc="",this.logoHeight="",this.logoInvertDm=!1,this.banner=!1,this.tabs=[],this.activeTab=null,this.utilityItems=[],this.showDrawer=!0,this.showSearch=!0,this.includeUtilityInDrawer=!1,this.drawerOverlay=!0,this.searchText="",this._drawerId="main-drawer",this._drawerExpanded=!1,this._searchId="header-search",this._slotNavItems=[],this._slotUtils=[],this._slotMenu=[],this._measureScheduled=!1,this._scheduleMeasure=()=>{this._measureScheduled||(this._measureScheduled=!0,requestAnimationFrame(()=>{this._measureScheduled=!1,this._measure()}))},this._onWindowResize=()=>{this._scheduleMeasure()},this._onDrawerSelect=e=>{this.dispatchEvent(new CustomEvent("drawer-select",{detail:e.detail,bubbles:!0,composed:!0})),this._closeDrawerNow()},this._collapsed=!1,this._unlockAtWidth=0,this._hideLogoText=!1,this._logoTextUnlockAt=0,this._harvestPending=!1,this._harvest=()=>{const e=Array.from(this.children),t=[],i=[],r=[];let s=-1;const n=d=>({label:d.getAttribute("label")??"",href:d.getAttribute("href")??void 0,icon:d.getAttribute("icon")??void 0});for(const d of e){const h=d.tagName.toLowerCase();if(h==="scb-header-tab"){const u=d.getAttribute("label")??"",m=d.getAttribute("href"),v=m&&m.trim()!==""?m:void 0;(d.hasAttribute("selected")||d.getAttribute("selected")==="true"||d.getAttribute("active")==="true"||d.getAttribute("aria-current")==="page")&&s===-1&&(s=t.length),t.push({kind:"tab",label:u,href:v});continue}if(h==="scb-dropdown"){const u=d.getAttribute("label")??"";(d.hasAttribute("selected")||d.getAttribute("selected")==="true"||d.getAttribute("active")==="true"||d.getAttribute("aria-current")==="page")&&s===-1&&(s=t.length);const v=`scb-header-tab-${t.length}`;d.getAttribute("slot")!==v&&d.setAttribute("slot",v),d.hasAttribute("as-tab")||d.setAttribute("as-tab",""),t.push({kind:"dropdown",slotName:v,label:u});continue}if(h==="scb-header-utility"){i.push({label:d.getAttribute("label")??"",href:d.getAttribute("href")??"#",target:d.getAttribute("target")??void 0});continue}if(h==="scb-header-drawer-group"){const u={label:d.getAttribute("label")??"",icon:d.getAttribute("icon")??void 0,children:[]};d.querySelectorAll("scb-header-drawer-item").forEach(v=>u.children.push(n(v))),r.push(u);continue}h==="scb-header-drawer-item"&&r.push(n(d))}this._slotNavItems=t,this._slotUtils=i,this._slotMenu=r,!this.hasAttribute("active-tab")&&s>=0&&(this.activeTab=s),queueMicrotask(()=>{this.updateComplete.then(()=>{this._scheduleMeasure()})})},this._measure=()=>{var v,x,g;const e=this._top,t=this._logoGroup;if(!e||!t)return;const i=window.innerWidth,r=e.clientWidth,s=this._overflows(this._util),n=this._overflows(this._tabsNav),d=i<this.BP_MD||s||n;this._collapsed?!d&&r>=this._unlockAtWidth&&this._setCollapsed(!1):d&&(this._unlockAtWidth=r+this._HYST,this._setCollapsed(!0));let h=!1;if(this.showSearch&&i>=this.BP_SM&&i<this.BP_MD&&this._searchWrap){const w=getComputedStyle(this._searchWrap),S=Math.max(this._num(w.minWidth,this._tokenPx("--scb-header-search-min",320)),this._tokenPx("--scb-header-search-min",320)),k=this._num(getComputedStyle(e).gap,this._tokenPx("--spacing-7",24)),$=this.showDrawer&&(i<this.BP_MD||this._collapsed)?((v=this._menuBtn)==null?void 0:v.getBoundingClientRect().width)||this._tokenPx("--icon-size-large",48):0;h=t.getBoundingClientRect().width+k+S+k+$+8>r+.5}this._setHideSearch(h);let u=!1;if(this.showDrawer&&(i<this.BP_MD||this._collapsed)&&!this._visible(this._util)&&!this._visible(this._searchWrap)){const w=this._num(getComputedStyle(e).gap,this._tokenPx("--spacing-7",24)),S=((x=this._menuBtn)==null?void 0:x.getBoundingClientRect().width)||this._tokenPx("--icon-size-large",48),k=(((g=this._logoGroup)==null?void 0:g.getBoundingClientRect().width)||0)+w+S;this._hideLogoText?u=!(r>=this._logoTextUnlockAt):k>r+.5&&(u=!0,this._logoTextUnlockAt=r+this._HYST)}else u=!1,this._logoTextUnlockAt=0;this._setHideLogoText(u)},this._onMenuClick=async e=>{e.preventDefault(),e.stopPropagation(),this.showDrawer&&(this.dispatchEvent(new CustomEvent("menu-click",{bubbles:!0,composed:!0})),await a.ScbHeader._nextFrame(),await a.ScbHeader._nextFrame(),this._openDrawerNow())},this._onSearchClick=e=>{var r;const t=this._searchEl;if(t!=null&&t.submit&&typeof t.submit=="function"){t.submit();return}const i=(t==null?void 0:t.value)??"";this.searchText=i,this.dispatchEvent(new CustomEvent("search-click",{detail:{value:i},bubbles:!0,composed:!0})),(r=t==null?void 0:t.focus)==null||r.call(t)},this._onTabClick=e=>{const t=e.currentTarget;if(!t)return;const i=t.tagName.toLowerCase()==="a";if(i&&(e.defaultPrevented||e.button!==0||e.metaKey||e.ctrlKey||e.shiftKey||e.altKey))return;const r=t.getAttribute("data-index"),s=r!=null?Number(r):0,d=this._getNavItems()[s];if((d==null?void 0:d.kind)==="dropdown")return;this.activeTab=s;const h=(d==null?void 0:d.kind)==="tab"?d.href??"":"",u=new CustomEvent("tab-change",{detail:{index:s,href:h},bubbles:!0,composed:!0,cancelable:!0});!this.dispatchEvent(u)&&i&&e.preventDefault()},this._onDropdownTabActivate=e=>{var s,n;const t=(s=e.detail)==null?void 0:s.dataIndex,i=typeof t=="number"?t:typeof t=="string"?Number(t):this._readTabIndexFromEvent(e);if(i==null||!Number.isFinite(i))return;const r=this._getNavItems();i<0||i>=r.length||((n=r[i])==null?void 0:n.kind)==="dropdown"&&(this.activeTab=i,this.dispatchEvent(new CustomEvent("tab-change",{detail:{index:i,href:""},bubbles:!0,composed:!0,cancelable:!0})))},this._onTabsKeydown=e=>{const t=e.key;if(t!=="ArrowLeft"&&t!=="ArrowRight"&&t!=="Home"&&t!=="End")return;const i=this._getNavItems();if(!i.length)return;const r=this._readTabIndexFromEvent(e);if(r==null)return;let s=Math.max(0,Math.min(i.length-1,r));t==="ArrowRight"?s=(s+1)%i.length:t==="ArrowLeft"?s=(s-1+i.length)%i.length:t==="Home"?s=0:t==="End"&&(s=i.length-1),e.preventDefault(),this._focusTabAtIndex(s)},this._onSearchInput=e=>{var t;this.searchText=((t=e.detail)==null?void 0:t.value)??"",this.dispatchEvent(new CustomEvent("search-input",{detail:{value:this.searchText},bubbles:!0,composed:!0})),this.dispatchEvent(new CustomEvent("search-text-change",{detail:{value:this.searchText},bubbles:!0,composed:!0}))},this._onSearchSubmit=e=>{var t,i;this.searchText=((t=e.detail)==null?void 0:t.value)??"",this.dispatchEvent(new CustomEvent("search-change",{detail:{value:this.searchText,active:(i=e.detail)==null?void 0:i.active},bubbles:!0,composed:!0}))},this._onSearchClear=()=>{this.searchText="",this.dispatchEvent(new CustomEvent("search-text-change",{detail:{value:""},bubbles:!0,composed:!0}))}}get _HYST(){return this._tokenPx("--spacing-11",64)}get BP_SM(){return this._tokenPx("--bp-sm",a.ScbHeader.BP_SM_DEFAULT)}get BP_MD(){return this._tokenPx("--bp-md",a.ScbHeader.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(){var t;(t=this._slotMo)==null||t.disconnect();const e=new MutationObserver(i=>{this._scheduleHarvest()});this._slotMo=e,e.observe(this,{subtree:!0,childList:!0,attributes:!0,attributeFilter:["label","href","icon","target","selected","aria-current","active"]})}_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 i=Number.parseFloat(String(e??"").trim());return Number.isFinite(i)?i:t}_tokenPx(e,t){const i=getComputedStyle(this);return this._num(i.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}firstUpdated(){this.updateComplete.then(()=>{this._harvest(),this._attachSlotObservers()});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??"480px"),e.has("searchMin")&&this.style.setProperty("--scb-header-search-min",this.searchMin??"320px"),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("logoHeight")&&(this.logoHeight&&this.logoHeight.trim()?this.style.setProperty("--scb-header-logo-img-h",this.logoHeight.trim()):this.style.removeProperty("--scb-header-logo-img-h")),(e.has("utilityItems")||e.has("tabs")||e.has("logoText")||e.has("logoSrc")||e.has("logoHeight")||e.has("activeTab")||e.has("_slotNavItems")||e.has("_slotUtils")||e.has("_slotMenu")||e.has("showDrawer")||e.has("showSearch")||e.has("searchMax")||e.has("searchMin")||e.has("size"))&&this.updateComplete.then(()=>{this._scheduleMeasure()}),(e.has("activeTab")||e.has("_slotNavItems")||e.has("tabs"))&&this.updateComplete.then(()=>{this._syncDropdownTabs()})}disconnectedCallback(){var e,t;(e=this._ro)==null||e.disconnect(),(t=this._slotMo)==null||t.disconnect(),window.removeEventListener("resize",this._onWindowResize),super.disconnectedCallback()}_openDrawerNow(){var t,i;const e=this.renderRoot.querySelector(`#${this._drawerId}`);e&&(e.open=!0,e.setAttribute("open",""),(t=e.show)==null||t.call(e),(i=e.openDrawer)==null||i.call(e),this._drawerExpanded=!0,this._syncMenuBtnAria(),this.dispatchEvent(new CustomEvent("drawer-open",{bubbles:!0,composed:!0})))}_closeDrawerNow(){const e=this.renderRoot.querySelector(`#${this._drawerId}`);e&&(e.open=!1),this._drawerExpanded=!1,this._syncMenuBtnAria(),this.dispatchEvent(new CustomEvent("drawer-close",{bubbles:!0,composed:!0}))}_syncMenuBtnAria(){const e=this.renderRoot.querySelector(".menu-trigger");e&&e.setAttribute("aria-expanded",String(this._drawerExpanded))}_getNavItems(){return this._slotNavItems.length?this._slotNavItems:(this.tabs??[]).map(e=>({kind:"tab",...e}))}_syncDropdownTabs(){this._getNavItems().forEach((t,i)=>{if(t.kind!=="dropdown")return;const r=this.querySelector(`scb-dropdown[slot="${t.slotName}"]`);if(!r)return;const s=String(i);r.getAttribute("data-index")!==s&&r.setAttribute("data-index",s),r.hasAttribute("as-tab")||r.setAttribute("as-tab",""),i===this.activeTab?r.getAttribute("aria-current")!=="page"&&r.setAttribute("aria-current","page"):r.hasAttribute("aria-current")&&r.removeAttribute("aria-current")})}_readTabIndexFromEvent(e){const t=e.composedPath?e.composedPath():[];for(const i of t){if(!(i instanceof HTMLElement))continue;const r=i.getAttribute("data-index");if(r==null)continue;const s=Number(r);if(Number.isFinite(s))return s}return null}_focusTabAtIndex(e){var s,n;const i=this._getNavItems()[e];if(!i)return;if(i.kind==="dropdown"){const d=this.querySelector(`scb-dropdown[slot="${i.slotName}"]`);(s=d==null?void 0:d.focus)==null||s.call(d);return}const r=this.renderRoot.querySelector(`.tab-link[data-index="${e}"]`);(n=r==null?void 0:r.focus)==null||n.call(r)}_renderDrawerNodes(e){return!e||e.length===0?c``:c`${e.map(t=>{const i=Array.isArray(t.children)&&t.children.length>0;return c`
|
|
6928
6928
|
<scb-drawer-item
|
|
6929
6929
|
label=${t.label}
|
|
6930
6930
|
?selected=${!1}
|