npm - @six-group/ui-library - Versions diffs - 0.0.0-insider.1a260b6 → 0.0.0-insider.1c3fe8c - Mend

@six-group/ui-library 0.0.0-insider.1a260b6 → 0.0.0-insider.1c3fe8c

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.

Files changed (1841) hide show

package/dist/ui-library/p-39109b96.entry.js ADDED Viewed

	@@ -0,0 +1,2 @@
1	+ import{r as t,c as o,h as i,g as r}from"./p-JoG9I7EO.js";import{s}from"./p-BY6hIEFX.js";import{f as a}from"./p-SLlDVtvF.js";const e=":host{position:relative;box-sizing:border-box}:host ,:host :before,:host *:after{box-sizing:border-box}.sr-only{clip:rect(0 0 0 0);clip-path:inset(50%);height:1px;overflow:hidden;position:absolute;white-space:nowrap;width:1px}:host{display:block}.tab-group{display:flex;border:solid 1px transparent;border-radius:0}.tab-group .tab-group__tabs{display:flex;position:relative}.tab-group--has-scroll-controls .tab-group__nav-container{position:relative;padding:0 var(--six-spacing-x-large)}.tab-group__scroll-button{display:flex;align-items:center;justify-content:center;position:absolute;top:0;bottom:0;width:var(--six-spacing-x-large)}.tab-group__scroll-button--left{left:0}.tab-group__scroll-button--right{right:0}.tab-group--top{flex-direction:column}.tab-group--top .tab-group__nav-container{order:1}.tab-group--top .tab-group__nav{display:flex;overflow-x:auto;scrollbar-width:none;-ms-overflow-style:none}.tab-group--top .tab-group__nav::-webkit-scrollbar{width:0;height:0}.tab-group--top .tab-group__tabs{flex:1 1 auto;position:relative;flex-direction:row}.tab-group--top .tab-group__body{order:2}.tab-group--bottom{flex-direction:column}.tab-group--bottom .tab-group__nav-container{order:2}.tab-group--bottom .tab-group__nav{display:flex;overflow-x:auto;scrollbar-width:none;-ms-overflow-style:none}.tab-group--bottom .tab-group__nav::-webkit-scrollbar{width:0;height:0}.tab-group--bottom .tab-group__tabs{flex:1 1 auto;position:relative;flex-direction:row}.tab-group--bottom .tab-group__body{order:1}.tab-group--left{flex-direction:row}.tab-group--left .tab-group__nav-container{order:1}.tab-group--left .tab-group__tabs{flex:0 0 auto;flex-direction:column}.tab-group--left .tab-group__body{flex:1 1 auto;order:2}.tab-group--right{flex-direction:row}.tab-group--right .tab-group__nav-container{order:2}.tab-group--right .tab-group__tabs{flex:0 0 auto;flex-direction:column}.tab-group--right .tab-group__body{flex:1 1 auto;order:1}";const l=class{constructor(i){t(this,i);this.sixTabShow=o(this,"six-tab-show");this.sixTabHide=o(this,"six-tab-hide");this.hasLeftControl=false;this.hasRightControl=false;this.placement="top";this.noScrollControls=false;this.handleClick=t=>{const o=t.target;const i=o.closest("six-tab");const r=i===null\|\|i===void 0?void 0:i.closest("six-tab-group");if(r!==this.host){return false}if(i!=null){this.setActiveTab(i)}};this.handleKeyDown=t=>{if(this.nav==null)return;const o=t.target;const i=o.closest("six-tab");const r=i===null\|\|i===void 0?void 0:i.closest("six-tab-group");if(r!==this.host){return false}if(["ArrowLeft","ArrowRight","ArrowUp","ArrowDown","Home","End"].includes(t.key)){const o=document.activeElement;if(o&&o.tagName.toLowerCase()==="six-tab"){const i=this.getAllTabs();let r=i.indexOf(o);if(t.key==="Home"){r=0}else if(t.key==="End"){r=i.length-1}else if(t.key==="ArrowLeft"){r=Math.max(0,r-1)}else if(t.key==="ArrowRight"){r=Math.min(i.length-1,r+1)}i[r].setFocus({preventScroll:true});this.setActiveTab(i[r]);if(["top","bottom"].includes(this.placement)){s(i[r],this.nav,"horizontal")}t.preventDefault()}}};this.handleScrollLeft=()=>{if(this.nav==null)return;this.nav.scroll({left:this.nav.scrollLeft-this.nav.clientWidth,behavior:"smooth"})};this.handleScrollRight=()=>{if(this.nav==null)return;this.nav.scroll({left:this.nav.scrollLeft+this.nav.clientWidth,behavior:"smooth"})}}handleNoScrollControlsChange(){this.updateScrollControls()}componentDidLoad(){if(this.tabGroup==null\|\|this.nav==null)return;const t=new IntersectionObserver(((t,o)=>{if(t[0].intersectionRatio>0){this.setAriaLabels();this.setActiveTab(this.getActiveTab()\|\|this.getAllTabs()[0],false);o.unobserve(t[0].target)}}));t.observe(this.host);this.resizeObserver=new ResizeObserver((()=>this.updateScrollControls()));this.resizeObserver.observe(this.nav);requestAnimationFrame((()=>this.updateScrollControls()));this.nav.addEventListener("scroll",(()=>{if(this.nav==null){return}this.hasRightControl=this.calculateRightControlVisibility();this.hasLeftControl=this.calculateLeftControlVisibility()}));this.mutationObserver=new MutationObserver((t=>{if(t.some((t=>{var o;return!["aria-labelledby","aria-controls"].includes((o=t.attributeName)!==null&&o!==void 0?o:"")}))){setTimeout((()=>this.setAriaLabels()))}}));this.mutationObserver.observe(this.host,{attributes:true,childList:true,subtree:true})}disconnectedCallback(){if(this.mutationObserver==null\|\|this.tabGroup==null\|\|this.nav==null\|\|this.resizeObserver==null){return}this.mutationObserver.disconnect();this.resizeObserver.unobserve(this.nav)}async show(t){const o=this.getAllTabs();const i=o.find((o=>o.panel===t));if(i!=null){this.setActiveTab(i)}}getAllTabs(t=false){var o;const i=(o=this.tabs)===null\|\|o===void 0?void 0:o.querySelector("slot");if(i==null)return[];return[...i.assignedElements()].filter((o=>t?o.tagName.toLowerCase()==="six-tab":o.tagName.toLowerCase()==="six-tab"&&!o.disabled))}getAllPanels(){var t;const o=(t=this.body)===null\|\|t===void 0?void 0:t.querySelector("slot");if(o==null)return[];return[...o.assignedElements()].filter((t=>t.tagName.toLowerCase()==="six-tab-panel"))}getActiveTab(){return this.getAllTabs().find((t=>t.active))}calculateRightControlVisibility(){var t,o,i;if(this.nav==null){return false}return Math.abs((t=this.nav)===null\|\|t===void 0?void 0:t.scrollLeft)+((o=this.nav)===null\|\|o===void 0?void 0:o.clientWidth)<((i=this.nav)===null\|\|i===void 0?void 0:i.scrollWidth)-1}calculateLeftControlVisibility(){var t;if(this.nav==null){return false}return Math.abs((t=this.nav)===null\|\|t===void 0?void 0:t.scrollLeft)>0}updateScrollControls(){if(this.nav==null)return;this.hasRightControl=this.noScrollControls?false:["top","bottom"].includes(this.placement)&&this.calculateRightControlVisibility();this.hasLeftControl=this.noScrollControls?false:["top","bottom"].includes(this.placement)&&this.calculateLeftControlVisibility()}setActiveTab(t,o=true){var i,r,e;if(this.nav==null)return;const l=(i=t===null\|\|t===void 0?void 0:t.shadowRoot)===null\|\|i===void 0?void 0:i.querySelector(".tab__indicator");const n=(e=(r=this.getActiveTab())===null\|\|r===void 0?void 0:r.shadowRoot)===null\|\|e===void 0?void 0:e.querySelector(".tab__indicator");if(n!=null&&l!=null){a(l,n)}if(t!==this.activeTab&&!t.disabled){const i=this.activeTab;this.activeTab=t;this.getAllTabs().map((t=>t.active=t===this.activeTab));this.getAllPanels().map((t=>{var o;return t.active=t.name===((o=this.activeTab)===null\|\|o===void 0?void 0:o.panel)}));if(["top","bottom"].includes(this.placement)){s(this.activeTab,this.nav,"horizontal")}if(o){if(i!=null){this.sixTabHide.emit({name:i.panel})}this.sixTabShow.emit({name:this.activeTab.panel})}}}setAriaLabels(){const t=this.getAllTabs();const o=this.getAllPanels();t.map((t=>{var i,r;const s=o.find((o=>o.name===t.panel));if(s!=null){t.setAttribute("aria-controls",(i=s.getAttribute("id"))!==null&&i!==void 0?i:"");s.setAttribute("aria-labelledby",(r=t.getAttribute("id"))!==null&&r!==void 0?r:"")}}))}render(){return i("div",{key:"56aaa11f3101ba44544017ee7f881ec20d779b40",part:"base",ref:t=>this.tabGroup=t,class:{"tab-group":true,"tab-group--top":this.placement==="top","tab-group--bottom":this.placement==="bottom","tab-group--left":this.placement==="left","tab-group--right":this.placement==="right","tab-group--has-scroll-controls":this.hasRightControl\|\|this.hasLeftControl},onClick:this.handleClick,onKeyDown:this.handleKeyDown},i("div",{key:"439df915243867dc2b8b6fa6b508d99f5dbed623",class:"tab-group__nav-container"},this.hasLeftControl&&i("six-icon-button",{key:"4921d96aea14fc6ee904b5f56c115fc9dd00c6fa",class:"tab-group__scroll-button tab-group__scroll-button--left",exportparts:"base:scroll-button",name:"chevron_left",onClick:this.handleScrollLeft}),i("div",{ref:t=>this.nav=t,key:"nav",part:"nav",class:"tab-group__nav"},i("div",{key:"078cf88dd7be97d186f70f16055b22d5a2a2047b",ref:t=>this.tabs=t,part:"tabs",class:"tab-group__tabs",role:"tablist"},i("slot",{key:"b65782fdf2f18b7a59912227293e49c2d3cba83d",name:"nav"}))),this.hasRightControl&&i("six-icon-button",{key:"8273dadfbfb6de487b10b0b7a8e5d6eb3dfa1b81",class:"tab-group__scroll-button tab-group__scroll-button--right",exportparts:"base:scroll-button",name:"chevron_right",onClick:this.handleScrollRight})),i("div",{key:"014ba8c47b65d967dc3eb547f9b282fab8270a58",ref:t=>this.body=t,part:"body",class:"tab-group__body"},i("slot",{key:"488a5b56b66451f1f17802bd0421d4c2d70a773c"})))}get host(){return r(this)}static get watchers(){return{noScrollControls:["handleNoScrollControlsChange"]}}};l.style=e;export{l as six_tab_group};
2	+ //# sourceMappingURL=p-39109b96.entry.js.map

package/dist/ui-library/p-39109b96.entry.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"names":["sixTabGroupCss","SixTabGroup","constructor","hostRef","this","hasLeftControl","hasRightControl","placement","noScrollControls","handleClick","event","target","tab","closest","tabGroup","host","setActiveTab","handleKeyDown","nav","includes","key","activeEl","document","activeElement","tagName","toLowerCase","tabs","getAllTabs","index","indexOf","length","Math","max","min","setFocus","preventScroll","scrollIntoView","preventDefault","handleScrollLeft","scroll","left","scrollLeft","clientWidth","behavior","handleScrollRight","handleNoScrollControlsChange","updateScrollControls","componentDidLoad","observer","IntersectionObserver","entries","intersectionRatio","setAriaLabels","getActiveTab","unobserve","observe","resizeObserver","ResizeObserver","requestAnimationFrame","addEventListener","calculateRightControlVisibility","calculateLeftControlVisibility","mutationObserver","MutationObserver","mutations","some","mutation","_a","attributeName","setTimeout","attributes","childList","subtree","disconnectedCallback","disconnect","show","panel","find","el","includeDisabled","slot","querySelector","assignedElements","filter","disabled","getAllPanels","body","active","abs","_b","_c","scrollWidth","emitEvents","newIndicator","shadowRoot","oldIndicator","flipAnimate","activeTab","previousTab","map","name","sixTabHide","emit","sixTabShow","panels","setAttribute","getAttribute","render","h","part","ref","class","onClick","onKeyDown","exportparts","role"],"sources":["src/components/six-tab-group/six-tab-group.scss?tag=six-tab-group&encapsulation=shadow","src/components/six-tab-group/six-tab-group.tsx"],"sourcesContent":["@import 'src/global/component';\n@import 'src/global/mixins/hide-scrollbar';\n\n:host {\n display: block;\n}\n\n.tab-group {\n display: flex;\n border: solid 1px transparent;\n border-radius: 0;\n\n .tab-group__tabs {\n display: flex;\n position: relative;\n }\n}\n\n.tab-group--has-scroll-controls .tab-group__nav-container {\n position: relative;\n padding: 0 var(--six-spacing-x-large);\n}\n\n.tab-group__scroll-button {\n display: flex;\n align-items: center;\n justify-content: center;\n position: absolute;\n top: 0;\n bottom: 0;\n width: var(--six-spacing-x-large);\n}\n\n.tab-group__scroll-button--left {\n left: 0;\n}\n\n.tab-group__scroll-button--right {\n right: 0;\n}\n\n// TOP\n.tab-group--top {\n flex-direction: column;\n\n .tab-group__nav-container {\n order: 1;\n }\n\n .tab-group__nav {\n display: flex;\n overflow-x: auto;\n @include hide-scrollbar();\n }\n\n .tab-group__tabs {\n flex: 1 1 auto;\n position: relative;\n flex-direction: row;\n }\n\n .tab-group__body {\n order: 2;\n }\n}\n\n// Bottom\n.tab-group--bottom {\n flex-direction: column;\n\n .tab-group__nav-container {\n order: 2;\n }\n\n .tab-group__nav {\n display: flex;\n overflow-x: auto;\n @include hide-scrollbar();\n }\n\n .tab-group__tabs {\n flex: 1 1 auto;\n position: relative;\n flex-direction: row;\n }\n\n .tab-group__body {\n order: 1;\n }\n}\n\n// Left\n\n.tab-group--left {\n flex-direction: row;\n\n .tab-group__nav-container {\n order: 1;\n }\n\n .tab-group__tabs {\n flex: 0 0 auto;\n flex-direction: column;\n }\n\n .tab-group__body {\n flex: 1 1 auto;\n order: 2;\n }\n}\n\n// Right\n.tab-group--right {\n flex-direction: row;\n\n .tab-group__nav-container {\n order: 2;\n }\n\n .tab-group__tabs {\n flex: 0 0 auto;\n flex-direction: column;\n }\n\n .tab-group__body {\n flex: 1 1 auto;\n order: 1;\n }\n}\n","import { Component, Element, Event, EventEmitter, h, Method, Prop, State, Watch } from '@stencil/core';\nimport { scrollIntoView } from '../../utils/scroll';\nimport { flipAnimate } from '../../utils/animation';\n\nexport interface SixTabShowPayload {\n name: string;\n}\n\nexport interface SixTabHidePayload {\n name: string;\n}\n\n/**\n * @since 1.0\n * @status stable\n *\n * Forked from https://github.com/shoelace-style/shoelace version v2.0.0-beta27.\n *\n * @slot nav - Used for grouping tabs in the tab group.\n * @slot - Used for grouping tab panels in the tab group.\n *\n * @part base - The component's base wrapper.\n * @part nav - The tab group navigation container.\n * @part tabs - The container that wraps the slotted tabs.\n * @part active-tab-indicator - An element that displays the currently selected tab. This is a child of the tab's container.\n * @part body - The tab group body where tab panels are slotted in.\n * @part scroll-button - The previous and next scroll buttons that appear when tabs are scrollable.\n */\n@Component({\n tag: 'six-tab-group',\n styleUrl: 'six-tab-group.scss',\n shadow: true,\n})\nexport class SixTabGroup {\n private activeTab?: HTMLSixTabElement;\n private body?: HTMLElement;\n private mutationObserver?: MutationObserver;\n private nav?: HTMLElement;\n private resizeObserver?: ResizeObserver;\n private tabGroup?: HTMLElement;\n private tabs?: HTMLElement;\n\n @Element() host!: HTMLSixTabGroupElement;\n\n @State() hasLeftControl = false;\n @State() hasRightControl = false;\n\n /** The placement of the tabs. */\n @Prop() placement: 'top' | 'bottom' | 'left' | 'right' = 'top';\n\n /** Disables the scroll arrows that appear when tabs overflow. */\n @Prop() noScrollControls = false;\n\n @Watch('noScrollControls')\n handleNoScrollControlsChange() {\n this.updateScrollControls();\n }\n\n /** Emitted when a tab is shown. */\n @Event({ eventName: 'six-tab-show' }) sixTabShow!: EventEmitter<SixTabShowPayload>;\n\n /** Emitted when a tab is hidden. */\n @Event({ eventName: 'six-tab-hide' }) sixTabHide!: EventEmitter<SixTabHidePayload>;\n\n componentDidLoad() {\n if (this.tabGroup == null || this.nav == null) return;\n\n // Set initial tab state when the tabs first become visible\n const observer = new IntersectionObserver((entries, observer) => {\n if (entries[0].intersectionRatio > 0) {\n this.setAriaLabels();\n this.setActiveTab(this.getActiveTab() || this.getAllTabs()[0], false);\n observer.unobserve(entries[0].target);\n }\n });\n observer.observe(this.host);\n this.resizeObserver = new ResizeObserver(() => this.updateScrollControls());\n this.resizeObserver.observe(this.nav);\n requestAnimationFrame(() => this.updateScrollControls());\n\n this.nav.addEventListener('scroll', () => {\n if (this.nav == null) {\n return;\n }\n this.hasRightControl = this.calculateRightControlVisibility();\n\n this.hasLeftControl = this.calculateLeftControlVisibility();\n });\n\n // Update aria labels if the DOM changes\n this.mutationObserver = new MutationObserver((mutations) => {\n if (\n mutations.some((mutation) => {\n return !['aria-labelledby', 'aria-controls'].includes(mutation.attributeName ?? '');\n })\n ) {\n setTimeout(() => this.setAriaLabels());\n }\n });\n this.mutationObserver.observe(this.host, { attributes: true, childList: true, subtree: true });\n }\n\n disconnectedCallback() {\n if (this.mutationObserver == null || this.tabGroup == null || this.nav == null || this.resizeObserver == null) {\n return;\n }\n this.mutationObserver.disconnect();\n this.resizeObserver.unobserve(this.nav);\n }\n\n /** Shows the specified tab panel. */\n @Method()\n async show(panel: string) {\n const tabs = this.getAllTabs();\n const tab = tabs.find((el) => el.panel === panel);\n\n if (tab != null) {\n this.setActiveTab(tab);\n }\n }\n\n private getAllTabs(includeDisabled = false): HTMLSixTabElement[] {\n const slot = this.tabs?.querySelector('slot');\n if (slot == null) return [];\n\n return [...slot.assignedElements()].filter((el: Element) => {\n return includeDisabled\n ? el.tagName.toLowerCase() === 'six-tab'\n : el.tagName.toLowerCase() === 'six-tab' && !(el as HTMLSixTabElement).disabled;\n }) as [HTMLSixTabElement];\n }\n\n private getAllPanels(): HTMLSixTabPanelElement[] {\n const slot = this.body?.querySelector('slot');\n if (slot == null) return [];\n return [...slot.assignedElements()].filter((el: Element) => el.tagName.toLowerCase() === 'six-tab-panel') as [\n HTMLSixTabPanelElement,\n ];\n }\n\n private getActiveTab() {\n return this.getAllTabs().find((el) => el.active);\n }\n\n private handleClick = (event: MouseEvent) => {\n const target = event.target as HTMLElement;\n const tab = target.closest('six-tab');\n const tabGroup = tab?.closest('six-tab-group');\n\n // Ensure the target tab is in this tab group\n if (tabGroup !== this.host) {\n return false;\n }\n\n if (tab != null) {\n this.setActiveTab(tab);\n }\n };\n\n private handleKeyDown = (event: KeyboardEvent) => {\n if (this.nav == null) return;\n\n const target = event.target as HTMLElement;\n const tab = target.closest('six-tab');\n const tabGroup = tab?.closest('six-tab-group');\n\n // Ensure the target tab is in this tab group\n if (tabGroup !== this.host) {\n return false;\n }\n\n // Move focus left or right\n if (['ArrowLeft', 'ArrowRight', 'ArrowUp', 'ArrowDown', 'Home', 'End'].includes(event.key)) {\n const activeEl = document.activeElement as HTMLSixTabElement;\n\n if (activeEl && activeEl.tagName.toLowerCase() === 'six-tab') {\n const tabs = this.getAllTabs();\n let index = tabs.indexOf(activeEl);\n\n if (event.key === 'Home') {\n index = 0;\n } else if (event.key === 'End') {\n index = tabs.length - 1;\n } else if (event.key === 'ArrowLeft') {\n index = Math.max(0, index - 1);\n } else if (event.key === 'ArrowRight') {\n index = Math.min(tabs.length - 1, index + 1);\n }\n\n tabs[index].setFocus({ preventScroll: true });\n this.setActiveTab(tabs[index]);\n\n if (['top', 'bottom'].includes(this.placement)) {\n scrollIntoView(tabs[index], this.nav, 'horizontal');\n }\n\n event.preventDefault();\n }\n }\n };\n\n private handleScrollLeft = () => {\n if (this.nav == null) return;\n\n this.nav.scroll({\n left: this.nav.scrollLeft - this.nav.clientWidth,\n behavior: 'smooth',\n });\n };\n\n private handleScrollRight = () => {\n if (this.nav == null) return;\n\n this.nav.scroll({\n left: this.nav.scrollLeft + this.nav.clientWidth,\n behavior: 'smooth',\n });\n };\n\n private calculateRightControlVisibility() {\n if (this.nav == null) {\n return false;\n }\n return Math.abs(this.nav?.scrollLeft) + this.nav?.clientWidth < this.nav?.scrollWidth - 1;\n }\n\n private calculateLeftControlVisibility() {\n if (this.nav == null) {\n return false;\n }\n return Math.abs(this.nav?.scrollLeft) > 0;\n }\n\n private updateScrollControls() {\n if (this.nav == null) return;\n\n this.hasRightControl = this.noScrollControls\n ? false\n : ['top', 'bottom'].includes(this.placement) && this.calculateRightControlVisibility();\n\n this.hasLeftControl = this.noScrollControls\n ? false\n : ['top', 'bottom'].includes(this.placement) && this.calculateLeftControlVisibility();\n }\n\n private setActiveTab(tab: HTMLSixTabElement, emitEvents = true) {\n if (this.nav == null) return;\n\n const newIndicator = tab?.shadowRoot?.querySelector('.tab__indicator');\n const oldIndicator = this.getActiveTab()?.shadowRoot?.querySelector('.tab__indicator');\n\n if (oldIndicator != null && newIndicator != null) {\n flipAnimate(newIndicator, oldIndicator);\n }\n\n if (tab !== this.activeTab && !tab.disabled) {\n const previousTab = this.activeTab;\n this.activeTab = tab;\n\n // Sync tabs and panels\n this.getAllTabs().map((el) => (el.active = el === this.activeTab));\n this.getAllPanels().map((el) => (el.active = el.name === this.activeTab?.panel));\n\n if (['top', 'bottom'].includes(this.placement)) {\n scrollIntoView(this.activeTab, this.nav, 'horizontal');\n }\n\n // Emit events\n if (emitEvents) {\n if (previousTab != null) {\n this.sixTabHide.emit({ name: previousTab.panel });\n }\n\n this.sixTabShow.emit({ name: this.activeTab.panel });\n }\n }\n }\n\n private setAriaLabels() {\n const tabs = this.getAllTabs();\n const panels = this.getAllPanels();\n\n // Link each tab with its corresponding panel\n tabs.map((tab) => {\n const panel = panels.find((el) => el.name === tab.panel);\n if (panel != null) {\n tab.setAttribute('aria-controls', panel.getAttribute('id') ?? '');\n panel.setAttribute('aria-labelledby', tab.getAttribute('id') ?? '');\n }\n });\n }\n\n render() {\n return (\n <div\n part=\"base\"\n ref={(el) => (this.tabGroup = el)}\n class={{\n 'tab-group': true,\n\n // Placements\n 'tab-group--top': this.placement === 'top',\n 'tab-group--bottom': this.placement === 'bottom',\n 'tab-group--left': this.placement === 'left',\n 'tab-group--right': this.placement === 'right',\n\n 'tab-group--has-scroll-controls': this.hasRightControl || this.hasLeftControl,\n }}\n onClick={this.handleClick}\n onKeyDown={this.handleKeyDown}\n >\n <div class=\"tab-group__nav-container\">\n {this.hasLeftControl && (\n <six-icon-button\n class=\"tab-group__scroll-button tab-group__scroll-button--left\"\n exportparts=\"base:scroll-button\"\n name=\"chevron_left\"\n onClick={this.handleScrollLeft}\n />\n )}\n <div ref={(el) => (this.nav = el)} key=\"nav\" part=\"nav\" class=\"tab-group__nav\">\n <div ref={(el) => (this.tabs = el)} part=\"tabs\" class=\"tab-group__tabs\" role=\"tablist\">\n <slot name=\"nav\" />\n </div>\n </div>\n {this.hasRightControl && (\n <six-icon-button\n class=\"tab-group__scroll-button tab-group__scroll-button--right\"\n exportparts=\"base:scroll-button\"\n name=\"chevron_right\"\n onClick={this.handleScrollRight}\n />\n )}\n </div>\n\n <div ref={(el) => (this.body = el)} part=\"body\" class=\"tab-group__body\">\n <slot />\n </div>\n </div>\n );\n }\n}\n"],"mappings":"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","ignoreList":[]}

