@anoki/fse-ui/dist/index.es127.js

FSE UI components library

import { j as u } from "./index.es237.js";
import { useState as f, useEffect as R } from "react";
const o = ({
  icon: t,
  className: r = "",
  style: $ = {}
}) => {
  var v, x, y, S, m, w, I, T, E, j, z, D, L, _, G, H;
  const [s, C] = f(""), [M, a] = f(!1), [g, l] = f(!0), d = (y = (x = (v = t == null ? void 0 : t.data) == null ? void 0 : v.additionalInfo) == null ? void 0 : x.customData) == null ? void 0 : y.isDecorative, p = ((T = (I = (w = (m = (S = t == null ? void 0 : t.data) == null ? void 0 : S.additionalInfo) == null ? void 0 : m.customData) == null ? void 0 : w.translations) == null ? void 0 : I.it) == null ? void 0 : T.altText) || "Icona";
  R(() => {
    if (!(t != null && t.url)) {
      a(!0), l(!1);
      return;
    }
    (async () => {
      try {
        l(!0);
        const e = await fetch(t.url);
        if (!e.ok) throw new Error(`HTTP ${e.status}: Failed to fetch SVG`);
        const V = await e.text();
        if (!V.includes("<svg"))
          throw new Error("Response is not valid SVG content");
        C(V), a(!1);
      } catch (e) {
        console.error("Error fetching SVG:", e), a(!0);
      } finally {
        l(!1);
      }
    })();
  }, [t == null ? void 0 : t.url]);
  const h = {
    width: ((E = t == null ? void 0 : t.size) == null ? void 0 : E.width) ?? 40,
    height: ((j = t == null ? void 0 : t.size) == null ? void 0 : j.height) ?? 40,
    ...((z = t == null ? void 0 : t.position) == null ? void 0 : z.x) !== void 0 || ((D = t == null ? void 0 : t.position) == null ? void 0 : D.y) !== void 0 ? {
      transform: `translate(${((L = t == null ? void 0 : t.position) == null ? void 0 : L.x) ?? 0}px, ${((_ = t == null ? void 0 : t.position) == null ? void 0 : _.y) ?? 0}px)`
    } : {},
    ...$
  };
  return g || M || !s ? /* @__PURE__ */ u.jsx(
    "img",
    {
      src: (t == null ? void 0 : t.url) || "",
      alt: d ? "" : p,
      "aria-hidden": d,
      width: ((G = t == null ? void 0 : t.size) == null ? void 0 : G.width) ?? 40,
      height: ((H = t == null ? void 0 : t.size) == null ? void 0 : H.height) ?? 40,
      className: r,
      style: {
        opacity: g ? 0.5 : 1,
        transition: "opacity 0.2s ease-in-out",
        ...h
      }
    }
  ) : d ? /* @__PURE__ */ u.jsx(
    "div",
    {
      className: r,
      style: h,
      "aria-hidden": "true",
      dangerouslySetInnerHTML: { __html: s }
    }
  ) : /* @__PURE__ */ u.jsx(
    "div",
    {
      className: r,
      style: h,
      role: "img",
      "aria-label": p,
      dangerouslySetInnerHTML: { __html: s }
    }
  );
};
export {
  o as SvgIcon
};
//# sourceMappingURL=index.es127.js.map