UNPKG

vite-awesome-svg-loader

Version:

Imports SVGs as source code, base64 and data URI. Preserves stroke width, replaces colors with currentColor or custom colors. Optimizes SVGs with SVGO. Creates SVG sprites.

395 lines (393 loc) 14.5 kB
(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