https://www.swiffer.com/_next/static/chunks/477.4f5e217c0aaa5e0c.js

1"use strict";(self.webpackChunk_N_E=self.webpackChunk_N_E||[]).push([[477,608,8227],{20477:(e,t,n)=>{n.r(t),n.d(t,{default:()=>b});var r=n(37876),a=n(38227),i=n(52772),o=n(14232),l=n(30388),s=n(26646);let d=l.Ay.div.withConfig({componentId:"sc-3484893-0"})(["--margin-bottom:114px;position:relative;@media (min-width:","){overflow:hidden;}&.changed{.tab-panel{@media (min-width:","){padding-left:0;.text{animation:fade-in 1s linear forwards;}}}}.wrapper{position:relative;",";padding-right:16px;padding-top:32px;@media (min-width:","){padding-top:25px;margin-bottom:var(--margin-bottom);overflow:hidden;padding-left:16px;}}.tablist{--1-item-color:",";--2-item-color:",";--3-item-color:",";position:relative;display:flex;@media (max-width:","){top:0;position:sticky;z-index:10;left:0;display:flex;flex-direction:column;justify-content:center;align-items:center;}@media (min-width:","){border-bottom:2px solid ",";justify-content:space-between;padding-bottom:0;}::-webkit-scrollbar-track,::-webkit-scrollbar-thumb,::-webkit-scrollbar{@media (max-width:","){background-color:transparent;height:0;width:0;}}&.sustain{--1-item-color:",";--2-item-color:",";--3-item-color:",";@media (min-width:","){&::after{display:block;content:'';width:34px;}}}.tab-button{@media (max-width:","){width:32px;font-size:14px;padding-left:2px;padding-right:5px;border-top:1px solid ",";&:first-of-type{border-top:0;}}@media (min-width:","){min-height:34px;padding-left:20px;padding-right:20px;}&[aria-selected='true']{border-top:0;+ .tab-button{border-top:0;}:nth-child(1){border-color:var(--1-item-color);}:nth-child(2){border-color:var(--2-item-color);}:nth-child(3){border-color:var(--3-item-color);}}}&.changed{@media (min-width:","){.tab-button{&:first-of-type{border-bottom:0;}}}}}.tab-button{border:0;font-size:16px;font-weight:500;cursor:pointer;padding:24px 11px;background-color:",";border-left:3px solid transparent;outline:0 !important;@media (min-width:","){padding:2px;min-width:fit-content;background:0;border-left:0;border-bottom:0;padding-bottom:8px;margin-bottom:-2px;&:first-of-type{border-bottom:3px solid transparent;}&[aria-selected='true']{background-color:transparent !important;}}&[aria-selected='true']{font-weight:600;background-color:#fff;border-color:",";}}.image-text-block{width:100%;min-height:300px;@media (max-width:","){.content{padding-left:8px;padding-top:0;}}@media (min-width:","){background:transparent;}.image{margin:0;align-items:flex-start;img{height:auto;@media (min-width:","){height:100%;}}}.content{@media (min-width:","){padding:30px 0;}}}.background-image{position:absolute;bottom:-300px;right:-30%;z-index:-50;@media (max-width:","){max-width:100%;right:0;img{max-width:100%;min-width:0 !important;}}&.sustain{left:-30%;right:auto;}img{min-width:1500px;width:100%;object-fit:contain;filter:blur(2px);}}.tab-name{writing-mode:vertical-rl;transform:rotate(180deg);color:",";@media (min-width:","){writing-mode:unset;transform:none;color:#000;}}.tab-panel{padding-left:32px;@media (min-width:","){padding-left:0;}}.text-content{.text{@media (min-width:","){p{&:first-of-type{margin-top:0;}}}.event_button_click{@media (max-width:","){width:100%;max-width:300px;padding-left:0;}}}}.select-indicator{display:none;position:absolute;height:3px;background-color:red;bottom:-2px;transition:left 0.4s linear,width 0.4s linear;@media (min-width:","){display:block;}}@keyframes fade-in{0%{opacity:0;}100%{opacity:1;}}.scroll-wrapper{position:relative;@media (max-width:","){height:calc(100% - 40px);position:absolute;}}"],s.LR.dtBreakpointMin,s.LR.dtBreakpointMin,s.vE.contentWide,s.LR.dtBreakpointMin,s.Tj.cyan500,s.Tj.purple500,s.Tj.magenta500,s.LR.tbBreakpointMax,s.LR.dtBreakpointMin,s.Tj.orange500,s.LR.tbBreakpointMax,s.Tj.green400,s.Tj.green400,s.Tj.yellow500,s.LR.dtBreakpointMin,s.LR.tbBreakpointMax,s.Tj.cyan800,s.LR.dtBreakpointMin,s.LR.dtBreakpointMin,s.Tj.grey200,s.LR.dtBreakpointMin,s.Tj.cyan500,s.LR.tbBreakpointMax,s.LR.dtBreakpointMin,s.LR.dtBreakpointMin,s.LR.dtBreakpointMin,s.LR.tbBreakpointMax,s.Tj.cyan800,s.LR.dtBreakpointMin,s.LR.dtBreakpointMin,s.LR.dtBreakpointMin,s.LR.spBreakpointMax,s.LR.dtBreakpointMin,s.LR.tbBreakpointMax);var c=n(93181),u=n(57705),p=n(61011);let b=e=>{let{tabs:t,backgroundImage:n,colorScheme:l}=e,[s,b]=(0,o.useState)(0),[m,f]=(0,o.useState)(!1),x=(0,u.A)(),g=(0,o.useRef)([]),h=(0,o.useRef)(null),w=(0,o.useMemo)(()=>t.map(e=>(0,i.x)(e.fields.content,void 0,!0)),[t]),v=(0,o.useMemo)(()=>

1{if(!g.current.length)return{};let e=0===s?0:s-1,t=g.current[e],n=null==t?void 0:t.offsetWidth,r=null==t?void 0:t.offsetLeft;return{left:1===s?0:r,width:n,backgroundColor:"var(--".concat(s,"-item-color)")}},[g.current.length,s]);return(0,r.jsxs)(d,{className:"".concat(m?"changed":""),ref:h,children:[(0,r.jsx)("div",{className:"wrapper",children:(0,r.jsxs)(a.fu,{onChange:e=>(e=>{if(b(e+1),f(!0),null==x?void 0:x.isHandheld){var t;null==(t=h.current)||t.scrollIntoView()}})(e),vertical:null==x||!x.isDesktop,children:[(0,r.jsx)("div",{className:"scroll-wrapper",children:(0,r.jsxs)(a.wb,{className:"tablist position-".concat(s," ").concat(l," ").concat(m?"changed":""),children:[(0,r.jsx)("div",{className:"select-indicator",style:v}),t.map((e,t)=>{let n=(null==x?void 0:x.isDesktop)?e.fields.title:e.fields.titleMobile||e.fields.title;return(0,r.jsx)(a.oz,{className:"".concat(p.A.click.button," tab-button"),"data-action-detail":n,ref:e=>{g.current[t]=e},children:(0,r.jsx)("span",{className:"tab-name",children:x?n:""})},e.sys.id)})]})}),(0,r.jsx)(a.T2,{children:w.map((e,t)=>(0,r.jsx)(a.Kp,{className:"tab-panel ".concat(t===s-1?"selected":""),children:e},t))})]})}),n&&(0,r.jsx)(c.VI,{...n.fields,pictureStyle:"background-image ".concat(l),disableLazyLoad:!0,isDecorative:!0})]})}},38227:(e,t,n)=>{n.d(t,{oz:()=>Y,fu:()=>S,wb:()=>_,Kp:()=>U,T2:()=>N});var r=n(31126),a=n(36607),i=n(14232),o=n(7894),l=n(49266),s=n(62214),d=n(72117),c=n(96668),u=n(52078),p=n(26),b=n(41691),m=n(65285);function f(e){let{onFocus:t}=e,[n,r]=(0,i.useState)(!0),a=(0,b.a)();return n?i.createElement(m.j,{as:"button",type:"button",features:m.u.Focusable,onFocus:e=>{e.preventDefault();let n,i=50;n=requestAnimationFrame(function e(){if(i--<=0){n&&cancelAnimationFrame(n);return}if(t()){if(cancelAnimationFrame(n),!a.current)return;r(!1);return}n=requestAnimationFrame(e)})}}):null}var x=n(84163),g=n(73872),h=n(93249),w=n(91222),v=n(70367);let k=i.createContext(null);function y(e){let{children:t}=e,n=i.useRef({groups:new Map,get(e,t){var n;let r=this.groups.get(e);r||(r=new Map,this.groups.set(e,r));let a=null!=(n=r.get(t))?n:0;return r.set(t,a+1),[Array.from(r.keys()).indexOf(t),function(){let e=r.get(t);e>1?r.set(t,e-1):r.delete(t)}]}});return i.createElement(k.Provider,{value:n},t)}function T(e){let t=i.useContext(k);if(!t)throw Error("You must wrap your component in a <StableCollection>");let n=i.useId(),[r,a]=t.current.get(e,n);return i.useEffect(()=>a,[]),r}var P=n(89075),M=(e=>(e[e.Forwards=0]="Forwards",e[e.Backwards=1]="Backwards",e))(M||{}),I=(e=>(e[e.Less=-1]="Less",e[e.Equal=0]="Equal",e[e.Greater=1]="Greater",e))(I||{}),B=(e=>(e[e.SetSelectedIndex=0]="SetSelectedIndex",e[e.RegisterTab=1]="RegisterTab",e[e.UnregisterTab=2]="UnregisterTab",e[e.RegisterPanel=3]="RegisterPanel",e[e.UnregisterPanel=4]="UnregisterPanel",e))(B||{});let D={0(e,t){var n;let r=(0,x.wl)(e.tabs,e=>e.current),a=(0,x.wl)(e.panels,e=>e.current),i=r.filter(e=>{var t;return!(null!=(t=e.current)&&t.hasAttribute("disabled"))}),o={...e,tabs:r,panels:a};if(t.index<0||t.index>r.length-1){let n=(0,g.Y)(Math.sign(t.index-e.selectedIndex),{[-1]:()=>1,0:()=>(0,g.Y)(Math.sign(t.index),{[-1]:()=>0,0:()=>0,1:()=>1}),1:()=>0});if(0===i.length)return o;let a=(0,g.Y)(n,{0:()=>r.indexOf(i[0]),1:()=>r.indexOf(i[i.length-1])});return{...o,selectedIndex:-1===a?e.selectedIndex:a}}let l=r.slice(0,t.index),s=[...r.slice(t.index),...l].find(e=>i.includes(e));if(!s)return o;let d=null!=(n=r.indexOf(s))?n:e.selectedIndex;return -1===d&&(d=e.selectedIndex),{...o,selectedIndex:d}},1(e,t){if(e.tabs.includes(t.tab))return e;let n=e.tabs[e.selectedIndex],r=(0,x.wl)([...e.tabs,t.tab],e=>e.current),a=e.selectedIndex;return e.info.current.isControlled||-1===(a=r.indexOf(n))&&(a=e.selectedIndex),{...e,tabs:r,selectedIndex:a}},2:(e,t)=>({...e,tabs:e.tabs.filter(e=>e!==t.tab)}),3:(e,t)=>e.panels.includes(t.panel)?e:{...e,panels:(0,x.wl)([...e.panels,t.panel],e=>e.current)},4:(e,t)=>({...e,panels:e.panels.filter(e=>e!==t.panel)})},R=(0,i.createContext)(null);function L(e){let t=(0,i.useContext)(R);if(null===t){let t=Error("<".concat(e," /> is missing a parent <Tab.Group /> component."));throw Error.captureStackTrace&&Error.captureStackTrace(t,L),t}return t}R.displayName="TabsDataContext";let C=(0,i.createContext)(null);function j(e){let t=(0,i.useContext)(C);if(null===t){let t=Error("<".concat(e," /> is missing a parent <Tab.Group /> component."));throw Error.captureStackTrace&&Error.captureStackTrace(t,j),t}return t}function E(e,t){return(0,g.Y)(t.type,D,e,t)}C.displayName="TabsActionsContext";let F=v.Ac.RenderStrategy|v.Ac.Static,A=(0,v.FX)(function(e,t){var n,d;let b=(0,i.useId)(),{id:m="headlessui-tabs-tab-".concat(b),disabled:f=!1,autoFocus:k=!1,...y}=e,{orientation:M,activation:I,selectedIndex:B,tabs:D,panels:R}=L("Tab"),C=j("Tab"),E=L("Tab"),[F,A]=(0,i.useState)(null),S=(0,i.useRef)(null),_=(0,p.P)(S,t,A);(0,s.s)(()=>C.registerTab(S),[C,S]);let N=T("tabs"),U=D.indexOf(S);-1===U&&(U=N);let Y=U===B,z=(0,l._)(e=>{let t=e();if(t===x.Me.Success&&"auto"===I){let e=(0,w.bq)(S.current),t=E.tabs.findIndex(t=>t.current===e);-1!==t&&C.change(t)}

1return t}),O=(0,l._)(e=>{let t=D.map(e=>e.current).filter(Boolean);if(e.key===P.D.Space||e.key===P.D.Enter){e.preventDefault(),e.stopPropagation(),C.change(U);return}switch(e.key){case P.D.Home:case P.D.PageUp:return e.preventDefault(),e.stopPropagation(),z(()=>(0,x.CU)(t,x.BD.First));case P.D.End:case P.D.PageDown:return e.preventDefault(),e.stopPropagation(),z(()=>(0,x.CU)(t,x.BD.Last))}if(z(()=>(0,g.Y)(M,{vertical:()=>e.key===P.D.ArrowUp?(0,x.CU)(t,x.BD.Previous|x.BD.WrapAround):e.key===P.D.ArrowDown?(0,x.CU)(t,x.BD.Next|x.BD.WrapAround):x.Me.Error,horizontal:()=>e.key===P.D.ArrowLeft?(0,x.CU)(t,x.BD.Previous|x.BD.WrapAround):e.key===P.D.ArrowRight?(0,x.CU)(t,x.BD.Next|x.BD.WrapAround):x.Me.Error}))===x.Me.Success)return e.preventDefault()}),W=(0,i.useRef)(!1),q=(0,l._)(()=>{var e;W.current||(W.current=!0,null==(e=S.current)||e.focus({preventScroll:!0}),C.change(U),(0,h._)(()=>{W.current=!1}))}),G=(0,l._)(e=>{e.preventDefault()}),{isFocusVisible:X,focusProps:V}=(0,r.o)({autoFocus:k}),{isHovered:H,hoverProps:K}=(0,a.M)({isDisabled:f}),{pressed:Z,pressProps:J}=(0,o.Z)({disabled:f}),Q=(0,u._)({selected:Y,hover:H,active:Z,focus:X,autofocus:k,disabled:f}),$=(0,v.v6)({ref:_,onKeyDown:O,onMouseDown:G,onClick:q,id:m,role:"tab",type:(0,c.c)(e,F),"aria-controls":null==(d=null==(n=R[U])?void 0:n.current)?void 0:d.id,"aria-selected":Y,tabIndex:Y?0:-1,disabled:f||void 0,autoFocus:k},V,K,J);return(0,v.Ci)()({ourProps:$,theirProps:y,slot:Q,defaultTag:"button",name:"Tabs.Tab"})}),S=(0,v.FX)(function(e,t){let{defaultIndex:n=0,vertical:r=!1,manual:a=!1,onChange:o,selectedIndex:c=null,...b}=e,m=r?"vertical":"horizontal",g=a?"manual":"auto",h=null!==c,w=(0,d.Y)({isControlled:h}),k=(0,p.P)(t),[T,P]=(0,i.useReducer)(E,{info:w,selectedIndex:null!=c?c:n,tabs:[],panels:[]}),M=(0,u._)({selectedIndex:T.selectedIndex}),I=(0,d.Y)(o||(()=>{})),B=(0,d.Y)(T.tabs),D=(0,i.useMemo)(()=>({orientation:m,activation:g,...T}),[m,g,T]),L=(0,l._)(e=>(P({type:1,tab:e}),()=>P({type:2,tab:e}))),j=(0,l._)(e=>(P({type:3,panel:e}),()=>P({type:4,panel:e}))),F=(0,l._)(e=>{A.current!==e&&I.current(e),h||P({type:0,index:e})}),A=(0,d.Y)(h?e.selectedIndex:T.selectedIndex),S=(0,i.useMemo)(()=>({registerTab:L,registerPanel:j,change:F}),[]);(0,s.s)(()=>{P({type:0,index:null!=c?c:n})},[c]),(0,s.s)(()=>{if(void 0===A.current||T.tabs.length<=0)return;let e=(0,x.wl)(T.tabs,e=>e.current);e.some((e,t)=>T.tabs[t]!==e)&&F(e.indexOf(T.tabs[A.current]))});let _=(0,v.Ci)();return i.createElement(y,null,i.createElement(C.Provider,{value:S},i.createElement(R.Provider,{value:D},D.tabs.length<=0&&i.createElement(f,{onFocus:()=>{var e,t;for(let n of B.current)if((null==(e=n.current)?void 0:e.tabIndex)===0)return null==(t=n.current)||t.focus(),!0;return!1}}),_({ourProps:{ref:k},theirProps:b,slot:M,defaultTag:"div",name:"Tabs"}))))}),_=(0,v.FX)(function(e,t){let{orientation:n,selectedIndex:r}=L("Tab.List"),a=(0,p.P)(t),i=(0,u._)({selectedIndex:r});return(0,v.Ci)()({ourProps:{ref:a,role:"tablist","aria-orientation":n},theirProps:e,slot:i,defaultTag:"div",name:"Tabs.List"})}),N=(0,v.FX)(function(e,t){let{selectedIndex:n}=L("Tab.Panels"),r=(0,p.P)(t),a=(0,u._)({selectedIndex:n});return(0,v.Ci)()({ourProps:{ref:r},theirProps:e,slot:a,defaultTag:"div",name:"Tabs.Panels"})}),U=(0,v.FX)(function(e,t){var n,a,o,l;let d=(0,i.useId)(),{id:c="headlessui-tabs-panel-".concat(d),tabIndex:b=0,...f}=e,{selectedIndex:x,tabs:g,panels:h}=L("Tab.Panel"),w=j("Tab.Panel"),k=(0,i.useRef)(null),y=(0,p.P)(k,t);(0,s.s)(()=>w.registerPanel(k),[w,k]);let P=T("panels"),M=h.indexOf(k);-1===M&&(M=P);let I=M===x,{isFocusVisible:B,focusProps:D}=(0,r.o)(),R=(0,u._)({selected:I,focus:B}),C=(0,v.v6)({ref:y,id:c,role:"tabpanel","aria-labelledby":null==(a=null==(n=g[M])?void 0:n.current)?void 0:a.id,tabIndex:I?b:-1},D),E=(0,v.Ci)();return I||null!=(o=f.unmount)&&!o||null!=(l=f.static)&&l?E({ourProps:C,theirProps:f,slot:R,defaultTag:"div",features:F,visible:I,name:"Tabs.Panel"}):i.createElement(m.j,{"aria-hidden":"true",...C})}),Y=Object.assign(A,{Group:S,List:_,Panels:N,Panel:U})}}]);