dirk-cfx-react 1.1.69 → 1.1.71

package/dist/components/index.d.cts

@@ -852,6 +852,26 @@ type PositionPickerProps = {
     showHeading?: boolean;
 };
 declare function PositionPicker(props: PositionPickerProps): react_jsx_runtime.JSX.Element;
+/** Read-only `vector4(x, y, z, w)` line in the same boxed style as PositionPicker. */
+declare function Vector4Display({ value }: {
+    value: Vector4Value;
+}): react_jsx_runtime.JSX.Element;
+/** Grabs the player's current world coords+heading via `GET_POSITION`. */
+declare function WorldPositionSetButton({ value, onChange, compact, }: {
+    value: Vector4Value;
+    onChange: (v: Vector4Value) => void;
+    compact?: boolean;
+}): react_jsx_runtime.JSX.Element;
+/** Teleports the player to the stored coords via `GOTO_POSITION`. */
+declare function WorldPositionGotoButton({ value, compact, }: {
+    value: Vector4Value;
+    compact?: boolean;
+}): react_jsx_runtime.JSX.Element;
+/** Red-tinted Delete button matching the Set/Goto styling. */
+declare function Vector4DeleteButton({ onClick, compact, }: {
+    onClick: () => void;
+    compact?: boolean;
+}): react_jsx_runtime.JSX.Element;
 
 type GroupValue = {
     name?: string;
@@ -956,4 +976,4 @@ interface TestBedProps {
 }
 declare function TestBed({ items, storageKey, disablePersistence, title, }: TestBedProps): react_jsx_runtime.JSX.Element | null;
 
-export { AdminPageTitle, type AdminPageTitleProps, AsyncSaveButton, BlipColorSelect, type BlipColorSelectProps, BlipDisplaySelect, type BlipDisplaySelectProps, BlipIconSelect, type BlipIconSelectProps, BorderedIcon, type BorderedIconProps, type ButtonProps, ConfigPanel, type ConfigPanelProps, ConfirmModal, type ConfirmModalProps, ControlMultiSelect, type ControlMultiSelectProps, ControlSelect, type ControlSelectProps, Counter, type FiveMControls, FiveMKeyBindInput, FloatingParticles, type FloatingParticlesProps, GroupName, type GroupNameProps, GroupRank, type GroupRankProps, GroupSelect, type GroupSelectProps, type GroupType, type GroupValue, InfoBox, type InfoBoxProps, InputContainer, type InputContainerProps, LevelBanner, LevelPanel, Modal, ModalContext, type ModalProps, ModalProvider, MotionFlex, MotionIcon, MotionImage, MotionText, NavBar, type NavItem, NavigationContext, NavigationProvider, type NavigationStore, type ParticleState, PositionPicker, type PositionPickerProps, type ProgressProps, type Prompt, type PromptButton, PromptModal, type SegmentProps, SegmentedControl, type SegmentedControlProps, SegmentedProgress, SelectItem, type SelectItemProps, type StoreModalProps, TestBed, type TestBedItem, type TestBedProps, Title, type TitleProps, type Vector4Value, useModal, useModalActions, useNavigation, useNavigationStore };
+export { AdminPageTitle, type AdminPageTitleProps, AsyncSaveButton, BlipColorSelect, type BlipColorSelectProps, BlipDisplaySelect, type BlipDisplaySelectProps, BlipIconSelect, type BlipIconSelectProps, BorderedIcon, type BorderedIconProps, type ButtonProps, ConfigPanel, type ConfigPanelProps, ConfirmModal, type ConfirmModalProps, ControlMultiSelect, type ControlMultiSelectProps, ControlSelect, type ControlSelectProps, Counter, type FiveMControls, FiveMKeyBindInput, FloatingParticles, type FloatingParticlesProps, GroupName, type GroupNameProps, GroupRank, type GroupRankProps, GroupSelect, type GroupSelectProps, type GroupType, type GroupValue, InfoBox, type InfoBoxProps, InputContainer, type InputContainerProps, LevelBanner, LevelPanel, Modal, ModalContext, type ModalProps, ModalProvider, MotionFlex, MotionIcon, MotionImage, MotionText, NavBar, type NavItem, NavigationContext, NavigationProvider, type NavigationStore, type ParticleState, PositionPicker, type PositionPickerProps, type ProgressProps, type Prompt, type PromptButton, PromptModal, type SegmentProps, SegmentedControl, type SegmentedControlProps, SegmentedProgress, SelectItem, type SelectItemProps, type StoreModalProps, TestBed, type TestBedItem, type TestBedProps, Title, type TitleProps, Vector4DeleteButton, Vector4Display, type Vector4Value, WorldPositionGotoButton, WorldPositionSetButton, useModal, useModalActions, useNavigation, useNavigationStore };

package/dist/components/index.d.ts

@@ -852,6 +852,26 @@ type PositionPickerProps = {
     showHeading?: boolean;
 };
 declare function PositionPicker(props: PositionPickerProps): react_jsx_runtime.JSX.Element;
+/** Read-only `vector4(x, y, z, w)` line in the same boxed style as PositionPicker. */
+declare function Vector4Display({ value }: {
+    value: Vector4Value;
+}): react_jsx_runtime.JSX.Element;
+/** Grabs the player's current world coords+heading via `GET_POSITION`. */
+declare function WorldPositionSetButton({ value, onChange, compact, }: {
+    value: Vector4Value;
+    onChange: (v: Vector4Value) => void;
+    compact?: boolean;
+}): react_jsx_runtime.JSX.Element;
+/** Teleports the player to the stored coords via `GOTO_POSITION`. */
+declare function WorldPositionGotoButton({ value, compact, }: {
+    value: Vector4Value;
+    compact?: boolean;
+}): react_jsx_runtime.JSX.Element;
+/** Red-tinted Delete button matching the Set/Goto styling. */
+declare function Vector4DeleteButton({ onClick, compact, }: {
+    onClick: () => void;
+    compact?: boolean;
+}): react_jsx_runtime.JSX.Element;
 
 type GroupValue = {
     name?: string;
@@ -956,4 +976,4 @@ interface TestBedProps {
 }
 declare function TestBed({ items, storageKey, disablePersistence, title, }: TestBedProps): react_jsx_runtime.JSX.Element | null;
 
-export { AdminPageTitle, type AdminPageTitleProps, AsyncSaveButton, BlipColorSelect, type BlipColorSelectProps, BlipDisplaySelect, type BlipDisplaySelectProps, BlipIconSelect, type BlipIconSelectProps, BorderedIcon, type BorderedIconProps, type ButtonProps, ConfigPanel, type ConfigPanelProps, ConfirmModal, type ConfirmModalProps, ControlMultiSelect, type ControlMultiSelectProps, ControlSelect, type ControlSelectProps, Counter, type FiveMControls, FiveMKeyBindInput, FloatingParticles, type FloatingParticlesProps, GroupName, type GroupNameProps, GroupRank, type GroupRankProps, GroupSelect, type GroupSelectProps, type GroupType, type GroupValue, InfoBox, type InfoBoxProps, InputContainer, type InputContainerProps, LevelBanner, LevelPanel, Modal, ModalContext, type ModalProps, ModalProvider, MotionFlex, MotionIcon, MotionImage, MotionText, NavBar, type NavItem, NavigationContext, NavigationProvider, type NavigationStore, type ParticleState, PositionPicker, type PositionPickerProps, type ProgressProps, type Prompt, type PromptButton, PromptModal, type SegmentProps, SegmentedControl, type SegmentedControlProps, SegmentedProgress, SelectItem, type SelectItemProps, type StoreModalProps, TestBed, type TestBedItem, type TestBedProps, Title, type TitleProps, type Vector4Value, useModal, useModalActions, useNavigation, useNavigationStore };
+export { AdminPageTitle, type AdminPageTitleProps, AsyncSaveButton, BlipColorSelect, type BlipColorSelectProps, BlipDisplaySelect, type BlipDisplaySelectProps, BlipIconSelect, type BlipIconSelectProps, BorderedIcon, type BorderedIconProps, type ButtonProps, ConfigPanel, type ConfigPanelProps, ConfirmModal, type ConfirmModalProps, ControlMultiSelect, type ControlMultiSelectProps, ControlSelect, type ControlSelectProps, Counter, type FiveMControls, FiveMKeyBindInput, FloatingParticles, type FloatingParticlesProps, GroupName, type GroupNameProps, GroupRank, type GroupRankProps, GroupSelect, type GroupSelectProps, type GroupType, type GroupValue, InfoBox, type InfoBoxProps, InputContainer, type InputContainerProps, LevelBanner, LevelPanel, Modal, ModalContext, type ModalProps, ModalProvider, MotionFlex, MotionIcon, MotionImage, MotionText, NavBar, type NavItem, NavigationContext, NavigationProvider, type NavigationStore, type ParticleState, PositionPicker, type PositionPickerProps, type ProgressProps, type Prompt, type PromptButton, PromptModal, type SegmentProps, SegmentedControl, type SegmentedControlProps, SegmentedProgress, SelectItem, type SelectItemProps, type StoreModalProps, TestBed, type TestBedItem, type TestBedProps, Title, type TitleProps, Vector4DeleteButton, Vector4Display, type Vector4Value, WorldPositionGotoButton, WorldPositionSetButton, useModal, useModalActions, useNavigation, useNavigationStore };

package/dist/components/index.js

@@ -7,6 +7,7 @@ import { motion, AnimatePresence, useMotionValue } from 'framer-motion';
 import { Info, X, AlertTriangle, Trash2, MapPin, Crosshair, EyeOff, Eye, RotateCcw, Check, FlaskConical, ChevronUp, ChevronDown, ArrowLeft, Undo2, Redo2, Save, History, XCircle, Code2, Search, Filter, User } from 'lucide-react';
 import clickSoundUrl from '../click_sound-PNCRRTM4.mp3';
 import hoverSoundUrl from '../hover_sound-NBUA222C.mp3';
+import { notifications } from '@mantine/notifications';
 import { QueryClient, QueryClientProvider, useInfiniteQuery } from '@tanstack/react-query';
 
 // src/components/BlipSelect.tsx
@@ -4075,12 +4076,25 @@ function ConfigPanel(props) {
           if (result?.success) {
             form.reinitialize(cloneConfig(form.values));
             configPanelQueryClient.invalidateQueries({ queryKey: ["scriptConfigHistory"] });
+            notifications.show({
+              color: "green",
+              title: locale("ConfigSaveSuccessTitle"),
+              message: locale("ConfigSaveSuccessBody"),
+              autoClose: 3e3
+            });
             return;
           }
           form.reinitialize(cloneConfig(store.getState()));
-          if (result?._error) {
-            console.warn(`[ConfigPanel] config save failed: ${result._error}`);
-          }
+          const err = result?._error || "Unknown";
+          console.warn(`[ConfigPanel] config save failed: ${err}`);
+          const titleKey = err === "NoPermission" ? "ConfigSaveNoPermissionTitle" : err === "VersionConflict" ? "ConfigSaveVersionConflictTitle" : err === "NotReady" ? "ConfigSaveNotReadyTitle" : "ConfigSaveFailedTitle";
+          const bodyKey = err === "NoPermission" ? "ConfigSaveNoPermissionBody" : err === "VersionConflict" ? "ConfigSaveVersionConflictBody" : err === "NotReady" ? "ConfigSaveNotReadyBody" : "ConfigSaveFailedBody";
+          notifications.show({
+            color: "red",
+            title: locale(titleKey),
+            message: locale(bodyKey, err),
+            autoClose: 6e3
+          });
         } finally {
           setIsSaving(false);
         }
@@ -4099,7 +4113,7 @@ function ConfigPanel(props) {
     }
   ) });
 }
