vue-circle-flags
Version:
A vue component with a collection of 400+ circular SVG country flags. Wrapper of HatScripts/circle-flags
44 lines (43 loc) • 2.3 kB
JavaScript
import { defineComponent as d, computed as t, openBlock as r, createElementBlock as o, createElementVNode as l, toDisplayString as f, createCommentVNode as h, normalizeStyle as n, createStaticVNode as p } from "vue";
const _ = ["viewBox"], m = /* @__PURE__ */ l("mask", { id: "dabae478-38be-4722-999d-5b07d9697679" }, [
/* @__PURE__ */ l("circle", {
cx: "256",
cy: "256",
r: "256",
fill: "#fff"
})
], -1), u = { mask: "url(#dabae478-38be-4722-999d-5b07d9697679)" }, v = { key: 0 }, x = /* @__PURE__ */ p('<path fill="#338af3" d="M0 0h512v512H0z"></path><circle cx="256" cy="256" r="145" fill="#eee"></circle><circle cx="256" cy="256" r="111" fill="#338af3"></circle><path fill="#338af3" d="M76 76h360L256 256z"></path><circle cx="256" cy="256" r="89" fill="#eee"></circle><circle cx="256" cy="256" r="69" fill="#338af3"></circle><path fill="#eee" d="M246 178h20v156h-20z"></path><path fill="#eee" d="M334 246v20H178v-20z"></path><path fill="#eee" d="m304 193.7 14.2 14.2-110.3 110.3-14.2-14.1z"></path><path fill="#eee" d="m318.2 304-14.1 14.2-110.4-110.3 14.2-14.2z"></path><circle cx="256" cy="256" r="44" fill="#eee"></circle><circle cx="256" cy="256" r="22" fill="#338af3"></circle><ellipse cx="256" cy="412" fill="#eee" rx="44" ry="40"></ellipse><path fill="#338af3" d="m256 407-78 63h156z"></path>', 14), k = { fill: "none" }, y = ["r"], b = /* @__PURE__ */ d({
__name: "united_nations",
props: {
flagName: {},
strokeColor: { default: "#000" },
strokeWidth: { default: 0 }
},
setup(a) {
const e = a, c = t(() => 512 + 2 * e.strokeWidth), i = t(() => -e.strokeWidth), s = t(() => 256 + e.strokeWidth / 2);
return (g, z) => (r(), o("svg", {
xmlns: "http://www.w3.org/2000/svg",
class: "svg-circle-flags",
viewBox: `${i.value} ${i.value} ${c.value} ${c.value}`
}, [
m,
l("g", u, [
e.flagName ? (r(), o("title", v, f(e.flagName), 1)) : h("", !0),
x
]),
l("g", k, [
l("circle", {
cx: "256",
cy: "256",
r: s.value,
fill: "none",
style: n({ stroke: e.strokeColor, strokeWidth: e.strokeWidth })
}, null, 12, y)
])
], 8, _));
}
});
export {
b as default
};
//# sourceMappingURL=united_nations-de59b51f.js.map