vite-awesome-svg-loader
Version:
Imports SVGs as source code, base64 and data URI. Preserves stroke width, replaces colors with currentColor. Optimizes SVGs with SVGO. Creates SVG sprites.
395 lines (393 loc) • 14.5 kB
JavaScript
(function(){"use strict";try{if(typeof document<"u"){var e=document.createElement("style");e.appendChild(document.createTextNode(".awesome-svg-loader-icon{display:inline-block;color:var(--icon-color)}.awesome-svg-loader-icon svg{vertical-align:top}.awesome-svg-loader-icon use{transition:color var(--icon-transition)}")),document.head.appendChild(e)}}catch(o){console.error("vite-plugin-css-injected-by-js",o)}})();
function I(e, t) {
return t != null && typeof Symbol < "u" && t[Symbol.hasInstance] ? !!t[Symbol.hasInstance](e) : e instanceof t;
}
function v(e) {
"@swc/helpers - typeof";
return e && typeof Symbol < "u" && e.constructor === Symbol ? "symbol" : typeof e;
}
var R = Object.create, b = Object.defineProperty, N = Object.getOwnPropertyDescriptor, W = Object.getOwnPropertyNames, P = Object.getPrototypeOf, z = Object.prototype.hasOwnProperty, C = function(e, t) {
return function() {
return t || e((t = { exports: {} }).exports, t), t.exports;
};
}, j = function(e, t, i, a) {
var r = !0, n = !1, s = void 0;
if (t && (typeof t > "u" ? "undefined" : v(t)) == "object" || typeof t == "function") try {
for (var o = function() {
var f = u.value;
!z.call(e, f) && f !== i && b(e, f, { get: function() {
return t[f];
}, enumerable: !(a = N(t, f)) || a.enumerable });
}, h = W(t)[Symbol.iterator](), u; !(r = (u = h.next()).done); r = !0) o();
} catch (f) {
n = !0, s = f;
} finally {
try {
!r && h.return != null && h.return();
} finally {
if (n)
throw s;
}
}
return e;
}, x = function(e, t, i) {
return i = e != null ? R(P(e)) : {}, j(!e || !e.__esModule ? b(i, "default", { value: e, enumerable: !0 }) : i, e);
}, D = C(function(e, t) {
var i = function(a, r, n) {
var s, o, h, u, f;
r == null && (r = 100);
function y() {
var c = Date.now() - u;
c < r && c >= 0 ? s = setTimeout(y, r - c) : (s = null, n || (f = a.apply(h, o), h = o = null));
}
var _ = function() {
h = this, o = arguments, u = Date.now();
var B = n && !s;
return s || (s = setTimeout(y, r)), B && (f = a.apply(h, o), h = o = null), f;
};
return _.clear = function() {
s && (clearTimeout(s), s = null);
}, _.flush = function() {
s && (f = a.apply(h, o), h = o = null, clearTimeout(s), s = null);
}, _;
};
i.debounce = i, t.exports = i;
}), k = C(function(e, t) {
(function() {
var i;
function a(r, n) {
var s = I(this, a) ? this : i;
if (s.reset(n), typeof r == "string" && r.length > 0 && s.hash(r), s !== this) return s;
}
a.prototype.hash = function(r) {
var n, s, o, h, u;
switch (u = r.length, this.len += u, s = this.k1, o = 0, this.rem) {
case 0:
s ^= u > o ? r.charCodeAt(o++) & 65535 : 0;
case 1:
s ^= u > o ? (r.charCodeAt(o++) & 65535) << 8 : 0;
case 2:
s ^= u > o ? (r.charCodeAt(o++) & 65535) << 16 : 0;
case 3:
s ^= u > o ? (r.charCodeAt(o) & 255) << 24 : 0, s ^= u > o ? (r.charCodeAt(o++) & 65280) >> 8 : 0;
}
if (this.rem = u + this.rem & 3, u -= this.rem, u > 0) {
for (n = this.h1; s = s * 11601 + (s & 65535) * 3432906752 & 4294967295, s = s << 15 | s >>> 17, s = s * 13715 + (s & 65535) * 461832192 & 4294967295, n ^= s, n = n << 13 | n >>> 19, n = n * 5 + 3864292196 & 4294967295, !(o >= u); ) s = r.charCodeAt(o++) & 65535 ^ (r.charCodeAt(o++) & 65535) << 8 ^ (r.charCodeAt(o++) & 65535) << 16, h = r.charCodeAt(o++), s ^= (h & 255) << 24 ^ (h & 65280) >> 8;
switch (s = 0, this.rem) {
case 3:
s ^= (r.charCodeAt(o + 2) & 65535) << 16;
case 2:
s ^= (r.charCodeAt(o + 1) & 65535) << 8;
case 1:
s ^= r.charCodeAt(o) & 65535;
}
this.h1 = n;
}
return this.k1 = s, this;
}, a.prototype.result = function() {
var r, n;
return r = this.k1, n = this.h1, r > 0 && (r = r * 11601 + (r & 65535) * 3432906752 & 4294967295, r = r << 15 | r >>> 17, r = r * 13715 + (r & 65535) * 461832192 & 4294967295, n ^= r), n ^= this.len, n ^= n >>> 16, n = n * 51819 + (n & 65535) * 2246770688 & 4294967295, n ^= n >>> 13, n = n * 44597 + (n & 65535) * 3266445312 & 4294967295, n ^= n >>> 16, n >>> 0;
}, a.prototype.reset = function(r) {
return this.h1 = typeof r == "number" ? r : 0, this.rem = this.k1 = this.len = 0, this;
}, i = new a(), (typeof t > "u" ? "undefined" : v(t)) < "u" ? t.exports = a : this.MurmurHash3 = a;
})();
}), M = x(D()), S = x(k()), A = "svg-symbols", E = "svg-", p = "data-count";
function G(e, t) {
if ((typeof window > "u" ? "undefined" : v(window)) > "u" || e === t) return {};
var i = document.getElementById(A);
if (i || (i = document.createElementNS("http://www.w3.org/2000/svg", "svg"), i.id = A, i.setAttribute("aria-hidden", "true"), i.setAttribute("style", "position:fixed;top:-99999px;left:-99999px;z-index:0;opacity:0;"), document.body.appendChild(i)), e) {
var a = E + new S.default(e).result();
O(document.getElementById(a));
}
var r = E + new S.default(t).result(), n = document.getElementById(r);
if (n) return n.setAttribute(p, m(n) + 1 + ""), { id: r, attrs: w(n) };
var s = new DOMParser().parseFromString(t, "application/xml").firstElementChild;
if (s != null && s.querySelector("parsererror")) return console.error("Provided source code is not a valid SVG: " + t), { id: r };
if (!s) return console.error("Missing child in SVG: " + t), { id: r };
for (var o = document.createElementNS("http://www.w3.org/2000/svg", "symbol"), h = 0; h < s.attributes.length; h++) {
var u = s.attributes[h];
o.setAttribute(u.name, u.value);
}
for (o.id = r, o.setAttribute(p, "1"); s.children.length; ) o.appendChild(s.children[0]);
return i.appendChild(o), { id: r, attrs: w(o) };
}
function U(e) {
!e || (typeof window > "u" ? "undefined" : v(window)) > "u" || O(typeof e == "string" ? document.getElementById(e) : e);
}
function O(e) {
if (e) {
var t = m(e, 1) - 1;
e.setAttribute(p, t + ""), t <= 0 && (d.push(e), H());
}
}
var d = [], H = (0, M.default)(function() {
for (var e = d.length - 1; e >= 0; e--) {
var t = d[e];
t.parentElement && m(t) <= 0 && t.parentElement.removeChild(t), d.pop();
}
}, 5e3);
function m(e) {
var t = arguments.length > 1 && arguments[1] !== void 0 ? arguments[1] : 0;
if (!e) return t;
var i = parseInt(e.getAttribute(p) || "1");
return isNaN(i) ? t : i;
}
function w(e) {
var t = e.getAttribute("viewBox") || "";
if (!t) for (var i = 0, a = ["x", "y", "width", "height"]; i < a.length; i++) {
var r = a[i], n = e.getAttribute(r);
t += (n || "0") + " ";
}
return { viewBox: t, width: "100%", height: "100%" };
}
/*! Bundled license information:
imurmurhash/imurmurhash.js:
(**
* @preserve
* JS Implementation of incremental MurmurHash3 (r150) (as of May 10, 2013)
*
* @author <a href="mailto:jensyt@gmail.com">Jens Taylor</a>
* @see http://github.com/homebrewing/brauhaus-diff
* @author <a href="mailto:gary.court@gmail.com">Gary Court</a>
* @see http://github.com/garycourt/murmurhash-js
* @author <a href="mailto:aappleby@gmail.com">Austin Appleby</a>
* @see http://sites.google.com/site/murmurhash/
*)
*/
function T(e, t) {
const i = typeof t == "string" ? document.querySelector(t) : t;
if (!i) {
console.error(`No elements found for selector "${t}"`);
return;
}
return i.appendChild(e), i;
}
const L = {
id: !0,
class: !0,
style: !0
};
function l(e, t, i = !1) {
if (i) {
const a = [];
for (const r of e.attributes)
L[r.name] || a.push(r.name);
for (const r of a)
e.removeAttribute(r);
}
for (const a in t)
e.setAttribute(a, t[a]);
}
function g(e, t, i) {
i ? e.style[t] !== void 0 ? e.style[t] = i : e.style.setProperty(t, i) : e.style[t] !== void 0 ? e.style[t] = "" : e.style.removeProperty(t);
}
class q {
constructor(t, i) {
this._svgAttrs = {}, this._useElAttrs = {}, this._updateSrcRes = {}, this._svgEl = document.createElementNS("http://www.w3.org/2000/svg", "svg"), this._useEl = document.createElementNS("http://www.w3.org/2000/svg", "use"), this._svgEl.appendChild(this._useEl), this.setSrc(t), i && this.mount(i);
}
/**
* Mounts image to the given element
* @param to Element or selector of an element to mount image to
* @returns this
*/
mount(t) {
return this._container = T(this._svgEl, t), this;
}
/**
* Removes image from the container
* @returns this
*/
unmount() {
var t;
return (t = this._svgEl.parentElement) == null || t.removeChild(this._svgEl), this._container = void 0, U(this._updateSrcRes.id), this;
}
/**
* Sets `<svg>` element attributes. It won't remove id, class and style.
* @param attrs Attributes to set
* @returns this
*/
setSvgElAttrs(t) {
return this._svgAttrs = t, this._updateSvgEl();
}
/**
* Updates SVG element: sets SVG source code, clears previous attributes, sets new attributes
* @returns this
*/
_updateSvgEl() {
return l(this._svgEl, { alt: "" }, !0), this._updateSvgBeforeUserAttrsSet(), l(this._svgEl, this._svgAttrs), this._updateSvgAfterUserAttrsSet(), this._updateSrcRes.attrs && l(this._svgEl, this._updateSrcRes.attrs), this;
}
/**
* Called before user-provided attributes are set. You can use this function to set custom SVG element attributes.
*/
_updateSvgBeforeUserAttrsSet() {
}
/**
* Called after user-provided attributes are set. You can use this function to set custom SVG element attributes.
*/
_updateSvgAfterUserAttrsSet() {
}
/**
* Sets `<use>` element attributes. It won't remove id, class and style.
* @param attrs Attributes to set
* @returns this
*/
setUseElAttrs(t) {
return this._useElAttrs = t, this._updateUseEl();
}
/**
* Updates `<use>` element attributes
* @returns this
*/
_updateUseEl() {
return l(this._useEl, {}, !0), this._updateUseElBeforeUserAttrsSet(), l(this._useEl, this._useElAttrs), this._updateUseElAfterUserAttrsSet(), this._updateSrcRes.id && l(this._useEl, { href: "#" + this._updateSrcRes.id }), this;
}
/**
* Called before user-provided attributes are set. You can use this function to set custom `<use>` element attributes.
*/
_updateUseElBeforeUserAttrsSet() {
}
/**
* Called after user-provided attributes are set. You can use this function to set custom `<use>` element attributes.
*/
_updateUseElAfterUserAttrsSet() {
}
/**
* Sets SVG source code
* @param src SVG source code
* @returns this
*/
setSrc(t) {
return this._updateSrcRes = G(this._src, t), this._src = t, this._updateSvgEl(), this._updateUseEl(), this;
}
/**
* @returns SVG source code
*/
getSrc() {
return this._src;
}
/**
* @returns A container of this image, or `undefined`, if image is not mounted
*/
getContainer() {
return this._container;
}
/**
* Returns `<svg>` element.
*
* To assign attributes, use {@link setSvgElAttrs} instead.
*
* @returns `<svg>` element
*/
getSvgEl() {
return this._svgEl;
}
/**
* Returns `<use>` element.
*
* To assign attributes, use {@link setSvgElAttrs} instead.
*
* @returns `<use>` element
*/
getUseEl() {
return this._useEl;
}
}
const F = "0.3s linear";
class V extends q {
constructor(t, i) {
super(t), this._span = document.createElement("span"), this._setWrapperClass(), this._span.appendChild(this._svgEl), this.setColorTransition(), i && this.mount(i);
}
mount(t) {
return this._container = T(this._span, t), this;
}
unmount() {
var t;
return (t = this._span.parentElement) == null || t.removeChild(this._span), this._container = void 0, U(this._updateSrcRes.id), this;
}
_updateSvgBeforeUserAttrsSet() {
l(this._svgEl, { "aria-hidden": "true" });
}
/**
* Sets wrapper (`<span>`) element attributes.
*
* **Warning**: you can't change class, size, color and color transition using this method
*
* @param attrs Attributes to set
* @returns this
*/
setWrapperAttrs(t) {
return l(this._span, {}, !0), this._updateWrapperBeforeUserAttrsSet(), l(this._span, t), this._updateWrapperAfterUserAttrsSet(), this.setSize(this._size), this.setColor(this._color), this.setColorTransition(this._colorTransition), this._setWrapperClass(), this;
}
/**
* Called before user-provided attributes are set. You can use this function to set custom wrapper (`<span>`) attributes.
*/
_updateWrapperBeforeUserAttrsSet() {
}
/**
* Called after user-provided attributes are set. You can use this function to set custom wrapper (`<span>`) attributes.
*/
_updateWrapperAfterUserAttrsSet() {
}
_setWrapperClass() {
this._span.classList.add("awesome-svg-loader-icon", "icon");
}
/**
* @returns Wrapper (`<span>`) element
*/
getWrapper() {
return this._span;
}
/**
* Sets icon size. Empty string or `undefined` unsets size.
* @param size Size to set, for example: `"24px"`, `"1rem"`
* @returns this
*/
setSize(t) {
this._size = t;
for (const i of ["width", "minWidth", "maxWidth", "height", "minHeight", "maxHeight"])
g(this._span, i, this._size);
return this;
}
/**
* @returns Current icon size or empty string, if size is unset
*/
getSize() {
return this._size || "";
}
/**
* Sets icon color. Empty string or `undefined` unsets color.
* @param color Color to set, for example: `"red"`, `"var(--icon-color)"`.
* @returns this
*/
setColor(t) {
return this._color = t, g(this._span, "--icon-color", t), this;
}
/**
* @returns Current icon color or empty string, if color is unset
*/
getColor() {
return this._color || "";
}
/**
* Sets icon color transition. This transition is applied when icon color is changed.
* @param transition Transition to set, for example: `"0.3s linear"`, `"var(--icon-transition)"`
* @returns this
*/
setColorTransition(t = F) {
return this._colorTransition = t, g(this._span, "--icon-transition", t), this;
}
/**
* @returns Current icon color transition or empty string, if transition is unset
*/
getColorTransition() {
return this._colorTransition || "";
}
}
export {
V as SvgIcon,
q as SvgImage,
T as mount,
l as setAttrs,
g as setStyleProperty
};
//# sourceMappingURL=index.js.map