impact-nova 2.5.5 → 2.5.6

package/dist/form-react/Fields/SliderRangeField.js

@@ -0,0 +1,69 @@
+import { jsx as t, jsxs as l } from "react/jsx-runtime";
+import { Controller as g } from "react-hook-form";
+import { Slider as v } from "../../components/forms/slider/slider.js";
+const y = {
+  opacity: 0.4,
+  pointerEvents: "none"
+}, N = "bg-muted", A = ({
+  field: e,
+  validationRules: x,
+  isDisabled: o,
+  formHelpers: h
+}) => {
+  const r = e.fieldType === "slider_range" ? e : null;
+  if (!r) return null;
+  const s = r.min ?? 0, c = r.max ?? 100, p = r.step ?? 1, m = r.showValue ?? !0;
+  return /* @__PURE__ */ t(
+    g,
+    {
+      name: e.id,
+      control: h.form.control,
+      rules: x,
+      render: ({ field: i, fieldState: u }) => {
+        const d = i.value, n = Array.isArray(d) ? d : [s], a = !!u.error;
+        return /* @__PURE__ */ l("div", { style: o ? y : void 0, children: [
+          e.label ? /* @__PURE__ */ l("label", { className: "mb-2 block text-xs font-medium text-content-muted", children: [
+            e.label,
+            e.isRequired && /* @__PURE__ */ t("span", { className: "ml-1 text-destructive", children: "*" })
+          ] }) : null,
+          /* @__PURE__ */ l("div", { className: "flex items-center gap-3", children: [
+            /* @__PURE__ */ t("span", { className: "min-w-[2rem] text-right text-xs tabular-nums text-content-muted", children: m ? n[0] : s }),
+            /* @__PURE__ */ t(
+              w,
+              {
+                "aria-label": e.label ?? e.id,
+                value: n,
+                min: s,
+                max: c,
+                step: p,
+                disabled: o,
+                onValueChange: (b) => {
+                  i.onChange(b);
+                }
+              }
+            ),
+            /* @__PURE__ */ t("span", { className: "min-w-[2rem] text-xs tabular-nums text-content-muted", children: m && n.length > 1 ? n[n.length - 1] : c })
+          ] }),
+          (a || e.helpText) && /* @__PURE__ */ t(
+            "p",
+            {
+              className: `mt-1 text-xs ${a ? "text-destructive" : "text-content-muted"}`,
+              children: a ? u.error?.message : e.helpText
+            }
+          )
+        ] });
+      }
+    }
+  );
+}, w = (e) => /* @__PURE__ */ l("div", { className: "relative w-full isolate", children: [
+  /* @__PURE__ */ t(
+    "div",
+    {
+      className: `absolute left-0 right-0 top-1/2 h-1.5 -translate-y-1/2 rounded-full ${N}`
+    }
+  ),
+  /* @__PURE__ */ t(v, { ...e })
+] });
+export {
+  A as SliderRangeField
+};

package/dist/form-react/ReactHooksForm.js

@@ -1,132 +1,194 @@
-import { jsx as c } from "react/jsx-runtime";
-import { forwardRef as O, useRef as m, useEffect as n, useCallback as j, useImperativeHandle as x } from "react";
+import { jsx as l, jsxs as T } from "react/jsx-runtime";
+import { forwardRef as j, useRef as n, useEffect as S, useCallback as y, useImperativeHandle as M } from "react";
 import { useReactHookForm as G } from "./hooks/useReactHookForm.js";
