@trackunit/custom-field-components 0.0.740 → 0.0.743

package/index.cjs.js

@@ -8,6 +8,7 @@ var irisAppRuntimeCore = require('@trackunit/iris-app-runtime-core');
 var reactFormComponents = require('@trackunit/react-form-components');
 var sharedUtils = require('@trackunit/shared-utils');
 var React = require('react');
+var reactHookForm = require('react-hook-form');
 var uuid = require('uuid');
 
 function _interopNamespace(e) {
@@ -391,7 +392,7 @@ const useUnitTranslation = () => {
  * and functions for form registration and state management.
  * @returns {JSX.Element | null} - The JSX Element for the custom field or null if the field definition is not provided.
  */
-const useCustomFieldResolver = ({ field, definition, register, setValue, formState, formValue, unitPreference = "SI", language, fieldId, isEditable, }) => {
+const useCustomFieldResolver = ({ field, definition, register, setValue, formState, formValue, unitPreference = "SI", language, fieldId, isEditable, control, }) => {
     var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l;
     const validation = { register, setValue, formState };
     const { unitTranslation } = useUnitTranslation();
@@ -410,38 +411,34 @@ const useCustomFieldResolver = ({ field, definition, register, setValue, formSta
     });
     const { getPhoneNumberValidationRules } = reactFormComponents.useGetPhoneValidationRules();
     const def = (_a = field === null || field === void 0 ? void 0 : field.definition) !== null && _a !== void 0 ? _a : definition;
-    if (def === undefined || def.__typename === undefined) {
-        return null;
-    }
     const uniqueIdentifier = (_b = fieldId !== null && fieldId !== void 0 ? fieldId : def === null || def === void 0 ? void 0 : def.id) !== null && _b !== void 0 ? _b : "";
+    const value = useValue(uniqueIdentifier, numberValue, control, def, field);
     const key = (_c = def === null || def === void 0 ? void 0 : def.key) !== null && _c !== void 0 ? _c : uniqueIdentifier;
     const fieldError = uniqueIdentifier ? validation.formState.errors[uniqueIdentifier] : undefined;
     const errorMessage = fieldError ? fieldError.message + "" : undefined;
     const { description, title } = def !== null && def !== void 0 ? def : {};
     const isEditableCombined = (_e = (_d = isEditable !== null && isEditable !== void 0 ? isEditable : field === null || field === void 0 ? void 0 : field.valueEditable) !== null && _d !== void 0 ? _d : def === null || def === void 0 ? void 0 : def.uiEditable) !== null && _e !== void 0 ? _e : false;
+    if (def === undefined || def.__typename === undefined) {
+        return null;
+    }
     switch (def.__typename) {
         case "WebAddressFieldDefinition": {
-            const value = (field === null || field === void 0 ? void 0 : field.__typename) === "WebAddressFieldValueAndDefinition" ? field.stringValue : null;
             const rules = getWebAddressValidationRules(def);
             return (jsxRuntime.jsx(reactFormComponents.TextField, Object.assign({ actions: !isEditableCombined && formValue && jsxRuntime.jsx(reactFormComponents.ActionButton, { type: "WEB_ADDRESS", value: formValue }), dataTestId: `${key}`, errorMessage: errorMessage, helpText: description, id: uniqueIdentifier, label: title, placeholder: title !== null && title !== void 0 ? title : "", readOnly: !isEditableCombined }, validation.register(uniqueIdentifier, Object.assign(Object.assign({}, rules), { value })))));
         }
         case "EmailFieldDefinition": {
-            const value = (field === null || field === void 0 ? void 0 : field.__typename) === "EmailFieldValueAndDefinition" ? field.stringValue : null;
             const rules = getEmailValidationRules(def);
             return (jsxRuntime.jsx(reactFormComponents.TextField, Object.assign({ actions: !isEditableCombined && formValue && jsxRuntime.jsx(reactFormComponents.ActionButton, { type: "EMAIL", value: formValue }), dataTestId: `${key}`, errorMessage: errorMessage, helpText: description, id: uniqueIdentifier, label: title, placeholder: title !== null && title !== void 0 ? title : "", readOnly: !isEditableCombined }, validation.register(uniqueIdentifier, Object.assign(Object.assign({}, rules), { value })))));
         }
         case "PhoneNumberFieldDefinition": {
-            const value = (field === null || field === void 0 ? void 0 : field.__typename) === "PhoneNumberFieldValueAndDefinition" ? field.stringValue : null;
             const rules = getPhoneNumberValidationRules(!Boolean(def.uiEditable));
-            return (jsxRuntime.jsx(reactFormComponents.PhoneField, Object.assign({ dataTestId: `${key}`, errorMessage: errorMessage, helpText: description, id: uniqueIdentifier, label: title, placeholder: title !== null && title !== void 0 ? title : "", readOnly: !isEditableCombined, value: value !== null && value !== void 0 ? value : "" }, validation.register(uniqueIdentifier, Object.assign(Object.assign({}, rules), { value })))));
+            return (jsxRuntime.jsx(reactFormComponents.PhoneField, Object.assign({ dataTestId: `${key}`, errorMessage: errorMessage, helpText: description, id: uniqueIdentifier, label: title, placeholder: title !== null && title !== void 0 ? title : "", readOnly: !isEditableCombined, value: value }, validation.register(uniqueIdentifier, Object.assign({}, rules)))));
         }
         case "StringFieldDefinition": {
-            const value = (field === null || field === void 0 ? void 0 : field.__typename) === "StringFieldValueAndDefinition" ? field.stringValue : null;
             const rules = getStringValidationRules(def);
             return (jsxRuntime.jsx(reactFormComponents.TextField, Object.assign({ dataTestId: `${key}`, errorMessage: errorMessage, helpText: description, id: uniqueIdentifier, label: title, placeholder: title !== null && title !== void 0 ? title : "", readOnly: !isEditableCombined }, validation.register(uniqueIdentifier, Object.assign(Object.assign({}, rules), { value })))));
         }
         case "NumberFieldDefinition": {
-            const value = (field === null || field === void 0 ? void 0 : field.__typename) === "NumberFieldValueAndDefinition" ? field.numberValue : null;
             const rules = getNumberValidationRules(def);
             const unit = unitPreference === "US_CUSTOMARY" && def.unitUs ? def.unitUs : def.unitSi;
             const numberProps = {
@@ -451,23 +448,16 @@ const useCustomFieldResolver = ({ field, definition, register, setValue, formSta
             return (jsxRuntime.jsx(reactFormComponents.NumberField, Object.assign({ dataTestId: `${key}`, errorMessage: errorMessage, helpText: description, id: uniqueIdentifier, label: title, max: (_f = def.maximumNumber) !== null && _f !== void 0 ? _f : undefined, min: (_g = def.minimumNumber) !== null && _g !== void 0 ? _g : undefined, readOnly: !isEditableCombined, step: def.isInteger ? 1 : "any" }, validation.register(uniqueIdentifier, Object.assign(Object.assign({}, rules), { value })), numberProps)));
         }
         case "BooleanFieldDefinition": {
-            const value = (field === null || field === void 0 ? void 0 : field.__typename) === "BooleanFieldValueAndDefinition" ? field.booleanValue : null;
             const rules = getBooleanValidationRules();
             return (jsxRuntime.jsx(BooleanCustomField, { dataTestId: `${key}`, defaultValue: value !== null && value !== void 0 ? value : undefined, errorMessage: errorMessage, helpText: description, id: uniqueIdentifier, label: title !== null && title !== void 0 ? title : "", readOnly: !isEditableCombined, register: validation.register, setValue: validation.setValue, validationRules: rules }));
         }
         case "DropDownFieldDefinition": {
-            const value = (field === null || field === void 0 ? void 0 : field.__typename) === "DropDownFieldValueAndDefinition" ? field.stringArrayValue : null;
             const rules = getDropdownValidationRules();
             return (jsxRuntime.jsx(DropdownCustomField, { allValues: (_h = def.allValues) !== null && _h !== void 0 ? _h : undefined, dataTestId: `${key}`, defaultValue: value !== null && value !== void 0 ? value : undefined, disabled: !isEditableCombined, errorMessage: errorMessage, helpText: description, id: uniqueIdentifier, label: title || "", multiSelect: (_j = def.multiSelect) !== null && _j !== void 0 ? _j : false, register: validation.register, setValue: validation.setValue, validationRules: rules }));
         }
         case "DateFieldDefinition": {
-            const value = (field === null || field === void 0 ? void 0 : field.__typename) === "DateFieldValueAndDefinition" ? field.dateValue : null;
             const rules = getDateValidationRules();
-            let defaultValue;
-            if (value !== undefined && value !== null) {
-                defaultValue = new Date(value);
-            }
-            return (jsxRuntime.jsx(DateCustomField, { dataTestId: `${key}`, defaultValue: defaultValue, errorMessage: errorMessage, helpText: description, id: uniqueIdentifier, label: title || "", readOnly: !isEditableCombined, register: validation.register, setValue: validation.setValue, title: title || "", validationRules: rules }));
+            return (jsxRuntime.jsx(DateCustomField, { dataTestId: `${key}`, defaultValue: value, errorMessage: errorMessage, helpText: description, id: uniqueIdentifier, label: title || "", readOnly: !isEditableCombined, register: validation.register, setValue: validation.setValue, title: title || "", validationRules: rules }));
         }
         case "JsonFieldDefinition": {
             return null;
@@ -478,9 +468,6 @@ const useCustomFieldResolver = ({ field, definition, register, setValue, formSta
                 placeholder: title !== null && title !== void 0 ? title : "",
                 addonAfter: def.currency,
             };
-            const value = numberValue === undefined || numberValue === null || numberValue === ""
-                ? ""
-                : parseFloat(Number(numberValue).toPrecision(4));
             return (jsxRuntime.jsx(reactFormComponents.NumberField, Object.assign({ dataTestId: key ? key : `monetaryField`, defaultValue: value, disabled: !isEditableCombined, helpText: errorMessage || description, id: uniqueIdentifier, isInvalid: errorMessage ? true : false, label: title, max: (_k = def.maximumNumber) !== null && _k !== void 0 ? _k : undefined, min: (_l = def.minimumNumber) !== null && _l !== void 0 ? _l : undefined, readOnly: !isEditableCombined, step: "any" }, validation.register(uniqueIdentifier, rules), { onChange: e => {
                     setNumberValue(e.target.value === "" ? null : e.target.value);
                     validation.register(uniqueIdentifier, rules).onChange(e);
@@ -490,6 +477,56 @@ const useCustomFieldResolver = ({ field, definition, register, setValue, formSta
             return sharedUtils.exhaustiveCheck(def);
     }
 };
+const useValue = (uniqueIdentifier, numberValue, control, def, field) => {
+    // workaround that ensures the value in the phone number field is updated if the formState changes.
+    // Would probably be better to use PhoneFieldWithController, but doing that makes the form dirty on initial load.
+    const initialValue = (field === null || field === void 0 ? void 0 : field.__typename) === "PhoneNumberFieldValueAndDefinition" ? field.stringValue : null;
+    const watchedValue = reactHookForm.useWatch({ name: uniqueIdentifier, defaultValue: initialValue, control });
+    if (!def) {
+        return null;
+    }
+    switch (def.__typename) {
+        case "WebAddressFieldDefinition": {
+            return (field === null || field === void 0 ? void 0 : field.__typename) === "WebAddressFieldValueAndDefinition" ? field.stringValue : null;
+        }
+        case "EmailFieldDefinition": {
+            return (field === null || field === void 0 ? void 0 : field.__typename) === "EmailFieldValueAndDefinition" ? field.stringValue : null;
+        }
+        case "PhoneNumberFieldDefinition": {
+            return watchedValue;
+        }
+        case "StringFieldDefinition": {
+            return (field === null || field === void 0 ? void 0 : field.__typename) === "StringFieldValueAndDefinition" ? field.stringValue : null;
+        }
+        case "NumberFieldDefinition": {
+            return (field === null || field === void 0 ? void 0 : field.__typename) === "NumberFieldValueAndDefinition" ? field.numberValue : null;
+        }
+        case "BooleanFieldDefinition": {
+            return (field === null || field === void 0 ? void 0 : field.__typename) === "BooleanFieldValueAndDefinition" ? field.booleanValue : null;
+        }
+        case "DropDownFieldDefinition": {
+            return (field === null || field === void 0 ? void 0 : field.__typename) === "DropDownFieldValueAndDefinition" ? field.stringArrayValue : null;
+        }
+        case "DateFieldDefinition": {
+            const value = (field === null || field === void 0 ? void 0 : field.__typename) === "DateFieldValueAndDefinition" ? field.dateValue : null;
+            let defaultValue;
+            if (value !== undefined && value !== null) {
+                defaultValue = new Date(value);
+            }
+            return defaultValue;
+        }
+        case "JsonFieldDefinition": {
+            return null;
+        }
+        case "MonetaryFieldDefinition": {
+            return numberValue === undefined || numberValue === null || numberValue === ""
+                ? ""
+                : parseFloat(Number(numberValue).toPrecision(4));
+        }
+        default:
+            return sharedUtils.exhaustiveCheck(def);
+    }
+};
 /**
  * CustomField is a React component that takes in the properties of a custom field and renders it.
  * It utilizes the `useCustomFieldResolver` hook to resolve the field into an input element

package/index.esm.js

@@ -5,6 +5,7 @@ import { FormGroup, Checkbox, DateField, Select, useGetPhoneValidationRules, Num
 import { exhaustiveCheck } from '@trackunit/shared-utils';
 import * as React from 'react';
 import { useCallback, useEffect, createElement, useState } from 'react';
+import { useWatch } from 'react-hook-form';
 import { v4 } from 'uuid';
 
 var defaultTranslations = {
@@ -368,7 +369,7 @@ const useUnitTranslation = () => {
  * and functions for form registration and state management.
  * @returns {JSX.Element | null} - The JSX Element for the custom field or null if the field definition is not provided.
  */
-const useCustomFieldResolver = ({ field, definition, register, setValue, formState, formValue, unitPreference = "SI", language, fieldId, isEditable, }) => {
+const useCustomFieldResolver = ({ field, definition, register, setValue, formState, formValue, unitPreference = "SI", language, fieldId, isEditable, control, }) => {
     var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l;
     const validation = { register, setValue, formState };
     const { unitTranslation } = useUnitTranslation();
@@ -387,38 +388,34 @@ const useCustomFieldResolver = ({ field, definition, register, setValue, formSta
     });
     const { getPhoneNumberValidationRules } = useGetPhoneValidationRules();
     const def = (_a = field === null || field === void 0 ? void 0 : field.definition) !== null && _a !== void 0 ? _a : definition;
-    if (def === undefined || def.__typename === undefined) {
-        return null;
-    }
     const uniqueIdentifier = (_b = fieldId !== null && fieldId !== void 0 ? fieldId : def === null || def === void 0 ? void 0 : def.id) !== null && _b !== void 0 ? _b : "";
+    const value = useValue(uniqueIdentifier, numberValue, control, def, field);
     const key = (_c = def === null || def === void 0 ? void 0 : def.key) !== null && _c !== void 0 ? _c : uniqueIdentifier;
     const fieldError = uniqueIdentifier ? validation.formState.errors[uniqueIdentifier] : undefined;
     const errorMessage = fieldError ? fieldError.message + "" : undefined;
     const { description, title } = def !== null && def !== void 0 ? def : {};
     const isEditableCombined = (_e = (_d = isEditable !== null && isEditable !== void 0 ? isEditable : field === null || field === void 0 ? void 0 : field.valueEditable) !== null && _d !== void 0 ? _d : def === null || def === void 0 ? void 0 : def.uiEditable) !== null && _e !== void 0 ? _e : false;
+    if (def === undefined || def.__typename === undefined) {
+        return null;
+    }
     switch (def.__typename) {
         case "WebAddressFieldDefinition": {
-            const value = (field === null || field === void 0 ? void 0 : field.__typename) === "WebAddressFieldValueAndDefinition" ? field.stringValue : null;
             const rules = getWebAddressValidationRules(def);
             return (jsx(TextField, Object.assign({ actions: !isEditableCombined && formValue && jsx(ActionButton, { type: "WEB_ADDRESS", value: formValue }), dataTestId: `${key}`, errorMessage: errorMessage, helpText: description, id: uniqueIdentifier, label: title, placeholder: title !== null && title !== void 0 ? title : "", readOnly: !isEditableCombined }, validation.register(uniqueIdentifier, Object.assign(Object.assign({}, rules), { value })))));
         }
         case "EmailFieldDefinition": {
-            const value = (field === null || field === void 0 ? void 0 : field.__typename) === "EmailFieldValueAndDefinition" ? field.stringValue : null;
             const rules = getEmailValidationRules(def);
             return (jsx(TextField, Object.assign({ actions: !isEditableCombined && formValue && jsx(ActionButton, { type: "EMAIL", value: formValue }), dataTestId: `${key}`, errorMessage: errorMessage, helpText: description, id: uniqueIdentifier, label: title, placeholder: title !== null && title !== void 0 ? title : "", readOnly: !isEditableCombined }, validation.register(uniqueIdentifier, Object.assign(Object.assign({}, rules), { value })))));
         }
         case "PhoneNumberFieldDefinition": {
-            const value = (field === null || field === void 0 ? void 0 : field.__typename) === "PhoneNumberFieldValueAndDefinition" ? field.stringValue : null;
             const rules = getPhoneNumberValidationRules(!Boolean(def.uiEditable));
-            return (jsx(PhoneField, Object.assign({ dataTestId: `${key}`, errorMessage: errorMessage, helpText: description, id: uniqueIdentifier, label: title, placeholder: title !== null && title !== void 0 ? title : "", readOnly: !isEditableCombined, value: value !== null && value !== void 0 ? value : "" }, validation.register(uniqueIdentifier, Object.assign(Object.assign({}, rules), { value })))));
+            return (jsx(PhoneField, Object.assign({ dataTestId: `${key}`, errorMessage: errorMessage, helpText: description, id: uniqueIdentifier, label: title, placeholder: title !== null && title !== void 0 ? title : "", readOnly: !isEditableCombined, value: value }, validation.register(uniqueIdentifier, Object.assign({}, rules)))));
         }
         case "StringFieldDefinition": {
-            const value = (field === null || field === void 0 ? void 0 : field.__typename) === "StringFieldValueAndDefinition" ? field.stringValue : null;
             const rules = getStringValidationRules(def);
             return (jsx(TextField, Object.assign({ dataTestId: `${key}`, errorMessage: errorMessage, helpText: description, id: uniqueIdentifier, label: title, placeholder: title !== null && title !== void 0 ? title : "", readOnly: !isEditableCombined }, validation.register(uniqueIdentifier, Object.assign(Object.assign({}, rules), { value })))));
         }
         case "NumberFieldDefinition": {
-            const value = (field === null || field === void 0 ? void 0 : field.__typename) === "NumberFieldValueAndDefinition" ? field.numberValue : null;
             const rules = getNumberValidationRules(def);
             const unit = unitPreference === "US_CUSTOMARY" && def.unitUs ? def.unitUs : def.unitSi;
             const numberProps = {
@@ -428,23 +425,16 @@ const useCustomFieldResolver = ({ field, definition, register, setValue, formSta
             return (jsx(NumberField, Object.assign({ dataTestId: `${key}`, errorMessage: errorMessage, helpText: description, id: uniqueIdentifier, label: title, max: (_f = def.maximumNumber) !== null && _f !== void 0 ? _f : undefined, min: (_g = def.minimumNumber) !== null && _g !== void 0 ? _g : undefined, readOnly: !isEditableCombined, step: def.isInteger ? 1 : "any" }, validation.register(uniqueIdentifier, Object.assign(Object.assign({}, rules), { value })), numberProps)));
         }
         case "BooleanFieldDefinition": {
-            const value = (field === null || field === void 0 ? void 0 : field.__typename) === "BooleanFieldValueAndDefinition" ? field.booleanValue : null;
             const rules = getBooleanValidationRules();
             return (jsx(BooleanCustomField, { dataTestId: `${key}`, defaultValue: value !== null && value !== void 0 ? value : undefined, errorMessage: errorMessage, helpText: description, id: uniqueIdentifier, label: title !== null && title !== void 0 ? title : "", readOnly: !isEditableCombined, register: validation.register, setValue: validation.setValue, validationRules: rules }));
         }
         case "DropDownFieldDefinition": {
-            const value = (field === null || field === void 0 ? void 0 : field.__typename) === "DropDownFieldValueAndDefinition" ? field.stringArrayValue : null;
             const rules = getDropdownValidationRules();
             return (jsx(DropdownCustomField, { allValues: (_h = def.allValues) !== null && _h !== void 0 ? _h : undefined, dataTestId: `${key}`, defaultValue: value !== null && value !== void 0 ? value : undefined, disabled: !isEditableCombined, errorMessage: errorMessage, helpText: description, id: uniqueIdentifier, label: title || "", multiSelect: (_j = def.multiSelect) !== null && _j !== void 0 ? _j : false, register: validation.register, setValue: validation.setValue, validationRules: rules }));
         }
         case "DateFieldDefinition": {
-            const value = (field === null || field === void 0 ? void 0 : field.__typename) === "DateFieldValueAndDefinition" ? field.dateValue : null;
             const rules = getDateValidationRules();
-            let defaultValue;
-            if (value !== undefined && value !== null) {
-                defaultValue = new Date(value);
-            }
-            return (jsx(DateCustomField, { dataTestId: `${key}`, defaultValue: defaultValue, errorMessage: errorMessage, helpText: description, id: uniqueIdentifier, label: title || "", readOnly: !isEditableCombined, register: validation.register, setValue: validation.setValue, title: title || "", validationRules: rules }));
+            return (jsx(DateCustomField, { dataTestId: `${key}`, defaultValue: value, errorMessage: errorMessage, helpText: description, id: uniqueIdentifier, label: title || "", readOnly: !isEditableCombined, register: validation.register, setValue: validation.setValue, title: title || "", validationRules: rules }));
         }
         case "JsonFieldDefinition": {
             return null;
@@ -455,9 +445,6 @@ const useCustomFieldResolver = ({ field, definition, register, setValue, formSta
                 placeholder: title !== null && title !== void 0 ? title : "",
                 addonAfter: def.currency,
             };
-            const value = numberValue === undefined || numberValue === null || numberValue === ""
-                ? ""
-                : parseFloat(Number(numberValue).toPrecision(4));
             return (jsx(NumberField, Object.assign({ dataTestId: key ? key : `monetaryField`, defaultValue: value, disabled: !isEditableCombined, helpText: errorMessage || description, id: uniqueIdentifier, isInvalid: errorMessage ? true : false, label: title, max: (_k = def.maximumNumber) !== null && _k !== void 0 ? _k : undefined, min: (_l = def.minimumNumber) !== null && _l !== void 0 ? _l : undefined, readOnly: !isEditableCombined, step: "any" }, validation.register(uniqueIdentifier, rules), { onChange: e => {
                     setNumberValue(e.target.value === "" ? null : e.target.value);
                     validation.register(uniqueIdentifier, rules).onChange(e);
@@ -467,6 +454,56 @@ const useCustomFieldResolver = ({ field, definition, register, setValue, formSta
             return exhaustiveCheck(def);
     }
 };
+const useValue = (uniqueIdentifier, numberValue, control, def, field) => {
+    // workaround that ensures the value in the phone number field is updated if the formState changes.
+    // Would probably be better to use PhoneFieldWithController, but doing that makes the form dirty on initial load.
+    const initialValue = (field === null || field === void 0 ? void 0 : field.__typename) === "PhoneNumberFieldValueAndDefinition" ? field.stringValue : null;
+    const watchedValue = useWatch({ name: uniqueIdentifier, defaultValue: initialValue, control });
+    if (!def) {
+        return null;
+    }
+    switch (def.__typename) {
+        case "WebAddressFieldDefinition": {
+            return (field === null || field === void 0 ? void 0 : field.__typename) === "WebAddressFieldValueAndDefinition" ? field.stringValue : null;
+        }
+        case "EmailFieldDefinition": {
+            return (field === null || field === void 0 ? void 0 : field.__typename) === "EmailFieldValueAndDefinition" ? field.stringValue : null;
+        }
+        case "PhoneNumberFieldDefinition": {
+            return watchedValue;
+        }
+        case "StringFieldDefinition": {
+            return (field === null || field === void 0 ? void 0 : field.__typename) === "StringFieldValueAndDefinition" ? field.stringValue : null;
+        }
+        case "NumberFieldDefinition": {
+            return (field === null || field === void 0 ? void 0 : field.__typename) === "NumberFieldValueAndDefinition" ? field.numberValue : null;
+        }
+        case "BooleanFieldDefinition": {
+            return (field === null || field === void 0 ? void 0 : field.__typename) === "BooleanFieldValueAndDefinition" ? field.booleanValue : null;
+        }
+        case "DropDownFieldDefinition": {
+            return (field === null || field === void 0 ? void 0 : field.__typename) === "DropDownFieldValueAndDefinition" ? field.stringArrayValue : null;
+        }
+        case "DateFieldDefinition": {
+            const value = (field === null || field === void 0 ? void 0 : field.__typename) === "DateFieldValueAndDefinition" ? field.dateValue : null;
+            let defaultValue;
+            if (value !== undefined && value !== null) {
+                defaultValue = new Date(value);
+            }
+            return defaultValue;
+        }
+        case "JsonFieldDefinition": {
+            return null;
+        }
+        case "MonetaryFieldDefinition": {
+            return numberValue === undefined || numberValue === null || numberValue === ""
+                ? ""
+                : parseFloat(Number(numberValue).toPrecision(4));
+        }
+        default:
+            return exhaustiveCheck(def);
+    }
+};
 /**
  * CustomField is a React component that takes in the properties of a custom field and renders it.
  * It utilizes the `useCustomFieldResolver` hook to resolve the field into an input element

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@trackunit/custom-field-components",
-  "version": "0.0.740",
+  "version": "0.0.743",
   "repository": "https://github.com/Trackunit/manager",
   "license": "SEE LICENSE IN LICENSE.txt",
   "engines": {

package/src/CustomField.d.ts

@@ -61,7 +61,7 @@ interface CustomFieldProps {
  * and functions for form registration and state management.
  * @returns {JSX.Element | null} - The JSX Element for the custom field or null if the field definition is not provided.
  */
-export declare const useCustomFieldResolver: ({ field, definition, register, setValue, formState, formValue, unitPreference, language, fieldId, isEditable, }: CustomFieldProps) => JSX.Element | null;
+export declare const useCustomFieldResolver: ({ field, definition, register, setValue, formState, formValue, unitPreference, language, fieldId, isEditable, control, }: CustomFieldProps) => JSX.Element | null;
 /**
  * CustomField is a React component that takes in the properties of a custom field and renders it.
  * It utilizes the `useCustomFieldResolver` hook to resolve the field into an input element