"use strict";(self.webpackChunkmattermost_webapp=self.webpackChunkmattermost_webapp||[]).push([[5215],{35215:(e,t,n)=>{n.r(t),n.d(t,{default:()=>b});var a=n(70314),i=n(61057),s=(n(92189),n(84390)),r=n.n(s),o=n(23712),l=n(35887),c=n(21214),p=n(70174);function u(e,t,n){return(t=function(e){var t=function(e,t){if("object"!=typeof e||null===e)return e;var n=e[Symbol.toPrimitive];if(void 0!==n){var a=n.call(e,"string");if("object"!=typeof a)return a;throw new TypeError("@@toPrimitive must return a primitive value.")}return String(e)}(e);return"symbol"==typeof t?t:String(t)}(t))in e?Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[t]=n,e}class d extends r().PureComponent{constructor(e){super(e),u(this,"handleClick",((e,t)=>{var n;t.preventDefault(),this.props.updateTab(e.name),null===(n=t.target.closest(".settings-modal"))||void 0===n||n.classList.add("display--content")})),u(this,"handleKeyUp",((e,t)=>{(0,l.p)(t,o.default.KeyCodes.UP)?e>0&&(this.props.updateTab(this.props.tabs[e-1].name),(0,p.Y_)(this.buttonRefs[e-1].current)):(0,l.p)(t,o.default.KeyCodes.DOWN)&&e<this.props.tabs.length-1&&(this.props.updateTab(this.props.tabs[e+1].name),(0,p.Y_)(this.buttonRefs[e+1].current))})),this.buttonRefs=this.props.tabs.map((()=>r().createRef()))}componentDidMount(){var e;c.vU()&&(null===(e=document.querySelector(".settings-modal .settings-table .nav"))||void 0===e||e.classList.add("position--top"))}render(){const e=this.props.tabs.map(((e,t)=>{const n="".concat(e.name,"_li"),a=this.props.activeTab===e.name;let i="";return a&&(i="active"),r().createElement("li",{id:"".concat(e.name,"Li"),key:n,className:i,role:"presentation"},r().createElement("button",{ref:this.buttonRefs[t],id:"".concat(e.name,"Button"),className:"cursor--pointer style--none",onClick:this.handleClick.bind(null,e),onKeyUp:this.handleKeyUp.bind(null,t),"aria-label":e.uiName.toLowerCase(),role:"tab","aria-selected":a,tabIndex:a||this.props.isMobileView?0:-1},r().createElement("i",{className:e.icon,title:e.iconTitle}),e.uiName))}));return r().createElement("div",null,r().createElement("ul",{id:"tabList",className:"nav nav-pills nav-stacked",role:"tablist","aria-orientation":"vertical"},e))}}const b=(0,a.connect)((function(e){return{isMobileView:(0,i.E7)(e)}}))(d)}}]);
//# sourceMappingURL=5215.71b7d6b54b03f3d0088c.js.map