(self.webpackChunk_N_E=self.webpackChunk_N_E||[]).push([[49590],{49590:(s,e,l)=>{"use strict";l.r(e),l.d(e,{default:()=>u});var r=l(87687);l(52751);var t=l(31928),a=l(20120);let c=(0,t.I)("div")({name:"Ruler",class:"r1qpi235",propsAsIs:!1}),n=(0,t.I)("div")({name:"Wrapper",class:"w1lolrdd",propsAsIs:!1}),i=(0,t.I)("div")({name:"Column",class:"cy53ch8",propsAsIs:!1}),d=(0,t.I)("div")({name:"Label",class:"l1g3thsf",propsAsIs:!1}),p=(0,t.I)("div")({name:"Box",class:"b1g5ulsc",propsAsIs:!1}),o=(0,t.I)(p)({name:"HueBox",class:"h1wiatq",propsAsIs:!0}),h=(0,t.I)(p)({name:"FilterBox",class:"f1xp7lg",propsAsIs:!0}),u=function(){return(0,r.jsx)(a.Ay,{outputWrapper:null,customGrid:{gridTemplateColumns:"min(400px, 100%)",justifyContent:"center"},initialValues:{hueRotate:0},controls:[(0,r.jsx)(a.oP,{id:"hueRotate",label:"Target hue",min:0,max:360,previewRenderer:s=>"".concat(s,"deg")},"hueRotate")],children:s=>{let{hueRotate:e}=s;return(0,r.jsx)(c,{children:(0,r.jsxs)(n,{children:[(0,r.jsxs)(i,{children:[(0,r.jsx)(d,{children:"background-color:"}),(0,r.jsxs)(o,{style:{"--hue":e+"deg"},children:["hsl(",e,"deg 100% 80%)"]})]}),(0,r.jsxs)(i,{children:[(0,r.jsx)(d,{children:"filter:"}),(0,r.jsxs)(h,{style:{"--hue":e+"deg"},children:["hue-rotate(",e,"deg)"]})]})]})})}})};l(9436)},9436:s=>{s.exports={r1qpi235:"r1qpi235",w1lolrdd:"w1lolrdd",cy53ch8:"cy53ch8",l1g3thsf:"l1g3thsf",b1g5ulsc:"b1g5ulsc",h1wiatq:"h1wiatq",f1xp7lg:"f1xp7lg"}}}]); //# sourceMappingURL=49590.10adb1a76916e57c.js.map