package/dist/ui-library/p-3c1285ad.entry.js ADDED Viewed

	@@ -0,0 +1,2 @@
1	+ import{r as t,c as o,h as i,H as r,g as s}from"./p-JoG9I7EO.js";import{P as e}from"./p-kHci8ddv.js";const a=':host{position:relative;box-sizing:border-box}:host ,:host :before,:host *:after{box-sizing:border-box}.sr-only{clip:rect(0 0 0 0);clip-path:inset(50%);height:1px;overflow:hidden;position:absolute;white-space:nowrap;width:1px}:host{--max-width:20rem;--hide-delay:0s;--hide-duration:0.125s;--hide-timing-function:ease;--show-delay:0.125s;--show-duration:0.125s;--show-timing-function:ease;display:contents}.tooltip-positioner{position:fixed;z-index:var(--six-z-index-tooltip);pointer-events:none}.tooltip{max-width:var(--max-width);border-radius:var(--six-border-radius-medium);background-color:var(--six-tooltip-background-color);font-family:var(--six-font-family);font-size:var(--six-tooltip-font-size);font-weight:var(--six-tooltip-font-weight);line-height:var(--six-tooltip-line-height);color:var(--six-tooltip-color);opacity:0;padding:var(--six-spacing-xxx-small) var(--six-spacing-x-small);transform:scale(0.8);transform-origin:bottom;transition-property:opacity, transform;transition-delay:var(--hide-delay);transition-duration:var(--hide-duration);transition-timing-function:var(--hide-timing-function)}.tooltip::after{content:"";position:absolute;width:0;height:0}.tooltip-positioner[data-popper-placement^=top] .tooltip{transform-origin:bottom}.tooltip-positioner[data-popper-placement^=bottom] .tooltip{transform-origin:top}.tooltip-positioner[data-popper-placement^=left] .tooltip{transform-origin:right}.tooltip-positioner[data-popper-placement^=right] .tooltip{transform-origin:left}.tooltip-positioner.popover-visible .tooltip{opacity:1;transform:none;transition-delay:var(--show-delay);transition-duration:var(--show-duration);transition-timing-function:var(--show-timing-function)}.tooltip-positioner[data-popper-placement^=bottom] .tooltip::after{bottom:100%;left:calc(50% - var(--six-tooltip-arrow-size));border-bottom:var(--six-tooltip-arrow-size) solid var(--six-tooltip-background-color);border-left:var(--six-tooltip-arrow-size) solid transparent;border-right:var(--six-tooltip-arrow-size) solid transparent}.tooltip-positioner[data-popper-placement=bottom-start] .tooltip::after{left:var(--six-tooltip-arrow-start-end-offset)}.tooltip-positioner[data-popper-placement=bottom-end] .tooltip::after{right:var(--six-tooltip-arrow-start-end-offset);left:auto}.tooltip-positioner[data-popper-placement^=top] .tooltip::after{top:100%;left:calc(50% - var(--six-tooltip-arrow-size));border-top:var(--six-tooltip-arrow-size) solid var(--six-tooltip-background-color);border-left:var(--six-tooltip-arrow-size) solid transparent;border-right:var(--six-tooltip-arrow-size) solid transparent}.tooltip-positioner[data-popper-placement=top-start] .tooltip::after{left:var(--six-tooltip-arrow-start-end-offset)}.tooltip-positioner[data-popper-placement=top-end] .tooltip::after{right:var(--six-tooltip-arrow-start-end-offset);left:auto}.tooltip-positioner[data-popper-placement^=left] .tooltip::after{top:calc(50% - var(--six-tooltip-arrow-size));left:100%;border-left:var(--six-tooltip-arrow-size) solid var(--six-tooltip-background-color);border-top:var(--six-tooltip-arrow-size) solid transparent;border-bottom:var(--six-tooltip-arrow-size) solid transparent}.tooltip-positioner[data-popper-placement=left-start] .tooltip::after{top:var(--six-tooltip-arrow-start-end-offset)}.tooltip-positioner[data-popper-placement=left-end] .tooltip::after{top:auto;bottom:var(--six-tooltip-arrow-start-end-offset)}.tooltip-positioner[data-popper-placement^=right] .tooltip::after{top:calc(50% - var(--six-tooltip-arrow-size));right:100%;border-right:var(--six-tooltip-arrow-size) solid var(--six-tooltip-background-color);border-top:var(--six-tooltip-arrow-size) solid transparent;border-bottom:var(--six-tooltip-arrow-size) solid transparent}.tooltip-positioner[data-popper-placement=right-start] .tooltip::after{top:var(--six-tooltip-arrow-start-end-offset)}.tooltip-positioner[data-popper-placement=right-end] .tooltip::after{top:auto;bottom:var(--six-tooltip-arrow-start-end-offset)}';let p=0;const n=class{constructor(i){t(this,i);this.sixShow=o(this,"six-tooltip-show");this.sixAfterShow=o(this,"six-tooltip-after-show");this.sixHide=o(this,"six-tooltip-hide");this.sixAfterHide=o(this,"six-tooltip-after-hide");this.componentId=`tooltip-${++p}`;this.isVisible=false;this.content="";this.placement="top";this.disabled=false;this.distance=10;this.open=false;this.skidding=0;this.trigger="hover focus";this.handleBlur=()=>{if(this.hasTrigger("focus")){this.hide()}};this.handleClick=()=>{if(this.hasTrigger("click")){this.open?this.hide():this.show()}};this.handleFocus=()=>{if(this.hasTrigger("focus")){this.show()}};this.handleKeyDown=t=>{if(this.open&&t.key==="Escape"){t.stopPropagation();this.hide()}};this.handleMouseOver=()=>{if(this.hasTrigger("hover")){this.show()}};this.handleMouseOut=()=>{if(this.hasTrigger("hover")){this.hide()}};this.handleSlotChange=()=>{const t=this.target;const o=this.getTarget();if(o!==t){if(t!=null){t.removeAttribute("aria-describedby")}o.setAttribute("aria-describedby",this.componentId)}}}handleOpenChange(){this.open?this.show():this.hide()}componentDidLoad(){if(this.tooltipPositioner==null)return;this.target=this.getTarget();this.popoverHelper=new e(this.target,this.tooltipPositioner,{strategy:"fixed"});this.syncOptions();this.host.addEventListener("blur",this.handleBlur,true);this.host.addEventListener("click",this.handleClick,true);this.host.addEventListener("focus",this.handleFocus,true);this.tooltipPositioner.hidden=!this.open;if(this.open){this.show()}}componentDidUpdate(){this.syncOptions()}disconnectedCallback(){if(this.popoverHelper!=null){this.popoverHelper.destroy()}this.host.removeEventListener("blur",this.handleBlur,true);this.host.removeEventListener("click",this.handleClick,true);this.host.removeEventListener("focus",this.handleFocus,true)}async show(){var t;if(this.isVisible\|\|this.disabled){return}const o=this.sixShow.emit();if(o.defaultPrevented){this.open=false;return}this.isVisible=true;this.open=true;(t=this.popoverHelper)===null\|\|t===void 0?void 0:t.show()}async hide(){var t;if(!this.isVisible\|\|this.disabled){return}const o=this.sixHide.emit();if(o.defaultPrevented){this.open=true;return}this.isVisible=false;this.open=false;(t=this.popoverHelper)===null\|\|t===void 0?void 0:t.hide()}getTarget(){const t=[...this.host.children].find((t=>t.tagName.toLowerCase()!=="style"&&t.getAttribute("slot")!=="content"));if(t==null){throw new Error("Invalid tooltip target: no child element was found.")}return t}hasTrigger(t){const o=this.trigger.split(" ");return o.includes(t)}syncOptions(){if(this.popoverHelper==null)return;this.popoverHelper.setOptions({placement:this.placement,distance:this.distance,skidding:this.skidding,transitionElement:this.tooltip,onAfterHide:()=>this.sixAfterHide.emit(),onAfterShow:()=>this.sixAfterShow.emit()})}render(){return i(r,{key:"b0af2fbdb52310c71513aa84d92d3a280e41aaf9",onKeyDown:this.handleKeyDown,onMouseOver:this.handleMouseOver,onMouseOut:this.handleMouseOut},i("slot",{key:"819d560b1d211a091a625cd031d3b24b8c48746c",onSlotchange:this.handleSlotChange}),i("div",{key:"fdae79b137b1e736a178b53b4f4ba10259104315",ref:t=>this.tooltipPositioner=t,class:"tooltip-positioner"},i("div",{key:"7b5c975bfd60386d4223487658958f64c63eb11c",part:"base",ref:t=>this.tooltip=t,id:this.componentId,class:{tooltip:true,"tooltip--open":this.open},role:"tooltip","aria-hidden":this.open?"false":"true"},i("slot",{key:"ebe137a1e3306b9e66ff522fd6a4b1927340f399",name:"content"},this.content))))}get host(){return s(this)}static get watchers(){return{open:["handleOpenChange"]}}};n.style=a;export{n as six_tooltip};
2	+ //# sourceMappingURL=p-3c1285ad.entry.js.map

package/dist/ui-library/p-3c1285ad.entry.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"names":["sixTooltipCss","id","SixTooltip","constructor","hostRef","this","componentId","isVisible","content","placement","disabled","distance","open","skidding","trigger","handleBlur","hasTrigger","hide","handleClick","show","handleFocus","handleKeyDown","event","key","stopPropagation","handleMouseOver","handleMouseOut","handleSlotChange","oldTarget","target","newTarget","getTarget","removeAttribute","setAttribute","handleOpenChange","componentDidLoad","tooltipPositioner","popoverHelper","Popover","strategy","syncOptions","host","addEventListener","hidden","componentDidUpdate","disconnectedCallback","destroy","removeEventListener","sixShow","emit","defaultPrevented","_a","sixHide","children","find","el","tagName","toLowerCase","getAttribute","Error","triggerType","triggers","split","includes","setOptions","transitionElement","tooltip","onAfterHide","sixAfterHide","onAfterShow","sixAfterShow","render","h","Host","onKeyDown","onMouseOver","onMouseOut","onSlotchange","ref","class","part","role","name"],"sources":["src/components/six-tooltip/six-tooltip.scss?tag=six-tooltip&encapsulation=shadow","src/components/six-tooltip/six-tooltip.tsx"],"sourcesContent":["@import 'src/global/component';\n\n/**\n * @prop --hide-delay: The amount of time to wait before hiding the tooltip.\n * @prop --hide-duration: The amount of time the hide transition takes to complete.\n * @prop --hide-timing-function: The timing function (easing) to use for the hide transition.\n * @prop --max-width: The maximum width of the tooltip.\n * @prop --show-delay: The amount of time to wait before showing the tooltip.\n * @prop --show-duration: The amount of time the show transition takes to complete.\n * @prop --show-timing-function: The timing function (easing) to use for the show transition.\n */\n:host {\n --max-width: 20rem;\n --hide-delay: 0s;\n --hide-duration: 0.125s;\n --hide-timing-function: ease;\n --show-delay: 0.125s;\n --show-duration: 0.125s;\n --show-timing-function: ease;\n\n display: contents;\n}\n\n.tooltip-positioner {\n position: fixed;\n z-index: var(--six-z-index-tooltip);\n pointer-events: none;\n}\n\n.tooltip {\n max-width: var(--max-width);\n border-radius: var(--six-border-radius-medium);\n background-color: var(--six-tooltip-background-color);\n font-family: var(--six-font-family);\n font-size: var(--six-tooltip-font-size);\n font-weight: var(--six-tooltip-font-weight);\n line-height: var(--six-tooltip-line-height);\n color: var(--six-tooltip-color);\n opacity: 0;\n padding: var(--six-spacing-xxx-small) var(--six-spacing-x-small);\n transform: scale(0.8);\n transform-origin: bottom;\n transition-property: opacity, transform;\n transition-delay: var(--hide-delay);\n transition-duration: var(--hide-duration);\n transition-timing-function: var(--hide-timing-function);\n\n &::after {\n content: '';\n position: absolute;\n width: 0;\n height: 0;\n }\n}\n\n.tooltip-positioner {\n &[data-popper-placement^='top'] .tooltip {\n transform-origin: bottom;\n }\n\n &[data-popper-placement^='bottom'] .tooltip {\n transform-origin: top;\n }\n\n &[data-popper-placement^='left'] .tooltip {\n transform-origin: right;\n }\n\n &[data-popper-placement^='right'] .tooltip {\n transform-origin: left;\n }\n\n &.popover-visible .tooltip {\n opacity: 1;\n transform: none;\n transition-delay: var(--show-delay);\n transition-duration: var(--show-duration);\n transition-timing-function: var(--show-timing-function);\n }\n}\n\n// Arrow + bottom\n.tooltip-positioner[data-popper-placement^='bottom'] .tooltip::after {\n bottom: 100%;\n left: calc(50% - var(--six-tooltip-arrow-size));\n border-bottom: var(--six-tooltip-arrow-size) solid var(--six-tooltip-background-color);\n border-left: var(--six-tooltip-arrow-size) solid transparent;\n border-right: var(--six-tooltip-arrow-size) solid transparent;\n}\n\n.tooltip-positioner[data-popper-placement='bottom-start'] .tooltip::after {\n left: var(--six-tooltip-arrow-start-end-offset);\n}\n\n.tooltip-positioner[data-popper-placement='bottom-end'] .tooltip::after {\n right: var(--six-tooltip-arrow-start-end-offset);\n left: auto;\n}\n\n// Arrow + top\n.tooltip-positioner[data-popper-placement^='top'] .tooltip::after {\n top: 100%;\n left: calc(50% - var(--six-tooltip-arrow-size));\n border-top: var(--six-tooltip-arrow-size) solid var(--six-tooltip-background-color);\n border-left: var(--six-tooltip-arrow-size) solid transparent;\n border-right: var(--six-tooltip-arrow-size) solid transparent;\n}\n\n.tooltip-positioner[data-popper-placement='top-start'] .tooltip::after {\n left: var(--six-tooltip-arrow-start-end-offset);\n}\n\n.tooltip-positioner[data-popper-placement='top-end'] .tooltip::after {\n right: var(--six-tooltip-arrow-start-end-offset);\n left: auto;\n}\n\n// Arrow + left\n.tooltip-positioner[data-popper-placement^='left'] .tooltip::after {\n top: calc(50% - var(--six-tooltip-arrow-size));\n left: 100%;\n border-left: var(--six-tooltip-arrow-size) solid var(--six-tooltip-background-color);\n border-top: var(--six-tooltip-arrow-size) solid transparent;\n border-bottom: var(--six-tooltip-arrow-size) solid transparent;\n}\n\n.tooltip-positioner[data-popper-placement='left-start'] .tooltip::after {\n top: var(--six-tooltip-arrow-start-end-offset);\n}\n\n.tooltip-positioner[data-popper-placement='left-end'] .tooltip::after {\n top: auto;\n bottom: var(--six-tooltip-arrow-start-end-offset);\n}\n\n// Arrow + right\n.tooltip-positioner[data-popper-placement^='right'] .tooltip::after {\n top: calc(50% - var(--six-tooltip-arrow-size));\n right: 100%;\n border-right: var(--six-tooltip-arrow-size) solid var(--six-tooltip-background-color);\n border-top: var(--six-tooltip-arrow-size) solid transparent;\n border-bottom: var(--six-tooltip-arrow-size) solid transparent;\n}\n\n.tooltip-positioner[data-popper-placement='right-start'] .tooltip::after {\n top: var(--six-tooltip-arrow-start-end-offset);\n}\n\n.tooltip-positioner[data-popper-placement='right-end'] .tooltip::after {\n top: auto;\n bottom: var(--six-tooltip-arrow-start-end-offset);\n}\n","import { Component, Element, Event, EventEmitter, h, Host, Method, Prop, Watch } from '@stencil/core';\nimport Popover from '../../utils/popover';\nimport { EmptyPayload } from '../../utils/types';\n\nlet id = 0;\n\n/**\n * @since 1.0\n * @status stable\n *\n * Forked from https://github.com/shoelace-style/shoelace version v2.0.0-beta27.\n *\n * @slot - The tooltip's target element. Only the first element will be used as the target.\n * @slot content - The tooltip's content. Alternatively, you can use the content prop.\n *\n * @part base - The component's base wrapper.\n */\n\n@Component({\n tag: 'six-tooltip',\n styleUrl: 'six-tooltip.scss',\n shadow: true,\n})\nexport class SixTooltip {\n private componentId = `tooltip-${++id}`;\n private isVisible = false;\n private popoverHelper?: Popover;\n private tooltipPositioner?: HTMLElement;\n private target?: HTMLElement;\n private tooltip?: HTMLElement;\n\n @Element() host!: HTMLSixTooltipElement;\n\n /** The tooltip's content. Alternatively, you can use the content slot. */\n @Prop() content = '';\n\n /**\n * The preferred placement of the tooltip. Note that the actual placement may vary as needed to keep the tooltip\n * inside the viewport.\n */\n @Prop() placement:\n | 'top'\n | 'top-start'\n | 'top-end'\n | 'right'\n | 'right-start'\n | 'right-end'\n | 'bottom'\n | 'bottom-start'\n | 'bottom-end'\n | 'left'\n | 'left-start'\n | 'left-end' = 'top';\n\n /** Set to true to disable the tooltip, so it won't show when triggered. */\n @Prop() disabled = false;\n\n /** The distance in pixels from which to offset the tooltip away from its target. */\n @Prop() distance = 10;\n\n /** Indicates whether the tooltip is open. You can use this in lieu of the show/hide methods. */\n @Prop({ mutable: true, reflect: true }) open = false;\n\n /** The distance in pixels from which to offset the tooltip along its target. */\n @Prop() skidding = 0;\n\n /**\n * Controls how the tooltip is activated. Possible options include `click`, `hover`, `focus`, and `manual`. Multiple\n * options can be passed by separating them with a space. When manual is used, the tooltip must be activated\n * programmatically.\n */\n @Prop() trigger = 'hover focus';\n\n @Watch('open')\n handleOpenChange() {\n this.open ? this.show() : this.hide();\n }\n\n /** Emitted when the tooltip begins to show. Calling `event.preventDefault()` will prevent it from being shown. */\n @Event({ eventName: 'six-tooltip-show' }) sixShow!: EventEmitter<EmptyPayload>;\n\n /** Emitted after the tooltip has shown and all transitions are complete. */\n @Event({ eventName: 'six-tooltip-after-show' }) sixAfterShow!: EventEmitter<EmptyPayload>;\n\n /** Emitted when the tooltip begins to hide. Calling `event.preventDefault()` will prevent it from being hidden. */\n @Event({ eventName: 'six-tooltip-hide' }) sixHide!: EventEmitter<EmptyPayload>;\n\n /** Emitted after the tooltip has hidden and all transitions are complete. */\n @Event({ eventName: 'six-tooltip-after-hide' }) sixAfterHide!: EventEmitter<EmptyPayload>;\n\n componentDidLoad() {\n if (this.tooltipPositioner == null) return;\n this.target = this.getTarget();\n this.popoverHelper = new Popover(this.target, this.tooltipPositioner, { strategy: 'fixed' });\n this.syncOptions();\n\n this.host.addEventListener('blur', this.handleBlur, true);\n this.host.addEventListener('click', this.handleClick, true);\n this.host.addEventListener('focus', this.handleFocus, true);\n\n // Show on init if open\n this.tooltipPositioner.hidden = !this.open;\n if (this.open) {\n this.show();\n }\n }\n\n componentDidUpdate() {\n this.syncOptions();\n }\n\n disconnectedCallback() {\n if (this.popoverHelper != null) {\n this.popoverHelper.destroy();\n }\n\n this.host.removeEventListener('blur', this.handleBlur, true);\n this.host.removeEventListener('click', this.handleClick, true);\n this.host.removeEventListener('focus', this.handleFocus, true);\n }\n\n /** Shows the tooltip. */\n @Method()\n async show() {\n // Prevent subsequent calls to the method, whether manually or triggered by the `open` watcher\n if (this.isVisible || this.disabled) {\n return;\n }\n\n const sixShow = this.sixShow.emit();\n if (sixShow.defaultPrevented) {\n this.open = false;\n return;\n }\n\n this.isVisible = true;\n this.open = true;\n this.popoverHelper?.show();\n }\n\n /** Shows the tooltip. */\n @Method()\n async hide() {\n // Prevent subsequent calls to the method, whether manually or triggered by the `open` watcher\n if (!this.isVisible || this.disabled) {\n return;\n }\n\n const sixHide = this.sixHide.emit();\n if (sixHide.defaultPrevented) {\n this.open = true;\n return;\n }\n\n this.isVisible = false;\n this.open = false;\n this.popoverHelper?.hide();\n }\n\n private getTarget() {\n // Get the first child that isn't a <style> or content slot\n const target = [...this.host.children].find(\n (el) => el.tagName.toLowerCase() !== 'style' && el.getAttribute('slot') !== 'content'\n ) as HTMLElement;\n\n if (target == null) {\n throw new Error('Invalid tooltip target: no child element was found.');\n }\n\n return target;\n }\n\n private handleBlur = () => {\n if (this.hasTrigger('focus')) {\n this.hide();\n }\n };\n\n private handleClick = () => {\n if (this.hasTrigger('click')) {\n this.open ? this.hide() : this.show();\n }\n };\n\n private handleFocus = () => {\n if (this.hasTrigger('focus')) {\n this.show();\n }\n };\n\n private handleKeyDown = (event: KeyboardEvent) => {\n // Pressing escape when the target element has focus should dismiss the tooltip\n if (this.open && event.key === 'Escape') {\n event.stopPropagation();\n this.hide();\n }\n };\n\n private handleMouseOver = () => {\n if (this.hasTrigger('hover')) {\n this.show();\n }\n };\n\n private handleMouseOut = () => {\n if (this.hasTrigger('hover')) {\n this.hide();\n }\n };\n\n private handleSlotChange = () => {\n const oldTarget = this.target;\n const newTarget = this.getTarget();\n\n if (newTarget !== oldTarget) {\n if (oldTarget != null) {\n oldTarget.removeAttribute('aria-describedby');\n }\n newTarget.setAttribute('aria-describedby', this.componentId);\n }\n };\n\n private hasTrigger(triggerType: string) {\n const triggers = this.trigger.split(' ');\n return triggers.includes(triggerType);\n }\n\n private syncOptions() {\n if (this.popoverHelper == null) return;\n\n this.popoverHelper.setOptions({\n placement: this.placement,\n distance: this.distance,\n skidding: this.skidding,\n transitionElement: this.tooltip,\n onAfterHide: () => this.sixAfterHide.emit(),\n onAfterShow: () => this.sixAfterShow.emit(),\n });\n }\n\n render() {\n return (\n <Host onKeyDown={this.handleKeyDown} onMouseOver={this.handleMouseOver} onMouseOut={this.handleMouseOut}>\n <slot onSlotchange={this.handleSlotChange} />\n <div ref={(el) => (this.tooltipPositioner = el)} class=\"tooltip-positioner\">\n <div\n part=\"base\"\n ref={(el) => (this.tooltip = el)}\n id={this.componentId}\n class={{\n tooltip: true,\n 'tooltip--open': this.open,\n }}\n role=\"tooltip\"\n aria-hidden={this.open ? 'false' : 'true'}\n >\n <slot name=\"content\">{this.content}</slot>\n </div>\n </div>\n </Host>\n );\n }\n}\n"],"mappings":"oGAAA,MAAMA,EAAgB,o5HCItB,IAAIC,EAAK,E,MAmBIC,EAAU,MALvB,WAAAC,CAAAC,G,gMAMUC,KAAAC,YAAc,aAAaL,IAC3BI,KAASE,UAAG,MASZF,KAAOG,QAAG,GAMVH,KAASI,UAYA,MAGTJ,KAAQK,SAAG,MAGXL,KAAQM,SAAG,GAGqBN,KAAIO,KAAG,MAGvCP,KAAQQ,SAAG,EAOXR,KAAOS,QAAG,cAqGVT,KAAUU,WAAG,KACnB,GAAIV,KAAKW,WAAW,SAAU,CAC5BX,KAAKY,M,GAIDZ,KAAWa,YAAG,KACpB,GAAIb,KAAKW,WAAW,SAAU,CAC5BX,KAAKO,KAAOP,KAAKY,OAASZ,KAAKc,M,GAI3Bd,KAAWe,YAAG,KACpB,GAAIf,KAAKW,WAAW,SAAU,CAC5BX,KAAKc,M,GAIDd,KAAAgB,cAAiBC,IAEvB,GAAIjB,KAAKO,MAAQU,EAAMC,MAAQ,SAAU,CACvCD,EAAME,kBACNnB,KAAKY,M,GAIDZ,KAAeoB,gBAAG,KACxB,GAAIpB,KAAKW,WAAW,SAAU,CAC5BX,KAAKc,M,GAIDd,KAAcqB,eAAG,KACvB,GAAIrB,KAAKW,WAAW,SAAU,CAC5BX,KAAKY,M,GAIDZ,KAAgBsB,iBAAG,KACzB,MAAMC,EAAYvB,KAAKwB,OACvB,MAAMC,EAAYzB,KAAK0B,YAEvB,GAAID,IAAcF,EAAW,CAC3B,GAAIA,GAAa,KAAM,CACrBA,EAAUI,gBAAgB,mB,CAE5BF,EAAUG,aAAa,mBAAoB5B,KAAKC,Y,EA4CrD,CA5LC,gBAAA4B,GACE7B,KAAKO,KAAOP,KAAKc,OAASd,KAAKY,M,CAejC,gBAAAkB,GACE,GAAI9B,KAAK+B,mBAAqB,KAAM,OACpC/B,KAAKwB,OAASxB,KAAK0B,YACnB1B,KAAKgC,cAAgB,IAAIC,EAAQjC,KAAKwB,OAAQxB,KAAK+B,kBAAmB,CAAEG,SAAU,UAClFlC,KAAKmC,cAELnC,KAAKoC,KAAKC,iBAAiB,OAAQrC,KAAKU,WAAY,MACpDV,KAAKoC,KAAKC,iBAAiB,QAASrC,KAAKa,YAAa,MACtDb,KAAKoC,KAAKC,iBAAiB,QAASrC,KAAKe,YAAa,MAGtDf,KAAK+B,kBAAkBO,QAAUtC,KAAKO,KACtC,GAAIP,KAAKO,KAAM,CACbP,KAAKc,M,EAIT,kBAAAyB,GACEvC,KAAKmC,a,CAGP,oBAAAK,GACE,GAAIxC,KAAKgC,eAAiB,KAAM,CAC9BhC,KAAKgC,cAAcS,S,CAGrBzC,KAAKoC,KAAKM,oBAAoB,OAAQ1C,KAAKU,WAAY,MACvDV,KAAKoC,KAAKM,oBAAoB,QAAS1C,KAAKa,YAAa,MACzDb,KAAKoC,KAAKM,oBAAoB,QAAS1C,KAAKe,YAAa,K,CAK3D,UAAMD,G,MAEJ,GAAId,KAAKE,WAAaF,KAAKK,SAAU,CACnC,M,CAGF,MAAMsC,EAAU3C,KAAK2C,QAAQC,OAC7B,GAAID,EAAQE,iBAAkB,CAC5B7C,KAAKO,KAAO,MACZ,M,CAGFP,KAAKE,UAAY,KACjBF,KAAKO,KAAO,MACZuC,EAAA9C,KAAKgC,iBAAe,MAAAc,SAAA,SAAAA,EAAAhC,M,CAKtB,UAAMF,G,MAEJ,IAAKZ,KAAKE,WAAaF,KAAKK,SAAU,CACpC,M,CAGF,MAAM0C,EAAU/C,KAAK+C,QAAQH,OAC7B,GAAIG,EAAQF,iBAAkB,CAC5B7C,KAAKO,KAAO,KACZ,M,CAGFP,KAAKE,UAAY,MACjBF,KAAKO,KAAO,OACZuC,EAAA9C,KAAKgC,iBAAe,MAAAc,SAAA,SAAAA,EAAAlC,M,CAGd,SAAAc,GAEN,MAAMF,EAAS,IAAIxB,KAAKoC,KAAKY,UAAUC,MACpCC,GAAOA,EAAGC,QAAQC,gBAAkB,SAAWF,EAAGG,aAAa,UAAY,YAG9E,GAAI7B,GAAU,KAAM,CAClB,MAAM,IAAI8B,MAAM,sD,CAGlB,OAAO9B,C,CAqDD,UAAAb,CAAW4C,GACjB,MAAMC,EAAWxD,KAAKS,QAAQgD,MAAM,KACpC,OAAOD,EAASE,SAASH,E,CAGnB,WAAApB,GACN,GAAInC,KAAKgC,eAAiB,KAAM,OAEhChC,KAAKgC,cAAc2B,WAAW,CAC5BvD,UAAWJ,KAAKI,UAChBE,SAAUN,KAAKM,SACfE,SAAUR,KAAKQ,SACfoD,kBAAmB5D,KAAK6D,QACxBC,YAAa,IAAM9D,KAAK+D,aAAanB,OACrCoB,YAAa,IAAMhE,KAAKiE,aAAarB,Q,CAIzC,MAAAsB,GACE,OACEC,EAACC,EAAI,CAAAlD,IAAA,2CAACmD,UAAWrE,KAAKgB,cAAesD,YAAatE,KAAKoB,gBAAiBmD,WAAYvE,KAAKqB,gBACvF8C,EAAA,QAAAjD,IAAA,2CAAMsD,aAAcxE,KAAKsB,mBACzB6C,EAAA,OAAAjD,IAAA,2CAAKuD,IAAMvB,GAAQlD,KAAK+B,kBAAoBmB,EAAKwB,MAAM,sBACrDP,EACE,OAAAjD,IAAA,2CAAAyD,KAAK,OACLF,IAAMvB,GAAQlD,KAAK6D,QAAUX,EAC7BtD,GAAII,KAAKC,YACTyE,MAAO,CACLb,QAAS,KACT,gBAAiB7D,KAAKO,MAExBqE,KAAK,UAAS,cACD5E,KAAKO,KAAO,QAAU,QAEnC4D,EAAA,QAAAjD,IAAA,2CAAM2D,KAAK,WAAW7E,KAAKG,W","ignoreList":[]}

