https://content.rapha.cc/_next/static/chunks/8315-f8f12a5d3417b698.js

1"use strict";(self.webpackChunk_N_E=self.webpackChunk_N_E||[]).push([[8315],{18315:function(n,t,r){r.d(t,{Z:function(){return qn}});var i=r(10253),o=r(7297),e=r(85893),c=r(67294),u=r(79661),a=r(34725),d=r(35480),l=r(51794),s=r(94516),f=r(29815),m=r(68665),p=r(13779),g=r(77574);function h(){var n=(0,o.Z)(["\n\tgrid-column: 1 / span 6;\n\tmargin-top: ",";\n"]);return h=function(){return n},n}function v(){var n=(0,o.Z)(["\n\tdisplay: flex;\n\tflex-flow: row nowrap;\n\tmargin: 0 0 ",";\n\tmin-height: ",";\n\tpadding: 0;\n\twidth: 100%;\n"]);return v=function(){return n},n}function b(){var n=(0,o.Z)(["\n\talign-items: center;\n\tdisplay: flex;\n\tflex: 1;\n\tjustify-content: center;\n\tposition: relative;\n\n\t","\n\n\t& + & {\n\t\tborder-left: 1px solid ",";\n\t}\n"]);return b=function(){return n},n}function x(){var n=(0,o.Z)(["\n\tposition: relative;\n\ttransition: top 0.15s linear;\n\twidth: ",";\n"]);return x=function(){return n},n}function Z(){var n=(0,o.Z)(["\n\tposition: relative;\n\t","\n"]);return Z=function(){return n},n}function w(){var n=(0,o.Z)(["\n\tleft: 0;\n\topacity: 0;\n\tpadding: "," "," ",";\n\tpointer-events: none;\n\tposition: absolute;\n\ttop: 0;\n\n\t","\n\n\t&.product-enter {\n\t\topacity: 0;\n\t}\n\n\t&.product-enter-done {\n\t\topacity: 1;\n\t\ttransition: opacity 0.2s;\n\t}\n\n\t&.product-exit {\n\t\topacity: 1;\n\t}\n\n\t&.product-exit-done {\n\t\topacity: 0;\n\t\ttransition: opacity 0.2s;\n\t}\n"]);return w=function(){return n},n}function C(){var n=(0,o.Z)(["\n\ttext-transform: uppercase;\n\tmargin: 0 0 ",";\n"]);return C=function(){return n},n}function j(){var n=(0,o.Z)(["\n\tmargin-bottom: ",";\n"]);return j=function(){return n},n}function y(){var n=(0,o.Z)(["\n\t&:hover {\n\t\tcolor: ",";\n\t}\n"]);return y=function(){return n},n}var P=d.ZP.div.withConfig({componentId:"sc-52095bca-0"})(h(),(0,a.dim)(2)),I=d.ZP.ul.withConfig({componentId:"sc-52095bca-1"})(v(),(0,a.dim)(2),(0,a.dim)(8.5)),q=d.ZP.li.withConfig({componentId:"sc-52095bca-2"})(b(),(function(n){return n.active&&"\n\t\t&::after {\n\t\t\tbackground-color: ".concat(a.default.color("black"),';\n\t\t\tborder-radius: 50%;\n\t\t\tbottom: -18px;\n\t\t\tcontent: "";\n\t\t\tdisplay: block;\n\t\t\theight: ').concat((0,a.dim)(.75),";\n\t\t\tleft: 50%;\n\t\t\tposition: absolute;\n\t\t\ttransform: translateX(-50%);\n\t\t\twidth: ").concat((0,a.dim)(.75),";\n\t\t}\n\t")}),a.default.color("grey20")),_=d.ZP.span.withConfig({componentId:"sc-52095bca-3"})(x(),(0,a.dim)(6.5)),k=d.ZP.div.withConfig({componentId:"sc-52095bca-4"})(Z(),(function(n){var t=n.height;return t&&"height: ".concat(t,"px;")})),H=d.ZP.div.withConfig({componentId:"sc-52095bca-5"})(w(),(0,a.dim)(4),(0,a.dim)(2.5),(0,a.dim)(5),(function(n){return n.active&&"\n\t\topacity: 1;\n\t\tpointer-events: all;\n\t"})),D=(0,d.ZP)(l.H3).withConfig({componentId:"sc-52095bca-6"})(C(),(0,a.dim)(1)),S=(0,d.ZP)(l.uT).withConfig({componentId:"sc-52095bca-7"})(j(),(0,a.dim)(2)),E=(0,d.ZP)(l.ee).withConfig({componentId:"sc-52095bca-8"})(y(),a.default.color("mtb")),O=function(n){var t,r=n.data,i=(0,g.Z)().t,o=(0,c.useState)(0),u=o[0],a=o[1],d=(0,c.useState)(0),l=d[0],h=d[1],v=(0,c.useRef)([]);return(0,c.useEffect)((function(){var n,t=v.current.map((function(n){return n.clientHeight})),r=(n=Math).max.apply(n,(0,f.Z)(t));h(r)}),[l]),(0,e.jsx)(P,{children:(null===(t=r.productsCollection)||void 0===t?void 0:t.items)&&(0,e.jsxs)(c.Fragment,{children:[(0,e.jsx)(I,{children:r.productsCollection.items.map((function(n,t){var r,i;return(0,e.jsx)(q,{onClick:function(){return a(t)},active:u===t,children:(null===(r=n.variantsCollection.items[0])||void 0===r?void 0:r.mannequin[0])&&(0,e.jsx)(_,{children:(0,e.jsx)(s.Z,{src:null===(i=n.variantsCollection.items[0])||void 0===i?void 0:i.mannequin[0].original_secure_url,width:"200",height:"200",aspect:"1:1",alt:n.name})})},t)}))}),(0,e.jsx)(k,{height:l,children:r.productsCollection.items.map((function(n,t){return(0,e.jsx)(m.Z,{in:u===t,timeout:300,classNames:"product",children:(0,e.jsxs)(H,{active:u===t,ref:function(n){v.current[t]=n},children:[n.name&&(0,e.jsx)(D,{children:n.name}),n.shortDescription&&(0,e.jsx)(S,{variant:"xs",children:n.shortDescription}),(0,e.jsx)(E,{href:p.Z.SHOP_PRODUCT(n.sku),children:i("mtb_shop_product",{name:n.name})})]},t)},t)}))})]})})};function T(){var n=(0,o.Z)(["\n\t\tgrid-column: 9 / span 4;\n\t\tmargin: 0;\n\t"]);return T=function(){return n},n}function N(){var n=(0,o.Z)(["\n\tdisplay: flex;\n\tflex-flow: column nowrap;\n\tflex: 1 0 0;\n\tgrid-column: 7 / span 6;\n\tlist-style: none;\n\tmargin: "," 0 0;\n\tpadding: 0;\n\n\t","\n"]);return N=function(){return n},n}function R(){var n=(0,o.Z)(["\n\tborder-bottom: 1px solid ",";

1\n\tborder-right: none;\n\tdisplay: grid;\n\tflex-grow: 1;\n\tgrid-column-gap: ",";\n\tgrid-template-columns: repeat(6, 1fr);\n\tpadding: "," ",";\n\n\t&:last-child {\n\t\tborder-bottom: none;\n\t}\n"]);return R=function(){return n},n}function U(){var n=(0,o.Z)(["\n\t\talign-self: center;\n\t\twidth: ",";\n\t"]);return U=function(){return n},n}function F(){var n=(0,o.Z)(["\n\t\twidth: ",";\n\t"]);return F=function(){return n},n}function M(){var n=(0,o.Z)(["\n\talign-self: start;\n\tgrid-column: 1 / span 2;\n\tmargin: 0 auto;\n\twidth: ",";\n\n\t","\n\n\t","\n"]);return M=function(){return n},n}function X(){var n=(0,o.Z)(["\n\t\talign-self: center;\n\t"]);return X=function(){return n},n}function z(){var n=(0,o.Z)(["\n\talign-self: start;\n\tgrid-column: 3 / span 4;\n\n\t","\n"]);return z=function(){return n},n}function A(){var n=(0,o.Z)(["\n\ttext-transform: uppercase;\n\tmargin: 0 0 ",";\n"]);return A=function(){return n},n}function B(){var n=(0,o.Z)(["\n\tmargin-bottom: ",";\n"]);return B=function(){return n},n}function G(){var n=(0,o.Z)(["\n\t&:hover {\n\t\tcolor: ",";\n\t}\n"]);return G=function(){return n},n}var J=d.ZP.ul.withConfig({componentId:"sc-2311c8be-0"})(N(),(0,a.dim)(4),a.mq.xl(T())),K=d.ZP.li.withConfig({componentId:"sc-2311c8be-1"})(R(),a.default.color("grey20"),(0,a.dim)(4),(0,a.dim)(2),(0,a.dim)(1)),L=d.ZP.span.withConfig({componentId:"sc-2311c8be-2"})(M(),(0,a.dim)(10),a.mq.lg(U(),(0,a.dim)(16)),a.mq.xl(F(),(0,a.dim)(20))),Q=d.ZP.div.withConfig({componentId:"sc-2311c8be-3"})(z(),a.mq.lg(X())),V=(0,d.ZP)(l.H3).withConfig({componentId:"sc-2311c8be-4"})(A(),(0,a.dim)(1)),W=(0,d.ZP)(l.uT).withConfig({componentId:"sc-2311c8be-5"})(B(),(0,a.dim)(1)),Y=(0,d.ZP)(l.ee).withConfig({componentId:"sc-2311c8be-6"})(G(),a.default.color("mtb")),$=function(n){var t,r,i=n.data,o=(0,g.Z)().t;return(0,e.jsx)(J,{children:(null===(t=i.productsCollection)||void 0===t?void 0:t.items)&&(null===(r=i.productsCollection)||void 0===r?void 0:r.items.map((function(n,t){var r;return(0,e.jsxs)(K,{children:[(null===(r=n.variantsCollection.items[0])||void 0===r?void 0:r.mannequin[0])&&(0,e.jsx)(L,{children:(0,e.jsx)(s.Z,{src:n.variantsCollection.items[0].mannequin[0].original_secure_url,width:"200",height:"200",aspect:"1:1",alt:n.name})}),(0,e.jsxs)(Q,{children:[n.name&&(0,e.jsx)(V,{children:n.name}),n.shortDescription&&(0,e.jsx)(W,{variant:"xs",children:n.shortDescription}),(0,e.jsx)(Y,{href:p.Z.SHOP_PRODUCT(n.sku),children:o("mtb_shop_product",{name:n.name})})]})]},t)})))})};function nn(){var n=(0,o.Z)(["\n\t\tgrid-column-gap: ",";\n\t\tgrid-template-columns: repeat(12, 1fr);\n\t"]);return nn=function(){return n},n}function tn(){var n=(0,o.Z)(["\n\t\tflex-flow: row nowrap;\n\t"]);return tn=function(){return n},n}function rn(){var n=(0,o.Z)(["\n\tdisplay: grid;\n\tgrid-column-gap: ",";\n\tgrid-template-columns: repeat(6, 1fr);\n\tmargin: "," 0;\n\tpadding-bottom: ",";\n\tposition: relative;\n\tflex-flow: row wrap;\n\n\t&:after {\n\t\tbackground-color: ",";\n\t\tbottom: 0;\n\t\tcontent: '';\n\t\theight: 1px;\n\t\tposition: absolute;\n\t\twidth: 100%;\n\t}\n\n\t","\n\n\t","\n"]);return rn=function(){return n},n}function on(){var n=(0,o.Z)(["\n\tmargin: 0;\n"]);return on=function(){return n},n}function en(){var n=(0,o.Z)(["\n\t\tgrid-column: 1 / span 12;\n\t"]);return en=function(){return n},n}function cn(){var n=(0,o.Z)(["\n\t\tborder-right: 1px solid ",";\n\t\tdisplay: flex;\n\t\tgrid-column: 1 / span 2;\n\t\tmargin: 0;\n\t"]);return cn=function(){return n},n}function un(){var n=(0,o.Z)(["\n\tgrid-column: 1 / span 6;\n\tmargin: 0 0 ",";\n\n\t","\n\n\t","\n"]);return un=function(){return n},n}function an(){var n=(0,o.Z)(["\n\t\tgrid-column: 1 / span 12;\n\t\tflex-flow: row nowrap;\n\t"]);return an=function(){return n},n}function dn(){var n=(0,o.Z)(["\n\t\tborder: none;\n\t\tgrid-column: 3 / span 2;\n\t\tflex-flow: column nowrap;\n\t"]);return dn=function(){return n},n}function ln(){var n=(0,o.Z)(["\n\tborder-bottom: 1px solid ",";\n\tborder-top: 1px solid ",";\n\tdisplay: flex;\n\tflex-flow: row nowrap;\n\tgrid-column: 1 / span 6;\n\tjustify-content: center;\n\tmargin-bottom: ",";\n\tpadding: "," 0;\n\twidth: 100%;\n\n\t","\n\n\t","\n"]);return ln=function(){return n},n}function sn(){var n=(0,o.Z)(["\n\t\tmargin: "," 0;\n\t\tpadding: "," 0;\n\t\twidth: 100%;\n\n\t\t&:first-child {\n\t\t\tborder-top: none;\n\t\t\tborder-right: 1px solid ",";\n\t\t}\n\t"]);return sn=function(){return n},n}function fn(){var n=(0,o.Z)(["\n\t\theight: 100%;\n\t\tmargin: 0;\n\n\t\t&:first-child {\n\t\t\tborder-bottom: 1px solid ",";

1\n\t\t\tborder-right: none;\n\t\t}\n\n\t\t&:last-child {\n\t\t\tborder-bottom: none;\n\t\t}\n\t"]);return fn=function(){return n},n}function mn(){var n=(0,o.Z)(["\n\talign-items: center;\n\tcursor: default;\n\tdisplay: flex;\n\tjustify-content: center;\n\tpadding: "," 0;\n\tposition: relative;\n\twidth: 100%;\n\n\t&:first-child {\n\t\tborder-right: 1px solid ",";\n\t}\n\n\t","\n\n\t","\n"]);return mn=function(){return n},n}function pn(){var n=(0,o.Z)(["\n\t\tgrid-column: 1 / span 12;\n\t\ttransform: none;\n\t"]);return pn=function(){return n},n}function gn(){var n=(0,o.Z)(["\n\t\tleft: auto;\n\t\tposition: relative;\n\t"]);return gn=function(){return n},n}function hn(){var n=(0,o.Z)(["\n\tcolor: ",";\n\tcursor: pointer;\n\tmargin: 0;\n\n\t&:hover {\n\t\tcolor: ",";\n\t}\n\n\t","\n\n\t","\n\n\t","\n"]);return hn=function(){return n},n}function vn(){var n=(0,o.Z)(["\n\t\tgrid-column: 1 / span 6;\n\t\tmargin-top: ",";\n\t"]);return vn=function(){return n},n}function bn(){var n=(0,o.Z)(["\n\t\tgrid-column: 5 / span 4;\n\t\tmargin: 0;\n\t"]);return bn=function(){return n},n}function xn(){var n=(0,o.Z)(["\n\tgrid-column: 1 / span 6;\n\taspect-ratio: 2 / 3;\n\theight: 100%;\n\tmargin-right: 0;\n\twidth: 100%;\n\n\t","\n\n\t","\n"]);return xn=function(){return n},n}var Zn=d.ZP.div.withConfig({componentId:"sc-25bd931b-0"})(rn(),(0,a.dim)(2),(0,a.dim)(4),(0,a.dim)(4),a.default.color("grey20"),a.mq.md(nn(),(0,a.dim)(4)),a.mq.xl(tn())),wn=(0,d.ZP)(l.H3).withConfig({componentId:"sc-25bd931b-1"})(on()),Cn=d.ZP.div.withConfig({componentId:"sc-25bd931b-2"})(un(),(0,a.dim)(4),a.mq.md(en()),a.mq.xl(cn(),a.default.color("grey20"))),jn=d.ZP.div.withConfig({componentId:"sc-25bd931b-3"})(ln(),a.default.color("grey20"),a.default.color("grey20"),(0,a.dim)(2),(0,a.dim)(2),a.mq.md(an()),a.mq.xl(dn())),yn=d.ZP.div.withConfig({componentId:"sc-25bd931b-4"})(mn(),(0,a.dim)(2),a.default.color("grey20"),a.mq.md(sn(),(0,a.dim)(2),(0,a.dim)(6),a.default.color("grey20")),a.mq.xl(fn(),a.default.color("grey20"))),Pn=(0,d.ZP)(l.H4).withConfig({componentId:"sc-25bd931b-5"})(hn(),a.default.color("grey20"),a.default.color("mtb"),(function(n){return n.active&&"\n\t\tcolor: ".concat(a.default.color("black"),";\n\t\tcursor: default;\n\n\t\t&:hover {\n\t\t\tcolor: inherit;\n\t\t}\n\t")}),a.mq.md(pn()),a.mq.xl(gn())),In=d.ZP.div.withConfig({componentId:"sc-25bd931b-6"})(xn(),a.mq.md(vn(),(0,a.dim)(4)),a.mq.xl(bn())),qn=function(n){var t=n.data,r=(0,u.iP)(),o=(0,c.useState)(0),d=o[0],l=o[1],f=(0,c.useState)(t.tabsCollection.items[d]),m=f[0],p=f[1];(0,c.useEffect)((function(){p(t.tabsCollection.items[d])}),[t.tabsCollection.items,d]);var g=(0,i.Z)(m.image||[],1)[0];return(0,e.jsxs)(Zn,{children:[(0,e.jsx)(Cn,{children:(0,e.jsx)(wn,{children:t.title})}),(0,e.jsx)(jn,{children:t.tabsCollection.items.map((function(n,t){return(0,e.jsx)(yn,{children:(0,e.jsx)(Pn,{active:t===d,onClick:function(){return l(t)},index:t,children:n.title})},t)}))}),(0,e.jsx)(In,{children:g&&(0,e.jsx)(s.Z,{src:g.original_secure_url,width:"800",height:"1200",aspect:"2:3",alt:m.title})}),r.width>=a.default.get("breakpoints.md")?(0,e.jsx)($,{data:m}):(0,e.jsx)(O,{data:m})]})}}}]);