vue-circle-flags
Version:
A vue component with a collection of 400+ circular SVG country flags. Wrapper of HatScripts/circle-flags
55 lines (54 loc) • 1.98 kB
JavaScript
import { defineComponent as a, computed as l, openBlock as c, createElementBlock as i, createElementVNode as e, toDisplayString as d, createCommentVNode as h, normalizeStyle as _ } from "vue";
const f = ["viewBox"], v = /* @__PURE__ */ e("mask", { id: "104eeb62-b65e-426a-9239-cd2b82c89e6b" }, [
/* @__PURE__ */ e("circle", {
cx: "256",
cy: "256",
r: "256",
fill: "#fff"
})
], -1), m = { mask: "url(#104eeb62-b65e-426a-9239-cd2b82c89e6b)" }, u = { key: 0 }, g = /* @__PURE__ */ e("path", {
fill: "#eee",
d: "M0 0h222.6l31 23.4L289.4 0H512v222.6l-21.5 31 21.5 35.8V512H289.4l-34.2-20.5-32.6 20.5H0V289.4l22.7-32.6L0 222.6z"
}, null, -1), k = /* @__PURE__ */ e("path", {
fill: "#d80027",
d: "M222.6 0v222.6H0v66.8h222.6V512h66.8V289.4H512v-66.8H289.4V0z"
}, null, -1), p = /* @__PURE__ */ e("path", {
fill: "#ffda44",
d: "m328.3 267 16.7 11.3v-44.7L328.3 245h-61.2v-61.2l11.2-16.8h-44.6l11.2 16.8v61.1h-61.2L167 233.6v44.7l16.7-11.3h61.2v61.3l-11.2 16.6h44.6L267 328.3V267z"
}, null, -1), b = { fill: "none" }, x = ["r"], H = /* @__PURE__ */ a({
__name: "gg",
props: {
flagName: {},
strokeColor: { default: "#000" },
strokeWidth: { default: 0 }
},
setup(r) {
const t = r, o = l(() => 512 + 2 * t.strokeWidth), s = l(() => -t.strokeWidth), n = l(() => 256 + t.strokeWidth / 2);
return (V, w) => (c(), i("svg", {
xmlns: "http://www.w3.org/2000/svg",
class: "svg-circle-flags",
viewBox: `${s.value} ${s.value} ${o.value} ${o.value}`
}, [
v,
e("g", m, [
t.flagName ? (c(), i("title", u, d(t.flagName), 1)) : h("", !0),
g,
k,
p
]),
e("g", b, [
e("circle", {
cx: "256",
cy: "256",
r: n.value,
fill: "none",
style: _({ stroke: t.strokeColor, strokeWidth: t.strokeWidth })
}, null, 12, x)
])
], 8, f));
}
});
export {
H as default
};
//# sourceMappingURL=gg-cec62047.js.map