Update field

Author: irshadahmad21

packages/js/shared-ui/form/wp/form-field.tsx

@@ -1,10 +1,18 @@
 import { useFormContext } from '@wpsocio/form';
-import { FormField as FormFieldUI } from '@wpsocio/ui/wp/form';
+import {
+	type ControllerProps,
+	type FieldPath,
+	type FieldValues,
+	FormField as FormFieldUI,
+} from '@wpsocio/ui/wp/form';
 
-export const FormField: React.FC<React.ComponentProps<typeof FormFieldUI>> = (
-	props,
-) => {
-	const { control } = useFormContext();
+export const FormField = <
+	TFieldValues extends FieldValues = FieldValues,
+	TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>,
+>({
+	...props
+}: ControllerProps<TFieldValues, TName>) => {
+	const { control } = useFormContext<TFieldValues>();
 
 	return <FormFieldUI control={control} {...props} />;
 };

packages/js/ui/src/icons/wp.ts

@@ -6,4 +6,5 @@ export {
 	check,
 	cloud,
 	trash,
+	edit,
 } from '@wordpress/icons';

packages/js/ui/src/wp/form/index.tsx

@@ -190,3 +190,5 @@ export {
 	FormMessage,
 	FormField,
 };
+
+export type { ControllerProps, FieldPath, FieldValues };

packages/js/ui/src/wrappers/select.tsx

@@ -1,6 +1,4 @@
 import * as React from 'react';
-
-import { cn } from '../lib/utils.js';
 import {
 	SelectContent,
 	SelectGroup,
@@ -10,6 +8,7 @@ import {
 	Select as SelectUI,
 	SelectValue,
 } from '../components/select.js';
+import { cn } from '../lib/utils.js';
 import { Spinner } from './spinner.js';
 import type { OptionProps } from './types.js';
 
@@ -75,7 +74,7 @@ const Select = React.forwardRef(
 					portalContainer={portalContainer || getPortalContainer()}
 				>
 					{options.map((option) => (
-						<React.Fragment key={option.label}>
+						<React.Fragment key={JSON.stringify(option)}>
 							{(() => {
 								if ('options' in option && Array.isArray(option.options)) {
 									return (