(self.webpackChunk_N_E=self.webpackChunk_N_E||[]).push([[34456],{44386:(s,e,t)=>{"use strict";t.d(e,{A:()=>i});var a=t(87687);t(52751);var r=t(31928),l=t(30251);let n=(0,r.I)(l.CS.button)({name:"Wrapper",class:"w1o3yz26",propsAsIs:!0}),o=(0,r.I)(l.CS.div)({name:"Ball",class:"bl5hz2w",propsAsIs:!0}),i=s=>{let{active:e,handleToggle:t,backgroundColor:r,handleFocusColor:i="linear-gradient(\n 0deg,\n hsl(230deg, 100%, 50%),\n hsl(240deg, 100%, 70%)\n)",handleColor:p="var(--color-text)",handleSize:d=16,style:c={},...u}=s,h=d+4,m=.1*h,g={width:2*h+2*m,padding:m,"--radius":.25*h+"px",...c},b=(0,l.zh)({width:h,height:h,transform:e?"translateX(100%)":"translateX(0%)",config:{tension:370,friction:16,mass:.75}});return(0,a.jsx)(n,{type:"button","aria-pressed":e,style:g,onClick:t,...u,children:(0,a.jsx)(o,{style:{...b,"--outline-color":r,"--handle-color":p,"--handle-focus-color":i||p}})})};t(82357)},68773:(s,e,t)=>{"use strict";t.d(e,{A:()=>i});var a=t(87687),r=t(31928);let l=(0,r.I)("div")({name:"LabelWrapper",class:"l1vwbmqa",propsAsIs:!1}),n=(0,r.I)("span")({name:"LabelText",class:"l1nhsvin",propsAsIs:!1}),o=(0,r.I)("img")({name:"Stem",class:"snnhvd6",propsAsIs:!1}),i=s=>{let{isVisible:e,orientation:t,style:r,children:i}=s;return(0,a.jsxs)(l,{style:{...r,opacity:e?1:0},children:[(0,a.jsx)(n,{style:"flipped-up"===t?{top:0,left:0,transform:"translate(5%, -125%)"}:"up"===t?{top:0,left:0,transform:"translate(-60%, -140%)"}:{bottom:0,right:0,transform:"translate(60%, 140%)"},children:i}),(0,a.jsx)(o,{src:"/images/stem.png",style:{transform:"flipped-up"===t?"rotate(90deg)":"up"===t?"rotate(180deg)":void 0}})]})};t(47483)},34456:(s,e,t)=>{"use strict";t.r(e),t.d(e,{default:()=>f});var a=t(87687),r=t(52751),l=t(31928),n=t(30251),o=t(44386),i=t(19901),p=t(42971),d=t(68773),c=t(30401);let u=(0,l.I)("div")({name:"OuterWrapper",class:"o1y4kj32",propsAsIs:!1}),h=(0,l.I)(c.ZH)({name:"Wrapper",class:"w1qyuseg",propsAsIs:!0});(0,l.I)(c.OC)({name:"ChildElement",class:"c5fm8rl",propsAsIs:!0}),(0,l.I)("span")({name:"TextWrapper",class:"t1z08814",propsAsIs:!1});let m=(0,l.I)(c.uD)({name:"NegativeMargin",class:"n3sbqnm",propsAsIs:!0});(0,l.I)(c.uD)({name:"NegativeTopMargin",class:"n1r37o4o",propsAsIs:!0});let g=(0,l.I)("div")({name:"ToggleWrapper",class:"tzi6mfb",propsAsIs:!1}),b=(0,l.I)("div")({name:"ToggleLabel",class:"tfb6u3x",propsAsIs:!1}),f=function(){let[s,e]=r.useState(!0),[t,l,f]=(0,p.A)({mode:"interactive"}),v=(0,n.zh)({transform:"translateX(".concat(0===t?0:-12,"%)"),config:c.YP[0]}),I=(0,n.zh)({transform:"translateX(".concat(0===t?0:12,"%)"),config:c.YP[0]});return(0,a.jsxs)(u,{children:[(0,a.jsxs)(h,{...f,children:[(0,a.jsxs)(c.Wd,{style:{...I},children:[(0,a.jsxs)(c.js,{children:[(0,a.jsx)(c.OC,{style:{borderRadius:"2px 2px 0 0"}}),s&&(0,a.jsx)(m,{style:{height:50}})]}),s&&(0,a.jsx)(d.A,{isVisible:2===t,style:{bottom:"-7%",right:"-25%"},children:"margin-bottom: -25px"})]}),(0,a.jsxs)(c.Wd,{style:{top:125,zIndex:2,...v},children:[(0,a.jsxs)(c.js,{children:[s?(0,a.jsx)(c.uD,{style:{height:50}}):(0,a.jsx)(i.A,{size:50}),(0,a.jsx)(c.OC,{style:{borderRadius:"0 0 2px 2px"}})]}),s&&(0,a.jsx)(d.A,{orientation:"up",isVisible:2===t,style:{top:"-28%",left:"-25%"},children:"margin-top: 25px"})]})]}),(0,a.jsxs)(g,{children:[(0,a.jsx)(b,{onClick:()=>e(!1),style:{fontWeight:s?"var(--font-weight-normal)":"var(--font-weight-medium)",color:s?"var(--color-gray-700)":"var(--color-text)"},children:"No Margins"}),(0,a.jsx)(i.A,{size:16}),(0,a.jsx)(o.A,{active:s,backgroundColor:"var(--color-gray-100)",handleToggle:()=>e(!s)}),(0,a.jsx)(i.A,{size:16}),(0,a.jsx)(b,{onClick:()=>e(!0),style:{fontWeight:s?"var(--font-weight-medium)":"var(--font-weight-normal)",color:s?"var(--color-text)":"var(--color-gray-700)"},children:"Margins"})]})]})};t(94214)},30401:(s,e,t)=>{"use strict";t.d(e,{OC:()=>p,Wd:()=>o,YA:()=>h,YP:()=>l,ZH:()=>n,dw:()=>u,js:()=>i,lJ:()=>d,uD:()=>c});var a=t(31928),r=t(30251);let l=[{tension:170,friction:60}],n=(0,a.I)("button")({name:"BaseWrapper",class:"b8ou0aw",propsAsIs:!1}),o=(0,a.I)(r.CS.div)({name:"Layer",class:"l145skp",propsAsIs:!0}),i=(0,a.I)("div")({name:"Skew",class:"scsyhkg",propsAsIs:!1}),p=(0,a.I)("div")({name:"BaseElement",class:"bhu7dgk",propsAsIs:!1}),d=(0,a.I)(p)({name:"ChildElement",class:"cozlf4l",propsAsIs:!0}),c=(0,a.I)("div")({name:"BaseMargin",class:"bwtfw5o",propsAsIs:!1}),u=(0,a.I)("div")({name:"BasePadding",class:"b8p37cb",propsAsIs:!1}),h=(0,a.I)("div")({name:"InterjectedElement",class:"ibaje2d",propsAsIs:!1});t(29423)},42971:(s,e,t)=>{"use strict";t.d(e,{A:()=>n});var a=t(52751),r=t(66557);let l=[{id:"consolidated",delay:1750},{id:"separate",delay:750},{id:"labeled",delay:3e3},{id:"separate",delay:250}],n=function(){let{mode:s="interval"}=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{},[e,t]=a.useState(0),n=l[e];(0,r.A)(()=>{t((e+1)%l.length)},"interval"===s?n.delay:null);let o={};return a.useEffect(()=>{let a;if("interactive"!==s)return;let r=l[e];return(1===e||3===e)&&(a=window.setTimeout(()=>{t((e+1)%l.length)},r.delay)),()=>{window.clearTimeout(a)}},[s,e]),"interactive"===s&&(o.onMouseEnter=s=>{t(1)},o.onMouseLeave=s=>{t(3)},o.onFocus=o.onMouseEnter,o.onBlur=o.onMouseLeave),[e,n,o]}},82357:s=>{s.exports={w1o3yz26:"w1o3yz26",bl5hz2w:"bl5hz2w"}},47483:s=>{s.exports={l1vwbmqa:"l1vwbmqa",l1nhsvin:"l1nhsvin",snnhvd6:"snnhvd6"}},94214:s=>{s.exports={o1y4kj32:"o1y4kj32",w1qyuseg:"w1qyuseg",b8ou0aw:"b8ou0aw",n3sbqnm:"n3sbqnm",bwtfw5o:"bwtfw5o",tzi6mfb:"tzi6mfb",fadeIn:"fadeIn",tfb6u3x:"tfb6u3x"}},29423:s=>{s.exports={b8ou0aw:"b8ou0aw",l145skp:"l145skp",scsyhkg:"scsyhkg",bhu7dgk:"bhu7dgk",cozlf4l:"cozlf4l",bwtfw5o:"bwtfw5o",b8p37cb:"b8p37cb",ibaje2d:"ibaje2d"}}}]); //# sourceMappingURL=34456.20ab0b37a6b2908a.js.map