import{r as e,c as t,h as i,H as s,g as n}from"./p-4afc0173.js";import{c as a}from"./p-c5b591fd.js";const o=class{constructor(i){e(this,i),this.selected=t(this,"selected",7),this.block=!1,this.compact=!1,this.align="left",this.active="0",this.items=[]}handleSlotChange(){this.computeChildItems()}componentDidLoad(){this.computeChildItems(),this.items.length&&setTimeout((()=>{this.el.querySelectorAll("x-segment-item.active").length||this.selectItem(this.el.querySelectorAll("x-segment-item").item(0))}),10)}selectItem(e){this.el.querySelectorAll("x-segment-item.active").forEach((e=>{e.setAttribute("active","false"),e.classList.remove("active")})),setTimeout((()=>{e.setAttribute("active","true"),e.classList.add("active"),this.active=e.getAttribute("value"),this.selected.emit(this.active)}),10)}computeChildItems(){this.items=Array.from(this.el.querySelector("div").children).filter((e=>"x-segment-item"===e.nodeName.toLowerCase())),this.items.forEach(((e,t)=>{e.hasAttribute("value")||e.setAttribute("value",t.toString()),this.active==e.getAttribute("value")&&this.selectItem(e),e.addEventListener("click",(()=>{this.selectItem(e)}))}))}render(){return i(s,{key:"7c0cbb6883aac02e1d22c3626bcdd2eb5655b1a0",class:a(`segment-${this.align}`,{"segment-block":this.block,"segment-compact":this.compact})},i("div",{key:"3cf7fd1e137762ec43d4e0c9ecc924875202b970",class:"segment-container"},i("slot",{key:"a90a46fe693fee32fe934ad9154b2396ab3f3836"})))}get el(){return n(this)}};o.style="x-segment{display:inline-block;height:50px;position:relative;border-radius:0.5rem;-webkit-transition:0.4s;transition:0.4s;padding:0.35rem;overflow-y:hidden;overflow-x:auto;max-width:100%;background-color:var(--color-default-lucid, #f0f0f0)}x-segment.segment-block{display:block;width:100%}x-segment.segment-compact>div>x-segment-item:not(.active) span{display:none}x-segment.segment-compact>div>x-segment-item:not(.active) x-icon{margin-left:0 !important;margin-right:0 !important}x-segment::-webkit-scrollbar{opacity:0;height:1px}.is-dark-mode x-segment{background-color:var(--color-black-tint)}x-segment.segment-left>div{-ms-flex-pack:start;justify-content:start}x-segment.segment-center>div{-ms-flex-pack:center;justify-content:center}x-segment.segment-right>div{-ms-flex-pack:end;justify-content:end}x-segment.segment-evenly>div{-ms-flex-pack:space-evenly;justify-content:space-evenly}x-segment.segment-between>div{-ms-flex-pack:justify;justify-content:space-between}x-segment>div{padding:0;margin:0;display:-ms-inline-flexbox;display:inline-flex;-ms-flex-align:center;align-items:center;width:100%}x-segment>div>x-segment-item{cursor:pointer;display:-ms-inline-flexbox;display:inline-flex;-ms-flex-pack:center;justify-content:center;-ms-flex-align:center;align-items:center;height:calc(50px - 0.7rem);-webkit-transition:0.4s;transition:0.4s;border-radius:0.45rem;margin-right:0.35rem;padding-left:1rem;padding-right:1rem;color:var(--color-text-tinted);white-space:nowrap}.is-dark-mode x-segment>div>x-segment-item{color:var(--color-text-light-shaded)}x-segment>div>x-segment-item:hover{color:var(--color-text-tint);background-color:rgba(var(--color-default-rgb, 155, 155, 155), 0.2)}.is-dark-mode x-segment>div>x-segment-item:hover{color:var(--color-text-light, #FEFEFE);background-color:var(--color-dark-tinted, #626262)}.is-dark-mode x-segment>div>x-segment-item:hover x-icon{color:var(--color-text-light, #FEFEFE)}x-segment>div>x-segment-item.active{-webkit-box-shadow:0 0 6px rgba(0, 0, 0, 0.1);box-shadow:0 0 6px rgba(0, 0, 0, 0.1);background-color:var(--color-white, #FFFFFF) !important;color:var(--color-text, #4A4A4A) !important}x-segment>div>x-segment-item.active x-icon{color:var(--color-text, #4A4A4A) !important}x-segment>div>x-segment-item:last-child{margin-right:0}x-segment>div>x-segment-item a{color:inherit}x-segment>div>x-segment-item a:hover{color:inherit}x-segment>div>x-segment-item x-icon{color:inherit;font-size:1.25em;margin-left:-0.25rem;margin-right:0.5rem;-webkit-transition:0.3s;transition:0.3s}.is-dark-mode x-segment>div>x-segment-item x-icon{color:var(--color-text-light-shaded, #b2b2b2)}";const r=class{constructor(t){e(this,t),this.value=void 0,this.icon=void 0,this.active=!1}render(){return i(s,{key:"43100829fe22900f8a5626ac66bcaf68aa612830",class:a({active:this.active})},this.icon&&i("x-icon",{key:"cc6d7ed6dfe7f09fcc36e179d23a4a1acac38df3",name:this.icon}),i("span",{key:"166a946369f946869c00c56e1bd01170e521ead3"},i("slot",{key:"e2a590d6d14c50aa6b993f7b6b4e75a3c4cd61e3"})))}get el(){return n(this)}};export{o as x_segment,r as x_segment_item}