UNPKG

vue-circle-flags

Version:

A vue component with a collection of 400+ circular SVG country flags. Wrapper of HatScripts/circle-flags

2 lines 1.69 kB
let e=require("vue");var t=[`viewBox`],n=(0,e.createElementVNode)(`mask`,{id:`516e94b6-e0b3-423f-bd38-192869e48435`},[(0,e.createElementVNode)(`circle`,{cx:`256`,cy:`256`,r:`256`,fill:`#fff`})],-1),r={mask:`url(#516e94b6-e0b3-423f-bd38-192869e48435)`},i={key:0},a=(0,e.createElementVNode)(`path`,{fill:`#d80027`,d:`M0 0h512v512H0z`},null,-1),o=(0,e.createElementVNode)(`path`,{fill:`#333`,d:`M400.7 190H308a33.3 33.3 0 0 0-24.2-56.4 33.3 33.3 0 0 0-27.8 14.9 33.4 33.4 0 1 0-52 41.5h-92.7a45.8 45.8 0 0 0 46 44.5h-1.5c0 24.6 20 44.6 44.5 44.6 0 8 2.1 15.4 5.8 21.8l-37 37 28.4 28.3 40.2-40.2a30.5 30.5 0 0 0 4.9 1.4l-24.3 54.8L256 423l37.7-40.8-24.3-54.8a30.4 30.4 0 0 0 4.9-1.4l40.2 40.2 28.3-28.3-37-37a44.2 44.2 0 0 0 5.9-21.8c24.5 0 44.5-20 44.5-44.6h-1.5c24.6 0 46-19.9 46-44.5z`},null,-1),s={fill:`none`},c=[`r`],l=(0,e.defineComponent)({__name:`al`,props:{flagName:{},strokeColor:{default:`#000`},strokeWidth:{default:0}},setup(l){let u=l,d=(0,e.computed)(()=>512+2*u.strokeWidth),f=(0,e.computed)(()=>-u.strokeWidth),p=(0,e.computed)(()=>256+u.strokeWidth/2);return(l,m)=>((0,e.openBlock)(),(0,e.createElementBlock)(`svg`,{xmlns:`http://www.w3.org/2000/svg`,class:`svg-circle-flags`,viewBox:`${f.value} ${f.value} ${d.value} ${d.value}`},[n,(0,e.createElementVNode)(`g`,r,[u.flagName?((0,e.openBlock)(),(0,e.createElementBlock)(`title`,i,(0,e.toDisplayString)(u.flagName),1)):(0,e.createCommentVNode)(``,!0),a,o]),(0,e.createElementVNode)(`g`,s,[(0,e.createElementVNode)(`circle`,{cx:`256`,cy:`256`,r:p.value,fill:`none`,style:(0,e.normalizeStyle)({stroke:u.strokeColor,strokeWidth:u.strokeWidth})},null,12,c)])],8,t))}});exports.default=l; //# sourceMappingURL=al-CnO6Kdum.cjs.map