package/dist/ui-library/p-3d9e03b5.entry.js ADDED Viewed

	@@ -0,0 +1,2 @@
1	+ import{r as s,h as e}from"./p-JoG9I7EO.js";const o=":host{position:relative;box-sizing:border-box}:host ,:host :before,:host *:after{box-sizing:border-box}.sr-only{clip:rect(0 0 0 0);clip-path:inset(50%);height:1px;overflow:hidden;position:absolute;white-space:nowrap;width:1px}:host{display:block}.menu-label{font-family:var(--six-font-sans);font-size:var(--six-font-size-small);font-weight:var(--six-font-weight-normal);line-height:var(--six-line-height-normal);letter-spacing:var(--six-letter-spacing-normal);color:var(--six-input-label-color);padding:var(--six-spacing-xx-small) var(--six-spacing-small);user-select:none}";const i=class{constructor(e){s(this,e)}render(){return e("div",{key:"8d796cb82a38cccc46f32ff8ce33d453e7bb7166",part:"base",class:"menu-label"},e("slot",{key:"551f3905fa1d78d307912f1ba366b3718ae8facf"}))}};i.style=o;export{i as six_menu_label};
2	+ //# sourceMappingURL=p-3d9e03b5.entry.js.map

package/dist/ui-library/p-3d9e03b5.entry.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"names":["sixMenuLabelCss","SixMenuLabel","render","h","key","part","class"],"sources":["src/components/six-menu-label/six-menu-label.scss?tag=six-menu-label&encapsulation=shadow","src/components/six-menu-label/six-menu-label.tsx"],"sourcesContent":["@import 'src/global/component';\n\n:host {\n display: block;\n}\n\n.menu-label {\n font-family: var(--six-font-sans);\n font-size: var(--six-font-size-small);\n font-weight: var(--six-font-weight-normal);\n line-height: var(--six-line-height-normal);\n letter-spacing: var(--six-letter-spacing-normal);\n color: var(--six-input-label-color);\n padding: var(--six-spacing-xx-small) var(--six-spacing-small);\n user-select: none;\n}\n","import { Component, h } from '@stencil/core';\n\n/**\n * @since 1.0\n * @status stable\n *\n * Forked from https://github.com/shoelace-style/shoelace version v2.0.0-beta27.\n *\n * @slot - The menu label's content.\n *\n * @part base - The component's base wrapper.\n */\n\n@Component({\n tag: 'six-menu-label',\n styleUrl: 'six-menu-label.scss',\n shadow: true,\n})\nexport class SixMenuLabel {\n render() {\n return (\n <div part=\"base\" class=\"menu-label\">\n <slot />\n </div>\n );\n }\n}\n"],"mappings":"2CAAA,MAAMA,EAAkB,kkB,MCkBXC,EAAY,M,yBACvB,MAAAC,GACE,OACEC,EAAA,OAAAC,IAAA,2CAAKC,KAAK,OAAOC,MAAM,cACrBH,EAAQ,QAAAC,IAAA,6C","ignoreList":[]}

package/dist/ui-library/p-4152b371.entry.js ADDED Viewed

	@@ -0,0 +1,2 @@
1	+ import{r as s,c as i,h as e}from"./p-JoG9I7EO.js";import{D as t,a as h}from"./p-CKhg9ibv.js";import{E as a}from"./p-C4h4qpGl.js";const o=":host{position:relative;box-sizing:border-box}:host ,:host :before,:host *:after{box-sizing:border-box}.sr-only{clip:rect(0 0 0 0);clip-path:inset(50%);height:1px;overflow:hidden;position:absolute;white-space:nowrap;width:1px}:host{display:block}.search-box{z-index:var(--six-z-index-search-field)}.search-box__icon{cursor:pointer}";const r=class{constructor(e){s(this,e);this.searchFieldChange=i(this,"six-search-field-change");this.debounce=t;this.disabled=false;this.value="";this.clearable=false;this.eventListeners=new a;this.handleInputChange=()=>{if(this.inputElement!=null){this.searchFieldChange.emit({value:this.inputElement.value})}}}handleValueChange(){if(this.inputElement!=null){this.inputElement.value=this.value}}componentDidLoad(){if(this.inputElement==null)return;this.eventListeners.add(this.inputElement,"six-input-input",h(this.handleInputChange,this.debounce));this.eventListeners.add(this.inputElement,"keydown",(s=>{const i=s;if(i.key==="Enter"){this.handleInputChange()}}))}disconnectedCallback(){this.eventListeners.removeAll()}render(){return e("div",{key:"9172dbb88cc35be7390727842483a74241e1330f",class:"search-box"},e("six-input",{key:"44c1d20960202129a19cb412bb67823ac927ad98",ref:s=>this.inputElement=s,placeholder:this.placeholder,value:this.value,disabled:this.disabled,clearable:this.clearable},e("six-icon",{key:"af8431bd85223a37fee7e17d51288313c4494fed",class:"search-box__icon",slot:"prefix",size:"small",onClick:this.handleInputChange},"search")),e("slot",{key:"5d4f9bf280fc5fe215c268818b641753bb786869"}))}static get watchers(){return{value:["handleValueChange"]}}};r.style=o;export{r as six_search_field};
2	+ //# sourceMappingURL=p-4152b371.entry.js.map

package/dist/ui-library/p-4152b371.entry.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"names":["sixSearchFieldCss","SixSearchField","constructor","hostRef","this","debounce","DEFAULT_DEBOUNCE_FAST","disabled","value","clearable","eventListeners","EventListeners","handleInputChange","inputElement","searchFieldChange","emit","handleValueChange","componentDidLoad","add","event","keyboardEvent","key","disconnectedCallback","removeAll","render","h","class","ref","el","placeholder","slot","size","onClick"],"sources":["src/components/six-search-field/six-search-field.scss?tag=six-search-field&encapsulation=shadow","src/components/six-search-field/six-search-field.tsx"],"sourcesContent":["@import 'src/global/component';\n\n:host {\n display: block;\n}\n\n.search-box {\n z-index: var(--six-z-index-search-field);\n\n &__icon {\n cursor: pointer;\n }\n}\n","import { Component, Event, EventEmitter, h, Prop, Watch } from '@stencil/core';\nimport { debounce, DEFAULT_DEBOUNCE_FAST } from '../../utils/execution-control';\nimport { EventListeners } from '../../utils/event-listeners';\n\nexport interface SixSearchFieldChangePayload {\n value: string;\n}\n\n/**\n * @since 1.0\n * @status stable\n *\n * @slot - Used to define the results below the search component.\n */\n\n@Component({\n tag: 'six-search-field',\n styleUrl: 'six-search-field.scss',\n shadow: true,\n})\nexport class SixSearchField {\n /** The input's placeholder text. */\n @Prop() placeholder?: string;\n\n /** Debounce time in milliseconds, default is 300 ms */\n @Prop({ reflect: true }) debounce = DEFAULT_DEBOUNCE_FAST;\n\n /** Set to true to disable the input. */\n @Prop({ reflect: true }) disabled = false;\n\n /** The input's value attribute. */\n @Prop({ reflect: true }) value = '';\n\n /** Set to true to add a clear button when the input is populated. */\n @Prop() clearable = false;\n\n /** Emitted when a search is triggered */\n @Event({ eventName: 'six-search-field-change' }) searchFieldChange!: EventEmitter<SixSearchFieldChangePayload>;\n\n private inputElement?: HTMLSixInputElement;\n\n private eventListeners = new EventListeners();\n\n private handleInputChange = () => {\n if (this.inputElement != null) {\n this.searchFieldChange.emit({ value: this.inputElement.value });\n }\n };\n\n @Watch('value')\n handleValueChange() {\n if (this.inputElement != null) {\n this.inputElement.value = this.value;\n }\n }\n\n componentDidLoad() {\n if (this.inputElement == null) return;\n\n this.eventListeners.add(this.inputElement, 'six-input-input', debounce(this.handleInputChange, this.debounce));\n this.eventListeners.add(this.inputElement, 'keydown', (event: Event) => {\n const keyboardEvent = event as KeyboardEvent;\n if (keyboardEvent.key === 'Enter') {\n // emit immediately\n this.handleInputChange();\n }\n });\n }\n\n disconnectedCallback() {\n this.eventListeners.removeAll();\n }\n\n render() {\n return (\n <div class=\"search-box\">\n <six-input\n ref={(el) => (this.inputElement = el)}\n placeholder={this.placeholder}\n value={this.value}\n disabled={this.disabled}\n clearable={this.clearable}\n >\n <six-icon class=\"search-box__icon\" slot=\"prefix\" size=\"small\" onClick={this.handleInputChange}>\n search\n </six-icon>\n </six-input>\n <slot />\n </div>\n );\n }\n}\n"],"mappings":"iIAAA,MAAMA,EAAoB,gV,MCoBbC,EAAc,MAL3B,WAAAC,CAAAC,G,mEAU2BC,KAAQC,SAAGC,EAGXF,KAAQG,SAAG,MAGXH,KAAKI,MAAG,GAGzBJ,KAASK,UAAG,MAOZL,KAAAM,eAAiB,IAAIC,EAErBP,KAAiBQ,kBAAG,KAC1B,GAAIR,KAAKS,cAAgB,KAAM,CAC7BT,KAAKU,kBAAkBC,KAAK,CAAEP,MAAOJ,KAAKS,aAAaL,O,EA8C5D,CAzCC,iBAAAQ,GACE,GAAIZ,KAAKS,cAAgB,KAAM,CAC7BT,KAAKS,aAAaL,MAAQJ,KAAKI,K,EAInC,gBAAAS,GACE,GAAIb,KAAKS,cAAgB,KAAM,OAE/BT,KAAKM,eAAeQ,IAAId,KAAKS,aAAc,kBAAmBR,EAASD,KAAKQ,kBAAmBR,KAAKC,WACpGD,KAAKM,eAAeQ,IAAId,KAAKS,aAAc,WAAYM,IACrD,MAAMC,EAAgBD,EACtB,GAAIC,EAAcC,MAAQ,QAAS,CAEjCjB,KAAKQ,mB,KAKX,oBAAAU,GACElB,KAAKM,eAAea,W,CAGtB,MAAAC,GACE,OACEC,EAAA,OAAAJ,IAAA,2CAAKK,MAAM,cACTD,EAAA,aAAAJ,IAAA,2CACEM,IAAMC,GAAQxB,KAAKS,aAAee,EAClCC,YAAazB,KAAKyB,YAClBrB,MAAOJ,KAAKI,MACZD,SAAUH,KAAKG,SACfE,UAAWL,KAAKK,WAEhBgB,EAAA,YAAAJ,IAAA,2CAAUK,MAAM,mBAAmBI,KAAK,SAASC,KAAK,QAAQC,QAAS5B,KAAKQ,mBAAiB,WAI/Fa,EAAQ,QAAAJ,IAAA,6C","ignoreList":[]}

package/dist/ui-library/p-4d9785bd.entry.js ADDED Viewed

	@@ -0,0 +1,2 @@
1	+ import{r as e,h as i}from"./p-JoG9I7EO.js";const t=".six-error-page__title{display:flex;justify-content:center;font-size:var(--six-font-size-xx-large);font-weight:bold;margin-bottom:var(--six-spacing-large)}.six-error-page__description>*{text-align:center}.six-error-page__icon-container{display:flex;justify-content:center}.six-error-page__icon::part(icon){background-color:var(--six-color-web-rock-300)}";const r={403:{en:"Access Denied",de:"Kein Zugriff"},404:{en:"Not Found",de:"Seite nicht gefunden"},500:{en:"Ooops!",de:"Ups!"}};const n={403:{en:["You don’t have permission to access this page. ","Please contact an administrator or click the SIX logo on top left."],de:["Sie haben keine Zugriffsberechtigung auf diese Seite.","Bitte wenden Sie sich an einen Administrator oder klicken Sie auf das SIX-Logo oben links."]},404:{en:["We have not found the page you requested.","Please click the SIX logo on top left."],de:["Wir haben die angeforderte Seite nicht gefunden.","Bitte klicken Sie auf das SIX-Logo oben links."]},500:{en:["Sorry, we messed up! We try to fix this.","Please click the SIX logo on top left."],de:["Sorry, das war unser Fehler! Wir versuchen das zu beheben.","Bitte klicken Sie auf das SIX-Logo oben links."]}};const s=class{constructor(i){e(this,i);this.language="en"}getIconName(){if(this.customIcon!=null){return this.customIcon}if(this.errorCode==null){return}if(this.errorCode===403){return"lock"}if(this.errorCode===404){return"find-in-page"}if(this.errorCode===500){return"sentiment-dissatisfied"}}getErrorTitle(){if(this.customTitle!=null){return this.customTitle}if(this.errorCode==null){return}return r[this.errorCode][this.language]}getErrorDescription(){var e;if(this.errorCode==null&&this.customDescription==null){return}const t=(e=this.getDescriptions())!==null&&e!==void 0?e:[];return t.map((e=>i("div",null,e)))}getDescriptions(){if(this.customDescription!==undefined){return this.customDescription}if(this.errorCode==null){return}return n[this.errorCode][this.language]}render(){return i("div",{key:"b48ab908b37b2b4d6d6ee80b2d1f73038800a0dc",part:"container"},i("div",{key:"d0fd1370a7b3500a1bbf4a798d5d64b2a309fabf",class:"six-error-page__icon-container",part:"icon-container"},i("six-picto",{key:"88a00b48d434b687f270ee50e6506e23a21b0414",size:"4xl",class:"six-error-page__icon",part:"icon"},this.getIconName())),i("div",{key:"275010c6651665efd03f3a9b36b074d0b72a9111",class:"six-error-page__title",part:"title"},this.getErrorTitle()),i("div",{key:"efc23d90edea6ce0bc3843a704a4ffb788f84042",class:"six-error-page__description",part:"description"},this.getErrorDescription()))}};s.style=t;export{s as six_error_page};
2	+ //# sourceMappingURL=p-4d9785bd.entry.js.map

