intlayer-editor 7.5.9 → 7.5.11

package/client/dist/assets/{index-BfDGXG1A.js → index-r91_MxC4.js}

@@ -12571,6 +12571,11 @@ const getAppLogger = (configuration2, globalDetails) => (content2, details) => l
     ...details?.config ?? {}
   }
 });
+const colorize = (s2, color2, reset) => color2 ? `${color2}${s2}${reset ? typeof reset === "boolean" ? ANSIColors.RESET : reset : ANSIColors.RESET}` : s2;
+const colorizeKey = (keyPath, color2 = ANSIColors.BEIGE, reset = ANSIColors.RESET) => [keyPath].flat().map((key2) => colorize(key2, color2, reset)).join(`, `);
+colorize("✗", ANSIColors.RED);
+colorize("✓", ANSIColors.GREEN);
+colorize("⏲", ANSIColors.BLUE);
 var __defProp$2 = Object.defineProperty;
 var __export$1 = (all, symbols) => {
   let target = {};
@@ -12666,9 +12671,9 @@ var editor_exports = /* @__PURE__ */ __export$1({
 });
 const APPLICATION_URL = "";
 const EDITOR_URL = "http://localhost:8000";
-const CMS_URL = "https://intlayer.org";
-const PORT = 8e3;
+const CMS_URL = "https://app.intlayer.org";
 const BACKEND_URL = "https://back.intlayer.org";
+const PORT = 8e3;
 const IS_ENABLED = true;
 const LIVE_SYNC = true;
 const DICTIONARY_PRIORITY_STRATEGY = "local_first";
@@ -13805,30 +13810,36 @@ const getEnumeration = (enumerationContent, quantity) => {
 const getInsertion = (content2, values) => content2.replace(/\{\{(.*?)\}\}/g, (_2, key2) => (values[key2] ?? "").toString());
 const internationalization = { "locales": ["en", "en-GB", "fr", "es", "de", "ja", "ko", "zh", "it", "pt", "hi", "ar", "ru"], "defaultLocale": "en" };
 const routing = { "mode": "prefix-no-default", "storage": ["cookie", "header"] };
-const editor$1 = { "applicationURL": "", "editorURL": "http://localhost:8000", "cmsURL": "https://intlayer.org", "backendURL": "https://back.intlayer.org", "port": 8e3, "enabled": true, "dictionaryPriorityStrategy": "local_first", "liveSync": true, "liveSyncPort": 4e3, "liveSyncURL": "http://localhost:4000" };
+const editor$1 = { "applicationURL": "", "editorURL": "http://localhost:8000", "cmsURL": "https://app.intlayer.org", "backendURL": "https://back.intlayer.org", "port": 8e3, "enabled": true, "dictionaryPriorityStrategy": "local_first", "liveSync": true, "liveSyncPort": 4e3, "liveSyncURL": "http://localhost:4000" };
 const log = { "mode": "default", "prefix": "\x1B[38;5;239m[intlayer] \x1B[0m" };
-const build = { "optimize": true };
 const configuration = {
   internationalization,
   routing,
   editor: editor$1,
-  log,
-  build
+  log
 };
 const dictionaries = {};
 const getDictionaries = () => dictionaries;
+const createSafeFallback = (path = "") => {
+  return new Proxy(() => path, {
+    get: (_target, prop) => {
+      if (prop === "toJSON" || prop === Symbol.toPrimitive || prop === "toString") return () => path;
+      if (prop === "then") return;
+      return createSafeFallback(path ? `${path}.${String(prop)}` : String(prop));
+    },
+    apply: () => {
+      return path;
+    }
+  });
+};
 const getIntlayer = (key2, locale, plugins) => {
-  const dictionaries2 = getDictionaries();
-  const dictionary = dictionaries2[key2];
+  const dictionary = getDictionaries()[key2];
   if (!dictionary) {
-    if (configuration.build.optimize === true || configuration.build.optimize === void 0 && false) {
-      getAppLogger(configuration)("Build optimization is enabled, the dictionary may have been purged. You can disable build optimization, or configure the traversePattern to include the current component.", {
-        level: "error",
-        isVerbose: true
-      });
-      throw new Error(`Dictionary ${key2} not found - Build optimization is enabled, the dictionary may have been purged. You can disable build optimization, or configure the 'traversePattern' to include the current component.`, dictionaries2);
-    }
-    throw new Error(`Dictionary ${key2} not found`, dictionaries2);
+    getAppLogger(configuration)(`Dictionary ${colorizeKey(key2)} was not found. Using fallback proxy.`, {
+      level: "warn",
+      isVerbose: true
+    });
+    return createSafeFallback(key2);
   }
   return getDictionary$1(dictionary, locale, plugins);
 };
@@ -20995,7 +21006,7 @@ const containerVariants$1 = cva("flex flex-col text-text backdrop-blur", {
     },
     transparency: {
       none: "bg-card",
-      sm: "bg-card/95",
+      sm: "bg-card/90",
       md: "bg-card/70",
       lg: "bg-card/40",
       xl: "bg-card/20",
@@ -21023,13 +21034,14 @@ const containerVariants$1 = cva("flex flex-col text-text backdrop-blur", {
       primary: "border-primary",
       secondary: "border-secondary",
       neutral: "border-neutral",
+      card: "border-card",
       text: "border-text",
       error: "border-error",
       warning: "border-warning",
       success: "border-success"
     },
     background: {
-      none: "bg-inherit",
+      none: "",
       hoverable: "bg-opacity-5! backdrop-blur-0 hover:bg-opacity-10! hover:backdrop-blur focus:bg-opacity-10! focus:backdrop-blur aria-selected:bg-opacity-15! aria-selected:backdrop-blur",
       with: ""
     },
@@ -21050,7 +21062,11 @@ const containerVariants$1 = cva("flex flex-col text-text backdrop-blur", {
     padding: "none",
     separator: "without",
     gap: "none"
-  }
+  },
+  compoundVariants: [{
+    background: "none",
+    class: "bg-transparent"
+  }]
 });
 let ContainerRoundedSize = /* @__PURE__ */ (function(ContainerRoundedSize$1) {
   ContainerRoundedSize$1["NONE"] = "none";
@@ -21352,7 +21368,7 @@ const Button = ({ variant, size: size2, color: color2, children, Icon: Icon2, Ic
         "aria-hidden": "true"
       }),
       /* @__PURE__ */ jsxRuntimeExports.jsx("div", {
-        className: cn$2("flex w-0 items-center justify-center transition-[width] duration-300", isLoading && size2 === ButtonSize.SM && "w-3", isLoading && size2 === ButtonSize.MD && "w-4", isLoading && size2 === ButtonSize.LG && "w-5", isLoading && size2 === ButtonSize.XL && "w-6"),
+        className: cn$2("flex items-center justify-center transition-[width] duration-300", isLoading && size2 === ButtonSize.SM && "w-3", isLoading && size2 === ButtonSize.MD && "w-4", isLoading && size2 === ButtonSize.LG && "w-5", isLoading && size2 === ButtonSize.XL && "w-6"),
         children: /* @__PURE__ */ jsxRuntimeExports.jsx(Loader, {
           className: buttonIconVariants({
             size: size2,
@@ -21905,6 +21921,16 @@ const linkVariants = cva("gap-3 transition-all duration-300 focus-visible:outlin
     }
   },
   compoundVariants: [
+    {
+      variant: LinkVariant.BUTTON,
+      color: LinkColor.TEXT_INVERSE,
+      class: "*:text-text"
+    },
+    {
+      variant: LinkVariant.BUTTON_OUTLINED,
+      color: LinkColor.TEXT_INVERSE,
+      class: "text-text-opposite *:text-text-opposite"
+    },
     {
       variant: [LinkVariant.BUTTON, LinkVariant.BUTTON_OUTLINED],
       size: LinkSize.SM,
@@ -22864,6 +22890,326 @@ const SearchInput = ({ className, ...props }) => /* @__PURE__ */ jsxRuntimeExpor
     className: cn$2("pl-8", className)
   })]
 });
+const getBreakpointFromSize = (breakpoint) => {
+  switch (breakpoint) {
+    case "xs":
+      return 480;
+    case "sm":
+      return 640;
+    case "md":
+      return 768;
+    case "lg":
+      return 1024;
+    case "xl":
+      return 1280;
+    case "2xl":
+      return 1536;
+    default:
+      return breakpoint;
+  }
+};
+const checkIsMobileUserAgent = () => {
+  if (typeof window === "undefined") return;
+  const userAgent = window.navigator?.userAgent;
+  if (typeof userAgent === "undefined") return;
+  return /android|bb\d+|meego|avantgo|bada\/|blackberry|blazer|compal|elaine|fennec|hiptop|iemobile|ip(?:hone|od|ad)|iris|kindle|lge |maemo|midp|mmp|mobile.+firefox|netfront|opera m(?:ob|in)i|palm(?: os)?|phone|p(?:ixi|re)\/|plucker|pocket|psp|series(?:4|6)0|symbian|treo|up\.(?:browser|link)|vodafone|wap|windows ce|windows phone|xda|xiino|zte-/i.test(userAgent);
+};
+const checkIsIOS = () => {
+  if (typeof window === "undefined") return;
+  const userAgent = window.navigator?.userAgent;
+  if (typeof userAgent === "undefined") return;
+  return /iP(?:hone|ad|od)/.test(userAgent);
+};
+const checkIsMac = () => {
+  if (typeof window === "undefined") return;
+  const userAgent = window.navigator?.userAgent;
+  if (typeof userAgent === "undefined") return;
+  return /Macintosh|MacIntel|Mac OS X/.test(userAgent);
+};
+const checkIsMobileScreen = (breakpoint) => {
+  if (typeof window === "undefined") return;
+  return (window?.innerWidth ?? 0) <= breakpoint;
+};
+const calculateIsMobile = (breakpoint = "md") => {
+  const breakpointValue = getBreakpointFromSize(breakpoint);
+  const isMobileUserAgent = checkIsMobileUserAgent();
+  const isMobileScreen = checkIsMobileScreen(breakpointValue);
+  return {
+    isMobileScreen,
+    isMobileUserAgent,
+    isMobile: isMobileScreen ?? isMobileUserAgent,
+    isIOS: checkIsIOS(),
+    isMac: checkIsMac()
+  };
+};
+const useDevice = (breakpoint = "md") => {
+  const [result, setResult] = reactExports.useState(calculateIsMobile(breakpoint));
+  reactExports.useEffect(() => {
+    const handleResize = () => {
+      setResult(calculateIsMobile(breakpoint));
+    };
+    window.addEventListener("resize", handleResize, { passive: true });
+    return () => window.removeEventListener("resize", handleResize);
+  }, [breakpoint]);
+  return result;
+};
+const parseShortcut = (shortcut) => {
+  return shortcut.split(" + ").map((key2) => key2.trim());
+};
+const normalizeKey = (key2) => {
+  return {
+    "⌘": "Meta",
+    Ctrl: "Control",
+    Control: "Control",
+    Alt: "Alt",
+    "⌥": "Alt",
+    Shift: "Shift",
+    Meta: "Meta",
+    "↑": "ArrowUp",
+    "↓": "ArrowDown",
+    "←": "ArrowLeft",
+    "→": "ArrowRight",
+    ArrowUp: "ArrowUp",
+    ArrowDown: "ArrowDown",
+    ArrowLeft: "ArrowLeft",
+    ArrowRight: "ArrowRight"
+  }[key2] || key2;
+};
+const matchesShortcut = (event, keys) => {
+  const normalizedKeys = keys.map(normalizeKey);
+  const hasModifiers = {
+    Meta: normalizedKeys.includes("Meta"),
+    Control: normalizedKeys.includes("Control"),
+    Alt: normalizedKeys.includes("Alt"),
+    Shift: normalizedKeys.includes("Shift")
+  };
+  if (hasModifiers.Meta !== event.metaKey || hasModifiers.Control !== event.ctrlKey || hasModifiers.Alt !== event.altKey || hasModifiers.Shift !== event.shiftKey) return false;
+  const nonModifierKey = keys.find((key2) => ![
+    "⌘",
+    "Ctrl",
+    "Control",
+    "Alt",
+    "⌥",
+    "Shift",
+    "Meta"
+  ].includes(normalizeKey(key2)));
+  if (!nonModifierKey) return false;
+  const normalizedNonModifierKey = normalizeKey(nonModifierKey);
+  if (normalizedNonModifierKey.startsWith("Arrow")) return event.key === normalizedNonModifierKey;
+  return event.key.toLowerCase() === normalizedNonModifierKey.toLowerCase();
+};
+const getDisplayKey = (key2) => {
+  return {
+    ArrowUp: "↑",
+    ArrowDown: "↓",
+    ArrowLeft: "←",
+    ArrowRight: "→"
+  }[key2] || key2;
+};
+const getDisplayShortcut = (shortcut, isMac) => {
+  let result = shortcut;
+  if (isMac) {
+    result = result.replace(/Ctrl/g, "⌘");
+    result = result.replace(/Alt/g, "⌥");
+  } else {
+    result = result.replace(/⌘/g, "Ctrl");
+    result = result.replace(/⌥/g, "Alt");
+  }
+  result = result.replace(/ArrowUp/g, "↑");
+  result = result.replace(/ArrowDown/g, "↓");
+  result = result.replace(/ArrowLeft/g, "←");
+  result = result.replace(/ArrowRight/g, "→");
+  return result;
+};
+const KeyboardShortcut = ({ shortcut, onTriggered, display = true, disabled = false, className, size: size2 = "md" }) => {
+  const { isMac } = useDevice();
+  const keys = parseShortcut(getDisplayShortcut(shortcut, isMac ?? false));
+  const [pressedKeys, setPressedKeys] = reactExports.useState(/* @__PURE__ */ new Set());
+  reactExports.useEffect(() => {
+    const handleKeyDown = (event) => {
+      const target = event.target;
+      const isInputField = target.tagName === "INPUT" || target.tagName === "TEXTAREA" || target.isContentEditable;
+      const currentKey = event.key;
+      const normalizedEventKeys = /* @__PURE__ */ new Set();
+      if (event.metaKey) normalizedEventKeys.add("⌘");
+      if (event.ctrlKey) normalizedEventKeys.add("Ctrl");
+      if (event.altKey) normalizedEventKeys.add(isMac ? "⌥" : "Alt");
+      if (event.shiftKey) normalizedEventKeys.add("Shift");
+      if (currentKey.startsWith("Arrow")) {
+        normalizedEventKeys.add(currentKey);
+        normalizedEventKeys.add(getDisplayKey(currentKey));
+      } else normalizedEventKeys.add(currentKey.toUpperCase());
+      setPressedKeys(normalizedEventKeys);
+      if (!disabled && onTriggered && matchesShortcut(event, keys)) {
+        const isEscapeShortcut = keys.includes("Escape");
+        if (isInputField && !isEscapeShortcut) return;
+        event.preventDefault();
+        onTriggered();
+      }
+    };
+    const handleKeyUp = () => {
+      setPressedKeys(/* @__PURE__ */ new Set());
+    };
+    window.addEventListener("keydown", handleKeyDown);
+    window.addEventListener("keyup", handleKeyUp);
+    window.addEventListener("blur", handleKeyUp);
+    return () => {
+      window.removeEventListener("keydown", handleKeyDown);
+      window.removeEventListener("keyup", handleKeyUp);
+      window.removeEventListener("blur", handleKeyUp);
+    };
+  }, [
+    keys,
+    onTriggered,
+    isMac,
+    disabled
+  ]);
+  if (!display) return null;
+  const isKeyPressed = (key2) => {
+    const upperKey = key2.toUpperCase();
+    const normalizedKey = normalizeKey(key2);
+    return pressedKeys.has(key2) || pressedKeys.has(upperKey) || pressedKeys.has(normalizedKey) || key2 === "⌘" && pressedKeys.has("Meta") || key2 === "Ctrl" && pressedKeys.has("Control") || key2 === "⌥" && pressedKeys.has("Alt") || key2 === "Alt" && pressedKeys.has("Alt") || key2 === "←" && pressedKeys.has("ArrowLeft") || key2 === "→" && pressedKeys.has("ArrowRight") || key2 === "↑" && pressedKeys.has("ArrowUp") || key2 === "↓" && pressedKeys.has("ArrowDown");
+  };
+  return /* @__PURE__ */ jsxRuntimeExports.jsx("kbd", {
+    className: cn$2("inline-flex items-center justify-center gap-0.5 p-0.5", "rounded-lg [corner-shape:squircle] supports-[corner-shape:squircle]:rounded-xl", "font-medium font-sans", "border-1 border-neutral/20 text-neutral", size2 === "sm" && "text-xs", size2 === "md" && "text-sm", size2 === "lg" && "text-base", className),
+    children: keys.map((key2, index2) => {
+      const keyId = `${key2}-${index2}-${shortcut}`;
+      const displayKey = getDisplayKey(key2);
+      return /* @__PURE__ */ jsxRuntimeExports.jsxs("span", {
+        className: "inline-flex items-center",
+        children: [index2 > 0 && /* @__PURE__ */ jsxRuntimeExports.jsx("span", {
+          className: "text-neutral/50",
+          children: "+"
+        }), /* @__PURE__ */ jsxRuntimeExports.jsx("span", {
+          className: cn$2("min-w-4 px-0.5", isKeyPressed(key2) && "scale-120 font-bold text-text"),
+          suppressHydrationWarning: true,
+          children: displayKey
+        })]
+      }, keyId);
+    })
+  });
+};
+let PopoverXAlign = /* @__PURE__ */ (function(PopoverXAlign$1) {
+  PopoverXAlign$1["START"] = "start";
+  PopoverXAlign$1["END"] = "end";
+  return PopoverXAlign$1;
+})({});
+let PopoverYAlign = /* @__PURE__ */ (function(PopoverYAlign$1) {
+  PopoverYAlign$1["BELOW"] = "bellow";
+  PopoverYAlign$1["ABOVE"] = "above";
+  return PopoverYAlign$1;
+})({});
+const PopoverStatic = ({ children, className, identifier, ...props }) => /* @__PURE__ */ jsxRuntimeExports.jsx("div", {
+  className: cn$2("group/popover relative flex cursor-pointer", className),
+  id: `unrollable-panel-button-${identifier}`,
+  "aria-haspopup": true,
+  ...props,
+  children
+});
+const Detail$1 = ({ children, isHidden: isHidden2 = void 0, isOverable = true, isFocusable = false, xAlign = PopoverXAlign.START, yAlign = PopoverYAlign.BELOW, identifier, className, displayArrow = true, ...props }) => /* @__PURE__ */ jsxRuntimeExports.jsx(Container, {
+  transparency: "sm",
+  role: "group",
+  "aria-hidden": isHidden2,
+  "aria-labelledby": `unrollable-panel-button-${identifier}`,
+  id: `unrollable-panel-${identifier}`,
+  className: cn$2("absolute z-50 min-w-full rounded-md ring-1 ring-neutral", xAlign === "start" && "left-0", xAlign === "end" && "right-0", yAlign === "bellow" && "top-[calc(100%+1rem)]", yAlign === "above" && "bottom-[calc(100%+1rem)]", displayArrow && 'before:absolute before:z-[999] before:h-0 before:w-0 before:content-[""]', displayArrow && xAlign === "start" && "before:left-2", displayArrow && xAlign === "end" && "before:right-2", displayArrow && yAlign === "bellow" && "before:-top-[10px] before:border-r-[10px] before:border-r-transparent before:border-b-[10px] before:border-b-neutral before:border-l-[10px] before:border-l-transparent", displayArrow && yAlign === "above" && "before:-bottom-[10px] before:border-t-[10px] before:border-t-neutral before:border-r-[10px] before:border-r-transparent before:border-l-[10px] before:border-l-transparent", "overflow-x-visible opacity-0 transition-all duration-400 ease-in-out", isHidden2 !== false ? "invisible" : "visible opacity-100 delay-800", isOverable && "group-hover/popover:visible group-hover/popover:opacity-100 group-hover/popover:delay-800", isFocusable && "group-focus-within/popover:visible group-focus-within/popover:opacity-100 group-focus-within/popover:delay-800", className),
+  ...props,
+  children
+});
+PopoverStatic.Detail = Detail$1;
+const PopoverComponent = (props) => {
+  return /* @__PURE__ */ jsxRuntimeExports.jsx(PopoverStatic, { ...props });
+};
+const Detail = ({ xAlign = PopoverXAlign.START, yAlign = PopoverYAlign.BELOW, ...props }) => {
+  const popoverRef = reactExports.useRef(null);
+  const [computedXAlign, setComputedXAlign] = reactExports.useState(xAlign);
+  const [computedYAlign, setComputedYAlign] = reactExports.useState(yAlign);
+  const [maxWidth, setMaxWidth] = reactExports.useState(void 0);
+  reactExports.useEffect(() => {
+    const adjustPosition = () => {
+      if (!popoverRef.current) return;
+      const popoverElement = popoverRef.current;
+      const triggerElement$1 = document.getElementById(`unrollable-panel-button-${props.identifier}`);
+      if (!triggerElement$1) return;
+      const triggerRect = triggerElement$1.getBoundingClientRect();
+      const viewportWidth = window.innerWidth;
+      const viewportHeight = window.innerHeight;
+      const gap = 16;
+      const padding = 16;
+      const maxWidthFromLeft = viewportWidth - triggerRect.left - padding;
+      const maxWidthFromRight = triggerRect.right - padding;
+      setMaxWidth(Math.max(maxWidthFromLeft, maxWidthFromRight));
+      const wasInvisible = popoverElement.classList.contains("invisible");
+      if (wasInvisible) {
+        popoverElement.style.visibility = "hidden";
+        popoverElement.classList.remove("invisible");
+      }
+      requestAnimationFrame(() => {
+        const popoverRect = popoverElement.getBoundingClientRect();
+        if (wasInvisible) {
+          popoverElement.style.visibility = "";
+          popoverElement.classList.add("invisible");
+        }
+        let newYAlign = yAlign;
+        const spaceBelow = viewportHeight - triggerRect.bottom - gap;
+        const spaceAbove = triggerRect.top - gap;
+        if (yAlign === PopoverYAlign.BELOW && spaceBelow < popoverRect.height) {
+          if (spaceAbove >= popoverRect.height) newYAlign = PopoverYAlign.ABOVE;
+        } else if (yAlign === PopoverYAlign.ABOVE && spaceAbove < popoverRect.height) {
+          if (spaceBelow >= popoverRect.height) newYAlign = PopoverYAlign.BELOW;
+        }
+        let newXAlign = xAlign;
+        const spaceRight = viewportWidth - triggerRect.left - padding;
+        const spaceLeft = triggerRect.right - padding;
+        if (xAlign === PopoverXAlign.START && spaceRight < popoverRect.width) {
+          if (spaceLeft >= popoverRect.width) newXAlign = PopoverXAlign.END;
+        } else if (xAlign === PopoverXAlign.END && spaceLeft < popoverRect.width) {
+          if (spaceRight >= popoverRect.width) newXAlign = PopoverXAlign.START;
+        }
+        setComputedYAlign(newYAlign);
+        setComputedXAlign(newXAlign);
+      });
+    };
+    const timeoutId = setTimeout(adjustPosition, 0);
+    const triggerElement = document.getElementById(`unrollable-panel-button-${props.identifier}`);
+    if (triggerElement) {
+      triggerElement.addEventListener("mouseenter", adjustPosition);
+      triggerElement.addEventListener("focusin", adjustPosition);
+    }
+    const resizeObserver = new ResizeObserver(() => {
+      adjustPosition();
+    });
+    if (popoverRef.current) resizeObserver.observe(popoverRef.current);
+    window.addEventListener("resize", adjustPosition);
+    window.addEventListener("scroll", adjustPosition, true);
+    return () => {
+      clearTimeout(timeoutId);
+      if (triggerElement) {
+        triggerElement.removeEventListener("mouseenter", adjustPosition);
+        triggerElement.removeEventListener("focusin", adjustPosition);
+      }
+      resizeObserver.disconnect();
+      window.removeEventListener("resize", adjustPosition);
+      window.removeEventListener("scroll", adjustPosition, true);
+    };
+  }, [
+    props.identifier,
+    xAlign,
+    yAlign
+  ]);
+  return /* @__PURE__ */ jsxRuntimeExports.jsx(Detail$1, {
+    ...props,
+    xAlign: computedXAlign,
+    yAlign: computedYAlign,
+    ref: popoverRef,
+    style: {
+      ...props.style,
+      maxWidth: maxWidth ? `${maxWidth}px` : void 0
+    }
+  });
+};
+const Popover = PopoverComponent;
+Popover.Detail = Detail;
 function composeEventHandlers(originalEventHandler, ourEventHandler, { checkForDefaultPrevented = true } = {}) {
   return function handleEvent(event) {
     originalEventHandler?.(event);
@@ -28240,6 +28586,43 @@ const getEditorAPI = (authAPIOptions = {}, intlayerConfig) => {
     writeDictionary
   };
 };
+const getGithubAPI = (authAPIOptions = {}, intlayerConfig) => {
+  const backendURL = intlayerConfig?.editor?.backendURL ?? configuration?.editor?.backendURL;
+  if (!backendURL) throw new Error("Backend URL is not defined in the Intlayer configuration.");
+  const GITHUB_API_ROUTE = `${backendURL}/api/github`;
+  const getAuthUrl = async (redirectUri, otherOptions = {}) => await fetcher(`${GITHUB_API_ROUTE}/auth-url`, authAPIOptions, otherOptions, { params: { redirectUri } });
+  const authenticate = async (code, otherOptions = {}) => await fetcher(`${GITHUB_API_ROUTE}/auth`, authAPIOptions, otherOptions, {
+    method: "POST",
+    body: { code }
+  });
+  const getRepositories = async (token, otherOptions = {}) => await fetcher(`${GITHUB_API_ROUTE}/repos`, authAPIOptions, otherOptions, { params: token ? { token } : void 0 });
+  const checkIntlayerConfig = async (token, owner, repository, branch = "main", otherOptions = {}) => await fetcher(`${GITHUB_API_ROUTE}/check-config`, authAPIOptions, otherOptions, {
+    method: "POST",
+    body: {
+      token: token ?? void 0,
+      owner,
+      repository,
+      branch
+    }
+  });
+  const getConfigFile = async (token, owner, repository, branch = "main", path = "intlayer.config.ts", otherOptions = {}) => await fetcher(`${GITHUB_API_ROUTE}/get-config-file`, authAPIOptions, otherOptions, {
+    method: "POST",
+    body: {
+      token: token ?? void 0,
+      owner,
+      repository,
+      branch,
+      path
+    }
+  });
+  return {
+    getAuthUrl,
+    authenticate,
+    getRepositories,
+    checkIntlayerConfig,
+    getConfigFile
+  };
+};
 const getOAuthAPI = (intlayerConfig) => {
   const backendURL = intlayerConfig?.editor?.backendURL ?? configuration?.editor?.backendURL;
   const { clientId, clientSecret } = intlayerConfig?.editor ?? {};
@@ -28339,6 +28722,13 @@ const getProjectAPI = (authAPIOptions = {}, intlayerConfig) => {
     method: "PATCH",
     body: { clientId }
   });
+  const triggerBuild = async (otherOptions = {}) => await fetcher(`${PROJECT_API_ROUTE}/build`, authAPIOptions, otherOptions, { method: "POST" });
+  const triggerWebhook = async (webhookIndex, otherOptions = {}) => await fetcher(`${PROJECT_API_ROUTE}/webhook`, authAPIOptions, otherOptions, {
+    method: "POST",
+    body: { webhookIndex }
+  });
+  const getCIConfig = async (otherOptions = {}) => await fetcher(`${PROJECT_API_ROUTE}/ci`, authAPIOptions, otherOptions, { method: "GET" });
+  const pushCIConfig = async (otherOptions = {}) => await fetcher(`${PROJECT_API_ROUTE}/ci`, authAPIOptions, otherOptions, { method: "POST" });
   return {
     getProjects,
     addProject,
@@ -28350,7 +28740,11 @@ const getProjectAPI = (authAPIOptions = {}, intlayerConfig) => {
     unselectProject,
     addNewAccessKey,
     deleteAccessKey,
-    refreshAccessKey
+    refreshAccessKey,
+    triggerBuild,
+    triggerWebhook,
+    getCIConfig,
+    pushCIConfig
   };
 };
 const getStripeAPI = (authAPIOptions = {}, intlayerConfig) => {
@@ -28428,6 +28822,90 @@ const getUserAPI = (authAPIOptions = {}, intlayerConfig) => {
     getVerifyEmailStatusURL
   };
 };
+const getBitbucketAPI = (authAPIOptions = {}, intlayerConfig) => {
+  const backendURL = intlayerConfig?.editor?.backendURL ?? configuration?.editor?.backendURL;
+  if (!backendURL) throw new Error("Backend URL is not defined in the Intlayer configuration.");
+  const BITBUCKET_API_ROUTE = `${backendURL}/api/bitbucket`;
+  const getAuthUrl = async (redirectUri, otherOptions = {}) => await fetcher(`${BITBUCKET_API_ROUTE}/auth-url`, authAPIOptions, otherOptions, { params: { redirectUri } });
+  const authenticate = async (code, otherOptions = {}) => await fetcher(`${BITBUCKET_API_ROUTE}/auth`, authAPIOptions, otherOptions, {
+    method: "POST",
+    body: { code }
+  });
+  const getRepositories = async (token, otherOptions = {}) => await fetcher(`${BITBUCKET_API_ROUTE}/repos`, authAPIOptions, otherOptions, { params: token ? { token } : void 0 });
+  const checkIntlayerConfig = async (token, workspace, repoSlug, branch = "main", otherOptions = {}) => await fetcher(`${BITBUCKET_API_ROUTE}/check-config`, authAPIOptions, otherOptions, {
+    method: "POST",
+    body: {
+      token: token ?? void 0,
+      workspace,
+      repoSlug,
+      branch
+    }
+  });
+  const getConfigFile = async (token, workspace, repoSlug, branch = "main", path = "intlayer.config.ts", otherOptions = {}) => await fetcher(`${BITBUCKET_API_ROUTE}/get-config-file`, authAPIOptions, otherOptions, {
+    method: "POST",
+    body: {
+      token: token ?? void 0,
+      workspace,
+      repoSlug,
+      branch,
+      path
+    }
+  });
+  return {
+    getAuthUrl,
+    authenticate,
+    getRepositories,
+    checkIntlayerConfig,
+    getConfigFile
+  };
+};
+const getGitlabAPI = (authAPIOptions = {}, intlayerConfig) => {
+  const backendURL = intlayerConfig?.editor?.backendURL ?? configuration?.editor?.backendURL;
+  if (!backendURL) throw new Error("Backend URL is not defined in the Intlayer configuration.");
+  const GITLAB_API_ROUTE = `${backendURL}/api/gitlab`;
+  const getAuthUrl = async (redirectUri, instanceUrl, otherOptions = {}) => await fetcher(`${GITLAB_API_ROUTE}/auth-url`, authAPIOptions, otherOptions, { params: {
+    redirectUri,
+    ...instanceUrl && { instanceUrl }
+  } });
+  const authenticate = async (code, redirectUri, instanceUrl, otherOptions = {}) => await fetcher(`${GITLAB_API_ROUTE}/auth`, authAPIOptions, otherOptions, {
+    method: "POST",
+    body: {
+      code,
+      redirectUri,
+      instanceUrl
+    }
+  });
+  const getProjects = async (token, instanceUrl, otherOptions = {}) => await fetcher(`${GITLAB_API_ROUTE}/projects`, authAPIOptions, otherOptions, { params: {
+    ...token && { token },
+    ...instanceUrl && { instanceUrl }
+  } });
+  const checkIntlayerConfig = async (token, projectId, branch = "main", instanceUrl, otherOptions = {}) => await fetcher(`${GITLAB_API_ROUTE}/check-config`, authAPIOptions, otherOptions, {
+    method: "POST",
+    body: {
+      token: token ?? void 0,
+      projectId,
+      branch,
+      ...instanceUrl && { instanceUrl }
+    }
+  });
+  const getConfigFile = async (token, projectId, branch = "main", path = "intlayer.config.ts", instanceUrl, otherOptions = {}) => await fetcher(`${GITLAB_API_ROUTE}/get-config-file`, authAPIOptions, otherOptions, {
+    method: "POST",
+    body: {
+      token: token ?? void 0,
+      projectId,
+      branch,
+      path,
+      ...instanceUrl && { instanceUrl }
+    }
+  });
+  return {
+    getAuthUrl,
+    authenticate,
+    getProjects,
+    checkIntlayerConfig,
+    getConfigFile
+  };
+};
 const getNewsletterAPI = (authAPIOptions = {}, intlayerConfig) => {
   const backendURL = intlayerConfig?.editor?.backendURL ?? configuration?.editor?.backendURL;
   if (!backendURL) throw new Error("Backend URL is not defined in the Intlayer configuration.");
@@ -28469,6 +28947,9 @@ const getIntlayerAPI = (authAPIOptions = {}, intlayerConfig) => ({
   search: getSearchAPI(authAPIOptions, intlayerConfig),
   editor: getEditorAPI(authAPIOptions, intlayerConfig),
   newsletter: getNewsletterAPI(authAPIOptions, intlayerConfig),
+  github: getGithubAPI(authAPIOptions, intlayerConfig),
+  gitlab: getGitlabAPI(authAPIOptions, intlayerConfig),
+  bitbucket: getBitbucketAPI(authAPIOptions, intlayerConfig),
   audit: getAuditAPI(authAPIOptions, intlayerConfig)
 });
 const useOAuth2 = (intlayerConfiguration) => {
@@ -29226,10 +29707,15 @@ function createSessionRefreshManager(opts) {
     if (event?.event === "poll") {
       state.lastSessionRequest = now$1();
       $fetch("/get-session").then((res) => {
-        sessionAtom.set({
+        if (res.error) sessionAtom.set({
+          ...currentSession,
+          data: null,
+          error: res.error
+        });
+        else sessionAtom.set({
           ...currentSession,
           data: res.data,
-          error: res.error || null
+          error: null
         });
         state.lastSync = now$1();
         sessionSignal.set(!sessionSignal.get());
@@ -29238,10 +29724,10 @@ function createSessionRefreshManager(opts) {
       return;
     }
     if (event?.event === "visibilitychange") {
-      if (now$1() - state.lastSessionRequest < FOCUS_REFETCH_RATE_LIMIT_SECONDS && currentSession?.data !== null && currentSession?.data !== void 0) return;
+      if (now$1() - state.lastSessionRequest < FOCUS_REFETCH_RATE_LIMIT_SECONDS) return;
+      state.lastSessionRequest = now$1();
     }
     if (currentSession?.data === null || currentSession?.data === void 0 || event?.event === "visibilitychange") {
-      if (event?.event === "visibilitychange") state.lastSessionRequest = now$1();
       state.lastSync = now$1();
       sessionSignal.set(!sessionSignal.get());
     }
@@ -30345,9 +30831,12 @@ function createDynamicPathProxy(routes, client2, knownPathMethods, atoms, atomLi
             if (!atomListeners || options.disableSignal) return;
             const matches = atomListeners.filter((s2) => s2.matcher(routePath));
             if (!matches.length) return;
+            const visited = /* @__PURE__ */ new Set();
             for (const match of matches) {
               const signal = atoms[match.signal];
               if (!signal) return;
+              if (visited.has(match.signal)) continue;
+              visited.add(match.signal);
               const val = signal.get();
               setTimeout(() => {
                 signal.set(!val);
@@ -30723,9 +31212,9 @@ function useSession(sessionProp, intlayerConfiguration) {
     queryFn: async () => {
       return (await getAuthAPI(config2).getSession()).data;
     },
-    staleTime: 0,
+    staleTime: 60 * 1e3,
     gcTime: 300 * 1e3,
-    refetchOnMount: "always",
+    refetchOnMount: true,
     refetchOnWindowFocus: false,
     refetchOnReconnect: false,
     enabled: !sessionProp
@@ -30824,7 +31313,7 @@ const useDeleteDictionary = () => {
   const intlayerOAuth = useIntlayerOAuth();
   return useMutation({
     mutationKey: ["dictionaries"],
-    mutationFn: (args) => intlayerOAuth.dictionary.deleteDictionary(args),
+    mutationFn: (args) => intlayerOAuth.dictionary.deleteDictionary(args.dictionaryId),
     meta: { invalidateQueries: [["dictionaries"], ["dictionariesKeys"]] }
   });
 };
@@ -33370,7 +33859,7 @@ const CodeDefault = ({ children }) => /* @__PURE__ */ jsxRuntimeExports.jsx("div
     }, `line-${index2}-${line.slice(0, 10)}`)) })
   })
 });
-const CodeBlockShiki = reactExports.lazy(() => __vitePreload(() => import("./CodeBlockShiki-DOHz3hxi.js"), true ? [] : void 0).then((mod) => ({ default: mod.CodeBlockShiki })));
+const CodeBlockShiki = reactExports.lazy(() => __vitePreload(() => import("./CodeBlockShiki-EiAndB3z.js"), true ? [] : void 0).then((mod) => ({ default: mod.CodeBlockShiki })));
 const CodeBlock = ({ className, onChange, isEditable, children, lang, isDarkMode, ...props }) => /* @__PURE__ */ jsxRuntimeExports.jsx("div", {
   className: cn$2("flex w-full min-w-0 max-w-full overflow-x-auto", className),
   ...props,
@@ -37049,7 +37538,7 @@ const SelectScrollDownButton = ({ className, ...props }) => /* @__PURE__ */ jsxR
   children: /* @__PURE__ */ jsxRuntimeExports.jsx(ChevronDown, {})
 });
 const SelectContent = ({ className, children, position = SelectContentPosition.POPPER, ...props }) => /* @__PURE__ */ jsxRuntimeExports.jsx(Portal, { children: /* @__PURE__ */ jsxRuntimeExports.jsxs(Content2, {
-  className: cn$2("relative z-50 max-h-96 min-w-32 overflow-hidden", "rounded-xl shadow-md", "bg-white dark:bg-neutral-950", "text-text", "border border-neutral-200 dark:border-neutral-800", "data-[state=closed]:animate-out data-[state=open]:animate-in", "data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0", "data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95", "data-[side=bottom]:slide-in-from-top-2", "data-[side=left]:slide-in-from-right-2", "data-[side=right]:slide-in-from-left-2", "data-[side=top]:slide-in-from-bottom-2", position === "popper" && "data-[side=left]:-translate-x-1 data-[side=top]:-translate-y-1 data-[side=right]:translate-x-1 data-[side=bottom]:translate-y-1", className),
+  className: cn$2("relative z-50 max-h-96 min-w-32 overflow-hidden", "rounded-xl shadow-md", "bg-white dark:bg-neutral-950", "text-text", "border border-neutral-200 dark:border-neutral-800", "data-[state=closed]:animate-out data-[state=open]:animate-in", "data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0", "data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95", "data-[side=bottom]:slide-in-from-top-2", "data-[side=left]:slide-in-from-right-2", "data-[side=right]:slide-in-from-left-2", "data-[side=top]:slide-in-from-bottom-2", position === "popper" && "data-[side=left]:-translate-x-1 data-[side=right]:translate-x-1 data-[side=bottom]:translate-y-1 data-[side=top]:-translate-y-1", className),
   position,
   ...props,
   children: [
@@ -37087,127 +37576,6 @@ Select.Content = SelectContent;
 Select.Label = SelectLabel;
 Select.Item = SelectItem;
 Select.Separator = SelectSeparator;
-let PopoverXAlign = /* @__PURE__ */ (function(PopoverXAlign$1) {
-  PopoverXAlign$1["START"] = "start";
-  PopoverXAlign$1["END"] = "end";
-  return PopoverXAlign$1;
-})({});
-let PopoverYAlign = /* @__PURE__ */ (function(PopoverYAlign$1) {
-  PopoverYAlign$1["BELOW"] = "bellow";
-  PopoverYAlign$1["ABOVE"] = "above";
-  return PopoverYAlign$1;
-})({});
-const PopoverStatic = ({ children, className, identifier, ...props }) => /* @__PURE__ */ jsxRuntimeExports.jsx("div", {
-  className: cn$2("group/popover relative flex cursor-pointer", className),
-  id: `unrollable-panel-button-${identifier}`,
-  "aria-haspopup": true,
-  ...props,
-  children
-});
-const Detail$1 = ({ children, isHidden: isHidden2 = void 0, isOverable = true, isFocusable = false, xAlign = PopoverXAlign.START, yAlign = PopoverYAlign.BELOW, identifier, className, displayArrow = true, ...props }) => /* @__PURE__ */ jsxRuntimeExports.jsx(Container, {
-  transparency: "sm",
-  role: "group",
-  "aria-hidden": isHidden2,
-  "aria-labelledby": `unrollable-panel-button-${identifier}`,
-  id: `unrollable-panel-${identifier}`,
-  className: cn$2("absolute z-50 min-w-full rounded-md ring-1 ring-neutral", xAlign === "start" && "left-0", xAlign === "end" && "right-0", yAlign === "bellow" && "top-[calc(100%+1rem)]", yAlign === "above" && "bottom-[calc(100%+1rem)]", displayArrow && 'before:absolute before:z-[999] before:h-0 before:w-0 before:content-[""]', displayArrow && xAlign === "start" && "before:left-2", displayArrow && xAlign === "end" && "before:right-2", displayArrow && yAlign === "bellow" && "before:-top-[10px] before:border-r-[10px] before:border-r-transparent before:border-b-[10px] before:border-b-neutral before:border-l-[10px] before:border-l-transparent", displayArrow && yAlign === "above" && "before:-bottom-[10px] before:border-t-[10px] before:border-t-neutral before:border-r-[10px] before:border-r-transparent before:border-l-[10px] before:border-l-transparent", "overflow-x-visible opacity-0 transition-all duration-400 ease-in-out", isHidden2 !== false ? "invisible" : "visible opacity-100 delay-800", isOverable && "group-hover/popover:visible group-hover/popover:opacity-100 group-hover/popover:delay-800", isFocusable && "group-focus-within/popover:visible group-focus-within/popover:opacity-100 group-focus-within/popover:delay-800", className),
-  ...props,
-  children
-});
-PopoverStatic.Detail = Detail$1;
-const PopoverComponent = (props) => {
-  return /* @__PURE__ */ jsxRuntimeExports.jsx(PopoverStatic, { ...props });
-};
-const Detail = ({ xAlign = PopoverXAlign.START, yAlign = PopoverYAlign.BELOW, ...props }) => {
-  const popoverRef = reactExports.useRef(null);
-  const [computedXAlign, setComputedXAlign] = reactExports.useState(xAlign);
-  const [computedYAlign, setComputedYAlign] = reactExports.useState(yAlign);
-  const [maxWidth, setMaxWidth] = reactExports.useState(void 0);
-  reactExports.useEffect(() => {
-    const adjustPosition = () => {
-      if (!popoverRef.current) return;
-      const popoverElement = popoverRef.current;
-      const triggerElement$1 = document.getElementById(`unrollable-panel-button-${props.identifier}`);
-      if (!triggerElement$1) return;
-      const triggerRect = triggerElement$1.getBoundingClientRect();
-      const viewportWidth = window.innerWidth;
-      const viewportHeight = window.innerHeight;
-      const gap = 16;
-      const padding = 16;
-      const maxWidthFromLeft = viewportWidth - triggerRect.left - padding;
-      const maxWidthFromRight = triggerRect.right - padding;
-      setMaxWidth(Math.max(maxWidthFromLeft, maxWidthFromRight));
-      const wasInvisible = popoverElement.classList.contains("invisible");
-      if (wasInvisible) {
-        popoverElement.style.visibility = "hidden";
-        popoverElement.classList.remove("invisible");
-      }
-      requestAnimationFrame(() => {
-        const popoverRect = popoverElement.getBoundingClientRect();
-        if (wasInvisible) {
-          popoverElement.style.visibility = "";
-          popoverElement.classList.add("invisible");
-        }
-        let newYAlign = yAlign;
-        const spaceBelow = viewportHeight - triggerRect.bottom - gap;
-        const spaceAbove = triggerRect.top - gap;
-        if (yAlign === PopoverYAlign.BELOW && spaceBelow < popoverRect.height) {
-          if (spaceAbove >= popoverRect.height) newYAlign = PopoverYAlign.ABOVE;
-        } else if (yAlign === PopoverYAlign.ABOVE && spaceAbove < popoverRect.height) {
-          if (spaceBelow >= popoverRect.height) newYAlign = PopoverYAlign.BELOW;
-        }
-        let newXAlign = xAlign;
-        const spaceRight = viewportWidth - triggerRect.left - padding;
-        const spaceLeft = triggerRect.right - padding;
-        if (xAlign === PopoverXAlign.START && spaceRight < popoverRect.width) {
-          if (spaceLeft >= popoverRect.width) newXAlign = PopoverXAlign.END;
-        } else if (xAlign === PopoverXAlign.END && spaceLeft < popoverRect.width) {
-          if (spaceRight >= popoverRect.width) newXAlign = PopoverXAlign.START;
-        }
-        setComputedYAlign(newYAlign);
-        setComputedXAlign(newXAlign);
-      });
-    };
-    const timeoutId = setTimeout(adjustPosition, 0);
-    const triggerElement = document.getElementById(`unrollable-panel-button-${props.identifier}`);
-    if (triggerElement) {
-      triggerElement.addEventListener("mouseenter", adjustPosition);
-      triggerElement.addEventListener("focusin", adjustPosition);
-    }
-    const resizeObserver = new ResizeObserver(() => {
-      adjustPosition();
-    });
-    if (popoverRef.current) resizeObserver.observe(popoverRef.current);
-    window.addEventListener("resize", adjustPosition);
-    window.addEventListener("scroll", adjustPosition, true);
-    return () => {
-      clearTimeout(timeoutId);
-      if (triggerElement) {
-        triggerElement.removeEventListener("mouseenter", adjustPosition);
-        triggerElement.removeEventListener("focusin", adjustPosition);
-      }
-      resizeObserver.disconnect();
-      window.removeEventListener("resize", adjustPosition);
-      window.removeEventListener("scroll", adjustPosition, true);
-    };
-  }, [
-    props.identifier,
-    xAlign,
-    yAlign
-  ]);
-  return /* @__PURE__ */ jsxRuntimeExports.jsx(Detail$1, {
-    ...props,
-    xAlign: computedXAlign,
-    yAlign: computedYAlign,
-    ref: popoverRef,
-    style: {
-      ...props.style,
-      maxWidth: maxWidth ? `${maxWidth}px` : void 0
-    }
-  });
-};
-const Popover = PopoverComponent;
-Popover.Detail = Detail;
 const CodeContext = reactExports.createContext({
   packageManager: "npm",
   setPackageManager: () => {
@@ -37248,7 +37616,7 @@ const CodeConditionalRender = ({ children, ...props }) => {
   return /* @__PURE__ */ jsxRuntimeExports.jsx(jsxRuntimeExports.Fragment, {});
 };
 const key$d = "code-selectors";
-const content$d = { "nodeType": "translation", "translation": { "en": { "packageManager": { "label": "Select package manager" }, "codeFormat": { "label": "Select code format" }, "contentDeclarationFormat": { "label": "Select dictionary format" } }, "en-GB": { "packageManager": { "label": "Select package manager" }, "codeFormat": { "label": "Select code format" }, "contentDeclarationFormat": { "label": "Select dictionary format" } }, "fr": { "packageManager": { "label": "Sélectionner le gestionnaire de paquets" }, "codeFormat": { "label": "Sélectionner le format de code" }, "contentDeclarationFormat": { "label": "Sélectionner le format de dictionnaire" } }, "es": { "packageManager": { "label": "Seleccionar gestor de paquetes" }, "codeFormat": { "label": "Seleccionar formato de código" }, "contentDeclarationFormat": { "label": "Seleccionar formato de diccionario" } }, "de": { "packageManager": { "label": "Paketmanager auswählen" }, "codeFormat": { "label": "Code-Format auswählen" }, "contentDeclarationFormat": { "label": "Wörterbuchformat auswählen" } }, "ja": { "packageManager": { "label": "パッケージマネージャーを選択" }, "codeFormat": { "label": "コード形式を選択" }, "contentDeclarationFormat": { "label": "辞書形式を選択" } }, "ko": { "packageManager": { "label": "패키지 관리자 선택" }, "codeFormat": { "label": "코드 형식 선택" }, "contentDeclarationFormat": { "label": "사전 형식 선택" } }, "zh": { "packageManager": { "label": "选择包管理器" }, "codeFormat": { "label": "选择代码格式" }, "contentDeclarationFormat": { "label": "选择字典格式" } }, "it": { "packageManager": { "label": "Seleziona il gestore dei pacchetti" }, "codeFormat": { "label": "Seleziona il formato del codice" }, "contentDeclarationFormat": { "label": "Seleziona il formato del dizionario" } }, "pt": { "packageManager": { "label": "Selecionar gerenciador de pacotes" }, "codeFormat": { "label": "Selecionar formato de código" }, "contentDeclarationFormat": { "label": "Selecionar formato de dicionário" } }, "hi": { "packageManager": { "label": "पैकेज प्रबंधक चुनें" }, "codeFormat": { "label": "कोड प्रारूप चुनें" }, "contentDeclarationFormat": { "label": "शब्दकोश प्रारूप चुनें" } }, "ar": { "packageManager": { "label": "اختر مدير الحزم" }, "codeFormat": { "label": "اختر تنسيق الكود" }, "contentDeclarationFormat": { "label": "اختر تنسيق القاموس" } }, "ru": { "packageManager": { "label": "Выбрать менеджер пакетов" }, "codeFormat": { "label": "Выбрать формат кода" }, "contentDeclarationFormat": { "label": "Выбрать формат словаря" } } } };
+const content$d = { "nodeType": "translation", "translation": { "en": { "packageManager": { "placeholder": "Package Manager", "label": "Select package manager" }, "codeFormat": { "placeholder": "Code Format", "label": "Select code format" }, "contentDeclarationFormat": { "placeholder": "Dictionary Format", "label": "Select dictionary format" } }, "en-GB": { "packageManager": { "placeholder": "Package Manager", "label": "Select package manager" }, "codeFormat": { "placeholder": "Code Format", "label": "Select code format" }, "contentDeclarationFormat": { "placeholder": "Dictionary Format", "label": "Select dictionary format" } }, "fr": { "packageManager": { "placeholder": "Gestionnaire de paquets", "label": "Sélectionner le gestionnaire de paquets" }, "codeFormat": { "placeholder": "Format de code", "label": "Sélectionner le format de code" }, "contentDeclarationFormat": { "placeholder": "Format de dictionnaire", "label": "Sélectionner le format de dictionnaire" } }, "es": { "packageManager": { "placeholder": "Gestor de paquetes", "label": "Seleccionar gestor de paquetes" }, "codeFormat": { "placeholder": "Formato de código", "label": "Seleccionar formato de código" }, "contentDeclarationFormat": { "placeholder": "Formato de diccionario", "label": "Seleccionar formato de diccionario" } }, "de": { "packageManager": { "placeholder": "Paketmanager", "label": "Paketmanager auswählen" }, "codeFormat": { "placeholder": "Code-Format", "label": "Code-Format auswählen" }, "contentDeclarationFormat": { "placeholder": "Wörterbuchformat", "label": "Wörterbuchformat auswählen" } }, "ja": { "packageManager": { "placeholder": "パッケージマネージャー", "label": "パッケージマネージャーを選択" }, "codeFormat": { "placeholder": "コード形式", "label": "コード形式を選択" }, "contentDeclarationFormat": { "placeholder": "辞書形式", "label": "辞書形式を選択" } }, "ko": { "packageManager": { "placeholder": "패키지 관리자", "label": "패키지 관리자 선택" }, "codeFormat": { "placeholder": "코드 형식", "label": "코드 형식 선택" }, "contentDeclarationFormat": { "placeholder": "사전 형식", "label": "사전 형식 선택" } }, "zh": { "packageManager": { "placeholder": "包管理器", "label": "选择包管理器" }, "codeFormat": { "placeholder": "代码格式", "label": "选择代码格式" }, "contentDeclarationFormat": { "placeholder": "字典格式", "label": "选择字典格式" } }, "it": { "packageManager": { "placeholder": "Gestore dei pacchetti", "label": "Seleziona il gestore dei pacchetti" }, "codeFormat": { "placeholder": "Formato del codice", "label": "Seleziona il formato del codice" }, "contentDeclarationFormat": { "placeholder": "Formato del dizionario", "label": "Seleziona il formato del dizionario" } }, "pt": { "packageManager": { "placeholder": "Gerenciador de pacotes", "label": "Selecionar gerenciador de pacotes" }, "codeFormat": { "placeholder": "Formato de código", "label": "Selecionar formato de código" }, "contentDeclarationFormat": { "placeholder": "Formato de dicionário", "label": "Selecionar formato de dicionário" } }, "hi": { "packageManager": { "placeholder": "पैकेज प्रबंधक", "label": "पैकेज प्रबंधक चुनें" }, "codeFormat": { "placeholder": "कोड प्रारूप", "label": "कोड प्रारूप चुनें" }, "contentDeclarationFormat": { "placeholder": "शब्दकोश प्रारूप", "label": "शब्दकोश प्रारूप चुनें" } }, "ar": { "packageManager": { "placeholder": "مدير الحزم", "label": "اختر مدير الحزم" }, "codeFormat": { "placeholder": "تنسيق الكود", "label": "اختر تنسيق الكود" }, "contentDeclarationFormat": { "placeholder": "تنسيق القاموس", "label": "اختر تنسيق القاموس" } }, "ru": { "packageManager": { "placeholder": "Менеджер пакетов", "label": "Выбрать менеджер пакетов" }, "codeFormat": { "placeholder": "Формат кода", "label": "Выбрать формат кода" }, "contentDeclarationFormat": { "placeholder": "Формат словаря", "label": "Выбрать формат словаря" } } } };
 const localIds$d = ["code-selectors::local::../@intlayer/design-system/src/components/IDE/selectors.content.ts"];
 const _VaxfTMdlIxLlHVFaeieC = {
   key: key$d,
@@ -37261,9 +37629,7 @@ const CodeFormatSelector = () => {
     setCodeFormat,
     setContentDeclarationFormat
   } = useCodeContext();
-  const {
-    codeFormat: codeFormatContent
-  } = useDictionary(_VaxfTMdlIxLlHVFaeieC);
+  const content2 = useDictionary(_VaxfTMdlIxLlHVFaeieC);
   return /* @__PURE__ */ jsxRuntimeExports.jsxs(Select, {
     value: codeFormat,
     onValueChange: (value) => {
@@ -37271,10 +37637,10 @@ const CodeFormatSelector = () => {
       setContentDeclarationFormat(value);
     },
     children: [/* @__PURE__ */ jsxRuntimeExports.jsx(Select.Trigger, {
-      className: "py-1",
-      "aria-label": codeFormatContent.label,
+      className: "py-1!",
+      "aria-label": content2.codeFormat.label.value,
       children: /* @__PURE__ */ jsxRuntimeExports.jsx(Select.Value, {
-        placeholder: "Code Format"
+        placeholder: content2.codeFormat.placeholder.value
       })
     }), /* @__PURE__ */ jsxRuntimeExports.jsxs(Select.Content, {
       children: [/* @__PURE__ */ jsxRuntimeExports.jsx(Select.Item, {
@@ -37295,17 +37661,15 @@ const ContentDeclarationFormatSelector = () => {
     contentDeclarationFormat,
     setContentDeclarationFormat
   } = useCodeContext();
-  const {
-    contentDeclarationFormat: contentDeclarationFormatContent
-  } = useDictionary(_VaxfTMdlIxLlHVFaeieC);
+  const content2 = useDictionary(_VaxfTMdlIxLlHVFaeieC);
   return /* @__PURE__ */ jsxRuntimeExports.jsxs(Select, {
     value: contentDeclarationFormat,
     onValueChange: setContentDeclarationFormat,
     children: [/* @__PURE__ */ jsxRuntimeExports.jsx(Select.Trigger, {
-      className: "py-1",
-      "aria-label": contentDeclarationFormatContent.label,
+      className: "py-1!",
+      "aria-label": content2.contentDeclarationFormat.label.value,
       children: /* @__PURE__ */ jsxRuntimeExports.jsx(Select.Value, {
-        placeholder: "Dictionary Format"
+        placeholder: content2.contentDeclarationFormat.placeholder.value
       })
     }), /* @__PURE__ */ jsxRuntimeExports.jsxs(Select.Content, {
       children: [/* @__PURE__ */ jsxRuntimeExports.jsx(Select.Item, {
@@ -37361,17 +37725,16 @@ const PackageManagerSelector = () => {
     packageManager,
     setPackageManager
   } = useCodeContext();
-  const {
-    packageManager: packageManagerContent
-  } = useDictionary(_VaxfTMdlIxLlHVFaeieC);
+  const content2 = useDictionary(_VaxfTMdlIxLlHVFaeieC);
+  useDictionary(_VaxfTMdlIxLlHVFaeieC);
   return /* @__PURE__ */ jsxRuntimeExports.jsxs(Select, {
     value: packageManager,
     onValueChange: setPackageManager,
     children: [/* @__PURE__ */ jsxRuntimeExports.jsx(Select.Trigger, {
-      className: "py-1",
-      "aria-label": packageManagerContent.label,
+      className: "py-1!",
+      "aria-label": content2.packageManager.label.value,
       children: /* @__PURE__ */ jsxRuntimeExports.jsx(Select.Value, {
-        placeholder: "Package Manager"
+        placeholder: content2.packageManager.placeholder.value
       })
     }), /* @__PURE__ */ jsxRuntimeExports.jsxs(Select.Content, {
       children: [/* @__PURE__ */ jsxRuntimeExports.jsx(Select.Item, {
@@ -37456,7 +37819,7 @@ const tabSelectorVariant = cva("relative z-0 flex size-full flex-row items-cente
   } },
   defaultVariants: { color: "primary" }
 });
-const indicatorVariant = cva("-z-1 absolute rounded-lg duration-300 ease-in-out motion-reduce:transition-none", {
+const indicatorVariant = cva("absolute -z-1 rounded-lg duration-300 ease-in-out motion-reduce:transition-none", {
   variants: {
     color: {
       primary: "bg-primary/10 aria-selected:text-text",
@@ -45229,7 +45592,7 @@ let ModalSize = /* @__PURE__ */ (function(ModalSize$1) {
   ModalSize$1["UNSET"] = "unset";
   return ModalSize$1;
 })({});
-const modalVariants = cva("flex cursor-default flex-col p-3 shadow-sm", {
+const modalVariants = cva("flex cursor-default flex-col overflow-hidden shadow-sm", {
   variants: { size: {
     sm: "h-auto max-h-[30vh] w-[95vw] max-w-xl",
     md: "h-auto max-h-[50vh] w-[95vw] max-w-xl",
@@ -45239,8 +45602,16 @@ const modalVariants = cva("flex cursor-default flex-col p-3 shadow-sm", {
   } },
   defaultVariants: { size: "unset" }
 });
+const contentPaddingVariants = {
+  none: "p-0",
+  sm: "px-2 py-4",
+  md: "px-4 py-6",
+  lg: "px-6 py-8",
+  xl: "px-8 py-10",
+  "2xl": "px-10 py-12"
+};
 const MotionModal = motion.create(Container);
-const Modal = ({ children, isOpen, container, disableScroll = true, onClose, hasCloseButton = false, title, size: size2 = ModalSize.MD, className, ...props }) => {
+const Modal = ({ children, isOpen, container, disableScroll = true, onClose, hasCloseButton = false, title, size: size2 = ModalSize.MD, className, isScrollable = false, padding = "none", ...props }) => {
   const containerElement = useGetElementOrWindow(container);
   useScrollBlockage({
     key: "modal",
@@ -45257,8 +45628,9 @@ const Modal = ({ children, isOpen, container, disableScroll = true, onClose, has
   }, [isOpen, onClose]);
   if (!containerElement) return /* @__PURE__ */ jsxRuntimeExports.jsx(jsxRuntimeExports.Fragment, {});
   const hasTitle = typeof title === "string";
+  const contentPaddingClass = contentPaddingVariants[padding || "none"];
   return reactDomExports.createPortal(/* @__PURE__ */ jsxRuntimeExports.jsx(motion.div, {
-    className: "invisible fixed top-0 left-0 z-50 flex size-full cursor-pointer items-center justify-center overflow-auto bg-background/40 backdrop-blur",
+    className: "invisible fixed top-0 left-0 z-50 flex size-full cursor-pointer items-center justify-center overflow-hidden bg-background/40 backdrop-blur",
     animate: isOpen ? "visible" : "invisible",
     variants: {
       visible: {
@@ -45294,12 +45666,13 @@ const Modal = ({ children, isOpen, container, disableScroll = true, onClose, has
       }),
       role: "dialog",
       "aria-modal": true,
-      roundedSize: "2xl",
+      roundedSize: "4xl",
+      padding: "none",
       ...props,
       children: [/* @__PURE__ */ jsxRuntimeExports.jsxs("div", {
-        className: cn$2("cursor-default", hasCloseButton && hasTitle ? `flex items-start` : hasCloseButton ? `flex justify-end` : hasTitle ? `items-center` : `hidden`),
+        className: cn$2("relative flex-none px-4 pt-4", hasCloseButton && hasTitle ? `flex items-start` : hasCloseButton ? `flex justify-end` : hasTitle ? `items-center` : `hidden`),
         children: [hasTitle && /* @__PURE__ */ jsxRuntimeExports.jsx(H3, {
-          className: "mt-2 mb-4 ml-4 flex items-center justify-center font-bold text-lg",
+          className: "mb-2 ml-1 flex items-center justify-center font-bold text-lg",
           children: title
         }), hasCloseButton && /* @__PURE__ */ jsxRuntimeExports.jsx(Button, {
           variant: ButtonVariant.HOVERABLE,
@@ -45314,8 +45687,11 @@ const Modal = ({ children, isOpen, container, disableScroll = true, onClose, has
           size: ButtonSize.ICON_MD
         })]
       }), /* @__PURE__ */ jsxRuntimeExports.jsx("div", {
-        className: "flex w-full flex-1 flex-col",
-        children
+        className: cn$2("flex min-h-0 w-full flex-1 flex-col", isScrollable === true && "overflow-auto", isScrollable === "y" && "overflow-y-auto overflow-x-hidden", isScrollable === "x" && "overflow-x-auto overflow-y-hidden", !isScrollable && "overflow-visible"),
+        children: /* @__PURE__ */ jsxRuntimeExports.jsx("div", {
+          className: cn$2("h-full w-full", contentPaddingClass),
+          children
+        })
       })]
     })
   }), containerElement);
@@ -46859,14 +47235,6 @@ const _LjElj9YzZe66ZBgugc8w = {
   content: content$b,
   localIds: localIds$b
 };
-const renameKey = (obj, oldKey, newKey) => {
-  const newObj = { ...obj };
-  for (const key2 of Object.keys(obj)) if (key2 === oldKey) {
-    newObj[newKey] = obj[oldKey];
-    delete newObj[oldKey];
-  } else newObj[key2] = obj[key2];
-  return newObj;
-};
 const ContentEditorInput$1 = ({ children, onContentChange, disabled, validate, additionalButtons, ...props }) => {
   const [newValue, setNewValue] = reactExports.useState(children);
   const [resetIncrementor, setResetIncrementor] = reactExports.useState(0);
@@ -47028,6 +47396,14 @@ const ContentEditorTextArea$1 = ({ children, onContentChange, disabled, validate
     })]
   }, children);
 };
+const renameKey = (obj, oldKey, newKey) => {
+  const newObj = { ...obj };
+  for (const key2 of Object.keys(obj)) if (key2 === oldKey) {
+    newObj[newKey] = obj[oldKey];
+    delete newObj[oldKey];
+  } else newObj[key2] = obj[key2];
+  return newObj;
+};
 const extractInitialState = (value) => {
   let comparator;
   let numberValue;
@@ -47218,29 +47594,32 @@ const TranslationTextEditor = ({
     className: "w-full",
     children: /* @__PURE__ */ jsxRuntimeExports.jsx("tbody", {
       className: "flex w-full flex-col gap-2",
-      children: localesList.map((translationKey) => /* @__PURE__ */ jsxRuntimeExports.jsxs(reactExports.Fragment, {
-        children: [/* @__PURE__ */ jsxRuntimeExports.jsx("tr", {
-          className: "mt-2 w-full p-2 text-xs",
-          children: /* @__PURE__ */ jsxRuntimeExports.jsx("td", {
-            className: "flex w-full",
-            children: getLocaleName(translationKey, locale)
-          })
-        }), /* @__PURE__ */ jsxRuntimeExports.jsx("tr", {
-          className: "flex",
-          children: /* @__PURE__ */ jsxRuntimeExports.jsx("td", {
-            className: "flex w-full",
-            children: /* @__PURE__ */ jsxRuntimeExports.jsx(TextEditorContainer, {
-              section: content2[translationKey] ?? getEmptyNode(content2[defaultLocale]),
-              keyPath: [...keyPath, {
-                type: NodeType.Translation,
-                key: translationKey
-              }],
-              dictionary,
-              renderSection
+      children: localesList.map((translationKey) => {
+        const uniqueKey = `${JSON.stringify(keyPath)}-translation-${translationKey}`;
+        return /* @__PURE__ */ jsxRuntimeExports.jsxs(reactExports.Fragment, {
+          children: [/* @__PURE__ */ jsxRuntimeExports.jsx("tr", {
+            className: "mt-2 w-full p-2 text-xs",
+            children: /* @__PURE__ */ jsxRuntimeExports.jsx("td", {
+              className: "flex w-full",
+              children: getLocaleName(translationKey, locale)
             })
-          })
-        })]
-      }, translationKey))
+          }), /* @__PURE__ */ jsxRuntimeExports.jsx("tr", {
+            className: "flex",
+            children: /* @__PURE__ */ jsxRuntimeExports.jsx("td", {
+              className: "flex w-full",
+              children: /* @__PURE__ */ jsxRuntimeExports.jsx(TextEditorContainer, {
+                section: content2[translationKey] ?? getEmptyNode(content2[defaultLocale]),
+                keyPath: [...keyPath, {
+                  type: NodeType.Translation,
+                  key: translationKey
+                }],
+                dictionary,
+                renderSection
+              })
+            })
+          })]
+        }, uniqueKey);
+      })
     })
   });
 };
@@ -47270,6 +47649,7 @@ const EnumerationTextEditor = ({
             type: NodeType.Enumeration,
             key: enumKey
           }];
+          const uniqueKey = `${JSON.stringify(keyPath)}-enumeration-${enumKey}`;
           return /* @__PURE__ */ jsxRuntimeExports.jsxs(reactExports.Fragment, {
             children: [/* @__PURE__ */ jsxRuntimeExports.jsx("tr", {
               className: "mt-2 w-full",
@@ -47319,7 +47699,7 @@ const EnumerationTextEditor = ({
                 })
               })
             })]
-          }, enumKey);
+          }, uniqueKey);
         })
       })
     }), /* @__PURE__ */ jsxRuntimeExports.jsx(Button, {
@@ -47349,29 +47729,32 @@ const ConditionTextEditor = ({
     className: "w-full",
     children: /* @__PURE__ */ jsxRuntimeExports.jsx("tbody", {
       className: "flex w-full flex-col gap-2",
-      children: ["true", "false", "fallback"].map((condKey) => /* @__PURE__ */ jsxRuntimeExports.jsxs(reactExports.Fragment, {
-        children: [/* @__PURE__ */ jsxRuntimeExports.jsx("tr", {
-          className: "mt-2 block w-full p-2 text-xs",
-          children: /* @__PURE__ */ jsxRuntimeExports.jsx("td", {
-            className: "flex w-full",
-            children: String(condKey)
-          })
-        }, condKey), /* @__PURE__ */ jsxRuntimeExports.jsx("tr", {
-          className: "block w-full",
-          children: /* @__PURE__ */ jsxRuntimeExports.jsx("td", {
-            className: "flex w-full",
-            children: /* @__PURE__ */ jsxRuntimeExports.jsx(TextEditorContainer, {
-              section: content2[condKey] ?? getEmptyNode(content2.true),
-              keyPath: [...keyPath, {
-                type: NodeType.Condition,
-                key: condKey
-              }],
-              dictionary,
-              renderSection
+      children: ["true", "false", "fallback"].map((condKey) => {
+        const uniqueKey = `${JSON.stringify(keyPath)}-condition-${condKey}`;
+        return /* @__PURE__ */ jsxRuntimeExports.jsxs(reactExports.Fragment, {
+          children: [/* @__PURE__ */ jsxRuntimeExports.jsx("tr", {
+            className: "mt-2 block w-full p-2 text-xs",
+            children: /* @__PURE__ */ jsxRuntimeExports.jsx("td", {
+              className: "flex w-full",
+              children: String(condKey)
             })
-          })
-        }, condKey)]
-      }, condKey))
+          }), /* @__PURE__ */ jsxRuntimeExports.jsx("tr", {
+            className: "block w-full",
+            children: /* @__PURE__ */ jsxRuntimeExports.jsx("td", {
+              className: "flex w-full",
+              children: /* @__PURE__ */ jsxRuntimeExports.jsx(TextEditorContainer, {
+                section: content2[condKey] ?? getEmptyNode(content2.true),
+                keyPath: [...keyPath, {
+                  type: NodeType.Condition,
+                  key: condKey
+                }],
+                dictionary,
+                renderSection
+              })
+            })
+          })]
+        }, uniqueKey);
+      })
     })
   });
 };
@@ -47386,29 +47769,32 @@ const GenderTextEditor = ({
     className: "w-full",
     children: /* @__PURE__ */ jsxRuntimeExports.jsx("tbody", {
       className: "flex w-full flex-col gap-2",
-      children: ["male", "female", "fallback"].map((condKey) => /* @__PURE__ */ jsxRuntimeExports.jsxs(reactExports.Fragment, {
-        children: [/* @__PURE__ */ jsxRuntimeExports.jsx("tr", {
-          className: "mt-2 block w-full p-2 text-xs",
-          children: /* @__PURE__ */ jsxRuntimeExports.jsx("td", {
-            className: "flex w-full",
-            children: String(condKey)
-          })
-        }, condKey), /* @__PURE__ */ jsxRuntimeExports.jsx("tr", {
-          className: "block w-full",
-          children: /* @__PURE__ */ jsxRuntimeExports.jsx("td", {
-            className: "flex w-full",
-            children: /* @__PURE__ */ jsxRuntimeExports.jsx(TextEditorContainer, {
-              section: content2[condKey] ?? getEmptyNode(content2.male),
-              keyPath: [...keyPath, {
-                type: NodeType.Gender,
-                key: condKey
-              }],
-              dictionary,
-              renderSection
+      children: ["male", "female", "fallback"].map((condKey) => {
+        const uniqueKey = `${JSON.stringify(keyPath)}-gender-${condKey}`;
+        return /* @__PURE__ */ jsxRuntimeExports.jsxs(reactExports.Fragment, {
+          children: [/* @__PURE__ */ jsxRuntimeExports.jsx("tr", {
+            className: "mt-2 block w-full p-2 text-xs",
+            children: /* @__PURE__ */ jsxRuntimeExports.jsx("td", {
+              className: "flex w-full",
+              children: String(condKey)
             })
-          })
-        }, condKey)]
-      }, condKey))
+          }), /* @__PURE__ */ jsxRuntimeExports.jsx("tr", {
+            className: "block w-full",
+            children: /* @__PURE__ */ jsxRuntimeExports.jsx("td", {
+              className: "flex w-full",
+              children: /* @__PURE__ */ jsxRuntimeExports.jsx(TextEditorContainer, {
+                section: content2[condKey] ?? getEmptyNode(content2.male),
+                keyPath: [...keyPath, {
+                  type: NodeType.Gender,
+                  key: condKey
+                }],
+                dictionary,
+                renderSection
+              })
+            })
+          })]
+        }, uniqueKey);
+      })
     })
   });
 };
@@ -47431,50 +47817,53 @@ const ArrayTextEditor = ({
       className: "w-full",
       children: /* @__PURE__ */ jsxRuntimeExports.jsx("tbody", {
         className: "flex w-full flex-col gap-2",
-        children: section.map((subSection, index2) => /* @__PURE__ */ jsxRuntimeExports.jsxs(reactExports.Fragment, {
-          children: [/* @__PURE__ */ jsxRuntimeExports.jsx("tr", {
-            className: "mt-2 w-full p-2",
-            children: /* @__PURE__ */ jsxRuntimeExports.jsx("td", {
-              className: "flex w-full",
-              children: /* @__PURE__ */ jsxRuntimeExports.jsxs("div", {
-                className: "flex w-full items-center justify-between gap-2",
-                children: [/* @__PURE__ */ jsxRuntimeExports.jsx("span", {
-                  className: "text-xs",
-                  children: String(index2)
-                }), /* @__PURE__ */ jsxRuntimeExports.jsx(Button, {
-                  label: removeElement.label.value,
-                  variant: "hoverable",
-                  size: "sm",
-                  color: "error",
-                  className: "ml-auto text-neutral hover:text-error",
-                  onClick: () => {
-                    const newKeyPath = [...keyPath, {
-                      type: NodeType.Array,
-                      key: index2
-                    }];
-                    addEditedContent(dictionary.localId, void 0, newKeyPath);
-                  },
-                  Icon: Trash,
-                  children: removeElement.text
-                })]
+        children: section.map((subSection, index2) => {
+          const uniqueKey = `${JSON.stringify(keyPath)}-array-${index2}`;
+          return /* @__PURE__ */ jsxRuntimeExports.jsxs(reactExports.Fragment, {
+            children: [/* @__PURE__ */ jsxRuntimeExports.jsx("tr", {
+              className: "mt-2 w-full p-2",
+              children: /* @__PURE__ */ jsxRuntimeExports.jsx("td", {
+                className: "flex w-full",
+                children: /* @__PURE__ */ jsxRuntimeExports.jsxs("div", {
+                  className: "flex w-full items-center justify-between gap-2",
+                  children: [/* @__PURE__ */ jsxRuntimeExports.jsx("span", {
+                    className: "text-xs",
+                    children: String(index2)
+                  }), /* @__PURE__ */ jsxRuntimeExports.jsx(Button, {
+                    label: removeElement.label.value,
+                    variant: "hoverable",
+                    size: "sm",
+                    color: "error",
+                    className: "ml-auto text-neutral hover:text-error",
+                    onClick: () => {
+                      const newKeyPath = [...keyPath, {
+                        type: NodeType.Array,
+                        key: index2
+                      }];
+                      addEditedContent(dictionary.localId, void 0, newKeyPath);
+                    },
+                    Icon: Trash,
+                    children: removeElement.text
+                  })]
+                })
               })
-            })
-          }), /* @__PURE__ */ jsxRuntimeExports.jsx("tr", {
-            className: "block w-full",
-            children: /* @__PURE__ */ jsxRuntimeExports.jsx("td", {
-              className: "flex w-full",
-              children: /* @__PURE__ */ jsxRuntimeExports.jsx(TextEditorContainer, {
-                section: subSection ?? getEmptyNode(section[0]),
-                keyPath: [...keyPath, {
-                  type: NodeType.Array,
-                  key: index2
-                }],
-                dictionary,
-                renderSection
+            }), /* @__PURE__ */ jsxRuntimeExports.jsx("tr", {
+              className: "block w-full",
+              children: /* @__PURE__ */ jsxRuntimeExports.jsx("td", {
+                className: "flex w-full",
+                children: /* @__PURE__ */ jsxRuntimeExports.jsx(TextEditorContainer, {
+                  section: subSection ?? getEmptyNode(section[0]),
+                  keyPath: [...keyPath, {
+                    type: NodeType.Array,
+                    key: index2
+                  }],
+                  dictionary,
+                  renderSection
+                })
               })
-            })
-          })]
-        }, JSON.stringify(subSection)))
+            })]
+          }, uniqueKey);
+        })
       })
     }), /* @__PURE__ */ jsxRuntimeExports.jsx(Button, {
       label: addNewElement.label.value,
@@ -47512,6 +47901,7 @@ const ObjectTextEditor = ({
         const typedSection = section;
         const firstKey = Object.keys(typedSection)[0];
         const subSection = typedSection[key2] ?? getEmptyNode(typedSection[firstKey]);
+        const uniqueKey = `${JSON.stringify(keyPath)}-object-${key2}`;
         return /* @__PURE__ */ jsxRuntimeExports.jsxs(reactExports.Fragment, {
           children: [/* @__PURE__ */ jsxRuntimeExports.jsx("tr", {
             className: "mt-2 p-2 text-xs",
@@ -47519,7 +47909,7 @@ const ObjectTextEditor = ({
               className: "flex w-full",
               children: String(key2)
             })
-          }, JSON.stringify(subSection)), /* @__PURE__ */ jsxRuntimeExports.jsx("tr", {
+          }), /* @__PURE__ */ jsxRuntimeExports.jsx("tr", {
             className: "block w-full",
             children: /* @__PURE__ */ jsxRuntimeExports.jsx("td", {
               className: "flex w-full",
@@ -47530,8 +47920,8 @@ const ObjectTextEditor = ({
                 renderSection
               })
             })
-          }, JSON.stringify(subSection))]
-        }, key2);
+          })]
+        }, uniqueKey);
       })
     })
   })
@@ -48023,10 +48413,11 @@ const FormItem = ({ id: idProp, ...props }) => {
   const generatedId = reactExports.useId();
   const stableId = idProp ?? generatedId;
   return /* @__PURE__ */ jsxRuntimeExports.jsx(FormItemContext, {
-    value: reactExports.useMemo(() => ({ id: stableId }), [stableId]),
+    value: { id: stableId },
     children: /* @__PURE__ */ jsxRuntimeExports.jsx("div", {
       className: "flex flex-col gap-2 p-2",
       id: stableId,
+      suppressHydrationWarning: true,
       ...props
     })
   });
@@ -52936,6 +53327,7 @@ const FormLabelLayout = ({ children, isRequired, info, htmlFor, className }) =>
   children: [children && /* @__PURE__ */ jsxRuntimeExports.jsxs(FormLabel, {
     htmlFor,
     id: `${htmlFor}-label`,
+    suppressHydrationWarning: true,
     className: clsx("font-bold", className),
     children: [children, /* @__PURE__ */ jsxRuntimeExports.jsx(RequiredStar, { isRequired })]
   }), info && /* @__PURE__ */ jsxRuntimeExports.jsx(InformationTag, { content: info })]
@@ -55447,7 +55839,7 @@ const ObjectView = ({
           }],
           dictionaryLocalId
         })
-      }, key2))
+      }, `${JSON.stringify(keyPath)}-object-${key2}`))
     }), /* @__PURE__ */ jsxRuntimeExports.jsx(Button, {
       label: addNodeButton.label.value,
       variant: ButtonVariant.HOVERABLE,
@@ -55585,203 +55977,6 @@ const DictionaryFieldEditor = ({
     })
   });
 };
-const getBreakpointFromSize = (breakpoint) => {
-  switch (breakpoint) {
-    case "xs":
-      return 480;
-    case "sm":
-      return 640;
-    case "md":
-      return 768;
-    case "lg":
-      return 1024;
-    case "xl":
-      return 1280;
-    case "2xl":
-      return 1536;
-    default:
-      return breakpoint;
-  }
-};
-const checkIsMobileUserAgent = () => {
-  if (typeof window === "undefined") return;
-  const userAgent = window.navigator?.userAgent;
-  if (typeof userAgent === "undefined") return;
-  return /android|bb\d+|meego|avantgo|bada\/|blackberry|blazer|compal|elaine|fennec|hiptop|iemobile|ip(?:hone|od|ad)|iris|kindle|lge |maemo|midp|mmp|mobile.+firefox|netfront|opera m(?:ob|in)i|palm(?: os)?|phone|p(?:ixi|re)\/|plucker|pocket|psp|series(?:4|6)0|symbian|treo|up\.(?:browser|link)|vodafone|wap|windows ce|windows phone|xda|xiino|zte-/i.test(userAgent);
-};
-const checkIsIOS = () => {
-  if (typeof window === "undefined") return;
-  const userAgent = window.navigator?.userAgent;
-  if (typeof userAgent === "undefined") return;
-  return /iP(?:hone|ad|od)/.test(userAgent);
-};
-const checkIsMac = () => {
-  if (typeof window === "undefined") return;
-  const userAgent = window.navigator?.userAgent;
-  if (typeof userAgent === "undefined") return;
-  return /Macintosh|MacIntel|Mac OS X/.test(userAgent);
-};
-const checkIsMobileScreen = (breakpoint) => {
-  if (typeof window === "undefined") return;
-  return (window?.innerWidth ?? 0) <= breakpoint;
-};
-const calculateIsMobile = (breakpoint = "md") => {
-  const breakpointValue = getBreakpointFromSize(breakpoint);
-  const isMobileUserAgent = checkIsMobileUserAgent();
-  const isMobileScreen = checkIsMobileScreen(breakpointValue);
-  return {
-    isMobileScreen,
-    isMobileUserAgent,
-    isMobile: isMobileScreen ?? isMobileUserAgent,
-    isIOS: checkIsIOS(),
-    isMac: checkIsMac()
-  };
-};
-const useDevice = (breakpoint = "md") => {
-  const [result, setResult] = reactExports.useState(calculateIsMobile(breakpoint));
-  reactExports.useEffect(() => {
-    const handleResize = () => {
-      setResult(calculateIsMobile(breakpoint));
-    };
-    window.addEventListener("resize", handleResize, { passive: true });
-    return () => window.removeEventListener("resize", handleResize);
-  }, [breakpoint]);
-  return result;
-};
-const parseShortcut = (shortcut) => {
-  return shortcut.split(" + ").map((key2) => key2.trim());
-};
-const normalizeKey = (key2) => {
-  return {
-    "⌘": "Meta",
-    Ctrl: "Control",
-    Control: "Control",
-    Alt: "Alt",
-    "⌥": "Alt",
-    Shift: "Shift",
-    Meta: "Meta",
-    "↑": "ArrowUp",
-    "↓": "ArrowDown",
-    "←": "ArrowLeft",
-    "→": "ArrowRight",
-    ArrowUp: "ArrowUp",
-    ArrowDown: "ArrowDown",
-    ArrowLeft: "ArrowLeft",
-    ArrowRight: "ArrowRight"
-  }[key2] || key2;
-};
-const matchesShortcut = (event, keys) => {
-  const normalizedKeys = keys.map(normalizeKey);
-  const hasModifiers = {
-    Meta: normalizedKeys.includes("Meta"),
-    Control: normalizedKeys.includes("Control"),
-    Alt: normalizedKeys.includes("Alt"),
-    Shift: normalizedKeys.includes("Shift")
-  };
-  if (hasModifiers.Meta !== event.metaKey || hasModifiers.Control !== event.ctrlKey || hasModifiers.Alt !== event.altKey || hasModifiers.Shift !== event.shiftKey) return false;
-  const nonModifierKey = keys.find((key2) => ![
-    "⌘",
-    "Ctrl",
-    "Control",
-    "Alt",
-    "⌥",
-    "Shift",
-    "Meta"
-  ].includes(normalizeKey(key2)));
-  if (!nonModifierKey) return false;
-  const normalizedNonModifierKey = normalizeKey(nonModifierKey);
-  if (normalizedNonModifierKey.startsWith("Arrow")) return event.key === normalizedNonModifierKey;
-  return event.key.toLowerCase() === normalizedNonModifierKey.toLowerCase();
-};
-const getDisplayKey = (key2) => {
-  return {
-    ArrowUp: "↑",
-    ArrowDown: "↓",
-    ArrowLeft: "←",
-    ArrowRight: "→"
-  }[key2] || key2;
-};
-const getDisplayShortcut = (shortcut, isMac) => {
-  let result = shortcut;
-  if (isMac) {
-    result = result.replace(/Ctrl/g, "⌘");
-    result = result.replace(/Alt/g, "⌥");
-  } else {
-    result = result.replace(/⌘/g, "Ctrl");
-    result = result.replace(/⌥/g, "Alt");
-  }
-  result = result.replace(/ArrowUp/g, "↑");
-  result = result.replace(/ArrowDown/g, "↓");
-  result = result.replace(/ArrowLeft/g, "←");
-  result = result.replace(/ArrowRight/g, "→");
-  return result;
-};
-const KeyboardShortcut = ({ shortcut, onTriggered, display = true, className, size: size2 = "md" }) => {
-  const { isMac } = useDevice();
-  const keys = parseShortcut(getDisplayShortcut(shortcut, isMac ?? false));
-  const [pressedKeys, setPressedKeys] = reactExports.useState(/* @__PURE__ */ new Set());
-  reactExports.useEffect(() => {
-    const handleKeyDown = (event) => {
-      const target = event.target;
-      const isInputField = target.tagName === "INPUT" || target.tagName === "TEXTAREA" || target.isContentEditable;
-      const currentKey = event.key;
-      const normalizedEventKeys = /* @__PURE__ */ new Set();
-      if (event.metaKey) normalizedEventKeys.add("⌘");
-      if (event.ctrlKey) normalizedEventKeys.add("Ctrl");
-      if (event.altKey) normalizedEventKeys.add(isMac ? "⌥" : "Alt");
-      if (event.shiftKey) normalizedEventKeys.add("Shift");
-      if (currentKey.startsWith("Arrow")) {
-        normalizedEventKeys.add(currentKey);
-        normalizedEventKeys.add(getDisplayKey(currentKey));
-      } else normalizedEventKeys.add(currentKey.toUpperCase());
-      setPressedKeys(normalizedEventKeys);
-      if (onTriggered && matchesShortcut(event, keys)) {
-        const isEscapeShortcut = keys.includes("Escape");
-        if (isInputField && !isEscapeShortcut) return;
-        event.preventDefault();
-        onTriggered();
-      }
-    };
-    const handleKeyUp = () => {
-      setPressedKeys(/* @__PURE__ */ new Set());
-    };
-    window.addEventListener("keydown", handleKeyDown);
-    window.addEventListener("keyup", handleKeyUp);
-    window.addEventListener("blur", handleKeyUp);
-    return () => {
-      window.removeEventListener("keydown", handleKeyDown);
-      window.removeEventListener("keyup", handleKeyUp);
-      window.removeEventListener("blur", handleKeyUp);
-    };
-  }, [
-    keys,
-    onTriggered,
-    isMac
-  ]);
-  if (!display) return null;
-  const isKeyPressed = (key2) => {
-    const upperKey = key2.toUpperCase();
-    const normalizedKey = normalizeKey(key2);
-    return pressedKeys.has(key2) || pressedKeys.has(upperKey) || pressedKeys.has(normalizedKey) || key2 === "⌘" && pressedKeys.has("Meta") || key2 === "Ctrl" && pressedKeys.has("Control") || key2 === "⌥" && pressedKeys.has("Alt") || key2 === "Alt" && pressedKeys.has("Alt") || key2 === "←" && pressedKeys.has("ArrowLeft") || key2 === "→" && pressedKeys.has("ArrowRight") || key2 === "↑" && pressedKeys.has("ArrowUp") || key2 === "↓" && pressedKeys.has("ArrowDown");
-  };
-  return /* @__PURE__ */ jsxRuntimeExports.jsx("kbd", {
-    className: cn$2("inline-flex items-center justify-center gap-0.5 p-0.5", "rounded-lg [corner-shape:squircle] supports-[corner-shape:squircle]:rounded-xl", "font-medium font-sans", "border-1 border-neutral/20 text-neutral", size2 === "sm" && "text-xs", size2 === "md" && "text-sm", size2 === "lg" && "text-base", className),
-    children: keys.map((key2, index2) => {
-      const keyId = `${key2}-${index2}-${shortcut}`;
-      const displayKey = getDisplayKey(key2);
-      return /* @__PURE__ */ jsxRuntimeExports.jsxs("span", {
-        className: "inline-flex items-center",
-        children: [index2 > 0 && /* @__PURE__ */ jsxRuntimeExports.jsx("span", {
-          className: "text-neutral/50",
-          children: "+"
-        }), /* @__PURE__ */ jsxRuntimeExports.jsx("span", {
-          className: cn$2("min-w-4 px-0.5", isKeyPressed(key2) && "scale-120 font-bold text-text"),
-          children: displayKey
-        })]
-      }, keyId);
-    })
-  });
-};
 const MaxWidthSmoother = ({ children, isHidden: isHidden2, minWidth = 0, align = "left", className, ...props }) => /* @__PURE__ */ jsxRuntimeExports.jsx("div", {
   className: cn$2("relative grid h-full grid-cols-[0fr] overflow-x-hidden overflow-y-hidden transition-all duration-500 ease-in-out", isHidden2 ? "" : "grid-cols-[1fr]", className),
   "aria-hidden": isHidden2,
@@ -55989,6 +56184,7 @@ let TagRoundedSize = /* @__PURE__ */ (function(TagRoundedSize$1) {
   return TagRoundedSize$1;
 })({});
 let TagColor = /* @__PURE__ */ (function(TagColor$1) {
+  TagColor$1["PRIMARY"] = "primary";
   TagColor$1["SUCCESS"] = "success";
   TagColor$1["ERROR"] = "error";
   TagColor$1["WARNING"] = "warning";
@@ -56038,6 +56234,7 @@ const containerVariants = cva("w-fit backdrop-blur", {
       [`${TagRoundedSize.FULL}`]: "rounded-full"
     },
     color: {
+      [`${TagColor.PRIMARY}`]: "border-primary bg-primary/10 text-primary",
       [`${TagColor.SUCCESS}`]: "border-success bg-success/10 text-success",
       [`${TagColor.ERROR}`]: "border-error bg-error/10 text-error",
       [`${TagColor.WARNING}`]: "border-warning bg-warning/10 text-warning",
@@ -56891,9 +57088,9 @@ const Toaster = () => {
 const defaultQueryOptions = {
   queries: {
     retry: 1,
-    staleTime: 0,
+    staleTime: 30 * 1e3,
     gcTime: 300 * 1e3,
-    refetchOnMount: "always",
+    refetchOnMount: true,
     refetchOnWindowFocus: false,
     refetchOnReconnect: false
   },
@@ -58049,6 +58246,9 @@ const NoApplicationURLView = () => {
       label: documentationLink.label.value,
       href: "https://intlayer.org/doc/concept/configuration#editor-configuration",
       color: "text",
+      variant: "button",
+      className: "ml-auto",
+      isExternalLink: true,
       children: documentationLink.text
     });
     $2[4] = documentationLink.label.value;
@@ -58119,7 +58319,7 @@ const IframeController = (t0) => {
   if (!editor2.applicationURL) {
     let t42;
     if ($2[4] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel")) {
-      t42 = /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "flex size-full items-center justify-center", children: /* @__PURE__ */ jsxRuntimeExports.jsx(Container, { className: "flex max-w-xl flex-col gap-4 p-6", children: /* @__PURE__ */ jsxRuntimeExports.jsx(NoApplicationURLView, {}) }) });
+      t42 = /* @__PURE__ */ jsxRuntimeExports.jsx(Container, { className: "max-w-xl", padding: "xl", roundedSize: "2xl", children: /* @__PURE__ */ jsxRuntimeExports.jsx(NoApplicationURLView, {}) });
       $2[4] = t42;
     } else {
       t42 = $2[4];