https://www.builder.io/assets/material-tabs-4qUmiwV7.js

1import{r,j as o,a,F as s}from"./components-tbqp4LHE.js";import{B as i}from"./builder-CvCrGSQN.js";import{T as p}from"./tab-item-QCyKzIU-.js";import"./render-link-COhm-8b-.js";import"./lib-CNBY53c5.js";import"./errorBoundaries-Cn_iLJG_.js";import"./urls-DKJa5cAz.js";import"./builder-react.es5-EcmpEoh3.js";import"./index-D68R75oZ.js";import"./preload-helper-BXl3LOEh.js";class I extends r.Component{state={activeTab:0};intervalTimer;changeTab(e){this.setState({activeTab:e})}get activeTabSpec(){return this.props.tabs&&this.props.tabs[this.state.activeTab]}componentDidUpdate(e){e.autoRotateTabsInterval!==this.props.autoRotateTabsInterval&&this.resetInterval()}componentDidMount(){this.props.autoRotateTabsInterval&&this.resetInterval()}componentWillUnmount(){this.intervalTimer&&clearInterval(this.intervalTimer)}resetInterval(){this.intervalTimer&&clearInterval(this.intervalTimer),this.props.autoRotateTabsInterval&&typeof window<"u"&&(this.intervalTimer=setInterval(()=>this.rotateTabs(),this.props.autoRotateTabsInterval*1e3))}rotateTabs(){let t=this.state.activeTab+1;t>=this.props.tabs.length&&(t=0),this.setState({activeTab:t})}render(){return o("div",{className:"builder-tabs",css:{display:"flex",flexDirection:"column"},children:[a("div",{css:{display:"flex",flexDirection:"row",overflowX:"auto",borderBottom:"1px solid var(--b-border-subtle)",justifyContent:this.props.centered?"center":"flex-start"},children:this.props.tabs&&this.props.tabs.map((e,t)=>a(p,{label:e.label,className:this.state.activeTab===t?"active":void 0,onClick:()=>{this.setState({activeTab:t}),this.resetInterval()}},t))}),this.props.useDisplay?a(s,{children:this.props.tabs.map((e,t)=>a("div",{css:{display:this.state.activeTab===t?void 0:"none",paddingTop:16},children:a(i,{parent:this.props.builderBlock&&this.props.builderBlock.id,path:`component.options.tabs.${t}.content`,blocks:e.content})},t))}):a(s,{children:this.activeTabSpec&&a("div",{css:{paddingTop:16},children:a(i,{parent:this.props.builderBlock&&this.props.builderBlock.id,path:`component.options.tabs.${this.state.activeTab}.content`,blocks:this.activeTabSpec.content})})})]})}}export{I as MaterialTabs};