@chris-c-brine/rhf-mui-kit 0.4.0 → 0.5.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { type ElementType } from "react";
|
|
2
2
|
import { type ChipProps, type ChipTypeMap, type ListItemProps } from "@mui/material";
|
|
3
|
-
import type { FieldPath, FieldValues } from "react-hook-form";
|
|
3
|
+
import type { FieldPath, FieldValue, FieldValues } from "react-hook-form";
|
|
4
4
|
import { type AutocompleteElementDisplayProps } from "./AutocompleteElementDisplay";
|
|
5
5
|
/**
|
|
6
6
|
* Extends AutocompleteElementDisplayProps with additional properties for handling object values.
|
|
@@ -21,7 +21,7 @@ export type ObjectElementDisplayProps<TValue, Multiple extends boolean | undefin
|
|
|
21
21
|
* @param value - The option value or null
|
|
22
22
|
* @returns A unique string key for the value
|
|
23
23
|
*/
|
|
24
|
-
getItemKey: (value: TValue | null) => string;
|
|
24
|
+
getItemKey: (value: TValue | null) => string | null;
|
|
25
25
|
/**
|
|
26
26
|
* Function to generate a display label for an option value.
|
|
27
27
|
* Can return any ReactNode for custom rendering.
|
|
@@ -29,7 +29,7 @@ export type ObjectElementDisplayProps<TValue, Multiple extends boolean | undefin
|
|
|
29
29
|
* @param value - The option value or null
|
|
30
30
|
* @returns A string to display as the option label
|
|
31
31
|
*/
|
|
32
|
-
getItemLabel: (value: TValue | null) => string;
|
|
32
|
+
getItemLabel: (value: TValue | null) => string | null;
|
|
33
33
|
/**
|
|
34
34
|
* Function to get additional props for an option list item.
|
|
35
35
|
* Used for customizing the rendering of the option.
|
|
@@ -69,7 +69,7 @@ export type ObjectElementDisplayProps<TValue, Multiple extends boolean | undefin
|
|
|
69
69
|
* @param value - The value that would normally be sent to the form
|
|
70
70
|
* @returns The transformed value to be stored in the form
|
|
71
71
|
*/
|
|
72
|
-
transformValue?: Multiple extends true ?
|
|
72
|
+
transformValue?: (value: Multiple extends true ? TValue[] : TValue | null) => FieldValue<FieldValues>;
|
|
73
73
|
};
|
|
74
74
|
/**
|
|
75
75
|
* A form component that displays a searchable dropdown for selecting object values.
|
|
@@ -64,7 +64,16 @@ export const ObjectElementDisplay = ({ options, autocompleteProps, getItemKey, g
|
|
|
64
64
|
/**
|
|
65
65
|
* Combined list of all available options (original + dynamically added)
|
|
66
66
|
*/
|
|
67
|
-
const allOptions = useMemo(() =>
|
|
67
|
+
const allOptions = useMemo(() => {
|
|
68
|
+
const seen = new Set();
|
|
69
|
+
return [...options, ...newOptions].filter((option) => {
|
|
70
|
+
const key = getItemKey(option);
|
|
71
|
+
if (seen.has(key))
|
|
72
|
+
return false;
|
|
73
|
+
seen.add(key);
|
|
74
|
+
return true;
|
|
75
|
+
});
|
|
76
|
+
}, [options, newOptions]);
|
|
68
77
|
return (_jsx(AutocompleteElementDisplay, { name: name, control: control, options: allOptions, ...props, autocompleteProps: {
|
|
69
78
|
/**
|
|
70
79
|
* Determines if two options should be considered equal
|
|
@@ -82,9 +91,9 @@ export const ObjectElementDisplay = ({ options, autocompleteProps, getItemKey, g
|
|
|
82
91
|
const searchValue = inputValue.toLowerCase();
|
|
83
92
|
// Filter options that match the input value (by key or label)
|
|
84
93
|
const filteredOptions = options.filter((option) => {
|
|
85
|
-
const key = getItemKey(option)
|
|
94
|
+
const key = getItemKey(option)?.toLowerCase();
|
|
86
95
|
const label = String(getItemLabel(option)).toLowerCase();
|
|
87
|
-
return key
|
|
96
|
+
return key?.includes(searchValue) || label.includes(searchValue);
|
|
88
97
|
});
|
|
89
98
|
// For freeSolo mode, add "Add [value]" option if no exact match exists
|
|
90
99
|
if (freeSolo && stringToNewItem && inputValue.length > 0) {
|
package/dist/index.cjs
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const y=require("react/jsx-runtime"),T=require("react-hook-form-mui"),h=require("react"),
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const y=require("react/jsx-runtime"),T=require("react-hook-form-mui"),h=require("react"),g=require("lodash"),M=require("@mui/material"),B=require("react-hook-form"),{merge:R}=g;function L(e,n){return n?.multiple,n?.freeSolo,e}const S=(e,n=!1,r=!1)=>R(e,n?{disabled:!0,variant:"standard",sx:{"& .MuiAutocomplete-endAdornment":{display:"none"},...r&&{"& .MuiInput-underline:before":{borderBottom:"none"},"& .MuiInput-underline:after":{borderBottom:"none"},"& .MuiInput-underline:hover:not(.Mui-disabled):before":{borderBottom:"none"}}}}:{});function w(e){return e!=null&&typeof e=="string"}const{merge:z}=g,$=({viewOnly:e=void 0,disableUnderline:n,textFieldProps:r,autocompleteProps:c,...E})=>{const f=h.useMemo(()=>z({readOnly:e,disableClearable:c?.disableClearable||e,disabled:e},c,e?{sx:{".MuiAutocomplete-tag":{opacity:"1 !important"}}}:{}),[c,e]),A=h.useMemo(()=>S(r,e,n),[r,e,n]);return y.jsx(T.AutocompleteElement,{autocompleteProps:f,textFieldProps:A,...E})},G=({options:e,autocompleteProps:n,getItemKey:r,getItemLabel:c,getChipProps:E,stringToNewItem:f,transformValue:A,name:C,freeSolo:F,control:q,getOptionProps:_,...V})=>{const{field:a}=T.useController({name:C,control:q}),[b,k]=h.useState(()=>a.value?(Array.isArray(a.value)?a.value:[a.value]).filter(t=>typeof t!="string"&&!e.some(s=>r(s)===r(t))):[]);h.useEffect(()=>{if(!a.value)return;const t=(Array.isArray(a.value)?a.value:[a.value]).filter(s=>typeof s!="string"&&![...e,...b].some(u=>r(u)===r(s)));t.length>0&&k(s=>[...s,...t])},[a.value,e,b,r]);const H=h.useMemo(()=>{const i=new Set;return[...e,...b].filter(t=>{const s=r(t);return i.has(s)?!1:(i.add(s),!0)})},[e,b]);return y.jsx($,{name:C,control:q,options:H,...V,autocompleteProps:{isOptionEqualToValue:(i,t)=>r(i)===r(t),filterOptions:(i,{inputValue:t})=>{if(!t)return i;const s=t.toLowerCase(),u=i.filter(l=>{const d=r(l)?.toLowerCase(),j=String(c(l)).toLowerCase();return d?.includes(s)||j.includes(s)});return F&&f&&t.length>0&&!u.some(d=>String(c(d)).toLowerCase()===s)?[{__isAddOption:!0,inputValue:t,...f(t)},...u]:u},freeSolo:F,autoComplete:!0,autoHighlight:!0,openOnFocus:!0,renderOption:(i,t,{selected:s},u)=>{const l=g.merge(i,_?.(t)??{});if(u?.freeSolo&&typeof t=="object"&&t!==null&&"__isAddOption"in t){const d=t.inputValue;return h.createElement(M.ListItem,{...l,key:`${C}-add-option-${d}`},"Add: '",d,"'")}return h.createElement(M.ListItem,{...l,key:`${C}-option-${r(t)}`},V?.showCheckbox&&u?.multiple&&y.jsx(M.Checkbox,{sx:{marginRight:1},checked:s}),typeof t=="string"?t:c(t))},onChange:(i,t,s,u)=>{const l=o=>A&&o!==null?a.onChange(A(o)):a.onChange(o),d=o=>{const p=r(o);[...e,...b].some(x=>r(x)===p)||k(x=>[...x,o])},j=o=>typeof o=="string"&&o.length>0?o:typeof o=="object"&&o!==null&&"__isAddOption"in o?o.inputValue:null;if(F&&f){const o=j(t);if(o){const p=f(o);if(V.multiple){const x=[...Array.isArray(a.value)?a.value:[],p];l(x)}else l(p);d(p);return}if(Array.isArray(t)&&V.multiple){const p=t?.map(m=>{const D=j(m);return D?f(D):m})??[];l(p);const O=[...e,...b].map(m=>r(m)),x=p.filter(m=>typeof m!="string"&&!O.includes(r(m)));x.length>0&&k(m=>[...m,...x]);return}}A&&t!==null?l(t):n?.onChange?.(i,t,s,u)},renderValue:(i,t,s)=>{const u=L(i,s);return Array.isArray(u)?u.map((l,d)=>{const{key:j,...o}=t({index:d}),p=typeof l=="string"?l:c(l),O=typeof l!="string"&&E?E({value:l,index:d}):{};return y.jsx(M.Chip,{...O,...o,label:p},`${C}-chip-${j}`)}):w(u)?u:u?c(u):""},...n}})},J=({viewOnly:e,disableUnderline:n,...r})=>{const c=h.useMemo(()=>S(r,e,n),[r,e,n]);return y.jsx(T.TextFieldElement,{...c})},{get:N}=g;function P(e,n){const r=N(e,n);return{error:!!r,helperText:r?.message||""}}function Q(e){const n=h.useRef(!1);h.useEffect(()=>(n.current||(e(),n.current=!0),()=>{n.current=!0}),[])}const W=({name:e,rules:n,formControlProps:r={}})=>{const{register:c,formState:{errors:E}}=B.useFormContext(),{error:f,helperText:A}=P(E,e);return y.jsxs(M.FormControl,{error:f,...r,children:[y.jsx("input",{type:"hidden",...c(e,n)}),f&&y.jsx(M.FormHelperText,{children:A})]})};exports.AutocompleteElementDisplay=$;exports.ObjectElementDisplay=G;exports.TextElementDisplay=J;exports.ValidationElement=W;exports.useFormError=P;exports.useOnMount=Q;
|
|
2
2
|
//# sourceMappingURL=index.cjs.map
|
package/dist/index.cjs.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.cjs","sources":["../src/utils.ts","../src/components/AutocompleteElementDisplay.tsx","../src/components/ObjectElementDisplay.tsx","../src/components/TextElementDisplay.tsx","../src/hooks/useFormError.ts","../src/hooks/useOnMount.ts","../src/components/ValidationElement.tsx"],"sourcesContent":["import type {\r\n AutocompleteOwnerState,\r\n AutocompleteRenderValue,\r\n AutocompleteValue,\r\n ChipTypeMap,\r\n TextFieldProps,\r\n} from \"@mui/material\";\r\nimport { ElementType } from \"react\";\r\n\r\nimport lodash from \"lodash\";\r\n\r\nconst { merge } = lodash;\r\n\r\nexport function getAutocompleteTypedValue<\r\n TValue,\r\n Multiple extends boolean | undefined,\r\n DisableClearable extends boolean | undefined,\r\n FreeSolo extends boolean | undefined,\r\n ChipComponent extends ElementType = ChipTypeMap[\"defaultComponent\"],\r\n>(\r\n value:\r\n | AutocompleteRenderValue<TValue, Multiple, FreeSolo>\r\n | AutocompleteValue<TValue, Multiple, DisableClearable, FreeSolo>,\r\n ownerState?: AutocompleteOwnerState<TValue, Multiple, DisableClearable, FreeSolo, ChipComponent>,\r\n) {\r\n if (ownerState?.multiple) {\r\n if (ownerState?.freeSolo) return value as Array<TValue | string>;\r\n return value as TValue[];\r\n } else if (ownerState?.freeSolo) {\r\n return value as NonNullable<TValue | string>;\r\n }\r\n return value as NonNullable<TValue>;\r\n}\r\n\r\n// Apply view-only properties directly to the TextFieldElement props\r\nexport const getTextElementDisplayProps = <PropType>(\r\n props: PropType,\r\n viewOnly = false,\r\n disableUnderline = false,\r\n) =>\r\n merge<PropType, Partial<TextFieldProps>>(\r\n props,\r\n viewOnly\r\n ? {\r\n disabled: true,\r\n variant: \"standard\",\r\n sx: {\r\n \"& .MuiAutocomplete-endAdornment\": {\r\n display: \"none\",\r\n },\r\n // Hide the underline without using slotProps.input.disableUnderline which clears out chips\r\n ...(disableUnderline && {\r\n \"& .MuiInput-underline:before\": { borderBottom: \"none\" },\r\n \"& .MuiInput-underline:after\": { borderBottom: \"none\" },\r\n \"& .MuiInput-underline:hover:not(.Mui-disabled):before\": { borderBottom: \"none\" },\r\n }),\r\n },\r\n }\r\n : {},\r\n ) as PropType;\r\n\r\nexport function isNonNullableString(value: any): value is NonNullable<string> {\r\n return value != null && typeof value === 'string';\r\n}","import { AutocompleteElement, type AutocompleteElementProps } from \"react-hook-form-mui\";\r\nimport { type ChipTypeMap } from \"@mui/material\";\r\nimport type { FieldPath, FieldValues } from \"react-hook-form\";\r\nimport { type ElementType, useMemo } from \"react\";\r\nimport lodash from \"lodash\";\r\nimport { getTextElementDisplayProps } from \"../utils\";\r\n\r\nconst { merge } = lodash;\r\n\r\nexport type AutocompleteElementDisplayProps<\r\n TValue,\r\n Multiple extends boolean | undefined,\r\n DisableClearable extends boolean | undefined,\r\n FreeSolo extends boolean | undefined,\r\n ChipComponent extends ElementType = ChipTypeMap[\"defaultComponent\"],\r\n TFieldValues extends FieldValues = FieldValues,\r\n TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>,\r\n> = AutocompleteElementProps<\r\n TValue,\r\n Multiple,\r\n DisableClearable,\r\n FreeSolo,\r\n ChipComponent,\r\n TFieldValues,\r\n TName\r\n> & {\r\n viewOnly?: boolean;\r\n disableUnderline?: boolean;\r\n}\r\n\r\nexport const AutocompleteElementDisplay = <\r\n TValue,\r\n Multiple extends boolean | undefined,\r\n DisableClearable extends boolean | undefined,\r\n FreeSolo extends boolean | undefined,\r\n ChipComponent extends ElementType = ChipTypeMap[\"defaultComponent\"],\r\n TFieldValues extends FieldValues = FieldValues,\r\n TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>,\r\n>({\r\n viewOnly = undefined as boolean | undefined,\r\n disableUnderline,\r\n textFieldProps,\r\n autocompleteProps,\r\n ...props\r\n}: AutocompleteElementDisplayProps<\r\n TValue,\r\n Multiple,\r\n DisableClearable,\r\n FreeSolo,\r\n ChipComponent,\r\n TFieldValues,\r\n TName\r\n>) => {\r\n const autocompleteAdjustedProps: AutocompleteElementDisplayProps<\r\n TValue,\r\n Multiple,\r\n DisableClearable,\r\n FreeSolo,\r\n ChipComponent,\r\n TFieldValues,\r\n TName\r\n >[\"autocompleteProps\"] = useMemo(\r\n () =>\r\n merge<\r\n AutocompleteElementDisplayProps<TValue, Multiple, DisableClearable, FreeSolo, ChipComponent, TFieldValues, TName>[\"autocompleteProps\"],\r\n AutocompleteElementDisplayProps<TValue, Multiple, DisableClearable, FreeSolo, ChipComponent, TFieldValues, TName>[\"autocompleteProps\"],\r\n AutocompleteElementDisplayProps<TValue, Multiple, DisableClearable, FreeSolo, ChipComponent, TFieldValues, TName>[\"autocompleteProps\"]\r\n >(\r\n {\r\n readOnly: viewOnly,\r\n disableClearable: autocompleteProps?.disableClearable || viewOnly as DisableClearable,\r\n disabled: viewOnly,\r\n\r\n },\r\n autocompleteProps,\r\n viewOnly\r\n ? {\r\n sx: {\r\n \".MuiAutocomplete-tag\": {\r\n opacity: \"1 !important\",\r\n },\r\n },\r\n }\r\n : {},\r\n ),\r\n [autocompleteProps, viewOnly],\r\n );\r\n\r\n const textFieldAdjustedProps= useMemo(\r\n () => getTextElementDisplayProps(textFieldProps, viewOnly, disableUnderline),\r\n [textFieldProps, viewOnly, disableUnderline],\r\n );\r\n\r\n return (\r\n <AutocompleteElement\r\n autocompleteProps={autocompleteAdjustedProps}\r\n textFieldProps={textFieldAdjustedProps}\r\n {...props}\r\n />\r\n );\r\n};\r\n\r\n\r\n","import { type ElementType, useMemo, useState, useEffect } from \"react\";\nimport {\n Checkbox,\n Chip,\n ListItem,\n type ChipProps,\n type ChipTypeMap,\n type ListItemProps,\n} from \"@mui/material\";\nimport type { FieldPath, FieldValues } from \"react-hook-form\";\nimport {\n AutocompleteElementDisplay,\n type AutocompleteElementDisplayProps,\n} from \"./AutocompleteElementDisplay\";\nimport { getAutocompleteTypedValue, isNonNullableString } from \"../utils\";\nimport { useController } from \"react-hook-form-mui\";\nimport { merge } from \"lodash\";\n\n/**\n * Interface for special \"add option\" objects used in freeSolo mode\n * These objects represent a new item that can be created from user input\n */\ninterface AddOptionType {\n __isAddOption: true;\n inputValue: string;\n\n [key: string]: any; // Allow for additional properties from stringToNewItem\n}\n\n/**\n * Extends AutocompleteElementDisplayProps with additional properties for handling object values.\n *\n * @template TValue - The type of the option values\n * @template Multiple - Boolean flag indicating if multiple selections are allowed\n * @template DisableClearable - Boolean flag indicating if clearing the selection is disabled\n * @template FreeSolo - Boolean flag indicating if free text input is allowed\n * @template ChipComponent - The component type used for rendering chips in multiple selection mode\n * @template TFieldValues - The type of the form values\n * @template TName - The type of the field name\n */\nexport type ObjectElementDisplayProps<\n TValue,\n Multiple extends boolean | undefined,\n DisableClearable extends boolean | undefined,\n FreeSolo extends boolean | undefined,\n ChipComponent extends ElementType = ChipTypeMap[\"defaultComponent\"],\n TFieldValues extends FieldValues = FieldValues,\n TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>,\n> = AutocompleteElementDisplayProps<\n TValue,\n Multiple,\n DisableClearable,\n FreeSolo,\n ChipComponent,\n TFieldValues,\n TName\n> & {\n /**\n * Function to extract a unique key from an option value.\n * Used for option comparison and deduplication.\n *\n * @param value - The option value or null\n * @returns A unique string key for the value\n */\n getItemKey: (value: TValue | null) => string;\n\n /**\n * Function to generate a display label for an option value.\n * Can return any ReactNode for custom rendering.\n *\n * @param value - The option value or null\n * @returns A string to display as the option label\n */\n getItemLabel: (value: TValue | null) => string;\n\n /**\n * Function to get additional props for an option list item.\n * Used for customizing the rendering of the option.\n *\n * @param value - The option value or null\n * @returns Additional props to apply to the list item\n */\n getOptionProps?: (value: TValue | null) => ListItemProps;\n\n /**\n * Function to convert a free text input string to a TValue object.\n * Required when freeSolo is true to create new items from text input.\n *\n * @param value - The string value entered by the user\n * @returns A new TValue object created from the string\n */\n stringToNewItem?: (value: string) => TValue;\n\n /**\n * Whether the input allows free text entry.\n * When true, users can enter values that are not in the options.\n */\n freeSolo?: FreeSolo;\n\n /**\n * Optional function that returns additional chip props based on the value.\n * This allows for customizing chip appearance and behavior based on the value it represents.\n *\n * @param value - The option value being rendered as a chip\n * @returns Additional props to apply to the Chip component\n */\n getChipProps?: (props: { value: TValue; index: number }) => Partial<ChipProps> | undefined;\n\n /**\n * Optional function to transform the value before it's updated in the form.\n * This allows for custom processing or enrichment of the selected value.\n *\n * @param value - The value that would normally be sent to the form\n * @returns The transformed value to be stored in the form\n */\n transformValue?: Multiple extends true\n ? (value: TValue[]) => TFieldValues\n : (value: TValue | null) => TFieldValues | null;\n};\n\n/**\n * A form component that displays a searchable dropdown for selecting object values.\n * Extends AutocompleteElementDisplay with object-specific functionality.\n *\n * Features:\n * - Works with complex object values instead of just primitive types\n * - Supports both single and multiple selection modes\n * - Supports free-solo mode for creating new items from text input\n * - Handles initial values that aren't in the default options\n * - Deduplicates options based on item keys\n *\n * @template TValue - The type of the option values\n * @template Multiple - Boolean flag indicating if multiple selections are allowed\n * @template DisableClearable - Boolean flag indicating if clearing the selection is disabled\n * @template FreeSolo - Boolean flag indicating if free text input is allowed\n * @template ChipComponent - The component type used for rendering chips in multiple selection mode\n * @template TFieldValues - The type of the form values\n * @template TName - The type of the field name\n *\n * @returns A React component for selecting object values\n */\nexport const ObjectElementDisplay = <\n TValue,\n Multiple extends boolean | undefined,\n DisableClearable extends boolean | undefined,\n FreeSolo extends boolean | undefined,\n ChipComponent extends ElementType = ChipTypeMap[\"defaultComponent\"],\n TFieldValues extends FieldValues = FieldValues,\n TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>,\n>({\n options,\n autocompleteProps,\n getItemKey,\n getItemLabel,\n getChipProps,\n stringToNewItem,\n transformValue,\n name,\n freeSolo,\n control,\n getOptionProps,\n ...props\n}: ObjectElementDisplayProps<\n TValue,\n Multiple,\n DisableClearable,\n FreeSolo,\n ChipComponent,\n TFieldValues,\n TName\n>) => {\n /**\n * Access to the form field controller\n */\n const { field } = useController({ name, control });\n\n /**\n * State for storing dynamically added options that aren't in the original options list\n * Includes both default values and values added during freeSolo mode\n */\n const [newOptions, setNewOptions] = useState<TValue[]>(() => {\n if (!field.value) return [];\n\n // Convert field value to array for consistent handling\n const fieldValues: TValue[] = Array.isArray(field.value) ? field.value : [field.value];\n\n // Keep only object values that don't exist in the options array\n return fieldValues.filter(\n (value) =>\n typeof value !== \"string\" &&\n !options.some((option) => getItemKey(option) === getItemKey(value)),\n );\n });\n\n /**\n * Update newOptions when field.value changes\n * This ensures that any new values added to the field after rendering\n * are properly included in newOptions and displayed\n */\n useEffect(() => {\n if (!field.value) return;\n\n const fieldValues: TValue[] = Array.isArray(field.value) ? field.value : [field.value];\n const newFieldOptions = fieldValues.filter(\n (value) =>\n typeof value !== \"string\" &&\n ![...options, ...newOptions].some((option) => getItemKey(option) === getItemKey(value)),\n );\n\n // Only update newOptions if there are new values to add\n if (newFieldOptions.length > 0) {\n setNewOptions((prevOptions) => [...prevOptions, ...newFieldOptions]);\n }\n }, [field.value, options, newOptions, getItemKey]);\n\n /**\n * Combined list of all available options (original + dynamically added)\n */\n const allOptions = useMemo(() => [...options, ...newOptions], [options, newOptions]);\n\n return (\n <AutocompleteElementDisplay\n name={name}\n control={control}\n options={allOptions}\n {...props}\n autocompleteProps={{\n /**\n * Determines if two options should be considered equal\n * Uses the getItemKey function to compare option values\n */\n isOptionEqualToValue: (o, v) => getItemKey(o) === getItemKey(v),\n\n /**\n * Filters options based on the input value\n * Checks if the option key or label contains the input value (case-insensitive)\n * For freeSolo mode, adds a special \"Add [value]\" option when there's no exact match\n */\n filterOptions: (options, { inputValue }) => {\n if (!inputValue) return options;\n\n const searchValue = inputValue.toLowerCase();\n\n // Filter options that match the input value (by key or label)\n const filteredOptions = options.filter((option) => {\n const key = getItemKey(option).toLowerCase();\n const label = String(getItemLabel(option)).toLowerCase();\n return key.includes(searchValue) || label.includes(searchValue);\n });\n\n // For freeSolo mode, add \"Add [value]\" option if no exact match exists\n if (freeSolo && stringToNewItem && inputValue.length > 0) {\n const hasExactMatch = filteredOptions.some(\n (option) => String(getItemLabel(option)).toLowerCase() === searchValue,\n );\n\n if (!hasExactMatch) {\n // Create a special option with a __isAddOption flag\n const addOption: AddOptionType = {\n __isAddOption: true,\n inputValue,\n ...stringToNewItem(inputValue), // Include properties for type compatibility\n };\n\n return [addOption as unknown as TValue, ...filteredOptions];\n }\n }\n\n return filteredOptions;\n },\n freeSolo, // Allowed to enter own string value\n autoComplete: true,\n autoHighlight: true, // The first option is highlighted by default\n openOnFocus: true, // Opens the menu when tabbed into\n\n /**\n * Custom rendering for each option in the dropdown list\n * Handles both regular options and special \"Add\" options in freeSolo mode\n */\n renderOption: (liProps, option, { selected }, ownerState) => {\n const itemProps = merge(liProps, getOptionProps?.(option) ?? {});\n\n // Handles the special \"Add\" option in freeSolo mode\n if (\n ownerState?.freeSolo &&\n typeof option === \"object\" &&\n option !== null &&\n \"__isAddOption\" in option\n ) {\n const inputValue = (option as unknown as AddOptionType).inputValue;\n return (\n <ListItem {...itemProps} key={`${name}-add-option-${inputValue}`}>\n Add: '{inputValue}'\n </ListItem>\n );\n }\n\n // Handle regular option\n return (\n <ListItem {...itemProps} key={`${name}-option-${getItemKey(option)}`}>\n {(props?.showCheckbox && ownerState?.multiple) && (\n <Checkbox sx={{ marginRight: 1 }} checked={selected} />\n )}\n {typeof option === \"string\" ? option : getItemLabel(option)}\n </ListItem>\n );\n },\n\n onChange: (event, value, reason, details) => {\n /**\n * Helper function to apply transformValue if provided, otherwise return the original value\n */\n const applyTransform = (val: any) => {\n return transformValue && val !== null\n ? field.onChange(transformValue(val))\n : field.onChange(val);\n };\n\n /**\n * Helper function to add a new item to newOptions if it doesn't exist already\n */\n const addToNewOptions = (item: TValue) => {\n const itemKey = getItemKey(item);\n const itemExists = [...options, ...newOptions].some(\n (option) => getItemKey(option) === itemKey,\n );\n\n if (!itemExists) {\n setNewOptions((prev) => [...prev, item]);\n }\n };\n\n /**\n * Helper function to extract input value from string or AddOption\n */\n const getInputValue = (item: any): string | null => {\n if (typeof item === \"string\" && item.length > 0) {\n return item;\n }\n if (typeof item === \"object\" && item !== null && \"__isAddOption\" in item) {\n return (item as unknown as AddOptionType).inputValue;\n }\n return null;\n };\n\n // Handle freeSolo mode with stringToNewItem function\n if (freeSolo && stringToNewItem) {\n // Handle special add option selection or string input\n const inputValue = getInputValue(value);\n\n if (inputValue) {\n const newItem = stringToNewItem(inputValue);\n\n if (props.multiple) {\n // For multiple selection, add the new item to the current values\n const currentValues = Array.isArray(field.value) ? field.value : [];\n const newValues = [...currentValues, newItem];\n applyTransform(newValues);\n } else {\n // For single selection, just use the new item\n applyTransform(newItem);\n }\n\n addToNewOptions(newItem);\n return;\n }\n\n // Handle array values (multiple selection)\n if (Array.isArray(value) && props.multiple) {\n // Convert any string values to objects and handle special add options\n const newValues =\n value?.map((item) => {\n const inputVal = getInputValue(item);\n return inputVal ? stringToNewItem(inputVal) : item;\n }) ?? [];\n\n applyTransform(newValues);\n\n // Add any new items to newOptions\n const allOptionsKeys = [...options, ...newOptions].map((option) =>\n getItemKey(option),\n );\n const newItems = newValues.filter(\n (item) => typeof item !== \"string\" && !allOptionsKeys.includes(getItemKey(item)),\n );\n\n if (newItems.length > 0) {\n setNewOptions((prev) => [...prev, ...newItems]);\n }\n return;\n }\n }\n\n // Default behavior for non-freeSolo cases\n if (transformValue && value !== null) {\n applyTransform(value as TValue | TValue[]);\n } else {\n autocompleteProps?.onChange?.(event, value, reason, details);\n }\n },\n\n /**\n * Custom rendering for the selected value(s)\n * For multiple selection, renders a Chip for each selected value\n * For single selection, renders the value as text\n * Uses getItemLabel to render the value labels\n */\n renderValue: (value, getItemProps, ownerState) => {\n const typedValue = getAutocompleteTypedValue(value, ownerState);\n\n // Handle array values (multiple selection)\n if (Array.isArray(typedValue)) {\n return typedValue.map((v, index) => {\n // @ts-expect-error a key is returned, and the linter doesn't pick this up\n const { key, ...chipProps } = getItemProps({ index });\n\n // Get the label - use string directly or extract from object\n const label = typeof v === \"string\" ? v : getItemLabel(v);\n\n // Get additional chip props if available\n const valueSpecificProps =\n typeof v !== \"string\" && getChipProps ? getChipProps({ value: v, index }) : {};\n\n return (\n <Chip\n key={`${name}-chip-${key}`}\n {...valueSpecificProps}\n {...chipProps}\n label={label}\n />\n );\n });\n }\n\n // Handles single value - return string or extracted label\n return isNonNullableString(typedValue)\n ? typedValue\n : typedValue\n ? getItemLabel(typedValue as NonNullable<TValue>)\n : \"\";\n },\n ...autocompleteProps,\n }}\n />\n );\n};\n","import { TextFieldElement, type TextFieldElementProps } from \"react-hook-form-mui\";\nimport { type FieldPath, type FieldValues } from \"react-hook-form\";\nimport { useMemo } from \"react\";\nimport { getTextElementDisplayProps } from \"../utils\";\n\nexport type TextElementDisplayProps<\n TFieldValues extends FieldValues = FieldValues,\n TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>\n> = TextFieldElementProps<TFieldValues, TName> & Viewable;\n\n/**\n * A form component that displays a text field with view-only capabilities.\n * Extends TextFieldElement with view-only functionality.\n *\n * @template TFieldValues - The type of the form values\n * @template TName - The type of the field name\n *\n * @returns A React component for text input with view-only support\n */\nexport const TextElementDisplay = <\n TFieldValues extends FieldValues = FieldValues,\n TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>,\n>({\n viewOnly,\n disableUnderline,\n ...props\n}: TextElementDisplayProps<TFieldValues, TName>) => {\n\n const adjustedProps = useMemo(\n () => getTextElementDisplayProps(props, viewOnly, disableUnderline),\n [props, viewOnly, disableUnderline],\n );\n\n return <TextFieldElement {...adjustedProps} />;\n};\n\ntype Viewable = {\n viewOnly?: boolean;\n disableUnderline?: boolean;\n};\n","import { FieldError, FieldErrors, FieldValues } from 'react-hook-form';\r\nimport lodash from 'lodash';\r\nconst { get } = lodash;\r\n\r\n/**\r\n * A hook to get the error message for a field from react-hook-form\r\n * @param errors The errors object from react-hook-form\r\n * @param name The name of the field (supports dot notation for nested fields)\r\n * @returns An object with error and helperText properties\r\n */\r\nexport function useFormError<T extends FieldValues>(\r\n errors: FieldErrors<T>,\r\n name: string\r\n): { error: boolean; helperText: string } {\r\n // Get the error for the field, supporting nested paths with dot notation\r\n const fieldError = get(errors, name) as FieldError | undefined;\r\n\r\n // Return error state and helper text\r\n return {\r\n error: !!fieldError,\r\n helperText: fieldError?.message || '',\r\n };\r\n}\r\n","// src/hooks/useOnMount.ts\r\nimport { useEffect, useRef } from \"react\";\r\n\r\n/**\r\n * Runs a provided callback function once on the first component mount.\r\n *\r\n * @param callback - The function to run on first mount.\r\n */\r\nexport function useOnMount(callback: () => void): void {\r\n const hasMounted = useRef(false);\r\n\r\n useEffect(() => {\r\n if (!hasMounted.current) {\r\n callback();\r\n hasMounted.current = true;\r\n }\r\n\r\n // Cleanup to prevent callback logic from running during cleanup\r\n return () => {\r\n hasMounted.current = true;\r\n };\r\n \r\n // eslint-disable-next-line react-hooks/exhaustive-deps\r\n }, []);\r\n}\r\n\r\n","import type { JSX } from \"react\";\r\nimport { FormControl, FormHelperText } from \"@mui/material\";\r\nimport type { FormControlProps } from \"@mui/material\";\r\nimport { useFormContext, type RegisterOptions, type FieldValues, type Path } from \"react-hook-form\";\r\nimport { useFormError } from \"../hooks\";\r\n\r\n/**\r\n * Props for the RHFHiddenInput component\r\n */\r\nexport interface ValidationElementProps<TFieldValues extends FieldValues> {\r\n /**\r\n * Name of the field in the form\r\n */\r\n name: Path<TFieldValues>;\r\n /**\r\n * Optional validation rules\r\n */\r\n rules: RegisterOptions<TFieldValues>;\r\n /**\r\n * Props to pass to the FormControl component\r\n */\r\n formControlProps?: Omit<FormControlProps, \"error\">;\r\n}\r\n\r\nexport const ValidationElement = <TFieldValues extends FieldValues = FieldValues>({\r\n name,\r\n rules,\r\n formControlProps = {},\r\n}: ValidationElementProps<TFieldValues>): JSX.Element => {\r\n const {\r\n register,\r\n formState: { errors },\r\n } = useFormContext<TFieldValues>();\r\n\r\n const { error, helperText } = useFormError(errors, name);\r\n\r\n return (\r\n <FormControl error={error} {...formControlProps}>\r\n <input type=\"hidden\" {...register(name, rules)} />\r\n {error && <FormHelperText>{helperText}</FormHelperText>}\r\n </FormControl>\r\n );\r\n};\r\n"],"names":["merge","lodash","getAutocompleteTypedValue","value","ownerState","getTextElementDisplayProps","props","viewOnly","disableUnderline","isNonNullableString","AutocompleteElementDisplay","textFieldProps","autocompleteProps","autocompleteAdjustedProps","useMemo","textFieldAdjustedProps","jsx","AutocompleteElement","ObjectElementDisplay","options","getItemKey","getItemLabel","getChipProps","stringToNewItem","transformValue","name","freeSolo","control","getOptionProps","field","useController","newOptions","setNewOptions","useState","option","useEffect","newFieldOptions","prevOptions","allOptions","o","v","inputValue","searchValue","filteredOptions","key","label","liProps","selected","itemProps","createElement","ListItem","Checkbox","event","reason","details","applyTransform","val","addToNewOptions","item","itemKey","prev","getInputValue","newItem","newValues","inputVal","allOptionsKeys","newItems","getItemProps","typedValue","index","chipProps","valueSpecificProps","Chip","TextElementDisplay","adjustedProps","TextFieldElement","get","useFormError","errors","fieldError","useOnMount","callback","hasMounted","useRef","ValidationElement","rules","formControlProps","register","useFormContext","error","helperText","jsxs","FormControl","FormHelperText"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"index.cjs","sources":["../src/utils.ts","../src/components/AutocompleteElementDisplay.tsx","../src/components/ObjectElementDisplay.tsx","../src/components/TextElementDisplay.tsx","../src/hooks/useFormError.ts","../src/hooks/useOnMount.ts","../src/components/ValidationElement.tsx"],"sourcesContent":["import type {\r\n AutocompleteOwnerState,\r\n AutocompleteRenderValue,\r\n AutocompleteValue,\r\n ChipTypeMap,\r\n TextFieldProps,\r\n} from \"@mui/material\";\r\nimport { ElementType } from \"react\";\r\n\r\nimport lodash from \"lodash\";\r\n\r\nconst { merge } = lodash;\r\n\r\nexport function getAutocompleteTypedValue<\r\n TValue,\r\n Multiple extends boolean | undefined,\r\n DisableClearable extends boolean | undefined,\r\n FreeSolo extends boolean | undefined,\r\n ChipComponent extends ElementType = ChipTypeMap[\"defaultComponent\"],\r\n>(\r\n value:\r\n | AutocompleteRenderValue<TValue, Multiple, FreeSolo>\r\n | AutocompleteValue<TValue, Multiple, DisableClearable, FreeSolo>,\r\n ownerState?: AutocompleteOwnerState<TValue, Multiple, DisableClearable, FreeSolo, ChipComponent>,\r\n) {\r\n if (ownerState?.multiple) {\r\n if (ownerState?.freeSolo) return value as Array<TValue | string>;\r\n return value as TValue[];\r\n } else if (ownerState?.freeSolo) {\r\n return value as NonNullable<TValue | string>;\r\n }\r\n return value as NonNullable<TValue>;\r\n}\r\n\r\n// Apply view-only properties directly to the TextFieldElement props\r\nexport const getTextElementDisplayProps = <PropType>(\r\n props: PropType,\r\n viewOnly = false,\r\n disableUnderline = false,\r\n) =>\r\n merge<PropType, Partial<TextFieldProps>>(\r\n props,\r\n viewOnly\r\n ? {\r\n disabled: true,\r\n variant: \"standard\",\r\n sx: {\r\n \"& .MuiAutocomplete-endAdornment\": {\r\n display: \"none\",\r\n },\r\n // Hide the underline without using slotProps.input.disableUnderline which clears out chips\r\n ...(disableUnderline && {\r\n \"& .MuiInput-underline:before\": { borderBottom: \"none\" },\r\n \"& .MuiInput-underline:after\": { borderBottom: \"none\" },\r\n \"& .MuiInput-underline:hover:not(.Mui-disabled):before\": { borderBottom: \"none\" },\r\n }),\r\n },\r\n }\r\n : {},\r\n ) as PropType;\r\n\r\nexport function isNonNullableString(value: any): value is NonNullable<string> {\r\nreturn value != null && typeof value === 'string';\r\n}","import { AutocompleteElement, type AutocompleteElementProps } from \"react-hook-form-mui\";\r\nimport { type ChipTypeMap } from \"@mui/material\";\r\nimport type { FieldPath, FieldValues } from \"react-hook-form\";\r\nimport { type ElementType, useMemo } from \"react\";\r\nimport lodash from \"lodash\";\r\nimport { getTextElementDisplayProps } from \"../utils\";\r\n\r\nconst { merge } = lodash;\r\n\r\nexport type AutocompleteElementDisplayProps<\r\n TValue,\r\n Multiple extends boolean | undefined,\r\n DisableClearable extends boolean | undefined,\r\n FreeSolo extends boolean | undefined,\r\n ChipComponent extends ElementType = ChipTypeMap[\"defaultComponent\"],\r\n TFieldValues extends FieldValues = FieldValues,\r\n TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>,\r\n> = AutocompleteElementProps<\r\n TValue,\r\n Multiple,\r\n DisableClearable,\r\n FreeSolo,\r\n ChipComponent,\r\n TFieldValues,\r\n TName\r\n> & {\r\n viewOnly?: boolean;\r\n disableUnderline?: boolean;\r\n}\r\n\r\nexport const AutocompleteElementDisplay = <\r\n TValue,\r\n Multiple extends boolean | undefined,\r\n DisableClearable extends boolean | undefined,\r\n FreeSolo extends boolean | undefined,\r\n ChipComponent extends ElementType = ChipTypeMap[\"defaultComponent\"],\r\n TFieldValues extends FieldValues = FieldValues,\r\n TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>,\r\n>({\r\n viewOnly = undefined as boolean | undefined,\r\n disableUnderline,\r\n textFieldProps,\r\n autocompleteProps,\r\n ...props\r\n}: AutocompleteElementDisplayProps<\r\n TValue,\r\n Multiple,\r\n DisableClearable,\r\n FreeSolo,\r\n ChipComponent,\r\n TFieldValues,\r\n TName\r\n>) => {\r\n const autocompleteAdjustedProps: AutocompleteElementDisplayProps<\r\n TValue,\r\n Multiple,\r\n DisableClearable,\r\n FreeSolo,\r\n ChipComponent,\r\n TFieldValues,\r\n TName\r\n >[\"autocompleteProps\"] = useMemo(\r\n () =>\r\n merge<\r\n AutocompleteElementDisplayProps<TValue, Multiple, DisableClearable, FreeSolo, ChipComponent, TFieldValues, TName>[\"autocompleteProps\"],\r\n AutocompleteElementDisplayProps<TValue, Multiple, DisableClearable, FreeSolo, ChipComponent, TFieldValues, TName>[\"autocompleteProps\"],\r\n AutocompleteElementDisplayProps<TValue, Multiple, DisableClearable, FreeSolo, ChipComponent, TFieldValues, TName>[\"autocompleteProps\"]\r\n >(\r\n {\r\n readOnly: viewOnly,\r\n disableClearable: autocompleteProps?.disableClearable || viewOnly as DisableClearable,\r\n disabled: viewOnly,\r\n\r\n },\r\n autocompleteProps,\r\n viewOnly\r\n ? {\r\n sx: {\r\n \".MuiAutocomplete-tag\": {\r\n opacity: \"1 !important\",\r\n },\r\n },\r\n }\r\n : {},\r\n ),\r\n [autocompleteProps, viewOnly],\r\n );\r\n\r\n const textFieldAdjustedProps= useMemo(\r\n () => getTextElementDisplayProps(textFieldProps, viewOnly, disableUnderline),\r\n [textFieldProps, viewOnly, disableUnderline],\r\n );\r\n\r\n return (\r\n <AutocompleteElement\r\n autocompleteProps={autocompleteAdjustedProps}\r\n textFieldProps={textFieldAdjustedProps}\r\n {...props}\r\n />\r\n );\r\n};\r\n\r\n\r\n","import { type ElementType, useMemo, useState, useEffect } from \"react\";\nimport {\n Checkbox,\n Chip,\n ListItem,\n type ChipProps,\n type ChipTypeMap,\n type ListItemProps,\n} from \"@mui/material\";\nimport type { FieldPath, FieldValue, FieldValues } from \"react-hook-form\";\nimport {\n AutocompleteElementDisplay,\n type AutocompleteElementDisplayProps,\n} from \"./AutocompleteElementDisplay\";\nimport { getAutocompleteTypedValue, isNonNullableString } from \"../utils\";\nimport { useController } from \"react-hook-form-mui\";\nimport { merge } from \"lodash\";\n\n/**\n * Interface for special \"add option\" objects used in freeSolo mode\n * These objects represent a new item that can be created from user input\n */\ninterface AddOptionType {\n __isAddOption: true;\n inputValue: string;\n\n [key: string]: any; // Allow for additional properties from stringToNewItem\n}\n\n/**\n * Extends AutocompleteElementDisplayProps with additional properties for handling object values.\n *\n * @template TValue - The type of the option values\n * @template Multiple - Boolean flag indicating if multiple selections are allowed\n * @template DisableClearable - Boolean flag indicating if clearing the selection is disabled\n * @template FreeSolo - Boolean flag indicating if free text input is allowed\n * @template ChipComponent - The component type used for rendering chips in multiple selection mode\n * @template TFieldValues - The type of the form values\n * @template TName - The type of the field name\n */\nexport type ObjectElementDisplayProps<\n TValue,\n Multiple extends boolean | undefined,\n DisableClearable extends boolean | undefined,\n FreeSolo extends boolean | undefined,\n ChipComponent extends ElementType = ChipTypeMap[\"defaultComponent\"],\n TFieldValues extends FieldValues = FieldValues,\n TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>,\n> = AutocompleteElementDisplayProps<\n TValue,\n Multiple,\n DisableClearable,\n FreeSolo,\n ChipComponent,\n TFieldValues,\n TName\n> & {\n /**\n * Function to extract a unique key from an option value.\n * Used for option comparison and deduplication.\n *\n * @param value - The option value or null\n * @returns A unique string key for the value\n */\n getItemKey: (value: TValue | null) => string | null;\n\n /**\n * Function to generate a display label for an option value.\n * Can return any ReactNode for custom rendering.\n *\n * @param value - The option value or null\n * @returns A string to display as the option label\n */\n getItemLabel: (value: TValue | null) => string | null;\n\n /**\n * Function to get additional props for an option list item.\n * Used for customizing the rendering of the option.\n *\n * @param value - The option value or null\n * @returns Additional props to apply to the list item\n */\n getOptionProps?: (value: TValue | null) => ListItemProps;\n\n /**\n * Function to convert a free text input string to a TValue object.\n * Required when freeSolo is true to create new items from text input.\n *\n * @param value - The string value entered by the user\n * @returns A new TValue object created from the string\n */\n stringToNewItem?: (value: string) => TValue;\n\n /**\n * Whether the input allows free text entry.\n * When true, users can enter values that are not in the options.\n */\n freeSolo?: FreeSolo;\n\n /**\n * Optional function that returns additional chip props based on the value.\n * This allows for customizing chip appearance and behavior based on the value it represents.\n *\n * @param value - The option value being rendered as a chip\n * @returns Additional props to apply to the Chip component\n */\n getChipProps?: (props: { value: TValue; index: number }) => Partial<ChipProps> | undefined;\n\n /**\n * Optional function to transform the value before it's updated in the form.\n * This allows for custom processing or enrichment of the selected value.\n *\n * @param value - The value that would normally be sent to the form\n * @returns The transformed value to be stored in the form\n */\n transformValue?: (\n value: Multiple extends true ? TValue[] : TValue | null\n ) => FieldValue<FieldValues>;\n};\n\n/**\n * A form component that displays a searchable dropdown for selecting object values.\n * Extends AutocompleteElementDisplay with object-specific functionality.\n *\n * Features:\n * - Works with complex object values instead of just primitive types\n * - Supports both single and multiple selection modes\n * - Supports free-solo mode for creating new items from text input\n * - Handles initial values that aren't in the default options\n * - Deduplicates options based on item keys\n *\n * @template TValue - The type of the option values\n * @template Multiple - Boolean flag indicating if multiple selections are allowed\n * @template DisableClearable - Boolean flag indicating if clearing the selection is disabled\n * @template FreeSolo - Boolean flag indicating if free text input is allowed\n * @template ChipComponent - The component type used for rendering chips in multiple selection mode\n * @template TFieldValues - The type of the form values\n * @template TName - The type of the field name\n *\n * @returns A React component for selecting object values\n */\nexport const ObjectElementDisplay = <\n TValue,\n Multiple extends boolean | undefined,\n DisableClearable extends boolean | undefined,\n FreeSolo extends boolean | undefined,\n ChipComponent extends ElementType = ChipTypeMap[\"defaultComponent\"],\n TFieldValues extends FieldValues = FieldValues,\n TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>,\n>({\n options,\n autocompleteProps,\n getItemKey,\n getItemLabel,\n getChipProps,\n stringToNewItem,\n transformValue,\n name,\n freeSolo,\n control,\n getOptionProps,\n ...props\n}: ObjectElementDisplayProps<\n TValue,\n Multiple,\n DisableClearable,\n FreeSolo,\n ChipComponent,\n TFieldValues,\n TName\n>) => {\n /**\n * Access to the form field controller\n */\n const { field } = useController({ name, control });\n\n /**\n * State for storing dynamically added options that aren't in the original options list\n * Includes both default values and values added during freeSolo mode\n */\n const [newOptions, setNewOptions] = useState<TValue[]>(() => {\n if (!field.value) return [];\n\n // Convert field value to array for consistent handling\n const fieldValues: TValue[] = Array.isArray(field.value) ? field.value : [field.value];\n\n // Keep only object values that don't exist in the options array\n return fieldValues.filter(\n (value) =>\n typeof value !== \"string\" &&\n !options.some((option) => getItemKey(option) === getItemKey(value)),\n );\n });\n\n /**\n * Update newOptions when field.value changes\n * This ensures that any new values added to the field after rendering\n * are properly included in newOptions and displayed\n */\n useEffect(() => {\n if (!field.value) return;\n\n const fieldValues: TValue[] = Array.isArray(field.value) ? field.value : [field.value];\n const newFieldOptions = fieldValues.filter(\n (value) =>\n typeof value !== \"string\" &&\n ![...options, ...newOptions].some((option) => getItemKey(option) === getItemKey(value)),\n );\n\n // Only update newOptions if there are new values to add\n if (newFieldOptions.length > 0) {\n setNewOptions((prevOptions) => [...prevOptions, ...newFieldOptions]);\n }\n }, [field.value, options, newOptions, getItemKey]);\n\n /**\n * Combined list of all available options (original + dynamically added)\n */\n const allOptions = useMemo(() => {\n const seen = new Set();\n return [...options, ...newOptions].filter((option) => {\n const key = getItemKey(option);\n if (seen.has(key)) return false;\n seen.add(key);\n return true;\n })\n }, [options, newOptions]);\n\n return (\n <AutocompleteElementDisplay\n name={name}\n control={control}\n options={allOptions}\n {...props}\n autocompleteProps={{\n /**\n * Determines if two options should be considered equal\n * Uses the getItemKey function to compare option values\n */\n isOptionEqualToValue: (o, v) => getItemKey(o) === getItemKey(v),\n\n /**\n * Filters options based on the input value\n * Checks if the option key or label contains the input value (case-insensitive)\n * For freeSolo mode, adds a special \"Add [value]\" option when there's no exact match\n */\n filterOptions: (options, { inputValue }) => {\n if (!inputValue) return options;\n\n const searchValue = inputValue.toLowerCase();\n\n // Filter options that match the input value (by key or label)\n const filteredOptions = options.filter((option) => {\n const key = getItemKey(option)?.toLowerCase();\n const label = String(getItemLabel(option)).toLowerCase();\n return key?.includes(searchValue) || label.includes(searchValue);\n });\n\n // For freeSolo mode, add \"Add [value]\" option if no exact match exists\n if (freeSolo && stringToNewItem && inputValue.length > 0) {\n const hasExactMatch = filteredOptions.some(\n (option) => String(getItemLabel(option)).toLowerCase() === searchValue,\n );\n\n if (!hasExactMatch) {\n // Create a special option with a __isAddOption flag\n const addOption: AddOptionType = {\n __isAddOption: true,\n inputValue,\n ...stringToNewItem(inputValue), // Include properties for type compatibility\n };\n\n return [addOption as unknown as TValue, ...filteredOptions];\n }\n }\n\n return filteredOptions;\n },\n freeSolo, // Allowed to enter own string value\n autoComplete: true,\n autoHighlight: true, // The first option is highlighted by default\n openOnFocus: true, // Opens the menu when tabbed into\n\n /**\n * Custom rendering for each option in the dropdown list\n * Handles both regular options and special \"Add\" options in freeSolo mode\n */\n renderOption: (liProps, option, { selected }, ownerState) => {\n const itemProps = merge(liProps, getOptionProps?.(option) ?? {});\n\n // Handles the special \"Add\" option in freeSolo mode\n if (\n ownerState?.freeSolo &&\n typeof option === \"object\" &&\n option !== null &&\n \"__isAddOption\" in option\n ) {\n const inputValue = (option as unknown as AddOptionType).inputValue;\n return (\n <ListItem {...itemProps} key={`${name}-add-option-${inputValue}`}>\n Add: '{inputValue}'\n </ListItem>\n );\n }\n\n // Handle regular option\n return (\n <ListItem {...itemProps} key={`${name}-option-${getItemKey(option)}`}>\n {(props?.showCheckbox && ownerState?.multiple) && (\n <Checkbox sx={{ marginRight: 1 }} checked={selected} />\n )}\n {typeof option === \"string\" ? option : getItemLabel(option)}\n </ListItem>\n );\n },\n\n onChange: (event, value, reason, details) => {\n /**\n * Helper function to apply transformValue if provided, otherwise return the original value\n */\n const applyTransform = (val: any) => {\n return transformValue && val !== null\n ? field.onChange(transformValue(val))\n : field.onChange(val);\n };\n\n /**\n * Helper function to add a new item to newOptions if it doesn't exist already\n */\n const addToNewOptions = (item: TValue) => {\n const itemKey = getItemKey(item);\n const itemExists = [...options, ...newOptions].some(\n (option) => getItemKey(option) === itemKey,\n );\n\n if (!itemExists) {\n setNewOptions((prev) => [...prev, item]);\n }\n };\n\n /**\n * Helper function to extract input value from string or AddOption\n */\n const getInputValue = (item: any): string | null => {\n if (typeof item === \"string\" && item.length > 0) {\n return item;\n }\n if (typeof item === \"object\" && item !== null && \"__isAddOption\" in item) {\n return (item as unknown as AddOptionType).inputValue;\n }\n return null;\n };\n\n // Handle freeSolo mode with stringToNewItem function\n if (freeSolo && stringToNewItem) {\n // Handle special add option selection or string input\n const inputValue = getInputValue(value);\n\n if (inputValue) {\n const newItem = stringToNewItem(inputValue);\n\n if (props.multiple) {\n // For multiple selection, add the new item to the current values\n const currentValues = Array.isArray(field.value) ? field.value : [];\n const newValues = [...currentValues, newItem];\n applyTransform(newValues);\n } else {\n // For single selection, just use the new item\n applyTransform(newItem);\n }\n\n addToNewOptions(newItem);\n return;\n }\n\n // Handle array values (multiple selection)\n if (Array.isArray(value) && props.multiple) {\n // Convert any string values to objects and handle special add options\n const newValues =\n value?.map((item) => {\n const inputVal = getInputValue(item);\n return inputVal ? stringToNewItem(inputVal) : item;\n }) ?? [];\n\n applyTransform(newValues);\n\n // Add any new items to newOptions\n const allOptionsKeys = [...options, ...newOptions].map((option) =>\n getItemKey(option),\n );\n const newItems = newValues.filter(\n (item) => typeof item !== \"string\" && !allOptionsKeys.includes(getItemKey(item)),\n );\n\n if (newItems.length > 0) {\n setNewOptions((prev) => [...prev, ...newItems]);\n }\n return;\n }\n }\n\n // Default behavior for non-freeSolo cases\n if (transformValue && value !== null) {\n applyTransform(value as TValue | TValue[]);\n } else {\n autocompleteProps?.onChange?.(event, value, reason, details);\n }\n },\n\n /**\n * Custom rendering for the selected value(s)\n * For multiple selection, renders a Chip for each selected value\n * For single selection, renders the value as text\n * Uses getItemLabel to render the value labels\n */\n renderValue: (value, getItemProps, ownerState) => {\n const typedValue = getAutocompleteTypedValue(value, ownerState);\n\n // Handle array values (multiple selection)\n if (Array.isArray(typedValue)) {\n return typedValue.map((v, index) => {\n // @ts-expect-error a key is returned, and the linter doesn't pick this up\n const { key, ...chipProps } = getItemProps({ index });\n\n // Get the label - use string directly or extract from object\n const label = typeof v === \"string\" ? v : getItemLabel(v);\n\n // Get additional chip props if available\n const valueSpecificProps =\n typeof v !== \"string\" && getChipProps ? getChipProps({ value: v, index }) : {};\n\n return (\n <Chip\n key={`${name}-chip-${key}`}\n {...valueSpecificProps}\n {...chipProps}\n label={label}\n />\n );\n });\n }\n\n // Handles single value - return string or extracted label\n return isNonNullableString(typedValue)\n ? typedValue\n : typedValue\n ? getItemLabel(typedValue as NonNullable<TValue>)\n : \"\";\n },\n ...autocompleteProps,\n }}\n />\n );\n};\n","import { TextFieldElement, type TextFieldElementProps } from \"react-hook-form-mui\";\nimport { type FieldPath, type FieldValues } from \"react-hook-form\";\nimport { useMemo } from \"react\";\nimport { getTextElementDisplayProps } from \"../utils\";\n\nexport type TextElementDisplayProps<\n TFieldValues extends FieldValues = FieldValues,\n TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>\n> = TextFieldElementProps<TFieldValues, TName> & Viewable;\n\n/**\n * A form component that displays a text field with view-only capabilities.\n * Extends TextFieldElement with view-only functionality.\n *\n * @template TFieldValues - The type of the form values\n * @template TName - The type of the field name\n *\n * @returns A React component for text input with view-only support\n */\nexport const TextElementDisplay = <\n TFieldValues extends FieldValues = FieldValues,\n TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>,\n>({\n viewOnly,\n disableUnderline,\n ...props\n}: TextElementDisplayProps<TFieldValues, TName>) => {\n\n const adjustedProps = useMemo(\n () => getTextElementDisplayProps(props, viewOnly, disableUnderline),\n [props, viewOnly, disableUnderline],\n );\n\n return <TextFieldElement {...adjustedProps} />;\n};\n\ntype Viewable = {\n viewOnly?: boolean;\n disableUnderline?: boolean;\n};\n","import { FieldError, FieldErrors, FieldValues } from 'react-hook-form';\r\nimport lodash from 'lodash';\r\nconst { get } = lodash;\r\n\r\n/**\r\n * A hook to get the error message for a field from react-hook-form\r\n * @param errors The errors object from react-hook-form\r\n * @param name The name of the field (supports dot notation for nested fields)\r\n * @returns An object with error and helperText properties\r\n */\r\nexport function useFormError<T extends FieldValues>(\r\n errors: FieldErrors<T>,\r\n name: string\r\n): { error: boolean; helperText: string } {\r\n // Get the error for the field, supporting nested paths with dot notation\r\n const fieldError = get(errors, name) as FieldError | undefined;\r\n\r\n // Return error state and helper text\r\n return {\r\n error: !!fieldError,\r\n helperText: fieldError?.message || '',\r\n };\r\n}\r\n","// src/hooks/useOnMount.ts\r\nimport { useEffect, useRef } from \"react\";\r\n\r\n/**\r\n * Runs a provided callback function once on the first component mount.\r\n *\r\n * @param callback - The function to run on first mount.\r\n */\r\nexport function useOnMount(callback: () => void): void {\r\n const hasMounted = useRef(false);\r\n\r\n useEffect(() => {\r\n if (!hasMounted.current) {\r\n callback();\r\n hasMounted.current = true;\r\n }\r\n\r\n // Cleanup to prevent callback logic from running during cleanup\r\n return () => {\r\n hasMounted.current = true;\r\n };\r\n \r\n // eslint-disable-next-line react-hooks/exhaustive-deps\r\n }, []);\r\n}\r\n\r\n","import type { JSX } from \"react\";\r\nimport { FormControl, FormHelperText } from \"@mui/material\";\r\nimport type { FormControlProps } from \"@mui/material\";\r\nimport { useFormContext, type RegisterOptions, type FieldValues, type Path } from \"react-hook-form\";\r\nimport { useFormError } from \"../hooks\";\r\n\r\n/**\r\n * Props for the RHFHiddenInput component\r\n */\r\nexport interface ValidationElementProps<TFieldValues extends FieldValues> {\r\n /**\r\n * Name of the field in the form\r\n */\r\n name: Path<TFieldValues>;\r\n /**\r\n * Optional validation rules\r\n */\r\n rules: RegisterOptions<TFieldValues>;\r\n /**\r\n * Props to pass to the FormControl component\r\n */\r\n formControlProps?: Omit<FormControlProps, \"error\">;\r\n}\r\n\r\nexport const ValidationElement = <TFieldValues extends FieldValues = FieldValues>({\r\n name,\r\n rules,\r\n formControlProps = {},\r\n}: ValidationElementProps<TFieldValues>): JSX.Element => {\r\n const {\r\n register,\r\n formState: { errors },\r\n } = useFormContext<TFieldValues>();\r\n\r\n const { error, helperText } = useFormError(errors, name);\r\n\r\n return (\r\n <FormControl error={error} {...formControlProps}>\r\n <input type=\"hidden\" {...register(name, rules)} />\r\n {error && <FormHelperText>{helperText}</FormHelperText>}\r\n </FormControl>\r\n );\r\n};\r\n"],"names":["merge","lodash","getAutocompleteTypedValue","value","ownerState","getTextElementDisplayProps","props","viewOnly","disableUnderline","isNonNullableString","AutocompleteElementDisplay","textFieldProps","autocompleteProps","autocompleteAdjustedProps","useMemo","textFieldAdjustedProps","jsx","AutocompleteElement","ObjectElementDisplay","options","getItemKey","getItemLabel","getChipProps","stringToNewItem","transformValue","name","freeSolo","control","getOptionProps","field","useController","newOptions","setNewOptions","useState","option","useEffect","newFieldOptions","prevOptions","allOptions","seen","key","o","v","inputValue","searchValue","filteredOptions","label","liProps","selected","itemProps","createElement","ListItem","Checkbox","event","reason","details","applyTransform","val","addToNewOptions","item","itemKey","prev","getInputValue","newItem","newValues","inputVal","allOptionsKeys","newItems","getItemProps","typedValue","index","chipProps","valueSpecificProps","Chip","TextElementDisplay","adjustedProps","TextFieldElement","get","useFormError","errors","fieldError","useOnMount","callback","hasMounted","useRef","ValidationElement","rules","formControlProps","register","useFormContext","error","helperText","jsxs","FormControl","FormHelperText"],"mappings":"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"}
|
package/dist/index.js
CHANGED
|
@@ -1,14 +1,14 @@
|
|
|
1
1
|
import { jsx as x, jsxs as H } from "react/jsx-runtime";
|
|
2
2
|
import { AutocompleteElement as R, useController as q, TextFieldElement as L } from "react-hook-form-mui";
|
|
3
|
-
import { useMemo as O, useState as
|
|
4
|
-
import
|
|
5
|
-
import { Chip as
|
|
6
|
-
import { useFormContext as
|
|
7
|
-
const { merge:
|
|
8
|
-
function
|
|
3
|
+
import { useMemo as O, useState as w, useEffect as P, createElement as T, useRef as z } from "react";
|
|
4
|
+
import k, { merge as G } from "lodash";
|
|
5
|
+
import { Chip as J, ListItem as _, Checkbox as N, FormControl as Q, FormHelperText as W } from "@mui/material";
|
|
6
|
+
import { useFormContext as X } from "react-hook-form";
|
|
7
|
+
const { merge: Y } = k;
|
|
8
|
+
function Z(e, n) {
|
|
9
9
|
return n?.multiple, n?.freeSolo, e;
|
|
10
10
|
}
|
|
11
|
-
const
|
|
11
|
+
const S = (e, n = !1, t = !1) => Y(
|
|
12
12
|
e,
|
|
13
13
|
n ? {
|
|
14
14
|
disabled: !0,
|
|
@@ -29,21 +29,21 @@ const D = (e, n = !1, t = !1) => Z(
|
|
|
29
29
|
function U(e) {
|
|
30
30
|
return e != null && typeof e == "string";
|
|
31
31
|
}
|
|
32
|
-
const { merge: v } =
|
|
32
|
+
const { merge: v } = k, K = ({
|
|
33
33
|
viewOnly: e = void 0,
|
|
34
34
|
disableUnderline: n,
|
|
35
35
|
textFieldProps: t,
|
|
36
|
-
autocompleteProps:
|
|
36
|
+
autocompleteProps: c,
|
|
37
37
|
...y
|
|
38
38
|
}) => {
|
|
39
39
|
const d = O(
|
|
40
40
|
() => v(
|
|
41
41
|
{
|
|
42
42
|
readOnly: e,
|
|
43
|
-
disableClearable:
|
|
43
|
+
disableClearable: c?.disableClearable || e,
|
|
44
44
|
disabled: e
|
|
45
45
|
},
|
|
46
|
-
|
|
46
|
+
c,
|
|
47
47
|
e ? {
|
|
48
48
|
sx: {
|
|
49
49
|
".MuiAutocomplete-tag": {
|
|
@@ -52,9 +52,9 @@ const { merge: v } = F, K = ({
|
|
|
52
52
|
}
|
|
53
53
|
} : {}
|
|
54
54
|
),
|
|
55
|
-
[
|
|
55
|
+
[c, e]
|
|
56
56
|
), A = O(
|
|
57
|
-
() =>
|
|
57
|
+
() => S(t, e, n),
|
|
58
58
|
[t, e, n]
|
|
59
59
|
);
|
|
60
60
|
return /* @__PURE__ */ x(
|
|
@@ -69,59 +69,65 @@ const { merge: v } = F, K = ({
|
|
|
69
69
|
options: e,
|
|
70
70
|
autocompleteProps: n,
|
|
71
71
|
getItemKey: t,
|
|
72
|
-
getItemLabel:
|
|
72
|
+
getItemLabel: c,
|
|
73
73
|
getChipProps: y,
|
|
74
74
|
stringToNewItem: d,
|
|
75
75
|
transformValue: A,
|
|
76
76
|
name: b,
|
|
77
77
|
freeSolo: M,
|
|
78
|
-
control:
|
|
79
|
-
getOptionProps:
|
|
80
|
-
...
|
|
78
|
+
control: F,
|
|
79
|
+
getOptionProps: D,
|
|
80
|
+
...g
|
|
81
81
|
}) => {
|
|
82
|
-
const { field:
|
|
83
|
-
(r) => typeof r != "string" && !e.some((
|
|
82
|
+
const { field: a } = q({ name: b, control: F }), [C, j] = w(() => a.value ? (Array.isArray(a.value) ? a.value : [a.value]).filter(
|
|
83
|
+
(r) => typeof r != "string" && !e.some((s) => t(s) === t(r))
|
|
84
84
|
) : []);
|
|
85
85
|
P(() => {
|
|
86
|
-
if (!
|
|
87
|
-
const r = (Array.isArray(
|
|
88
|
-
(
|
|
86
|
+
if (!a.value) return;
|
|
87
|
+
const r = (Array.isArray(a.value) ? a.value : [a.value]).filter(
|
|
88
|
+
(s) => typeof s != "string" && ![...e, ...C].some((u) => t(u) === t(s))
|
|
89
89
|
);
|
|
90
|
-
r.length > 0 && j((
|
|
91
|
-
}, [
|
|
92
|
-
const B = O(() =>
|
|
90
|
+
r.length > 0 && j((s) => [...s, ...r]);
|
|
91
|
+
}, [a.value, e, C, t]);
|
|
92
|
+
const B = O(() => {
|
|
93
|
+
const i = /* @__PURE__ */ new Set();
|
|
94
|
+
return [...e, ...C].filter((r) => {
|
|
95
|
+
const s = t(r);
|
|
96
|
+
return i.has(s) ? !1 : (i.add(s), !0);
|
|
97
|
+
});
|
|
98
|
+
}, [e, C]);
|
|
93
99
|
return /* @__PURE__ */ x(
|
|
94
100
|
K,
|
|
95
101
|
{
|
|
96
102
|
name: b,
|
|
97
|
-
control:
|
|
103
|
+
control: F,
|
|
98
104
|
options: B,
|
|
99
|
-
...
|
|
105
|
+
...g,
|
|
100
106
|
autocompleteProps: {
|
|
101
107
|
/**
|
|
102
108
|
* Determines if two options should be considered equal
|
|
103
109
|
* Uses the getItemKey function to compare option values
|
|
104
110
|
*/
|
|
105
|
-
isOptionEqualToValue: (
|
|
111
|
+
isOptionEqualToValue: (i, r) => t(i) === t(r),
|
|
106
112
|
/**
|
|
107
113
|
* Filters options based on the input value
|
|
108
114
|
* Checks if the option key or label contains the input value (case-insensitive)
|
|
109
115
|
* For freeSolo mode, adds a special "Add [value]" option when there's no exact match
|
|
110
116
|
*/
|
|
111
|
-
filterOptions: (
|
|
112
|
-
if (!r) return
|
|
113
|
-
const
|
|
114
|
-
const f = t(
|
|
115
|
-
return f
|
|
117
|
+
filterOptions: (i, { inputValue: r }) => {
|
|
118
|
+
if (!r) return i;
|
|
119
|
+
const s = r.toLowerCase(), u = i.filter((l) => {
|
|
120
|
+
const f = t(l)?.toLowerCase(), E = String(c(l)).toLowerCase();
|
|
121
|
+
return f?.includes(s) || E.includes(s);
|
|
116
122
|
});
|
|
117
|
-
return M && d && r.length > 0 && !
|
|
118
|
-
(f) => String(
|
|
123
|
+
return M && d && r.length > 0 && !u.some(
|
|
124
|
+
(f) => String(c(f)).toLowerCase() === s
|
|
119
125
|
) ? [{
|
|
120
126
|
__isAddOption: !0,
|
|
121
127
|
inputValue: r,
|
|
122
128
|
...d(r)
|
|
123
129
|
// Include properties for type compatibility
|
|
124
|
-
}, ...
|
|
130
|
+
}, ...u] : u;
|
|
125
131
|
},
|
|
126
132
|
freeSolo: M,
|
|
127
133
|
// Allowed to enter own string value
|
|
@@ -134,16 +140,16 @@ const { merge: v } = F, K = ({
|
|
|
134
140
|
* Custom rendering for each option in the dropdown list
|
|
135
141
|
* Handles both regular options and special "Add" options in freeSolo mode
|
|
136
142
|
*/
|
|
137
|
-
renderOption: (
|
|
138
|
-
const
|
|
139
|
-
if (
|
|
143
|
+
renderOption: (i, r, { selected: s }, u) => {
|
|
144
|
+
const l = G(i, D?.(r) ?? {});
|
|
145
|
+
if (u?.freeSolo && typeof r == "object" && r !== null && "__isAddOption" in r) {
|
|
140
146
|
const f = r.inputValue;
|
|
141
|
-
return /* @__PURE__ */ T(_, { ...
|
|
147
|
+
return /* @__PURE__ */ T(_, { ...l, key: `${b}-add-option-${f}` }, "Add: '", f, "'");
|
|
142
148
|
}
|
|
143
|
-
return /* @__PURE__ */ T(_, { ...
|
|
149
|
+
return /* @__PURE__ */ T(_, { ...l, key: `${b}-option-${t(r)}` }, g?.showCheckbox && u?.multiple && /* @__PURE__ */ x(N, { sx: { marginRight: 1 }, checked: s }), typeof r == "string" ? r : c(r));
|
|
144
150
|
},
|
|
145
|
-
onChange: (
|
|
146
|
-
const
|
|
151
|
+
onChange: (i, r, s, u) => {
|
|
152
|
+
const l = (o) => A && o !== null ? a.onChange(A(o)) : a.onChange(o), f = (o) => {
|
|
147
153
|
const p = t(o);
|
|
148
154
|
[...e, ...C].some(
|
|
149
155
|
(m) => t(m) === p
|
|
@@ -153,30 +159,30 @@ const { merge: v } = F, K = ({
|
|
|
153
159
|
const o = E(r);
|
|
154
160
|
if (o) {
|
|
155
161
|
const p = d(o);
|
|
156
|
-
if (
|
|
157
|
-
const m = [...Array.isArray(
|
|
158
|
-
|
|
162
|
+
if (g.multiple) {
|
|
163
|
+
const m = [...Array.isArray(a.value) ? a.value : [], p];
|
|
164
|
+
l(m);
|
|
159
165
|
} else
|
|
160
|
-
|
|
166
|
+
l(p);
|
|
161
167
|
f(p);
|
|
162
168
|
return;
|
|
163
169
|
}
|
|
164
|
-
if (Array.isArray(r) &&
|
|
170
|
+
if (Array.isArray(r) && g.multiple) {
|
|
165
171
|
const p = r?.map((h) => {
|
|
166
|
-
const
|
|
167
|
-
return
|
|
172
|
+
const $ = E(h);
|
|
173
|
+
return $ ? d($) : h;
|
|
168
174
|
}) ?? [];
|
|
169
|
-
|
|
170
|
-
const
|
|
175
|
+
l(p);
|
|
176
|
+
const V = [...e, ...C].map(
|
|
171
177
|
(h) => t(h)
|
|
172
178
|
), m = p.filter(
|
|
173
|
-
(h) => typeof h != "string" && !
|
|
179
|
+
(h) => typeof h != "string" && !V.includes(t(h))
|
|
174
180
|
);
|
|
175
181
|
m.length > 0 && j((h) => [...h, ...m]);
|
|
176
182
|
return;
|
|
177
183
|
}
|
|
178
184
|
}
|
|
179
|
-
A && r !== null ?
|
|
185
|
+
A && r !== null ? l(r) : n?.onChange?.(i, r, s, u);
|
|
180
186
|
},
|
|
181
187
|
/**
|
|
182
188
|
* Custom rendering for the selected value(s)
|
|
@@ -184,20 +190,20 @@ const { merge: v } = F, K = ({
|
|
|
184
190
|
* For single selection, renders the value as text
|
|
185
191
|
* Uses getItemLabel to render the value labels
|
|
186
192
|
*/
|
|
187
|
-
renderValue: (
|
|
188
|
-
const
|
|
189
|
-
return Array.isArray(
|
|
190
|
-
const { key: E, ...o } = r({ index: f }), p = typeof
|
|
193
|
+
renderValue: (i, r, s) => {
|
|
194
|
+
const u = Z(i, s);
|
|
195
|
+
return Array.isArray(u) ? u.map((l, f) => {
|
|
196
|
+
const { key: E, ...o } = r({ index: f }), p = typeof l == "string" ? l : c(l), V = typeof l != "string" && y ? y({ value: l, index: f }) : {};
|
|
191
197
|
return /* @__PURE__ */ x(
|
|
192
|
-
|
|
198
|
+
J,
|
|
193
199
|
{
|
|
194
|
-
...
|
|
200
|
+
...V,
|
|
195
201
|
...o,
|
|
196
202
|
label: p
|
|
197
203
|
},
|
|
198
204
|
`${b}-chip-${E}`
|
|
199
205
|
);
|
|
200
|
-
}) : U(
|
|
206
|
+
}) : U(u) ? u : u ? c(u) : "";
|
|
201
207
|
},
|
|
202
208
|
...n
|
|
203
209
|
}
|
|
@@ -208,12 +214,12 @@ const { merge: v } = F, K = ({
|
|
|
208
214
|
disableUnderline: n,
|
|
209
215
|
...t
|
|
210
216
|
}) => {
|
|
211
|
-
const
|
|
212
|
-
() =>
|
|
217
|
+
const c = O(
|
|
218
|
+
() => S(t, e, n),
|
|
213
219
|
[t, e, n]
|
|
214
220
|
);
|
|
215
|
-
return /* @__PURE__ */ x(L, { ...
|
|
216
|
-
}, { get: I } =
|
|
221
|
+
return /* @__PURE__ */ x(L, { ...c });
|
|
222
|
+
}, { get: I } = k;
|
|
217
223
|
function ee(e, n) {
|
|
218
224
|
const t = I(e, n);
|
|
219
225
|
return {
|
|
@@ -222,7 +228,7 @@ function ee(e, n) {
|
|
|
222
228
|
};
|
|
223
229
|
}
|
|
224
230
|
function ce(e) {
|
|
225
|
-
const n =
|
|
231
|
+
const n = z(!1);
|
|
226
232
|
P(() => (n.current || (e(), n.current = !0), () => {
|
|
227
233
|
n.current = !0;
|
|
228
234
|
}), []);
|
|
@@ -233,12 +239,12 @@ const ae = ({
|
|
|
233
239
|
formControlProps: t = {}
|
|
234
240
|
}) => {
|
|
235
241
|
const {
|
|
236
|
-
register:
|
|
242
|
+
register: c,
|
|
237
243
|
formState: { errors: y }
|
|
238
|
-
} =
|
|
239
|
-
return /* @__PURE__ */ H(
|
|
240
|
-
/* @__PURE__ */ x("input", { type: "hidden", ...
|
|
241
|
-
d && /* @__PURE__ */ x(
|
|
244
|
+
} = X(), { error: d, helperText: A } = ee(y, e);
|
|
245
|
+
return /* @__PURE__ */ H(Q, { error: d, ...t, children: [
|
|
246
|
+
/* @__PURE__ */ x("input", { type: "hidden", ...c(e, n) }),
|
|
247
|
+
d && /* @__PURE__ */ x(W, { children: A })
|
|
242
248
|
] });
|
|
243
249
|
};
|
|
244
250
|
export {
|
package/dist/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sources":["../src/utils.ts","../src/components/AutocompleteElementDisplay.tsx","../src/components/ObjectElementDisplay.tsx","../src/components/TextElementDisplay.tsx","../src/hooks/useFormError.ts","../src/hooks/useOnMount.ts","../src/components/ValidationElement.tsx"],"sourcesContent":["import type {\r\n AutocompleteOwnerState,\r\n AutocompleteRenderValue,\r\n AutocompleteValue,\r\n ChipTypeMap,\r\n TextFieldProps,\r\n} from \"@mui/material\";\r\nimport { ElementType } from \"react\";\r\n\r\nimport lodash from \"lodash\";\r\n\r\nconst { merge } = lodash;\r\n\r\nexport function getAutocompleteTypedValue<\r\n TValue,\r\n Multiple extends boolean | undefined,\r\n DisableClearable extends boolean | undefined,\r\n FreeSolo extends boolean | undefined,\r\n ChipComponent extends ElementType = ChipTypeMap[\"defaultComponent\"],\r\n>(\r\n value:\r\n | AutocompleteRenderValue<TValue, Multiple, FreeSolo>\r\n | AutocompleteValue<TValue, Multiple, DisableClearable, FreeSolo>,\r\n ownerState?: AutocompleteOwnerState<TValue, Multiple, DisableClearable, FreeSolo, ChipComponent>,\r\n) {\r\n if (ownerState?.multiple) {\r\n if (ownerState?.freeSolo) return value as Array<TValue | string>;\r\n return value as TValue[];\r\n } else if (ownerState?.freeSolo) {\r\n return value as NonNullable<TValue | string>;\r\n }\r\n return value as NonNullable<TValue>;\r\n}\r\n\r\n// Apply view-only properties directly to the TextFieldElement props\r\nexport const getTextElementDisplayProps = <PropType>(\r\n props: PropType,\r\n viewOnly = false,\r\n disableUnderline = false,\r\n) =>\r\n merge<PropType, Partial<TextFieldProps>>(\r\n props,\r\n viewOnly\r\n ? {\r\n disabled: true,\r\n variant: \"standard\",\r\n sx: {\r\n \"& .MuiAutocomplete-endAdornment\": {\r\n display: \"none\",\r\n },\r\n // Hide the underline without using slotProps.input.disableUnderline which clears out chips\r\n ...(disableUnderline && {\r\n \"& .MuiInput-underline:before\": { borderBottom: \"none\" },\r\n \"& .MuiInput-underline:after\": { borderBottom: \"none\" },\r\n \"& .MuiInput-underline:hover:not(.Mui-disabled):before\": { borderBottom: \"none\" },\r\n }),\r\n },\r\n }\r\n : {},\r\n ) as PropType;\r\n\r\nexport function isNonNullableString(value: any): value is NonNullable<string> {\r\n return value != null && typeof value === 'string';\r\n}","import { AutocompleteElement, type AutocompleteElementProps } from \"react-hook-form-mui\";\r\nimport { type ChipTypeMap } from \"@mui/material\";\r\nimport type { FieldPath, FieldValues } from \"react-hook-form\";\r\nimport { type ElementType, useMemo } from \"react\";\r\nimport lodash from \"lodash\";\r\nimport { getTextElementDisplayProps } from \"../utils\";\r\n\r\nconst { merge } = lodash;\r\n\r\nexport type AutocompleteElementDisplayProps<\r\n TValue,\r\n Multiple extends boolean | undefined,\r\n DisableClearable extends boolean | undefined,\r\n FreeSolo extends boolean | undefined,\r\n ChipComponent extends ElementType = ChipTypeMap[\"defaultComponent\"],\r\n TFieldValues extends FieldValues = FieldValues,\r\n TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>,\r\n> = AutocompleteElementProps<\r\n TValue,\r\n Multiple,\r\n DisableClearable,\r\n FreeSolo,\r\n ChipComponent,\r\n TFieldValues,\r\n TName\r\n> & {\r\n viewOnly?: boolean;\r\n disableUnderline?: boolean;\r\n}\r\n\r\nexport const AutocompleteElementDisplay = <\r\n TValue,\r\n Multiple extends boolean | undefined,\r\n DisableClearable extends boolean | undefined,\r\n FreeSolo extends boolean | undefined,\r\n ChipComponent extends ElementType = ChipTypeMap[\"defaultComponent\"],\r\n TFieldValues extends FieldValues = FieldValues,\r\n TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>,\r\n>({\r\n viewOnly = undefined as boolean | undefined,\r\n disableUnderline,\r\n textFieldProps,\r\n autocompleteProps,\r\n ...props\r\n}: AutocompleteElementDisplayProps<\r\n TValue,\r\n Multiple,\r\n DisableClearable,\r\n FreeSolo,\r\n ChipComponent,\r\n TFieldValues,\r\n TName\r\n>) => {\r\n const autocompleteAdjustedProps: AutocompleteElementDisplayProps<\r\n TValue,\r\n Multiple,\r\n DisableClearable,\r\n FreeSolo,\r\n ChipComponent,\r\n TFieldValues,\r\n TName\r\n >[\"autocompleteProps\"] = useMemo(\r\n () =>\r\n merge<\r\n AutocompleteElementDisplayProps<TValue, Multiple, DisableClearable, FreeSolo, ChipComponent, TFieldValues, TName>[\"autocompleteProps\"],\r\n AutocompleteElementDisplayProps<TValue, Multiple, DisableClearable, FreeSolo, ChipComponent, TFieldValues, TName>[\"autocompleteProps\"],\r\n AutocompleteElementDisplayProps<TValue, Multiple, DisableClearable, FreeSolo, ChipComponent, TFieldValues, TName>[\"autocompleteProps\"]\r\n >(\r\n {\r\n readOnly: viewOnly,\r\n disableClearable: autocompleteProps?.disableClearable || viewOnly as DisableClearable,\r\n disabled: viewOnly,\r\n\r\n },\r\n autocompleteProps,\r\n viewOnly\r\n ? {\r\n sx: {\r\n \".MuiAutocomplete-tag\": {\r\n opacity: \"1 !important\",\r\n },\r\n },\r\n }\r\n : {},\r\n ),\r\n [autocompleteProps, viewOnly],\r\n );\r\n\r\n const textFieldAdjustedProps= useMemo(\r\n () => getTextElementDisplayProps(textFieldProps, viewOnly, disableUnderline),\r\n [textFieldProps, viewOnly, disableUnderline],\r\n );\r\n\r\n return (\r\n <AutocompleteElement\r\n autocompleteProps={autocompleteAdjustedProps}\r\n textFieldProps={textFieldAdjustedProps}\r\n {...props}\r\n />\r\n );\r\n};\r\n\r\n\r\n","import { type ElementType, useMemo, useState, useEffect } from \"react\";\nimport {\n Checkbox,\n Chip,\n ListItem,\n type ChipProps,\n type ChipTypeMap,\n type ListItemProps,\n} from \"@mui/material\";\nimport type { FieldPath, FieldValues } from \"react-hook-form\";\nimport {\n AutocompleteElementDisplay,\n type AutocompleteElementDisplayProps,\n} from \"./AutocompleteElementDisplay\";\nimport { getAutocompleteTypedValue, isNonNullableString } from \"../utils\";\nimport { useController } from \"react-hook-form-mui\";\nimport { merge } from \"lodash\";\n\n/**\n * Interface for special \"add option\" objects used in freeSolo mode\n * These objects represent a new item that can be created from user input\n */\ninterface AddOptionType {\n __isAddOption: true;\n inputValue: string;\n\n [key: string]: any; // Allow for additional properties from stringToNewItem\n}\n\n/**\n * Extends AutocompleteElementDisplayProps with additional properties for handling object values.\n *\n * @template TValue - The type of the option values\n * @template Multiple - Boolean flag indicating if multiple selections are allowed\n * @template DisableClearable - Boolean flag indicating if clearing the selection is disabled\n * @template FreeSolo - Boolean flag indicating if free text input is allowed\n * @template ChipComponent - The component type used for rendering chips in multiple selection mode\n * @template TFieldValues - The type of the form values\n * @template TName - The type of the field name\n */\nexport type ObjectElementDisplayProps<\n TValue,\n Multiple extends boolean | undefined,\n DisableClearable extends boolean | undefined,\n FreeSolo extends boolean | undefined,\n ChipComponent extends ElementType = ChipTypeMap[\"defaultComponent\"],\n TFieldValues extends FieldValues = FieldValues,\n TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>,\n> = AutocompleteElementDisplayProps<\n TValue,\n Multiple,\n DisableClearable,\n FreeSolo,\n ChipComponent,\n TFieldValues,\n TName\n> & {\n /**\n * Function to extract a unique key from an option value.\n * Used for option comparison and deduplication.\n *\n * @param value - The option value or null\n * @returns A unique string key for the value\n */\n getItemKey: (value: TValue | null) => string;\n\n /**\n * Function to generate a display label for an option value.\n * Can return any ReactNode for custom rendering.\n *\n * @param value - The option value or null\n * @returns A string to display as the option label\n */\n getItemLabel: (value: TValue | null) => string;\n\n /**\n * Function to get additional props for an option list item.\n * Used for customizing the rendering of the option.\n *\n * @param value - The option value or null\n * @returns Additional props to apply to the list item\n */\n getOptionProps?: (value: TValue | null) => ListItemProps;\n\n /**\n * Function to convert a free text input string to a TValue object.\n * Required when freeSolo is true to create new items from text input.\n *\n * @param value - The string value entered by the user\n * @returns A new TValue object created from the string\n */\n stringToNewItem?: (value: string) => TValue;\n\n /**\n * Whether the input allows free text entry.\n * When true, users can enter values that are not in the options.\n */\n freeSolo?: FreeSolo;\n\n /**\n * Optional function that returns additional chip props based on the value.\n * This allows for customizing chip appearance and behavior based on the value it represents.\n *\n * @param value - The option value being rendered as a chip\n * @returns Additional props to apply to the Chip component\n */\n getChipProps?: (props: { value: TValue; index: number }) => Partial<ChipProps> | undefined;\n\n /**\n * Optional function to transform the value before it's updated in the form.\n * This allows for custom processing or enrichment of the selected value.\n *\n * @param value - The value that would normally be sent to the form\n * @returns The transformed value to be stored in the form\n */\n transformValue?: Multiple extends true\n ? (value: TValue[]) => TFieldValues\n : (value: TValue | null) => TFieldValues | null;\n};\n\n/**\n * A form component that displays a searchable dropdown for selecting object values.\n * Extends AutocompleteElementDisplay with object-specific functionality.\n *\n * Features:\n * - Works with complex object values instead of just primitive types\n * - Supports both single and multiple selection modes\n * - Supports free-solo mode for creating new items from text input\n * - Handles initial values that aren't in the default options\n * - Deduplicates options based on item keys\n *\n * @template TValue - The type of the option values\n * @template Multiple - Boolean flag indicating if multiple selections are allowed\n * @template DisableClearable - Boolean flag indicating if clearing the selection is disabled\n * @template FreeSolo - Boolean flag indicating if free text input is allowed\n * @template ChipComponent - The component type used for rendering chips in multiple selection mode\n * @template TFieldValues - The type of the form values\n * @template TName - The type of the field name\n *\n * @returns A React component for selecting object values\n */\nexport const ObjectElementDisplay = <\n TValue,\n Multiple extends boolean | undefined,\n DisableClearable extends boolean | undefined,\n FreeSolo extends boolean | undefined,\n ChipComponent extends ElementType = ChipTypeMap[\"defaultComponent\"],\n TFieldValues extends FieldValues = FieldValues,\n TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>,\n>({\n options,\n autocompleteProps,\n getItemKey,\n getItemLabel,\n getChipProps,\n stringToNewItem,\n transformValue,\n name,\n freeSolo,\n control,\n getOptionProps,\n ...props\n}: ObjectElementDisplayProps<\n TValue,\n Multiple,\n DisableClearable,\n FreeSolo,\n ChipComponent,\n TFieldValues,\n TName\n>) => {\n /**\n * Access to the form field controller\n */\n const { field } = useController({ name, control });\n\n /**\n * State for storing dynamically added options that aren't in the original options list\n * Includes both default values and values added during freeSolo mode\n */\n const [newOptions, setNewOptions] = useState<TValue[]>(() => {\n if (!field.value) return [];\n\n // Convert field value to array for consistent handling\n const fieldValues: TValue[] = Array.isArray(field.value) ? field.value : [field.value];\n\n // Keep only object values that don't exist in the options array\n return fieldValues.filter(\n (value) =>\n typeof value !== \"string\" &&\n !options.some((option) => getItemKey(option) === getItemKey(value)),\n );\n });\n\n /**\n * Update newOptions when field.value changes\n * This ensures that any new values added to the field after rendering\n * are properly included in newOptions and displayed\n */\n useEffect(() => {\n if (!field.value) return;\n\n const fieldValues: TValue[] = Array.isArray(field.value) ? field.value : [field.value];\n const newFieldOptions = fieldValues.filter(\n (value) =>\n typeof value !== \"string\" &&\n ![...options, ...newOptions].some((option) => getItemKey(option) === getItemKey(value)),\n );\n\n // Only update newOptions if there are new values to add\n if (newFieldOptions.length > 0) {\n setNewOptions((prevOptions) => [...prevOptions, ...newFieldOptions]);\n }\n }, [field.value, options, newOptions, getItemKey]);\n\n /**\n * Combined list of all available options (original + dynamically added)\n */\n const allOptions = useMemo(() => [...options, ...newOptions], [options, newOptions]);\n\n return (\n <AutocompleteElementDisplay\n name={name}\n control={control}\n options={allOptions}\n {...props}\n autocompleteProps={{\n /**\n * Determines if two options should be considered equal\n * Uses the getItemKey function to compare option values\n */\n isOptionEqualToValue: (o, v) => getItemKey(o) === getItemKey(v),\n\n /**\n * Filters options based on the input value\n * Checks if the option key or label contains the input value (case-insensitive)\n * For freeSolo mode, adds a special \"Add [value]\" option when there's no exact match\n */\n filterOptions: (options, { inputValue }) => {\n if (!inputValue) return options;\n\n const searchValue = inputValue.toLowerCase();\n\n // Filter options that match the input value (by key or label)\n const filteredOptions = options.filter((option) => {\n const key = getItemKey(option).toLowerCase();\n const label = String(getItemLabel(option)).toLowerCase();\n return key.includes(searchValue) || label.includes(searchValue);\n });\n\n // For freeSolo mode, add \"Add [value]\" option if no exact match exists\n if (freeSolo && stringToNewItem && inputValue.length > 0) {\n const hasExactMatch = filteredOptions.some(\n (option) => String(getItemLabel(option)).toLowerCase() === searchValue,\n );\n\n if (!hasExactMatch) {\n // Create a special option with a __isAddOption flag\n const addOption: AddOptionType = {\n __isAddOption: true,\n inputValue,\n ...stringToNewItem(inputValue), // Include properties for type compatibility\n };\n\n return [addOption as unknown as TValue, ...filteredOptions];\n }\n }\n\n return filteredOptions;\n },\n freeSolo, // Allowed to enter own string value\n autoComplete: true,\n autoHighlight: true, // The first option is highlighted by default\n openOnFocus: true, // Opens the menu when tabbed into\n\n /**\n * Custom rendering for each option in the dropdown list\n * Handles both regular options and special \"Add\" options in freeSolo mode\n */\n renderOption: (liProps, option, { selected }, ownerState) => {\n const itemProps = merge(liProps, getOptionProps?.(option) ?? {});\n\n // Handles the special \"Add\" option in freeSolo mode\n if (\n ownerState?.freeSolo &&\n typeof option === \"object\" &&\n option !== null &&\n \"__isAddOption\" in option\n ) {\n const inputValue = (option as unknown as AddOptionType).inputValue;\n return (\n <ListItem {...itemProps} key={`${name}-add-option-${inputValue}`}>\n Add: '{inputValue}'\n </ListItem>\n );\n }\n\n // Handle regular option\n return (\n <ListItem {...itemProps} key={`${name}-option-${getItemKey(option)}`}>\n {(props?.showCheckbox && ownerState?.multiple) && (\n <Checkbox sx={{ marginRight: 1 }} checked={selected} />\n )}\n {typeof option === \"string\" ? option : getItemLabel(option)}\n </ListItem>\n );\n },\n\n onChange: (event, value, reason, details) => {\n /**\n * Helper function to apply transformValue if provided, otherwise return the original value\n */\n const applyTransform = (val: any) => {\n return transformValue && val !== null\n ? field.onChange(transformValue(val))\n : field.onChange(val);\n };\n\n /**\n * Helper function to add a new item to newOptions if it doesn't exist already\n */\n const addToNewOptions = (item: TValue) => {\n const itemKey = getItemKey(item);\n const itemExists = [...options, ...newOptions].some(\n (option) => getItemKey(option) === itemKey,\n );\n\n if (!itemExists) {\n setNewOptions((prev) => [...prev, item]);\n }\n };\n\n /**\n * Helper function to extract input value from string or AddOption\n */\n const getInputValue = (item: any): string | null => {\n if (typeof item === \"string\" && item.length > 0) {\n return item;\n }\n if (typeof item === \"object\" && item !== null && \"__isAddOption\" in item) {\n return (item as unknown as AddOptionType).inputValue;\n }\n return null;\n };\n\n // Handle freeSolo mode with stringToNewItem function\n if (freeSolo && stringToNewItem) {\n // Handle special add option selection or string input\n const inputValue = getInputValue(value);\n\n if (inputValue) {\n const newItem = stringToNewItem(inputValue);\n\n if (props.multiple) {\n // For multiple selection, add the new item to the current values\n const currentValues = Array.isArray(field.value) ? field.value : [];\n const newValues = [...currentValues, newItem];\n applyTransform(newValues);\n } else {\n // For single selection, just use the new item\n applyTransform(newItem);\n }\n\n addToNewOptions(newItem);\n return;\n }\n\n // Handle array values (multiple selection)\n if (Array.isArray(value) && props.multiple) {\n // Convert any string values to objects and handle special add options\n const newValues =\n value?.map((item) => {\n const inputVal = getInputValue(item);\n return inputVal ? stringToNewItem(inputVal) : item;\n }) ?? [];\n\n applyTransform(newValues);\n\n // Add any new items to newOptions\n const allOptionsKeys = [...options, ...newOptions].map((option) =>\n getItemKey(option),\n );\n const newItems = newValues.filter(\n (item) => typeof item !== \"string\" && !allOptionsKeys.includes(getItemKey(item)),\n );\n\n if (newItems.length > 0) {\n setNewOptions((prev) => [...prev, ...newItems]);\n }\n return;\n }\n }\n\n // Default behavior for non-freeSolo cases\n if (transformValue && value !== null) {\n applyTransform(value as TValue | TValue[]);\n } else {\n autocompleteProps?.onChange?.(event, value, reason, details);\n }\n },\n\n /**\n * Custom rendering for the selected value(s)\n * For multiple selection, renders a Chip for each selected value\n * For single selection, renders the value as text\n * Uses getItemLabel to render the value labels\n */\n renderValue: (value, getItemProps, ownerState) => {\n const typedValue = getAutocompleteTypedValue(value, ownerState);\n\n // Handle array values (multiple selection)\n if (Array.isArray(typedValue)) {\n return typedValue.map((v, index) => {\n // @ts-expect-error a key is returned, and the linter doesn't pick this up\n const { key, ...chipProps } = getItemProps({ index });\n\n // Get the label - use string directly or extract from object\n const label = typeof v === \"string\" ? v : getItemLabel(v);\n\n // Get additional chip props if available\n const valueSpecificProps =\n typeof v !== \"string\" && getChipProps ? getChipProps({ value: v, index }) : {};\n\n return (\n <Chip\n key={`${name}-chip-${key}`}\n {...valueSpecificProps}\n {...chipProps}\n label={label}\n />\n );\n });\n }\n\n // Handles single value - return string or extracted label\n return isNonNullableString(typedValue)\n ? typedValue\n : typedValue\n ? getItemLabel(typedValue as NonNullable<TValue>)\n : \"\";\n },\n ...autocompleteProps,\n }}\n />\n );\n};\n","import { TextFieldElement, type TextFieldElementProps } from \"react-hook-form-mui\";\nimport { type FieldPath, type FieldValues } from \"react-hook-form\";\nimport { useMemo } from \"react\";\nimport { getTextElementDisplayProps } from \"../utils\";\n\nexport type TextElementDisplayProps<\n TFieldValues extends FieldValues = FieldValues,\n TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>\n> = TextFieldElementProps<TFieldValues, TName> & Viewable;\n\n/**\n * A form component that displays a text field with view-only capabilities.\n * Extends TextFieldElement with view-only functionality.\n *\n * @template TFieldValues - The type of the form values\n * @template TName - The type of the field name\n *\n * @returns A React component for text input with view-only support\n */\nexport const TextElementDisplay = <\n TFieldValues extends FieldValues = FieldValues,\n TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>,\n>({\n viewOnly,\n disableUnderline,\n ...props\n}: TextElementDisplayProps<TFieldValues, TName>) => {\n\n const adjustedProps = useMemo(\n () => getTextElementDisplayProps(props, viewOnly, disableUnderline),\n [props, viewOnly, disableUnderline],\n );\n\n return <TextFieldElement {...adjustedProps} />;\n};\n\ntype Viewable = {\n viewOnly?: boolean;\n disableUnderline?: boolean;\n};\n","import { FieldError, FieldErrors, FieldValues } from 'react-hook-form';\r\nimport lodash from 'lodash';\r\nconst { get } = lodash;\r\n\r\n/**\r\n * A hook to get the error message for a field from react-hook-form\r\n * @param errors The errors object from react-hook-form\r\n * @param name The name of the field (supports dot notation for nested fields)\r\n * @returns An object with error and helperText properties\r\n */\r\nexport function useFormError<T extends FieldValues>(\r\n errors: FieldErrors<T>,\r\n name: string\r\n): { error: boolean; helperText: string } {\r\n // Get the error for the field, supporting nested paths with dot notation\r\n const fieldError = get(errors, name) as FieldError | undefined;\r\n\r\n // Return error state and helper text\r\n return {\r\n error: !!fieldError,\r\n helperText: fieldError?.message || '',\r\n };\r\n}\r\n","// src/hooks/useOnMount.ts\r\nimport { useEffect, useRef } from \"react\";\r\n\r\n/**\r\n * Runs a provided callback function once on the first component mount.\r\n *\r\n * @param callback - The function to run on first mount.\r\n */\r\nexport function useOnMount(callback: () => void): void {\r\n const hasMounted = useRef(false);\r\n\r\n useEffect(() => {\r\n if (!hasMounted.current) {\r\n callback();\r\n hasMounted.current = true;\r\n }\r\n\r\n // Cleanup to prevent callback logic from running during cleanup\r\n return () => {\r\n hasMounted.current = true;\r\n };\r\n \r\n // eslint-disable-next-line react-hooks/exhaustive-deps\r\n }, []);\r\n}\r\n\r\n","import type { JSX } from \"react\";\r\nimport { FormControl, FormHelperText } from \"@mui/material\";\r\nimport type { FormControlProps } from \"@mui/material\";\r\nimport { useFormContext, type RegisterOptions, type FieldValues, type Path } from \"react-hook-form\";\r\nimport { useFormError } from \"../hooks\";\r\n\r\n/**\r\n * Props for the RHFHiddenInput component\r\n */\r\nexport interface ValidationElementProps<TFieldValues extends FieldValues> {\r\n /**\r\n * Name of the field in the form\r\n */\r\n name: Path<TFieldValues>;\r\n /**\r\n * Optional validation rules\r\n */\r\n rules: RegisterOptions<TFieldValues>;\r\n /**\r\n * Props to pass to the FormControl component\r\n */\r\n formControlProps?: Omit<FormControlProps, \"error\">;\r\n}\r\n\r\nexport const ValidationElement = <TFieldValues extends FieldValues = FieldValues>({\r\n name,\r\n rules,\r\n formControlProps = {},\r\n}: ValidationElementProps<TFieldValues>): JSX.Element => {\r\n const {\r\n register,\r\n formState: { errors },\r\n } = useFormContext<TFieldValues>();\r\n\r\n const { error, helperText } = useFormError(errors, name);\r\n\r\n return (\r\n <FormControl error={error} {...formControlProps}>\r\n <input type=\"hidden\" {...register(name, rules)} />\r\n {error && <FormHelperText>{helperText}</FormHelperText>}\r\n </FormControl>\r\n );\r\n};\r\n"],"names":["merge","lodash","getAutocompleteTypedValue","value","ownerState","getTextElementDisplayProps","props","viewOnly","disableUnderline","isNonNullableString","AutocompleteElementDisplay","textFieldProps","autocompleteProps","autocompleteAdjustedProps","useMemo","textFieldAdjustedProps","jsx","AutocompleteElement","ObjectElementDisplay","options","getItemKey","getItemLabel","getChipProps","stringToNewItem","transformValue","name","freeSolo","control","getOptionProps","field","useController","newOptions","setNewOptions","useState","option","useEffect","newFieldOptions","prevOptions","allOptions","o","v","inputValue","searchValue","filteredOptions","key","label","liProps","selected","itemProps","createElement","ListItem","Checkbox","event","reason","details","applyTransform","val","addToNewOptions","item","itemKey","prev","getInputValue","newItem","newValues","inputVal","allOptionsKeys","newItems","getItemProps","typedValue","index","chipProps","valueSpecificProps","Chip","TextElementDisplay","adjustedProps","TextFieldElement","get","useFormError","errors","fieldError","useOnMount","callback","hasMounted","useRef","ValidationElement","rules","formControlProps","register","useFormContext","error","helperText","jsxs","FormControl","FormHelperText"],"mappings":";;;;;;AAWA,MAAM,EAAA,OAAEA,MAAUC;AAEX,SAASC,EAOdC,GAGAC,GACA;AACA,SAAIA,GAAY,UACVA,GAAY,UAAiBD;AAMrC;AAGO,MAAME,IAA6B,CACxCC,GACAC,IAAW,IACXC,IAAmB,OAEnBR;AAAAA,EACEM;AAAA,EACAC,IACI;AAAA,IACE,UAAU;AAAA,IACV,SAAS;AAAA,IACT,IAAI;AAAA,MACF,mCAAmC;AAAA,QACjC,SAAS;AAAA,MAAA;AAAA;AAAA,MAGX,GAAIC,KAAoB;AAAA,QACtB,gCAAgC,EAAE,cAAc,OAAA;AAAA,QAChD,+BAA+B,EAAE,cAAc,OAAA;AAAA,QAC/C,yDAAyD,EAAE,cAAc,OAAA;AAAA,MAAO;AAAA,IAClF;AAAA,EACF,IAEF,CAAA;AACN;AAEK,SAASC,EAAoBN,GAA0C;AAC5E,SAAOA,KAAS,QAAQ,OAAOA,KAAU;AAC3C;ACxDA,MAAM,EAAE,OAAAH,MAAUC,GAuBLS,IAA6B,CAQxC;AAAA,EACA,UAAAH,IAAW;AAAA,EACX,kBAAAC;AAAA,EACA,gBAAAG;AAAA,EACA,mBAAAC;AAAA,EACA,GAAGN;AACL,MAQM;AACJ,QAAMO,IAQmBC;AAAA,IACvB,MACEd;AAAA,MAKE;AAAA,QACE,UAAUO;AAAA,QACV,kBAAkBK,GAAmB,oBAAoBL;AAAA,QACzD,UAAUA;AAAA,MAAA;AAAA,MAGZK;AAAA,MACAL,IACI;AAAA,QACE,IAAI;AAAA,UACF,wBAAwB;AAAA,YACtB,SAAS;AAAA,UAAA;AAAA,QACX;AAAA,MACF,IAEF,CAAA;AAAA,IAAC;AAAA,IAET,CAACK,GAAmBL,CAAQ;AAAA,EAAA,GAGxBQ,IAAwBD;AAAA,IAC5B,MAAMT,EAA2BM,GAAgBJ,GAAUC,CAAgB;AAAA,IAC3E,CAACG,GAAgBJ,GAAUC,CAAgB;AAAA,EAAA;AAG7C,SACE,gBAAAQ;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,mBAAmBJ;AAAA,MACnB,gBAAgBE;AAAA,MACf,GAAGT;AAAA,IAAA;AAAA,EAAA;AAGV,GCyCaY,KAAuB,CAQlC;AAAA,EACA,SAAAC;AAAA,EACA,mBAAAP;AAAA,EACA,YAAAQ;AAAA,EACA,cAAAC;AAAA,EACA,cAAAC;AAAA,EACA,iBAAAC;AAAA,EACA,gBAAAC;AAAA,EACA,MAAAC;AAAA,EACA,UAAAC;AAAA,EACA,SAAAC;AAAA,EACA,gBAAAC;AAAA,EACA,GAAGtB;AACL,MAQM;AAIJ,QAAM,EAAE,OAAAuB,EAAA,IAAUC,EAAc,EAAE,MAAAL,GAAM,SAAAE,GAAS,GAM3C,CAACI,GAAYC,CAAa,IAAIC,EAAmB,MAChDJ,EAAM,SAGmB,MAAM,QAAQA,EAAM,KAAK,IAAIA,EAAM,QAAQ,CAACA,EAAM,KAAK,GAGlE;AAAA,IACjB,CAAC1B,MACC,OAAOA,KAAU,YACjB,CAACgB,EAAQ,KAAK,CAACe,MAAWd,EAAWc,CAAM,MAAMd,EAAWjB,CAAK,CAAC;AAAA,EAAA,IAT7C,CAAA,CAW1B;AAOD,EAAAgC,EAAU,MAAM;AACd,QAAI,CAACN,EAAM,MAAO;AAGlB,UAAMO,KADwB,MAAM,QAAQP,EAAM,KAAK,IAAIA,EAAM,QAAQ,CAACA,EAAM,KAAK,GACjD;AAAA,MAClC,CAAC1B,MACC,OAAOA,KAAU,YACjB,CAAC,CAAC,GAAGgB,GAAS,GAAGY,CAAU,EAAE,KAAK,CAACG,MAAWd,EAAWc,CAAM,MAAMd,EAAWjB,CAAK,CAAC;AAAA,IAAA;AAI1F,IAAIiC,EAAgB,SAAS,KAC3BJ,EAAc,CAACK,MAAgB,CAAC,GAAGA,GAAa,GAAGD,CAAe,CAAC;AAAA,EAEvE,GAAG,CAACP,EAAM,OAAOV,GAASY,GAAYX,CAAU,CAAC;AAKjD,QAAMkB,IAAaxB,EAAQ,MAAM,CAAC,GAAGK,GAAS,GAAGY,CAAU,GAAG,CAACZ,GAASY,CAAU,CAAC;AAEnF,SACE,gBAAAf;AAAA,IAACN;AAAA,IAAA;AAAA,MACC,MAAAe;AAAA,MACA,SAAAE;AAAA,MACA,SAASW;AAAA,MACR,GAAGhC;AAAA,MACJ,mBAAmB;AAAA;AAAA;AAAA;AAAA;AAAA,QAKjB,sBAAsB,CAACiC,GAAGC,MAAMpB,EAAWmB,CAAC,MAAMnB,EAAWoB,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,QAO9D,eAAe,CAACrB,GAAS,EAAE,YAAAsB,QAAiB;AAC1C,cAAI,CAACA,EAAY,QAAOtB;AAExB,gBAAMuB,IAAcD,EAAW,YAAA,GAGzBE,IAAkBxB,EAAQ,OAAO,CAACe,MAAW;AACjD,kBAAMU,IAAMxB,EAAWc,CAAM,EAAE,YAAA,GACzBW,IAAQ,OAAOxB,EAAaa,CAAM,CAAC,EAAE,YAAA;AAC3C,mBAAOU,EAAI,SAASF,CAAW,KAAKG,EAAM,SAASH,CAAW;AAAA,UAChE,CAAC;AAGD,iBAAIhB,KAAYH,KAAmBkB,EAAW,SAAS,KAKjD,CAJkBE,EAAgB;AAAA,YACpC,CAACT,MAAW,OAAOb,EAAaa,CAAM,CAAC,EAAE,kBAAkBQ;AAAA,UAAA,IAWpD,CAN0B;AAAA,YAC/B,eAAe;AAAA,YACf,YAAAD;AAAA,YACA,GAAGlB,EAAgBkB,CAAU;AAAA;AAAA,UAAA,GAGS,GAAGE,CAAe,IAIvDA;AAAA,QACT;AAAA,QACA,UAAAjB;AAAA;AAAA,QACA,cAAc;AAAA,QACd,eAAe;AAAA;AAAA,QACf,aAAa;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,QAMb,cAAc,CAACoB,GAASZ,GAAQ,EAAE,UAAAa,EAAA,GAAY3C,MAAe;AAC3D,gBAAM4C,IAAYhD,EAAM8C,GAASlB,IAAiBM,CAAM,KAAK,EAAE;AAG/D,cACE9B,GAAY,YACZ,OAAO8B,KAAW,YAClBA,MAAW,QACX,mBAAmBA,GACnB;AACA,kBAAMO,IAAcP,EAAoC;AACxD,mBACE,gBAAAe,EAACC,GAAA,EAAU,GAAGF,GAAW,KAAK,GAAGvB,CAAI,eAAegB,CAAU,GAAA,GAAI,UACzDA,GAAW,GACpB;AAAA,UAEJ;AAGA,iBACE,gBAAAQ,EAACC,GAAA,EAAU,GAAGF,GAAW,KAAK,GAAGvB,CAAI,WAAWL,EAAWc,CAAM,CAAC,GAAA,GAC9D5B,GAAO,gBAAgBF,GAAY,YACnC,gBAAAY,EAACmC,GAAA,EAAS,IAAI,EAAE,aAAa,EAAA,GAAK,SAASJ,EAAA,CAAU,GAEtD,OAAOb,KAAW,WAAWA,IAASb,EAAaa,CAAM,CAC5D;AAAA,QAEJ;AAAA,QAEA,UAAU,CAACkB,GAAOjD,GAAOkD,GAAQC,MAAY;AAI3C,gBAAMC,IAAiB,CAACC,MACfhC,KAAkBgC,MAAQ,OAC7B3B,EAAM,SAASL,EAAegC,CAAG,CAAC,IAClC3B,EAAM,SAAS2B,CAAG,GAMlBC,IAAkB,CAACC,MAAiB;AACxC,kBAAMC,IAAUvC,EAAWsC,CAAI;AAK/B,YAJmB,CAAC,GAAGvC,GAAS,GAAGY,CAAU,EAAE;AAAA,cAC7C,CAACG,MAAWd,EAAWc,CAAM,MAAMyB;AAAA,YAAA,KAInC3B,EAAc,CAAC4B,MAAS,CAAC,GAAGA,GAAMF,CAAI,CAAC;AAAA,UAE3C,GAKMG,IAAgB,CAACH,MACjB,OAAOA,KAAS,YAAYA,EAAK,SAAS,IACrCA,IAEL,OAAOA,KAAS,YAAYA,MAAS,QAAQ,mBAAmBA,IAC1DA,EAAkC,aAErC;AAIT,cAAIhC,KAAYH,GAAiB;AAE/B,kBAAMkB,IAAaoB,EAAc1D,CAAK;AAEtC,gBAAIsC,GAAY;AACd,oBAAMqB,IAAUvC,EAAgBkB,CAAU;AAE1C,kBAAInC,EAAM,UAAU;AAGlB,sBAAMyD,IAAY,CAAC,GADG,MAAM,QAAQlC,EAAM,KAAK,IAAIA,EAAM,QAAQ,CAAA,GAC5BiC,CAAO;AAC5C,gBAAAP,EAAeQ,CAAS;AAAA,cAC1B;AAEE,gBAAAR,EAAeO,CAAO;AAGxB,cAAAL,EAAgBK,CAAO;AACvB;AAAA,YACF;AAGA,gBAAI,MAAM,QAAQ3D,CAAK,KAAKG,EAAM,UAAU;AAE1C,oBAAMyD,IACJ5D,GAAO,IAAI,CAACuD,MAAS;AACnB,sBAAMM,IAAWH,EAAcH,CAAI;AACnC,uBAAOM,IAAWzC,EAAgByC,CAAQ,IAAIN;AAAA,cAChD,CAAC,KAAK,CAAA;AAER,cAAAH,EAAeQ,CAAS;AAGxB,oBAAME,IAAiB,CAAC,GAAG9C,GAAS,GAAGY,CAAU,EAAE;AAAA,gBAAI,CAACG,MACtDd,EAAWc,CAAM;AAAA,cAAA,GAEbgC,IAAWH,EAAU;AAAA,gBACzB,CAACL,MAAS,OAAOA,KAAS,YAAY,CAACO,EAAe,SAAS7C,EAAWsC,CAAI,CAAC;AAAA,cAAA;AAGjF,cAAIQ,EAAS,SAAS,KACpBlC,EAAc,CAAC4B,MAAS,CAAC,GAAGA,GAAM,GAAGM,CAAQ,CAAC;AAEhD;AAAA,YACF;AAAA,UACF;AAGA,UAAI1C,KAAkBrB,MAAU,OAC9BoD,EAAepD,CAA0B,IAEzCS,GAAmB,WAAWwC,GAAOjD,GAAOkD,GAAQC,CAAO;AAAA,QAE/D;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,QAQA,aAAa,CAACnD,GAAOgE,GAAc/D,MAAe;AAChD,gBAAMgE,IAAalE,EAA0BC,GAAOC,CAAU;AAG9D,iBAAI,MAAM,QAAQgE,CAAU,IACnBA,EAAW,IAAI,CAAC5B,GAAG6B,MAAU;AAElC,kBAAM,EAAE,KAAAzB,GAAK,GAAG0B,EAAA,IAAcH,EAAa,EAAE,OAAAE,GAAO,GAG9CxB,IAAQ,OAAOL,KAAM,WAAWA,IAAInB,EAAamB,CAAC,GAGlD+B,IACJ,OAAO/B,KAAM,YAAYlB,IAAeA,EAAa,EAAE,OAAOkB,GAAG,OAAA6B,EAAA,CAAO,IAAI,CAAA;AAE9E,mBACE,gBAAArD;AAAA,cAACwD;AAAA,cAAA;AAAA,gBAEE,GAAGD;AAAA,gBACH,GAAGD;AAAA,gBACJ,OAAAzB;AAAA,cAAA;AAAA,cAHK,GAAGpB,CAAI,SAASmB,CAAG;AAAA,YAAA;AAAA,UAM9B,CAAC,IAIInC,EAAoB2D,CAAU,IACjCA,IACAA,IACE/C,EAAa+C,CAAiC,IAC9C;AAAA,QACR;AAAA,QACA,GAAGxD;AAAA,MAAA;AAAA,IACL;AAAA,EAAA;AAGN,GC1aa6D,KAAqB,CAGhC;AAAA,EACA,UAAAlE;AAAA,EACA,kBAAAC;AAAA,EACA,GAAGF;AACL,MAAoD;AAElD,QAAMoE,IAAgB5D;AAAA,IACpB,MAAMT,EAA2BC,GAAOC,GAAUC,CAAgB;AAAA,IAClE,CAACF,GAAOC,GAAUC,CAAgB;AAAA,EAAA;AAGpC,SAAO,gBAAAQ,EAAC2D,GAAA,EAAkB,GAAGD,EAAA,CAAe;AAC9C,GChCM,EAAE,KAAAE,MAAQ3E;AAQT,SAAS4E,GACdC,GACArD,GACwC;AAExC,QAAMsD,IAAaH,EAAIE,GAAQrD,CAAI;AAGnC,SAAO;AAAA,IACL,OAAO,CAAC,CAACsD;AAAA,IACT,YAAYA,GAAY,WAAW;AAAA,EAAA;AAEvC;ACdO,SAASC,GAAWC,GAA4B;AACrD,QAAMC,IAAaC,EAAO,EAAK;AAE/B,EAAAhD,EAAU,OACH+C,EAAW,YACdD,EAAA,GACAC,EAAW,UAAU,KAIhB,MAAM;AACX,IAAAA,EAAW,UAAU;AAAA,EACvB,IAGC,CAAA,CAAE;AACP;ACAO,MAAME,KAAoB,CAAiD;AAAA,EAChF,MAAA3D;AAAA,EACA,OAAA4D;AAAA,EACA,kBAAAC,IAAmB,CAAA;AACrB,MAAyD;AACvD,QAAM;AAAA,IACJ,UAAAC;AAAA,IACA,WAAW,EAAE,QAAAT,EAAA;AAAA,EAAO,IAClBU,EAAA,GAEE,EAAE,OAAAC,GAAO,YAAAC,EAAA,IAAeb,GAAaC,GAAQrD,CAAI;AAEvD,SACE,gBAAAkE,EAACC,GAAA,EAAY,OAAAH,GAAe,GAAGH,GAC7B,UAAA;AAAA,IAAA,gBAAAtE,EAAC,WAAM,MAAK,UAAU,GAAGuE,EAAS9D,GAAM4D,CAAK,GAAG;AAAA,IAC/CI,KAAS,gBAAAzE,EAAC6E,GAAA,EAAgB,UAAAH,EAAA,CAAW;AAAA,EAAA,GACxC;AAEJ;"}
|
|
1
|
+
{"version":3,"file":"index.js","sources":["../src/utils.ts","../src/components/AutocompleteElementDisplay.tsx","../src/components/ObjectElementDisplay.tsx","../src/components/TextElementDisplay.tsx","../src/hooks/useFormError.ts","../src/hooks/useOnMount.ts","../src/components/ValidationElement.tsx"],"sourcesContent":["import type {\r\n AutocompleteOwnerState,\r\n AutocompleteRenderValue,\r\n AutocompleteValue,\r\n ChipTypeMap,\r\n TextFieldProps,\r\n} from \"@mui/material\";\r\nimport { ElementType } from \"react\";\r\n\r\nimport lodash from \"lodash\";\r\n\r\nconst { merge } = lodash;\r\n\r\nexport function getAutocompleteTypedValue<\r\n TValue,\r\n Multiple extends boolean | undefined,\r\n DisableClearable extends boolean | undefined,\r\n FreeSolo extends boolean | undefined,\r\n ChipComponent extends ElementType = ChipTypeMap[\"defaultComponent\"],\r\n>(\r\n value:\r\n | AutocompleteRenderValue<TValue, Multiple, FreeSolo>\r\n | AutocompleteValue<TValue, Multiple, DisableClearable, FreeSolo>,\r\n ownerState?: AutocompleteOwnerState<TValue, Multiple, DisableClearable, FreeSolo, ChipComponent>,\r\n) {\r\n if (ownerState?.multiple) {\r\n if (ownerState?.freeSolo) return value as Array<TValue | string>;\r\n return value as TValue[];\r\n } else if (ownerState?.freeSolo) {\r\n return value as NonNullable<TValue | string>;\r\n }\r\n return value as NonNullable<TValue>;\r\n}\r\n\r\n// Apply view-only properties directly to the TextFieldElement props\r\nexport const getTextElementDisplayProps = <PropType>(\r\n props: PropType,\r\n viewOnly = false,\r\n disableUnderline = false,\r\n) =>\r\n merge<PropType, Partial<TextFieldProps>>(\r\n props,\r\n viewOnly\r\n ? {\r\n disabled: true,\r\n variant: \"standard\",\r\n sx: {\r\n \"& .MuiAutocomplete-endAdornment\": {\r\n display: \"none\",\r\n },\r\n // Hide the underline without using slotProps.input.disableUnderline which clears out chips\r\n ...(disableUnderline && {\r\n \"& .MuiInput-underline:before\": { borderBottom: \"none\" },\r\n \"& .MuiInput-underline:after\": { borderBottom: \"none\" },\r\n \"& .MuiInput-underline:hover:not(.Mui-disabled):before\": { borderBottom: \"none\" },\r\n }),\r\n },\r\n }\r\n : {},\r\n ) as PropType;\r\n\r\nexport function isNonNullableString(value: any): value is NonNullable<string> {\r\nreturn value != null && typeof value === 'string';\r\n}","import { AutocompleteElement, type AutocompleteElementProps } from \"react-hook-form-mui\";\r\nimport { type ChipTypeMap } from \"@mui/material\";\r\nimport type { FieldPath, FieldValues } from \"react-hook-form\";\r\nimport { type ElementType, useMemo } from \"react\";\r\nimport lodash from \"lodash\";\r\nimport { getTextElementDisplayProps } from \"../utils\";\r\n\r\nconst { merge } = lodash;\r\n\r\nexport type AutocompleteElementDisplayProps<\r\n TValue,\r\n Multiple extends boolean | undefined,\r\n DisableClearable extends boolean | undefined,\r\n FreeSolo extends boolean | undefined,\r\n ChipComponent extends ElementType = ChipTypeMap[\"defaultComponent\"],\r\n TFieldValues extends FieldValues = FieldValues,\r\n TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>,\r\n> = AutocompleteElementProps<\r\n TValue,\r\n Multiple,\r\n DisableClearable,\r\n FreeSolo,\r\n ChipComponent,\r\n TFieldValues,\r\n TName\r\n> & {\r\n viewOnly?: boolean;\r\n disableUnderline?: boolean;\r\n}\r\n\r\nexport const AutocompleteElementDisplay = <\r\n TValue,\r\n Multiple extends boolean | undefined,\r\n DisableClearable extends boolean | undefined,\r\n FreeSolo extends boolean | undefined,\r\n ChipComponent extends ElementType = ChipTypeMap[\"defaultComponent\"],\r\n TFieldValues extends FieldValues = FieldValues,\r\n TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>,\r\n>({\r\n viewOnly = undefined as boolean | undefined,\r\n disableUnderline,\r\n textFieldProps,\r\n autocompleteProps,\r\n ...props\r\n}: AutocompleteElementDisplayProps<\r\n TValue,\r\n Multiple,\r\n DisableClearable,\r\n FreeSolo,\r\n ChipComponent,\r\n TFieldValues,\r\n TName\r\n>) => {\r\n const autocompleteAdjustedProps: AutocompleteElementDisplayProps<\r\n TValue,\r\n Multiple,\r\n DisableClearable,\r\n FreeSolo,\r\n ChipComponent,\r\n TFieldValues,\r\n TName\r\n >[\"autocompleteProps\"] = useMemo(\r\n () =>\r\n merge<\r\n AutocompleteElementDisplayProps<TValue, Multiple, DisableClearable, FreeSolo, ChipComponent, TFieldValues, TName>[\"autocompleteProps\"],\r\n AutocompleteElementDisplayProps<TValue, Multiple, DisableClearable, FreeSolo, ChipComponent, TFieldValues, TName>[\"autocompleteProps\"],\r\n AutocompleteElementDisplayProps<TValue, Multiple, DisableClearable, FreeSolo, ChipComponent, TFieldValues, TName>[\"autocompleteProps\"]\r\n >(\r\n {\r\n readOnly: viewOnly,\r\n disableClearable: autocompleteProps?.disableClearable || viewOnly as DisableClearable,\r\n disabled: viewOnly,\r\n\r\n },\r\n autocompleteProps,\r\n viewOnly\r\n ? {\r\n sx: {\r\n \".MuiAutocomplete-tag\": {\r\n opacity: \"1 !important\",\r\n },\r\n },\r\n }\r\n : {},\r\n ),\r\n [autocompleteProps, viewOnly],\r\n );\r\n\r\n const textFieldAdjustedProps= useMemo(\r\n () => getTextElementDisplayProps(textFieldProps, viewOnly, disableUnderline),\r\n [textFieldProps, viewOnly, disableUnderline],\r\n );\r\n\r\n return (\r\n <AutocompleteElement\r\n autocompleteProps={autocompleteAdjustedProps}\r\n textFieldProps={textFieldAdjustedProps}\r\n {...props}\r\n />\r\n );\r\n};\r\n\r\n\r\n","import { type ElementType, useMemo, useState, useEffect } from \"react\";\nimport {\n Checkbox,\n Chip,\n ListItem,\n type ChipProps,\n type ChipTypeMap,\n type ListItemProps,\n} from \"@mui/material\";\nimport type { FieldPath, FieldValue, FieldValues } from \"react-hook-form\";\nimport {\n AutocompleteElementDisplay,\n type AutocompleteElementDisplayProps,\n} from \"./AutocompleteElementDisplay\";\nimport { getAutocompleteTypedValue, isNonNullableString } from \"../utils\";\nimport { useController } from \"react-hook-form-mui\";\nimport { merge } from \"lodash\";\n\n/**\n * Interface for special \"add option\" objects used in freeSolo mode\n * These objects represent a new item that can be created from user input\n */\ninterface AddOptionType {\n __isAddOption: true;\n inputValue: string;\n\n [key: string]: any; // Allow for additional properties from stringToNewItem\n}\n\n/**\n * Extends AutocompleteElementDisplayProps with additional properties for handling object values.\n *\n * @template TValue - The type of the option values\n * @template Multiple - Boolean flag indicating if multiple selections are allowed\n * @template DisableClearable - Boolean flag indicating if clearing the selection is disabled\n * @template FreeSolo - Boolean flag indicating if free text input is allowed\n * @template ChipComponent - The component type used for rendering chips in multiple selection mode\n * @template TFieldValues - The type of the form values\n * @template TName - The type of the field name\n */\nexport type ObjectElementDisplayProps<\n TValue,\n Multiple extends boolean | undefined,\n DisableClearable extends boolean | undefined,\n FreeSolo extends boolean | undefined,\n ChipComponent extends ElementType = ChipTypeMap[\"defaultComponent\"],\n TFieldValues extends FieldValues = FieldValues,\n TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>,\n> = AutocompleteElementDisplayProps<\n TValue,\n Multiple,\n DisableClearable,\n FreeSolo,\n ChipComponent,\n TFieldValues,\n TName\n> & {\n /**\n * Function to extract a unique key from an option value.\n * Used for option comparison and deduplication.\n *\n * @param value - The option value or null\n * @returns A unique string key for the value\n */\n getItemKey: (value: TValue | null) => string | null;\n\n /**\n * Function to generate a display label for an option value.\n * Can return any ReactNode for custom rendering.\n *\n * @param value - The option value or null\n * @returns A string to display as the option label\n */\n getItemLabel: (value: TValue | null) => string | null;\n\n /**\n * Function to get additional props for an option list item.\n * Used for customizing the rendering of the option.\n *\n * @param value - The option value or null\n * @returns Additional props to apply to the list item\n */\n getOptionProps?: (value: TValue | null) => ListItemProps;\n\n /**\n * Function to convert a free text input string to a TValue object.\n * Required when freeSolo is true to create new items from text input.\n *\n * @param value - The string value entered by the user\n * @returns A new TValue object created from the string\n */\n stringToNewItem?: (value: string) => TValue;\n\n /**\n * Whether the input allows free text entry.\n * When true, users can enter values that are not in the options.\n */\n freeSolo?: FreeSolo;\n\n /**\n * Optional function that returns additional chip props based on the value.\n * This allows for customizing chip appearance and behavior based on the value it represents.\n *\n * @param value - The option value being rendered as a chip\n * @returns Additional props to apply to the Chip component\n */\n getChipProps?: (props: { value: TValue; index: number }) => Partial<ChipProps> | undefined;\n\n /**\n * Optional function to transform the value before it's updated in the form.\n * This allows for custom processing or enrichment of the selected value.\n *\n * @param value - The value that would normally be sent to the form\n * @returns The transformed value to be stored in the form\n */\n transformValue?: (\n value: Multiple extends true ? TValue[] : TValue | null\n ) => FieldValue<FieldValues>;\n};\n\n/**\n * A form component that displays a searchable dropdown for selecting object values.\n * Extends AutocompleteElementDisplay with object-specific functionality.\n *\n * Features:\n * - Works with complex object values instead of just primitive types\n * - Supports both single and multiple selection modes\n * - Supports free-solo mode for creating new items from text input\n * - Handles initial values that aren't in the default options\n * - Deduplicates options based on item keys\n *\n * @template TValue - The type of the option values\n * @template Multiple - Boolean flag indicating if multiple selections are allowed\n * @template DisableClearable - Boolean flag indicating if clearing the selection is disabled\n * @template FreeSolo - Boolean flag indicating if free text input is allowed\n * @template ChipComponent - The component type used for rendering chips in multiple selection mode\n * @template TFieldValues - The type of the form values\n * @template TName - The type of the field name\n *\n * @returns A React component for selecting object values\n */\nexport const ObjectElementDisplay = <\n TValue,\n Multiple extends boolean | undefined,\n DisableClearable extends boolean | undefined,\n FreeSolo extends boolean | undefined,\n ChipComponent extends ElementType = ChipTypeMap[\"defaultComponent\"],\n TFieldValues extends FieldValues = FieldValues,\n TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>,\n>({\n options,\n autocompleteProps,\n getItemKey,\n getItemLabel,\n getChipProps,\n stringToNewItem,\n transformValue,\n name,\n freeSolo,\n control,\n getOptionProps,\n ...props\n}: ObjectElementDisplayProps<\n TValue,\n Multiple,\n DisableClearable,\n FreeSolo,\n ChipComponent,\n TFieldValues,\n TName\n>) => {\n /**\n * Access to the form field controller\n */\n const { field } = useController({ name, control });\n\n /**\n * State for storing dynamically added options that aren't in the original options list\n * Includes both default values and values added during freeSolo mode\n */\n const [newOptions, setNewOptions] = useState<TValue[]>(() => {\n if (!field.value) return [];\n\n // Convert field value to array for consistent handling\n const fieldValues: TValue[] = Array.isArray(field.value) ? field.value : [field.value];\n\n // Keep only object values that don't exist in the options array\n return fieldValues.filter(\n (value) =>\n typeof value !== \"string\" &&\n !options.some((option) => getItemKey(option) === getItemKey(value)),\n );\n });\n\n /**\n * Update newOptions when field.value changes\n * This ensures that any new values added to the field after rendering\n * are properly included in newOptions and displayed\n */\n useEffect(() => {\n if (!field.value) return;\n\n const fieldValues: TValue[] = Array.isArray(field.value) ? field.value : [field.value];\n const newFieldOptions = fieldValues.filter(\n (value) =>\n typeof value !== \"string\" &&\n ![...options, ...newOptions].some((option) => getItemKey(option) === getItemKey(value)),\n );\n\n // Only update newOptions if there are new values to add\n if (newFieldOptions.length > 0) {\n setNewOptions((prevOptions) => [...prevOptions, ...newFieldOptions]);\n }\n }, [field.value, options, newOptions, getItemKey]);\n\n /**\n * Combined list of all available options (original + dynamically added)\n */\n const allOptions = useMemo(() => {\n const seen = new Set();\n return [...options, ...newOptions].filter((option) => {\n const key = getItemKey(option);\n if (seen.has(key)) return false;\n seen.add(key);\n return true;\n })\n }, [options, newOptions]);\n\n return (\n <AutocompleteElementDisplay\n name={name}\n control={control}\n options={allOptions}\n {...props}\n autocompleteProps={{\n /**\n * Determines if two options should be considered equal\n * Uses the getItemKey function to compare option values\n */\n isOptionEqualToValue: (o, v) => getItemKey(o) === getItemKey(v),\n\n /**\n * Filters options based on the input value\n * Checks if the option key or label contains the input value (case-insensitive)\n * For freeSolo mode, adds a special \"Add [value]\" option when there's no exact match\n */\n filterOptions: (options, { inputValue }) => {\n if (!inputValue) return options;\n\n const searchValue = inputValue.toLowerCase();\n\n // Filter options that match the input value (by key or label)\n const filteredOptions = options.filter((option) => {\n const key = getItemKey(option)?.toLowerCase();\n const label = String(getItemLabel(option)).toLowerCase();\n return key?.includes(searchValue) || label.includes(searchValue);\n });\n\n // For freeSolo mode, add \"Add [value]\" option if no exact match exists\n if (freeSolo && stringToNewItem && inputValue.length > 0) {\n const hasExactMatch = filteredOptions.some(\n (option) => String(getItemLabel(option)).toLowerCase() === searchValue,\n );\n\n if (!hasExactMatch) {\n // Create a special option with a __isAddOption flag\n const addOption: AddOptionType = {\n __isAddOption: true,\n inputValue,\n ...stringToNewItem(inputValue), // Include properties for type compatibility\n };\n\n return [addOption as unknown as TValue, ...filteredOptions];\n }\n }\n\n return filteredOptions;\n },\n freeSolo, // Allowed to enter own string value\n autoComplete: true,\n autoHighlight: true, // The first option is highlighted by default\n openOnFocus: true, // Opens the menu when tabbed into\n\n /**\n * Custom rendering for each option in the dropdown list\n * Handles both regular options and special \"Add\" options in freeSolo mode\n */\n renderOption: (liProps, option, { selected }, ownerState) => {\n const itemProps = merge(liProps, getOptionProps?.(option) ?? {});\n\n // Handles the special \"Add\" option in freeSolo mode\n if (\n ownerState?.freeSolo &&\n typeof option === \"object\" &&\n option !== null &&\n \"__isAddOption\" in option\n ) {\n const inputValue = (option as unknown as AddOptionType).inputValue;\n return (\n <ListItem {...itemProps} key={`${name}-add-option-${inputValue}`}>\n Add: '{inputValue}'\n </ListItem>\n );\n }\n\n // Handle regular option\n return (\n <ListItem {...itemProps} key={`${name}-option-${getItemKey(option)}`}>\n {(props?.showCheckbox && ownerState?.multiple) && (\n <Checkbox sx={{ marginRight: 1 }} checked={selected} />\n )}\n {typeof option === \"string\" ? option : getItemLabel(option)}\n </ListItem>\n );\n },\n\n onChange: (event, value, reason, details) => {\n /**\n * Helper function to apply transformValue if provided, otherwise return the original value\n */\n const applyTransform = (val: any) => {\n return transformValue && val !== null\n ? field.onChange(transformValue(val))\n : field.onChange(val);\n };\n\n /**\n * Helper function to add a new item to newOptions if it doesn't exist already\n */\n const addToNewOptions = (item: TValue) => {\n const itemKey = getItemKey(item);\n const itemExists = [...options, ...newOptions].some(\n (option) => getItemKey(option) === itemKey,\n );\n\n if (!itemExists) {\n setNewOptions((prev) => [...prev, item]);\n }\n };\n\n /**\n * Helper function to extract input value from string or AddOption\n */\n const getInputValue = (item: any): string | null => {\n if (typeof item === \"string\" && item.length > 0) {\n return item;\n }\n if (typeof item === \"object\" && item !== null && \"__isAddOption\" in item) {\n return (item as unknown as AddOptionType).inputValue;\n }\n return null;\n };\n\n // Handle freeSolo mode with stringToNewItem function\n if (freeSolo && stringToNewItem) {\n // Handle special add option selection or string input\n const inputValue = getInputValue(value);\n\n if (inputValue) {\n const newItem = stringToNewItem(inputValue);\n\n if (props.multiple) {\n // For multiple selection, add the new item to the current values\n const currentValues = Array.isArray(field.value) ? field.value : [];\n const newValues = [...currentValues, newItem];\n applyTransform(newValues);\n } else {\n // For single selection, just use the new item\n applyTransform(newItem);\n }\n\n addToNewOptions(newItem);\n return;\n }\n\n // Handle array values (multiple selection)\n if (Array.isArray(value) && props.multiple) {\n // Convert any string values to objects and handle special add options\n const newValues =\n value?.map((item) => {\n const inputVal = getInputValue(item);\n return inputVal ? stringToNewItem(inputVal) : item;\n }) ?? [];\n\n applyTransform(newValues);\n\n // Add any new items to newOptions\n const allOptionsKeys = [...options, ...newOptions].map((option) =>\n getItemKey(option),\n );\n const newItems = newValues.filter(\n (item) => typeof item !== \"string\" && !allOptionsKeys.includes(getItemKey(item)),\n );\n\n if (newItems.length > 0) {\n setNewOptions((prev) => [...prev, ...newItems]);\n }\n return;\n }\n }\n\n // Default behavior for non-freeSolo cases\n if (transformValue && value !== null) {\n applyTransform(value as TValue | TValue[]);\n } else {\n autocompleteProps?.onChange?.(event, value, reason, details);\n }\n },\n\n /**\n * Custom rendering for the selected value(s)\n * For multiple selection, renders a Chip for each selected value\n * For single selection, renders the value as text\n * Uses getItemLabel to render the value labels\n */\n renderValue: (value, getItemProps, ownerState) => {\n const typedValue = getAutocompleteTypedValue(value, ownerState);\n\n // Handle array values (multiple selection)\n if (Array.isArray(typedValue)) {\n return typedValue.map((v, index) => {\n // @ts-expect-error a key is returned, and the linter doesn't pick this up\n const { key, ...chipProps } = getItemProps({ index });\n\n // Get the label - use string directly or extract from object\n const label = typeof v === \"string\" ? v : getItemLabel(v);\n\n // Get additional chip props if available\n const valueSpecificProps =\n typeof v !== \"string\" && getChipProps ? getChipProps({ value: v, index }) : {};\n\n return (\n <Chip\n key={`${name}-chip-${key}`}\n {...valueSpecificProps}\n {...chipProps}\n label={label}\n />\n );\n });\n }\n\n // Handles single value - return string or extracted label\n return isNonNullableString(typedValue)\n ? typedValue\n : typedValue\n ? getItemLabel(typedValue as NonNullable<TValue>)\n : \"\";\n },\n ...autocompleteProps,\n }}\n />\n );\n};\n","import { TextFieldElement, type TextFieldElementProps } from \"react-hook-form-mui\";\nimport { type FieldPath, type FieldValues } from \"react-hook-form\";\nimport { useMemo } from \"react\";\nimport { getTextElementDisplayProps } from \"../utils\";\n\nexport type TextElementDisplayProps<\n TFieldValues extends FieldValues = FieldValues,\n TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>\n> = TextFieldElementProps<TFieldValues, TName> & Viewable;\n\n/**\n * A form component that displays a text field with view-only capabilities.\n * Extends TextFieldElement with view-only functionality.\n *\n * @template TFieldValues - The type of the form values\n * @template TName - The type of the field name\n *\n * @returns A React component for text input with view-only support\n */\nexport const TextElementDisplay = <\n TFieldValues extends FieldValues = FieldValues,\n TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>,\n>({\n viewOnly,\n disableUnderline,\n ...props\n}: TextElementDisplayProps<TFieldValues, TName>) => {\n\n const adjustedProps = useMemo(\n () => getTextElementDisplayProps(props, viewOnly, disableUnderline),\n [props, viewOnly, disableUnderline],\n );\n\n return <TextFieldElement {...adjustedProps} />;\n};\n\ntype Viewable = {\n viewOnly?: boolean;\n disableUnderline?: boolean;\n};\n","import { FieldError, FieldErrors, FieldValues } from 'react-hook-form';\r\nimport lodash from 'lodash';\r\nconst { get } = lodash;\r\n\r\n/**\r\n * A hook to get the error message for a field from react-hook-form\r\n * @param errors The errors object from react-hook-form\r\n * @param name The name of the field (supports dot notation for nested fields)\r\n * @returns An object with error and helperText properties\r\n */\r\nexport function useFormError<T extends FieldValues>(\r\n errors: FieldErrors<T>,\r\n name: string\r\n): { error: boolean; helperText: string } {\r\n // Get the error for the field, supporting nested paths with dot notation\r\n const fieldError = get(errors, name) as FieldError | undefined;\r\n\r\n // Return error state and helper text\r\n return {\r\n error: !!fieldError,\r\n helperText: fieldError?.message || '',\r\n };\r\n}\r\n","// src/hooks/useOnMount.ts\r\nimport { useEffect, useRef } from \"react\";\r\n\r\n/**\r\n * Runs a provided callback function once on the first component mount.\r\n *\r\n * @param callback - The function to run on first mount.\r\n */\r\nexport function useOnMount(callback: () => void): void {\r\n const hasMounted = useRef(false);\r\n\r\n useEffect(() => {\r\n if (!hasMounted.current) {\r\n callback();\r\n hasMounted.current = true;\r\n }\r\n\r\n // Cleanup to prevent callback logic from running during cleanup\r\n return () => {\r\n hasMounted.current = true;\r\n };\r\n \r\n // eslint-disable-next-line react-hooks/exhaustive-deps\r\n }, []);\r\n}\r\n\r\n","import type { JSX } from \"react\";\r\nimport { FormControl, FormHelperText } from \"@mui/material\";\r\nimport type { FormControlProps } from \"@mui/material\";\r\nimport { useFormContext, type RegisterOptions, type FieldValues, type Path } from \"react-hook-form\";\r\nimport { useFormError } from \"../hooks\";\r\n\r\n/**\r\n * Props for the RHFHiddenInput component\r\n */\r\nexport interface ValidationElementProps<TFieldValues extends FieldValues> {\r\n /**\r\n * Name of the field in the form\r\n */\r\n name: Path<TFieldValues>;\r\n /**\r\n * Optional validation rules\r\n */\r\n rules: RegisterOptions<TFieldValues>;\r\n /**\r\n * Props to pass to the FormControl component\r\n */\r\n formControlProps?: Omit<FormControlProps, \"error\">;\r\n}\r\n\r\nexport const ValidationElement = <TFieldValues extends FieldValues = FieldValues>({\r\n name,\r\n rules,\r\n formControlProps = {},\r\n}: ValidationElementProps<TFieldValues>): JSX.Element => {\r\n const {\r\n register,\r\n formState: { errors },\r\n } = useFormContext<TFieldValues>();\r\n\r\n const { error, helperText } = useFormError(errors, name);\r\n\r\n return (\r\n <FormControl error={error} {...formControlProps}>\r\n <input type=\"hidden\" {...register(name, rules)} />\r\n {error && <FormHelperText>{helperText}</FormHelperText>}\r\n </FormControl>\r\n );\r\n};\r\n"],"names":["merge","lodash","getAutocompleteTypedValue","value","ownerState","getTextElementDisplayProps","props","viewOnly","disableUnderline","isNonNullableString","AutocompleteElementDisplay","textFieldProps","autocompleteProps","autocompleteAdjustedProps","useMemo","textFieldAdjustedProps","jsx","AutocompleteElement","ObjectElementDisplay","options","getItemKey","getItemLabel","getChipProps","stringToNewItem","transformValue","name","freeSolo","control","getOptionProps","field","useController","newOptions","setNewOptions","useState","option","useEffect","newFieldOptions","prevOptions","allOptions","seen","key","o","v","inputValue","searchValue","filteredOptions","label","liProps","selected","itemProps","createElement","ListItem","Checkbox","event","reason","details","applyTransform","val","addToNewOptions","item","itemKey","prev","getInputValue","newItem","newValues","inputVal","allOptionsKeys","newItems","getItemProps","typedValue","index","chipProps","valueSpecificProps","Chip","TextElementDisplay","adjustedProps","TextFieldElement","get","useFormError","errors","fieldError","useOnMount","callback","hasMounted","useRef","ValidationElement","rules","formControlProps","register","useFormContext","error","helperText","jsxs","FormControl","FormHelperText"],"mappings":"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"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@chris-c-brine/rhf-mui-kit",
|
|
3
|
-
"version": "0.
|
|
3
|
+
"version": "0.5.1",
|
|
4
4
|
"description": "React Hook Form components with Material UI integration",
|
|
5
5
|
"type": "module",
|
|
6
6
|
"main": "dist/index.cjs",
|
|
@@ -27,7 +27,7 @@
|
|
|
27
27
|
"test:coverage": "vitest run --coverage"
|
|
28
28
|
},
|
|
29
29
|
"dependencies": {
|
|
30
|
-
"lodash": "^4.
|
|
30
|
+
"lodash": "^4.0.0"
|
|
31
31
|
},
|
|
32
32
|
"peerDependencies": {
|
|
33
33
|
"@mui/material": ">5.0.0",
|