package/dist/ui-library/p-4d9785bd.entry.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"names":["sixErrorPageCss","TITLE_PER_ERROR_CODE","en","de","DESCRIPTION_PER_ERROR_CODE","SixErrorPage","constructor","hostRef","this","language","getIconName","customIcon","errorCode","getErrorTitle","customTitle","getErrorDescription","customDescription","descriptions","_a","getDescriptions","map","errorMessage","h","undefined","render","key","part","class","size"],"sources":["src/components/six-error-page/six-error-page.scss?tag=six-error-page&encapsulation=shadow","src/components/six-error-page/six-error-page.tsx"],"sourcesContent":[".six-error-page {\n &__title {\n display: flex;\n justify-content: center;\n font-size: var(--six-font-size-xx-large);\n font-weight: bold;\n margin-bottom: var(--six-spacing-large);\n }\n\n &__description {\n & > * {\n text-align: center;\n }\n }\n\n &__icon-container {\n display: flex;\n justify-content: center;\n }\n\n &__icon::part(icon) {\n background-color: var(--six-color-web-rock-300);\n }\n}\n","import { Component, h, Prop } from '@stencil/core';\n\ntype ErrorCode = 403 | 404 | 500;\n\nconst TITLE_PER_ERROR_CODE: Record<\n ErrorCode,\n {\n en: string;\n de: string;\n }\n> = {\n 403: {\n en: 'Access Denied',\n de: 'Kein Zugriff',\n },\n 404: {\n en: 'Not Found',\n de: 'Seite nicht gefunden',\n },\n 500: {\n en: 'Ooops!',\n de: 'Ups!',\n },\n};\n\nconst DESCRIPTION_PER_ERROR_CODE: Record<ErrorCode, { en: string[]; de: string[] }> = {\n 403: {\n en: [\n 'You don’t have permission to access this page. ',\n 'Please contact an administrator or click the SIX logo on top left.',\n ],\n de: [\n 'Sie haben keine Zugriffsberechtigung auf diese Seite.',\n 'Bitte wenden Sie sich an einen Administrator oder klicken Sie auf das SIX-Logo oben links.',\n ],\n },\n 404: {\n en: ['We have not found the page you requested.', 'Please click the SIX logo on top left.'],\n de: ['Wir haben die angeforderte Seite nicht gefunden.', 'Bitte klicken Sie auf das SIX-Logo oben links.'],\n },\n 500: {\n en: ['Sorry, we messed up! We try to fix this.', 'Please click the SIX logo on top left.'],\n de: [\n 'Sorry, das war unser Fehler! Wir versuchen das zu beheben.',\n 'Bitte klicken Sie auf das SIX-Logo oben links.',\n ],\n },\n};\n/*\n * @since 2.2.0\n * @status experimental\n * @part container - The whole component container\n * @part label - The language label\n * @part separator - The separator between the language labels\n */\n\n@Component({\n tag: 'six-error-page',\n styleUrl: 'six-error-page.scss',\n shadow: true,\n})\nexport class SixErrorPage {\n /**\n * Defines error Code and thus displays the proper error page.\n */\n @Prop() errorCode?: 404 | 403 | 500;\n\n /**\n * Defines language and thus displays the proper error page in the selected language.\n */\n @Prop() language: 'en' | 'de' = 'en';\n\n /**\n * Defines a custom title.\n */\n @Prop() customTitle?: string;\n\n /**\n * Defines a custom description.\n */\n @Prop() customDescription?: string[];\n\n /**\n * Defines a custom icon.\n */\n @Prop() customIcon?: string;\n\n private getIconName() {\n if (this.customIcon != null) {\n return this.customIcon;\n }\n\n if (this.errorCode == null) {\n return;\n }\n\n if (this.errorCode === 403) {\n return 'lock';\n }\n\n if (this.errorCode === 404) {\n return 'find-in-page';\n }\n\n if (this.errorCode === 500) {\n return 'sentiment-dissatisfied';\n }\n }\n\n private getErrorTitle(): string | undefined {\n if (this.customTitle != null) {\n return this.customTitle;\n }\n\n if (this.errorCode == null) {\n return;\n }\n\n return TITLE_PER_ERROR_CODE[this.errorCode][this.language];\n }\n\n private getErrorDescription() {\n if (this.errorCode == null && this.customDescription == null) {\n return;\n }\n\n const descriptions = this.getDescriptions() ?? [];\n return descriptions.map((errorMessage) => <div>{errorMessage}</div>);\n }\n\n private getDescriptions() {\n if (this.customDescription !== undefined) {\n return this.customDescription;\n }\n\n if (this.errorCode == null) {\n return;\n }\n\n return DESCRIPTION_PER_ERROR_CODE[this.errorCode][this.language];\n }\n\n render() {\n return (\n <div part=\"container\">\n <div class=\"six-error-page__icon-container\" part=\"icon-container\">\n <six-picto size=\"4xl\" class=\"six-error-page__icon\" part=\"icon\">\n {this.getIconName()}\n </six-picto>\n </div>\n <div class=\"six-error-page__title\" part=\"title\">\n {this.getErrorTitle()}\n </div>\n <div class=\"six-error-page__description\" part=\"description\">\n {this.getErrorDescription()}\n </div>\n </div>\n );\n }\n}\n"],"mappings":"2CAAA,MAAMA,EAAkB,oWCIxB,MAAMC,EAMF,CACF,IAAK,CACHC,GAAI,gBACJC,GAAI,gBAEN,IAAK,CACHD,GAAI,YACJC,GAAI,wBAEN,IAAK,CACHD,GAAI,SACJC,GAAI,SAIR,MAAMC,EAAgF,CACpF,IAAK,CACHF,GAAI,CACF,kDACA,sEAEFC,GAAI,CACF,wDACA,+FAGJ,IAAK,CACHD,GAAI,CAAC,4CAA6C,0CAClDC,GAAI,CAAC,mDAAoD,mDAE3D,IAAK,CACHD,GAAI,CAAC,2CAA4C,0CACjDC,GAAI,CACF,6DACA,oD,MAiBOE,EAAY,MALzB,WAAAC,CAAAC,G,UAcUC,KAAQC,SAAgB,IAyFjC,CAxES,WAAAC,GACN,GAAIF,KAAKG,YAAc,KAAM,CAC3B,OAAOH,KAAKG,U,CAGd,GAAIH,KAAKI,WAAa,KAAM,CAC1B,M,CAGF,GAAIJ,KAAKI,YAAc,IAAK,CAC1B,MAAO,M,CAGT,GAAIJ,KAAKI,YAAc,IAAK,CAC1B,MAAO,c,CAGT,GAAIJ,KAAKI,YAAc,IAAK,CAC1B,MAAO,wB,EAIH,aAAAC,GACN,GAAIL,KAAKM,aAAe,KAAM,CAC5B,OAAON,KAAKM,W,CAGd,GAAIN,KAAKI,WAAa,KAAM,CAC1B,M,CAGF,OAAOX,EAAqBO,KAAKI,WAAWJ,KAAKC,S,CAG3C,mBAAAM,G,MACN,GAAIP,KAAKI,WAAa,MAAQJ,KAAKQ,mBAAqB,KAAM,CAC5D,M,CAGF,MAAMC,GAAeC,EAAAV,KAAKW,qBAAqB,MAAAD,SAAA,EAAAA,EAAA,GAC/C,OAAOD,EAAaG,KAAKC,GAAiBC,EAAA,WAAMD,I,CAG1C,eAAAF,GACN,GAAIX,KAAKQ,oBAAsBO,UAAW,CACxC,OAAOf,KAAKQ,iB,CAGd,GAAIR,KAAKI,WAAa,KAAM,CAC1B,M,CAGF,OAAOR,EAA2BI,KAAKI,WAAWJ,KAAKC,S,CAGzD,MAAAe,GACE,OACEF,EAAA,OAAAG,IAAA,2CAAKC,KAAK,aACRJ,EAAA,OAAAG,IAAA,2CAAKE,MAAM,iCAAiCD,KAAK,kBAC/CJ,EAAA,aAAAG,IAAA,2CAAWG,KAAK,MAAMD,MAAM,uBAAuBD,KAAK,QACrDlB,KAAKE,gBAGVY,EAAA,OAAAG,IAAA,2CAAKE,MAAM,wBAAwBD,KAAK,SACrClB,KAAKK,iBAERS,EAAA,OAAAG,IAAA,2CAAKE,MAAM,8BAA8BD,KAAK,eAC3ClB,KAAKO,uB","ignoreList":[]}

package/dist/ui-library/p-4decf969.entry.js ADDED Viewed

	@@ -0,0 +1,2 @@
1	+ import{r as t,h as e,g as s}from"./p-JoG9I7EO.js";const r=":host{position:relative;box-sizing:border-box}:host ,:host :before,:host *:after{box-sizing:border-box}.sr-only{clip:rect(0 0 0 0);clip-path:inset(50%);height:1px;overflow:hidden;position:absolute;white-space:nowrap;width:1px}:host{display:block}:host nav{display:flex;align-items:center;flex-wrap:wrap}";const o=class{constructor(e){t(this,e);this.separatorIcon="";this.updateBreadcrumbItems=()=>{const t=[...this.host.querySelectorAll("six-breadcrumbs-item")];t.forEach(((e,s)=>{const r=e.querySelector('[slot="separator"]');if(r===null){e.append(this.createSeparatorElement())}else if(r.hasAttribute("data-default")){r.replaceWith(this.createSeparatorElement())}if(s===t.length-1){e.setAttribute("aria-current","page")}else{e.removeAttribute("aria-current")}}))}}createSeparatorElement(){const t=this.getCustomSeparator();console.log(t);if(t){const e=t.cloneNode(true);e.removeAttribute("id");e.setAttribute("data-default","");e.slot="separator";return e}const e=document.createElement("span");e.innerText="/";e.slot="separator";e.setAttribute("data-default","");return e}getCustomSeparator(){var t;if(Boolean((t=this.separatorIcon)===null\|\|t===void 0?void 0:t.length)){const t=document.createElement("six-icon");t.innerText=this.separatorIcon;t.setAttribute("size","small");return t}return Array.from(this.host.children).find((t=>t.getAttribute("slot")==="separator"))}render(){return e("host",{key:"71fcac983222825168006e795d3c7f8f887f2f66"},e("nav",{key:"76473724c4e4ca45650a5defcc9a4c8352311345",part:"base"},e("slot",{key:"6ec1262745d1b9507e6d612d3cf3a22c5e6859cd",onSlotchange:this.updateBreadcrumbItems})))}get host(){return s(this)}};o.style=r;export{o as six_breadcrumbs};
2	+ //# sourceMappingURL=p-4decf969.entry.js.map

package/dist/ui-library/p-4decf969.entry.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"names":["sixBreadcrumbsCss","SixBreadcrumbs","constructor","hostRef","this","separatorIcon","updateBreadcrumbItems","items","host","querySelectorAll","forEach","item","index","separator","querySelector","append","createSeparatorElement","hasAttribute","replaceWith","length","setAttribute","removeAttribute","customSeparator","getCustomSeparator","console","log","clone","cloneNode","slot","span","document","createElement","innerText","Boolean","_a","sixIcon","Array","from","children","find","child","getAttribute","render","h","key","part","onSlotchange"],"sources":["src/components/six-breadcrumbs/six-breadcrumbs.scss?tag=six-breadcrumbs&encapsulation=shadow","src/components/six-breadcrumbs/six-breadcrumbs.tsx"],"sourcesContent":["@import '../../../src/global/component';\n\n:host {\n display: block;\n nav {\n display: flex;\n align-items: center;\n flex-wrap: wrap;\n }\n}\n","import { Component, Element, h, Prop } from '@stencil/core';\n\n/**\n * Breadcrumbs provide a group of links so users can easily navigate a website's hierarchy.\n *\n * @since 5.0\n * @status beta\n *\n * @slot - One or more breadcrumb items to display.\n * @slot separator - The separator to use between breadcrumb items. Works best with six-icon.\n *\n * @part base - The component's base wrapper.\n */\n@Component({\n tag: 'six-breadcrumbs',\n styleUrl: 'six-breadcrumbs.scss',\n shadow: true,\n})\nexport class SixBreadcrumbs {\n @Element() host!: HTMLSixBreadcrumbsElement;\n\n /** Defines an icon as a separator without having to place a slot **/\n @Prop({ attribute: 'separator-icon', reflect: true }) separatorIcon: string = '';\n\n private updateBreadcrumbItems = () => {\n const items = [...this.host.querySelectorAll('six-breadcrumbs-item')] as HTMLSixBreadcrumbsItemElement[];\n\n items.forEach((item, index) => {\n // Append separators to each item if they don't already have one\n const separator = item.querySelector('[slot=\"separator\"]');\n if (separator === null) {\n // No separator exists, add one\n item.append(this.createSeparatorElement());\n } else if (separator.hasAttribute('data-default')) {\n // A default separator exists, replace it\n separator.replaceWith(this.createSeparatorElement());\n }\n\n // The last breadcrumb item is the \"current page\"\n if (index === items.length - 1) {\n item.setAttribute('aria-current', 'page');\n } else {\n item.removeAttribute('aria-current');\n }\n });\n };\n\n private createSeparatorElement(): HTMLElement {\n // Find a custom separator by checking direct children only\n const customSeparator = this.getCustomSeparator();\n console.log(customSeparator);\n if (customSeparator) {\n const clone = customSeparator.cloneNode(true) as HTMLElement;\n clone.removeAttribute('id');\n clone.setAttribute('data-default', '');\n clone.slot = 'separator';\n return clone;\n }\n\n // Create default separator element\n const span = document.createElement('span');\n span.innerText = '/';\n span.slot = 'separator';\n span.setAttribute('data-default', '');\n return span;\n }\n\n private getCustomSeparator() {\n if (Boolean(this.separatorIcon?.length)) {\n const sixIcon = document.createElement('six-icon');\n sixIcon.innerText = this.separatorIcon;\n sixIcon.setAttribute('size', 'small');\n return sixIcon;\n }\n return Array.from(this.host.children).find((child) => child.getAttribute('slot') === 'separator');\n }\n\n render() {\n return (\n <host>\n <nav part=\"base\">\n <slot onSlotchange={this.updateBreadcrumbItems} />\n </nav>\n </host>\n );\n }\n}\n"],"mappings":"kDAAA,MAAMA,EAAoB,oT,MCkBbC,EAAc,MAL3B,WAAAC,CAAAC,G,UASwDC,KAAaC,cAAW,GAEtED,KAAqBE,sBAAG,KAC9B,MAAMC,EAAQ,IAAIH,KAAKI,KAAKC,iBAAiB,yBAE7CF,EAAMG,SAAQ,CAACC,EAAMC,KAEnB,MAAMC,EAAYF,EAAKG,cAAc,sBACrC,GAAID,IAAc,KAAM,CAEtBF,EAAKI,OAAOX,KAAKY,yB,MACZ,GAAIH,EAAUI,aAAa,gBAAiB,CAEjDJ,EAAUK,YAAYd,KAAKY,yB,CAI7B,GAAIJ,IAAUL,EAAMY,OAAS,EAAG,CAC9BR,EAAKS,aAAa,eAAgB,O,KAC7B,CACLT,EAAKU,gBAAgB,e,IAEvB,CA0CL,CAvCS,sBAAAL,GAEN,MAAMM,EAAkBlB,KAAKmB,qBAC7BC,QAAQC,IAAIH,GACZ,GAAIA,EAAiB,CACnB,MAAMI,EAAQJ,EAAgBK,UAAU,MACxCD,EAAML,gBAAgB,MACtBK,EAAMN,aAAa,eAAgB,IACnCM,EAAME,KAAO,YACb,OAAOF,C,CAIT,MAAMG,EAAOC,SAASC,cAAc,QACpCF,EAAKG,UAAY,IACjBH,EAAKD,KAAO,YACZC,EAAKT,aAAa,eAAgB,IAClC,OAAOS,C,CAGD,kBAAAN,G,MACN,GAAIU,SAAQC,EAAA9B,KAAKC,iBAAe,MAAA6B,SAAA,SAAAA,EAAAf,QAAS,CACvC,MAAMgB,EAAUL,SAASC,cAAc,YACvCI,EAAQH,UAAY5B,KAAKC,cACzB8B,EAAQf,aAAa,OAAQ,SAC7B,OAAOe,C,CAET,OAAOC,MAAMC,KAAKjC,KAAKI,KAAK8B,UAAUC,MAAMC,GAAUA,EAAMC,aAAa,UAAY,a,CAGvF,MAAAC,GACE,OACEC,EAAA,QAAAC,IAAA,4CACED,EAAK,OAAAC,IAAA,2CAAAC,KAAK,QACRF,EAAM,QAAAC,IAAA,2CAAAE,aAAc1C,KAAKE,yB","ignoreList":[]}

package/dist/ui-library/p-54490d28.entry.js ADDED Viewed

	@@ -0,0 +1,2 @@
1	+ import{r as e,c as s,h as a}from"./p-JoG9I7EO.js";const t=".language-switcher__container{display:flex}.language-switcher__separator{padding:0 0.25rem}.language-switcher__label{cursor:pointer}.language-switcher__label:hover{color:var(--six-color-web-rock-600)}.language-switcher__label:focus-visible{outline:var(--six-focus-ring);outline-offset:var(--six-focus-ring-offset)}.language-switcher__label--selected{color:var(--six-color-black);text-decoration:underline}";const i=["EN","DE","ES"];const r=class{constructor(a){e(this,a);this.sixChange=s(this,"six-language-switcher-change");this.languages=i;this.handleLanguageSwitching=(e,s)=>()=>{if(s!==undefined){this.sixChange.emit(s)}else{this.sixChange.emit(e)}this.selected=e}}handleChangesLanguages(e){if(!Array.isArray(e)){throw new Error("languages is expected to be an array")}this.updateSelectedLanguage()}componentWillLoad(){if(this.selected===undefined){this.updateSelectedLanguage()}}updateSelectedLanguage(){const e=this.languages[0];if(typeof e==="string"){this.selected=e;this.sixChange.emit(this.selected)}else{this.selected=e.key;this.sixChange.emit(e.value)}}render(){return a("div",{key:"4e324d4503e9d65278e4b3c55025363a685d9a69",part:"container",class:"language-switcher__container"},this.languages.map(((e,s)=>{const t=typeof e==="string"?e:e.key;return a("div",{onClick:this.handleLanguageSwitching(t,typeof e==="string"?e:e.value),onKeyDown:s=>{if(s.key==="Enter"\|\|s.key===" "){this.handleLanguageSwitching(t,typeof e==="string"?e:e.value)()}}},a("span",{part:"label",tabindex:"0",class:{"language-switcher__label":true,"language-switcher__label--selected":this.selected===t}},t),s<this.languages.length-1&&a("span",{part:"separator",class:"language-switcher__separator"},"\|"))})))}static get watchers(){return{languages:["handleChangesLanguages"]}}};r.style=t;export{r as six_language_switcher};
2	+ //# sourceMappingURL=p-54490d28.entry.js.map

package/dist/ui-library/p-54490d28.entry.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"names":["sixLanguageSwitcherCss","DEFAULT_LANGUAGES","SixLanguageSwitcher","constructor","hostRef","this","languages","handleLanguageSwitching","newLanguage","languageValue","undefined","sixChange","emit","selected","handleChangesLanguages","newValue","Array","isArray","Error","updateSelectedLanguage","componentWillLoad","selectedLanguage","key","value","render","h","part","class","map","lang","index","language","onClick","onKeyDown","e","tabindex","length"],"sources":["src/components/six-language-switcher/six-language-switcher.scss?tag=six-language-switcher&encapsulation=shadow","src/components/six-language-switcher/six-language-switcher.tsx"],"sourcesContent":[".language-switcher {\n &__container {\n display: flex;\n }\n\n &__separator {\n padding: 0 0.25rem;\n }\n\n &__label {\n cursor: pointer;\n\n &:hover {\n color: var(--six-color-web-rock-600);\n }\n\n &:focus-visible {\n outline: var(--six-focus-ring);\n outline-offset: var(--six-focus-ring-offset);\n }\n\n &--selected {\n color: var(--six-color-black);\n text-decoration: underline;\n }\n }\n}\n","import { Component, Event, EventEmitter, h, Prop, Watch } from '@stencil/core';\n\n/**\n * @since 2.1.0\n * @status experimental\n **/\n\nexport interface SixLanguageSwitcherInput {\n key: string;\n value: string;\n}\nexport type SixLanguageSwitcherChangePayload = string;\n\nconst DEFAULT_LANGUAGES = ['EN', 'DE', 'ES'];\n\n/*\n * @since 2.2.0\n * @status experimental\n * @part container - The whole component container\n * @part label - The language label\n * @part separator - The separator between the language labels\n */\n@Component({\n tag: 'six-language-switcher',\n styleUrl: 'six-language-switcher.scss',\n shadow: true,\n})\nexport class SixLanguageSwitcher {\n /** The language which should be shown as selected */\n @Prop({ mutable: true, reflect: true }) selected?: string;\n\n /** The languages which should be selectable options. */\n @Prop() languages: string[] | SixLanguageSwitcherInput[] = DEFAULT_LANGUAGES;\n\n @Watch('languages')\n handleChangesLanguages(newValue: string[]) {\n if (!Array.isArray(newValue)) {\n throw new Error('languages is expected to be an array');\n }\n\n this.updateSelectedLanguage();\n }\n /**\n * Emitted when the language switchers value changes\n */\n @Event({ eventName: 'six-language-switcher-change' }) sixChange!: EventEmitter<SixLanguageSwitcherChangePayload>;\n\n componentWillLoad() {\n if (this.selected === undefined) {\n this.updateSelectedLanguage();\n }\n }\n\n private updateSelectedLanguage() {\n const selectedLanguage = this.languages[0];\n if (typeof selectedLanguage === 'string') {\n this.selected = selectedLanguage;\n this.sixChange.emit(this.selected);\n } else {\n this.selected = selectedLanguage.key;\n this.sixChange.emit(selectedLanguage.value);\n }\n }\n\n private handleLanguageSwitching = (newLanguage: string, languageValue?: string) => () => {\n if (languageValue !== undefined) {\n this.sixChange.emit(languageValue);\n } else {\n this.sixChange.emit(newLanguage);\n }\n this.selected = newLanguage;\n };\n\n render() {\n return (\n <div part=\"container\" class=\"language-switcher__container\">\n {this.languages.map((lang, index) => {\n const language = typeof lang === 'string' ? lang : lang.key;\n return (\n <div\n onClick={this.handleLanguageSwitching(language, typeof lang === 'string' ? lang : lang.value)}\n onKeyDown={(e) => {\n if (e.key === 'Enter' || e.key === ' ') {\n this.handleLanguageSwitching(language, typeof lang === 'string' ? lang : lang.value)();\n }\n }}\n >\n <span\n part=\"label\"\n tabindex=\"0\"\n class={{\n 'language-switcher__label': true,\n 'language-switcher__label--selected': this.selected === language,\n }}\n >\n {language}\n </span>\n\n {index < this.languages.length - 1 && (\n <span part=\"separator\" class=\"language-switcher__separator\">\n |\n </span>\n )}\n </div>\n );\n })}\n </div>\n );\n }\n}\n"],"mappings":"kDAAA,MAAMA,EAAyB,wZCa/B,MAAMC,EAAoB,CAAC,KAAM,KAAM,M,MAc1BC,EAAmB,MALhC,WAAAC,CAAAC,G,gEAUUC,KAASC,UAA0CL,EAgCnDI,KAAuBE,wBAAG,CAACC,EAAqBC,IAA2B,KACjF,GAAIA,IAAkBC,UAAW,CAC/BL,KAAKM,UAAUC,KAAKH,E,KACf,CACLJ,KAAKM,UAAUC,KAAKJ,E,CAEtBH,KAAKQ,SAAWL,CAAW,CAuC9B,CA1EC,sBAAAM,CAAuBC,GACrB,IAAKC,MAAMC,QAAQF,GAAW,CAC5B,MAAM,IAAIG,MAAM,uC,CAGlBb,KAAKc,wB,CAOP,iBAAAC,GACE,GAAIf,KAAKQ,WAAaH,UAAW,CAC/BL,KAAKc,wB,EAID,sBAAAA,GACN,MAAME,EAAmBhB,KAAKC,UAAU,GACxC,UAAWe,IAAqB,SAAU,CACxChB,KAAKQ,SAAWQ,EAChBhB,KAAKM,UAAUC,KAAKP,KAAKQ,S,KACpB,CACLR,KAAKQ,SAAWQ,EAAiBC,IACjCjB,KAAKM,UAAUC,KAAKS,EAAiBE,M,EAazC,MAAAC,GACE,OACEC,EAAA,OAAAH,IAAA,2CAAKI,KAAK,YAAYC,MAAM,gCACzBtB,KAAKC,UAAUsB,KAAI,CAACC,EAAMC,KACzB,MAAMC,SAAkBF,IAAS,SAAWA,EAAOA,EAAKP,IACxD,OACEG,EAAA,OACEO,QAAS3B,KAAKE,wBAAwBwB,SAAiBF,IAAS,SAAWA,EAAOA,EAAKN,OACvFU,UAAYC,IACV,GAAIA,EAAEZ,MAAQ,SAAWY,EAAEZ,MAAQ,IAAK,CACtCjB,KAAKE,wBAAwBwB,SAAiBF,IAAS,SAAWA,EAAOA,EAAKN,MAA9ElB,E,IAIJoB,EACE,QAAAC,KAAK,QACLS,SAAS,IACTR,MAAO,CACL,2BAA4B,KAC5B,qCAAsCtB,KAAKQ,WAAakB,IAGzDA,GAGFD,EAAQzB,KAAKC,UAAU8B,OAAS,GAC/BX,EAAA,QAAMC,KAAK,YAAYC,MAAM,gCAEtB,KAEL,I","ignoreList":[]}

