dirk-cfx-react 1.0.34 → 1.0.36

package/dist/index.js

@@ -1,19 +1,20 @@
 import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
-import { Flex, Text, Image, createTheme, useMantineTheme, MantineProvider, BackgroundImage } from '@mantine/core';
-import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
-import { motion, AnimatePresence, useMotionValue } from 'framer-motion';
-import { createContext, useRef, useState, useEffect, useContext, useMemo } from 'react';
-import { create, useStore } from 'zustand';
-import clickSoundUrl from './click_sound-PNCRRTM4.mp3';
-import hoverSoundUrl from './hover_sound-NBUA222C.mp3';
+import { createTheme, Flex, Text, Image, MantineProvider, BackgroundImage, useMantineTheme } from '@mantine/core';
+import { createContext, useRef, useEffect, useMemo, useState, useContext } from 'react';
 import '@mantine/core/styles.css';
 import '@mantine/notifications/styles.css';
 import './styles/fonts.css';
 import './styles/scrollBar.css';
+import './styles/tornEdge.css';
 import { library } from '@fortawesome/fontawesome-svg-core';
 import { fab } from '@fortawesome/free-brands-svg-icons';
 import { far } from '@fortawesome/free-regular-svg-icons';
 import { fas } from '@fortawesome/free-solid-svg-icons';
+import { create, useStore } from 'zustand';
+import { jsx, Fragment, jsxs } from 'react/jsx-runtime';
+import { motion, AnimatePresence, useMotionValue } from 'framer-motion';
+import clickSoundUrl from './click_sound-PNCRRTM4.mp3';
+import hoverSoundUrl from './hover_sound-NBUA222C.mp3';
 
 // src/components/BorderedIcon.tsx
 
@@ -184,15 +185,804 @@ function colorWithAlpha(color, alpha) {
   }
   return color;
 }
