https://www.octoparse.fr/_next/static/chunks/7373-0638fedd88263bba.js

1"use strict";(self.webpackChunk_N_E=self.webpackChunk_N_E||[]).push([[7373],{66209:function(e,l,t){t.r(l),t.d(l,{TemplateSlider:function(){return S}});var s,n,a,r=t(11527),i=t(99731),c=t(50959);function d(){return(d=Object.assign?Object.assign.bind():function(e){for(var l=1;l<arguments.length;l++){var t=arguments[l];for(var s in t)({}).hasOwnProperty.call(t,s)&&(e[s]=t[s])}return e}).apply(null,arguments)}var o=(0,c.forwardRef)(function(e,l){return c.createElement("svg",d({xmlns:"http://www.w3.org/2000/svg",fill:"none",viewBox:"0 0 16 16",ref:l},e),s||(s=c.createElement("path",{fill:"currentColor",fillRule:"evenodd",d:"M7.97 1.5H8c2.59 0 4.646 2.001 4.894 4.425 1.49.628 2.606 2.107 2.606 3.9 0 2.239-1.856 4.095-4.094 4.095H4.594C2.356 13.92.5 12.063.5 9.826c0-1.793 1.116-3.273 2.606-3.9.25-2.432 2.32-4.315 4.864-4.425m.045 1.376C5.989 2.972 4.456 4.55 4.456 6.42a.69.69 0 0 1-.499.661c-1.17.334-2.08 1.42-2.08 2.745 0 1.477 1.24 2.718 2.717 2.718h6.812c1.478 0 2.718-1.24 2.718-2.718 0-1.324-.912-2.41-2.081-2.745a.69.69 0 0 1-.5-.661c0-1.897-1.552-3.536-3.528-3.544",clipRule:"evenodd"})))});function x(){return(x=Object.assign?Object.assign.bind():function(e){for(var l=1;l<arguments.length;l++){var t=arguments[l];for(var s in t)({}).hasOwnProperty.call(t,s)&&(e[s]=t[s])}return e}).apply(null,arguments)}var f=(0,c.forwardRef)(function(e,l){return c.createElement("svg",x({xmlns:"http://www.w3.org/2000/svg",fill:"none",viewBox:"0 0 16 16",ref:l},e),n||(n=c.createElement("g",{clipPath:"url(#local_svg__a)"},c.createElement("path",{fill:"currentColor",fillRule:"evenodd",d:"M.667 2.333c0-.368.298-.666.666-.666h13.334c.368 0 .666.298.666.666V11a.667.667 0 0 1-.667.667h-6V13H12a.667.667 0 1 1 0 1.333H4A.667.667 0 0 1 4 13h3.333v-1.333h-6A.667.667 0 0 1 .667 11zm13.333 8H2V3h12z",clipRule:"evenodd"}))),a||(a=c.createElement("defs",null,c.createElement("clipPath",{id:"local_svg__a"},c.createElement("path",{fill:"currentColor",d:"M0 0h16v16H0z"})))))}),m=t(33736),u=t(54540),h=t(6663),p=t(55222),g=t(25067),v=t(28596),b=t(25654),j=t(15481),N=t.n(j),w=t(67422),y=t.n(w),k=t(46887);t(97696),t(21986),t(72072);var C=t(85675),E=t(21938);let O=()=>(0,r.jsx)("div",{className:"grid grid-cols-1 gap-4 px-4 pb-6 mx-auto my-[6px] sm:grid-cols-2 sm:gap-6 sm:pb-8 lg:grid-cols-3","aria-hidden":"true",children:Array.from({length:6},(e,l)=>(0,r.jsxs)("div",{className:"".concat(l>=4?"hidden lg:flex":3===l?"hidden sm:flex":"flex"," h-[228px] flex-col gap-6 rounded-2xl border border-[#f0f0f0] bg-white p-5"),children:[(0,r.jsxs)("div",{className:"flex items-center gap-4",children:[(0,r.jsx)("div",{className:"h-12 w-12 shrink-0 rounded-[10px] bg-[#f0f0f0]"}),(0,r.jsx)("div",{className:"h-4 w-2/3 rounded bg-[#f0f0f0]"})]}),(0,r.jsxs)("div",{className:"space-y-3",children:[(0,r.jsx)("div",{className:"h-3 w-full rounded bg-[#f0f0f0]"}),(0,r.jsx)("div",{className:"h-3 w-5/6 rounded bg-[#f0f0f0]"}),(0,r.jsx)("div",{className:"h-3 w-1/2 rounded bg-[#f0f0f0]"})]})]},l))}),S=e=>{let{kindId:l,title:t,description:s,showMoreLink:n=!0,useTemplateRegistrationAPI:a=!1,titleClassName:d,sectionClassName:x="bg-[#f5f7fa]",showHeader:j=!0,dividerTitle:w,deferUntilVisible:S=!1,initialTemplates:_,prioritizeFirstPage:z=!1}=e,{t:R}=(0,b.$G)(),[T,D]=(0,c.useState)(_||[]),M=(0,c.useRef)(null),[P,F]=(0,c.useState)(0),[H,Q]=(0,c.useState)(6),[B,I]=(0,c.useState)(!S),[V,Z]=(0,c.useState)(!0),A=(0,c.useRef)(null),{processLineBreaks:L}=(0,p.$)(),U=S&&V&&0===T.length,$=(0,c.useMemo)(()=>{let e=T.length>=12?T.length-T.length%12:T.length,l=[];for(let t=0;t<e;t+=H)l.push(T.slice(t,Math.min(t+H,e)));return l},[T,H]),q=async()=>{let e=await (0,u.EO)(99,l,a);(null==e?void 0:e.length)&&D(e),Z(!1)};return(0,c.useEffect)(()=>{if(!S){I(!0);return}let e=A.current;if(!e)return;let l=new IntersectionObserver(e=>{let[t]=e;t.isIntersecting&&(I(!0),l.disconnect())},{threshold:.1});return l.observe(e),()=>l.disconnect()},[S]),(0,c.useEffect)(()=>{let e=()=>{let e=window.innerWidth;e<768?Q(3):e<1024?Q(4):Q(6)};return e(),window.addEventListener("resize",e),()=>{window.removeEventListener("resize",e)}},[]),(0,c.useEffect)(()=>{B&&(Z(!0),q())},[l,B]),(0,r.jsx)("section",{ref:A,className:"".concat(x," py-12 sm:py-[88px]"),children:(0,r.jsxs)("div",{className:"mx-auto flex max-w-[1232px] flex-col text-center",children:[j&&(0,r.jsxs)("div",{className:"flex flex-col items-center gap-3 mb-8 md:mb-12",children:[(0,r.jsx)("h2",{className:d||"text-[28px] font-bold leading-[150%] sm:text-[36px] lg:text-[40px] xl:text-[56px]",children:t||R("home2:TemplateSlider.Title")}),void 0!==s&&""!==s&&(0,r.jsx)("p",{className:"text-[18px] leading-[150%]",children:s}),void 0===s&&(0,r.jsx)("p",{className:"text-[18px] leading-[150%]",children:L(R("home2:TemplateSlider.Description")||"")})]}),w&&(0,r.jsxs)("div",{className:"flex items-center justify-center gap-3 px-4 mb-4",children:[(0,r.jsx)("div",{className:"h-px flex-1 bg-[#f0f0f0]"}),(0,r.jsx)("span",{className:"text-center text-xs leading-5 text-[#bfbfbf]",children:w}),(0,r.jsx)("div",{className:"h-px flex-1 bg-[#f0f0f0]"})]}),(0,r.jsxs)("div",{className:"relative",children:[U&&(0,r.jsx)(O,{}),(0,r.jsx)(C.tq,{className:U?"hidden":void 0,modules:[k.Rv],slidesPerView:"auto",freeMode:!0,onSwiper:e=>{M.current=e,F(e.activeIndex)},onSlideChange:e=>{F(e.activeIndex)},children:$.map((e,l)=>(0,r.jsx)(C.o5,{className:"item",children:(0,r.jsx)("div",{className:"grid grid-cols-1 gap-4 sm:gap-6 mx-auto my-[6px] sm:grid-cols-2 lg:grid-cols-3 px-4 pb-6 sm:pb-8",children:e.map(e=>(0,r.jsxs)(y(),{href:(null==e?void 0:e.isTemplateCollection)?"/template/collection/".concat(null==e?void 0:e.slug):"/template/".concat(null==e?void 0:e.slug),target:"_blank",className:"flex h-[228px] flex-col gap-4 sm:gap-6 cursor-pointer rounded-2xl border border-white bg-white p-5 text-left text-inherit transition hover:-translate-y-1 hover:shadow-lg ".concat((null==e?void 0:e.isTemplateCollection)?"bg-gradient-to-br from-[#f5f0ff] to-[#e5f1ff]":""),children:[(0,r.jsxs)("div",{className:"flex items-center gap-4",children:[(0,r.jsx)("div",{className:"flex h-12 w-12 items-center justify-center rounded-[10px] bg-[#f0f4ff] text-[#3470ff] overflow-hidden",children:(0,r.jsx)(N(),{src:(0,g.UQ)((null==e?void 0:e.imageUrl)||"/static/template/gray-logo.jpg"),alt:"",height:48,width:48,priority:z&&0===l,fetchPriority:z&&0===l?"high":void 0})}),(0,r.jsx)("div",{className:"flex-1",children:(0,r.jsx)("h3",{className:"line-clamp-2 text-base font-semibold",children:null==e?void 0:e.name})})]}),(0,r.jsx)("p",{className:"line-clamp-3 text-sm text-[#5d5d5d]",children:null==e?void 0:e.description}),(0,r.jsx)("div",{className:"mt-auto flex items-center gap-2",children:(null==e?void 0:e.isTemplateCollection)?(0,r.jsxs)("div",{className:"bg-[#ffffff] px-[10px] gap-1 flex items-center rounded h-[22px] mt-[6px]",children:[(0,r.jsx)(m.Z,{className:"size-4 text-[#3470FF]","aria-hidden":!0}),(0,r.jsx)("span",{className:"text-[#3470FF] text-xs font-medium",children:R("home2:Case.TemplateCollection")})]}):(0,r.jsxs)(v.k,{align:"center",gap:"8",children:[(null==e?void 0:e.kindName)&&(0,r.jsx)("span",{className:"rounded-full bg-black/5 px-[10px] py-[5px] text-xs text-[#8

1c8c8c]",children:null==e?void 0:e.kindName}),((null==e?void 0:e.runOn)===h.Q.Both||(null==e?void 0:e.runOn)===h.Q.Local)&&(0,r.jsx)("span",{className:"rounded-full bg-black/5 px-2 py-[5px]",children:(0,r.jsx)(f,{className:"size-3 text-[#3D3D3D]","aria-hidden":!0})}),((null==e?void 0:e.runOn)===h.Q.Both||(null==e?void 0:e.runOn)===h.Q.Cloud)&&(0,r.jsx)("span",{className:"rounded-full bg-black/5 px-2 py-[5px]",children:(0,r.jsx)(o,{className:"size-3 text-[#3D3D3D]","aria-hidden":!0})})]})})]},null==e?void 0:e.name))})},l))},U?"loading":"loaded"),(0,r.jsxs)("div",{className:"flex items-center justify-center gap-6",children:[(0,r.jsx)("button",{type:"button",className:"flex h-10 w-10 items-center justify-center rounded-full bg-black/5 transition-colors ".concat(0===P?"cursor-not-allowed text-[#d9d9d9]":"text-[#16181c] hover:bg-black/[0.09]"),disabled:0===P,"aria-disabled":0===P,onClick:()=>{var e;return null===(e=M.current)||void 0===e?void 0:e.slidePrev()},children:(0,r.jsx)(E.Z,{className:"rotate-180"})}),(0,r.jsx)("button",{type:"button",className:"flex h-10 w-10 items-center justify-center rounded-full bg-black/5 transition-colors ".concat($.length<=1||P===$.length-1?"cursor-not-allowed text-[#d9d9d9]":"text-[#16181c] hover:bg-black/[0.09]"),disabled:$.length<=1||P===$.length-1,"aria-disabled":$.length<=1||P===$.length-1,onClick:()=>{var e;return null===(e=M.current)||void 0===e?void 0:e.slideNext()},children:(0,r.jsx)(E.Z,{})})]}),n&&(0,r.jsxs)(y(),{href:"/template",className:"flex items-center justify-center gap-2 mt-6 text-lg text-[#3470ff]",children:[R("home2:TemplateSlider.More"),(0,r.jsx)(i.Z,{className:"size-4 text-[#3470FF]","aria-hidden":!0})]})]})]})})}}}]);