package/dist/ui-library/p-56e172e0.entry.js ADDED Viewed

	@@ -0,0 +1,2 @@
1	+ import{r as t,c as e,h as i,g as r}from"./p-JoG9I7EO.js";import{u as a,l as s}from"./p-BY6hIEFX.js";import{h as o}from"./p-j3oIB5oT.js";import{M as n}from"./p-CfIoyvm-.js";import{a as h}from"./p-SLlDVtvF.js";const l=":host{position:relative;box-sizing:border-box}:host ,:host :before,:host *:after{box-sizing:border-box}.sr-only{clip:rect(0 0 0 0);clip-path:inset(50%);height:1px;overflow:hidden;position:absolute;white-space:nowrap;width:1px}:host{--size:25rem;display:contents}.drawer{top:0;left:0;width:100%;height:100%;pointer-events:none;overflow:hidden}.drawer:not(.drawer--visible){position:absolute;width:1px;height:1px;clip:rect(0 0 0 0);clip-path:inset(50%);overflow:hidden;pointer-events:none;visibility:hidden}.drawer--contained{position:absolute;z-index:initial}.drawer--fixed{position:fixed;z-index:var(--six-z-index-drawer)}.drawer__panel{position:absolute;display:flex;flex-direction:column;z-index:2;max-width:100%;max-height:100%;background-color:var(--six-drawer-background-color);color:var(--six-drawer-color);box-shadow:var(--six-shadow-large);transition:var(--six-transition-medium) transform;overflow:auto;pointer-events:all}.drawer__panel:focus{outline:none}.drawer--top .drawer__panel{top:0;right:auto;bottom:auto;left:0;width:100%;height:var(--size);transform:translate(0, -100%)}.drawer--right .drawer__panel{top:0;right:0;bottom:auto;left:auto;width:var(--size);height:100%;transform:translate(100%, 0)}.drawer--bottom .drawer__panel{top:auto;right:auto;bottom:0;left:0;width:100%;height:var(--size);transform:translate(0, 100%)}.drawer--left .drawer__panel{top:0;right:auto;bottom:auto;left:0;width:var(--size);height:100%;transform:translate(-100%, 0)}.drawer--open .drawer__panel{transform:none}.drawer__header{display:flex}.drawer__title{flex:1 1 auto;font-size:var(--six-font-size-large);line-height:var(--six-line-height-dense);padding:var(--six-spacing-large)}.drawer__close{flex:0 0 auto;display:flex;align-items:center;font-size:var(--six-font-size-x-large);padding:0 var(--six-spacing-large)}.drawer__body{flex:1 1 auto;padding:var(--six-spacing-large);overflow:auto;-webkit-overflow-scrolling:touch}.drawer__footer{text-align:right;padding:var(--six-spacing-large)}.drawer__footer ::slotted(six-button:not(:last-of-type)){margin-right:var(--six-spacing-x-small)}.drawer:not(.drawer--has-footer) .drawer__footer{display:none}.drawer__overlay{display:block;position:fixed;top:0;right:0;bottom:0;left:0;background-color:var(--six-overlay-background-color);opacity:0;transition:var(--six-transition-medium) opacity;pointer-events:all}.drawer--contained .drawer__overlay{position:absolute}.drawer--open .drawer__overlay{opacity:0.4}";let d=0;const c=class{constructor(i){t(this,i);this.sixShow=e(this,"six-drawer-show");this.sixAfterShow=e(this,"six-drawer-after-show");this.sixHide=e(this,"six-drawer-hide");this.sixAfterHide=e(this,"six-drawer-after-hide");this.sixInitialFocus=e(this,"six-drawer-initial-focus");this.sixRequestClose=e(this,"six-drawer-request-close");this.componentId=`drawer-${++d}`;this.willShow=false;this.willHide=false;this.hasFooter=false;this.isVisible=false;this.open=false;this.label="";this.placement="right";this.contained=false;this.noHeader=false;this.handleCloseClick=()=>{this.preventClose("close-button")};this.handleKeyDown=t=>{if(t.key==="Escape"){this.preventClose("keyboard")}};this.handleOverlayClick=()=>{this.preventClose("overlay")};this.handleSlotChange=()=>{this.hasFooter=o(this.host,"footer")};this.handleTransitionEnd=t=>{const e=t.target;if(t.propertyName==="transform"&&e.classList.contains("drawer__panel")){this.resetTransitionVariables()}}}handleOpenChange(){this.open?this.show():this.hide()}connectedCallback(){this.modal=new n(this.host,{onFocusOut:()=>{var t;return this.contained?null:(t=this.panel)===null\|\|t===void 0?void 0:t.focus()}})}componentWillLoad(){this.handleSlotChange();if(this.open){this.show();this.resetTransitionVariables()}}disconnectedCallback(){a(this.host)}async show(){if(this.willShow\|\|this.modal==null\|\|this.panel==null\|\|this.drawer==null){return}const t=this.panel;const e=this.sixShow.emit();if(e.defaultPrevented){this.open=false;return}this.willShow=true;this.isVisible=true;this.open=true;if(!this.contained){this.modal.activate();s(this.host)}if(this.open){requestAnimationFrame((()=>{const e=this.sixInitialFocus.emit();if(!e.defaultPrevented){t.focus({preventScroll:true})}}))}}async hide(){if(this.willHide\|\|this.modal==null){return}const t=this.sixHide.emit();if(t.defaultPrevented){this.open=true;return}this.willHide=true;this.open=false;this.modal.deactivate();a(this.host)}preventClose(t){const e=this.sixRequestClose.emit({source:t});if(e.defaultPrevented&&this.panel){h(this.panel,[{scale:1},{scale:1.01},{scale:1}],{duration:250});return}this.hide()}resetTransitionVariables(){this.isVisible=this.open;this.willShow=false;this.willHide=false;this.open?this.sixAfterShow.emit():this.sixAfterHide.emit()}render(){return i("div",{key:"17d045e1a06aa424bc59f7316525df73ae031227",ref:t=>this.drawer=t,part:"base",class:{drawer:true,"drawer--open":this.open,"drawer--visible":this.isVisible,"drawer--top":this.placement==="top","drawer--right":this.placement==="right","drawer--bottom":this.placement==="bottom","drawer--left":this.placement==="left","drawer--contained":this.contained,"drawer--fixed":!this.contained,"drawer--has-footer":this.hasFooter},onKeyDown:this.handleKeyDown,onTransitionEnd:this.handleTransitionEnd},i("div",{key:"804fcb75cc49156bfcb6af8958a40c33c20f8202",part:"overlay",class:"drawer__overlay",onClick:this.handleOverlayClick,tabIndex:-1}),i("div",{key:"e5095b200d370fe98163b3f0fa2bbf42ece7fa5f",ref:t=>this.panel=t,part:"panel",class:"drawer__panel",role:"dialog","aria-modal":"true","aria-hidden":this.open?"false":"true","aria-label":this.noHeader?this.label:null,"aria-labelledby":!this.noHeader?`${this.componentId}-title`:null,tabIndex:0},!this.noHeader&&i("header",{key:"c479cfa062277a6f1cf0f7433cff73e94139faea",part:"header",class:"drawer__header"},i("span",{key:"8d60e0eb1cecc9c8f2091b5b8c9aefaa2aac3c91",part:"title",class:"drawer__title",id:`${this.componentId}-title`},i("slot",{key:"26c5fb0feb42c9db7625e98f10cd5cbd0acfd742",name:"label"},this.label\|\|String.fromCharCode(65279))),i("six-icon-button",{key:"454ee7cea511b470ae224c6559ee99f10e9cf095",exportparts:"base:close-button",class:"drawer__close",name:"close",onClick:this.handleCloseClick})),i("div",{key:"4f07be9128e7d2a292298b3e22ec0e5105adc3f3",part:"body",class:"drawer__body"},i("slot",{key:"856a4bd2ee8dacc8b6124d87d8e501a8bd8c3f23"})),i("footer",{key:"721ca11e6b5470d2170d9bc929ba2d973faf9117",part:"footer",class:"drawer__footer"},i("slot",{key:"afb8d35c7fee0fa3e9833ea1b381c2d81f8cb5b0",name:"footer",onSlotchange:this.handleSlotChange}))))}get host(){return r(this)}static get watchers(){return{open:["handleOpenChange"]}}};c.style=l;export{c as six_drawer};
2	+ //# sourceMappingURL=p-56e172e0.entry.js.map

package/dist/ui-library/p-56e172e0.entry.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"names":["sixDrawerCss","id","SixDrawer","constructor","hostRef","this","componentId","willShow","willHide","hasFooter","isVisible","open","label","placement","contained","noHeader","handleCloseClick","preventClose","handleKeyDown","event","key","handleOverlayClick","handleSlotChange","hasSlot","host","handleTransitionEnd","target","propertyName","classList","contains","resetTransitionVariables","handleOpenChange","show","hide","connectedCallback","modal","Modal","onFocusOut","_a","panel","focus","componentWillLoad","disconnectedCallback","unlockBodyScrolling","drawer","sixShow","emit","defaultPrevented","activate","lockBodyScrolling","requestAnimationFrame","sixInitialFocus","preventScroll","sixHide","deactivate","source","sixRequestClose","animateTo","scale","duration","sixAfterShow","sixAfterHide","render","h","ref","el","part","class","onKeyDown","onTransitionEnd","onClick","tabIndex","role","name","String","fromCharCode","exportparts","onSlotchange"],"sources":["src/components/six-drawer/six-drawer.scss?tag=six-drawer&encapsulation=shadow","src/components/six-drawer/six-drawer.tsx"],"sourcesContent":["@import 'src/global/component';\n@import 'src/global/mixins/hidden';\n\n/**\n * @prop --size: The preferred size of the drawer. This will be applied to the drawer's width or height depending on its\n * `placement`. Note that the drawer will shrink to accommodate smaller screens.\n */\n:host {\n --size: 25rem;\n\n display: contents;\n}\n\n.drawer {\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n pointer-events: none;\n overflow: hidden;\n\n &:not(.drawer--visible) {\n @include hidden;\n }\n}\n\n.drawer--contained {\n position: absolute;\n z-index: initial;\n}\n\n.drawer--fixed {\n position: fixed;\n z-index: var(--six-z-index-drawer);\n}\n\n.drawer__panel {\n position: absolute;\n display: flex;\n flex-direction: column;\n z-index: 2;\n max-width: 100%;\n max-height: 100%;\n background-color: var(--six-drawer-background-color);\n color: var(--six-drawer-color);\n box-shadow: var(--six-shadow-large);\n transition: var(--six-transition-medium) transform;\n overflow: auto;\n pointer-events: all;\n\n &:focus {\n outline: none;\n }\n}\n\n.drawer--top .drawer__panel {\n top: 0;\n right: auto;\n bottom: auto;\n left: 0;\n width: 100%;\n height: var(--size);\n transform: translate(0, -100%);\n}\n\n.drawer--right .drawer__panel {\n top: 0;\n right: 0;\n bottom: auto;\n left: auto;\n width: var(--size);\n height: 100%;\n transform: translate(100%, 0);\n}\n\n.drawer--bottom .drawer__panel {\n top: auto;\n right: auto;\n bottom: 0;\n left: 0;\n width: 100%;\n height: var(--size);\n transform: translate(0, 100%);\n}\n\n.drawer--left .drawer__panel {\n top: 0;\n right: auto;\n bottom: auto;\n left: 0;\n width: var(--size);\n height: 100%;\n transform: translate(-100%, 0);\n}\n\n.drawer--open .drawer__panel {\n // don't use translate here or it will cause problems with popovers inside the drawer e.g. dropdown, select etc.\n transform: none;\n}\n\n.drawer__header {\n display: flex;\n}\n\n.drawer__title {\n flex: 1 1 auto;\n font-size: var(--six-font-size-large);\n line-height: var(--six-line-height-dense);\n padding: var(--six-spacing-large);\n}\n\n.drawer__close {\n flex: 0 0 auto;\n display: flex;\n align-items: center;\n font-size: var(--six-font-size-x-large);\n padding: 0 var(--six-spacing-large);\n}\n\n.drawer__body {\n flex: 1 1 auto;\n padding: var(--six-spacing-large);\n overflow: auto;\n -webkit-overflow-scrolling: touch;\n}\n\n.drawer__footer {\n text-align: right;\n padding: var(--six-spacing-large);\n\n ::slotted(six-button:not(:last-of-type)) {\n margin-right: var(--six-spacing-x-small);\n }\n}\n\n.drawer:not(.drawer--has-footer) .drawer__footer {\n display: none;\n}\n\n.drawer__overlay {\n display: block;\n position: fixed;\n top: 0;\n right: 0;\n bottom: 0;\n left: 0;\n background-color: var(--six-overlay-background-color);\n opacity: 0;\n transition: var(--six-transition-medium) opacity;\n pointer-events: all;\n}\n\n.drawer--contained .drawer__overlay {\n position: absolute;\n}\n\n.drawer--open .drawer__overlay {\n opacity: 0.4;\n}\n","import { Component, Element, Event, EventEmitter, h, Method, Prop, State, Watch } from '@stencil/core';\nimport { lockBodyScrolling, unlockBodyScrolling } from '../../utils/scroll';\nimport { hasSlot } from '../../utils/slot';\nimport Modal from '../../utils/modal';\nimport { EmptyPayload } from '../../utils/types';\nimport { animateTo } from '../../utils/animation';\n\nexport interface SixDrawerRequestClose {\n source: 'close-button' | 'keyboard' | 'overlay';\n}\n\nlet id = 0;\n\n/**\n * @since 1.0\n * @status stable\n *\n * Forked from https://github.com/shoelace-style/shoelace version v2.0.0-beta27.\n *\n * @slot - The drawer's content.\n * @slot label - The drawer's label. Alternatively, you can use the label prop.\n * @slot footer - The drawer's footer, usually one or more buttons representing various options.\n *\n * @part base - The component's base wrapper.\n * @part overlay - The overlay.\n * @part panel - The drawer panel (where the drawer and its content is rendered).\n * @part header - The drawer header.\n * @part title - The drawer title.\n * @part close-button - The close button.\n * @part body - The drawer body.\n * @part footer - The drawer footer.\n */\n\n@Component({\n tag: 'six-drawer',\n styleUrl: 'six-drawer.scss',\n shadow: true,\n})\nexport class SixDrawer {\n private componentId = `drawer-${++id}`;\n private drawer?: HTMLElement;\n private modal?: Modal;\n private panel?: HTMLElement;\n private willShow = false;\n private willHide = false;\n\n @Element() host!: HTMLSixDrawerElement;\n\n @State() hasFooter = false;\n @State() isVisible = false;\n\n /** Indicates whether the drawer is open. You can use this in lieu of the show/hide methods. */\n @Prop({ mutable: true, reflect: true }) open = false;\n\n /**\n * The drawer's label as displayed in the header. You should always include a relevant label even when using\n * `no-header`, as it is required for proper accessibility.\n */\n @Prop() label = '';\n\n /** The direction from which the drawer will open. */\n @Prop() placement: 'top' | 'right' | 'bottom' | 'left' = 'right';\n\n /**\n * By default, the drawer slides out of its containing block (usually the viewport). To make the drawer slide out of\n * its parent element, set this prop and add `position: relative` to the parent.\n */\n @Prop() contained = false;\n\n /**\n * Removes the header. This will also remove the default close button, so please ensure you provide an easy,\n * accessible way for users to dismiss the drawer.\n */\n @Prop() noHeader = false;\n\n @Watch('open')\n handleOpenChange() {\n this.open ? this.show() : this.hide();\n }\n\n /** Emitted when the drawer opens. Calling `event.preventDefault()` will prevent it from being opened. */\n @Event({ eventName: 'six-drawer-show' }) sixShow!: EventEmitter<EmptyPayload>;\n\n /** Emitted after the drawer opens and all transitions are complete. */\n @Event({ eventName: 'six-drawer-after-show' }) sixAfterShow!: EventEmitter<EmptyPayload>;\n\n /** Emitted when the drawer closes. Calling `event.preventDefault()` will prevent it from being closed. */\n @Event({ eventName: 'six-drawer-hide' }) sixHide!: EventEmitter<EmptyPayload>;\n\n /** Emitted after the drawer closes and all transitions are complete. */\n @Event({ eventName: 'six-drawer-after-hide' }) sixAfterHide!: EventEmitter<EmptyPayload>;\n\n /**\n * Emitted when the drawer opens and the panel gains focus. Calling `event.preventDefault()` will prevent focus and\n * allow you to set it on a different element in the drawer, such as an input or button.\n */\n @Event({ eventName: 'six-drawer-initial-focus' }) sixInitialFocus!: EventEmitter<EmptyPayload>;\n\n /**\n * Emitted when the user attempts to close the drawer by clicking the close button, clicking the overlay, or\n * pressing escape. Calling `event.preventDefault()` will keep the drawer open. Avoid using this unless closing\n * the drawer will result in destructive behavior such as data loss.\n */\n @Event({ eventName: 'six-drawer-request-close' }) sixRequestClose!: EventEmitter<SixDrawerRequestClose>;\n\n connectedCallback() {\n this.modal = new Modal(this.host, {\n onFocusOut: () => (this.contained ? null : this.panel?.focus()),\n });\n }\n\n componentWillLoad() {\n this.handleSlotChange();\n\n // Show on init if open\n if (this.open) {\n this.show();\n // if the sidebar is open by default we need to manually reset the\n // transition variables since there will be no transition event\n this.resetTransitionVariables();\n }\n }\n\n disconnectedCallback() {\n unlockBodyScrolling(this.host);\n }\n\n /** Shows the drawer */\n @Method()\n async show() {\n if (this.willShow || this.modal == null || this.panel == null || this.drawer == null) {\n return;\n }\n const panel = this.panel;\n\n const sixShow = this.sixShow.emit();\n if (sixShow.defaultPrevented) {\n this.open = false;\n return;\n }\n\n this.willShow = true;\n this.isVisible = true;\n this.open = true;\n\n // Lock body scrolling only if the drawer isn't contained\n if (!this.contained) {\n this.modal.activate();\n lockBodyScrolling(this.host);\n }\n\n if (this.open) {\n // Wait for the next frame before setting initial focus so the dialog is technically visible\n requestAnimationFrame(() => {\n const sixInitialFocus = this.sixInitialFocus.emit();\n if (!sixInitialFocus.defaultPrevented) {\n panel.focus({ preventScroll: true });\n }\n });\n }\n }\n\n /** Hides the drawer */\n @Method()\n async hide() {\n if (this.willHide || this.modal == null) {\n return;\n }\n\n const sixHide = this.sixHide.emit();\n if (sixHide.defaultPrevented) {\n this.open = true;\n return;\n }\n\n this.willHide = true;\n this.open = false;\n this.modal.deactivate();\n\n unlockBodyScrolling(this.host);\n }\n\n private handleCloseClick = () => {\n this.preventClose('close-button');\n };\n\n private handleKeyDown = (event: KeyboardEvent) => {\n if (event.key === 'Escape') {\n this.preventClose('keyboard');\n }\n };\n\n private handleOverlayClick = () => {\n this.preventClose('overlay');\n };\n\n private preventClose(source: 'close-button' | 'keyboard' | 'overlay') {\n const sixRequestClose = this.sixRequestClose.emit({ source });\n\n if (sixRequestClose.defaultPrevented && this.panel) {\n animateTo(this.panel, [{ scale: 1 }, { scale: 1.01 }, { scale: 1 }], { duration: 250 });\n return;\n }\n\n this.hide();\n }\n\n private handleSlotChange = () => {\n this.hasFooter = hasSlot(this.host, 'footer');\n };\n\n private handleTransitionEnd = (event: TransitionEvent) => {\n const target = event.target as HTMLElement;\n\n // Ensure we only emit one event when the target element is no longer visible\n if (event.propertyName === 'transform' && target.classList.contains('drawer__panel')) {\n this.resetTransitionVariables();\n }\n };\n\n private resetTransitionVariables() {\n this.isVisible = this.open;\n this.willShow = false;\n this.willHide = false;\n this.open ? this.sixAfterShow.emit() : this.sixAfterHide.emit();\n }\n\n render() {\n return (\n <div\n ref={(el) => (this.drawer = el)}\n part=\"base\"\n class={{\n drawer: true,\n 'drawer--open': this.open,\n 'drawer--visible': this.isVisible,\n 'drawer--top': this.placement === 'top',\n 'drawer--right': this.placement === 'right',\n 'drawer--bottom': this.placement === 'bottom',\n 'drawer--left': this.placement === 'left',\n 'drawer--contained': this.contained,\n 'drawer--fixed': !this.contained,\n 'drawer--has-footer': this.hasFooter,\n }}\n onKeyDown={this.handleKeyDown}\n onTransitionEnd={this.handleTransitionEnd}\n >\n <div part=\"overlay\" class=\"drawer__overlay\" onClick={this.handleOverlayClick} tabIndex={-1} />\n\n <div\n ref={(el) => (this.panel = el)}\n part=\"panel\"\n class=\"drawer__panel\"\n role=\"dialog\"\n aria-modal=\"true\"\n aria-hidden={this.open ? 'false' : 'true'}\n aria-label={this.noHeader ? this.label : null}\n aria-labelledby={!this.noHeader ? `${this.componentId}-title` : null}\n tabIndex={0}\n >\n {!this.noHeader && (\n <header part=\"header\" class=\"drawer__header\">\n <span part=\"title\" class=\"drawer__title\" id={`${this.componentId}-title`}>\n <slot name=\"label\">\n {/* If there's no label, use an invisible character to prevent the heading from collapsing */}\n {this.label || String.fromCharCode(65279)}\n </slot>\n </span>\n <six-icon-button\n exportparts=\"base:close-button\"\n class=\"drawer__close\"\n name=\"close\"\n onClick={this.handleCloseClick}\n />\n </header>\n )}\n\n <div part=\"body\" class=\"drawer__body\">\n <slot />\n </div>\n\n <footer part=\"footer\" class=\"drawer__footer\">\n <slot name=\"footer\" onSlotchange={this.handleSlotChange} />\n </footer>\n </div>\n </div>\n );\n }\n}\n"],"mappings":"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","ignoreList":[]}