+
+// src/utils/misc.ts
+var isEnvBrowser = () => !window.invokeNative;
+var noop = () => {
+};
+var splitFAString = (faString) => {
+  const [prefix, newIcon] = faString.split("-");
+  if (!prefix || !newIcon) return { prefix: "fas", newIcon: "question" };
+  return { prefix, newIcon };
+};
+var numberToRoman = (num) => {
+  const romanNumerals = ["I", "II", "III", "IV", "V", "VI", "VII", "VIII", "IX", "X", "XI", "XII", "XIII", "XIV", "XV", "XVI", "XVII", "XVIII", "XIX", "XX"];
+  return romanNumerals[num];
+};
+var copyToClipboard = (text) => {
+  const el = document.createElement("textarea");
+  el.value = text;
+  document.body.appendChild(el);
+  el.select();
+  document.execCommand("copy");
+  document.body.removeChild(el);
+};
+var openLink = (url) => {
+  if (isEnvBrowser()) {
+    window.open(url, "_blank");
+  } else {
+    window.invokeNative("openLink", url);
+  }
+};
+
+// src/hooks/useNuiEvent.ts
+var useNuiEvent = (action, handler) => {
+  const savedHandler = useRef(noop);
+  useEffect(() => {
+    savedHandler.current = handler;
+  }, [handler]);
+  useEffect(() => {
+    const eventListener = (event) => {
+      const { action: eventAction, data } = event.data;
+      if (savedHandler.current) {
+        if (eventAction === action) {
+          savedHandler.current(data);
+        }
+      }
+    };
+    window.addEventListener("message", eventListener);
+    return () => window.removeEventListener("message", eventListener);
+  }, [action]);
+};
+async function fetchNui(eventName, data, mockData) {
+  const options = {
+    method: "post",
+    headers: {
+      "Content-Type": "application/json; charset=UTF-8"
+    },
+    body: JSON.stringify(data)
+  };
+  console.log(mockData);
+  if (isEnvBrowser() && mockData) return mockData;
+  if (isEnvBrowser() && mockData === void 0) {
+    console.warn(
+      `[fetchNui] Called fetchNui for event "${eventName}" in browser environment without mockData. Returning empty object.`
+    );
+    return {};
+  }
+  const resourceName = window.GetParentResourceName ? window.GetParentResourceName() : "nui-frame-app";
+  const resp = await fetch(`https://${resourceName}/${eventName}`, options);
+  return await resp.json();
+}
+var initialFetches = {};
+async function registerInitialFetch(eventName, data, mockData) {
+  const fetcher = () => fetchNui(eventName, data, mockData);
+  initialFetches[eventName] = fetcher;
+  return fetcher();
+}
+async function runFetches() {
+  return Promise.all(
+    Object.entries(initialFetches).map(async ([eventName, fetcher]) => {
+      const data = await fetcher();
+      return { eventName, data };
+    })
+  );
+}
+var useAutoFetcher = () => {
+  useEffect(() => {
+    if (isEnvBrowser()) return;
+    const run = async () => {
+      const results = await runFetches();
+      console.log("[useAutoFetcher] Fetched initial data:", results);
+    };
+    run();
+  }, []);
+};
+
+// src/utils/internalEvent.ts
+var internalEvent = (events, timer = 1e3) => {
+  if (isEnvBrowser()) {
+    for (const event of events) {
+      setTimeout(() => {
+        window.dispatchEvent(
+          new MessageEvent("message", {
+            data: {
+              action: event.action,
+              data: event.data
+            }
+          })
+        );
+      }, timer);
+    }
+  }
+};
+var localeStore = create((set, get) => {
+  return {
+    locales: {
+      "OccupantsDesc": "Here you can view and manage the occupants of your traphouse. These occupants can be used mainly for selling drugs to the NPCs surrounding your traphouse. However they have other uses to so be careful who you add as an occupant."
+    },
+    locale: (key, ...args) => {
+      const exists = get().locales[key];
+      let translation = exists || key;
+      if (args.length) {
+        translation = translation.replace(/%s/g, () => String(args.shift() || ""));
+      }
+      return translation;
+    }
+  };
+});
+var locale = localeStore.getState().locale;
+registerInitialFetch("GET_LOCALES", void 0).then((data) => {
+  localeStore.setState({ locales: data });
+});
+var useProfanityStore = create(() => [
+  "ars3",
+  "a55",
+  "a55hole",
+  "ahole",
+  "anus",
+  "ash0le",
+  "ash0les",
+  "asholes",
+  "4r5e",
+  "5h1t",
+  "5hit",
+  "a55",
+  "anal",
+  "anus",
+  "ar5e",
+  "arrse",
+  "arse",
+  "ass",
+  "ass-fucker",
+  "asses",
+  "assfucker",
+  "assfukka",
+  "asshole",
+  "assholes",
+  "asswhole",
+  "a_s_s",
+  "b!tch",
+  "b00bs",
+  "b17ch",
+  "b1tch",
+  "ballsack",
+  "beastial",
+  "beastiality",
+  "bestial",
+  "bestiality",
+  "bi+ch",
+  "biatch",
+  "bitch",
+  "bitcher",
+  "bitchers",
+  "bitches",
+  "bitchin",
+  "bitching",
+  "blow job",
+  "blowjob",
+  "blowjobs",
+  "boiolas",
+  "bollock",
+  "bollok",
+  "boner",
+  "boob",
+  "boobs",
+  "booobs",
+  "boooobs",
+  "booooobs",
+  "booooooobs",
+  "breasts",
+  "buceta",
+  "bunny fucker",
+  "butthole",
+  "buttmuch",
+  "buttplug",
+  "c0ck",
+  "c0cksucker",
+  "carpet muncher",
+  "chink",
+  "cipa",
+  "cl1t",
+  "clit",
+  "clitoris",
+  "clits",
+  "cnut",
+  "cock",
+  "cock-sucker",
+  "cockface",
+  "cockhead",
+  "cockmunch",
+  "cockmuncher",
+  "cocks",
+  "cocksuck",
+  "cocksucked",
+  "cocksucker",
+  "cocksucking",
+  "cocksucks",
+  "cocksuka",
+  "cocksukka",
+  "cokmuncher",
+  "coksucka",
+  "coon",
+  "cum",
+  "cummer",
+  "cumming",
+  "cums",
+  "cumshot",
+  "cunilingus",
+  "cunillingus",
+  "cunnilingus",
+  "cunt",
+  "cuntlick",
+  "cuntlicker",
+  "cuntlicking",
+  "cunts",
+  "cyalis",
+  "cyberfuc",
+  "cyberfuck",
+  "cyberfucked",
+  "cyberfucker",
+  "cyberfuckers",
+  "cyberfucking",
+  "d1ck",
+  "dlck",
+  "dog-fucker",
+  "doggin",
+  "dogging",
+  "donkeyribber",
+  "dyke",
+  "ejaculate",
+  "ejaculated",
+  "ejaculates",
+  "ejaculating",
+  "ejaculatings",
+  "ejaculation",
+  "ejakulate",
+  "f u c k",
+  "f u c k e r",
+  "f4nny",
+  "fag",
+  "fagging",
+  "faggitt",
+  "faggot",
+  "faggs",
+  "fagot",
+  "fagots",
+  "fags",
+  "fannyflaps",
+  "fannyfucker",
+  "fatass",
+  "fcuk",
+  "fcuker",
+  "fcuking",
+  "feck",
+  "fecker",
+  "felching",
+  "fellate",
+  "fellatio",
+  "fingerfuck",
+  "fingerfucked",
+  "fingerfucker",
+  "fingerfuckers",
+  "fingerfucking",
+  "fingerfucks",
+  "fistfuck",
+  "fistfucked",
+  "fistfucker",
+  "fistfuckers",
+  "fistfucking",
+  "fistfuckings",
+  "fistfucks",
+  "fuck",
+  "fucka",
+  "fucked",
+  "fucker",
+  "fuckers",
+  "fuckhead",
+  "fuckheads",
+  "fuckin",
+  "fucking",
+  "fuckings",
+  "fuckingshitmotherfucker",
+  "fuckme",
+  "fucks",
+  "fuckwhit",
+  "fuckwit",
+  "fudge packer",
+  "fudgepacker",
+  "fuk",
+  "fuker",
+  "fukker",
+  "fukkin",
+  "fuks",
+  "fukwhit",
+  "fukwit",
+  "fux",
+  "fux0r",
+  "f_u_c_k",
+  "gangbang",
+  "gangbanged",
+  "gangbangs",
+  "gaysex",
+  "God",
+  "god-dam",
+  "god-damned",
+  "goddamn",
+  "goddamned",
+  "homo",
+  "jack-off",
+  "jerk-off",
+  "l3i+ch",
+  "l3itch",
+  "labia",
+  "lusting",
+  "m0f0",
+  "m0fo",
+  "m45terbate",
+  "ma5terb8",
+  "ma5terbate",
+  "masochist",
+  "master-bate",
+  "masterb8",
+  "masterbat*",
+  "masterbat3",
+  "masterbate",
+  "masterbation",
+  "masterbations",
+  "masturbate",
+  "mo-fo",
+  "mof0",
+  "mothafuck",
+  "mothafucka",
+  "mothafuckas",
+  "mothafuckaz",
+  "mothafucked",
+  "mothafucker",
+  "mothafuckers",
+  "mothafuckin",
+  "mothafucking",
+  "mothafuckings",
+  "mothafucks",
+  "mother fucker",
+  "motherfuck",
+  "motherfucked",
+  "motherfucker",
+  "motherfuckers",
+  "motherfuckin",
+  "motherfucking",
+  "motherfuckings",
+  "motherfuckka",
+  "motherfucks",
+  "muthafecker",
+  "muthafuckker",
+  "mutherfucker",
+  "n1gga",
+  "n1gger",
+  "nazi",
+  "nigg3r",
+  "nigg4h",
+  "nigga",
+  "niggah",
+  "niggas",
+  "niggaz",
+  "nigger",
+  "niggers",
+  "nob jokey",
+  "nobjocky",
+  "nobjokey",
+  "orgasim",
+  "orgasims",
+  "orgasm",
+  "orgasms",
+  "p0rn",
+  "penis",
+  "penisfucker",
+  "phonesex",
+  "phuck",
+  "phuked",
+  "phuking",
+  "phukked",
+  "phukking",
+  "phuks",
+  "phuq",
+  "pigfucker",
+  "pimpis",
+  "piss",
+  "pissed",
+  "pisser",
+  "pissers",
+  "pisses",
+  "pissflaps",
+  "pissin",
+  "pissing",
+  "pissoff",
+  "poop",
+  "porn",
+  "porno",
+  "pornography",
+  "pornos",
+  "prick",
+  "pricks",
+  "pron",
+  "pube",
+  "pusse",
+  "pussi",
+  "pussies",
+  "pussy",
+  "pussys",
+  "rectum",
+  "retard",
+  "rimjaw",
+  "rimming",
+  "s hit",
+  "s.o.b.",
+  "scroat",
+  "scrote",
+  "scrotum",
+  "semen",
+  "sex",
+  "sh!+",
+  "sh!t",
+  "sh1t",
+  "shemale",
+  "shit",
+  "shitdick",
+  "shite",
+  "shited",
+  "shitey",
+  "shitfuck",
+  "shitfull",
+  "shithead",
+  "shiting",
+  "shitings",
+  "shits",
+  "shitted",
+  "shitter",
+  "shitters",
+  "shitting",
+  "shittings",
+  "shitty",
+  "skank",
+  "slut",
+  "sluts",
+  "smegma",
+  "smut",
+  "son-of-a-bitch",
+  "spac",
+  "s_h_i_t",
+  "t1tt1e5",
+  "t1tties",
+  "teets",
+  "teez",
+  "testical",
+  "testicle",
+  "titfuck",
+  "tits",
+  "titt",
+  "tittie5",
+  "tittiefucker",
+  "titties",
+  "tittyfuck",
+  "tittywank",
+  "titwank",
+  "tosser",
+  "tw4t",
+  "twat",
+  "twathead",
+  "twatty",
+  "twunt",
+  "twunter",
+  "v14gra",
+  "v1gra",
+  "vagina",
+  "viagra",
+  "vulva",
+  "w00se",
+  "whoar",
+  "whore",
+  "xrated"
+]);
+var isProfanity = (word) => {
+  const all = useProfanityStore.getState();
+  const profanityArray = Array.isArray(all) ? all : typeof all === "object" && all !== null ? Object.values(all) : [];
+  return profanityArray.includes(word);
+};
+function calculateXPForLevel(level, settings) {
+  if (level < settings.baseLevel) return 0;
+  if (level === 1) return 0;
+  if (level === 2) return settings.baseXP;
+  let totalXP = settings.baseXP;
+  for (let i = 2; i <= level - 1; i++) {
+    const baseRuneScapeXP = Math.floor((i + 300 * 2 ** (i / 7)) / 4);
+    totalXP += baseRuneScapeXP * settings.modifier;
+  }
+  return Math.floor(totalXP);
+}
+function generateLevelMap(settings) {
+  const levelMap = {};
+  for (let level = settings.baseLevel; level <= settings.maxLevel; level++) {
+    levelMap[level.toString()] = calculateXPForLevel(level, settings);
+  }
+  return levelMap;
+}
+function getLevelFromXP(xp, levelMap, settings) {
+  for (let level = settings.baseLevel; level <= settings.maxLevel; level++) {
+    const xpForLevel = levelMap[level.toString()];
+    if (xpForLevel > xp) return level - 1;
+  }
+  return settings.maxLevel;
+}
+function createSkill(defaultSettings) {
+  const useStore2 = create((set) => ({
+    settings: defaultSettings,
+    levelMap: generateLevelMap(defaultSettings),
+    setSettings: (updater) => set((state) => {
+      const newSettings = typeof updater === "function" ? updater(state.settings) : updater;
+      return {
+        settings: newSettings,
+        levelMap: generateLevelMap(newSettings)
+      };
+    })
+  }));
+  const useSkill = (xp) => {
+    const { settings, levelMap } = useStore2();
+    return useMemo(() => {
+      const currentLevel = getLevelFromXP(xp, levelMap, settings);
+      const nextLevel = Math.min(currentLevel + 1, settings.maxLevel);
+      const currentLevelXP = levelMap[currentLevel.toString()] || 0;
+      const nextLevelXP = levelMap[nextLevel.toString()] || 0;
+      const xpInCurrentLevel = xp - currentLevelXP;
+      const xpRequiredForLevel = nextLevelXP - currentLevelXP;
+      const progressToLevel = xpRequiredForLevel > 0 ? xpInCurrentLevel / xpRequiredForLevel * 100 : 100;
+      const xpToNextLevel = Math.max(0, nextLevelXP - xp);
+      return {
+        currentLevel,
+        nextLevel,
+        currentLevelXP,
+        nextLevelXP,
+        progressToLevel: Math.min(100, Math.max(0, progressToLevel)),
+        xpToNextLevel
+      };
+    }, [xp, levelMap, settings]);
+  };
+  const skill = {
+    get settings() {
+      return useStore2.getState().settings;
+    },
+    setSettings: (updater) => {
+      useStore2.getState().setSettings(updater);
+    },
+    useSettings: () => useStore2((state) => state.settings)
+  };
+  return {
+    skill,
+    useSkill
+  };
+}
+var theme = createTheme({
+  primaryColor: "dirk",
+  primaryShade: 9,
+  defaultRadius: "xxs",
+  fontFamily: "Akrobat Regular, sans-serif",
+  radius: {
+    xxs: "0.2vh",
+    xs: "0.4vh",
+    sm: "0.75vh",
+    md: "1vh",
+    lg: "1.5vh",
+    xl: "2vh",
+    xxl: "3vh"
+  },
+  fontSizes: {
+    xxs: "1.2vh",
+    xs: "1.5vh",
+    sm: "1.8vh",
+    md: "2.2vh",
+    lg: "2.8vh",
+    xl: "3.3vh",
+    xxl: "3.8vh"
+  },
+  spacing: {
+    xxs: "0.5vh",
+    xs: "0.75vh",
+    sm: "1.5vh",
+    md: "2vh",
+    lg: "3vh",
+    xl: "4vh",
+    xxl: "5vh"
+  },
+  components: {
+    Progress: {
+      styles: {
+        root: {
+          backgroundColor: "rgba(77, 77, 77, 0.4)"
+        }
+      }
+    },
+    Select: {
+      styles: {
+        dropdown: {
+          borderRadius: "var(--mantine-radius-xxs)"
+        },
+        input: {
+          padding: "var(--mantine-spacing-sm)"
+        },
+        item: {
+          borderRadius: "var(--mantine-radius-xxs)"
+        },
+        wrapper: {
+          borderRadius: "var(--mantine-radius-xxs)"
+        },
+        option: {
+          borderRadius: "var(--mantine-radius-xxs)"
+        }
+      }
+    },
+    MultiSelect: {
+      styles: {
+        dropdown: {
+          borderRadius: "var(--mantine-radius-xxs)"
+        },
+        pill: {
+          borderRadius: "var(--mantine-radius-xxs)"
+        },
+        item: {
+          borderRadius: "var(--mantine-radius-xxs)"
+        },
+        wrapper: {
+          borderRadius: "var(--mantine-radius-xxs)"
+        },
+        option: {
+          borderRadius: "var(--mantine-radius-xxs)"
+        }
+      }
+    },
+    TextInput: {
+      styles: {
+        section: {
+          marginRight: "0.2vh"
+        },
+        input: {
+          padding: "var(--mantine-spacing-sm)"
+        }
+      }
+    }
+  },
+  colors: {
+    dark: [
+      "#ffffff",
+      "#e2e2e2",
+      "#c6c6c6",
+      "#aaaaaa",
+      "#8d8d8d",
+      "#717171",
+      "#555555",
+      "#393939",
+      "#1c1c1c",
+      "#000000"
+    ],
+    dirk: [
+      "#ffffff",
+      "#f3fce9",
+      "#dbf5bd",
+      "#c3ee91",
+      "#ace765",
+      "#94e039",
+      "#7ac61f",
+      "#5f9a18",
+      "#29420a",
+      "#446e11"
+    ]
+  }
+});
+var theme_default = theme;
+library.add(fas, far, fab);
+var useSettings = create((set) => ({
+  game: "fivem",
+  primaryColor: "dirk",
+  primaryShade: 9,
+  itemImgPath: "https://assets.dirkcfx.com/items/",
+  customTheme: {}
+}));
+function DirkProvider(props) {
+  const primaryColor = useSettings((data) => data.primaryColor);
+  const primaryShade = useSettings((data) => data.primaryShade);
+  const customTheme = useSettings((data) => data.customTheme);
+  const game = useSettings((data) => data.game);
+  const mergedTheme = useMemo(() => ({
+    ...theme_default,
+    primaryColor,
+    primaryShade,
+    colors: {
+      ...theme_default.colors,
+      ...customTheme
+      // Custom theme colors will override/extend base colors
+    }
+  }), [primaryColor, primaryShade, customTheme]);
+  useEffect(() => {
+    document.fonts.ready.then(() => {
+      document.body.style.fontFamily = game === "rdr3" ? '"Red Dead", sans-serif' : game === "fivem" ? '"Akrobat Regular", sans-serif' : "sans-serif";
+      console.log(`Game set to ${game}, applied corresponding font family.: ${document.body.style.fontFamily}`);
+    });
+  }, [game]);
+  useAutoFetcher();
+  return /* @__PURE__ */ jsx(MantineProvider, { theme: mergedTheme, defaultColorScheme: "dark", children: /* @__PURE__ */ jsx(Wrapper, { children: props.children }) });
+}
+function Wrapper({ children }) {
+  const game = useSettings((data) => data.game);
+  return isEnvBrowser() ? /* @__PURE__ */ jsx(
+    BackgroundImage,
+    {
+      w: "100vw",
+      h: "100vh",
+      style: { overflow: "hidden" },
+      src: game === "fivem" ? "https://i.ytimg.com/vi/TOxuNbXrO28/maxresdefault.jpg" : "https://raw.githubusercontent.com/Jump-On-Studios/RedM-jo_libs/refs/heads/main/source-repositories/Menu/public/assets/images/background_dev.jpg",
+      children
+    }
+  ) : /* @__PURE__ */ jsx(Fragment, { children });
+}
+function useTornEdges() {
+  const game = useSettings((state) => state.game);
+  return game === "rdr3" ? "torn-edge-wrapper" : "";
+}
+function TornEdgeSVGFilter() {
+  return /* @__PURE__ */ jsx(
+    "svg",
+    {
+      style: { position: "absolute", width: 0, height: 0, pointerEvents: "none" },
+      "aria-hidden": "true",
+      children: /* @__PURE__ */ jsx("defs", { children: /* @__PURE__ */ jsxs("filter", { id: "torn-edge-filter", x: "-50%", y: "-50%", width: "200%", height: "200%", children: [
+        /* @__PURE__ */ jsx(
+          "feTurbulence",
+          {
+            type: "fractalNoise",
+            baseFrequency: "0.018 0.022",
+            numOctaves: "5",
+            seed: "9",
+            result: "noise1"
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          "feTurbulence",
+          {
+            type: "fractalNoise",
+            baseFrequency: "0.08 0.12",
+            numOctaves: "2",
+            seed: "3",
+            result: "noise2"
+          }
+        ),
+        /* @__PURE__ */ jsx("feBlend", { in: "noise1", in2: "noise2", mode: "multiply", result: "combinedNoise" }),
+        /* @__PURE__ */ jsx(
+          "feDisplacementMap",
+          {
+            in: "SourceGraphic",
+            in2: "combinedNoise",
+            scale: "52",
+            xChannelSelector: "R",
+            yChannelSelector: "G",
+            result: "displaced"
+          }
+        ),
+        /* @__PURE__ */ jsx("feGaussianBlur", { stdDeviation: "0.8", in: "displaced", result: "blurred" }),
+        /* @__PURE__ */ jsx("feComponentTransfer", { in: "blurred", result: "alphaFade", children: /* @__PURE__ */ jsx("feFuncA", { type: "gamma", amplitude: "1", exponent: "1.3", offset: "-0.05" }) }),
+        /* @__PURE__ */ jsx("feMorphology", { operator: "erode", radius: "0.4", in: "alphaFade", result: "eroded" }),
+        /* @__PURE__ */ jsx("feMerge", { children: /* @__PURE__ */ jsx("feMergeNode", { in: "eroded" }) })
+      ] }) })
+    }
+  );
+}
 function BorderedIcon(props) {
   const theme2 = useMantineTheme();
+  const tornEdgeCSS = useTornEdges();
   return /* @__PURE__ */ jsx(
-    FontAwesomeIcon,
+    Flex,
     {
-      icon: props.icon,
-      color: colorWithAlpha(props.color ? props.color : theme2.colors[theme2.primaryColor][theme2.primaryShade], props.hovered ? 0.9 : 0.9),
+      className: tornEdgeCSS,
+      justify: "center",
+      align: "center",
       style: {
-        // backgroundColor: colorWithAlpha(props.color ? props.color : theme.colors[theme.primaryColor][7 as number], (props.hoverable ? (props.hovered ? 0.3 : 0.2) : 0.2)),
         backgroundColor: "rgba(0, 0, 0, 0.5)",
         padding: props.p || theme2.spacing.xs,
         transition: "all 0.2s ease-in-out",
@@ -200,9 +990,19 @@ function BorderedIcon(props) {
         fontSize: props.fontSize ? props.fontSize : "2.5vh",
         borderRadius: theme2.radius.xs,
         // border: `2px solid var(--mantine-primary-color-9)`,
-        outline: `0.2vh solid ${colorWithAlpha(props.color ? props.color : theme2.colors[theme2.primaryColor][9], 0.8)}`,
+        // outline: `0.2vh solid ${colorWithAlpha(props.color ? props.color : theme.colors[theme.primaryColor][9], 0.8)}`,
         boxShadow: `inset 0 0 2vh ${colorWithAlpha(props.color ? props.color : theme2.colors[theme2.primaryColor][7], 0.5)}`
-      }
+      },
+      children: /* @__PURE__ */ jsx(
+        FontAwesomeIcon,
+        {
+          icon: props.icon,
+          color: colorWithAlpha(props.color ? props.color : theme2.colors[theme2.primaryColor][theme2.primaryShade], props.hovered ? 0.9 : 0.9),
+          style: {
+            // backgroundColor: colorWithAlpha(props.color ? props.color : theme.colors[theme.primaryColor][7 as number], (props.hoverable ? (props.hovered ? 0.3 : 0.2) : 0.2)),
+          }
+        }
+      )
     }
   );
 }
@@ -526,179 +1326,79 @@ function InputContainer(props) {
                     props.title && /* @__PURE__ */ jsx(
                       Text,
                       {
-                        size: "sm",
-                        style: {
-                          lineHeight: "1.25vh",
-                          fontFamily: "Akrobat Bold",
-                          letterSpacing: "0.05em",
-                          textTransform: "uppercase"
-                        },
-                        children: props.title
-                      }
-                    ),
-                    props.description && /* @__PURE__ */ jsx(
-                      Text,
-                      {
-                        size: "xs",
-                        c: "rgba(255, 255, 255, 0.8)",
-                        fw: 400,
-                        children: props.description
-                      }
-                    )
-                  ]
-                }
-              ),
-              props.error && /* @__PURE__ */ jsx(
-                Text,
-                {
-                  size: "xs",
-                  c: theme2.colors.red[9],
-                  fw: 600,
-                  mb: "auto",
-                  lh: "0.8",
-                  children: props.error
-                }
-              ),
-              /* @__PURE__ */ jsx(
-                Flex,
-                {
-                  ml: "auto",
-                  children: props.rightSection
-                }
-              )
-            ]
-          }
-        ),
-        props.children
-      ]
-    }
-  );
-}
-var useAudio = create(() => {
-  const audioRefs = {};
-  const sounds = {
-    click: clickSoundUrl,
-    hover: hoverSoundUrl
-  };
-  for (const [key, src] of Object.entries(sounds)) {
-    audioRefs[key] = new Audio(src);
-  }
-  return {
-    play: (sound) => {
-      const audio = audioRefs[sound];
-      if (!audio) return console.warn(`Sound '${sound}' not found.`);
-      audio.currentTime = 0;
-      audio.volume = 0.1;
-      audio.play();
-    },
-    stop: (sound) => {
-      const audio = audioRefs[sound];
-      if (!audio) return console.warn(`Sound '${sound}' not found.`);
-      audio.pause();
-      audio.currentTime = 0;
-    }
-  };
-});
-
-// src/utils/misc.ts
-var isEnvBrowser = () => !window.invokeNative;
-var noop = () => {
-};
-var splitFAString = (faString) => {
-  const [prefix, newIcon] = faString.split("-");
-  if (!prefix || !newIcon) return { prefix: "fas", newIcon: "question" };
-  return { prefix, newIcon };
-};
-var numberToRoman = (num) => {
-  const romanNumerals = ["I", "II", "III", "IV", "V", "VI", "VII", "VIII", "IX", "X", "XI", "XII", "XIII", "XIV", "XV", "XVI", "XVII", "XVIII", "XIX", "XX"];
-  return romanNumerals[num];
-};
-var copyToClipboard = (text) => {
-  const el = document.createElement("textarea");
-  el.value = text;
-  document.body.appendChild(el);
-  el.select();
-  document.execCommand("copy");
-  document.body.removeChild(el);
-};
-var openLink = (url) => {
-  if (isEnvBrowser()) {
-    window.open(url, "_blank");
-  } else {
-    window.invokeNative("openLink", url);
-  }
-};
-
-// src/utils/fetchNui.ts
-async function fetchNui(eventName, data, mockData) {
-  const options = {
-    method: "post",
-    headers: {
-      "Content-Type": "application/json; charset=UTF-8"
-    },
-    body: JSON.stringify(data)
-  };
-  if (isEnvBrowser() && mockData !== void 0) return mockData;
-  if (isEnvBrowser()) {
-    console.warn(
-      `[fetchNui] Called fetchNui for event "${eventName}" in browser environment without mockData. Returning empty object.`
-    );
-    return {};
-  }
-  const resourceName = window.GetParentResourceName ? window.GetParentResourceName() : "nui-frame-app";
-  const resp = await fetch(`https://${resourceName}/${eventName}`, options);
-  const respFormatted = await resp.json();
-  return respFormatted;
-}
-function fetchOnLoad(eventName, data, mockData) {
-  return fetchNui(eventName, data, mockData).catch((err) => {
-    console.error(`[fetchOnLoad] Failed for ${eventName}:`, err);
-    throw err;
-  });
-}
-var fetchLuaTable = (tableName) => () => {
-  if (isEnvBrowser()) {
-    return Promise.resolve({});
-  }
-  return fetchNui("GET_LUA_TABLE", { tableName });
-};
-
-// src/utils/internalEvent.ts
-var internalEvent = (events, timer = 1e3) => {
-  if (isEnvBrowser()) {
-    for (const event of events) {
-      setTimeout(() => {
-        window.dispatchEvent(
-          new MessageEvent("message", {
-            data: {
-              action: event.action,
-              data: event.data
-            }
-          })
-        );
-      }, timer);
+                        size: "sm",
+                        style: {
+                          lineHeight: "1.25vh",
+                          fontFamily: "Akrobat Bold",
+                          letterSpacing: "0.05em",
+                          textTransform: "uppercase"
+                        },
+                        children: props.title
+                      }
+                    ),
+                    props.description && /* @__PURE__ */ jsx(
+                      Text,
+                      {
+                        size: "xs",
+                        c: "rgba(255, 255, 255, 0.8)",
+                        fw: 400,
+                        children: props.description
+                      }
+                    )
+                  ]
+                }
+              ),
+              props.error && /* @__PURE__ */ jsx(
+                Text,
+                {
+                  size: "xs",
+                  c: theme2.colors.red[9],
+                  fw: 600,
+                  mb: "auto",
+                  lh: "0.8",
+                  children: props.error
+                }
+              ),
+              /* @__PURE__ */ jsx(
+                Flex,
+                {
+                  ml: "auto",
+                  children: props.rightSection
+                }
+              )
+            ]
+          }
+        ),
+        props.children
+      ]
     }
