dirk-cfx-react 1.0.47 → 1.0.50

package/dist/index.cjs

@@ -2,6 +2,7 @@
 
 var react = require('react');
 var zustand = require('zustand');
+var axios = require('axios');
 var reactFontawesome = require('@fortawesome/react-fontawesome');
 var core = require('@mantine/core');
 var jsxRuntime = require('react/jsx-runtime');
@@ -22,6 +23,7 @@ var freeSolidSvgIcons = require('@fortawesome/free-solid-svg-icons');
 
 function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
 
+var axios__default = /*#__PURE__*/_interopDefault(axios);
 var clickSoundUrl__default = /*#__PURE__*/_interopDefault(clickSoundUrl);
 var hoverSoundUrl__default = /*#__PURE__*/_interopDefault(hoverSoundUrl);
 
@@ -170,11 +172,11 @@ var colorNames = {
   Yellow: { r: 255, g: 255, b: 0 },
   YellowGreen: { r: 154, g: 205, b: 50 }
 };
-function colorWithAlpha(color, alpha2) {
+function colorWithAlpha(color, alpha3) {
   const lowerCasedColor = color.toLowerCase();
   if (colorNames[lowerCasedColor]) {
     const rgb = colorNames[lowerCasedColor];
-    return `rgba(${rgb.r}, ${rgb.g}, ${rgb.b}, ${alpha2})`;
+    return `rgba(${rgb.r}, ${rgb.g}, ${rgb.b}, ${alpha3})`;
   }
   if (/^#([A-Fa-f0-9]{6})$/.test(color)) {
     const hex = color.slice(1);
@@ -182,12 +184,12 @@ function colorWithAlpha(color, alpha2) {
     const r = bigint >> 16 & 255;
     const g = bigint >> 8 & 255;
     const b = bigint & 255;
-    return `rgba(${r}, ${g}, ${b}, ${alpha2})`;
+    return `rgba(${r}, ${g}, ${b}, ${alpha3})`;
   }
   if (/^rgb\((\d{1,3}), (\d{1,3}), (\d{1,3})\)$/.test(color)) {
     const result = color.match(/^rgb\((\d{1,3}), (\d{1,3}), (\d{1,3})\)$/);
     if (result) {
-      return `rgba(${result[1]}, ${result[2]}, ${result[3]}, ${alpha2})`;
+      return `rgba(${result[1]}, ${result[2]}, ${result[3]}, ${alpha3})`;
     }
   }
   return color;
@@ -725,10 +727,12 @@ function createSkill(defaultSettings) {
       const xpRequiredForLevel = nextLevelXP - currentLevelXP;
       const progressToLevel = xpRequiredForLevel > 0 ? xpInCurrentLevel / xpRequiredForLevel * 100 : 100;
       const xpToNextLevel = Math.max(0, nextLevelXP - xp);
+      const prevLevelXP = calculateXPForLevel(currentLevel - 1, settings);
       return {
         currentLevel,
         nextLevel,
         currentLevelXP,
+        prevLevelXP,
         nextLevelXP,
         progressToLevel: Math.min(100, Math.max(0, progressToLevel)),
         xpToNextLevel
@@ -749,6 +753,42 @@ function createSkill(defaultSettings) {
     useSkill
   };
 }
+var dummyURL = "https://fmapi.net/api/v2/presigned-url/eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJ1c2VySWQiOiJON0UxM0tzejFRM0NuSzRHWFBPbmUiLCJ0ZWFtSWQiOiJlMDQ1YnpwZzg5TGpoaUFTaURIdVoiLCJmaWxlVHlwZSI6ImltYWdlIiwidG9rZW5JZCI6ImpwczJ4Z0M1eFZqcnRoeWZTZnFsYSIsInNldHRpbmdzIjp7IlRlYW1JRCI6ImUwNDVienBnODlMamhpQVNpREh1WiIsIkltYWdlTm90aWZpY2F0aW9uVHlwZSI6IiIsIkRpc2NvcmRXZWJob29rIjoiIiwiRGlzY29yZEltYWdlQ2hhbm5lbCI6IiIsIlZpZGVvTm90aWZpY2F0aW9uVHlwZSI6IiIsIkRpc2NvcmRWaWRlb1dlYmhvb2siOiIiLCJEaXNjb3JkVmlkZW9DaGFubmVsIjoiIiwiQXVkaW9Ob3RpZmljYXRpb25UeXBlIjoiIiwiRGlzY29yZEF1ZGlvV2ViaG9vayI6IiIsIkRpc2NvcmRBdWRpb0NoYW5uZWwiOiIiLCJEaXNjb3JkQm90VG9rZW4iOiIiLCJSZXRlbnRpb25FbmFibGVkIjpmYWxzZSwiUmV0ZW50aW9uRGF5cyI6NywiVmlkZW9SZXRlbnRpb25FbmFibGVkIjpmYWxzZSwiVmlkZW9SZXRlbnRpb25EYXlzIjo3LCJBdWRpb1JldGVudGlvbkVuYWJsZWQiOmZhbHNlLCJBdWRpb1JldGVudGlvbkRheXMiOjcsIkxvZ0FsZXJ0RW5hYmxlZCI6ZmFsc2UsIkxvZ0FsZXJ0TGV2ZWxzIjpbXSwiTG9nQWxlcnREaXNjb3JkV2ViaG9vayI6IiIsIk92ZXJyaWRlSW1hZ2VRdWFsaXR5IjpmYWxzZSwiSW1hZ2VRdWFsaXR5Ijo1MH0sImV4cCI6MTc2MTg1MTEzNH0.fpPeQ0GCm5GNTddjttUQ78VMqRUAufXoOvv5C7Vh3WA";
+async function updatePresignedURL() {
+  return await fetchNui("GET_PRESIGNED_URL", void 0, dummyURL);
+}
+async function uploadImage(props) {
+  const uploadURL = await updatePresignedURL();
+  const response = await fetch(props.fileURL);
+  const blob = await response.blob();
+  const file = new File([blob], "upload.png", { type: blob.type });
+  const formData = new FormData();
+  formData.append("file", file);
+  formData.append(
+    "metadata",
+    JSON.stringify({
+      name: props.name || file.name,
+      description: props.description || "Uploaded via DirkScripts"
+    })
+  );
+  const uploadRes = await axios__default.default.post(uploadURL, formData, {
+    headers: { "Content-Type": "multipart/form-data" }
+  });
+  const finalUrl = uploadRes.data?.data?.url ?? uploadRes.data?.url;
+  if (!finalUrl) throw new Error("Upload succeeded but no URL returned");
+  return finalUrl;
+}
+async function getImageShape(file) {
+  return new Promise((resolve, reject) => {
+    const img = new Image();
+    img.onload = () => {
+      if (img.width > img.height) resolve("wide");
+      else resolve("square");
+    };
+    img.onerror = () => reject(new Error("Failed to load image"));
+    img.src = typeof file === "string" ? file : URL.createObjectURL(file);
+  });
+}
 function BorderedIcon(props) {
   const theme2 = core.useMantineTheme();
   return /* @__PURE__ */ jsxRuntime.jsx(
@@ -1516,6 +1556,171 @@ function Title(props) {
     }
   );
 }
+function LevelBanner(props) {
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    MotionFlex,
+    {
+      w: "35vh",
+      pos: "absolute",
+      left: "50%",
+      align: "center",
+      gap: "xs",
+      style: {
+        borderRadius: core.useMantineTheme().radius.xxs
+      },
+      initial: { opacity: 0, y: -10, transform: "translateX(-50%)" },
+      animate: { opacity: 1, y: 0, transform: "translateX(-50%)" },
+      exit: { opacity: 0, y: -10, transform: "translateX(-50%)" },
+      transition: { duration: 0.3 },
+      direction: "column",
+      children: [
+        /* @__PURE__ */ jsxRuntime.jsxs(
+          core.Flex,
+          {
+            w: "100%",
+            justify: "space-between",
+            children: [
+              /* @__PURE__ */ jsxRuntime.jsxs(
+                core.Text,
+                {
+                  size: "xxs",
+                  c: "rgba(255, 255, 255, 0.9)",
+                  style: {
+                    fontFamily: "Akrobat Bold",
+                    letterSpacing: "0.1em"
+                  },
+                  children: [
+                    "LVL ",
+                    props.level
+                  ]
+                }
+              ),
+              /* @__PURE__ */ jsxRuntime.jsxs(
+                core.Text,
+                {
+                  size: "xxs",
+                  c: "rgba(255, 255, 255, 0.7)",
+                  style: {
+                    fontFamily: "Akrobat Bold",
+                    letterSpacing: "0.1em"
+                  },
+                  children: [
+                    props.exp,
+                    "/",
+                    props.nextLevelXP,
+                    " XP"
+                  ]
+                }
+              ),
+              /* @__PURE__ */ jsxRuntime.jsxs(
+                core.Text,
+                {
+                  size: "xxs",
+                  c: "rgba(255, 255, 255, 0.7)",
+                  style: {
+                    fontFamily: "Akrobat Bold",
+                    letterSpacing: "0.1em"
+                  },
+                  children: [
+                    "LVL ",
+                    props.level + 1
+                  ]
+                }
+              )
+            ]
+          }
+        ),
+        /* @__PURE__ */ jsxRuntime.jsx(
+          core.Progress,
+          {
+            color: props.color,
+            w: "100%",
+            size: "sm",
+            value: props.progressToLevel
+          }
+        )
+      ]
+    }
+  );
+}
+function LevelPanel(props) {
+  const theme2 = core.useMantineTheme();
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    core.Flex,
+    {
+      w: "fit-content",
+      pr: "8vh",
+      pl: "8vh",
+      bg: "linear-gradient(180deg, rgba(30, 30, 30, 0.82) 0%, rgba(30, 30, 30, 0.3) 50%, rgba(30, 30, 30, 0.6) 100%)",
+      style: {
+        borderRadius: theme2.radius.xs,
+        boxShadow: theme2.shadows.sm,
+        outline: "0.2vh solid rgba(255,255,255,0.1)"
+      },
+      justify: "center",
+      align: "center",
+      direction: "column",
+      p: "sm",
+      children: [
+        /* @__PURE__ */ jsxRuntime.jsx(
+          core.RingProgress,
+          {
+            size: 190,
+            roundCaps: true,
+            thickness: 10,
+            sections: [{ value: props.progressToLevel, color: core.alpha(props.color || theme2.colors[theme2.primaryColor][theme2.primaryShade], 0.9) }],
+            label: /* @__PURE__ */ jsxRuntime.jsx(
+              core.Flex,
+              {
+                justify: "center",
+                align: "center",
+                direction: "column",
+                children: /* @__PURE__ */ jsxRuntime.jsx(
+                  core.Text,
+                  {
+                    size: "6vh",
+                    c: core.alpha(props.color || theme2.colors[theme2.primaryColor][theme2.primaryShade], 0.9),
+                    style: {
+                      fontFamily: "Akrobat Black",
+                      textShadow: `0 0 10px ${core.alpha(props.color || theme2.colors[theme2.primaryColor][theme2.primaryShade], 0.7)}`
+                    },
+                    children: props.level
+                  }
+                )
+              }
+            )
+          }
+        ),
+        /* @__PURE__ */ jsxRuntime.jsx(
+          core.Text,
+          {
+            size: "sm",
+            style: {
+              fontFamily: "Akrobat Black",
+              letterSpacing: "0.05em",
+              textTransform: "uppercase"
+            },
+            children: props.text || locale("Level")
+          }
+        ),
+        /* @__PURE__ */ jsxRuntime.jsxs(
+          core.Text,
+          {
+            size: "xs",
+            c: "rgba(255,255,255,0.6)",
+            children: [
+              props.exp,
+              "/",
+              props.nextLevelXP,
+              " ",
+              locale("EXP")
+            ]
+          }
+        )
+      ]
+    }
+  );
+}
 var ModalContext = react.createContext(null);
 function useModal(selector) {
   const modal = react.useContext(ModalContext);
@@ -2139,6 +2344,8 @@ exports.FloatingParticles = FloatingParticles;
 exports.FormProvider = FormProvider;
 exports.InfoBox = InfoBox;
 exports.InputContainer = InputContainer;
+exports.LevelBanner = LevelBanner;
+exports.LevelPanel = LevelPanel;
 exports.ModalContext = ModalContext;
 exports.ModalProvider = ModalProvider;
 exports.MotionFlex = MotionFlex;
@@ -2157,6 +2364,7 @@ exports.copyToClipboard = copyToClipboard;
 exports.createFormStore = createFormStore;
 exports.createSkill = createSkill;
 exports.fetchNui = fetchNui;
+exports.getImageShape = getImageShape;
 exports.initialFetches = initialFetches;
 exports.internalEvent = internalEvent;
 exports.isEnvBrowser = isEnvBrowser;
@@ -2169,6 +2377,8 @@ exports.openLink = openLink;
 exports.registerInitialFetch = registerInitialFetch;
 exports.runFetches = runFetches;
 exports.splitFAString = splitFAString;
+exports.updatePresignedURL = updatePresignedURL;
+exports.uploadImage = uploadImage;
 exports.useAutoFetcher = useAutoFetcher;
 exports.useForm = useForm;
 exports.useModal = useModal;