package/dist/ui-library/p-59568c0f.entry.js ADDED Viewed

	@@ -0,0 +1,2 @@
1	+ import{r as t,c as i,h as s,g as e}from"./p-JoG9I7EO.js";import{P as n}from"./p-kHci8ddv.js";import{E as o}from"./p-C4h4qpGl.js";import{a as r,D as h}from"./p-CKhg9ibv.js";import{a as l}from"./p-j3oIB5oT.js";function a(t){const i=t.tabIndex;return i>-1}function d(t){if(a(t)){return t}if(t.shadowRoot!=null){const i=[...t.shadowRoot.children].find((t=>a(t)));if(i!=null){return i}}if(t.children!=null){return[...t.children].map((t=>d(t))).at(0)}return undefined}const u=":host{position:relative;box-sizing:border-box}:host ,:host :before,:host :after{box-sizing:border-box}.sr-only{clip:rect(0 0 0 0);clip-path:inset(50%);height:1px;overflow:hidden;position:absolute;white-space:nowrap;width:1px}:host{display:inline-block}.dropdown{position:relative}.dropdown__trigger{display:block}.dropdown__positioner{position:absolute;z-index:var(--six-z-index-dropdown)}.dropdown__positioner__filtered{width:100%}.dropdown__panel{font-family:var(--six-font-sans);font-size:var(--six-font-size-small);font-weight:var(--six-font-weight-normal);color:var(--color);background-color:var(--six-panel-background-color);border-radius:var(--six-border-radius-medium);border:1px solid var(--six-color-web-rock-300);box-shadow:var(--six-shadow-small);opacity:0;pointer-events:none;transform:scale(0.9);transition:var(--six-transition-fast) opacity, var(--six-transition-fast) transform;max-width:90vw}.dropdown__panel__scroll{max-height:18.75rem;overflow-y:auto;overflow-x:hidden;overscroll-behavior:none}.dropdown__panel__scroll--virtual{overflow-y:hidden;overflow-x:hidden}.filter-hidden{display:none}.dropdown__positioner[data-popper-placement^=top] .dropdown__panel{transform-origin:bottom}.dropdown__positioner[data-popper-placement^=bottom] .dropdown__panel{transform-origin:top}.dropdown__positioner[data-popper-placement^=left] .dropdown__panel{transform-origin:right}.dropdown__positioner[data-popper-placement^=right] .dropdown__panel{transform-origin:left}.dropdown__positioner.popover-visible .dropdown__panel{opacity:1;transform:none;pointer-events:all}.filter{border-bottom:1px solid var(--six-color-web-rock-300)}.filter__icon{color:var(--six-color-web-rock-600)}";let c=0;const f=class{constructor(e){t(this,e);this.sixShow=i(this,"six-dropdown-show");this.sixAfterShow=i(this,"six-dropdown-after-show");this.sixHide=i(this,"six-dropdown-hide");this.sixAfterHide=i(this,"six-dropdown-after-hide");this.sixAutoFilter=i(this,"six-dropdown-auto-filter-fired");this.sixAsyncFilterFired=i(this,"six-async-filter-fired");this.sixScroll=i(this,"six-dropdown-scroll");this.componentId=`dropdown-${++c}`;this.isVisible=false;this.resizeObserver=new ResizeObserver(r((()=>this.updatePanelPosition()),100));this.open=false;this.placement="bottom-start";this.closeOnSelect=true;this.distance=4;this.skidding=0;this.hoist=false;this.filter=false;this.asyncFilter=false;this.filterPlaceholder="Filter...";this.autofocusFilter=true;this.filterDebounce=0;this.disableHideOnEnterAndSpace=false;this.options=[];this.virtualScroll=false;this.matchTriggerWidth=false;this.eventListeners=new o;this.renderedOptions=[];this.getMenuItems=()=>{var t,i,e,n;if(this.options.length>0){return{sixMenuItems:this.renderedOptions.map((t=>s("six-menu-item",{value:t.value},t.label))),selectionContainerItems:[]}}if(this.panel==null)return{sixMenuItems:[],selectionContainerItems:[]};const o=(t=this.panelSlot)===null\|\|t===void 0?void 0:t.assignedElements({flatten:true}).filter(m).at(0);const r=(i=this.panelSlot)===null\|\|i===void 0?void 0:i.assignedElements({flatten:true}).filter(p).at(0);const h=(o===null\|\|o===void 0?void 0:o.querySelectorAll("six-menu-item"))\|\|[];let l=((e=r===null\|\|r===void 0?void 0:r.querySelector("slot"))===null\|\|e===void 0?void 0:e.assignedElements().filter((t=>v(t))))\|\|[];if(l.length===0){l=Array.from(((n=r===null\|\|r===void 0?void 0:r.shadowRoot)===null\|\|n===void 0?void 0:n.querySelectorAll("six-menu-item"))\|\|[])}if(h.length>0\|\|l.length>0){return{sixMenuItems:l,selectionContainerItems:[...h]}}else{return{sixMenuItems:r?Array.from(r.querySelectorAll("six-menu-item")):[],selectionContainerItems:[]}}};this.handleDocumentKeyDown=t=>{var i;const s=t;if(s.key==="Escape"){void this.hide();this.focusOnTrigger();return}if(this.filterInputElement===((i=this.host.shadowRoot)===null\|\|i===void 0?void 0:i.activeElement)){if(s.key==="ArrowDown"){const{sixMenuItems:t,selectionContainerItems:i}=this.getMenuItems();const s=[...i,...t].find((t=>t.style.display!=="none"));if(s!=null){s.setFocus()}}}if(s.key==="Tab"){if(this.open&&document.activeElement!=null&&v(document.activeElement)){s.preventDefault();void this.hide();this.focusOnTrigger();return}setTimeout((()=>{var t,i;const s=this.container.getRootNode()instanceof ShadowRoot?(i=(t=document.activeElement)===null\|\|t===void 0?void 0:t.shadowRoot)===null\|\|i===void 0?void 0:i.activeElement:document.activeElement;if((s===null\|\|s===void 0?void 0:s.closest(this.container.tagName.toLowerCase()))!==this.container){void this.hide();return}}))}};this.handleDocumentMouseDown=t=>{const i=t.composedPath();if(!i.includes(this.container)){void this.hide();return}};this.handlePanelSelect=t=>{const i=t.target;if(this.closeOnSelect&&p(i)){void this.hide();this.focusOnTrigger()}};this.handleTriggerClick=()=>{this.open?this.hide():this.show()};this.handleTriggerKeyDown=t=>{if(t.key==="Escape"){this.focusOnTrigger();void this.hide();return}if(!this.disableHideOnEnterAndSpace&&[" ","Enter"].includes(t.key)){t.preventDefault();this.open?void this.hide():void this.show();return}const i=this.getMenu();if(["ArrowDown","ArrowUp"].includes(t.key)){t.preventDefault();if(!this.open){void this.show()}if(i==null){return}const s=[...i.querySelectorAll("six-menu-item")];const e=s.at(0);const n=s.at(s.length-1);if(t.key==="ArrowDown"&&e!=null){e.setFocus();return}if(t.key==="ArrowUp"&&n!=null){n.setFocus();return}}const s=["Tab","Shift","Meta","Ctrl","Alt"];if(this.open&&i!=null&&!s.includes(t.key)){void i.typeToSelect(t.key);return}};this.handleTriggerKeyUp=t=>{if(t.key===" "){t.preventDefault()}};this.handleTriggerSlotChange=()=>{this.updateAccessibleTrigger()};this.handleDropdownScroll=()=>{if(this.scrollPanel==null)return;this.sixScroll.emit({scrollHeight:this.scrollPanel.scrollHeight,scrollTop:this.scrollPanel.scrollTop,scrollbarHeight:this.scrollPanel.offsetHeight(this.scrollPanel.offsetHeight/this.scrollPanel.scrollHeight),scrollRatio:this.scrollPanel.scrollTop/(this.scrollPanel.scrollHeight-this.scrollPanel.clientHeight)})}}get filterEnabled(){return this.filter\|\|this.asyncFilter}get container(){return this.containingElement\|\|this.host}handleOpenChange(){this.open?this.show():this.hide();this.updateAccessibleTrigger()}handlePopoverOptionsChange(){if(this.popoverHelper==null)return;this.popoverHelper.setOptions({strategy:this.hoist?"fixed":"absolute",placement:this.placement,distance:this.distance,skidding:this.skidding})}handleOptionsChange(){this.validateOptions()}validateOptions(){if(!Array.isArray(this.options)){this.options=[]}if(this.virtualScroll&&this.options.length===0){console.error("Options must be defined when using virtual scrolling")}this.renderedOptions=[...this.options]}componentWillLoad(){this.validateOptions();if(this.asyncFilter){this.filterDebounce=h}}componentDidLoad(){this.init();if(this.open){void this.show()}}connectedCallback(){this.init()}init(){this.initPopover();const t=this.filterInputElement;if(t!=null){this.eventListeners.add(t,"six-input-input",r((()=>{var i;const s=(i=t.value)!==null&&i!==void 0?i:"";if(this.filter){this.applyFilter(s)}this.emitFilterEvents(s)}),this.filterDebounce))}}applyFilter(t){var i;const s=((i=t.toLowerCase())===null\|\|i===void 0?void 0:i.trim())\|\|"";if(this.options.length>0){this.renderedOptions=this.options.filter((t=>{var i,e,n,o;return t.label&&((e=(i=String(t.label))===null\|\|i===void 0?void 0:i.toLowerCase())===null\|\|e===void 0?void 0:e.includes(s))\|\|t.value&&((o=(n=String(t.value))===null\|\|n===void 0?void 0:n.toLowerCase())===null\|\|o===void 0?void 0:o.includes(s))}))}else{const{selectionContainerItems:t,sixMenuItems:i}=this.getMenuItems();const e=t.map((t=>t.value));t.forEach((async t=>{t.style.display=await b(t,s)?"unset":"none"}));i.forEach((async t=>{t.style.display=await b(t,s)&&!e.includes(t.value)?"unset":"none"}))}}resetFilter(){if(this.filterInputElement!=null){this.filterInputElement.value="";this.emitFilterEvents("")}if(this.options.length>0){this.renderedOptions=[...this.options]}else{const{selectionContainerItems:t,sixMenuItems:i}=this.getMenuItems();[...t,...i].forEach((t=>t.style.display="unset"))}}emitFilterEvents(t){if(this.filter){this.sixAutoFilter.emit({filterValue:t})}else if(this.asyncFilter){this.sixAsyncFilterFired.emit({filterValue:t})}}initPopover(){if(this.trigger==null\|\|this.positioner==null)return;this.popoverHelper=new n(this.trigger,this.positioner,{strategy:this.hoist?"fixed":"absolute",placement:this.placement,distance:this.distance,skidding:this.skidding,transitionElement:this.panel,onAfterHide:()=>{if(this.filterEnabled){this.resetFilter()}this.sixAfterHide.emit()},onAfterShow:async()=>{this.sixAfterShow.emit()},onTransitionEnd:()=>{if(!this.open&&this.scrollPanel!=null){this.scrollPanel.scrollTop=0}}})}disconnectedCallback(){var t;this.resizeObserver.disconnect();this.eventListeners.removeAll();void this.hide();(t=this.popoverHelper)===null\|\|t===void 0?void 0:t.destroy();this.popoverHelper=undefined}async show(){if(this.isVisible\|\|this.popoverHelper==null\|\|this.panel==null){return}const t=this.sixShow.emit();if(t.defaultPrevented){this.open=false;return}this.eventListeners.add(this.panel,"six-menu-item-selected",this.handlePanelSelect);this.eventListeners.add(document,"keydown",this.handleDocumentKeyDown);this.eventListeners.add(document,"mousedown",this.handleDocumentMouseDown);this.isVisible=true;this.open=true;if(this.trigger!=null){this.resizeObserver.observe(this.trigger)}this.updatePanelPosition();this.popoverHelper.show();if(this.filterEnabled&&this.autofocusFilter){requestAnimationFrame((()=>{var t;(t=this.filterInputElement)===null\|\|t===void 0?void 0:t.setFocus()}))}}updatePanelPosition(){if(!this.open){return}if(this.matchTriggerWidth&&this.trigger!=null&&this.panel!=null){const t=this.trigger.getBoundingClientRect().width;this.panel.style.minWidth=`${t}px`}if(this.popoverHelper!=null){this.popoverHelper.reposition()}}async hide(){this.resizeObserver.disconnect();if(!this.isVisible\|\|this.panel==null\|\|this.popoverHelper==null){return}const t=this.sixHide.emit();if(t.defaultPrevented){this.open=true;return}this.eventListeners.remove(this.panel,"six-menu-item-selected",this.handlePanelSelect);this.eventListeners.remove(document,"keydown",this.handleDocumentKeyDown);this.eventListeners.remove(document,"mousedown",this.handleDocumentMouseDown);this.isVisible=false;this.open=false;this.popoverHelper.hide()}focusOnTrigger(){var t;if(this.trigger==null)return;const i=(t=this.triggerSlot)===null\|\|t===void 0?void 0:t.assignedElements({flatten:true}).at(0);if(i!=null){if(typeof i.setFocus==="function"){i.setFocus()}else if(typeof i.focus==="function"){i.focus()}}}getMenu(){var t;return(t=this.panelSlot)===null\|\|t===void 0?void 0:t.assignedElements({flatten:true}).filter(p).at(0)}updateAccessibleTrigger(){var t;if(this.trigger==null)return;const i=((t=this.triggerSlot)===null\|\|t===void 0?void 0:t.assignedElements({flatten:true}))\|\|[];const s=i.map(d).at(0);if(s!=null){s.setAttribute("aria-haspopup","true");s.setAttribute("aria-expanded",this.open?"true":"false")}}render(){return s("div",{key:"46305375a199fb17ae66ca3b6678634844d0b8a2",part:"base",id:this.componentId,class:{dropdown:true,"dropdown--open":this.open}},s("span",{key:"2a53d2cf2b75607614f39675cabfe1362b297e70",part:"trigger",class:"dropdown__trigger",ref:t=>this.trigger=t,onClick:this.handleTriggerClick,onKeyDown:this.handleTriggerKeyDown,onKeyUp:this.handleTriggerKeyUp},s("slot",{key:"d8abcd455c768fded48df4c18b8191e365db4ab1",name:"trigger",ref:t=>this.triggerSlot=t,onSlotchange:this.handleTriggerSlotChange})),s("div",{key:"fd0e0352800daebdc9843442901cad9769d3199a",ref:t=>this.positioner=t,class:{dropdown__positioner:true,dropdown__positioner__filtered:(this.filter\|\|this.asyncFilter)&&!this.hoist}},s("div",{key:"2d72ca0ba1a5cbb480727e325048f7a171fb7af8",ref:t=>this.panel=t,part:"panel",class:"dropdown__panel",role:"menu","aria-hidden":this.open?"false":"true","aria-labelledby":this.componentId},this.filterEnabled&&s("six-input",{key:"a22263fb924be51081598579391774c82a09852f",class:{filter:true,"filter-hidden":!this.open},"dropdown-search":true,"aria-hidden":this.open?"false":"true",ref:t=>this.filterInputElement=t,placeholder:this.filterPlaceholder},s("six-icon",{key:"7a8fc9e25e7e209b5b0aa05af5dcefca87e3b9d5",class:"filter__icon",slot:"suffix",size:"small"},"search")),s("div",{key:"bedcab39d656be8ce064852ef9344b4fbbf60b17",class:{dropdown__panel__scroll:true,"dropdown__panel__scroll--virtual":this.virtualScroll},onScroll:this.handleDropdownScroll,ref:t=>this.scrollPanel=t},s("slot",{key:"21acba56de1fba98afdfda60e8b09816a70ac057",ref:t=>this.panelSlot=t}),this.options.length>0&&s("six-menu",{key:"d7d429d062bf111ffdaf667ada0efe640136871a",part:"menu",items:this.renderedOptions,virtualScroll:this.virtualScroll})),s("slot",{key:"e23be3aa659ed7fa4a513d82c982733b58a6e9db",name:"dropdown-footer"}))))}get host(){return e(this)}static get watchers(){return{open:["handleOpenChange"],distance:["handlePopoverOptionsChange"],hoist:["handlePopoverOptionsChange"],placement:["handlePopoverOptionsChange"],skidding:["handlePopoverOptionsChange"],options:["handleOptionsChange"],virtualScroll:["handleOptionsChange"]}}};function p(t){return(t===null\|\|t===void 0?void 0:t.tagName.toLowerCase())==="six-menu"}function v(t){return(t===null\|\|t===void 0?void 0:t.tagName.toLowerCase())==="six-menu-item"}function m(t){var i;return((i=t===null\|\|t===void 0?void 0:t.getAttribute("class"))===null\|\|i===void 0?void 0:i.includes("selection-container"))\|\|false}async function b(t,i){return t.value.toLowerCase().includes(i)\|\|(await t.getTextLabel()).toLowerCase().includes(i)}f.style=u;const w=":host{position:relative;box-sizing:border-box}:host ,:host :before,:host :after{box-sizing:border-box}.sr-only{clip:rect(0 0 0 0);clip-path:inset(50%);height:1px;overflow:hidden;position:absolute;white-space:nowrap;width:1px}:host{display:block}.menu{padding:var(--six-spacing-xx-small) 0;border:none;box-shadow:var(--six-shadow-small);overflow-y:auto;overflow-x:hidden}.menu:focus{outline:none}.no-shadow{box-shadow:none}";const x=t=>{var i,s,e;return(e=(s=(i=t===null\|\|t===void 0?void 0:t.shadowRoot)===null\|\|i===void 0?void 0:i.querySelector(".menu-item"))===null\|\|s===void 0?void 0:s.classList)===null\|\|e===void 0?void 0:e.contains("menu-item--focused")};const g=t=>(t===null\|\|t===void 0?void 0:t.tagName.toLowerCase())==="six-menu-item";const y=({value:t,label:i})=>s("six-menu-item",{key:t,value:t},i);const _=5;const k=48;const C=64;const I=class{constructor(s){t(this,s);this.sixMenuItemSelected=i(this,"six-menu-item-selected");this.eventListeners=new o;this.typeToSelectString="";this.removeBoxShadow=false;this.items=null;this.virtualScroll=false;this.itemSize=10;this.scrollingDebounce=15;this.disableKeyboardHandling=false;this.scrollingIndex=0;this.sixMenuItemHeight=this.virtualScroll?k:C;this.handleScrolling=()=>{if(this.menuWrapper==null)return;this.scrollingIndex=Math.floor(this.menuWrapper.scrollTop/this.sixMenuItemHeight)}}connectedCallback(){this.handleClick=this.handleClick.bind(this);this.handleKeyDown=this.handleKeyDown.bind(this)}componentWillLoad(){if(this.items===null){return}}componentDidLoad(){this.setupForVirtualScrollingAfterRendering()}disconnectedCallback(){this.eventListeners.removeAll()}async typeToSelect(t){var i;clearTimeout(this.typeToSelectTimeout);this.typeToSelectTimeout=setTimeout((()=>this.typeToSelectString=""),750);this.typeToSelectString+=t.toLowerCase();const s=this.getItems();for(const t of s){const s=(i=t.shadowRoot)===null\|\|i===void 0?void 0:i.querySelector("slot:not([name])");const e=l(s).toLowerCase().trim();if(e.substring(0,this.typeToSelectString.length)===this.typeToSelectString){t.setFocus();break}}}getItemsShown(){var t;const i=this.virtualScroll?_:0;if(this.items&&this.items.length===1){return 0}return(t=this.itemsShown)!==null&&t!==void 0?t:i}setupForVirtualScrollingAfterRendering(){var t,i;if(!this.virtualScroll\|\|this.menuWrapper==null)return;this.eventListeners.add(this.menuWrapper,"scroll",r(this.handleScrolling,this.scrollingDebounce));const s=(i=(t=this.menu)===null\|\|t===void 0?void 0:t.querySelector("six-menu-item"))===null\|\|i===void 0?void 0:i.clientHeight;if(s!=null&&s>0){this.sixMenuItemHeight=s}}getItems(){if(this.menu==null)return[];if(this.items!=null){return this.items.map(y)}const t=this.menu.querySelector("slot");if(t==null)return[];return[...t.assignedElements({flatten:true})].filter((t=>g(t)&&!t.disabled))}getActiveItemIndex(){const t=this.getItems();const i=this.getActiveItem();if(i!=null){const s=t.indexOf(i);if(s>-1){return s}}const s=this.extractItemsFromDOM();return s.findIndex(x)}getActiveItem(){var t;const i=this.getItems().find((t=>t===document.activeElement));if(i!=null){return i}return(t=this.extractItemsFromDOM())===null\|\|t===void 0?void 0:t.find(x)}extractItemsFromDOM(){var t,i;return Array.from((i=(t=this.host.shadowRoot)===null\|\|t===void 0?void 0:t.querySelectorAll("six-menu-item"))!==null&&i!==void 0?i:[])}setActiveItem(t){t===null\|\|t===void 0?void 0:t.setFocus()}handleClick(t){const i=t.target;const s=i.closest("six-menu-item");if(s&&!s.disabled){this.sixMenuItemSelected.emit({name:s.value,item:s})}}handleKeyDown(t){if(this.disableKeyboardHandling){return}if(t.key==="Enter"){const i=this.getActiveItem();t.preventDefault();if(i!=null){this.sixMenuItemSelected.emit({name:i.value,item:i})}}if(t.key===" "){t.preventDefault()}if(["ArrowDown","ArrowUp","Home","End"].includes(t.key)){const i=this.items===null?this.getItems():this.extractItemsFromDOM();let s=this.getActiveItemIndex();if(i.length>0){t.preventDefault();if(t.key==="ArrowDown"){s++}else if(t.key==="ArrowUp"){s--}else if(t.key==="Home"){s=0}else if(t.key==="End"){s=i.length-1}if(s<0)s=0;if(s>i.length-1)s=i.length-1;this.setActiveItem(i[s]);return}}void this.typeToSelect(t.key)}getMenuWrapperStyle(){var t;const i={};if(this.getItemsShown()>0){i.height=`${((t=this.getItemsShown())!==null&&t!==void 0?t:0)this.sixMenuItemHeight}px`}else if(this.items&&this.items.length===1){i.height="auto"}return Object.assign({},i)}getMenuContainerStyle(){const t={};if(this.virtualScroll){t.transform=`translateY(${this.sixMenuItemHeightthis.scrollingIndex}px)`}return Object.assign({},t)}getScrollbarGhostStyle(){const t={};if(this.virtualScroll&&this.items!==null&&this.items.length>1){t.height=`${this.items.lengththis.sixMenuItemHeight-this.itemSize*this.sixMenuItemHeight}px`}return Object.assign({},t)}renderItems(){if(this.items===undefined\|\|this.items===null){return}if(!this.virtualScroll){return this.items.map(y)}return this.items.slice(this.scrollingIndex,Math.min(this.items.length,this.itemSize+this.scrollingIndex)).map((({value:t,label:i})=>s("six-menu-item",{checkType:"check",key:t,value:t},i)))}render(){return s("div",{key:"5b49fa6852d9d86c36e77533e06950ca5c320675",ref:t=>this.menuWrapper=t,style:this.getMenuWrapperStyle(),part:"wrapper",class:{menu:true,"no-shadow":this.removeBoxShadow}},s("div",{key:"b471da4ddcd06d56f21b020491c41c53766757a6",ref:t=>this.menu=t,part:"base",role:"menu",onClick:this.handleClick,onKeyDown:this.handleKeyDown,tabIndex:0,style:this.getMenuContainerStyle()},s("slot",{key:"e04e2751c6afd78db344211ca1e6db55b6b6d829"}),this.renderItems()),this.virtualScroll&&s("div",{key:"63dcb8d734ae480e7a4a8dcd50f0dc4131f8cb09",style:this.getScrollbarGhostStyle()}))}get host(){return e(this)}};I.style=w;export{f as six_dropdown,I as six_menu};
2	+ //# sourceMappingURL=p-59568c0f.entry.js.map