+  );
+}
+var useAudio = create(() => {
+  const audioRefs = {};
+  const sounds = {
+    click: clickSoundUrl,
+    hover: hoverSoundUrl
+  };
+  for (const [key, src] of Object.entries(sounds)) {
+    audioRefs[key] = new Audio(src);
   }
-};
-var localeStore = create((set, get) => {
   return {
-    locales: {
-      "OccupantsDesc": "Here you can view and manage the occupants of your traphouse. These occupants can be used mainly for selling drugs to the NPCs surrounding your traphouse. However they have other uses to so be careful who you add as an occupant."
+    play: (sound) => {
+      const audio = audioRefs[sound];
+      if (!audio) return console.warn(`Sound '${sound}' not found.`);
+      audio.currentTime = 0;
+      audio.volume = 0.1;
+      audio.play();
     },
-    locale: (key, ...args) => {
-      const exists = get().locales[key];
-      let translation = exists || key;
-      if (args.length) {
-        translation = translation.replace(/%s/g, () => String(args.shift() || ""));
-      }
-      return translation;
+    stop: (sound) => {
+      const audio = audioRefs[sound];
+      if (!audio) return console.warn(`Sound '${sound}' not found.`);
+      audio.pause();
+      audio.currentTime = 0;
     }
   };
 });
-var locale = localeStore.getState().locale;
-fetchOnLoad("GET_LOCALES").then((data) => {
-  localeStore.setState({ locales: data });
-});
 function SegmentedControl(props) {
   const theme2 = useMantineTheme();
   const play = useAudio((state) => state.play);
@@ -971,11 +1671,11 @@ function SegmentedProgress(props) {
   );
 }
 function Title(props) {
+  const game = useSettings((state) => state.game);
   const theme2 = useMantineTheme();
   return /* @__PURE__ */ jsx(
     Flex,
     {
-      mt: props.mt,
       direction: "column",
       bg: props.bg || "transparent",
       gap: "xs",
@@ -1014,7 +1714,7 @@ function Title(props) {
                       children: [
                         /* @__PURE__ */ jsx(Text, { p: "0", size: "sm", style: {
                           lineHeight: theme2.fontSizes.md,
-                          fontFamily: "Akrobat Bold",
+                          fontFamily: game == "fivem" ? "Akrobat Bold" : "Red Dead",
                           letterSpacing: "0.05em",
                           textTransform: "uppercase"
                         }, children: props.title }),
@@ -1048,185 +1748,7 @@ function Title(props) {
     }
   );
 }
-var useNuiEvent = (action, handler) => {
-  const savedHandler = useRef(noop);
-  useEffect(() => {
-    savedHandler.current = handler;
-  }, [handler]);
-  useEffect(() => {
-    const eventListener = (event) => {
-      const { action: eventAction, data } = event.data;
-      if (savedHandler.current) {
-        if (eventAction === action) {
-          savedHandler.current(data);
-        }
-      }
-    };
-    window.addEventListener("message", eventListener);
-    return () => window.removeEventListener("message", eventListener);
-  }, [action]);
-};
-var theme = createTheme({
-  primaryColor: "dirk",
-  primaryShade: 9,
-  defaultRadius: "xxs",
-  fontFamily: "Akrobat Regular, sans-serif",
-  radius: {
-    xxs: "0.2vh",
-    xs: "0.4vh",
-    sm: "0.75vh",
-    md: "1vh",
-    lg: "1.5vh",
-    xl: "2vh",
-    xxl: "3vh"
-  },
-  fontSizes: {
-    xxs: "1.2vh",
-    xs: "1.5vh",
-    sm: "1.8vh",
-    md: "2.2vh",
-    lg: "2.8vh",
-    xl: "3.3vh",
-    xxl: "3.8vh"
-  },
-  spacing: {
-    xxs: "0.5vh",
-    xs: "0.75vh",
-    sm: "1.5vh",
-    md: "2vh",
-    lg: "3vh",
-    xl: "4vh",
-    xxl: "5vh"
-  },
-  components: {
-    Progress: {
-      styles: {
-        root: {
-          backgroundColor: "rgba(77, 77, 77, 0.4)"
-        }
-      }
-    },
-    Select: {
-      styles: {
-        dropdown: {
-          borderRadius: "var(--mantine-radius-xxs)"
-        },
-        input: {
-          padding: "var(--mantine-spacing-sm)"
-        },
-        item: {
-          borderRadius: "var(--mantine-radius-xxs)"
-        },
-        wrapper: {
-          borderRadius: "var(--mantine-radius-xxs)"
-        },
-        option: {
-          borderRadius: "var(--mantine-radius-xxs)"
-        }
-      }
-    },
-    MultiSelect: {
-      styles: {
-        dropdown: {
-          borderRadius: "var(--mantine-radius-xxs)"
-        },
-        pill: {
-          borderRadius: "var(--mantine-radius-xxs)"
-        },
-        item: {
-          borderRadius: "var(--mantine-radius-xxs)"
-        },
-        wrapper: {
-          borderRadius: "var(--mantine-radius-xxs)"
-        },
-        option: {
-          borderRadius: "var(--mantine-radius-xxs)"
-        }
-      }
-    },
-    TextInput: {
-      styles: {
-        section: {
-          marginRight: "0.2vh"
-        },
-        input: {
-          padding: "var(--mantine-spacing-sm)"
-        }
-      }
-    }
-  },
-  colors: {
-    dark: [
-      "#ffffff",
-      "#e2e2e2",
-      "#c6c6c6",
-      "#aaaaaa",
-      "#8d8d8d",
-      "#717171",
-      "#555555",
-      "#393939",
-      "#1c1c1c",
-      "#000000"
-    ],
-    dirk: [
-      "#ffffff",
-      "#f3fce9",
-      "#dbf5bd",
-      "#c3ee91",
-      "#ace765",
-      "#94e039",
-      "#7ac61f",
-      "#5f9a18",
-      "#29420a",
-      "#446e11"
-    ]
-  }
-});
-var theme_default = theme;
-library.add(fas, far, fab);
-var useSettings = create((set) => ({
-  game: "rdr3",
-  primaryColor: "teal",
-  primaryShade: 6,
-  customTheme: {}
-}));
-function DirkProvider(props) {
-  const primaryColor = useSettings((data) => data.primaryColor);
-  const primaryShade = useSettings((data) => data.primaryShade);
-  const customTheme = useSettings((data) => data.customTheme);
-  const game = useSettings((data) => data.game);
-  const mergedTheme = useMemo(() => ({
-    ...theme_default,
-    primaryColor,
-    primaryShade,
-    colors: {
-      ...theme_default.colors,
-      ...customTheme
-      // Custom theme colors will override/extend base colors
-    }
-  }), [primaryColor, primaryShade, customTheme]);
-  useEffect(() => {
-    document.fonts.ready.then(() => {
-      document.body.style.fontFamily = game === "rdr3" ? '"Red Dead", sans-serif' : game === "fivem" ? '"Akrobat Regular", sans-serif' : "sans-serif";
-      console.log(`Game set to ${game}, applied corresponding font family.: ${document.body.style.fontFamily}`);
-    });
-  }, [game]);
-  return /* @__PURE__ */ jsx(MantineProvider, { theme: mergedTheme, defaultColorScheme: "dark", children: /* @__PURE__ */ jsx(Wrapper, { children: props.children }) });
-}
-function Wrapper({ children }) {
-  const game = useSettings((data) => data.game);
-  return isEnvBrowser() ? /* @__PURE__ */ jsx(
-    BackgroundImage,
-    {
-      w: "100vw",
-      h: "100vh",
-      style: { overflow: "hidden" },
-      src: game === "fivem" ? "https://i.ytimg.com/vi/TOxuNbXrO28/maxresdefault.jpg" : "https://raw.githubusercontent.com/Jump-On-Studios/RedM-jo_libs/refs/heads/main/source-repositories/Menu/public/assets/images/background_dev.jpg",
-      children
-    }
-  ) : /* @__PURE__ */ jsx(Fragment, { children });
-}
 
-export { BorderedIcon, Counter, DirkProvider, FloatingParticles, InfoBox, InputContainer, MotionFlex, MotionIcon, MotionImage, MotionText, NavBar, NavigationContext, NavigationProvider, Segment, SegmentedControl, SegmentedProgress, Title, colorWithAlpha, copyToClipboard, fetchLuaTable, fetchNui, fetchOnLoad, internalEvent, isEnvBrowser, locale, localeStore, noop, numberToRoman, openLink, splitFAString, useNavigation, useNavigationStore, useNuiEvent, useSettings };
+export { BorderedIcon, Counter, DirkProvider, FloatingParticles, InfoBox, InputContainer, MotionFlex, MotionIcon, MotionImage, MotionText, NavBar, NavigationContext, NavigationProvider, Segment, SegmentedControl, SegmentedProgress, Title, TornEdgeSVGFilter, colorWithAlpha, copyToClipboard, createSkill, fetchNui, initialFetches, internalEvent, isEnvBrowser, isProfanity, locale, localeStore, noop, numberToRoman, openLink, registerInitialFetch, runFetches, splitFAString, useAutoFetcher, useNavigation, useNavigationStore, useNuiEvent, useProfanityStore, useSettings, useTornEdges };
 //# sourceMappingURL=index.js.map
 //# sourceMappingURL=index.js.map