(self.webpackChunk_N_E=self.webpackChunk_N_E||[]).push([[32306],{32306:(n,r,e)=>{"use strict";e.r(r),e.d(r,{default:()=>v});var s=e(87687);e(52751);var t=e(31928),i=e(68852),c=e(20120),o=e(99800);let l=(0,t.I)("div")({name:"OuterWrapper",class:"o1yzqw59",propsAsIs:!1}),a=(0,t.I)("div")({name:"Row",class:"r1xf3ip9",propsAsIs:!1}),d=(0,t.I)("div")({name:"CodeWrapper",class:"c8bsm36",propsAsIs:!1}),h=(0,t.I)("div")({name:"SvgWrapper",class:"s1lircjl",propsAsIs:!1}),p=(0,t.I)("svg")({name:"Svg",class:"sw5v5yo",propsAsIs:!1}),v=function(n){let{variant:r="default",codeOutput:e}=n;return(0,s.jsx)(l,{children:(0,s.jsx)(c.Ay,{outputWrapper:null,initialValues:{width:100},customGrid:{gridTemplateColumns:"min(400px, 100%)",justifyContent:"center"},controlPosition:"top",controls:[(0,s.jsx)(c.oP,{id:"width",label:"Width",min:50,max:100,previewRenderer:n=>"".concat(n,"%")},"width")],children:n=>{let{width:t}=n,c=Math.round(t/100*300),l="fixed"===r?t/100:1;return(0,s.jsxs)(a,{children:[(0,s.jsx)(d,{children:(0,s.jsx)(o.A,{lang:"html",code:function(n,r){if("default"===r)return'\n<svg width="'.concat(n,'" height="220">\n  <circle\n    cx="150"\n    cy="110"\n    r="60"\n    stroke="var(--gold)"\n    stroke-width="10"\n  />\n</svg>');if("viewbox"===r)return'\n<svg\n  width="'.concat(n,'"\n  viewBox="0 0 300 220"\n>\n  <circle\n    cx="150"\n    cy="110"\n    r="60"\n    stroke="var(--gold)"\n    stroke-width="10"\n  />\n</svg>');let e=n/300,s=(0,i.GB)(220*e,1),t=(0,i.GB)(150*e,1),c=(0,i.GB)(110*e,1),o=(0,i.GB)(60*e,1),l=(0,i.GB)(10*e,1);return'\n<svg width="'.concat(n,'" height="').concat(s,'">\n  <circle\n    cx="').concat(t,'"\n    cy="').concat(c,'"\n    r="').concat(o,'"\n    stroke="var(--gold)"\n    stroke-width="').concat(l,'"\n  />\n</svg>')}(c,r),children:e})}),(0,s.jsx)(h,{"data-variant":r,children:(0,s.jsx)(p,{width:c,height:"viewbox"!==r?Math.round(220*l):void 0,viewBox:"viewbox"===r?"0 0 300 220":void 0,children:(0,s.jsx)("circle",{cx:(0,i.GB)(150*l,1),cy:(0,i.GB)(110*l,1),r:(0,i.GB)(60*l,1),fill:"none",strokeWidth:(0,i.GB)(10*l,1)})})})]})}})})};e(27033)},27033:n=>{n.exports={o1yzqw59:"o1yzqw59",r1xf3ip9:"r1xf3ip9",c8bsm36:"c8bsm36",s1lircjl:"s1lircjl",sw5v5yo:"sw5v5yo"}}}]);
//# sourceMappingURL=32306.7f7642cc403ccf97.js.map