-function LazyImage({ src, alt, style }) {
+function LazyImage({ src, style }) {
   const [visible, setVisible] = useState(false);
   const ref = useRef(null);
   useEffect(() => {
@@ -4112,7 +4126,7 @@ function LazyImage({ src, alt, style }) {
     if (ref.current) observer.observe(ref.current);
     return () => observer.disconnect();
   }, []);
-  return /* @__PURE__ */ jsx("div", { ref, style: { width: "4vh", height: "4vh" }, children: visible && /* @__PURE__ */ jsx(Image, { src, alt, fit: "contain", style }) });
+  return /* @__PURE__ */ jsx("div", { ref, style: { width: "4vh", height: "4vh" }, children: visible && /* @__PURE__ */ jsx(Image, { src, fit: "contain", style }) });
 }
 function SelectItem(props) {
   const invItems = useItems();
@@ -4140,12 +4154,12 @@ function SelectItem(props) {
       searchable: true,
       comboboxProps: { withinPortal: true, zIndex: 2e3 },
       leftSectionWidth: "4vh",
+      leftSectionPointerEvents: "none",
       leftSection: props.value ? /* @__PURE__ */ jsx(
         Image,
         {
           fallbackSrc: "/placeholder.png",
           src: invItems[props.value]?.image || "",
-          alt: props.value,
           fit: "contain",
           maw: "4vh",
           style: { aspectRatio: "1 / 1" }
@@ -4157,7 +4171,6 @@ function SelectItem(props) {
           LazyImage,
           {
             src: invItems[item.option.value]?.image || "",
-            alt: item.option.label,
             style: { aspectRatio: "1 / 1" }
           }
         ),
@@ -4382,6 +4395,148 @@ function PickerButton({
     }
   ) });
 }
+function fmtV4(n) {
+  return Number.isFinite(n) ? n.toFixed(2) : "0.00";
+}
+function Vector4Display({ value }) {
+  const theme = useMantineTheme();
+  return /* @__PURE__ */ jsx(
+    Flex,
+    {
+      align: "center",
+      gap: "xs",
+      p: "xs",
+      style: {
+        background: alpha(theme.colors.dark[5], 0.35),
+        border: "0.1vh solid rgba(255,255,255,0.05)",
+        borderRadius: theme.radius.xs
+      },
+      children: /* @__PURE__ */ jsxs(
+        Text,
+        {
+          ff: "monospace",
+          size: "xxs",
+          c: "rgba(255,255,255,0.85)",
+          style: { flex: 1, letterSpacing: "0.02em", whiteSpace: "nowrap", overflow: "hidden", textOverflow: "ellipsis" },
+          children: [
+            "vector4(",
+            fmtV4(value.x),
+            ", ",
+            fmtV4(value.y),
+            ", ",
+            fmtV4(value.z),
+            ", ",
+            fmtV4(value.w),
+            ")"
+          ]
+        }
+      )
+    }
+  );
+}
+function Vector4ActionButton({
+  icon,
+  label,
+  tooltip,
+  onClick,
+  color,
+  compact
+}) {
+  const theme = useMantineTheme();
+  return /* @__PURE__ */ jsx(Tooltip, { label: tooltip, position: "top", withArrow: true, withinPortal: true, zIndex: 2e3, children: /* @__PURE__ */ jsxs(
+    motion.button,
+    {
+      onClick,
+      whileHover: { background: alpha(color, 0.18) },
+      whileTap: { scale: 0.95 },
+      style: {
+        background: alpha(color, 0.1),
+        border: `0.1vh solid ${alpha(color, 0.35)}`,
+        borderRadius: theme.radius.xs,
+        padding: compact ? "0.25vh 0.6vh" : "0.5vh 0.8vh",
+        cursor: "pointer",
+        display: "flex",
+        alignItems: "center",
+        gap: compact ? "0.3vh" : "0.4vh"
+      },
+      children: [
+        icon,
+        /* @__PURE__ */ jsx(Text, { ff: "Akrobat Bold", size: "xxs", tt: "uppercase", lts: "0.06em", c: color, children: label })
+      ]
+    }
+  ) });
+}
+function WorldPositionSetButton({
+  value,
+  onChange,
+  compact
+}) {
+  const theme = useMantineTheme();
+  const color = theme.colors[theme.primaryColor][5];
+  const grab = async () => {
+    try {
+      const resp = await fetchNui("GET_POSITION", {}, value);
+      if (!resp || typeof resp !== "object") return;
+      onChange({
+        x: Number(resp.x ?? 0),
+        y: Number(resp.y ?? 0),
+        z: Number(resp.z ?? 0),
+        w: Number(resp.w ?? 0)
+      });
+    } catch {
+    }
+  };
+  return /* @__PURE__ */ jsx(
+    Vector4ActionButton,
+    {
+      icon: /* @__PURE__ */ jsx(Crosshair, { size: compact ? "1.1vh" : "1.3vh", color }),
+      label: locale("Set"),
+      tooltip: locale("SetWorldTooltip"),
+      onClick: grab,
+      color,
+      compact
+    }
+  );
+}
+function WorldPositionGotoButton({
+  value,
+  compact
+}) {
+  const theme = useMantineTheme();
+  const color = theme.colors[theme.primaryColor][5];
+  const goto = () => {
+    fetchNui("GOTO_POSITION", value).catch(() => {
+    });
+  };
+  return /* @__PURE__ */ jsx(
+    Vector4ActionButton,
+    {
+      icon: /* @__PURE__ */ jsx(MapPin, { size: compact ? "1.1vh" : "1.3vh", color }),
+      label: locale("Goto"),
+      tooltip: locale("GotoWorldTooltip"),
+      onClick: goto,
+      color,
+      compact
+    }
+  );
+}
+function Vector4DeleteButton({
+  onClick,
+  compact
+}) {
+  const color = "#ef4444";
+  return /* @__PURE__ */ jsx(
+    Vector4ActionButton,
+    {
+      icon: /* @__PURE__ */ jsx(Trash2, { size: compact ? "1.1vh" : "1.3vh", color }),
+      label: locale("Delete"),
+      tooltip: locale("Delete"),
+      onClick,
+      color,
+      compact
+    }
+  );
+}
 var GroupSelectContext = createContext(null);
 function GroupSelect({
   value,
@@ -4833,6 +4988,6 @@ function TestBed({
   );
 }
 
-export { AdminPageTitle, AsyncSaveButton, BlipColorSelect, BlipDisplaySelect, BlipIconSelect, BorderedIcon, ConfigPanel, ConfirmModal, ControlMultiSelect, ControlSelect, Counter, FiveMKeyBindInput, FloatingParticles, GroupName, GroupRank, GroupSelect, InfoBox, InputContainer, LevelBanner, LevelPanel, Modal, ModalContext, ModalProvider, MotionFlex, MotionIcon, MotionImage, MotionText, NavBar, NavigationContext, NavigationProvider, PositionPicker, PromptModal, SegmentedControl, SegmentedProgress, SelectItem, TestBed, Title, useModal, useModalActions, useNavigation, useNavigationStore };
+export { AdminPageTitle, AsyncSaveButton, BlipColorSelect, BlipDisplaySelect, BlipIconSelect, BorderedIcon, ConfigPanel, ConfirmModal, ControlMultiSelect, ControlSelect, Counter, FiveMKeyBindInput, FloatingParticles, GroupName, GroupRank, GroupSelect, InfoBox, InputContainer, LevelBanner, LevelPanel, Modal, ModalContext, ModalProvider, MotionFlex, MotionIcon, MotionImage, MotionText, NavBar, NavigationContext, NavigationProvider, PositionPicker, PromptModal, SegmentedControl, SegmentedProgress, SelectItem, TestBed, Title, Vector4DeleteButton, Vector4Display, WorldPositionGotoButton, WorldPositionSetButton, useModal, useModalActions, useNavigation, useNavigationStore };
 //# sourceMappingURL=index.js.map
 //# sourceMappingURL=index.js.map