(self.webpackChunk_N_E=self.webpackChunk_N_E||[]).push([[90261],{9006:(s,e,r)=>{"use strict";r.d(e,{A:()=>i});var l=r(87687),a=r(52751),t=r(31928),n=r(19901),o=r(44386);let c=(0,t.I)("label")({name:"Wrapper",class:"wfao701",propsAsIs:!1}),i=function(s){let{active:e,handleToggle:r,children:t,...i}=s,d=a.useId();return(0,l.jsxs)(c,{htmlFor:d,...i,children:[(0,l.jsx)(o.A,{id:d,active:e,handleToggle:r,handleFocusColor:null,handleColor:e?"var(--color-text)":"var(--color-gray-400)"}),(0,l.jsx)(n.A,{size:16}),t]})};r(41133)},34250:(s,e,r)=>{"use strict";r.d(e,{I4:()=>o,Qc:()=>t,sD:()=>c,y6:()=>n});var l=r(31928),a=r(59341);let t=(0,l.I)("div")({name:"GridStructure",class:"g1nrkimi",propsAsIs:!1}),n=(0,l.I)("div")({name:"BaseCodeWrapper",class:"bu47715",propsAsIs:!1}),o=(0,l.I)(a.P.div)({name:"LabeledColumn",class:"ljraie7",propsAsIs:!0}),c=(0,l.I)(a.P.div)({name:"LabeledRow",class:"l12tgnsh",propsAsIs:!0});r(97406)},26726:(s,e,r)=>{"use strict";r.d(e,{A:()=>d});var l=r(87687),a=r(52751),t=r(31928),n=r(20120),o=r(9006);let c=(0,t.I)("div")({name:"Wrapper",class:"w1n5e7hb",propsAsIs:!1}),i=(0,t.I)(function(s){let{isPerspectiveEnabled:e,setIsPerspectiveEnabled:r,...a}=s;return(0,l.jsx)(o.A,{active:e,handleToggle:()=>r(!e),...a,children:"Show Perspective"})})({name:"GridPerspectiveToggle",class:"g19jnwoh",propsAsIs:!0}),d=function(s){let{defaultPerspectiveEnabled:e=!0,children:r,hidePerspectiveControl:t,...o}=s,d=a.useId().replace(/:/g,""),[p,u]=a.useState(e);return(0,l.jsx)(n.Ay,{...o,id:"grid-demo-".concat(d),outputWrapper:null,controlPosition:"top",children:s=>(0,l.jsxs)(c,{children:[r({...s,isPerspectiveEnabled:p}),!t&&(0,l.jsx)(i,{id:d,isPerspectiveEnabled:p,setIsPerspectiveEnabled:u})]})})};r(73428)},4230:(s,e,r)=>{"use strict";r.d(e,{A:()=>c});var l=r(87687),a=r(31928),t=r(59341);let n=(0,a.I)(t.P.div)({name:"Wrapper",class:"wg9umku",propsAsIs:!0}),o=(0,a.I)(t.P.div)({name:"InnerWrapper",class:"iizukyq",propsAsIs:!0}),c=function(s){let{ref:e,primary:r,layout:a=!0,style:c={},wrapperStyle:i={},textWrapperStyle:d={},children:p,...u}=s;return(0,l.jsx)(n,{ref:e,layout:a,initial:{borderRadius:4},style:{background:r?"hsl(50deg 100% 90%)":"var(--color-gray-500)",...c},...u,children:(0,l.jsx)(o,{layout:a,initial:{borderRadius:2},style:{color:r?"black":"var(--color-text)",background:r?"hsl(50deg 100% 50%)":"var(--color-gray-100)",...i},children:(0,l.jsx)(t.P.span,{layout:a,style:{display:"inline-block",...d},children:p})})})};r(49452)},70074:(s,e,r)=>{"use strict";r.r(e),r.d(e,{default:()=>w});var l=r(87687),a=r(31928),t=r(59341),n=r(51311),o=r(20120),c=r(26726),i=r(4230),d=r(34250);let p=(0,a.I)("div")({name:"ControlWrapper",class:"cp4zhtm",propsAsIs:!1}),u=(0,a.I)("div")({name:"Row",class:"r10w9cdz",propsAsIs:!1}),g=(0,a.I)(t.P.div)({name:"DemoWrapper",class:"d4chs8q",propsAsIs:!0}),h=(0,a.I)("div")({name:"Layer",class:"l17tul41",propsAsIs:!1}),m=(0,a.I)(h)({name:"BackLayer",class:"b13svipt",propsAsIs:!0}),I=(0,a.I)("div")({name:"ColumnStructure",class:"c129p5dj",propsAsIs:!1}),y=(0,a.I)("div")({name:"RowStructure",class:"rq0ogn8",propsAsIs:!1}),j=(0,a.I)("div")({name:"ChildWrapper",class:"cxpva8w",propsAsIs:!1}),x=(0,a.I)(i.A)({name:"Item",class:"i19y52df",propsAsIs:!0}),v=(0,a.I)(d.y6)({name:"CodeWrapper",class:"cgm25an",propsAsIs:!0}),w=function(){return(0,l.jsx)(c.A,{initialValues:{placeContent:"center"},customGrid:{gridTemplateColumns:"1fr"},defaultPerspectiveEnabled:!1,controls:[(0,l.jsx)(p,{children:(0,l.jsx)(o.Cd,{id:"placeContent",label:"place-content",options:["start","center","end"]})},"placeContent")],children:s=>{let{placeContent:e,isPerspectiveEnabled:r}=s,a=".parent {\n  display: grid;\n  place-content: ".concat(e,";\n}");return(0,l.jsxs)(u,{children:[(0,l.jsx)(v,{children:(0,l.jsx)(n.default,{omitCopyButton:!0,lockedToColorMode:"dark",code:a,lang:"css"})}),(0,l.jsxs)(g,{layout:!0,layoutRoot:!0,children:[(0,l.jsxs)(m,{style:{transform:r?"translateX(10%) skewY(18deg) scaleX(0.85)":"translateX(0%) skewY(0deg) scaleX(1)"},children:[(0,l.jsx)(y,{style:{alignContent:e},children:(0,l.jsx)(d.sD,{layout:!r,style:{gridColumn:"1 / 3",gridRow:1},children:"R1"})}),(0,l.jsx)(I,{style:{justifyContent:e},children:(0,l.jsx)(d.I4,{layout:!r,style:{gridColumn:1,gridRow:"1 / 3"},children:"C1"})}),(0,l.jsx)(y,{style:{alignContent:e},children:(0,l.jsx)(d.sD,{layout:!r,style:{gridColumn:"1 / 3",gridRow:1,background:"transparent"},children:"R1"})}),(0,l.jsx)(I,{style:{justifyContent:e},children:(0,l.jsx)(d.I4,{layout:!r,style:{gridColumn:1,gridRow:"1 / 3",background:"transparent"},children:"C1"})})]}),(0,l.jsx)(h,{style:{transform:r?"translateX(-10%) skewY(18deg) scaleX(0.85)":"translateX(0%) skewY(0deg) scaleX(1)"},children:(0,l.jsx)(j,{style:{placeContent:e},children:(0,l.jsx)(x,{layout:!r,style:{opacity:r?.8:1},children:"Child"})})})]})]})}})};r(32848)},41133:s=>{s.exports={wfao701:"wfao701"}},97406:s=>{s.exports={g1nrkimi:"g1nrkimi",bu47715:"bu47715",ljraie7:"ljraie7",l12tgnsh:"l12tgnsh"}},73428:s=>{s.exports={w1n5e7hb:"w1n5e7hb",g19jnwoh:"g19jnwoh"}},49452:s=>{s.exports={wg9umku:"wg9umku",fadeFromTransparent:"fadeFromTransparent",iizukyq:"iizukyq"}},32848:s=>{s.exports={cp4zhtm:"cp4zhtm",r10w9cdz:"r10w9cdz",d4chs8q:"d4chs8q",l17tul41:"l17tul41",b13svipt:"b13svipt",c129p5dj:"c129p5dj",rq0ogn8:"rq0ogn8",cxpva8w:"cxpva8w",i19y52df:"i19y52df",cgm25an:"cgm25an"}}}]);
//# sourceMappingURL=90261.a62faca7e4cff86b.js.map