https://image.next.vivosun.com/file-asset/static/f8a2e0a4f70392282…/static/chunks/1972.a3d2b2d2d07d4713.js

1"use strict";(self.webpackChunk_N_E=self.webpackChunk_N_E||[]).push([[1972],{25899:function(e,t,n){n.d(t,{gB:function(){return m},mQ:function(){return y}});var r=n(73679),s=n(27378),i=n(60042),a=n.n(i),c=n(24401),l=n(63651),o=n(70505),u=n(23767),d=n(87025),f=n(24246);function v(e,t){if(!e||"undefined"===typeof t)return 0;var n=e.findIndex((function(e){return e.key===t}));return-1===n?0:n}function y(e){var t,n=e.type,r=void 0===n?"swiper":n,i=e.list,c=e.defaultValue,l=e.value,o=e.onChange,u=e.gutter,d=void 0===u?0:u,v=e.renderNav,y=e.render,h=e.destroyWhenHide,b=void 0===h||h,x=e.getTrackData,j=e.id,g=e.className,N=e.navClassName,w=e.style,k="undefined"!==typeof l?l:"undefined"!==typeof c?c:null===i||void 0===i||null===(t=i[0])||void 0===t?void 0:t.key,O=(0,s.useState)(k),C=O[0],T=O[1];return(0,s.useEffect)((function(){"undefined"!==typeof l&&T(l)}),[l]),i&&0!==i.length?(0,f.jsxs)("div",{className:a()(g,"sw-tabs"),id:j,style:w,children:["function"===typeof v?v({list:i,activeKey:C,onTabClick:function(e,t){null===o||void 0===o||o(e,t),"undefined"===typeof l&&T(e.key)}}):(0,f.jsx)(m,{className:N,type:r,list:i,value:C,onChange:function(e,t){null===o||void 0===o||o(e,t),"undefined"===typeof l&&T(e.key)},gutter:d,getTrackData:x}),(0,f.jsx)(p,{list:i,value:C,render:y,destroyWhenHide:b})]}):null}function m(e){var t=e.type,n=void 0===t?"swiper":t,r=e.list,i=e.defaultValue,d=e.value,y=e.onChange,m=e.getTrackData,p=e.gutter,b=void 0===p?0:p,x=e.className,j=(0,s.use

1State)(v(r,i)),g=j[0],N=j[1];if((0,s.useEffect)((function(){r&&r.length&&"undefined"!==typeof d&&N(v(r,d))}),[d]),!r||0===r.length)return null;var w=function(e,t){"undefined"===typeof d&&N(t),null===y||void 0===y||y(e,t)};return"swiper"===n?(0,f.jsx)(c.v,{className:a()(x,"sw-tabs-nav"),swiperClassName:"sw-tabs-nav-swiper",initialSlide:g,slidesPerView:"auto",list:r,spaceBetween:b,render:function(e,t){return(0,f.jsx)(h,{tab:e,index:t,activeIndex:g,onTabClick:w,getTrackData:m})}}):"grid"===n?(0,f.jsx)(o.Y,{className:a()(x,"sw-tabs-nav"),list:r,colsPerRow:r.length,gutter:[b,0],render:function(e,t){return(0,f.jsx)(h,{tab:e,index:t,activeIndex:g,onTabClick:w,getTrackData:m})}}):(0,f.jsx)(l.N,{className:a()(x,"sw-tabs-nav flex flex-wrap"),list:r,render:function(e,t){var n=t.index,r=t.last;return(0,f.jsx)(h,{tab:e,index:n,activeIndex:g,onTabClick:w,getTrackData:m,style:r?void 0:{marginRight:(0,u._P)(b)}})}})}function h(e){var t=e.tab,n=e.index,r=e.activeIndex,s=e.onTabClick,i=e.getTrackData,c=e.style;return(0,f.jsx)(d.ZP,{data:"function"===typeof i?i(t,n):void 0,children:(0,f.jsx)("div",{className:a()("sw-tabs-tab",{"sw-tabs-tab-active":r===n}),onClick:function(){return s(t,n)},style:c,children:"function"===typeof t.title?t.title(t,n,r===n):t.title})})}function p(e){var t=e.list,n=e.value,i=e.render,c=e.destroyWhenHide,l=void 0===c||c,o=(0,s.useState)([n]),u=o[0],d=o[1];if((0,s.useEffect)((function(){l||u.includes(n)||d([].concat((0,r.Z)(u),[n]))}),[n]),!t||0===t.length)return null;if(l){var y=v(t,n),m=t[y];return(0,f.jsx)("div",{className:"sw-tabs-pane",children:"function"===typeof i?i(m,y):null===m||void 0===m?void 0:m.body},n)}return(0,f.jsx)("div",{className:"sw-tabs-panes",children:t.filter((function(e){return e.key===n||u.includes(e.key)})).map((function(e,t){return(0,f.jsx)("div",{className:a()("sw-tabs-pane",{"sw-tabs-pane-active":e.key===n}),"data-index":e.key,children:"function"===typeof i?i(e,t):e.body},e.key)}))})}},70505:function(e,t,n){n.d(t,{Y:function(){return u}});var r=n(90849),s=n(90089),i=n(55360),a=n(24246),c=["list","render","colProps"];function l(e,t){var n=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(e);t&&(r=r.filter((function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable}))),n.push.apply(n,r)}return n}function o(e){for(var t=1;t<arguments.length;t++){var n=null!=arguments[t]?arguments[t]:{};t%2?l(Object(n),!0).forEach((function(t){(0,r.Z)(e,t,n[t])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(n)):l(Object(n)).forEach((function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(n,t))}))}return e}var u=function(e){var t=e.list,n=e.render,r=e.colProps,l=(0,s.Z)(e,c);return t&&0!==t.length?(0,a.jsx)(i.X,o(o({},l),{},{children:t.map((function(e,t){return(0,a.jsx)(i.J,o(o({},"function"===typeof r?r(e,t):r),{},{children:n(e,t)}),t)}))})):null}},81972:function(e,t,n){n.r(t),n.d(t,{default:function(){return u}});var r=n(27378),s="tabs_k6w0Q",i=n(25899),a=n(70505),c=n(46126),l=n(24246);function o(e){return new Array(e).fill(void 0).map((function(e,t){return{key:t,title:"nav ".concat(t),body:(0,l.jsxs)(l.Fragment,{children:["body ",t]})}}))}var u=function(){var e=(0,r.useState)(1),t=e[0],n=e[1];return(0,l.jsxs)("div",{className:"wrapper",children:[(0,l.jsxs)("section",{children:[(0,l.jsx)("h2",{className:"mt-4 mb-2",children:"Tabs with body"}),(0,l.jsx)(i.mQ,{list:o(30),className:s,gutter:20})]}),(0,l.jsxs)("section",{children:[(0,l.jsx)("h2",{className:"mt-4 mb-2",children:"Tabs with render and value"}),(0,l.jsx)(i.mQ,{list:o(30),className:s,gutter:20,value:t,onChange:function(e){return n(e.key)},render:function(e,t){return(0,l.jsxs)("div",{children:["body of ",e.title]})}})]}),(0,l.jsxs)("section",{children:[(0,l.jsx)("h2",{className:"mt-4 mb-2",children:"destroyWhenHide = false"}),(0,l.jsx)(i.mQ,{list:o(30),className:s,gutter:20,destroyWhenHide:!1})]}),(0,l.jsxs)("section",{children:[(0,l.jsx)("h2",{className:"mt-4 mb-2",children:"type = grid"}),(0,l.jsx)(i.mQ,{type:"grid",list:o(3),className:s,navClassName:"text-center bg-light",gutter:20})]}),(0,l.jsxs)("section",{children:[(0,l.jsx)("h2",{className:"mt-4 mb-2",children:"type = normal"}),(0,l.jsx)(i.mQ,{list:o(30),className:s,gutter:20,type:"normal"})]}),(0,l.jsxs)("section",{children:[(0,l.jsx)("h2",{className:"mt-4 mb-2",children:"renderNav"}),(0,l.jsx)(i.mQ,{renderNav:function(e){var t=e.list,n=(e.activeKey,e.onTabClick);return(0,l.jsx)(a.Y,{list:t,colsPerRow:5,render:function(e,t){return(0,l.jsx)(c.z,{onClick:function(){return n(e,t)},children:e.title})}})},list:o(30),className:s,gutter:20,type:"normal"})]}),(0,l.jsxs)("section",{children:[(0,l.jsx)("h2",{className:"mt-4 mb-2",children:"Only TabsNav"}),(0,l.jsx)(i.gB,{list:o(30),gutter:20,className:s})]})]})}}}]);