@elementor/editor-controls 4.4.0-1136 → 4.4.0-1138

package/dist/index.js

@@ -103,21 +103,23 @@ __export(index_exports, {
   createControl: () => createControl,
   createControlReplacementsRegistry: () => createControlReplacementsRegistry,
   enqueueFont: () => enqueueFont,
+  enqueueIconFonts: () => enqueueIconFonts,
   getControlReplacements: () => getControlReplacements,
   getFontAwesome7IconName: () => getFontAwesome7IconName,
   injectIntoRepeaterItemActions: () => injectIntoRepeaterItemActions,
   injectIntoRepeaterItemIcon: () => injectIntoRepeaterItemIcon,
   injectIntoRepeaterItemLabel: () => injectIntoRepeaterItemLabel,
-  isDeletedCustomIconLibrary: () => isDeletedCustomIconLibrary,
   isUnitExtendedOption: () => isUnitExtendedOption,
   registerControlReplacement: () => registerControlReplacement,
+  registerIconLibraryProvider: () => registerIconLibraryProvider,
   resetFontAwesome7IconsCache: () => resetFontAwesome7IconsCache,
-  resolveCustomIconSvg: () => resolveCustomIconSvg,
   resolveFontAwesome7Icon: () => resolveFontAwesome7Icon,
+  resolveProviderIconSvg: () => resolveProviderIconSvg,
   trackUpgradePromotionClick: () => trackUpgradePromotionClick,
   trackViewPromotion: () => trackViewPromotion,
   transitionProperties: () => transitionProperties,
   transitionsItemsList: () => transitionsItemsList,
+  unregisterIconLibraryProvider: () => unregisterIconLibraryProvider,
   useBoundProp: () => useBoundProp,
   useControlActions: () => useControlActions,
   useControlReplacement: () => useControlReplacement,
@@ -5732,7 +5734,7 @@ var AspectRatioControl = createControl(({ label }) => {
 
 // src/controls/svg-media-control.tsx
 var React92 = __toESM(require("react"));
-var import_react55 = require("react");
+var import_react56 = require("react");
 var import_editor_current_user = require("@elementor/editor-current-user");
 var import_editor_props35 = require("@elementor/editor-props");
 var import_ui75 = require("@elementor/ui");
@@ -5806,7 +5808,7 @@ function measureIconLibraryAnchor(container, buttonGroup) {
 
 // src/controls/icon-library/icon-library-popover.tsx
 var React89 = __toESM(require("react"));
-var import_react54 = require("react");
+var import_react55 = require("react");
 var import_editor_ui11 = require("@elementor/editor-ui");
 var import_icons25 = require("@elementor/icons");
 var import_session2 = require("@elementor/session");
@@ -5814,599 +5816,6 @@ var import_ui72 = require("@elementor/ui");
 var import_utils6 = require("@elementor/utils");
 var import_i18n37 = require("@wordpress/i18n");
 
-// src/controls/icon-library/custom-icon-libraries.ts
-var import_http_client3 = require("@elementor/http-client");
-var import_query2 = require("@elementor/query");
-
-// src/controls/open-icon-library.ts
-var import_editor_props34 = require("@elementor/editor-props");
-function enqueueIconFonts(library) {
-  window.elementor?.helpers?.enqueueIconFonts?.(library);
-}
-function createIconPropValue(icon, library) {
-  return {
-    value: import_editor_props34.stringPropTypeUtil.create(icon),
-    library: import_editor_props34.stringPropTypeUtil.create(library)
-  };
-}
-
-// src/controls/icon-library/fontello-svg-font.ts
-function parseFontelloSvgFont(configJson, svgFont, prefix, displayPrefix, iconNames) {
-  const codepoints = parseConfigCodepoints(configJson, prefix);
-  const configPaths = parseConfigSvgPaths(configJson, prefix);
-  const glyphs = parseSvgFontGlyphs(svgFont);
-  const resolvedDisplayPrefix = displayPrefix || prefix.replace(/-$/, "");
-  const result = {};
-  for (const name of iconNames) {
-    const fromConfig = configPaths.get(name) ?? (prefix && name.startsWith(prefix) ? configPaths.get(name.slice(prefix.length)) : void 0);
-    const glyph = fromConfig ?? findGlyph(glyphs, codepoints, name, prefix);
-    if (!glyph) {
-      continue;
-    }
-    const value = `${resolvedDisplayPrefix} ${prefix}${name}`.trim();
-    result[value] = buildIconSvg(glyph);
-  }
-  return result;
-}
-function parseConfigCodepoints(configJson, prefix) {
-  const map = /* @__PURE__ */ new Map();
-  try {
-    const data = JSON.parse(configJson);
-    if (!Array.isArray(data.glyphs)) {
-      return map;
-    }
-    for (const glyph of data.glyphs) {
-      if (typeof glyph.css !== "string" || glyph.css === "" || typeof glyph.code !== "number") {
-        continue;
-      }
-      map.set(glyph.css, glyph.code);
-      if (prefix !== "" && !glyph.css.startsWith(prefix)) {
-        map.set(`${prefix}${glyph.css}`, glyph.code);
-      }
-    }
-  } catch {
-    return map;
-  }
-  return map;
-}
-function parseConfigSvgPaths(configJson, prefix) {
-  const map = /* @__PURE__ */ new Map();
-  try {
-    const data = JSON.parse(configJson);
-    if (!Array.isArray(data.glyphs)) {
-      return map;
-    }
-    for (const glyph of data.glyphs) {
-      if (typeof glyph.css !== "string" || glyph.css === "") {
-        continue;
-      }
-      let path = "";
-      let advance = 1e3;
-      if (typeof glyph.svg === "string") {
-        path = glyph.svg;
-      } else if (glyph.svg && typeof glyph.svg === "object" && "path" in glyph.svg && typeof glyph.svg.path === "string") {
-        path = glyph.svg.path;
-        if ("width" in glyph.svg && typeof glyph.svg.width === "number" && glyph.svg.width > 0) {
-          advance = glyph.svg.width;
-        }
-      }
-      if (path === "") {
-        continue;
-      }
-      const record = { d: path, units: 1e3, advance };
-      map.set(glyph.css, record);
-      if (prefix !== "" && !glyph.css.startsWith(prefix)) {
-        map.set(`${prefix}${glyph.css}`, record);
-      }
-    }
-  } catch {
-    return map;
-  }
-  return map;
-}
-function parseSvgFontGlyphs(svgFont) {
-  const byName = /* @__PURE__ */ new Map();
-  const byCode = /* @__PURE__ */ new Map();
-  const doc = new DOMParser().parseFromString(stripDoctype(svgFont), "image/svg+xml");
-  const font = doc.querySelector("font");
-  const face = doc.querySelector("font-face");
-  const fontAdvance = positiveInt(font?.getAttribute("horiz-adv-x"), 1e3);
-  const units2 = positiveInt(face?.getAttribute("units-per-em"), fontAdvance);
-  doc.querySelectorAll("glyph").forEach((node) => {
-    const d = node.getAttribute("d") ?? "";
-    if (d === "") {
-      return;
-    }
-    const record = {
-      d,
-      units: units2,
-      advance: positiveInt(node.getAttribute("horiz-adv-x"), fontAdvance)
-    };
-    const name = node.getAttribute("glyph-name") ?? "";
-    const unicode = node.getAttribute("unicode") ?? "";
-    const code = unicode.codePointAt(0);
-    if (name) {
-      byName.set(name, record);
-    }
-    if (code !== void 0) {
-      byCode.set(code, record);
-    }
-  });
-  return { byName, byCode };
-}
-function findGlyph(glyphs, codepoints, iconName, prefix) {
-  const names = [iconName];
-  if (prefix !== "" && iconName.startsWith(prefix)) {
-    names.push(iconName.slice(prefix.length));
-  }
-  for (const name of names) {
-    const byName = glyphs.byName.get(name);
-    if (byName) {
-      return byName;
-    }
-    const code = codepoints.get(name);
-    const byCode = code !== void 0 ? glyphs.byCode.get(code) : void 0;
-    if (byCode) {
-      return byCode;
-    }
-  }
-  return null;
-}
-function buildIconSvg(glyph) {
-  return `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 ${glyph.advance} ${glyph.units}" fill="currentColor" width="100%" height="100%"><g transform="translate(0,${glyph.units}) scale(1,-1)"><path d="${escapeAttribute(glyph.d)}" fill="currentColor"></path></g></svg>`;
-}
-function stripDoctype(svgFont) {
-  return svgFont.replace(/<!DOCTYPE[^>]*>/is, "");
-}
-function positiveInt(value, fallback) {
-  if (!value) {
-    return fallback;
-  }
-  const parsed = Number.parseInt(value, 10);
-  return parsed > 0 ? parsed : fallback;
-}
-function escapeAttribute(value) {
-  return value.replace(/&/g, "&amp;").replace(/"/g, "&quot;").replace(/</g, "&lt;").replace(/>/g, "&gt;");
-}
-
-// src/controls/icon-library/icomoon-selection.ts
-var DEFAULT_ICOMOON_VIEWBOX = 1024;
-function parseIcomoonSelection(selectionJson, prefix, displayPrefix, iconNames) {
-  let data;
-  try {
-    data = JSON.parse(selectionJson);
-  } catch {
-    return {};
-  }
-  const resolvedDisplayPrefix = displayPrefix || prefix.replace(/-$/, "");
-  const names = iconNames.length > 0 ? iconNames : namesFromSelection(data);
-  const result = {};
-  for (const name of names) {
-    const markup = svgForName(data, name, prefix);
-    if (!markup) {
-      continue;
-    }
-    result[`${resolvedDisplayPrefix} ${prefix}${name}`.trim()] = markup;
-  }
-  return result;
-}
-function namesFromSelection(data) {
-  if (!Array.isArray(data.icons)) {
-    return [];
-  }
-  return data.icons.flatMap((icon) => {
-    const name = iconEntryName(icon);
-    return name ? [name] : [];
-  });
-}
-function svgForName(data, iconName, prefix) {
-  const candidates = [iconName];
-  if (prefix && iconName.startsWith(prefix)) {
-    candidates.push(iconName.slice(prefix.length));
-  }
-  for (const icon of data.icons ?? []) {
-    const name = iconEntryName(icon);
-    if (!name || !candidates.includes(name)) {
-      continue;
-    }
-    const paths = Array.isArray(icon.icon?.paths) ? icon.icon.paths.filter((path) => typeof path === "string" && path !== "") : [];
-    if (paths.length === 0) {
-      return null;
-    }
-    const size = typeof icon.icon?.width === "number" && icon.icon.width > 0 ? icon.icon.width : DEFAULT_ICOMOON_VIEWBOX;
-    const pathMarkup = paths.map((d) => `<path d="${escapeAttribute2(d)}" fill="currentColor"></path>`).join("");
-    return `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 ${size} ${size}" fill="currentColor" width="100%" height="100%">` + pathMarkup + "</svg>";
-  }
-  return null;
-}
-function iconEntryName(icon) {
-  if (typeof icon.properties?.name === "string") {
-    return icon.properties.name;
-  }
-  const tag = icon.icon?.tags;
-  return Array.isArray(tag) && typeof tag[0] === "string" ? tag[0] : "";
-}
-function escapeAttribute2(value) {
-  return value.replace(/&/g, "&amp;").replace(/"/g, "&quot;").replace(/</g, "&lt;").replace(/>/g, "&gt;");
-}
-
-// src/controls/icon-library/custom-icon-libraries.ts
-var NATIVE_TAB_NAMES = /* @__PURE__ */ new Set(["all", "recommended", "GoPro"]);
-var DEFAULT_ICON_SIZE = 512;
-var CUSTOM_ICON_LIBRARIES_QUERY_KEY = ["custom-icon-libraries"];
-var CUSTOM_ICON_SVG_URL = "elementor/v1/atomic-widgets/custom-icon-svg";
-var SUPPORTED_CUSTOM_ICON_TYPES = /* @__PURE__ */ new Set(["fontello", "icomoon", "fontastic"]);
-var svgMapCache = /* @__PURE__ */ new Map();
-var inFlightSvgMaps = /* @__PURE__ */ new Map();
-function isDeletedCustomIconLibrary(library, iconValue) {
-  const libraryName = String(library);
-  if (!libraryName || !iconValue) {
-    return false;
-  }
-  if (NATIVE_TAB_NAMES.has(libraryName) || libraryName.startsWith("fa-")) {
-    return false;
-  }
-  return !getCustomIconLibraryConfigs().some((item) => item.name === libraryName);
-}
-function useCustomIconLibraries(enabled) {
-  return (0, import_query2.useQuery)({
-    queryKey: CUSTOM_ICON_LIBRARIES_QUERY_KEY,
-    queryFn: ({ signal }) => loadCustomIconLibraries(signal),
-    enabled: enabled && areCustomIconLibrariesEnabled(),
-    staleTime: Infinity
-  });
-}
-async function loadCustomIconLibraries(signal) {
-  const catalogs = await Promise.all(
-    getCustomIconLibraryConfigs().map((library) => loadCustomLibrary(library, signal))
-  );
-  return catalogs.flat();
-}
-async function resolveCustomIconSvg(library, iconValue, signal) {
-  const config = getCustomIconLibraryConfigs().find((item) => item.name === String(library));
-  if (!config) {
-    svgMapCache.delete(String(library));
-    return null;
-  }
-  const map = await loadLibrarySvgMap(String(library), config, signal);
-  const markup = map[iconValue];
-  return typeof markup === "string" && markup !== "" ? markup : null;
-}
-function areCustomIconLibrariesEnabled() {
-  return true === window.elementorCommon?.config?.fontAwesome?.v7?.customIconLibrariesEnabled;
-}
-function getCustomIconLibraryConfigs() {
-  if (!areCustomIconLibrariesEnabled()) {
-    return [];
-  }
-  const libraries = window.elementor?.config;
-  const items2 = Array.isArray(libraries?.icons?.libraries) ? libraries.icons.libraries : [];
-  return items2.flatMap((value) => {
-    const library = normalizeCustomIconLibraryConfig(value);
-    return library ? [library] : [];
-  });
-}
-function normalizeCustomIconLibraryConfig(value) {
-  if (!value || typeof value !== "object") {
-    return null;
-  }
-  const library = value;
-  const name = coerceLibraryName(library.name);
-  if (name === "" || NATIVE_TAB_NAMES.has(name) || library.native === true || name.startsWith("fa-")) {
-    return null;
-  }
-  if (typeof library.prefix !== "string") {
-    return null;
-  }
-  if (!library.fetchJson && library.icons === void 0) {
-    return null;
-  }
-  const resolved = {
-    ...library,
-    name,
-    prefix: library.prefix,
-    ...getPackUrls(name, library)
-  };
-  if (!resolveCustomIconType(resolved)) {
-    return null;
-  }
-  return resolved;
-}
-function coerceLibraryName(value) {
-  if (typeof value === "string") {
-    return value;
-  }
-  if (typeof value === "number" && Number.isFinite(value)) {
-    return String(value);
-  }
-  return "";
-}
-function getPackUrls(library, config) {
-  const derived = derivePackAssetUrls(config.fetchJson, resolveCustomIconType(config));
-  const packs = window.elementorCommon?.config?.fontAwesome?.v7?.customIconPacks;
-  if (!packs || typeof packs !== "object") {
-    return derived;
-  }
-  const pack = packs[library];
-  if (!pack || typeof pack !== "object") {
-    return derived;
-  }
-  const packType = typeof pack.type === "string" ? pack.type : config.custom_icon_type;
-  return {
-    ...derived,
-    configUrl: typeof pack.configUrl === "string" ? pack.configUrl : derived.configUrl,
-    fontUrl: typeof pack.fontUrl === "string" ? pack.fontUrl : derived.fontUrl,
-    selectionUrl: typeof pack.selectionUrl === "string" ? pack.selectionUrl : derived.selectionUrl,
-    custom_icon_type: packType ?? derived.custom_icon_type
-  };
-}
-function resolveCustomIconType(library) {
-  const type = typeof library.custom_icon_type === "string" ? library.custom_icon_type.toLowerCase() : "";
-  return SUPPORTED_CUSTOM_ICON_TYPES.has(type) ? type : "";
-}
-function derivePackAssetUrls(fetchJson, type) {
-  if (!fetchJson) {
-    return type ? { custom_icon_type: type } : {};
-  }
-  try {
-    const url = new URL(fetchJson, window.location.origin);
-    const base = url.href.replace(/\/[^/?#]+(?:\?.*)?$/, "");
-    if ("icomoon" === type) {
-      return {
-        custom_icon_type: type,
-        selectionUrl: `${base}/selection.json`,
-        fontUrl: `${base}/fonts/icomoon.svg`
-      };
-    }
-    if ("fontastic" === type) {
-      return {
-        custom_icon_type: type,
-        fontUrl: `${base}/fonts/fontastic.svg`
-      };
-    }
-    if ("fontello" === type) {
-      return {
-        custom_icon_type: type,
-        configUrl: `${base}/config.json`,
-        fontUrl: `${base}/font/fontello.svg`
-      };
-    }
-    return {};
-  } catch {
-    return type ? { custom_icon_type: type } : {};
-  }
-}
-async function loadCustomLibrary(library, signal) {
-  enqueueIconFonts(library.name);
-  const names = parseIconNames(await loadLibraryPayload(library, signal));
-  const svgMap = await loadLibrarySvgMap(library.name, library, signal);
-  return names.map((name) => {
-    const value = createCustomIconSelectionValue(library, name);
-    return {
-      id: `${library.name}:${name}`,
-      name,
-      label: name.replace(/-/g, " "),
-      library: library.name,
-      value,
-      aliases: [],
-      width: DEFAULT_ICON_SIZE,
-      height: DEFAULT_ICON_SIZE,
-      paths: [],
-      glyphClass: value,
-      svgMarkup: svgMap[value]
-    };
-  });
-}
-async function loadLibrarySvgMap(library, config, signal) {
-  if (!config) {
-    svgMapCache.delete(library);
-    inFlightSvgMaps.delete(library);
-    return {};
-  }
-  const cached = svgMapCache.get(library);
-  if (cached && Object.keys(cached).length > 0) {
-    return cached;
-  }
-  const pending = inFlightSvgMaps.get(library);
-  if (pending) {
-    return pending;
-  }
-  const request = fetchLibrarySvgMap(library, config, signal).finally(() => {
-    inFlightSvgMaps.delete(library);
-  });
-  inFlightSvgMaps.set(library, request);
-  return request;
-}
-async function fetchLibrarySvgMap(library, config, signal) {
-  const fromRest = await loadSvgMapFromRest(library, signal);
-  const restIcons = fromRest.icons;
-  if (Object.keys(restIcons).length > 0 && !fromRest.truncated) {
-    svgMapCache.set(library, restIcons);
-    return restIcons;
-  }
-  const fromPack = await loadSvgMapFromPackFiles(config, signal);
-  const merged = { ...fromPack, ...restIcons };
-  if (Object.keys(merged).length > 0) {
-    svgMapCache.set(library, merged);
-    return merged;
-  }
-  return {};
-}
-async function loadSvgMapFromRest(library, signal) {
-  try {
-    const response = await (0, import_http_client3.httpService)().get(CUSTOM_ICON_SVG_URL, { params: { library: String(library) }, signal });
-    return unwrapIconMap(response);
-  } catch {
-    return { icons: {}, truncated: false };
-  }
-}
-function unwrapIconMap(payload) {
-  let current = payload;
-  for (let depth = 0; depth < 4; depth++) {
-    if (!current || typeof current !== "object") {
-      return { icons: {}, truncated: false };
-    }
-    const record = current;
-    if (record.icons && typeof record.icons === "object" && !Array.isArray(record.icons)) {
-      const icons = {};
-      Object.entries(record.icons).forEach(([key, value]) => {
-        if (typeof value === "string" && value !== "") {
-          icons[key] = value;
-        }
-      });
-      return {
-        icons,
-        truncated: true === record.truncated
-      };
-    }
-    current = "data" in record ? record.data : void 0;
-  }
-  return { icons: {}, truncated: false };
-}
-async function loadSvgMapFromPackFiles(library, signal) {
-  const type = resolveCustomIconType(library);
-  if (!type) {
-    return {};
-  }
-  if ("icomoon" === type && library.selectionUrl) {
-    try {
-      const response = await fetch(library.selectionUrl, { signal, mode: "cors" });
-      if (response.ok) {
-        const selectionJson = await response.text();
-        const names2 = parseIconNames(safeJson(selectionJson));
-        const payloadNames2 = names2.length > 0 ? names2 : parseIconNames({ icons: library.icons });
-        const fromSelection = parseIcomoonSelection(
-          selectionJson,
-          library.prefix,
-          library.displayPrefix ?? "",
-          payloadNames2
-        );
-        if (Object.keys(fromSelection).length > 0) {
-          return fromSelection;
-        }
-      }
-    } catch {
-    }
-  }
-  const fontUrls = uniqueUrls([
-    library.fontUrl,
-    "fontello" === type && library.fetchJson ? packSiblingUrl(library.fetchJson, "font/fontello.svg") : null,
-    "fontastic" === type && library.fetchJson ? packSiblingUrl(library.fetchJson, "fonts/fontastic.svg") : null,
-    "icomoon" === type && library.fetchJson ? packSiblingUrl(library.fetchJson, "fonts/icomoon.svg") : null
-  ]);
-  if (fontUrls.length === 0) {
-    return {};
-  }
-  let configJson = "{}";
-  if (library.configUrl) {
-    try {
-      const configResponse = await fetch(library.configUrl, { signal, mode: "cors" });
-      if (configResponse.ok) {
-        configJson = await configResponse.text();
-      }
-    } catch {
-      configJson = "{}";
-    }
-  }
-  const names = parseIconNames(safeJson(configJson));
-  const payloadNames = names.length > 0 ? names : parseIconNames({ icons: library.icons });
-  for (const fontUrl of fontUrls) {
-    try {
-      const fontResponse = await fetch(fontUrl, { signal, mode: "cors" });
-      if (!fontResponse.ok) {
-        continue;
-      }
-      const fromFont = parseFontelloSvgFont(
-        configJson,
-        await fontResponse.text(),
-        library.prefix,
-        library.displayPrefix ?? "",
-        payloadNames
-      );
-      if (Object.keys(fromFont).length > 0) {
-        return fromFont;
-      }
-    } catch {
-      continue;
-    }
-  }
-  return {};
-}
-function packSiblingUrl(fetchJson, relativePath) {
-  try {
-    const url = new URL(fetchJson, window.location.origin);
-    url.pathname = url.pathname.replace(/\/[^/]+$/, `/${relativePath}`);
-    return url.href;
-  } catch {
-    return null;
-  }
-}
-function uniqueUrls(urls) {
-  return [...new Set(urls.filter((url) => typeof url === "string" && url !== ""))];
-}
-function safeJson(value) {
-  try {
-    return JSON.parse(value);
-  } catch {
-    return null;
-  }
-}
-async function loadLibraryPayload(library, signal) {
-  if (library.icons !== void 0) {
-    return { icons: library.icons };
-  }
-  if (!library.fetchJson) {
-    return null;
-  }
-  try {
-    const response = await fetch(library.fetchJson, { signal, mode: "cors" });
-    return response.ok ? response.json() : null;
-  } catch {
-    return null;
-  }
-}
-function parseIconNames(payload) {
-  if (!payload || typeof payload !== "object") {
-    return [];
-  }
-  const icons = payload.icons;
-  if (Array.isArray(icons)) {
-    return icons.flatMap((entry) => {
-      if (typeof entry === "string") {
-        return [normalizeIconName(entry)];
-      }
-      if (entry && typeof entry === "object" && "name" in entry && typeof entry.name === "string") {
-        return [normalizeIconName(entry.name)];
-      }
-      if (entry && typeof entry === "object" && "properties" in entry && entry.properties && typeof entry.properties === "object" && "name" in entry.properties && typeof entry.properties.name === "string") {
-        return [normalizeIconName(entry.properties.name)];
-      }
-      return [];
-    }).filter(Boolean);
-  }
-  if (icons && typeof icons === "object") {
-    return Object.keys(icons).map(normalizeIconName).filter(Boolean);
-  }
-  const glyphs = payload.glyphs;
-  if (Array.isArray(glyphs)) {
-    return glyphs.flatMap((entry) => {
-      if (entry && typeof entry === "object" && "css" in entry && typeof entry.css === "string") {
-        return [normalizeIconName(entry.css)];
-      }
-      return [];
-    }).filter(Boolean);
-  }
-  return [];
-}
-function normalizeIconName(name) {
-  return name.trim().replace(/^:/, "").replace(/:$/, "");
-}
-function createCustomIconSelectionValue(library, name) {
-  const prefix = library.prefix;
-  const displayPrefix = library.displayPrefix || prefix.replace(/-$/, "");
-  return `${displayPrefix} ${prefix}${name}`.trim();
-}
-
 // src/controls/icon-library/font-awesome-7-data.ts
 var FONT_AWESOME_7_LIBRARIES = [
   { file: "solid", library: "fa-solid" },
@@ -7233,6 +6642,39 @@ var IconLibraryGrid = ({
   );
 };
 
+// src/controls/icon-library/icon-library-providers.ts
+var import_react54 = require("react");
+var providers = /* @__PURE__ */ new Map();
+function registerIconLibraryProvider(provider) {
+  providers.set(provider.id, provider);
+}
+function unregisterIconLibraryProvider(id) {
+  providers.delete(id);
+}
+function useIconLibraryProviderIcons(enabled) {
+  const [snapshot] = (0, import_react54.useState)(() => [...providers.values()]);
+  const states = snapshot.map((provider) => provider.useIcons(enabled));
+  return {
+    data: states.flatMap((state) => state.data ?? []),
+    isLoading: states.some((state) => state.isLoading)
+  };
+}
+async function resolveProviderIconSvg(library, iconValue, signal) {
+  for (const provider of providers.values()) {
+    try {
+      const markup = await provider.resolveSvg?.(library, iconValue, signal);
+      if (markup) {
+        return markup;
+      }
+    } catch (error) {
+      if (signal?.aborted) {
+        throw error;
+      }
+    }
+  }
+  return null;
+}
+
 // src/controls/icon-library/icon-library-view-toggle.tsx
 var React87 = __toESM(require("react"));
 var import_icons24 = require("@elementor/icons");
@@ -7276,10 +6718,10 @@ var SvgElementIcon = React88.forwardRef(
 );
 
 // src/controls/icon-library/use-font-awesome-7-catalog.ts
-var import_query3 = require("@elementor/query");
+var import_query2 = require("@elementor/query");
 var FONT_AWESOME_7_CATALOG_QUERY_KEY = ["font-awesome-7-catalog"];
 function useFontAwesome7Catalog(enabled) {
-  return (0, import_query3.useQuery)({
+  return (0, import_query2.useQuery)({
     queryKey: FONT_AWESOME_7_CATALOG_QUERY_KEY,
     queryFn: ({ signal }) => loadFontAwesome7Catalog(signal),
     enabled,
@@ -7323,21 +6765,21 @@ var IconLibraryPopover = ({
     handleChange: handleSearchChange,
     setImmediateValue: setSearchValue
   } = (0, import_utils6.useDebounceState)({ delay: ICON_LIBRARY_SEARCH_DEBOUNCE_DELAY });
-  const [activeLibraries, setActiveLibraries] = (0, import_react54.useState)([]);
+  const [activeLibraries, setActiveLibraries] = (0, import_react55.useState)([]);
   const [storedView, setStoredView] = (0, import_session2.useSessionStorage)(
     ICON_LIBRARY_VIEW_STORAGE_KEY,
     ICON_LIBRARY_VIEW_STORAGE_PREFIX
   );
   const view = isIconLibraryView(storedView) ? storedView : DEFAULT_ICON_LIBRARY_VIEW;
   const { data: fontAwesomeIcons = [], isLoading: isFontAwesomeLoading } = useFontAwesome7Catalog(open);
-  const { data: customIcons = [], isLoading: isCustomLoading } = useCustomIconLibraries(open);
-  const isLoading = isFontAwesomeLoading || isCustomLoading;
-  const icons = (0, import_react54.useMemo)(() => [...fontAwesomeIcons, ...customIcons], [customIcons, fontAwesomeIcons]);
-  const items2 = (0, import_react54.useMemo)(
+  const { data: providerIcons = [], isLoading: isProviderLoading } = useIconLibraryProviderIcons(open);
+  const isLoading = isFontAwesomeLoading || isProviderLoading;
+  const icons = (0, import_react55.useMemo)(() => [...fontAwesomeIcons, ...providerIcons], [providerIcons, fontAwesomeIcons]);
+  const items2 = (0, import_react55.useMemo)(
     () => createIconLibraryItems(icons, searchValue, activeLibraries),
     [activeLibraries, icons, searchValue]
   );
-  const selectedValue = (0, import_react54.useMemo)(
+  const selectedValue = (0, import_react55.useMemo)(
     () => findFontAwesome7Icon(icons, selectedIconClass, selectedIconLibrary)?.id,
     [icons, selectedIconClass, selectedIconLibrary]
   );
@@ -7495,6 +6937,18 @@ var createIconLibraryItems = (icons, searchValue, libraries) => filterFontAwesom
   value: icon.id
 }));
 
+// src/controls/open-icon-library.ts
+var import_editor_props34 = require("@elementor/editor-props");
+function enqueueIconFonts(library) {
+  window.elementor?.helpers?.enqueueIconFonts?.(library);
+}
+function createIconPropValue(icon, library) {
+  return {
+    value: import_editor_props34.stringPropTypeUtil.create(icon),
+    library: import_editor_props34.stringPropTypeUtil.create(library)
+  };
+}
+
 // src/controls/svg-media-overlay.tsx
 var React90 = __toESM(require("react"));
 var import_icons26 = require("@elementor/icons");
@@ -7563,10 +7017,10 @@ var ICON_PREVIEW_COLOR = "#000000";
 var SvgMediaPreview = ({ isFetching, src, iconClassName, iconLibrary }) => {
   const shouldLoadIconCatalog = Boolean(iconClassName && iconLibrary);
   const { data: fontAwesomeIcons = [], isLoading: isFontAwesomeLoading } = useFontAwesome7Catalog(shouldLoadIconCatalog);
-  const { data: customIcons = [], isLoading: isCustomLoading } = useCustomIconLibraries(shouldLoadIconCatalog);
-  const icons = [...fontAwesomeIcons, ...customIcons];
+  const { data: providerIcons = [], isLoading: isProviderLoading } = useIconLibraryProviderIcons(shouldLoadIconCatalog);
+  const icons = [...fontAwesomeIcons, ...providerIcons];
   const selectedIcon = findFontAwesome7Icon(icons, iconClassName, iconLibrary);
-  const isLoadingCatalog = shouldLoadIconCatalog && (isFontAwesomeLoading || isCustomLoading);
+  const isLoadingCatalog = shouldLoadIconCatalog && (isFontAwesomeLoading || isProviderLoading);
   if (isFetching || isLoadingCatalog) {
     return /* @__PURE__ */ React91.createElement(import_ui74.CircularProgress, { role: "progressbar" });
   }
@@ -7638,21 +7092,23 @@ var MODE_BROWSE = { mode: "browse" };
 var MODE_UPLOAD = { mode: "upload" };
 var SvgMediaControl = createControl(({ showIconLibrary = false, label }) => {
   const groupLabel = label ?? (0, import_i18n40.__)("SVG", "elementor");
-  const { value: svgValue, setValue: setSvgValue } = useBoundProp(import_editor_props35.svgSrcPropTypeUtil);
-  const { value: iconValue, setValue: setIconValue } = useBoundProp(import_editor_props35.iconPropTypeUtil);
+  const { value: svgValue, setValue: setSvgValue, placeholder: svgPlaceholder } = useBoundProp(import_editor_props35.svgSrcPropTypeUtil);
+  const { value: iconValue, setValue: setIconValue, placeholder: iconPlaceholder } = useBoundProp(import_editor_props35.iconPropTypeUtil);
   const id = svgValue?.id;
-  const url = svgValue?.url;
-  const { data: attachment, isFetching } = (0, import_wp_media2.useWpMediaAttachment)(id?.value || null);
-  const src = attachment?.url ?? url?.value ?? null;
+  const hasOwnValue = svgValue !== null && svgValue !== void 0 || iconValue !== null && iconValue !== void 0;
+  const previewSvgValue = hasOwnValue ? svgValue : svgPlaceholder;
+  const previewIconValue = hasOwnValue ? iconValue : iconPlaceholder;
+  const { data: attachment, isFetching } = (0, import_wp_media2.useWpMediaAttachment)(previewSvgValue?.id?.value || null);
+  const src = attachment?.url ?? previewSvgValue?.url?.value ?? null;
   const { data: allowSvgUpload } = useUnfilteredFilesUpload();
-  const [unfilteredModalOpenState, setUnfilteredModalOpenState] = (0, import_react55.useState)(false);
+  const [unfilteredModalOpenState, setUnfilteredModalOpenState] = (0, import_react56.useState)(false);
   const iconLibraryPopoverState = (0, import_ui75.usePopupState)({ variant: "popover" });
-  const controlContainerRef = (0, import_react55.useRef)(null);
-  const buttonGroupRef = (0, import_react55.useRef)(null);
-  const [iconLibraryAnchor, setIconLibraryAnchor] = (0, import_react55.useState)(null);
+  const controlContainerRef = (0, import_react56.useRef)(null);
+  const buttonGroupRef = (0, import_react56.useRef)(null);
+  const [iconLibraryAnchor, setIconLibraryAnchor] = (0, import_react56.useState)(null);
   const { isAdmin } = (0, import_editor_current_user.useCurrentUserCapabilities)();
-  const selectedIconClass = showIconLibrary && typeof iconValue?.value?.value === "string" ? iconValue.value.value : null;
-  const selectedIconLibrary = showIconLibrary && typeof iconValue?.library?.value === "string" ? iconValue.library.value : null;
+  const selectedIconClass = showIconLibrary && typeof previewIconValue?.value?.value === "string" ? previewIconValue.value.value : null;
+  const selectedIconLibrary = showIconLibrary && typeof previewIconValue?.library?.value === "string" ? previewIconValue.library.value : null;
   const { open } = (0, import_wp_media2.useWpMediaFrame)({
     mediaTypes: ["svg"],
     multiple: false,
@@ -7701,7 +7157,7 @@ var SvgMediaControl = createControl(({ showIconLibrary = false, label }) => {
     setIconLibraryAnchor(anchor);
     iconLibraryPopoverState.open(event);
   };
-  (0, import_react55.useEffect)(() => {
+  (0, import_react56.useEffect)(() => {
     if (!iconLibraryPopoverState.isOpen) {
       return;
     }
@@ -7983,7 +7439,7 @@ var BackgroundImageOverlayAttachment = () => {
 
 // src/controls/background-control/background-overlay/background-image-overlay/background-image-overlay-position.tsx
 var React96 = __toESM(require("react"));
-var import_react56 = require("react");
+var import_react57 = require("react");
 var import_editor_props38 = require("@elementor/editor-props");
 var import_editor_ui12 = require("@elementor/editor-ui");
 var import_icons28 = require("@elementor/icons");
@@ -8005,7 +7461,7 @@ var BackgroundImageOverlayPosition = () => {
   const backgroundImageOffsetContext = useBoundProp(import_editor_props38.backgroundImagePositionOffsetPropTypeUtil);
   const stringPropContext = useBoundProp(import_editor_props38.stringPropTypeUtil);
   const isCustom = !!backgroundImageOffsetContext.value;
-  const rowRef = (0, import_react56.useRef)(null);
+  const rowRef = (0, import_react57.useRef)(null);
   const handlePositionChange = (event) => {
     const value = event.target.value || null;
     if (value === "custom") {
@@ -8078,7 +7534,7 @@ var BackgroundImageOverlayRepeat = () => {
 
 // src/controls/background-control/background-overlay/background-image-overlay/background-image-overlay-size.tsx
 var React98 = __toESM(require("react"));
-var import_react57 = require("react");
+var import_react58 = require("react");
 var import_editor_props39 = require("@elementor/editor-props");
 var import_icons30 = require("@elementor/icons");
 var import_ui81 = require("@elementor/ui");
@@ -8113,7 +7569,7 @@ var BackgroundImageOverlaySize = () => {
   const backgroundImageScaleContext = useBoundProp(import_editor_props39.backgroundImageSizeScalePropTypeUtil);
   const stringPropContext = useBoundProp(import_editor_props39.stringPropTypeUtil);
   const isCustom = !!backgroundImageScaleContext.value;
-  const rowRef = (0, import_react57.useRef)(null);
+  const rowRef = (0, import_react58.useRef)(null);
   const handleSizeChange = (size) => {
     if (size === "custom") {
       backgroundImageScaleContext.setValue({ width: null, height: null });
@@ -8148,7 +7604,7 @@ var BackgroundImageOverlaySize = () => {
 };
 
 // src/controls/background-control/background-overlay/use-background-tabs-history.ts
-var import_react58 = require("react");
+var import_react59 = require("react");
 var import_editor_props40 = require("@elementor/editor-props");
 var import_ui82 = require("@elementor/ui");
 var useBackgroundTabsHistory = ({
@@ -8169,7 +7625,7 @@ var useBackgroundTabsHistory = ({
     return "image";
   };
   const { getTabsProps, getTabProps, getTabPanelProps } = (0, import_ui82.useTabs)(getCurrentOverlayType());
-  const valuesHistory = (0, import_react58.useRef)({
+  const valuesHistory = (0, import_react59.useRef)({
     image: initialBackgroundImageOverlay,
     color: initialBackgroundColorOverlay2,
     gradient: initialBackgroundGradientOverlay2
@@ -8416,7 +7872,7 @@ var BackgroundClipField = () => {
 
 // src/controls/repeatable-control.tsx
 var React101 = __toESM(require("react"));
-var import_react59 = require("react");
+var import_react60 = require("react");
 var import_editor_props43 = require("@elementor/editor-props");
 var import_ui85 = require("@elementor/ui");
 var PLACEHOLDER_REGEX = /\$\{([^}]+)\}/g;
@@ -8437,11 +7893,11 @@ var RepeatableControl = createControl(
     if (!childPropTypeUtil) {
       return null;
     }
-    const childArrayPropTypeUtil2 = (0, import_react59.useMemo)(
+    const childArrayPropTypeUtil2 = (0, import_react60.useMemo)(
       () => (0, import_editor_props43.createArrayPropUtils)(childPropTypeUtil.key, childPropTypeUtil.schema, propKey),
       [childPropTypeUtil.key, childPropTypeUtil.schema, propKey]
     );
-    const contextValue = (0, import_react59.useMemo)(
+    const contextValue = (0, import_react60.useMemo)(
       () => ({
         ...childControlConfig,
         placeholder: placeholder || "",
@@ -8573,7 +8029,7 @@ var getAllProperties = (pattern) => {
 
 // src/controls/key-value-control.tsx
 var React102 = __toESM(require("react"));
-var import_react60 = require("react");
+var import_react61 = require("react");
 var import_editor_props44 = require("@elementor/editor-props");
 var import_ui86 = require("@elementor/ui");
 var import_i18n48 = require("@wordpress/i18n");
@@ -8600,9 +8056,9 @@ var getInitialFieldValue = (fieldValue) => {
 };
 var KeyValueControl = createControl((props = {}) => {
   const { value, setValue, ...propContext } = useBoundProp(import_editor_props44.keyValuePropTypeUtil);
-  const [keyError, setKeyError] = (0, import_react60.useState)("");
-  const [valueError, setValueError] = (0, import_react60.useState)("");
-  const [sessionState, setSessionState] = (0, import_react60.useState)({
+  const [keyError, setKeyError] = (0, import_react61.useState)("");
+  const [valueError, setValueError] = (0, import_react61.useState)("");
+  const [sessionState, setSessionState] = (0, import_react61.useState)({
     key: getInitialFieldValue(value?.key),
     value: getInitialFieldValue(value?.value)
   });
@@ -8612,7 +8068,7 @@ var KeyValueControl = createControl((props = {}) => {
     keyHelper: void 0,
     valueHelper: void 0
   };
-  const [keyRegex, valueRegex, errMsg] = (0, import_react60.useMemo)(
+  const [keyRegex, valueRegex, errMsg] = (0, import_react61.useMemo)(
     () => [
       props.regexKey ? new RegExp(props.regexKey) : void 0,
       props.regexValue ? new RegExp(props.regexValue) : void 0,
@@ -8744,7 +8200,7 @@ var PositionControl = () => {
 
 // src/controls/transform-control/transform-repeater-control.tsx
 var React116 = __toESM(require("react"));
-var import_react68 = require("react");
+var import_react69 = require("react");
 var import_editor_props54 = require("@elementor/editor-props");
 var import_icons38 = require("@elementor/icons");
 var import_ui100 = require("@elementor/ui");
@@ -8803,7 +8259,7 @@ var import_i18n54 = require("@wordpress/i18n");
 
 // src/controls/transform-control/functions/move.tsx
 var React105 = __toESM(require("react"));
-var import_react61 = require("react");
+var import_react62 = require("react");
 var import_editor_props47 = require("@elementor/editor-props");
 var import_icons32 = require("@elementor/icons");
 var import_ui89 = require("@elementor/ui");
@@ -8850,7 +8306,7 @@ var moveAxisControls = [
 ];
 var Move = () => {
   const context = useBoundProp(import_editor_props47.moveTransformPropTypeUtil);
-  const rowRefs = [(0, import_react61.useRef)(null), (0, import_react61.useRef)(null), (0, import_react61.useRef)(null)];
+  const rowRefs = [(0, import_react62.useRef)(null), (0, import_react62.useRef)(null), (0, import_react62.useRef)(null)];
   return /* @__PURE__ */ React105.createElement(import_ui89.Grid, { container: true, spacing: 1.5 }, /* @__PURE__ */ React105.createElement(PropProvider, { ...context }, /* @__PURE__ */ React105.createElement(PropKeyProvider, { bind: TransformFunctionKeys.move }, moveAxisControls.map((control, index) => /* @__PURE__ */ React105.createElement(
     AxisRow,
     {
@@ -8865,7 +8321,7 @@ var Move = () => {
 
 // src/controls/transform-control/functions/rotate.tsx
 var React106 = __toESM(require("react"));
-var import_react62 = require("react");
+var import_react63 = require("react");
 var import_editor_props48 = require("@elementor/editor-props");
 var import_icons33 = require("@elementor/icons");
 var import_ui90 = require("@elementor/ui");
@@ -8890,7 +8346,7 @@ var rotateAxisControls = [
 var rotateUnits = ["deg", "rad", "grad", "turn"];
 var Rotate = () => {
   const context = useBoundProp(import_editor_props48.rotateTransformPropTypeUtil);
-  const rowRefs = [(0, import_react62.useRef)(null), (0, import_react62.useRef)(null), (0, import_react62.useRef)(null)];
+  const rowRefs = [(0, import_react63.useRef)(null), (0, import_react63.useRef)(null), (0, import_react63.useRef)(null)];
   return /* @__PURE__ */ React106.createElement(import_ui90.Grid, { container: true, spacing: 1.5 }, /* @__PURE__ */ React106.createElement(PropProvider, { ...context }, /* @__PURE__ */ React106.createElement(PropKeyProvider, { bind: TransformFunctionKeys.rotate }, rotateAxisControls.map((control, index) => /* @__PURE__ */ React106.createElement(
     AxisRow,
     {
@@ -8904,7 +8360,7 @@ var Rotate = () => {
 
 // src/controls/transform-control/functions/scale.tsx
 var React108 = __toESM(require("react"));
-var import_react63 = require("react");
+var import_react64 = require("react");
 var import_editor_props49 = require("@elementor/editor-props");
 var import_icons34 = require("@elementor/icons");
 var import_ui92 = require("@elementor/ui");
@@ -8937,13 +8393,13 @@ var scaleAxisControls = [
 ];
 var Scale = () => {
   const context = useBoundProp(import_editor_props49.scaleTransformPropTypeUtil);
-  const rowRefs = [(0, import_react63.useRef)(null), (0, import_react63.useRef)(null), (0, import_react63.useRef)(null)];
+  const rowRefs = [(0, import_react64.useRef)(null), (0, import_react64.useRef)(null), (0, import_react64.useRef)(null)];
   return /* @__PURE__ */ React108.createElement(import_ui92.Grid, { container: true, spacing: 1.5 }, /* @__PURE__ */ React108.createElement(PropProvider, { ...context }, /* @__PURE__ */ React108.createElement(PropKeyProvider, { bind: TransformFunctionKeys.scale }, scaleAxisControls.map((control, index) => /* @__PURE__ */ React108.createElement(ScaleAxisRow, { key: control.bind, ...control, anchorRef: rowRefs[index] })))));
 };
 
 // src/controls/transform-control/functions/skew.tsx
 var React109 = __toESM(require("react"));
-var import_react64 = require("react");
+var import_react65 = require("react");
 var import_editor_props50 = require("@elementor/editor-props");
 var import_icons35 = require("@elementor/icons");
 var import_ui93 = require("@elementor/ui");
@@ -8963,7 +8419,7 @@ var skewAxisControls = [
 var skewUnits = ["deg", "rad", "grad", "turn"];
 var Skew = () => {
   const context = useBoundProp(import_editor_props50.skewTransformPropTypeUtil);
-  const rowRefs = [(0, import_react64.useRef)(null), (0, import_react64.useRef)(null), (0, import_react64.useRef)(null)];
+  const rowRefs = [(0, import_react65.useRef)(null), (0, import_react65.useRef)(null), (0, import_react65.useRef)(null)];
   return /* @__PURE__ */ React109.createElement(import_ui93.Grid, { container: true, spacing: 1.5 }, /* @__PURE__ */ React109.createElement(PropProvider, { ...context }, /* @__PURE__ */ React109.createElement(PropKeyProvider, { bind: TransformFunctionKeys.skew }, skewAxisControls.map((control, index) => /* @__PURE__ */ React109.createElement(
     AxisRow,
     {
@@ -8976,7 +8432,7 @@ var Skew = () => {
 };
 
 // src/controls/transform-control/use-transform-tabs-history.tsx
-var import_react65 = require("react");
+var import_react66 = require("react");
 var import_editor_props51 = require("@elementor/editor-props");
 var import_ui94 = require("@elementor/ui");
 var useTransformTabsHistory = ({
@@ -9003,7 +8459,7 @@ var useTransformTabsHistory = ({
     }
   };
   const { getTabsProps, getTabProps, getTabPanelProps } = (0, import_ui94.useTabs)(getCurrentTransformType());
-  const valuesHistory = (0, import_react65.useRef)({
+  const valuesHistory = (0, import_react66.useRef)({
     move: initialMove,
     scale: initialScale,
     rotate: initialRotate,
@@ -9147,7 +8603,7 @@ var import_i18n58 = require("@wordpress/i18n");
 
 // src/controls/transform-control/transform-base-controls/children-perspective-control.tsx
 var React113 = __toESM(require("react"));
-var import_react66 = require("react");
+var import_react67 = require("react");
 var import_editor_props52 = require("@elementor/editor-props");
 var import_ui97 = require("@elementor/ui");
 var import_i18n56 = require("@wordpress/i18n");
@@ -9179,13 +8635,13 @@ var PerspectiveOriginControlProvider = () => {
   return /* @__PURE__ */ React113.createElement(PropProvider, { ...context }, CHILDREN_PERSPECTIVE_FIELDS.map((control) => /* @__PURE__ */ React113.createElement(PropKeyProvider, { bind: control.bind, key: control.bind }, /* @__PURE__ */ React113.createElement(ControlFields, { control }))));
 };
 var ControlFields = ({ control }) => {
-  const rowRef = (0, import_react66.useRef)(null);
+  const rowRef = (0, import_react67.useRef)(null);
   return /* @__PURE__ */ React113.createElement(PopoverGridContainer, { ref: rowRef }, /* @__PURE__ */ React113.createElement(import_ui97.Grid, { item: true, xs: 6 }, /* @__PURE__ */ React113.createElement(ControlFormLabel, null, control.label)), /* @__PURE__ */ React113.createElement(import_ui97.Grid, { item: true, xs: 6 }, /* @__PURE__ */ React113.createElement(SizeControl, { variant: "length", units: control.units, anchorRef: rowRef, disableCustom: true })));
 };
 
 // src/controls/transform-control/transform-base-controls/transform-origin-control.tsx
 var React114 = __toESM(require("react"));
-var import_react67 = require("react");
+var import_react68 = require("react");
 var import_editor_props53 = require("@elementor/editor-props");
 var import_ui98 = require("@elementor/ui");
 var import_i18n57 = require("@wordpress/i18n");
@@ -9213,7 +8669,7 @@ var TransformOriginControl = () => {
 };
 var ControlFields2 = ({ control }) => {
   const context = useBoundProp(import_editor_props53.transformOriginPropTypeUtil);
-  const rowRef = (0, import_react67.useRef)(null);
+  const rowRef = (0, import_react68.useRef)(null);
   return /* @__PURE__ */ React114.createElement(PropProvider, { ...context }, /* @__PURE__ */ React114.createElement(PropKeyProvider, { bind: control.bind }, /* @__PURE__ */ React114.createElement(PopoverGridContainer, { ref: rowRef }, /* @__PURE__ */ React114.createElement(import_ui98.Grid, { item: true, xs: 6 }, /* @__PURE__ */ React114.createElement(ControlFormLabel, null, control.label)), /* @__PURE__ */ React114.createElement(import_ui98.Grid, { item: true, xs: 6 }, /* @__PURE__ */ React114.createElement(SizeControl, { variant: "length", units: control.units, anchorRef: rowRef })))));
 };
 
@@ -9261,7 +8717,7 @@ var SIZE11 = "tiny";
 var TransformRepeaterControl = createControl(
   ({ showChildrenPerspective }) => {
     const context = useBoundProp(import_editor_props54.transformPropTypeUtil);
-    const headerRef = (0, import_react68.useRef)(null);
+    const headerRef = (0, import_react69.useRef)(null);
     const popupState = (0, import_ui100.usePopupState)({ variant: "popover" });
     return /* @__PURE__ */ React116.createElement(PropProvider, { ...context }, /* @__PURE__ */ React116.createElement(
       TransformSettingsControl,
@@ -9341,7 +8797,7 @@ var TransformBasePopoverTrigger = ({
 
 // src/controls/transition-control/transition-repeater-control.tsx
 var React119 = __toESM(require("react"));
-var import_react71 = require("react");
+var import_react72 = require("react");
 var import_editor_props57 = require("@elementor/editor-props");
 var import_icons40 = require("@elementor/icons");
 var import_ui103 = require("@elementor/ui");
@@ -9350,15 +8806,15 @@ var import_i18n62 = require("@wordpress/i18n");
 
 // src/controls/selection-size-control.tsx
 var React117 = __toESM(require("react"));
-var import_react69 = require("react");
+var import_react70 = require("react");
 var import_editor_props55 = require("@elementor/editor-props");
 var import_ui101 = require("@elementor/ui");
 var SelectionSizeControl = createControl(
   ({ selectionLabel, sizeLabel, selectionConfig, sizeConfigMap }) => {
     const { value, setValue, propType } = useBoundProp(import_editor_props55.selectionSizePropTypeUtil);
-    const rowRef = (0, import_react69.useRef)(null);
+    const rowRef = (0, import_react70.useRef)(null);
     const sizeFieldId = sizeLabel.replace(/\s+/g, "-").toLowerCase();
-    const currentSizeConfig = (0, import_react69.useMemo)(() => {
+    const currentSizeConfig = (0, import_react70.useMemo)(() => {
       switch (value.selection.$$type) {
         case "key-value":
           return sizeConfigMap[value?.selection?.value.value.value || ""];
@@ -9571,7 +9027,7 @@ function subscribeToTransitionEvent() {
 
 // src/controls/transition-control/transition-selector.tsx
 var React118 = __toESM(require("react"));
-var import_react70 = require("react");
+var import_react71 = require("react");
 var import_editor_props56 = require("@elementor/editor-props");
 var import_editor_ui15 = require("@elementor/editor-ui");
 var import_icons39 = require("@elementor/icons");
@@ -9657,9 +9113,9 @@ var TransitionSelector = ({
   const {
     key: { value: transitionLabel }
   } = value;
-  const defaultRef = (0, import_react70.useRef)(null);
+  const defaultRef = (0, import_react71.useRef)(null);
   const popoverState = (0, import_ui102.usePopupState)({ variant: "popover" });
-  const disabledCategories = (0, import_react70.useMemo)(() => {
+  const disabledCategories = (0, import_react71.useMemo)(() => {
     return new Set(
       transitionProperties.filter((cat) => cat.properties.some((prop) => prop.isDisabled)).map((cat) => cat.label)
     );
@@ -9885,14 +9341,14 @@ var TransitionRepeaterControl = createControl(
     currentStyleState
   }) => {
     const currentStyleIsNormal = currentStyleState === null;
-    const [recentlyUsedList, setRecentlyUsedList] = (0, import_react71.useState)([]);
+    const [recentlyUsedList, setRecentlyUsedList] = (0, import_react72.useState)([]);
     const proInstalled = (0, import_utils8.hasProInstalled)();
     const { value, setValue } = useBoundProp(childArrayPropTypeUtil);
-    const { allDisabled: disabledItems, proDisabled: proDisabledItems } = (0, import_react71.useMemo)(
+    const { allDisabled: disabledItems, proDisabled: proDisabledItems } = (0, import_react72.useMemo)(
       () => getDisabledItemLabels(value),
       [value]
     );
-    const allowedTransitionSet = (0, import_react71.useMemo)(() => {
+    const allowedTransitionSet = (0, import_react72.useMemo)(() => {
       const set = /* @__PURE__ */ new Set();
       transitionProperties.forEach((category) => {
         category.properties.forEach((prop) => {
@@ -9903,7 +9359,7 @@ var TransitionRepeaterControl = createControl(
       });
       return set;
     }, [proInstalled]);
-    (0, import_react71.useEffect)(() => {
+    (0, import_react72.useEffect)(() => {
       if (!value || value.length === 0) {
         return;
       }
@@ -9915,10 +9371,10 @@ var TransitionRepeaterControl = createControl(
         setValue(sanitized);
       }
     }, [allowedTransitionSet]);
-    (0, import_react71.useEffect)(() => {
+    (0, import_react72.useEffect)(() => {
       recentlyUsedListGetter().then(setRecentlyUsedList);
     }, [recentlyUsedListGetter]);
-    const allPropertiesUsed = (0, import_react71.useMemo)(() => areAllPropertiesUsed(value), [value]);
+    const allPropertiesUsed = (0, import_react72.useMemo)(() => areAllPropertiesUsed(value), [value]);
     const isAddItemDisabled = !currentStyleIsNormal || allPropertiesUsed;
     return /* @__PURE__ */ React119.createElement(
       RepeatableControl,
@@ -10201,13 +9657,13 @@ var BoundTimeStringControl = ({ bind, ariaLabel }) => {
 
 // src/controls/inline-editing-control.tsx
 var React128 = __toESM(require("react"));
-var import_react77 = require("react");
+var import_react78 = require("react");
 var import_editor_props65 = require("@elementor/editor-props");
 var import_ui112 = require("@elementor/ui");
 
 // src/components/inline-editor.tsx
 var React125 = __toESM(require("react"));
-var import_react72 = require("react");
+var import_react73 = require("react");
 var import_ui109 = require("@elementor/ui");
 var import_extension_bold = __toESM(require("@tiptap/extension-bold"));
 var import_extension_document = __toESM(require("@tiptap/extension-document"));
@@ -10221,7 +9677,7 @@ var import_extension_subscript = __toESM(require("@tiptap/extension-subscript"))
 var import_extension_superscript = __toESM(require("@tiptap/extension-superscript"));
 var import_extension_text = __toESM(require("@tiptap/extension-text"));
 var import_extension_underline = __toESM(require("@tiptap/extension-underline"));
-var import_react73 = require("@tiptap/react");
+var import_react74 = require("@tiptap/react");
 
 // src/utils/inline-editing.ts
 var import_editor_props64 = require("@elementor/editor-props");
@@ -10270,8 +9726,8 @@ var InlineEditor = React125.forwardRef((props, ref) => {
     onSelectionEnd,
     mountElement = null
   } = props;
-  const containerRef = (0, import_react72.useRef)(null);
-  const onBlurRef = (0, import_react72.useRef)(onBlur);
+  const containerRef = (0, import_react73.useRef)(null);
+  const onBlurRef = (0, import_react73.useRef)(onBlur);
   onBlurRef.current = onBlur;
   const documentContentSettings = !!expectedTag ? "block+" : "inline*";
   const onUpdate = ({ editor: updatedEditor }) => {
@@ -10293,7 +9749,7 @@ var InlineEditor = React125.forwardRef((props, ref) => {
     ...HTMLAttributes,
     class: elementClasses
   });
-  const editor = (0, import_react73.useEditor)({
+  const editor = (0, import_react74.useEditor)({
     ...mountElement ? { element: mountElement } : {},
     extensions: [
       import_extension_document.default.extend({
@@ -10366,11 +9822,11 @@ var InlineEditor = React125.forwardRef((props, ref) => {
   if (mountElement) {
     return null;
   }
-  return /* @__PURE__ */ React125.createElement(import_ui109.Box, { ref: containerRef, sx, className: wrapperClassName }, /* @__PURE__ */ React125.createElement(import_react73.EditorContent, { ref, editor }));
+  return /* @__PURE__ */ React125.createElement(import_ui109.Box, { ref: containerRef, sx, className: wrapperClassName }, /* @__PURE__ */ React125.createElement(import_react74.EditorContent, { ref, editor }));
 });
 var useOnUpdate = (callback, dependencies) => {
-  const hasMounted = (0, import_react72.useRef)(false);
-  (0, import_react72.useEffect)(() => {
+  const hasMounted = (0, import_react73.useRef)(false);
+  (0, import_react73.useEffect)(() => {
     if (hasMounted.current) {
       callback();
     } else {
@@ -10381,16 +9837,16 @@ var useOnUpdate = (callback, dependencies) => {
 
 // src/components/inline-editor-toolbar.tsx
 var React127 = __toESM(require("react"));
-var import_react75 = require("react");
+var import_react76 = require("react");
 var import_editor_elements7 = require("@elementor/editor-elements");
 var import_icons42 = require("@elementor/icons");
 var import_ui111 = require("@elementor/ui");
-var import_react76 = require("@tiptap/react");
+var import_react77 = require("@tiptap/react");
 var import_i18n66 = require("@wordpress/i18n");
 
 // src/components/url-popover.tsx
 var React126 = __toESM(require("react"));
-var import_react74 = require("react");
+var import_react75 = require("react");
 var import_icons41 = require("@elementor/icons");
 var import_ui110 = require("@elementor/ui");
 var import_i18n65 = require("@wordpress/i18n");
@@ -10403,8 +9859,8 @@ var UrlPopover = ({
   openInNewTab,
   onToggleNewTab
 }) => {
-  const inputRef = (0, import_react74.useRef)(null);
-  (0, import_react74.useEffect)(() => {
+  const inputRef = (0, import_react75.useRef)(null);
+  (0, import_react75.useEffect)(() => {
     if (popupState.isOpen) {
       requestAnimationFrame(() => inputRef.current?.focus());
     }
@@ -10459,16 +9915,16 @@ var InlineEditorToolbar = ({
   sx = {},
   inControlPanel = false
 }) => {
-  const [urlValue, setUrlValue] = (0, import_react75.useState)("");
-  const [openInNewTab, setOpenInNewTab] = (0, import_react75.useState)(false);
-  const toolbarRef = (0, import_react75.useRef)(null);
+  const [urlValue, setUrlValue] = (0, import_react76.useState)("");
+  const [openInNewTab, setOpenInNewTab] = (0, import_react76.useState)(false);
+  const toolbarRef = (0, import_react76.useRef)(null);
   const linkPopupState = (0, import_ui111.usePopupState)({ variant: "popover" });
   const isElementClickable = elementId ? checkIfElementIsClickable(elementId) : false;
-  const editorState = (0, import_react76.useEditorState)({
+  const editorState = (0, import_react77.useEditorState)({
     editor,
     selector: (ctx) => possibleFormats.filter((format) => ctx.editor.isActive(format))
   });
-  const formatButtonsList = (0, import_react75.useMemo)(() => {
+  const formatButtonsList = (0, import_react76.useMemo)(() => {
     const buttons = Object.values(formatButtons);
     if (isElementClickable) {
       return buttons.filter((button) => button.action !== "link");
@@ -10505,7 +9961,7 @@ var InlineEditorToolbar = ({
     }
     linkPopupState.close();
   };
-  (0, import_react75.useEffect)(() => {
+  (0, import_react76.useEffect)(() => {
     if (!inControlPanel) {
       editor?.commands?.focus();
     }
@@ -10687,8 +10143,8 @@ var InlineEditingControl = createControl(
     const { setValue, placeholder, value } = useBoundProp(import_editor_props65.escapedHtmlPropTypeUtil);
     const { value: rawValue } = usePropKeyContext();
     const content = value ?? extractInlineHtmlContent(rawValue);
-    const [editor, setEditor] = (0, import_react77.useState)(null);
-    const handleChange = (0, import_react77.useCallback)(
+    const [editor, setEditor] = (0, import_react78.useState)(null);
+    const handleChange = (0, import_react78.useCallback)(
       (newValue) => {
         const html = newValue ?? "";
         setValue(html);
@@ -10875,7 +10331,7 @@ function useFormFieldSuggestions(options) {
 
 // src/controls/email-form-action-control/email-chips-field.tsx
 var React129 = __toESM(require("react"));
-var import_react78 = require("react");
+var import_react79 = require("react");
 var import_editor_props67 = require("@elementor/editor-props");
 var import_ui113 = require("@elementor/ui");
 
@@ -10913,10 +10369,10 @@ function resolveMention(raw, suggestions) {
 }
 var EmailChipsControl = createControl(({ placeholder, suggestions = [] }) => {
   const { value, setValue, disabled } = useBoundProp(import_editor_props67.stringArrayPropTypeUtil);
-  const [inputValue, setInputValue] = (0, import_react78.useState)("");
+  const [inputValue, setInputValue] = (0, import_react79.useState)("");
   const items2 = value || [];
   const selectedValues = items2.map((item) => import_editor_props67.stringPropTypeUtil.extract(item)).filter((val) => val !== null);
-  const suggestionOptions = (0, import_react78.useMemo)(
+  const suggestionOptions = (0, import_react79.useMemo)(
     () => suggestions.map((suggestion) => `[${suggestion.value}]`),
     [suggestions]
   );
@@ -11144,24 +10600,24 @@ var GridSpanControl = createControl(
 
 // src/components/promotions/display-conditions-control.tsx
 var React136 = __toESM(require("react"));
-var import_react80 = require("react");
+var import_react81 = require("react");
 var import_icons43 = require("@elementor/icons");
 var import_ui120 = require("@elementor/ui");
 var import_i18n70 = require("@wordpress/i18n");
 
 // src/components/promotions/promotion-trigger.tsx
 var React135 = __toESM(require("react"));
-var import_react79 = require("react");
+var import_react80 = require("react");
 var import_editor_ui19 = require("@elementor/editor-ui");
 var import_ui119 = require("@elementor/ui");
 function getV4Promotion(key) {
   return window.elementor?.config?.v4Promotions?.[key];
 }
-var PromotionTrigger = (0, import_react79.forwardRef)(
+var PromotionTrigger = (0, import_react80.forwardRef)(
   ({ promotionKey, children, trackingData }, ref) => {
-    const [isOpen, setIsOpen] = (0, import_react79.useState)(false);
+    const [isOpen, setIsOpen] = (0, import_react80.useState)(false);
     const promotion = getV4Promotion(promotionKey);
-    const toggle = (0, import_react79.useCallback)(() => {
+    const toggle = (0, import_react80.useCallback)(() => {
       setIsOpen((prev) => {
         if (!prev) {
           trackViewPromotion(trackingData);
@@ -11169,7 +10625,7 @@ var PromotionTrigger = (0, import_react79.forwardRef)(
         return !prev;
       });
     }, [trackingData]);
-    (0, import_react79.useImperativeHandle)(ref, () => ({ toggle }), [toggle]);
+    (0, import_react80.useImperativeHandle)(ref, () => ({ toggle }), [toggle]);
     return /* @__PURE__ */ React135.createElement(React135.Fragment, null, promotion && /* @__PURE__ */ React135.createElement(
       import_editor_ui19.PromotionInfotip,
       {
@@ -11203,7 +10659,7 @@ var PromotionTrigger = (0, import_react79.forwardRef)(
 var ARIA_LABEL = (0, import_i18n70.__)("Display Conditions", "elementor");
 var TRACKING_DATA = { target_name: "display_conditions", location_l2: "general" };
 var DisplayConditionsControl = createControl(() => {
-  const triggerRef = (0, import_react80.useRef)(null);
+  const triggerRef = (0, import_react81.useRef)(null);
   return /* @__PURE__ */ React136.createElement(
     import_ui120.Stack,
     {
@@ -11235,14 +10691,14 @@ var DisplayConditionsControl = createControl(() => {
 
 // src/components/promotions/attributes-control.tsx
 var React137 = __toESM(require("react"));
-var import_react81 = require("react");
+var import_react82 = require("react");
 var import_icons44 = require("@elementor/icons");
 var import_ui121 = require("@elementor/ui");
 var import_i18n71 = require("@wordpress/i18n");
 var ARIA_LABEL2 = (0, import_i18n71.__)("Attributes", "elementor");
 var TRACKING_DATA2 = { target_name: "attributes", location_l2: "general" };
 var AttributesControl = createControl(() => {
-  const triggerRef = (0, import_react81.useRef)(null);
+  const triggerRef = (0, import_react82.useRef)(null);
   return /* @__PURE__ */ React137.createElement(
     import_ui121.Stack,
     {
@@ -11279,7 +10735,7 @@ var ClearIconButton = ({ tooltipText, onClick, disabled, size = "tiny" }) => /*
 
 // src/components/repeater/repeater.tsx
 var React139 = __toESM(require("react"));
-var import_react82 = require("react");
+var import_react83 = require("react");
 var import_icons46 = require("@elementor/icons");
 var import_ui123 = require("@elementor/ui");
 var import_i18n72 = require("@wordpress/i18n");
@@ -11301,7 +10757,7 @@ var Repeater3 = ({
   isSortable = true,
   adornment = ControlAdornments
 }) => {
-  const [openItem, setOpenItem] = (0, import_react82.useState)(initialOpenItem);
+  const [openItem, setOpenItem] = (0, import_react83.useState)(initialOpenItem);
   const uniqueKeys = items2.map(
     (item, index) => isSortable && "getId" in itemSettings ? itemSettings.getId({ item, index }) : String(index)
   );
@@ -11477,10 +10933,10 @@ var RepeaterItem = ({
   ), /* @__PURE__ */ React139.createElement(RepeaterPopover, { width: ref?.getBoundingClientRect().width, ...popoverProps, anchorEl: ref }, /* @__PURE__ */ React139.createElement(import_ui123.Box, null, children({ anchorEl: ref }))));
 };
 var usePopover = (openOnMount, onOpen, onPopoverClose) => {
-  const [ref, setRef] = (0, import_react82.useState)(null);
+  const [ref, setRef] = (0, import_react83.useState)(null);
   const popoverState = (0, import_ui123.usePopupState)({ variant: "popover" });
   const popoverProps = (0, import_ui123.bindPopover)(popoverState);
-  (0, import_react82.useEffect)(() => {
+  (0, import_react83.useEffect)(() => {
     if (openOnMount && ref) {
       popoverState.open(ref);
       onOpen?.();
@@ -11543,7 +10999,7 @@ var differsFromExternal = (newState, externalState) => {
 
 // src/components/size/unit-select.tsx
 var React140 = __toESM(require("react"));
-var import_react83 = require("react");
+var import_react84 = require("react");
 var import_editor_ui20 = require("@elementor/editor-ui");
 var import_ui124 = require("@elementor/ui");
 var menuItemContentStyles2 = {
@@ -11554,7 +11010,7 @@ var menuItemContentStyles2 = {
 var UnitSelect = ({ value, showPrimaryColor, onClick, options }) => {
   const popupState = (0, import_ui124.usePopupState)({
     variant: "popover",
-    popupId: (0, import_react83.useId)()
+    popupId: (0, import_react84.useId)()
   });
   const handleMenuItemClick = (index) => {
     onClick(options[index]);
@@ -11590,8 +11046,8 @@ var StyledButton3 = (0, import_ui124.styled)(import_ui124.Button, {
 
 // src/components/size/unstable-size-input.tsx
 var React141 = __toESM(require("react"));
-var import_react84 = require("react");
-var UnstableSizeInput = (0, import_react84.forwardRef)(
+var import_react85 = require("react");
+var UnstableSizeInput = (0, import_react85.forwardRef)(
   ({ type, value, onChange, onKeyDown, onKeyUp, InputProps, onBlur, focused, disabled }, ref) => {
     return /* @__PURE__ */ React141.createElement(
       NumberInput,
@@ -11659,7 +11115,7 @@ var hasValue = (value) => {
 };
 
 // src/hooks/use-font-families.ts
-var import_react85 = require("react");
+var import_react86 = require("react");
 var import_editor_v1_adapters5 = require("@elementor/editor-v1-adapters");
 var getFontControlConfig = () => {
   const { controls } = (0, import_editor_v1_adapters5.getElementorConfig)();
@@ -11667,7 +11123,7 @@ var getFontControlConfig = () => {
 };
 var useFontFamilies = () => {
   const { groups, options } = getFontControlConfig();
-  return (0, import_react85.useMemo)(() => {
+  return (0, import_react86.useMemo)(() => {
     if (!groups || !options) {
       return [];
     }
@@ -11764,21 +11220,23 @@ var useFontFamilies = () => {
   createControl,
   createControlReplacementsRegistry,
   enqueueFont,
+  enqueueIconFonts,
   getControlReplacements,
   getFontAwesome7IconName,
   injectIntoRepeaterItemActions,
   injectIntoRepeaterItemIcon,
   injectIntoRepeaterItemLabel,
-  isDeletedCustomIconLibrary,
   isUnitExtendedOption,
   registerControlReplacement,
+  registerIconLibraryProvider,
   resetFontAwesome7IconsCache,
-  resolveCustomIconSvg,
   resolveFontAwesome7Icon,
+  resolveProviderIconSvg,
   trackUpgradePromotionClick,
   trackViewPromotion,
   transitionProperties,
   transitionsItemsList,
+  unregisterIconLibraryProvider,
   useBoundProp,
   useControlActions,
   useControlReplacement,