package/dist/ui-library/p-59568c0f.entry.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"names":["isTabbable","el","tabIndex","getNearestTabbableElement","shadowRoot","tabbableShadowChild","children","find","e","map","at","undefined","sixDropdownCss","id","SixDropdown","constructor","hostRef","this","componentId","isVisible","resizeObserver","ResizeObserver","debounce","updatePanelPosition","open","placement","closeOnSelect","distance","skidding","hoist","filter","asyncFilter","filterPlaceholder","autofocusFilter","filterDebounce","disableHideOnEnterAndSpace","options","virtualScroll","matchTriggerWidth","eventListeners","EventListeners","renderedOptions","getMenuItems","length","sixMenuItems","option","h","value","label","selectionContainerItems","panel","selectionContainer","_a","panelSlot","assignedElements","flatten","isSelectionContainer","sixMenuElement","_b","isSixMenu","querySelectorAll","_c","querySelector","isSixMenuItem","Array","from","_d","handleDocumentKeyDown","event","keyboardEvent","key","hide","focusOnTrigger","filterInputElement","host","activeElement","item","style","display","setFocus","document","preventDefault","setTimeout","container","getRootNode","ShadowRoot","closest","tagName","toLowerCase","handleDocumentMouseDown","path","composedPath","includes","handlePanelSelect","target","handleTriggerClick","show","handleTriggerKeyDown","menu","getMenu","menuItems","firstMenuItem","lastMenuItem","ignoredKeys","typeToSelect","handleTriggerKeyUp","handleTriggerSlotChange","updateAccessibleTrigger","handleDropdownScroll","scrollPanel","sixScroll","emit","scrollHeight","scrollTop","scrollbarHeight","offsetHeight","scrollRatio","clientHeight","filterEnabled","containingElement","handleOpenChange","handlePopoverOptionsChange","popoverHelper","setOptions","strategy","handleOptionsChange","validateOptions","isArray","console","error","componentWillLoad","DEFAULT_DEBOUNCE_FAST","componentDidLoad","init","connectedCallback","initPopover","add","filterValue","applyFilter","emitFilterEvents","filterTerm","lowerCaseFilterTerm","trim","String","selectionContainerValues","s","forEach","async","menuItem","containsFilterTerm","resetFilter","sixAutoFilter","sixAsyncFilterFired","trigger","positioner","Popover","transitionElement","onAfterHide","sixAfterHide","onAfterShow","sixAfterShow","onTransitionEnd","disconnectedCallback","disconnect","removeAll","destroy","sixShow","defaultPrevented","observe","requestAnimationFrame","width","getBoundingClientRect","minWidth","reposition","sixHide","remove","triggerSlot","focus","accessibleTrigger","setAttribute","render","part","class","dropdown","ref","onClick","onKeyDown","onKeyUp","name","onSlotchange","dropdown__positioner","dropdown__positioner__filtered","role","placeholder","slot","size","dropdown__panel__scroll","onScroll","items","getAttribute","getTextLabel","sixMenuCss","isFocusedMenuItem","classList","contains","isSIXMenuItemElement","mapToMenuItem","DEFAULT_NUMBER_OF_ITEMS_SHOWN_FOR_VIRTUAL_SCROLLING","DEFAULT_SIX_MENU_ITEM_HEIGHT_FOR_VIRTUAL_SCROLLING","DEFAULT_SIX_MENU_ITEM_HEIGHT","SixMenu","typeToSelectString","removeBoxShadow","itemSize","scrollingDebounce","disableKeyboardHandling","scrollingIndex","sixMenuItemHeight","handleScrolling","menuWrapper","Math","floor","handleClick","bind","handleKeyDown","setupForVirtualScrollingAfterRendering","clearTimeout","typeToSelectTimeout","getItems","getTextContent","substring","getItemsShown","defaultItemsShown","itemsShown","menuItemHeight","disabled","getActiveItemIndex","selectedItem","getActiveItem","itemIndex","indexOf","extractItemsFromDOM","findIndex","i","setActiveItem","clickedItem","sixMenuItemSelected","activeItem","indexOfActiveItem","getMenuWrapperStyle","styles","height","Object","assign","getMenuContainerStyle","transform","getScrollbarGhostStyle","renderItems","slice","min","checkType"],"sources":["src/utils/tabbable.ts","src/components/six-dropdown/six-dropdown.scss?tag=six-dropdown&encapsulation=shadow","src/components/six-dropdown/six-dropdown.tsx","src/components/six-menu/six-menu.scss?tag=six-menu&encapsulation=shadow","src/components/six-menu/six-menu.tsx"],"sourcesContent":["export function isTabbable(el: HTMLElement) {\n const tabIndex = el.tabIndex;\n return tabIndex > -1;\n}\n\nexport function getNearestTabbableElement(el: HTMLElement): HTMLElement | undefined {\n // Check the element\n if (isTabbable(el)) {\n return el;\n }\n\n // Check the element's shadow root\n if (el.shadowRoot != null) {\n const tabbableShadowChild = [...el.shadowRoot.children].find((e) => isTabbable(e as HTMLElement)) as HTMLElement;\n if (tabbableShadowChild != null) {\n return tabbableShadowChild;\n }\n }\n\n // Check the element's children\n if (el.children != null) {\n return [...el.children].map((e) => getNearestTabbableElement(e as HTMLElement)).at(0);\n }\n\n return undefined;\n}\n","@import 'src/global/component';\n@import 'src/global/mixins/scrollbar';\n\n:host {\n display: inline-block;\n}\n\n.dropdown {\n position: relative;\n}\n\n.dropdown__trigger {\n display: block;\n}\n\n.dropdown__positioner {\n position: absolute;\n z-index: var(--six-z-index-dropdown);\n\n &__filtered {\n width: 100%;\n }\n}\n\n.dropdown__panel {\n font-family: var(--six-font-sans);\n font-size: var(--six-font-size-small);\n font-weight: var(--six-font-weight-normal);\n color: var(--color);\n background-color: var(--six-panel-background-color);\n border-radius: var(--six-border-radius-medium);\n border: 1px solid var(--six-color-web-rock-300);\n box-shadow: var(--six-shadow-small);\n opacity: 0;\n pointer-events: none;\n transform: scale(0.9);\n transition:\n var(--six-transition-fast) opacity,\n var(--six-transition-fast) transform;\n max-width: 90vw;\n}\n\n.dropdown__panel__scroll {\n max-height: 18.75rem;\n overflow-y: auto;\n overflow-x: hidden;\n overscroll-behavior: none;\n\n &--virtual {\n overflow-y: hidden;\n overflow-x: hidden;\n }\n}\n\n.filter-hidden {\n display: none;\n}\n\n.dropdown__positioner {\n &[data-popper-placement^='top'] .dropdown__panel {\n transform-origin: bottom;\n }\n\n &[data-popper-placement^='bottom'] .dropdown__panel {\n transform-origin: top;\n }\n\n &[data-popper-placement^='left'] .dropdown__panel {\n transform-origin: right;\n }\n\n &[data-popper-placement^='right'] .dropdown__panel {\n transform-origin: left;\n }\n\n &.popover-visible .dropdown__panel {\n opacity: 1;\n transform: none;\n pointer-events: all;\n }\n}\n\n.filter {\n border-bottom: 1px solid var(--six-color-web-rock-300);\n\n &__icon {\n color: var(--six-color-web-rock-600);\n }\n}\n","import { Component, Element, Event, EventEmitter, h, Method, Prop, State, Watch } from '@stencil/core';\nimport { getNearestTabbableElement } from '../../utils/tabbable';\nimport Popover from '../../utils/popover';\nimport { EventListeners } from '../../utils/event-listeners';\nimport { debounce, DEFAULT_DEBOUNCE_FAST } from '../../utils/execution-control';\nimport { EmptyPayload } from '../../utils/types';\nimport { SixMenuItemData } from '../six-menu/six-menu';\n\nexport interface SixDropdownAutoFilterPayload {\n filterValue: string;\n}\n\nexport interface SixDropdownAsyncFilterPayload {\n filterValue: string;\n}\n\nexport interface SixDropdownScrollPayload {\n scrollHeight: number;\n scrollTop: number;\n scrollbarHeight: number;\n scrollRatio: number;\n}\n\nlet id = 0;\n\n/**\n * @since 1.0\n * @status stable\n *\n * Forked from https://github.com/shoelace-style/shoelace version v2.0.0-beta27.\n *\n * @slot trigger - The dropdown's trigger, usually a `<six-button>` element.\n * @slot dropdown-footer - The dropdown's footer area.\n * @slot - The dropdown's content.\n *\n * @part base - The component's base wrapper.\n * @part trigger - The container that wraps the trigger.\n * @part panel - The panel that gets shown when the dropdown is open.\n */\n\n@Component({\n tag: 'six-dropdown',\n styleUrl: 'six-dropdown.scss',\n shadow: true,\n})\nexport class SixDropdown {\n private componentId = `dropdown-${++id}`;\n private isVisible = false;\n private panel?: HTMLElement;\n private scrollPanel?: HTMLElement;\n private panelSlot?: HTMLSlotElement;\n private positioner?: HTMLElement;\n private popoverHelper?: Popover;\n private trigger?: HTMLElement;\n private triggerSlot?: HTMLSlotElement;\n private resizeObserver = new ResizeObserver(debounce(() => this.updatePanelPosition(), 100));\n\n // the input element shown in the dropdown when filter is set to true\n private filterInputElement?: HTMLSixInputElement;\n\n @Element() host!: HTMLSixDropdownElement;\n\n /** Indicates whether the dropdown is open. You can use this in lieu of the show/hide methods. */\n @Prop({ mutable: true, reflect: true }) open = false;\n\n /**\n * The preferred placement of the dropdown panel. Note that the actual placement may vary as needed to keep the panel\n * inside the viewport.\n */\n @Prop() placement:\n | 'top'\n | 'top-start'\n | 'top-end'\n | 'bottom'\n | 'bottom-start'\n | 'bottom-end'\n | 'right'\n | 'right-start'\n | 'right-end'\n | 'left'\n | 'left-start'\n | 'left-end' = 'bottom-start';\n\n /** Determines whether the dropdown should hide when a menu item is selected. */\n // eslint-disable-next-line @stencil-community/ban-default-true\n @Prop() closeOnSelect = true;\n\n /** The distance in pixels from which to offset the panel away from its trigger. */\n @Prop() distance = 4;\n\n /** The distance in pixels from which to offset the panel along its trigger. */\n @Prop() skidding = 0;\n\n /**\n * Enable this option to prevent the panel from being clipped when the component is placed inside a container with\n * `overflow: auto|scroll`.\n */\n @Prop() hoist = false;\n\n /** The dropdown will close when the user interacts outside of this element (e.g. clicking). */\n @Prop() containingElement?: HTMLElement;\n\n /**\n * Set to true to allow auto filtering for entries in the dropdown.\n * With this flag the dropdown will automatically filter itsel.\n * If you need to coordinate the shown elements yourself,\n * e.g. because you need to call an endpoint use asyncFilter instead\n */\n @Prop() filter = false;\n\n /**\n * Set to true to allow async filtering.\n * When you enter something in the search field the component will only emit an event but not filter any elements itself.\n * You can then simply listen to the 'six-async-filter-fired' event to manage the shown menu-items yourself\n */\n @Prop() asyncFilter = false;\n\n /** The filter's placeholder text. */\n @Prop() filterPlaceholder = 'Filter...';\n\n /** By default the search field will be focused when opening a dropdown with filtering enabled. */\n // eslint-disable-next-line @stencil-community/ban-default-true\n @Prop() autofocusFilter = true;\n\n get filterEnabled() {\n return this.filter || this.asyncFilter;\n }\n\n /** The debounce for the filter callbacks. */\n @Prop({ mutable: true }) filterDebounce = 0;\n\n /** The panel can be opend/closed by pressing the spacebar or the enter key. In some cases you might want to avoid this */\n @Prop() disableHideOnEnterAndSpace = false;\n\n /** Set the options to be shown in the dropdown (alternative to setting the elements via html)*/\n @Prop({ mutable: true }) options: SixMenuItemData[] = [];\n\n /** Defines whether the menu list will be rendered virtually i.e. only the elements actually shown (and a couple around)\n * are actually rendered in the DOM. If you use virtual scrolling pass the elements via prop instead of via slot. */\n @Prop() virtualScroll = false;\n\n /**\n * Determines if the dropdown panel's width should match the width of the trigger element.\n *\n * If set to `true`, the panel will resize its width to align with the trigger's width.\n * If `false` or omitted, the panel will maintain its default width.\n */\n @Prop() matchTriggerWidth = false;\n\n get container() {\n return this.containingElement || this.host;\n }\n\n /** Emitted when the dropdown opens. Calling `event.preventDefault()` will prevent it from being opened. */\n @Event({ eventName: 'six-dropdown-show' }) sixShow!: EventEmitter<EmptyPayload>;\n\n /** Emitted after the dropdown opens and all transitions are complete. */\n @Event({ eventName: 'six-dropdown-after-show' }) sixAfterShow!: EventEmitter<EmptyPayload>;\n\n /** Emitted when the dropdown closes. Calling `event.preventDefault()` will prevent it from being closed. */\n @Event({ eventName: 'six-dropdown-hide' }) sixHide!: EventEmitter<EmptyPayload>;\n\n /** Emitted after the dropdown closes and all transitions are complete. */\n @Event({ eventName: 'six-dropdown-after-hide' }) sixAfterHide!: EventEmitter<EmptyPayload>;\n\n /** Emitted when the auto filter is triggered */\n @Event({ eventName: 'six-dropdown-auto-filter-fired' }) sixAutoFilter!: EventEmitter<SixDropdownAutoFilterPayload>;\n\n /** Emitted when the async filter is triggered */\n @Event({ eventName: 'six-async-filter-fired' }) sixAsyncFilterFired!: EventEmitter<SixDropdownAsyncFilterPayload>;\n\n /** Emitted when the user scrolls inside dropdown panel.*/\n @Event({ eventName: 'six-dropdown-scroll' }) sixScroll!: EventEmitter<SixDropdownScrollPayload>;\n\n private eventListeners = new EventListeners();\n\n // internal representation of options, so we don't have to make options mutable\n @State() renderedOptions: SixMenuItemData[] = [];\n\n @Watch('open')\n handleOpenChange() {\n this.open ? this.show() : this.hide();\n this.updateAccessibleTrigger();\n }\n\n @Watch('distance')\n @Watch('hoist')\n @Watch('placement')\n @Watch('skidding')\n handlePopoverOptionsChange() {\n if (this.popoverHelper == null) return;\n\n this.popoverHelper.setOptions({\n strategy: this.hoist ? 'fixed' : 'absolute',\n placement: this.placement,\n distance: this.distance,\n skidding: this.skidding,\n });\n }\n\n @Watch('options')\n @Watch('virtualScroll')\n handleOptionsChange() {\n this.validateOptions();\n }\n\n private validateOptions() {\n if (!Array.isArray(this.options)) {\n this.options = [];\n }\n if (this.virtualScroll && this.options.length === 0) {\n console.error('Options must be defined when using virtual scrolling');\n }\n this.renderedOptions = [...this.options];\n }\n\n componentWillLoad() {\n this.validateOptions();\n if (this.asyncFilter) {\n this.filterDebounce = DEFAULT_DEBOUNCE_FAST;\n }\n }\n\n componentDidLoad() {\n this.init();\n if (this.open) {\n void this.show();\n }\n }\n\n connectedCallback() {\n this.init();\n }\n\n private init() {\n this.initPopover();\n\n // listen to filter\n const filterInputElement = this.filterInputElement;\n if (filterInputElement != null) {\n this.eventListeners.add(\n filterInputElement,\n 'six-input-input',\n debounce(() => {\n const filterValue = filterInputElement.value ?? '';\n if (this.filter) {\n this.applyFilter(filterValue);\n }\n this.emitFilterEvents(filterValue);\n }, this.filterDebounce)\n );\n }\n }\n\n private applyFilter(filterTerm: string) {\n const lowerCaseFilterTerm = filterTerm.toLowerCase()?.trim() || '';\n if (this.options.length > 0) {\n this.renderedOptions = this.options.filter(\n (option) =>\n (option.label && String(option.label)?.toLowerCase()?.includes(lowerCaseFilterTerm)) ||\n (option.value && String(option.value)?.toLowerCase()?.includes(lowerCaseFilterTerm))\n );\n } else {\n const { selectionContainerItems, sixMenuItems } = this.getMenuItems();\n const selectionContainerValues = selectionContainerItems.map((s) => s.value);\n\n // Filter items in selection container\n selectionContainerItems.forEach(async (menuItem) => {\n menuItem.style.display = (await containsFilterTerm(menuItem, lowerCaseFilterTerm)) ? 'unset' : 'none';\n });\n\n // Filter other items. Always hide items which contained in the selection container.\n sixMenuItems.forEach(async (menuItem) => {\n menuItem.style.display =\n (await containsFilterTerm(menuItem, lowerCaseFilterTerm)) &&\n !selectionContainerValues.includes(menuItem.value)\n ? 'unset'\n : 'none';\n });\n }\n }\n\n private resetFilter() {\n if (this.filterInputElement != null) {\n this.filterInputElement.value = '';\n this.emitFilterEvents('');\n }\n if (this.options.length > 0) {\n this.renderedOptions = [...this.options];\n } else {\n const { selectionContainerItems, sixMenuItems } = this.getMenuItems();\n [...selectionContainerItems, ...sixMenuItems].forEach((item) => (item.style.display = 'unset'));\n }\n }\n\n private emitFilterEvents(filterValue: string) {\n if (this.filter) {\n this.sixAutoFilter.emit({ filterValue });\n } else if (this.asyncFilter) {\n this.sixAsyncFilterFired.emit({ filterValue });\n }\n }\n\n private initPopover() {\n if (this.trigger == null || this.positioner == null) return;\n this.popoverHelper = new Popover(this.trigger, this.positioner, {\n strategy: this.hoist ? 'fixed' : 'absolute',\n placement: this.placement,\n distance: this.distance,\n skidding: this.skidding,\n transitionElement: this.panel,\n onAfterHide: () => {\n if (this.filterEnabled) {\n this.resetFilter();\n }\n this.sixAfterHide.emit();\n },\n onAfterShow: async () => {\n this.sixAfterShow.emit();\n },\n onTransitionEnd: () => {\n if (!this.open && this.scrollPanel != null) {\n this.scrollPanel.scrollTop = 0;\n }\n },\n });\n }\n\n private getMenuItems = (): {\n selectionContainerItems: HTMLSixMenuItemElement[];\n sixMenuItems: HTMLSixMenuItemElement[];\n } => {\n if (this.options.length > 0) {\n return {\n sixMenuItems: this.renderedOptions.map((option) => (\n <six-menu-item value={option.value}>{option.label}</six-menu-item>\n )),\n selectionContainerItems: [],\n };\n }\n if (this.panel == null) return { sixMenuItems: [], selectionContainerItems: [] };\n\n // Relies on the implementation of six-select. Its dropdown slot contains two elements,\n // one for the selected menu items, and one for the other items.\n const selectionContainer = this.panelSlot?.assignedElements({ flatten: true }).filter(isSelectionContainer).at(0);\n const sixMenuElement = this.panelSlot?.assignedElements({ flatten: true }).filter(isSixMenu).at(0) as\n | HTMLSixMenuElement\n | undefined;\n const selectionContainerItems = selectionContainer?.querySelectorAll('six-menu-item') || [];\n let sixMenuItems: HTMLSixMenuItemElement[] =\n sixMenuElement\n ?.querySelector('slot')\n ?.assignedElements()\n .filter((el): el is HTMLSixMenuItemElement => isSixMenuItem(el)) || [];\n\n if (sixMenuItems.length === 0) {\n sixMenuItems = Array.from(sixMenuElement?.shadowRoot?.querySelectorAll('six-menu-item') || []);\n }\n\n if (selectionContainerItems.length > 0 || sixMenuItems.length > 0) {\n return { sixMenuItems, selectionContainerItems: [...selectionContainerItems] };\n } else {\n return {\n sixMenuItems: sixMenuElement ? Array.from(sixMenuElement.querySelectorAll('six-menu-item')) : [],\n selectionContainerItems: [],\n };\n }\n };\n\n disconnectedCallback() {\n this.resizeObserver.disconnect();\n this.eventListeners.removeAll();\n void this.hide();\n this.popoverHelper?.destroy();\n this.popoverHelper = undefined;\n }\n\n /** Shows the dropdown panel */\n @Method()\n async show() {\n // Prevent subsequent calls to the method, whether manually or triggered by the `open` watcher\n if (this.isVisible || this.popoverHelper == null || this.panel == null) {\n return;\n }\n\n const sixShow = this.sixShow.emit();\n if (sixShow.defaultPrevented) {\n this.open = false;\n return;\n }\n\n this.eventListeners.add(this.panel, 'six-menu-item-selected', this.handlePanelSelect);\n this.eventListeners.add(document, 'keydown', this.handleDocumentKeyDown);\n this.eventListeners.add(document, 'mousedown', this.handleDocumentMouseDown);\n\n this.isVisible = true;\n this.open = true;\n\n if (this.trigger != null) {\n this.resizeObserver.observe(this.trigger);\n }\n this.updatePanelPosition();\n this.popoverHelper.show();\n\n if (this.filterEnabled && this.autofocusFilter) {\n requestAnimationFrame(() => {\n this.filterInputElement?.setFocus();\n });\n }\n }\n\n /**\n * Set min width of dropdown panel to the width of the trigger element\n */\n private updatePanelPosition() {\n if (!this.open) {\n return;\n }\n\n if (this.matchTriggerWidth && this.trigger != null && this.panel != null) {\n const width = this.trigger.getBoundingClientRect().width;\n this.panel.style.minWidth = `${width}px`;\n }\n\n if (this.popoverHelper != null) {\n this.popoverHelper.reposition();\n }\n }\n\n /** Hides the dropdown panel */\n @Method()\n async hide() {\n this.resizeObserver.disconnect();\n\n // Prevent subsequent calls to the method, whether manually or triggered by the `open` watcher\n if (!this.isVisible || this.panel == null || this.popoverHelper == null) {\n return;\n }\n\n const sixHide = this.sixHide.emit();\n if (sixHide.defaultPrevented) {\n this.open = true;\n return;\n }\n\n this.eventListeners.remove(this.panel, 'six-menu-item-selected', this.handlePanelSelect);\n this.eventListeners.remove(document, 'keydown', this.handleDocumentKeyDown);\n this.eventListeners.remove(document, 'mousedown', this.handleDocumentMouseDown);\n\n this.isVisible = false;\n this.open = false;\n this.popoverHelper.hide();\n }\n\n private focusOnTrigger() {\n if (this.trigger == null) return;\n const trigger = this.triggerSlot?.assignedElements({ flatten: true }).at(0) as HTMLSixButtonElement | undefined;\n if (trigger != null) {\n if (typeof trigger.setFocus === 'function') {\n trigger.setFocus();\n } else if (typeof trigger.focus === 'function') {\n trigger.focus();\n }\n }\n }\n\n private getMenu(): HTMLSixMenuElement | undefined {\n return this.panelSlot?.assignedElements({ flatten: true }).filter(isSixMenu).at(0) as\n | HTMLSixMenuElement\n | undefined;\n }\n\n private handleDocumentKeyDown = (event: Event) => {\n const keyboardEvent = event as KeyboardEvent;\n // Close when escape is pressed\n if (keyboardEvent.key === 'Escape') {\n void this.hide();\n this.focusOnTrigger();\n return;\n }\n\n if (this.filterInputElement === this.host.shadowRoot?.activeElement) {\n if (keyboardEvent.key === 'ArrowDown') {\n const { sixMenuItems, selectionContainerItems } = this.getMenuItems();\n const item = [...selectionContainerItems, ...sixMenuItems].find((item) => item.style.display !== 'none');\n if (item != null) {\n item.setFocus();\n }\n }\n }\n\n // Handle tabbing\n if (keyboardEvent.key === 'Tab') {\n // Tabbing within an open menu should close the dropdown and refocus the trigger\n if (this.open && document.activeElement != null && isSixMenuItem(document.activeElement)) {\n keyboardEvent.preventDefault();\n void this.hide();\n this.focusOnTrigger();\n return;\n }\n\n // Tabbing outside the containing element closes the panel\n //\n // If the dropdown is used within a shadow DOM, we need to obtain the activeElement within that shadowRoot,\n // otherwise `document.activeElement` will only return the name of the parent shadow DOM element.\n setTimeout(() => {\n const activeElement =\n this.container.getRootNode() instanceof ShadowRoot\n ? document.activeElement?.shadowRoot?.activeElement\n : document.activeElement;\n\n if (activeElement?.closest(this.container.tagName.toLowerCase()) !== this.container) {\n void this.hide();\n return;\n }\n });\n }\n };\n\n private handleDocumentMouseDown = (event: Event) => {\n // Close when clicking outside the containing element\n const path = event.composedPath() as EventTarget[];\n if (!path.includes(this.container)) {\n void this.hide();\n return;\n }\n };\n\n private handlePanelSelect = (event: Event) => {\n const target = event.target as HTMLElement;\n\n // Hide the dropdown when a menu item is selected\n if (this.closeOnSelect && isSixMenu(target)) {\n void this.hide();\n this.focusOnTrigger();\n }\n };\n\n private handleTriggerClick = () => {\n this.open ? this.hide() : this.show();\n };\n\n private handleTriggerKeyDown = (event: KeyboardEvent) => {\n // Close when escape or tab is pressed\n if (event.key === 'Escape') {\n this.focusOnTrigger();\n void this.hide();\n return;\n }\n\n // When spacebar/enter is pressed, show the panel but don't focus on the menu. This let's the user press the same\n // key again to hide the menu in case they don't want to make a selection.\n if (!this.disableHideOnEnterAndSpace && [' ', 'Enter'].includes(event.key)) {\n event.preventDefault();\n this.open ? void this.hide() : void this.show();\n return;\n }\n\n const menu = this.getMenu();\n\n // When up/down is pressed, we make the assumption that the user is familiar with the menu and plans to make a\n // selection. Rather than toggle the panel, we focus on the menu (if one exists) and activate the first item for\n // faster navigation.\n if (['ArrowDown', 'ArrowUp'].includes(event.key)) {\n event.preventDefault();\n\n // Show the menu if it's not already open\n if (!this.open) {\n void this.show();\n }\n\n if (menu == null) {\n return;\n }\n const menuItems = [...menu.querySelectorAll('six-menu-item')];\n const firstMenuItem = menuItems.at(0);\n const lastMenuItem = menuItems.at(menuItems.length - 1);\n\n // Focus on a menu item\n if (event.key === 'ArrowDown' && firstMenuItem != null) {\n firstMenuItem.setFocus();\n return;\n }\n\n if (event.key === 'ArrowUp' && lastMenuItem != null) {\n lastMenuItem.setFocus();\n return;\n }\n }\n\n // Other keys bring focus to the menu and initiate type-to-select behavior\n const ignoredKeys = ['Tab', 'Shift', 'Meta', 'Ctrl', 'Alt'];\n if (this.open && menu != null && !ignoredKeys.includes(event.key)) {\n void menu.typeToSelect(event.key);\n return;\n }\n };\n\n private handleTriggerKeyUp = (event: KeyboardEvent) => {\n // Prevent space from triggering a click event in Firefox\n if (event.key === ' ') {\n event.preventDefault();\n }\n };\n\n private handleTriggerSlotChange = () => {\n this.updateAccessibleTrigger();\n };\n\n private handleDropdownScroll = () => {\n if (this.scrollPanel == null) return;\n\n this.sixScroll.emit({\n scrollHeight: this.scrollPanel.scrollHeight,\n scrollTop: this.scrollPanel.scrollTop,\n scrollbarHeight: this.scrollPanel.offsetHeight * (this.scrollPanel.offsetHeight / this.scrollPanel.scrollHeight),\n scrollRatio: this.scrollPanel.scrollTop / (this.scrollPanel.scrollHeight - this.scrollPanel.clientHeight),\n });\n };\n\n //\n // Slotted triggers can be arbitrary content, but we need to link them to the dropdown panel with `aria-haspopup` and\n // `aria-expanded`. These must be applied to the \"accessible trigger\" (the tabbable portion of the trigger element\n // that gets slotted in) so screen readers will understand them. The accessible trigger could be the slotted element,\n // a child of the slotted element, or an element in the slotted element's shadow root.\n //\n // For example, the accessible trigger of an <sl-button> is a <button> located inside its shadow root.\n //\n // To determine this, we assume the first tabbable element in the trigger slot is the \"accessible trigger.\"\n //\n private updateAccessibleTrigger() {\n if (this.trigger == null) return;\n const assignedElements = (this.triggerSlot?.assignedElements({ flatten: true }) || []) as HTMLElement[];\n const accessibleTrigger = assignedElements.map(getNearestTabbableElement).at(0);\n if (accessibleTrigger != null) {\n accessibleTrigger.setAttribute('aria-haspopup', 'true');\n accessibleTrigger.setAttribute('aria-expanded', this.open ? 'true' : 'false');\n }\n }\n\n render() {\n return (\n <div\n part=\"base\"\n id={this.componentId}\n class={{\n dropdown: true,\n 'dropdown--open': this.open,\n }}\n >\n <span\n part=\"trigger\"\n class=\"dropdown__trigger\"\n ref={(el) => (this.trigger = el)}\n onClick={this.handleTriggerClick}\n onKeyDown={this.handleTriggerKeyDown}\n onKeyUp={this.handleTriggerKeyUp}\n >\n <slot\n name=\"trigger\"\n ref={(el) => (this.triggerSlot = el as HTMLSlotElement)}\n onSlotchange={this.handleTriggerSlotChange}\n />\n </span>\n\n {/* Position the panel with a wrapper since the popover makes use of `translate`. This let's us add transitions\n on the panel without interfering with the position. */}\n <div\n ref={(el) => (this.positioner = el)}\n class={{\n dropdown__positioner: true,\n dropdown__positioner__filtered: (this.filter || this.asyncFilter) && !this.hoist,\n }}\n >\n <div\n ref={(el) => (this.panel = el)}\n part=\"panel\"\n class=\"dropdown__panel\"\n role=\"menu\"\n aria-hidden={this.open ? 'false' : 'true'}\n aria-labelledby={this.componentId}\n >\n {this.filterEnabled && (\n <six-input\n class={{\n filter: true,\n 'filter-hidden': !this.open,\n }}\n dropdown-search\n aria-hidden={this.open ? 'false' : 'true'}\n ref={(el) => (this.filterInputElement = el)}\n placeholder={this.filterPlaceholder}\n >\n <six-icon class=\"filter__icon\" slot=\"suffix\" size=\"small\">\n search\n </six-icon>\n </six-input>\n )}\n <div\n class={{\n dropdown__panel__scroll: true,\n 'dropdown__panel__scroll--virtual': this.virtualScroll,\n }}\n onScroll={this.handleDropdownScroll}\n ref={(el) => (this.scrollPanel = el)}\n >\n <slot ref={(el) => (this.panelSlot = el as HTMLSlotElement)} />\n {this.options.length > 0 && (\n <six-menu part=\"menu\" items={this.renderedOptions} virtualScroll={this.virtualScroll}></six-menu>\n )}\n </div>\n <slot name=\"dropdown-footer\"></slot>\n </div>\n </div>\n </div>\n );\n }\n}\n\nfunction isSixMenu(el?: Element): boolean {\n return el?.tagName.toLowerCase() === 'six-menu';\n}\nfunction isSixMenuItem(el?: Element): boolean {\n return el?.tagName.toLowerCase() === 'six-menu-item';\n}\nfunction isSelectionContainer(el?: Element): boolean {\n return el?.getAttribute('class')?.includes('selection-container') || false;\n}\nasync function containsFilterTerm(menuItem: HTMLSixMenuItemElement, lowerCaseFilterTerm: string): Promise<boolean> {\n return (\n menuItem.value.toLowerCase().includes(lowerCaseFilterTerm) ||\n (await menuItem.getTextLabel()).toLowerCase().includes(lowerCaseFilterTerm)\n );\n}\n","@import 'src/global/component';\n\n:host {\n display: block;\n}\n\n.menu {\n padding: var(--six-spacing-xx-small) 0;\n border: none;\n box-shadow: var(--six-shadow-small);\n overflow-y: auto;\n overflow-x: hidden;\n}\n\n.menu:focus {\n outline: none;\n}\n\n.no-shadow {\n box-shadow: none;\n}\n","import { Component, Element, Event, EventEmitter, h, Method, Prop, State } from '@stencil/core';\nimport { getTextContent } from '../../utils/slot';\nimport { StyleDeclaration } from '../../utils/types';\nimport { EventListeners } from '../../utils/event-listeners';\nimport { debounce } from '../../utils/execution-control';\n\nexport interface SixMenuItemData {\n label: string;\n value: string;\n}\n\nexport interface SixMenuItemSelectedPayload {\n name: string;\n item: HTMLSixMenuItemElement;\n}\n\nconst isFocusedMenuItem = (menuItem: HTMLSixMenuItemElement) =>\n menuItem?.shadowRoot?.querySelector('.menu-item')?.classList?.contains('menu-item--focused');\n\nconst isSIXMenuItemElement = (el?: Element): el is HTMLSixMenuItemElement =>\n el?.tagName.toLowerCase() === 'six-menu-item';\n\nconst mapToMenuItem = ({ value, label }: SixMenuItemData) => (\n <six-menu-item key={value} value={value}>\n {label}\n </six-menu-item>\n);\n\nconst DEFAULT_NUMBER_OF_ITEMS_SHOWN_FOR_VIRTUAL_SCROLLING = 5;\nconst DEFAULT_SIX_MENU_ITEM_HEIGHT_FOR_VIRTUAL_SCROLLING = 48;\nconst DEFAULT_SIX_MENU_ITEM_HEIGHT = 64;\n\n/**\n * @since 1.0\n * @status stable\n *\n * Forked from https://github.com/shoelace-style/shoelace version v2.0.0-beta27.\n *\n * @slot - The menu's content, including menu items, menu dividers, and menu labels.\n *\n * @part base - The component's base wrapper.\n */\n@Component({\n tag: 'six-menu',\n styleUrl: 'six-menu.scss',\n shadow: true,\n})\nexport class SixMenu {\n private readonly eventListeners = new EventListeners();\n\n private menu?: HTMLElement;\n private menuWrapper?: HTMLElement;\n private typeToSelectString = '';\n private typeToSelectTimeout?: number;\n\n @Element() host!: HTMLSixMenuElement;\n\n /** Emitted when a menu item is selected. */\n @Event({ eventName: 'six-menu-item-selected' }) sixMenuItemSelected!: EventEmitter<SixMenuItemSelectedPayload>;\n\n /** Set to true to remove the box-shadow */\n @Prop() removeBoxShadow = false;\n\n /** Set the options to be shown in the dropdown */\n @Prop() items: SixMenuItemData[] | null = null;\n\n /** Defines how many items should be shown. If the number of items is larger than this property a scrollbar will be shown */\n @Prop() itemsShown?: number;\n\n /** Defines whether the menu list will be rendered virtually i.e. only the elements actually shown (and a couple around)\n * are actually rendered in the DOM. If you use virtual scrolling pass the elements via prop instead of via slot. */\n @Prop() virtualScroll = false;\n\n /**\n * Used for virtual scrolling\n * Define how many items should be rendered in the DOM when using virtual scrolling\n */\n @Prop() itemSize = 10;\n\n /**\n * Used for virtual scrolling\n * Define the debounce for listening on scrolling changes in milliseconds.\n * The lower the number the more sensitive the component reacts to scrolling changes.\n */\n @Prop() scrollingDebounce = 15;\n\n /**\n * Internal: Disables handling of key presses.\n */\n @Prop() disableKeyboardHandling = false;\n\n /**\n * Used to calculate which items should be rendered in the DOM\n */\n @State()\n private scrollingIndex = 0;\n\n // set a default item height, this variable will be updated with the real value after the first render.\n // However, it's necessary to have a default value because we can only fetch the proper height after the first render\n @State()\n private sixMenuItemHeight = this.virtualScroll\n ? DEFAULT_SIX_MENU_ITEM_HEIGHT_FOR_VIRTUAL_SCROLLING\n : DEFAULT_SIX_MENU_ITEM_HEIGHT;\n\n connectedCallback() {\n this.handleClick = this.handleClick.bind(this);\n this.handleKeyDown = this.handleKeyDown.bind(this);\n }\n\n componentWillLoad() {\n if (this.items === null) {\n return;\n }\n }\n\n private handleScrolling = () => {\n if (this.menuWrapper == null) return;\n // for performance improvements we only update the DOM if the scrollRatio change \"enough\"\n this.scrollingIndex = Math.floor(this.menuWrapper.scrollTop / this.sixMenuItemHeight);\n };\n\n componentDidLoad() {\n this.setupForVirtualScrollingAfterRendering();\n }\n\n disconnectedCallback() {\n this.eventListeners.removeAll();\n }\n\n /**\n * Initiates type-to-select logic, which automatically selects an option based on what the user is currently typing.\n * The key passed will be appended to the internal query and the selection will be updated. After a brief period, the\n * internal query is cleared automatically. This method is intended to be used with the keydown event. Useful for\n * enabling type-to-select when the menu doesn't have focus.\n */\n @Method()\n async typeToSelect(key: string) {\n clearTimeout(this.typeToSelectTimeout);\n // eslint-disable-next-line @typescript-eslint/ban-ts-comment\n // @ts-ignore\n this.typeToSelectTimeout = setTimeout(() => (this.typeToSelectString = ''), 750);\n this.typeToSelectString += key.toLowerCase();\n const items = this.getItems();\n for (const item of items) {\n const slot = item.shadowRoot?.querySelector('slot:not([name])') as HTMLSlotElement;\n const label = getTextContent(slot).toLowerCase().trim();\n if (label.substring(0, this.typeToSelectString.length) === this.typeToSelectString) {\n item.setFocus();\n break;\n }\n }\n }\n\n private getItemsShown(): number {\n const defaultItemsShown = this.virtualScroll ? DEFAULT_NUMBER_OF_ITEMS_SHOWN_FOR_VIRTUAL_SCROLLING : 0;\n if (this.items && this.items.length === 1) {\n return 0;\n }\n return this.itemsShown ?? defaultItemsShown;\n }\n\n private setupForVirtualScrollingAfterRendering() {\n if (!this.virtualScroll || this.menuWrapper == null) return;\n\n this.eventListeners.add(this.menuWrapper, 'scroll', debounce(this.handleScrolling, this.scrollingDebounce));\n\n // set menu height to proper height once the item is rendered.\n const menuItemHeight = this.menu?.querySelector('six-menu-item')?.clientHeight;\n if (menuItemHeight != null && menuItemHeight > 0) {\n this.sixMenuItemHeight = menuItemHeight;\n }\n }\n\n private getItems(): HTMLSixMenuItemElement[] {\n if (this.menu == null) return [];\n\n if (this.items != null) {\n return this.items.map(mapToMenuItem);\n }\n\n const slot = this.menu.querySelector('slot');\n if (slot == null) return [];\n return [...slot.assignedElements({ flatten: true })].filter(\n (el): el is HTMLSixMenuItemElement => isSIXMenuItemElement(el) && !el.disabled\n );\n }\n\n private getActiveItemIndex() {\n const items = this.getItems();\n const selectedItem = this.getActiveItem();\n if (selectedItem != null) {\n const itemIndex = items.indexOf(selectedItem);\n if (itemIndex > -1) {\n return itemIndex;\n }\n }\n const sixMenuItems = this.extractItemsFromDOM();\n return sixMenuItems.findIndex(isFocusedMenuItem);\n }\n\n private getActiveItem(): HTMLSixMenuItemElement | undefined {\n const activeElement = this.getItems().find((i) => i === document.activeElement);\n if (activeElement != null) {\n return activeElement;\n }\n return this.extractItemsFromDOM()?.find(isFocusedMenuItem);\n }\n\n private extractItemsFromDOM() {\n return Array.from(this.host.shadowRoot?.querySelectorAll('six-menu-item') ?? []);\n }\n\n private setActiveItem(item: HTMLSixMenuItemElement) {\n item?.setFocus();\n }\n\n private handleClick(event: MouseEvent) {\n const target = event.target as HTMLElement;\n const clickedItem = target.closest('six-menu-item');\n if (clickedItem && !clickedItem.disabled) {\n this.sixMenuItemSelected.emit({ name: clickedItem.value, item: clickedItem });\n }\n }\n\n private handleKeyDown(event: KeyboardEvent) {\n if (this.disableKeyboardHandling) {\n return;\n }\n\n // Make a selection when pressing enter\n if (event.key === 'Enter') {\n const activeItem = this.getActiveItem();\n event.preventDefault();\n\n if (activeItem != null) {\n this.sixMenuItemSelected.emit({ name: activeItem.value, item: activeItem });\n }\n }\n\n // Prevent scrolling when space is pressed\n if (event.key === ' ') {\n event.preventDefault();\n }\n\n // Move the selection when pressing down or up\n if (['ArrowDown', 'ArrowUp', 'Home', 'End'].includes(event.key)) {\n const items = this.items === null ? this.getItems() : this.extractItemsFromDOM();\n\n let indexOfActiveItem = this.getActiveItemIndex();\n\n if (items.length > 0) {\n event.preventDefault();\n\n if (event.key === 'ArrowDown') {\n indexOfActiveItem++;\n } else if (event.key === 'ArrowUp') {\n indexOfActiveItem--;\n } else if (event.key === 'Home') {\n indexOfActiveItem = 0;\n } else if (event.key === 'End') {\n indexOfActiveItem = items.length - 1;\n }\n\n if (indexOfActiveItem < 0) indexOfActiveItem = 0;\n if (indexOfActiveItem > items.length - 1) indexOfActiveItem = items.length - 1;\n\n this.setActiveItem(items[indexOfActiveItem]);\n\n return;\n }\n }\n\n void this.typeToSelect(event.key);\n }\n\n private getMenuWrapperStyle() {\n const styles: Partial<StyleDeclaration> = {};\n if (this.getItemsShown() > 0) {\n // calculate the proper height to show the correct number of items\n styles.height = `${(this.getItemsShown() ?? 0) * this.sixMenuItemHeight}px`;\n } else if (this.items && this.items.length === 1) {\n styles.height = 'auto';\n }\n return {\n ...styles,\n };\n }\n\n private getMenuContainerStyle() {\n const styles: Partial<StyleDeclaration> = {};\n\n if (this.virtualScroll) {\n // calculate height of content are if all items would be rendered so the scrollbar has the proper size\n styles.transform = `translateY(${this.sixMenuItemHeight * this.scrollingIndex}px)`;\n }\n\n return {\n ...styles,\n };\n }\n\n private getScrollbarGhostStyle() {\n const styles: Partial<StyleDeclaration> = {};\n if (this.virtualScroll && this.items !== null && this.items.length > 1) {\n styles.height = `${this.items.length * this.sixMenuItemHeight - this.itemSize * this.sixMenuItemHeight}px`;\n }\n return {\n ...styles,\n };\n }\n\n private renderItems() {\n if (this.items === undefined || this.items === null) {\n return;\n }\n\n if (!this.virtualScroll) {\n return this.items.map(mapToMenuItem);\n }\n\n return this.items\n .slice(this.scrollingIndex, Math.min(this.items.length, this.itemSize + this.scrollingIndex))\n .map(({ value, label }: SixMenuItemData) => (\n <six-menu-item checkType=\"check\" key={value} value={value}>\n {label}\n </six-menu-item>\n ));\n }\n\n render() {\n return (\n <div\n ref={(el) => (this.menuWrapper = el)}\n style={this.getMenuWrapperStyle()}\n part=\"wrapper\"\n class={{\n menu: true,\n 'no-shadow': this.removeBoxShadow,\n }}\n >\n <div\n ref={(el) => (this.menu = el)}\n part=\"base\"\n role=\"menu\"\n onClick={this.handleClick}\n onKeyDown={this.handleKeyDown}\n tabIndex={0}\n style={this.getMenuContainerStyle()}\n >\n <slot />\n {this.renderItems()}\n </div>\n {this.virtualScroll && <div style={this.getScrollbarGhostStyle()} />}\n </div>\n );\n }\n}\n"],"mappings":"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","ignoreList":[]}