dirk-cfx-react 1.1.62 → 1.1.64

package/dist/index.js

@@ -1,13 +1,13 @@
-import { Flex, Text, Image as Image$1, createTheme, Box, Stack, Title as Title$1, Code, TextInput, Select, useMantineTheme, alpha, Progress, RingProgress, Portal, Button, Loader, ActionIcon, MantineProvider, BackgroundImage, Group, JsonInput } from '@mantine/core';
+import { Flex, Text, Image as Image$1, createTheme, Box, Stack, Title as Title$1, Code, TextInput, Select, useMantineTheme, Tooltip, alpha, Progress, RingProgress, Portal, Button, Loader, ActionIcon, MantineProvider, BackgroundImage, Group, JsonInput } from '@mantine/core';
 import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
 import React5, { createContext, useContext, useEffect, useRef, useState, useMemo, useLayoutEffect } from 'react';
 import { create, useStore, createStore } from 'zustand';
 import axios from 'axios';
 import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
 import { motion, AnimatePresence, useMotionValue } from 'framer-motion';
+import { Info, X, AlertTriangle, Trash2, Check, FlaskConical, ChevronUp, ChevronDown, ArrowLeft, Undo2, Redo2, Save, History, XCircle, Code2, RotateCcw, Search, Filter, User } from 'lucide-react';
 import clickSoundUrl from './click_sound-PNCRRTM4.mp3';
 import hoverSoundUrl from './hover_sound-NBUA222C.mp3';
-import { X, AlertTriangle, Trash2, Check, FlaskConical, ChevronUp, ChevronDown, ArrowLeft, Undo2, Redo2, Save, History, XCircle, Code2, RotateCcw, Search, Filter, User } from 'lucide-react';
 import { QueryClient, QueryClientProvider, useInfiniteQuery } from '@tanstack/react-query';
 import '@mantine/core/styles.css';
 import '@mantine/notifications/styles.css';
@@ -1306,8 +1306,12 @@ async function fetchNui(eventName, data, mockData) {
   }
   const overrideResourceName = useSettings.getState().overideResourceName;
   const resourceName = window.GetParentResourceName ? window.GetParentResourceName() : overrideResourceName ? overrideResourceName : "dirk-cfx-react";
-  const resp = await fetch(`https://${resourceName}/${eventName}`, options);
-  return await resp.json();
+  try {
+    const resp = await fetch(`https://${resourceName}/${eventName}`, options);
+    return await resp.json();
+  } catch {
+    return mockData ?? {};
+  }
 }
 var initialFetches = {};
 async function registerInitialFetch(eventName, data, mockData) {
@@ -1354,6 +1358,13 @@ var internalEvent = (events, timer = 1e3) => {
     }
   }
 };
+var reportedMissing = /* @__PURE__ */ new Set();
+function reportMissingLocale(key) {
+  if (!key || reportedMissing.has(key)) return;
+  reportedMissing.add(key);
+  fetchNui("REPORT_MISSING_LOCALE", { key }).catch(() => {
+  });
+}
 var localeStore = create((set, get) => {
   return {
     locales: {
@@ -1361,6 +1372,7 @@ var localeStore = create((set, get) => {
     },
     locale: (key, ...args) => {
       const exists = get().locales[key];
+      if (!exists) reportMissingLocale(key);
       let translation = exists || key;
       if (args.length) {
         translation = translation.replace(/%s/g, () => String(args.shift() || ""));
@@ -1374,6 +1386,14 @@ registerInitialFetch("GET_LOCALES", void 0).then((data) => {
   localeStore.setState({ locales: data });
 }).catch(() => {
 });
+if (typeof window !== "undefined") {
+  window.addEventListener("message", (event) => {
+    const msg = event.data;
+    if (!msg || msg.action !== "UPDATE_DIRK_LIB_LOCALES") return;
+    if (!msg.data || typeof msg.data !== "object") return;
+    localeStore.setState({ locales: msg.data });
+  });
+}
 
 // src/utils/map.ts
 var mapCenter = [-119.43, 58.84];
@@ -2536,8 +2556,8 @@ function InputContainer(props) {
               (props.title || props.description) && /* @__PURE__ */ jsxs(
                 Flex,
                 {
-                  direction: "column",
-                  gap: "xxs",
+                  align: "center",
+                  flex: 1,
                   p: props.p == "0" ? "sm" : 0,
                   children: [
                     props.title && /* @__PURE__ */ jsx(
@@ -2554,12 +2574,26 @@ function InputContainer(props) {
                       }
                     ),
                     props.description && /* @__PURE__ */ jsx(
-                      Text,
+                      Tooltip,
                       {
-                        size: "xs",
-                        c: "rgba(255, 255, 255, 0.8)",
-                        fw: 400,
-                        children: props.description
+                        label: props.description,
+                        position: "top-end",
+                        withArrow: true,
+                        multiline: true,
+                        maw: "22vh",
+                        styles: {
+                          tooltip: {
+                            background: alpha(theme2.colors.dark[7], 0.95),
+                            border: `0.1vh solid rgba(255,255,255,0.1)`,
+                            color: "rgba(255,255,255,0.75)",
+                            fontFamily: "Akrobat Bold",
+                            fontSize: "1.3vh",
+                            lineHeight: 1.3,
+                            padding: "0.6vh 0.8vh",
+                            letterSpacing: "0.03em"
+                          }
+                        },
+                        children: /* @__PURE__ */ jsx(Flex, { align: "center", justify: "center", style: { marginLeft: "auto", cursor: "help" }, children: /* @__PURE__ */ jsx(Info, { size: "1.6vh", color: alpha(theme2.colors[theme2.primaryColor][5], 0.45) }) })
                       }
                     )
                   ]
@@ -2576,13 +2610,7 @@ function InputContainer(props) {
                   children: props.error
                 }
               ),
-              /* @__PURE__ */ jsx(
-                Flex,
-                {
-                  ml: "auto",
-                  children: props.rightSection
-                }
-              )
+              props.rightSection && /* @__PURE__ */ jsx(Flex, { children: props.rightSection })
             ]
           }
         ),
@@ -5177,6 +5205,11 @@ function mergeMantineThemeSafe(base, custom, override) {
   const colors = { ...base.colors };
   if (custom && isValidColorScale(custom)) {
     colors["custom"] = custom;
+  } else if (!colors["custom"]) {
+    const fallback = base.colors && base.colors.dirk;
+    if (fallback && isValidColorScale(fallback)) {
+      colors["custom"] = fallback;
+    }
   }
   return {
     ...base,
@@ -5250,6 +5283,7 @@ function DirkProvider({ children, overideResourceName, themeOverride }) {
     customTheme,
     game
   } = useSettings();
+  localeStore((s) => s.locales);
   useLayoutEffect(() => {
     useSettings.setState({
       overideResourceName
@@ -5270,6 +5304,10 @@ function DirkProvider({ children, overideResourceName, themeOverride }) {
       console.error("Failed to fetch initial settings within dirk-cfx-react:", err);
     });
   }, []);
+  useNuiEvent("UPDATE_DIRK_LIB_SETTINGS", (data) => {
+    if (!data || typeof data !== "object") return;
+    useSettings.setState(data);
+  });
   const mergedTheme = useMemo(
     () => mergeMantineThemeSafe(
       { ...theme_default, primaryColor, primaryShade },