Fix types

Signed-off-by: Charles de Dreuille <charles.dedreuille@gmail.com>

packages/canon/report.api.md

@@ -25,7 +25,7 @@ import type { SwitchProps as SwitchProps_2 } from 'react-aria-components';
 import { Table as Table_2 } from '@tanstack/react-table';
 import { Tabs as Tabs_2 } from '@base-ui-components/react/tabs';
 import { TdHTMLAttributes } from 'react';
-import type { TextFieldProps } from 'react-aria-components';
+import type { TextFieldProps as TextFieldProps_2 } from 'react-aria-components';
 import { ThHTMLAttributes } from 'react';
 import { Tooltip as Tooltip_2 } from '@base-ui-components/react/tooltip';
 import type { useRender } from '@base-ui-components/react/use-render';
@@ -362,6 +362,8 @@ export const FieldLabel: ForwardRefExoticComponent<
 // @public (undocumented)
 export interface FieldLabelProps {
   description?: string | null;
+  htmlFor?: string;
+  id?: string;
   label?: string | null;
   secondaryLabel?: string | null;
 }
@@ -420,14 +422,6 @@ export interface FlexProps extends SpaceProps {
 // @public (undocumented)
 export type FlexWrap = 'wrap' | 'nowrap' | 'wrap-reverse';
 
-// @public (undocumented)
-export interface FormInputProps
-  extends Omit<TextFieldProps, 'size'>,
-    FieldLabelProps {
-  icon?: ReactNode;
-  size?: 'small' | 'medium' | Partial<Record<Breakpoint, 'small' | 'medium'>>;
-}
-
 // @public (undocumented)
 export const gapPropDefs: {
   gap: {
@@ -1296,9 +1290,17 @@ export { Text_2 as Text };
 
 // @public (undocumented)
 export const TextField: ForwardRefExoticComponent<
-  FormInputProps & RefAttributes<HTMLDivElement>
+  TextFieldProps & RefAttributes<HTMLDivElement>
 >;
 
+// @public (undocumented)
+export interface TextFieldProps
+  extends TextFieldProps_2,
+    Omit<FieldLabelProps, 'htmlFor' | 'id'> {
+  icon?: ReactNode;
+  size?: 'small' | 'medium' | Partial<Record<Breakpoint, 'small' | 'medium'>>;
+}
+
 // @public (undocumented)
 export interface TextProps
   extends Omit<useRender.ComponentProps<'p'>, 'color'> {

packages/canon/src/components/FieldLabel/types.ts

@@ -14,10 +14,8 @@
  * limitations under the License.
  */
 
-import type { HTMLAttributes } from 'react';
-
 /** @public */
-export interface FieldLabelProps extends HTMLAttributes<HTMLDivElement> {
+export interface FieldLabelProps {
   /**
    * The label of the text field
    */
@@ -37,4 +35,9 @@ export interface FieldLabelProps extends HTMLAttributes<HTMLDivElement> {
    * The HTML for attribute of the text field
    */
   htmlFor?: string;
+
+  /**
+   * The id of the text field
+   */
+  id?: string;
 }

packages/canon/src/components/TextField/TextField.tsx

@@ -24,11 +24,11 @@ import { useResponsiveValue } from '../../hooks/useResponsiveValue';
 import clsx from 'clsx';
 import { FieldLabel } from '../FieldLabel';
 
-import type { FormInputProps } from './types';
+import type { TextFieldProps } from './types';
 
 /** @public */
-export const TextField = forwardRef<HTMLDivElement, FormInputProps>(
-  (props: FormInputProps, ref) => {
+export const TextField = forwardRef<HTMLDivElement, TextFieldProps>(
+  (props, ref) => {
     const {
       className,
       icon,

packages/canon/src/components/TextField/types.ts

@@ -14,15 +14,15 @@
  * limitations under the License.
  */
 
-import type { TextFieldProps } from 'react-aria-components';
+import type { TextFieldProps as AriaTextFieldProps } from 'react-aria-components';
 import { ReactNode } from 'react';
 import type { Breakpoint } from '../../types';
 import type { FieldLabelProps } from '../FieldLabel/types';
 
 /** @public */
-export interface FormInputProps
-  extends Omit<TextFieldProps, 'size'>,
-    FieldLabelProps {
+export interface TextFieldProps
+  extends AriaTextFieldProps,
+    Omit<FieldLabelProps, 'htmlFor' | 'id'> {
   /**
    * An icon to render before the input
    */