(self.webpackChunk_N_E=self.webpackChunk_N_E||[]).push([[18505],{37501:(s,e,r)=>{"use strict";r.d(e,{A:()=>a});let a=(0,r(2651).A)("ChevronUp",[["path",{d:"m18 15-6-6-6 6",key:"153udz"}]])},21212:(s,e,r)=>{"use strict";r.r(e),r.d(e,{default:()=>B});var a=r(87687),t=r(31928),o=r(39097);r(52751);var n=r(37501),i=r(88700),p=r(30251),l=r(59341);let c=(0,t.I)(l.P.div)({name:"Wrapper",class:"w5nenoh",propsAsIs:!0}),d=(0,t.I)("div")({name:"ArrowWrapper",class:"a16lwgyt",propsAsIs:!1}),m=(0,t.I)("div")({name:"ArrowElem",class:"aoi571e",propsAsIs:!1}),v=(0,t.I)(m)({name:"VerticalArrowElem",class:"v1yrp6j5",propsAsIs:!0}),h=(0,t.I)(n.A)({name:"Up",class:"u19byl7a",propsAsIs:!0}),u=(0,t.I)(i.A)({name:"Down",class:"d1v1aldn",propsAsIs:!0}),I=(0,t.I)("div")({name:"Shaft",class:"sugb9ju",propsAsIs:!1}),x=(0,t.I)(I)({name:"VerticalShaft",class:"v1h7r6zz",propsAsIs:!0}),A=(0,t.I)(p.CS.span)({name:"Label",class:"l10mb23h",propsAsIs:!0}),j=(0,t.I)(A)({name:"VerticalLabel",class:"vye2sp8",propsAsIs:!0}),y=function(s){let{fontSize:e,marginBottom:r,animateTransitions:t}=s,o=e*r;return(0,a.jsxs)(c,{as:t?l.P.div:"div",style:{width:20,height:t?void 0:o},animate:{height:t?o:void 0},children:[(0,a.jsx)(d,{style:{opacity:o<16?0:1},children:(0,a.jsxs)(v,{children:[(0,a.jsx)(h,{size:20}),(0,a.jsx)(u,{size:20}),(0,a.jsx)(x,{})]})}),(0,a.jsxs)(j,{children:[e," \xd7 ",r," = ",Math.round(o),"px"]})]})};r(71350);var g=r(74263),w=r(25632);let b=(0,t.I)("div")({name:"OuterWrapper",class:"o4hicp9",propsAsIs:!1}),f=(0,t.I)("div")({name:"Wrapper",class:"w1pu7o56",propsAsIs:!1}),z=(0,t.I)("div")({name:"TextWrapper",class:"t1iytxip",propsAsIs:!1}),k=(0,t.I)("p")({name:"Paragraph",class:"p1n8j7d0",propsAsIs:!1}),S=(0,t.I)("div")({name:"BlockWrapper",class:"b19ss1ve",propsAsIs:!1}),C=(0,t.I)("div")({name:"EmBlock",class:"eikeh18",propsAsIs:!1}),W=(0,t.I)("div")({name:"ArrowWrapper",class:"a1768v2w",propsAsIs:!1}),B=function(){return(0,a.jsx)(o.Ay,{id:"em-demo",initialValues:{fontSize:16,marginBottom:1.5},outputWrapper:w.A,controls:[(0,a.jsx)(o.oP,{id:"fontSize",label:"font-size",min:12,max:48,previewRenderer:s=>"".concat(s,"px")},"fontSize"),(0,a.jsx)(o.oP,{id:"marginBottom",label:"margin-bottom",min:0,max:2,step:.05,previewRenderer:s=>"".concat(s,"em")},"marginBottom")],controlPosition:"top",children:s=>{let{fontSize:e,marginBottom:r}=s;return(0,a.jsxs)(b,{children:[(0,a.jsx)(f,{children:(0,a.jsxs)(z,{style:{fontSize:e,marginBottom:"".concat(r,"em")},children:[(0,a.jsx)(k,{style:{fontSize:"".concat(e,"px")},children:"Some words and things."}),(0,a.jsxs)(S,{children:[(0,a.jsx)(C,{style:{height:e*r}}),(0,a.jsx)(W,{children:(0,a.jsx)(y,{animateTransitions:!1,fontSize:e,marginBottom:r})})]})]})}),(0,a.jsx)(g.A,{minCodeHeight:"9.5rem",code:function(s){let{fontSize:e,marginBottom:r}=s;return".some-paragraph {\n  font-size: ".concat(e,"px;\n  margin-bottom: ").concat(r,"em;\n}")}({fontSize:e,marginBottom:r})})]})}})};r(77951)},25632:(s,e,r)=>{"use strict";r.d(e,{A:()=>o});var a=r(87687),t=r(78262);let o=function(s){return(0,a.jsx)(t.A,{...s,layout:!1,padding:0,style:{backgroundColor:"white"}})}},74263:(s,e,r)=>{"use strict";r.d(e,{A:()=>c});var a=r(87687),t=r(52751),o=r(31928),n=r(51311),i=r(17503);let p=(0,o.I)("div")({name:"CodeWrapper",class:"c93kv52",propsAsIs:!1}),l=(0,o.I)(i.A)({name:"StyledSpinner",class:"scev1do",propsAsIs:!0}),c=function(s){let{code:e,minCodeHeight:r}=s,[o,i]=t.useState(!1);return(0,a.jsxs)(p,{style:{"--min-code-height":r},children:[!o&&(0,a.jsx)(l,{}),(0,a.jsx)(n.default,{lockedToColorMode:"light",omitCopyButton:!0,onMount:()=>i(!0),code:e,lang:"css"})]})};r(15603)},71350:s=>{s.exports={w5nenoh:"w5nenoh",a16lwgyt:"a16lwgyt",aoi571e:"aoi571e",v1yrp6j5:"v1yrp6j5","verticalEnter-v1yrp6j5aoi571e":"verticalEnter-v1yrp6j5aoi571e",u19byl7a:"u19byl7a",d1v1aldn:"d1v1aldn",sugb9ju:"sugb9ju",v1h7r6zz:"v1h7r6zz",l10mb23h:"l10mb23h",vye2sp8:"vye2sp8"}},77951:s=>{s.exports={o4hicp9:"o4hicp9",w1pu7o56:"w1pu7o56",t1iytxip:"t1iytxip",b19ss1ve:"b19ss1ve",eikeh18:"eikeh18",a1768v2w:"a1768v2w"}},15603:s=>{s.exports={c93kv52:"c93kv52",scev1do:"scev1do"}}}]);
//# sourceMappingURL=18505.766b1c8f0a4fc644.js.map