dirk-cfx-react 1.1.10 → 1.1.11

package/dist/index.d.cts

@@ -1,6 +1,6 @@
 export { BorderedIcon, BorderedIconProps, ButtonProps, Counter, FloatingParticles, FloatingParticlesProps, InfoBox, InfoBoxProps, InputContainer, InputContainerProps, LevelBanner, LevelPanel, ModalContext, ModalProvider, MotionFlex, MotionIcon, MotionImage, MotionText, NavBar, NavigationContext, NavigationProvider, NavigationStore, ParticleState, ProgressProps, Prompt, PromptButton, PromptModal, SegmentProps, SegmentedControl, SegmentedControlProps, SegmentedProgress, Title, TitleProps, useModal, useModalActions, useNavigation, useNavigationStore } from './components/index.cjs';
 export { InitialFetch, InternalEvent, SettingsState, SkillSettings, UploadImageProps, colorWithAlpha, copyToClipboard, createSkill, fetchNui, gameToMap, getImageShape, initialFetches, internalEvent, isEnvBrowser, isProfanity, latPr100, locale, localeStore, mapCenter, mapToGame, noop, numberToRoman, openLink, registerInitialFetch, runFetches, splitFAString, updatePresignedURL, uploadImage, useAutoFetcher, useProfanityStore, useSettings } from './utils/index.cjs';
-export { FormProvider, FormState, NuiHandlerSignature, NuiMessageData, TornEdgeSVGFilter, ValidationRules, createFormStore, createScriptSettings, useForm, useNuiEvent, useTornEdges } from './hooks/index.cjs';
+export { FormProvider, FormState, NuiHandlerSignature, NuiMessageData, TornEdgeSVGFilter, ValidationRules, ValidatorFn, createFormStore, createScriptSettings, useForm, useNuiEvent, useTornEdges } from './hooks/index.cjs';
 export { DirkProvider, DirkProviderProps } from './providers/index.cjs';
 import 'react/jsx-runtime';
 import 'react';

package/dist/index.d.ts

@@ -1,6 +1,6 @@
 export { BorderedIcon, BorderedIconProps, ButtonProps, Counter, FloatingParticles, FloatingParticlesProps, InfoBox, InfoBoxProps, InputContainer, InputContainerProps, LevelBanner, LevelPanel, ModalContext, ModalProvider, MotionFlex, MotionIcon, MotionImage, MotionText, NavBar, NavigationContext, NavigationProvider, NavigationStore, ParticleState, ProgressProps, Prompt, PromptButton, PromptModal, SegmentProps, SegmentedControl, SegmentedControlProps, SegmentedProgress, Title, TitleProps, useModal, useModalActions, useNavigation, useNavigationStore } from './components/index.js';
 export { InitialFetch, InternalEvent, SettingsState, SkillSettings, UploadImageProps, colorWithAlpha, copyToClipboard, createSkill, fetchNui, gameToMap, getImageShape, initialFetches, internalEvent, isEnvBrowser, isProfanity, latPr100, locale, localeStore, mapCenter, mapToGame, noop, numberToRoman, openLink, registerInitialFetch, runFetches, splitFAString, updatePresignedURL, uploadImage, useAutoFetcher, useProfanityStore, useSettings } from './utils/index.js';
-export { FormProvider, FormState, NuiHandlerSignature, NuiMessageData, TornEdgeSVGFilter, ValidationRules, createFormStore, createScriptSettings, useForm, useNuiEvent, useTornEdges } from './hooks/index.js';
+export { FormProvider, FormState, NuiHandlerSignature, NuiMessageData, TornEdgeSVGFilter, ValidationRules, ValidatorFn, createFormStore, createScriptSettings, useForm, useNuiEvent, useTornEdges } from './hooks/index.js';
 export { DirkProvider, DirkProviderProps } from './providers/index.js';
 import 'react/jsx-runtime';
 import 'react';

package/dist/index.js

@@ -2012,6 +2012,10 @@ function flattenRules(rules, prefix = "") {
   }
   return result;
 }