-import { GRID_COLS_MAP as M, GAP_X_MAP as $, GAP_Y_MAP as N } from "./utils/fieldRendererUtils.js";
-import { FormFieldRow as P } from "./components/FormFieldRow.js";
-import { showFormValidationFailureFeedback as q } from "./utils/formValidationFeedback.utils.js";
-import { resolveFormSubmittable as B, mergeFormValidationFieldErrors as L } from "./utils/resolveFormSubmittable.js";
-import { validateVisibleRequiredFormFields as X } from "./utils/validateVisibleRequiredFormFields.js";
-const C = O(
+import { useFormSteps as $ } from "./hooks/useFormSteps.js";
+import { GRID_COLS_MAP as q, GAP_X_MAP as B, GAP_Y_MAP as X } from "./utils/fieldRendererUtils.js";
+import { FormFieldRow as Y } from "./components/FormFieldRow.js";
+import { showFormValidationFailureFeedback as z } from "./utils/formValidationFeedback.utils.js";
+import { resolveFormSubmittable as J, mergeFormValidationFieldErrors as K } from "./utils/resolveFormSubmittable.js";
+import { validateVisibleRequiredFormFields as Q } from "./utils/validateVisibleRequiredFormFields.js";
+import { getFirstIncompleteStep as U } from "../form-engine/field-groups.js";
+const de = j(
   ({
-    formId: R,
-    formConfig: i,
-    formInitialState: E,
-    onSubmit: h,
-    onCancel: v,
-    onReset: S,
-    sendFormStateToParent: t,
-    supportedValues: g,
-    formContext: o
-  }, k) => {
-    const r = G(
-      i,
-      E,
-      h,
-      v,
-      S,
-      o
-    ), { errors: w, isValid: H, isDirty: y, isValidating: D } = r.form.formState, u = m(r), f = m(t), b = m(o), F = m(i.fields);
-    n(() => {
-      u.current = r, f.current = t, b.current = o, F.current = i.fields;
+    formId: p,
+    formConfig: s,
+    formInitialState: k,
+    onSubmit: x,
+    onCancel: N,
+    onReset: P,
+    sendFormStateToParent: d,
+    supportedValues: w,
+    formContext: c
+  }, H) => {
+    const t = G(
+      s,
+      k,
+      x,
+      N,
+      P,
+      c
+    ), r = $(s, t), { errors: I, isValid: A, isDirty: D, isValidating: _ } = t.form.formState, b = n(t), F = n(d), h = n(c), V = n(s.fields), v = n(r);
+    S(() => {
+      b.current = t, F.current = d, h.current = c, V.current = s.fields, v.current = r;
     });
-    const l = j(() => {
-      const e = f.current;
+    const R = y(() => {
+      const e = v.current;
+      if (!e) return;
+      const i = [];
+      for (let o = 0; o < e.totalSteps; o++)
+        e.isStepComplete(o) && i.push(o);
+      return {
+        currentStep: e.currentStep,
+        totalSteps: e.totalSteps,
+        isFirstStep: e.isFirstStep,
+        isLastStep: e.isLastStep,
+        canProceed: e.canProceed,
+        completedSteps: i
+      };
+    }, []), m = y(() => {
+      const e = F.current;
       if (!e)
         return;
-      const s = u.current;
+      const i = b.current;
       e(
-        s.form.formState,
-        s.form.getValues(),
+        i.form.formState,
+        i.form.getValues(),
         {
-          isSubmittable: B({
-            formConfigFields: F.current,
-            formHelpers: s,
-            formContext: b.current
-          })
+          isSubmittable: J({
+            formConfigFields: V.current,
+            formHelpers: i,
+            formContext: h.current
+          }),
+          stepState: R()
         }
       );
-    }, []);
-    n(() => {
-      if (!t)
+    }, [R]);
+    S(() => {
+      if (!d)
         return;
-      l();
-      const e = r.form.watch(() => {
-        l();
+      m();
+      const e = t.form.watch(() => {
+        m();
       });
       return () => e.unsubscribe();
-    }, [t, l, r.form]), n(() => {
-      t && l();
+    }, [d, m, t.form]), S(() => {
+      d && m();
     }, [
-      t,
-      l,
-      w,
+      d,
+      m,
+      I,
+      A,
+      D,
+      _,
+      r?.currentStep
+    ]), M(
       H,
-      y,
-      D
-    ]), x(
-      k,
       () => ({
         submitForm: async () => {
-          const e = i.fields.filter(
-            (a) => r.isFieldVisible(a)
-          ), s = X(
-            r.form,
+          if (r && s.formType === "stepped") {
+            const a = U(
+              r.groups,
+              s.fields,
+              t.form.getValues(),
+              t.form.formState.errors
+            );
+            a !== -1 && r.goToStep(a);
+          }
+          const e = s.fields.filter(
+            (a) => t.isFieldVisible(a)
+          ), i = Q(
+            t.form,
             e,
             {
-              isFieldDisabled: r.isFieldDisabled,
-              isFieldDisabledForValidation: r.isFieldDisabledForSubmitValidation,
-              formHelpers: r
+              isFieldDisabled: t.isFieldDisabled,
+              isFieldDisabledForValidation: t.isFieldDisabledForSubmitValidation,
+              formHelpers: t
             }
-          ), d = o?.validateForm?.({
-            formValues: r.form.getValues(),
+          ), o = c?.validateForm?.({
+            formValues: t.form.getValues(),
             visibleFields: e
-          }), A = L(
-            s.fieldErrors,
-            d?.fieldErrors
+          }), L = K(
+            i.fieldErrors,
+            o?.fieldErrors
           );
-          return s.isValid && (d?.isValid ?? !0) ? (r.submitValidatedForm(void 0), !0) : (d?.fieldErrors && Object.entries(d.fieldErrors).forEach(
-            ([a, I]) => {
-              r.form.setError(a, {
+          return i.isValid && (o?.isValid ?? !0) ? (t.submitValidatedForm(void 0), !0) : (o?.fieldErrors && Object.entries(o.fieldErrors).forEach(
+            ([a, O]) => {
+              t.form.setError(a, {
                 type: "validate",
-                message: I.message
+                message: O.message
               });
             }
-          ), q({
-            fieldErrors: A,
+          ), z({
+            fieldErrors: L,
             fieldsInOrder: e,
             showToast: (a) => {
-              r.formContext?.transport?.showFormErrorToast?.(
+              t.formContext?.transport?.showFormErrorToast?.(
                 a
               );
             }
           }), !1);
         },
-        hasErrors: Object.keys(r.form.formState?.errors || {}).length > 0,
-        errors: r.form.formState?.errors,
-        isValid: r.form.formState?.isValid
+        hasErrors: Object.keys(t.form.formState?.errors || {}).length > 0,
+        errors: t.form.formState?.errors,
+        isValid: t.form.formState?.isValid,
+        stepActions: r ? {
+          currentStep: r.currentStep,
+          totalSteps: r.totalSteps,
+          isFirstStep: r.isFirstStep,
+          isLastStep: r.isLastStep,
+          canProceed: r.canProceed,
+          goNext: r.goNext,
+          goPrev: r.goPrev,
+          goToStep: r.goToStep,
+          isStepComplete: r.isStepComplete,
+          isStepVisited: r.isStepVisited
+        } : void 0
       }),
-      [i.fields, r, o]
+      [s.fields, s.formType, t, c, r]
     );
-    const p = i.gapBetweenFields ?? 6, _ = `grid ${M[i.columns || 1]} ${$[p] ?? "gap-x-6"} ${N[p] ?? "gap-y-6"}`, V = (e) => /* @__PURE__ */ c(
-      P,
+    const g = s.gapBetweenFields ?? 6, u = `grid ${q[s.columns || 1]} ${B[g] ?? "gap-x-6"} ${X[g] ?? "gap-y-6"}`, E = (e) => /* @__PURE__ */ l(
+      Y,
       {
         field: e,
-        formHelpers: r,
-        formConfig: i,
-        supportedValues: g
+        formHelpers: t,
+        formConfig: s,
+        supportedValues: w
       },
       e.id
-    );
-    return /* @__PURE__ */ c(
+    ), f = (e) => s?.enableFieldOrdering ? [...e].sort((i, o) => (i?.order ?? 0) - (o?.order ?? 0)).map(E) : e.map(E);
+    return s.formType === "stepped" && r ? /* @__PURE__ */ l(
+      "form",
+      {
+        id: p || "react-hooks-form",
+        onSubmit: t.handleSubmit(void 0),
+        children: /* @__PURE__ */ l("div", { className: u, children: f(r.currentStepFields) })
+      }
+    ) : s.formType === "grouped" && r ? /* @__PURE__ */ l(
+      "form",
+      {
+        id: p || "react-hooks-form",
+        onSubmit: t.handleSubmit(void 0),
+        children: r.groups.map((e) => {
+          const i = s.fields.filter(
+            (o) => e.fieldIds.includes(o.id)
+          );
+          return /* @__PURE__ */ T("fieldset", { className: "mb-6", children: [
+            e.title && /* @__PURE__ */ l("legend", { className: "text-lg font-semibold mb-3", children: e.title }),
+            e.description && /* @__PURE__ */ l("p", { className: "text-sm text-muted-foreground mb-4", children: e.description }),
+            /* @__PURE__ */ l("div", { className: u, children: f(i) })
+          ] }, e.groupId);
+        })
+      }
+    ) : /* @__PURE__ */ l(
       "form",
       {
-        id: R || "react-hooks-form",
-        onSubmit: r.handleSubmit(void 0),
-        children: /* @__PURE__ */ c("div", { className: _, children: i?.enableFieldOrdering ? i?.fields?.sort((e, s) => (e?.order ?? 0) - (s?.order ?? 0)).map(V) : i?.fields?.map(V) })
+        id: p || "react-hooks-form",
+        onSubmit: t.handleSubmit(void 0),
+        children: /* @__PURE__ */ l("div", { className: u, children: f(s.fields) })
       }
     );
   }
 );
 export {
-  C as ReactHooksForm
+  de as ReactHooksForm
 };

package/dist/form-react/fields.d.ts

@@ -21,3 +21,5 @@ export { NumericComboboxField } from './Fields/NumericComboboxField';
 export { MultiMonthPickerField } from './Fields/MultiMonthPickerField';
 export { MultiWeekPickerField } from './Fields/MultiWeekPickerField';
 export { TextFieldWithBackendValidation } from './Fields/TextFieldWithBackendValidation';
+export { SliderRangeField } from './Fields/SliderRangeField';
+export { RichTextField } from './Fields/RichTextField';

package/dist/form-react/fields.js

@@ -1,38 +1,42 @@
 import { TextField as r } from "./Fields/TextField.js";
 import { TextAreaField as i } from "./Fields/TextAreaField.js";
-import { ButtonsGroupField as F } from "./Fields/ButtonsGroupField.js";
-import { RadioField as p } from "./Fields/RadioField.js";
+import { ButtonsGroupField as d } from "./Fields/ButtonsGroupField.js";
+import { RadioField as F } from "./Fields/RadioField.js";
 import { DateRangeField as m } from "./Fields/DateRangeField.js";
 import { WeekRangeField as a } from "./Fields/WeekRangePicker.js";
 import { MonthRangeField as c } from "./Fields/MonthRangeField.js";
 import { FileUploadField as k } from "./Fields/FileUploadField.js";
-import { SelectField as B } from "./Fields/SelectField.js";
-import { CheckboxField as R } from "./Fields/CheckboxField.js";
-import { SwitchField as g } from "./Fields/SwitchField.js";
-import { ChipsField as C } from "./Fields/ChipsField.js";
-import { DateInputField as T } from "./Fields/DateInputField.js";
-import { FillFormByPasteField as y } from "./Fields/FillFormByPasteField.js";
-import { FillFormByFileUploadField as S } from "./Fields/FillFormByFileUploadField.js";
+import { SelectField as R } from "./Fields/SelectField.js";
+import { CheckboxField as B } from "./Fields/CheckboxField.js";
+import { SwitchField as T } from "./Fields/SwitchField.js";
+import { ChipsField as s } from "./Fields/ChipsField.js";
+import { DateInputField as P } from "./Fields/DateInputField.js";
+import { FillFormByPasteField as W } from "./Fields/FillFormByPasteField.js";
+import { FillFormByFileUploadField as D } from "./Fields/FillFormByFileUploadField.js";
 import { NumericComboboxField as w } from "./Fields/NumericComboboxField.js";
 import { MultiMonthPickerField as G } from "./Fields/MultiMonthPickerField.js";
 import { MultiWeekPickerField as N } from "./Fields/MultiWeekPickerField.js";
 import { TextFieldWithBackendValidation as j } from "./Fields/TextFieldWithBackendValidation.js";
+import { SliderRangeField as v } from "./Fields/SliderRangeField.js";
+import { RichTextField as E } from "./Fields/RichTextField.js";
 export {
-  F as ButtonsGroupField,
-  R as CheckboxField,
-  C as ChipsField,
-  T as DateInputField,
+  d as ButtonsGroupField,
+  B as CheckboxField,
+  s as ChipsField,
+  P as DateInputField,
   m as DateRangeField,
   k as FileUploadField,
-  S as FillFormByFileUploadField,
-  y as FillFormByPasteField,
+  D as FillFormByFileUploadField,
+  W as FillFormByPasteField,
   c as MonthRangeField,
   G as MultiMonthPickerField,
   N as MultiWeekPickerField,
   w as NumericComboboxField,
-  p as RadioField,
-  B as SelectField,
-  g as SwitchField,
+  F as RadioField,
+  E as RichTextField,
+  R as SelectField,
+  v as SliderRangeField,
+  T as SwitchField,
   i as TextAreaField,
   r as TextField,
   j as TextFieldWithBackendValidation,

package/dist/form-react/hooks/useCascadingForm.d.ts

@@ -1,6 +1,6 @@
 import { UseFormReturn } from 'react-hook-form';
 import { IField } from '../types/fields.types';
-import { IFormConfig, FieldVisibilityBase } from '../types/reactHookForm.types';
+import { IFormConfig } from '../types/reactHookForm.types';
 import { ReactHookFormState } from './useReactHookForm';
 import { EvaluateFieldValidationOptions } from '../utils/evaluateFieldValidation';
 export interface UseCascadingFormConfig {
@@ -12,6 +12,5 @@ export interface UseCascadingFormReturn {
     clearSubsequentFields: (fieldName: string) => void;
     getEarlierFieldsIds: (currentFieldId: string, onlyMandatory?: boolean) => string[];
     setValueWithCascading: (fieldName: string, value: unknown) => void;
-    isCascadingDisabled: (field: FieldVisibilityBase) => boolean;
 }
 export declare const useCascadingForm: (form: UseFormReturn<ReactHookFormState>, formConfig: IFormConfig, cascadingFormConfig: UseCascadingFormConfig) => UseCascadingFormReturn;

package/dist/form-react/hooks/useCascadingForm.js

@@ -1,122 +1,114 @@
-import { useCallback as r, useEffect as g } from "react";
+import { useCallback as r, useEffect as E } from "react";
 import { isEmptyValue as V } from "../../form-engine/is-empty-value.js";
-import { getDependentFieldIds as v, computeIsCascadingDisabled as x } from "../../form-engine/field-dependency-graph.js";
-import { batchSetFormFieldValues as D } from "../utils/batchFormFieldUpdates.js";
-import { isFieldValueValid as S } from "../utils/buildFieldValidationRules.js";
-import { findFieldByPath as T } from "../utils/fieldPath.utils.js";
-const B = (a, s, h) => {
-  const { getFieldDefaultValue: c, resolveFieldValidationEvaluationOptions: F } = h, p = r(
-    () => s.fields.filter((e) => e.isRequired),
-    [s.fields]
+import { getDependentFieldIds as v } from "../../form-engine/field-dependency-graph.js";
+import { batchSetFormFieldValues as x } from "../utils/batchFormFieldUpdates.js";
+import { isFieldValueValid as f } from "../utils/buildFieldValidationRules.js";
+import { findFieldByPath as D } from "../utils/fieldPath.utils.js";
+const M = (n, i, h) => {
+  const { getFieldDefaultValue: c, resolveFieldValidationEvaluationOptions: F } = h, o = r(
+    () => i.fields.filter((e) => e.isRequired),
+    [i.fields]
   ), y = r(
     (e) => {
-      if (!s.isCascading)
+      if (!i.isCascading)
         return !0;
-      const n = a.getValues(), d = p(), i = d.findIndex(
+      const a = n.getValues(), l = o(), s = l.findIndex(
         (t) => t.id === e.id
       );
-      if (i === -1)
-        return d.every(
-          (t) => !V(n[t.id])
+      if (s === -1)
+        return l.every(
+          (t) => !V(a[t.id])
         );
-      for (let t = 0; t < i; t += 1) {
-        const l = d[t];
-        if (V(n[l.id]))
+      for (let t = 0; t < s; t += 1) {
+        const d = l[t];
+        if (V(a[d.id]))
           return !1;
       }
       return !0;
     },
-    [a, s.isCascading, p]
+    [n, i.isCascading, o]
   ), I = r(
-    (e, n = !1) => {
-      let i = s.fields.filter(
-        (l) => l.fieldType !== "label" && l.fieldType !== "divider"
+    (e, a = !1) => {
+      let s = i.fields.filter(
+        (d) => d.fieldType !== "label" && d.fieldType !== "divider"
       );
-      n && (i = i.filter((l) => l.isRequired));
-      const t = i.findIndex(
-        (l) => l.id === e
+      a && (s = s.filter((d) => d.isRequired));
+      const t = s.findIndex(
+        (d) => d.id === e
       );
-      return t === -1 ? [] : i.slice(0, t).map((l) => l.id);
+      return t === -1 ? [] : s.slice(0, t).map((d) => d.id);
     },
-    [s.fields]
-  ), o = r(
+    [i.fields]
+  ), p = r(
     (e) => {
-      const n = v(
-        s.fields,
+      const a = v(
+        i.fields,
         e
-      ), d = new Set(n);
-      return s.fields.filter(
-        (i) => d.has(i.id)
+      ), l = new Set(a);
+      return i.fields.filter(
+        (s) => l.has(s.id)
       );
     },
-    [s.fields]
+    [i.fields]
   ), u = r(
     (e) => {
-      if (!s.isCascading)
+      if (!i.isCascading)
         return;
-      const n = o(e), d = a.getValues(), i = n.map((t) => {
-        const l = c(t);
-        return d[t.id] === l ? null : {
+      const a = p(e), l = n.getValues(), s = a.map((t) => {
+        const d = c(t);
+        return l[t.id] === d ? null : {
           fieldName: t.id,
-          value: l
+          value: d
         };
       }).filter(
         (t) => t !== null
       );
-      D(a, i, {
+      x(n, s, {
         shouldDirty: !0,
         shouldValidate: !1
       });
     },
-    [a, s.isCascading, o, c]
+    [n, i.isCascading, p, c]
   );
-  g(() => {
-    if (!s.isCascading)
+  E(() => {
+    if (!i.isCascading)
       return;
-    const e = a.watch((n, { name: d, type: i }) => {
-      d && i === "change" && u(d);
+    const e = n.watch((a, { name: l, type: s }) => {
+      l && s === "change" && u(l);
     });
     return () => e.unsubscribe();
-  }, [a, s.isCascading, u]);
+  }, [n, i.isCascading, u]);
   const b = r(
-    (e, n) => {
-      a.setValue(e, n, {
+    (e, a) => {
+      n.setValue(e, a, {
         shouldValidate: !0,
         shouldDirty: !0
       });
-      const d = T(s.fields, e);
-      if (d) {
-        const i = F?.(e);
-        S(
-          d,
-          n,
-          i
-        ) && a.clearErrors(e);
+      const l = D(i.fields, e);
+      if (l) {
+        const s = F?.(e);
+        f(
+          l,
+          a,
+          s
+        ) && n.clearErrors(e);
       }
       u(e);
     },
     [
-      a,
-      s.fields,
+      n,
+      i.fields,
       u,
       F
     ]
-  ), E = r(
-    (e) => x(
-      e,
-      a.getValues(),
-      !!s.isCascading
-    ),
-    [a, s.isCascading]
   );
   return {
     areEarlierMandatoryFieldsFilled: y,
     clearSubsequentFields: u,
     getEarlierFieldsIds: I,
-    setValueWithCascading: b,
-    isCascadingDisabled: E
+    setValueWithCascading: b
   };
 };
 export {
-  B as useCascadingForm
+  M as useCascadingForm
 };

package/dist/form-react/hooks/useFieldVisibility.d.ts

@@ -3,12 +3,11 @@ import { IFormConfig, FieldVisibilityBase, ReactHookFormState } from '../types/r
 interface UseFieldVisibilityParams {
     form: UseFormReturn<ReactHookFormState>;
     formConfig: IFormConfig;
-    isCascadingDisabled: (field: FieldVisibilityBase) => boolean;
 }
 export interface UseFieldVisibilityReturn {
     isFieldVisible: (field: FieldVisibilityBase) => boolean;
     isFieldDisabled: (field: FieldVisibilityBase) => boolean;
     isFieldDisabledForSubmitValidation: (field: FieldVisibilityBase) => boolean;
 }
-export declare function useFieldVisibility({ form, formConfig, isCascadingDisabled, }: UseFieldVisibilityParams): UseFieldVisibilityReturn;
+export declare function useFieldVisibility({ form, formConfig, }: UseFieldVisibilityParams): UseFieldVisibilityReturn;
 export {};