import e,{useState as a}from"react";import"../../../node_modules/prop-types/index.js";import n from"../../../node_modules/next/router.js";import{Paragraph as t}from"../../Typography/Paragraph/Paragraph.js";import"../../Typography/Paragraph/Paragraph-utils.js";import{Image as r}from"../../Media/Image.js";import{Heading as l}from"../../Typography/Heading.js";import{HStack as i,VStack as o}from"../../../node_modules/@chakra-ui/layout/dist/esm/stack.js";import{Tabs as m,TabList as s,Tab as p,TabPanels as c,TabPanel as g}from"../../../node_modules/@chakra-ui/tabs/dist/esm/tabs.js";import{p as d}from"../../../_virtual/index.js_commonjs-module";function b(n){var d=n.tabs,b=a(0),v=b[0],u=b[1];return e.createElement(e.Fragment,null,e.createElement("div",{className:"main-page-tabs vertical"},e.createElement(m,{onChange:u},e.createElement(i,null,d&&d.length>0?e.createElement(s,{className:"nav-tabs"},e.createElement(o,{className:"nav-item"},(d||[]).map((function(a,n){var t=a.label;return e.createElement(p,{key:n,className:v===n?"active nav-link":"nav-link",_selected:{outline:"none"},_active:{outline:"none"},margin:"0px",padding:"0px"},t)})))):null,e.createElement(c,null,(d||[]).map((function(a,n){var i=a.title,o=a.description,m=a.imageUrl;return e.createElement(g,{key:n},null!=i&&""!==i?e.createElement(l,{type:"h2",text:i,fontSize:40,lumo:"secondary-base"}):e.createElement(e.Fragment,null),null!=m&&""!==m?e.createElement(r,{src:m||"/static/icons/app-image-upload.svg",alt:i,width:"100%",height:null,classes:""}):e.createElement(e.Fragment,null),e.createElement("div",{className:"pt-2"},e.createElement(t,{content:o,align:"center",fontSize:"21px",lineHeight:"1.43",fontFamily:"Bressay",letterSpacing:"0",textTransform:"normal",lumo:"primary-dark"})))})))))),e.createElement("style",{jsx:!0},"\n        :global(.nav-tabs) {\n          border: none;\n        }\n\n        :global(.nav-tabs .nav-item) {\n          cursor: pointer;\n        }\n\n        :global(.nav-tabs .nav-link) {\n          border: none;\n          color: #000;\n          padding: 16px 28px;\n          font-size: 13px;\n          font-weight: bold;\n        }\n\n        :global(.main-page-tabs.vertical) {\n          display: flex;\n          flex-direction: row;\n        }\n\n        :global(.main-page-tabs.vertical .nav-tabs) {\n          display: flex;\n          flex-direction: column;\n          width: 100%;\n          max-width: 225px;\n        }\n\n        :global(.main-page-tabs.vertical .tab-content) {\n          width: 100%;\n          padding: 2rem 4rem;\n        }\n\n        :global(.main-page-tabs.vertical .nav-tabs .nav-item) {\n          margin-bottom: 2px;\n        }\n\n        :global(.main-page-tabs.vertical .nav-tabs .nav-item .nav-link) {\n          text-align: left;\n        }\n\n        :global(.main-page-tabs.vertical .nav-tabs .nav-item .nav-link.active) {\n          border-bottom: 0;\n          border-left: 7px solid grey;\n        }\n      "))}b.propTypes={items:d.exports.array};var v=n.withRouter(b);export default v;
//# sourceMappingURL=Tabs2.js.map
