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 kB
JavaScript
import { defineComponent as d, computed as l, openBlock as s, createElementBlock as i, createElementVNode as t, toDisplayString as h, createCommentVNode as n, normalizeStyle as f, createStaticVNode as p } from "vue";
const _ = ["viewBox"], m = /* @__PURE__ */ t("mask", { id: "0eeacbd3-fc09-47f7-823a-d88024ff8945" }, [
/* @__PURE__ */ t("circle", {
cx: "256",
cy: "256",
r: "256",
fill: "#fff"
})
], -1), v = { mask: "url(#0eeacbd3-fc09-47f7-823a-d88024ff8945)" }, k = { key: 0 }, u = /* @__PURE__ */ p('<path fill="#0052b4" d="m0 128 256-32 256 32v256l-256 32L0 384Z"></path><path fill="#333" d="m0 96 256-32 256 32v32H0Z"></path><path fill="#6da544" d="M0 0h512v96H0Z"></path><path fill="#333" d="m0 416 256 32 256-32v-32H0Z"></path><path fill="#6da544" d="M0 512h512v-96H0Z"></path><path fill="#eee" d="M245 144c-106 32-101 112-67 186l-40 38 73-27v-98c24-35 66-35 90 0v98l73 27-40-38c34-74 39-154-67-186l-11 46-11-46zm11 83-9 27h-28l23 17-9 28 23-17 23 17-9-28 24-17h-29l-9-27z"></path>', 6), g = { fill: "none" }, x = ["r"], W = /* @__PURE__ */ d({
__name: "torres_strait_islands",
props: {
flagName: {},
strokeColor: { default: "#000" },
strokeWidth: { default: 0 }
},
setup(c) {
const e = c, o = l(() => 512 + 2 * e.strokeWidth), a = l(() => -e.strokeWidth), r = l(() => 256 + e.strokeWidth / 2);
return (w, y) => (s(), i("svg", {
xmlns: "http://www.w3.org/2000/svg",
class: "svg-circle-flags",
viewBox: `${a.value} ${a.value} ${o.value} ${o.value}`
}, [
m,
t("g", v, [
e.flagName ? (s(), i("title", k, h(e.flagName), 1)) : n("", !0),
u
]),
t("g", g, [
t("circle", {
cx: "256",
cy: "256",
r: r.value,
fill: "none",
style: f({ stroke: e.strokeColor, strokeWidth: e.strokeWidth })
}, null, 12, x)
])
], 8, _));
}
});
export {
W as default
};
//# sourceMappingURL=torres_strait_islands-1dea883a.js.map