+async function runRule(rule, value, values) {
+  const result = rule(value, values);
+  return result instanceof Promise ? await result : result;
+}
 function createFormStore(initialValues, validationRules, onSubmit) {
   const flatRules = validationRules ? flattenRules(validationRules) : {};
   const history = [];
@@ -2026,17 +2030,16 @@ function createFormStore(initialValues, validationRules, onSubmit) {
     changedFields: [],
     changedCount: 0,
     onSubmit,
-    submit: () => {
+    submit: async () => {
       const state = get();
-      const isValid = state.validate();
-      if (isValid && state.onSubmit) state.onSubmit(get());
+      const isValid = await state.validate();
+      if (isValid && state.onSubmit) {
+        state.onSubmit(get());
+      }
     },
     resetChangeCount: () => {
       changed.clear();
-      set(() => ({
-        changedFields: [],
-        changedCount: 0
-      }));
+      set({ changedFields: [], changedCount: 0 });
     },
     setInitialValues: (newInitialValues) => set({ initialValues: newInitialValues }),
     setValue: (path, value) => {
@@ -2055,37 +2058,37 @@ function createFormStore(initialValues, validationRules, onSubmit) {
         changedCount: changed.size
       });
       const rule = flatRules[path];
-      if (rule) {
-        const error2 = rule(value, newValues);
+      if (!rule) return;
+      Promise.resolve(runRule(rule, value, newValues)).then((error2) => {
         if (error2)
-          set((state) => ({ errors: setNested(state.errors, path, error2) }));
-        else set((state) => ({ errors: deleteNested(state.errors, path) }));
-      }
+          set((s) => ({ errors: setNested(s.errors, path, error2) }));
+        else
+          set((s) => ({ errors: deleteNested(s.errors, path) }));
+      });
     },
-    setError: (path, message) => set((state) => ({ errors: setNested(state.errors, path, message) })),
-    clearError: (path) => set((state) => ({ errors: deleteNested(state.errors, path) })),
-    validateField: (path) => {
+    setError: (path, message) => set((s) => ({ errors: setNested(s.errors, path, message) })),
+    clearError: (path) => set((s) => ({ errors: deleteNested(s.errors, path) })),
+    validateField: async (path) => {
       const state = get();
       const rule = flatRules[path];
       if (!rule) return true;
       const value = getNested(state.values, path);
-      const error2 = rule(value, state.values);
+      const error2 = await runRule(rule, value, state.values);
       if (error2) {
-        set((state2) => ({ errors: setNested(state2.errors, path, error2) }));
+        set((s) => ({ errors: setNested(s.errors, path, error2) }));
         return false;
-      } else {
-        set((state2) => ({ errors: deleteNested(state2.errors, path) }));
-        return true;
       }
+      set((s) => ({ errors: deleteNested(s.errors, path) }));
+      return true;
     },
-    validate: () => {
+    validate: async () => {
       const state = get();
       let isValid = true;
       let newErrors = {};
       for (const path in flatRules) {
         const rule = flatRules[path];
         const value = getNested(state.values, path);
-        const error2 = rule(value, state.values);
+        const error2 = await runRule(rule, value, state.values);
         if (error2) {
           isValid = false;
           newErrors = setNested(newErrors, path, error2);
@@ -2108,15 +2111,13 @@ function createFormStore(initialValues, validationRules, onSubmit) {
       });
     },
     back: () => {
-      const state = get();
-      if (history.length === 0) return;
+      if (!history.length) return;
       const prev = history.pop();
-      future.push(state.values);
+      future.push(get().values);
       changed.clear();
-      const current = prev;
       const initial = get().initialValues;
-      for (const key in current) {
-        if (JSON.stringify(current[key]) !== JSON.stringify(initial[key]))
+      for (const key in prev) {
+        if (JSON.stringify(prev[key]) !== JSON.stringify(initial[key]))
           changed.add(key);
       }
       set({
@@ -2128,15 +2129,13 @@ function createFormStore(initialValues, validationRules, onSubmit) {
       });
     },
     forward: () => {
-      const state = get();
-      if (future.length === 0) return;
+      if (!future.length) return;
       const next = future.pop();
-      history.push(state.values);
+      history.push(get().values);
       changed.clear();
-      const current = next;
       const initial = get().initialValues;
-      for (const key in current) {
-        if (JSON.stringify(current[key]) !== JSON.stringify(initial[key]))
+      for (const key in next) {
+        if (JSON.stringify(next[key]) !== JSON.stringify(initial[key]))
           changed.add(key);
       }
       set({
@@ -2156,12 +2155,16 @@ function FormProvider({
   onSubmit,
   children
 }) {
-  const storeRef = useRef(createFormStore(initialValues, validate, onSubmit));
+  const storeRef = useRef(
+    createFormStore(initialValues, validate, onSubmit)
+  );
   return /* @__PURE__ */ jsx(FormContext.Provider, { value: storeRef.current, children });
 }
 function useForm() {
   const store = useContext(FormContext);
-  if (!store) throw new Error("useForm must be used inside a <FormProvider>");
+  if (!store) {
+    throw new Error("useForm must be used inside <FormProvider>");
+  }
   return useStore(store);
 }
 function useTornEdges() {