@fish-render/icons
Version:
Fish Render icon library for Vue 3
161 lines (159 loc) • 18.5 kB
JavaScript
// Inlined CSS
(function() {
if (typeof document !== 'undefined') {
const style = document.createElement('style');
style.textContent = ".svg-icon[data-v-fb72574a]{width:1em;height:1em;font-size:1.2em;fill:currentColor;vertical-align:middle}.icon-loading[data-v-4c997a10],.icon-error[data-v-4c997a10]{display:inline-flex;align-items:center;justify-content:center;font-size:12px;color:#999;background:#f5f5f5;border:1px dashed #ddd;border-radius:4px}.icon-error[data-v-4c997a10]{color:#ff4d4f;background:#fff2f0;border-color:#ffccc7}\n";
document.head.appendChild(style);
}
})();
import { defineComponent as d, h as x, computed as m, openBlock as l, createElementBlock as v, mergeProps as L, createElementVNode as g, ref as h, watch as S, onMounted as V } from "vue";
function _(t, o) {
return d({
name: o,
setup() {
return () => x("span", {
innerHTML: t,
class: "icon-component"
});
}
});
}
function s(t, o) {
return _(t, o);
}
const T = '<svg class="icon" width="1em" height="1em" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path fill="currentColor" d="M908.245333 213.952h65.706667a8.533333 8.533333 0 0 1 6.037333 14.570667L445.226667 763.306667a31.786667 31.786667 0 0 1-42.517334 2.176l-2.773333-2.56-343.04-343.04a8.533333 8.533333 0 0 1 6.037333-14.570667H130.133333a8.533333 8.533333 0 0 1 6.037334 2.496l287.338666 287.36 478.698667-478.72a8.533333 8.533333 0 0 1 6.037333-2.496z" /></svg>', Q = s(T, "Selected"), G = '<svg class="icon" width="1em" height="1em" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path fill="currentColor" d="M524.8 64c4.693333 0 8.533333 3.84 8.533333 8.533333V490.666667h418.133334c4.693333 0 8.533333 3.84 8.533333 8.533333v46.933333a8.533333 8.533333 0 0 1-8.533333 8.533334H533.333333v418.133333a8.533333 8.533333 0 0 1-8.533333 8.533333h-46.933333a8.533333 8.533333 0 0 1-8.533334-8.533333V554.666667H51.2a8.533333 8.533333 0 0 1-8.533333-8.533334v-46.933333c0-4.693333 3.84-8.533333 8.533333-8.533333H469.333333V72.533333c0-4.693333 3.84-8.533333 8.533334-8.533333h46.933333z" /></svg>', X = s(G, "add"), B = '<svg class="icon" width="1em" height="1em" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path fill="currentColor" d="M213.717333 173.162667l287.274667 287.232L788.202667 173.162667A8.533333 8.533333 0 0 1 794.24 170.666667h66.901333a8.533333 8.533333 0 0 1 6.037334 14.570666L546.496 505.898667l332.842667 332.864a8.533333 8.533333 0 0 1-6.037334 14.570666h-66.389333a8.533333 8.533333 0 0 1-6.037333-2.496L501.248 551.146667 201.514667 850.837333a8.533333 8.533333 0 0 1-6.016 2.496H128.64a8.533333 8.533333 0 0 1-6.037333-14.570666l333.12-333.12-320.426667-320.426667A8.533333 8.533333 0 0 1 141.333333 170.666667h66.346667a8.533333 8.533333 0 0 1 6.037333 2.496z" /></svg>', o3 = s(B, "delete"), P = '<svg class="icon" width="1em" height="1em" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path fill="currentColor" d="M662.058667 64a8.533333 8.533333 0 0 1 6.037333 14.570667l-46.933333 46.933333a8.533333 8.533333 0 0 1-6.058667 2.496H234.666667a106.666667 106.666667 0 0 0-106.56 102.037333L128 234.666667v554.666666a106.666667 106.666667 0 0 0 102.037333 106.56L234.666667 896h554.666666a106.666667 106.666667 0 0 0 106.56-102.037333L896 789.333333V408.874667a8.533333 8.533333 0 0 1 2.496-6.037334l46.933333-46.933333a8.533333 8.533333 0 0 1 14.570667 6.037333V789.333333a170.666667 170.666667 0 0 1-170.666667 170.666667H234.666667a170.666667 170.666667 0 0 1-170.666667-170.666667V234.666667a170.666667 170.666667 0 0 1 170.666667-170.666667h427.392zM926.933333 94.442667a105.685333 105.685333 0 0 1 3.2 146.133333l-3.882666 4.010667-310.4 304.661333a85.333333 85.333333 0 0 1-59.754667 24.448h-71.786667a42.666667 42.666667 0 0 1-42.666666-42.666667v-71.04a85.333333 85.333333 0 0 1 25.322666-60.672l308.693334-305.28a107.264 107.264 0 0 1 151.274666 0.426667z m-172.992 111.082666L511.957333 444.8a21.333333 21.333333 0 0 0-6.144 12.330667l-0.170666 2.837333v49.706667h50.453333a21.333333 21.333333 0 0 0 12.821333-4.309334l2.112-1.813333 242.709334-238.250667-59.797334-59.797333z m69.12-68.16l-2.389333 2.176-21.226667 20.992 59.968 59.946667 22.272-21.824c16.277333-16.277333 16.277333-42.666667 0-58.944a43.264 43.264 0 0 0-58.645333-2.346667z" /></svg>', t3 = s(P, "fillin"), I = '<svg class="icon" width="1em" height="1em" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path fill="currentColor" d="M546.133333 64c4.693333 0 8.533333 3.84 8.533334 8.533333v46.933334a8.533333 8.533333 0 0 1-8.533334 8.533333H234.666667a106.666667 106.666667 0 0 0-106.56 102.037333L128 234.666667v554.666666a106.666667 106.666667 0 0 0 102.037333 106.56L234.666667 896h554.666666a106.666667 106.666667 0 0 0 106.56-102.037333L896 789.333333V477.866667c0-4.693333 3.84-8.533333 8.533333-8.533334h46.933334c4.693333 0 8.533333 3.84 8.533333 8.533334V789.333333a170.666667 170.666667 0 0 1-170.666667 170.666667H234.666667a170.666667 170.666667 0 0 1-170.666667-170.666667V234.666667a170.666667 170.666667 0 0 1 170.666667-170.666667h311.466666z m234.666667 0c4.693333 0 8.533333 3.84 8.533333 8.533333V234.666667h162.133334c4.693333 0 8.533333 3.84 8.533333 8.533333v46.933333a8.533333 8.533333 0 0 1-8.533333 8.533334H789.333333v162.133333a8.533333 8.533333 0 0 1-6.826666 8.362667L780.8 469.333333h-46.933333a8.533333 8.533333 0 0 1-8.533334-8.533333V298.666667h-162.133333a8.533333 8.533333 0 0 1-8.533333-8.533334v-46.933333c0-4.693333 3.84-8.533333 8.533333-8.533333H725.333333V72.533333a8.533333 8.533333 0 0 1 6.826667-8.362666L733.866667 64z" /></svg>', n3 = s(I, "information_add"), E = '<svg class="icon" width="1em" height="1em" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path fill="currentColor" d="M670.954667 86.826667L269.44 488.362667a32 32 0 0 0-2.090667 42.965333l2.090667 2.282667L670.933333 935.168a8.533333 8.533333 0 0 0 6.037334 2.496h66.368a8.533333 8.533333 0 0 0 6.037333-14.570667L337.28 511.018667 749.397333 98.901333a8.533333 8.533333 0 0 0-6.037333-14.570666h-66.346667a8.533333 8.533333 0 0 0-6.058666 2.496z" /></svg>', e3 = s(E, "left"), z = '<svg class="icon" width="1em" height="1em" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path fill="currentColor" d="M522.666667 522.666667m-53.333334 0a53.333333 53.333333 0 1 0 106.666667 0 53.333333 53.333333 0 1 0-106.666667 0Z" /><path fill="currentColor" d="M266.666667 522.666667m-53.333334 0a53.333333 53.333333 0 1 0 106.666667 0 53.333333 53.333333 0 1 0-106.666667 0Z" /><path fill="currentColor" d="M778.666667 522.666667m-53.333334 0a53.333333 53.333333 0 1 0 106.666667 0 53.333333 53.333333 0 1 0-106.666667 0Z" /></svg>', s3 = s(z, "more"), M = '<svg class="icon" width="1em" height="1em" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path fill="currentColor" d="M341.333333 533.333333a128 128 0 0 1 128 128v149.333334a128 128 0 0 1-128 128H192a128 128 0 0 1-128-128v-149.333334a128 128 0 0 1 128-128h149.333333z m469.333334 0a128 128 0 0 1 128 128v149.333334a128 128 0 0 1-128 128h-149.333334a128 128 0 0 1-128-128v-149.333334a128 128 0 0 1 128-128h149.333334z m-469.333334 64H192a64 64 0 0 0-63.893333 60.245334L128 661.333333v149.333334a64 64 0 0 0 60.245333 63.893333L192 874.666667h149.333333a64 64 0 0 0 63.893334-60.245334L405.333333 810.666667v-149.333334a64 64 0 0 0-60.245333-63.893333L341.333333 597.333333z m469.333334 0h-149.333334a64 64 0 0 0-63.893333 60.245334L597.333333 661.333333v149.333334a64 64 0 0 0 60.245334 63.893333L661.333333 874.666667h149.333334a64 64 0 0 0 63.893333-60.245334L874.666667 810.666667v-149.333334a64 64 0 0 0-60.245334-63.893333L810.666667 597.333333zM341.333333 64a128 128 0 0 1 128 128v149.333333a128 128 0 0 1-128 128H192a128 128 0 0 1-128-128V192a128 128 0 0 1 128-128h149.333333z m469.333334 0a128 128 0 0 1 128 128v149.333333a128 128 0 0 1-128 128h-149.333334a128 128 0 0 1-128-128V192a128 128 0 0 1 128-128h149.333334zM341.333333 128H192a64 64 0 0 0-63.893333 60.245333L128 192v149.333333a64 64 0 0 0 60.245333 63.893334L192 405.333333h149.333333a64 64 0 0 0 63.893334-60.245333L405.333333 341.333333V192a64 64 0 0 0-60.245333-63.893333L341.333333 128z m469.333334 0h-149.333334a64 64 0 0 0-63.893333 60.245333L597.333333 192v149.333333a64 64 0 0 0 60.245334 63.893334L661.333333 405.333333h149.333334a64 64 0 0 0 63.893333-60.245333L874.666667 341.333333V192a64 64 0 0 0-60.245334-63.893333L810.666667 128z" /></svg>', a3 = s(M, "more_1"), H = '<svg class="icon" width="1em" height="1em" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path fill="currentColor" d="M866.133333 85.333333c4.693333 0 8.533333 3.84 8.533334 8.533334v194.133333a32 32 0 0 1-28.928 31.850667L842.666667 320h-194.133334a8.533333 8.533333 0 0 1-8.533333-8.533333v-46.933334c0-4.693333 3.84-8.533333 8.533333-8.533333h120.341334A361.536 361.536 0 0 0 512 149.333333C311.701333 149.333333 149.333333 311.701333 149.333333 512s162.368 362.666667 362.666667 362.666667c185.813333 0 339.008-139.776 360.170667-319.914667 0.384-3.328 0.810667-7.829333 1.28-13.546667a8.533333 8.533333 0 0 1 8.512-7.850666h47.061333a8.533333 8.533333 0 0 1 8.533333 9.109333c-0.426667 5.696-0.789333 10.218667-1.130666 13.589333C914.346667 770.986667 732.778667 938.666667 512 938.666667 276.352 938.666667 85.333333 747.648 85.333333 512S276.352 85.333333 512 85.333333c116.288 0 221.717333 46.506667 298.666667 121.984V93.866667c0-4.693333 3.84-8.533333 8.533333-8.533334h46.933333z" /></svg>', r3 = s(H, "refresh"), O = '<svg class="icon" width="1em" height="1em" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path fill="currentColor" d="M353.045333 86.826667L754.56 488.362667a32 32 0 0 1 2.090667 42.965333l-2.090667 2.282667L353.066667 935.168a8.533333 8.533333 0 0 1-6.037334 2.496h-66.368a8.533333 8.533333 0 0 1-6.037333-14.570667L686.72 511.018667 274.602667 98.901333a8.533333 8.533333 0 0 1 6.037333-14.570666h66.346667a8.533333 8.533333 0 0 1 6.058666 2.496z" /></svg>', c3 = s(O, "right"), y = '<svg class="icon" width="1em" height="1em" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path fill="currentColor" d="M743.232 210.837333c144.896 144.896 149.781333 376.789333 14.656 527.573334l160.32 160.298666a8.533333 8.533333 0 0 1 0 12.074667l-33.173333 33.173333a8.533333 8.533333 0 0 1-12.074667 0l-161.557333-161.557333c-150.762667 120.746667-371.477333 111.253333-511.232-28.501333-149.973333-149.973333-149.973333-393.109333 0-543.061334 149.973333-149.973333 393.088-149.973333 543.061333 0z m-497.813333 45.248c-124.970667 124.970667-124.970667 327.594667 0 452.565334 124.970667 124.949333 327.594667 124.949333 452.565333 0 124.949333-124.970667 124.949333-327.594667 0-452.565334-124.970667-124.970667-327.594667-124.970667-452.565333 0z" /></svg>', i3 = s(y, "search"), U = '<svg class="icon" width="1em" height="1em" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path fill="currentColor" d="M640 64a64 64 0 0 1 64 64v85.333333h226.133333c4.693333 0 8.533333 3.84 8.533334 8.533334v46.933333a8.533333 8.533333 0 0 1-8.533334 8.533333H874.666667v554.666667a128 128 0 0 1-128 128H277.333333a128 128 0 0 1-128-128V277.333333H93.866667a8.533333 8.533333 0 0 1-8.533334-8.533333v-46.933333c0-4.693333 3.84-8.533333 8.533334-8.533334H320V128a64 64 0 0 1 64-64h256z m170.666667 213.333333H213.333333v554.666667a64 64 0 0 0 60.245334 63.893333L277.333333 896h469.333334a64 64 0 0 0 63.893333-60.245333L810.666667 832V277.333333z m-392.533334 128c4.693333 0 8.533333 3.84 8.533334 8.533334v324.266666a8.533333 8.533333 0 0 1-8.533334 8.533334h-46.933333a8.533333 8.533333 0 0 1-8.533333-8.533334V413.866667c0-4.693333 3.84-8.533333 8.533333-8.533334h46.933333z m234.666667 0c4.693333 0 8.533333 3.84 8.533333 8.533334v324.266666a8.533333 8.533333 0 0 1-8.533333 8.533334h-46.933333a8.533333 8.533333 0 0 1-8.533334-8.533334V413.866667c0-4.693333 3.84-8.533333 8.533334-8.533334h46.933333zM640 128H384v85.333333h256V128z" /></svg>', l3 = s(U, "trash"), W = '<svg class="icon" width="1em" height="1em" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path fill="currentColor" d="M87.829333 352.021333L489.386667 753.578667a32 32 0 0 0 42.986666 2.069333l2.282667-2.069333 401.536-401.557334a8.533333 8.533333 0 0 0 2.496-6.037333v-66.346667a8.533333 8.533333 0 0 0-14.570667-6.037333L512.021333 685.674667 99.904 273.6a8.533333 8.533333 0 0 0-14.570667 6.037333v66.346667a8.533333 8.533333 0 0 0 2.496 6.037333z" /></svg>', v3 = s(W, "under"), Y = '<svg class="icon" width="1em" height="1em" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path fill="currentColor" d="M936.170667 669.952L534.613333 268.394667a32 32 0 0 0-42.986666-2.069334l-2.282667 2.069334L87.829333 669.952a8.533333 8.533333 0 0 0-2.496 6.037333v66.346667a8.533333 8.533333 0 0 0 14.570667 6.058667l412.074667-412.096 412.117333 412.096a8.533333 8.533333 0 0 0 14.570667-6.037334v-66.346666a8.533333 8.533333 0 0 0-2.496-6.058667z" /></svg>', h3 = s(Y, "up"), N = ["xlink:href"], $ = /* @__PURE__ */ d({
__name: "SvgIcon",
props: {
name: {},
color: {},
prefix: { default: "icon" }
},
setup(t) {
const o = t, e = m(() => `#${o.prefix}-${o.name}`), a = m(() => o.name ? `svg-icon ${o.prefix}-${o.name}` : "svg-icon");
return (n, r) => (l(), v("svg", L({ class: a.value }, n.$attrs, {
style: { color: n.color }
}), [
g("use", { "xlink:href": e.value }, null, 8, N)
], 16));
}
});
const u = (t, o) => {
const e = t.__vccOpts || t;
for (const [a, n] of o)
e[a] = n;
return e;
}, g3 = /* @__PURE__ */ u($, [["__scopeId", "data-v-fb72574a"]]);
async function b(t) {
const { buildIconPath: o, getIconConfig: e } = await Promise.resolve().then(() => J);
if (e().path) {
const n = o(t);
try {
const r = await fetch(n);
if (r.ok)
return await r.text();
throw new Error(`Icon not found: ${n}`);
} catch (r) {
throw r;
}
}
throw new Error("No icon path configured. Please set 'path' in icon config.");
}
function k(t) {
const o = t.match(/viewBox="([^"]*)"/), e = o ? o[1] : "0 0 24 24", a = t.match(/<svg[^>]*>([\s\S]*)<\/svg>/);
let n;
return a ? n = a[1] : n = t.replace(/<svg[^>]*>/, "").replace(/<\/svg>/, ""), { viewBox: e, content: n };
}
const A = ["viewBox", "innerHTML"], Z = {
key: 1,
class: "icon-loading"
}, j = {
key: 2,
class: "icon-error"
}, F = /* @__PURE__ */ d({
__name: "PathIcon",
props: {
name: {}
},
setup(t) {
const o = t, e = h(""), a = h("0 0 24 24"), n = h(!1), r = {}, p = async (c) => {
n.value = !0;
try {
if (r[c]) {
e.value = r[c], n.value = !1;
return;
}
const i = await b(c), { viewBox: C, content: D } = k(i);
a.value = C, e.value = D;
} catch (i) {
console.warn(`Failed to load icon: ${c}`, i);
} finally {
n.value = !1;
}
};
return S(
() => o.name,
(c) => {
c && p(c);
},
{ immediate: !0 }
), V(() => {
o.name && p(o.name);
}), (c, i) => e.value ? (l(), v("svg", {
key: 0,
height: "1em",
width: "1em",
viewBox: a.value,
xmlns: "http://www.w3.org/2000/svg",
innerHTML: e.value
}, null, 8, A)) : n.value ? (l(), v("div", Z, i[0] || (i[0] = [
g("span", null, "加载中...", -1)
]))) : (l(), v("div", j, i[1] || (i[1] = [
g("span", null, "图标加载失败", -1)
])));
}
});
const w3 = /* @__PURE__ */ u(F, [["__scopeId", "data-v-4c997a10"]]);
let w = {
path: "/public/icons",
prefix: ""
};
function R(t) {
w = { ...w, ...t };
}
function f() {
return w;
}
function q(t) {
const o = f(), e = o.path, a = o.prefix || "";
return `${e}/${a}${t}.svg`;
}
const J = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
__proto__: null,
buildIconPath: q,
getIconConfig: f,
setIconConfig: R
}, Symbol.toStringTag, { value: "Module" }));
export {
X as Add,
o3 as DeleteIcon,
t3 as Fillin,
n3 as InformationAdd,
e3 as Left,
s3 as More,
a3 as More1,
w3 as PathIcon,
r3 as Refresh,
c3 as Right,
i3 as Search,
Q as Selected,
g3 as SvgIcon,
l3 as Trash,
v3 as Under,
h3 as Up,
q as buildIconPath,
s as createIconComponent,
f as getIconConfig,
b as loadSvgIcon,
k as processSvgContent,
R as setIconConfig
};