(self.webpackChunk_N_E=self.webpackChunk_N_E||[]).push([[28429],{28429:(e,n,s)=>{"use strict";s.r(n),s.d(n,{default:()=>g});var t=s(87687),l=s(31928),r=s(20120),o=s(71597),i=s(99800);let c="flexbox",a={flexbox:".container {\n  display: flex;\n  justify-content: center;\n  align-items: center;\n}\n\n.element {\n  width: 50%;\n  height: 50%;\n}",grid:".container {\n  display: grid;\n  place-content: center;\n}\n\n.element {\n  width: 50%;\n  height: 50%;\n}"};var d=s(59341);let p=(0,l.I)(d.P.div)({name:"Wrapper",class:"wz06ft9",propsAsIs:!0}),h=(0,l.I)(d.P.div)({name:"InnerWrapper",class:"it9po97",propsAsIs:!0});s(17830);let u=(0,l.I)("div")({name:"Row",class:"rmzh41",propsAsIs:!1}),x=(0,l.I)("div")({name:"Column",class:"c1lje9ew",propsAsIs:!1}),m=(0,l.I)(x)({name:"CodeColumn",class:"c1a4nfp1",propsAsIs:!0}),f=(0,l.I)(x)({name:"DemoColumn",class:"d1hj7c07",propsAsIs:!0}),j=(0,l.I)(o.A)({name:"Container",class:"cx58d8v",propsAsIs:!0}),I=(0,l.I)(function(e){let{ref:n,children:s,...l}=e;return(0,t.jsx)(p,{ref:n,layout:!0,...l,children:(0,t.jsx)(h,{layout:!0,children:(0,t.jsx)(d.P.span,{layout:!0,children:s})})})})({name:"ChildElement",class:"c1ho0wkr",propsAsIs:!0}),g=function(e){let{codeOutput:n}=e;return(0,t.jsx)(r.Ay,{initialValues:{layoutMode:c},controlPosition:"top",customGrid:{gridTemplateColumns:"1fr"},outputWrapper:null,controls:[(0,t.jsx)(r.Cd,{id:"layoutMode",label:"Layout Algorithm",options:["flexbox","grid"]},"layoutMode")],children:e=>{let{layoutMode:s}=e;return(0,t.jsxs)(u,{children:[(0,t.jsx)(m,{children:(0,t.jsx)(i.A,{lang:"css",code:function(){let e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:c;return a[e]}(s),children:n})}),(0,t.jsx)(f,{children:(0,t.jsx)(j,{style:{display:"grid"===s?"grid":"flex",justifyContent:"center",alignContent:"grid"===s?"center":void 0,alignItems:"flexbox"===s?"center":void 0},children:(0,t.jsx)(I,{children:".element"})})})]})}})};s(86341)},86341:e=>{e.exports={rmzh41:"rmzh41",c1lje9ew:"c1lje9ew",c1a4nfp1:"c1a4nfp1",d1hj7c07:"d1hj7c07",cx58d8v:"cx58d8v",c1ho0wkr:"c1ho0wkr"}},17830:e=>{e.exports={wz06ft9:"wz06ft9",it9po97:"it9po97"}}}]);
//# sourceMappingURL=28429.cf56006de423f617.js.map