(self.webpackChunk_N_E=self.webpackChunk_N_E||[]).push([[1816],{53645:(s,e,t)=>{"use strict";t.d(e,{A:()=>r});let r=(0,t(2651).A)("ChevronLeft",[["path",{d:"m15 18-6-6 6-6",key:"1wnfg3"}]])},99150:(s,e,t)=>{"use strict";t.d(e,{A:()=>r});let r=(0,t(2651).A)("ChevronRight",[["path",{d:"m9 18 6-6-6-6",key:"mthhwq"}]])},37501:(s,e,t)=>{"use strict";t.d(e,{A:()=>r});let r=(0,t(2651).A)("ChevronUp",[["path",{d:"m18 15-6-6-6 6",key:"153udz"}]])},87378:(s,e,t)=>{"use strict";t.d(e,{A:()=>q});var r=t(87687);t(52751);var a=t(31928),n=t(37501),o=t(88700),i=t(53645),l=t(99150),p=t(30251),c=t(59341),d=t(68852);function h(s){let{distance:e,animateTransitions:t,flipTextSide:a,multiple:n=1,unit:o="px",...i}=s,l=(0,p.zh)({from:{number:!0===t?0:e},number:e,immediate:!t});return(0,r.jsxs)(u,{as:!0===t?c.P.div:"div",style:{width:!0===t?void 0:e,height:20},animate:!0===t?{width:e}:void 0,...i,children:[(0,r.jsx)(v,{children:(0,r.jsxs)(I,{children:[(0,r.jsx)(f,{size:20}),(0,r.jsx)(w,{size:20}),(0,r.jsx)(z,{})]})}),(0,r.jsx)(C,{style:{top:a?-16:16},children:l.number.to(s=>{let e="px"===o?Math.round(s*n):(0,d.GB)(s/16*n,1).toFixed(1);return s<40?e:e+o})})]})}function m(s){let{distance:e,animateTransitions:t,multiple:a=1,...n}=s,o=(0,p.zh)({from:{number:0},number:e,immediate:!t});return(0,r.jsxs)(u,{as:t?c.P.div:"div",style:{width:20,height:t?void 0:e},animate:{height:t?e:void 0},...n,children:[(0,r.jsx)(v,{style:{opacity:e<16?0:1},children:(0,r.jsxs)(A,{children:[(0,r.jsx)(j,{size:20}),(0,r.jsx)(b,{size:20}),(0,r.jsx)(k,{})]})}),(0,r.jsx)(S,{children:o.number.to(s=>Math.round(s*a)+"px")})]})}let u=(0,a.I)(c.P.div)({name:"Wrapper",class:"w1mbq51h",propsAsIs:!0}),v=(0,a.I)("div")({name:"ArrowWrapper",class:"agjw958",propsAsIs:!1}),x=(0,a.I)("div")({name:"ArrowElem",class:"a15b5ky0",propsAsIs:!1}),A=(0,a.I)(x)({name:"VerticalArrowElem",class:"vt3r0v5",propsAsIs:!0}),I=(0,a.I)(x)({name:"HorizontalArrowElem",class:"h8ja5sk",propsAsIs:!0}),j=(0,a.I)(n.A)({name:"Up",class:"u8eocc7",propsAsIs:!0}),b=(0,a.I)(o.A)({name:"Down",class:"d1phaa8",propsAsIs:!0}),f=(0,a.I)(i.A)({name:"Left",class:"l1xa6ime",propsAsIs:!0}),w=(0,a.I)(l.A)({name:"Right",class:"r15impnm",propsAsIs:!0}),y=(0,a.I)("div")({name:"Shaft",class:"sqdmb0l",propsAsIs:!1}),k=(0,a.I)(y)({name:"VerticalShaft",class:"vfrhcon",propsAsIs:!0}),z=(0,a.I)(y)({name:"HorizontalShaft",class:"h1o8euj3",propsAsIs:!0}),g=(0,a.I)(p.CS.span)({name:"Label",class:"l18fzpc6",propsAsIs:!0}),S=(0,a.I)(g)({name:"VerticalLabel",class:"vcbaeky",propsAsIs:!0}),C=(0,a.I)(g)({name:"HorizontalLabel",class:"hguumh5",propsAsIs:!0}),q=function(s){let{distance:e,animateTransitions:t,flipTextSide:a,multiple:n=1,axis:o,unit:i="px",...l}=s;return(0,r.jsx)("horizontal"===o?h:m,{distance:e,animateTransitions:t,flipTextSide:a,multiple:n,unit:i,...l})};t(27687)},94137:(s,e,t)=>{"use strict";t.r(e),t.d(e,{default:()=>u});var r=t(87687),a=t(31928),n=t(39097),o=t(87378),i=t(74263),l=t(25632);let p=(0,a.I)("div")({name:"OuterWrapper",class:"o3hotw",propsAsIs:!1}),c=(0,a.I)("div")({name:"Wrapper",class:"wg4ljfp",propsAsIs:!1}),d=(0,a.I)("div")({name:"ButtonWrapper",class:"b12y0iwp",propsAsIs:!1}),h=(0,a.I)("div")({name:"Button",class:"bay0xo3",propsAsIs:!1}),m=(0,a.I)("div")({name:"ArrowWrapper",class:"aadvqnt",propsAsIs:!1}),u=function(){return(0,r.jsx)(n.Ay,{id:"button-width-demo",initialValues:{fontSize:100,unit:"px"},outputWrapper:l.A,controls:[(0,r.jsx)(n.oP,{id:"fontSize",label:"Default font size",min:100,max:250,previewRenderer:s=>"".concat(s,"%")},"fontSize"),(0,r.jsx)(n.wI,{id:"unit",label:"Width unit",options:["px","rem"]},"unit")],controlPosition:"top",children:s=>{let{fontSize:e,unit:t}=s,a="px"===t?225:e/100*225;return(0,r.jsxs)(p,{children:[(0,r.jsxs)(c,{children:[(0,r.jsx)(d,{style:{width:a},children:(0,r.jsx)(h,{style:{fontSize:"".concat(e/100*1.25,"rem")},children:"Random Button"})}),(0,r.jsx)(m,{children:(0,r.jsx)(o.A,{axis:"horizontal",distance:a})})]}),(0,r.jsx)(i.A,{code:function(s){let{unit:e}=s;return".button {\n  font-size: 1.25rem;\n  width: ".concat("px"===e?"240px":"15rem",";\n  max-width: 100%;\n}")}({unit:t}),minCodeHeight:"11.125rem"})]})}})};t(45173)},25632:(s,e,t)=>{"use strict";t.d(e,{A:()=>n});var r=t(87687),a=t(78262);let n=function(s){return(0,r.jsx)(a.A,{...s,layout:!1,padding:0,style:{backgroundColor:"white"}})}},74263:(s,e,t)=>{"use strict";t.d(e,{A:()=>c});var r=t(87687),a=t(52751),n=t(31928),o=t(51311),i=t(17503);let l=(0,n.I)("div")({name:"CodeWrapper",class:"c93kv52",propsAsIs:!1}),p=(0,n.I)(i.A)({name:"StyledSpinner",class:"scev1do",propsAsIs:!0}),c=function(s){let{code:e,minCodeHeight:t}=s,[n,i]=a.useState(!1);return(0,r.jsxs)(l,{style:{"--min-code-height":t},children:[!n&&(0,r.jsx)(p,{}),(0,r.jsx)(o.default,{lockedToColorMode:"light",omitCopyButton:!0,onMount:()=>i(!0),code:e,lang:"css"})]})};t(15603)},27687:s=>{s.exports={w1mbq51h:"w1mbq51h",agjw958:"agjw958",a15b5ky0:"a15b5ky0",vt3r0v5:"vt3r0v5","verticalEnter-vt3r0v5a15b5ky0":"verticalEnter-vt3r0v5a15b5ky0",h8ja5sk:"h8ja5sk","horizontalEnter-h8ja5ska15b5ky0":"horizontalEnter-h8ja5ska15b5ky0",u8eocc7:"u8eocc7",d1phaa8:"d1phaa8",l1xa6ime:"l1xa6ime",r15impnm:"r15impnm",sqdmb0l:"sqdmb0l",vfrhcon:"vfrhcon",h1o8euj3:"h1o8euj3",l18fzpc6:"l18fzpc6",vcbaeky:"vcbaeky",hguumh5:"hguumh5"}},45173:s=>{s.exports={o3hotw:"o3hotw",wg4ljfp:"wg4ljfp",b12y0iwp:"b12y0iwp",bay0xo3:"bay0xo3",aadvqnt:"aadvqnt"}},15603:s=>{s.exports={c93kv52:"c93kv52",scev1do:"scev1do"}}}]);
//# sourceMappingURL=1816.c1f42207eb65e83e.js.map