aranlucas / react-hook-form-mantine

React Hook Form bindings for Mantine components
https://aranlucas.github.io/react-hook-form-mantine/
83 stars 12 forks source link

Typedef and missing alias $ types? #16

Closed jafin closed 7 months ago

jafin commented 10 months ago

I'm not sure if this is a config error on my behalf.

When I have react-hook-form-mantine is a project, and run tsc, I get warnings from the d.ts typedef.

/node_modules/react-hook-form-mantine/dist/index.d.ts(22,24): error TS2552: Cannot find name '$ChipProps'. Did you mean '_ChipProps1'?
/node_modules/react-hook-form-mantine/dist/index.d.ts(65,24): error TS2552: Cannot find name '$RadioProps'. Did you mean '_RadioProps1'?       
/node_modules/react-hook-form-mantine/dist/index.d.ts(66,58): error TS2552: Cannot find name '$RadioGroupProps'. Did you mean '_RadioGroupProps1'?
/node_modules/react-hook-form-mantine/dist/index.d.ts(84,24): error TS2552: Cannot find name '$SwitchProps'. Did you mean '_SwitchProps1'?     
/node_modules/react-hook-form-mantine/dist/index.d.ts(85,58): error TS2552: Cannot find name '$SwitchGroupProps'. Did you mean '_SwitchGroupProps1'?

Checking the generated index.d.ts I can't see these $ alias types.

import { FieldValues, UseControllerProps } from "react-hook-form";
import { AutocompleteProps as _AutocompleteProps1, CheckboxProps as _CheckboxProps1, CheckboxGroupProps as _CheckboxGroupProps1, ChipProps as _ChipProps1, ChipGroupProps as _ChipGroupProps1, ColorInputProps as _ColorInputProps1, ColorPickerProps as _ColorPickerProps1, FileInputProps as _FileInputProps1, InputProps as _InputProps1, JsonInputProps as _JsonInputProps1, MultiSelectProps as _MultiSelectProps1, NativeSelectProps as _NativeSelectProps1, NumberInputProps as _NumberInputProps1, PasswordInputProps as _PasswordInputProps1, PinInputProps as _PinInputProps1, RadioGroupProps as _RadioGroupProps1, RadioProps as _RadioProps1, RatingProps as _RatingProps1, SegmentedControlProps as _SegmentedControlProps1, SelectProps as _SelectProps1, SliderProps as _SliderProps1, SwitchGroupProps as _SwitchGroupProps1, SwitchProps as _SwitchProps1, TextInputProps as _TextInputProps1, TextareaProps as _TextareaProps1, TransferListProps as _TransferListProps1 } from "@mantine/core";
import { DateInputProps as _DateInputProps1, DatesRangeValue, DatePickerInputProps as _DatePickerInputProps1, DateValue, DateTimePickerProps as _DateTimePickerProps1, MonthPickerInputProps as _MonthPickerInputProps1, TimeInputProps as _TimeInputProps1, YearPickerInputProps as _YearPickerInputProps1 } from "@mantine/dates";
export type AutocompleteProps<T extends FieldValues> = UseControllerProps<T> & Omit<_AutocompleteProps1, "value" | "defaultValue">;
export function Autocomplete<T extends FieldValues>({ name, control, defaultValue, rules, shouldUnregister, onChange, ...props }: AutocompleteProps<T>): import("react/jsx-runtime").JSX.Element;
export type CheckboxProps<T extends FieldValues> = UseControllerProps<T> & Omit<_CheckboxProps1, "checked" | "defaultValue">;
export type CheckboxGroupProps<T extends FieldValues> = UseControllerProps<T> & Omit<_CheckboxGroupProps1, "checked" | "defaultValue">;
export function Checkbox<T extends FieldValues>({ name, control, defaultValue, rules, shouldUnregister, onChange, ...props }: CheckboxProps<T>): import("react/jsx-runtime").JSX.Element;
export declare namespace Checkbox {
    var Group: <T extends FieldValues>({ name, control, defaultValue, rules, shouldUnregister, onChange, ...props }: CheckboxGroupProps<T>) => import("react/jsx-runtime").JSX.Element;
    var Item: ((props: $CheckboxProps) => import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>>) & {
        Group: import("react").ForwardRefExoticComponent<$CheckboxGroupProps & import("react").RefAttributes<HTMLDivElement>>;
    } & {
        displayName: string;
    };
}

If I run tsc --declaration against the src, it does appear to import the $types in the file it generates

/// <reference types="react" />
import { type FieldValues, type UseControllerProps } from "react-hook-form";
import { type CheckboxProps as $CheckboxProps, type CheckboxGroupProps as $CheckboxGroupProps } from "@mantine/core";
export declare type CheckboxProps<T extends FieldValues> = UseControllerProps<T> & Omit<$CheckboxProps, "checked" | "defaultValue">;
export declare type CheckboxGroupProps<T extends FieldValues> = UseControllerProps<T> & Omit<$CheckboxGroupProps, "checked" | "defaultValue">;
export declare function Checkbox<T extends FieldValues>({ name, control, defaultValue, rules, shouldUnregister, onChange, ...props }: CheckboxProps<T>): import("react/jsx-runtime").JSX.Element;
export declare namespace Checkbox {
    var Group: <T extends FieldValues>({ name, control, defaultValue, rules, shouldUnregister, onChange, ...props }: CheckboxGroupProps<T>) => import("react/jsx-runtime").JSX.Element;
    var Item: ((props: $CheckboxProps) => import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>>) & {
        Group: import("react").ForwardRefExoticComponent<$CheckboxGroupProps & import("react").RefAttributes<HTMLDivElement>>;
    } & {
        displayName: string;
    };
}

Perhaps parcel does something to the typedef file differently?

aranlucas commented 10 months ago

Looks like it might be related to https://github.com/parcel-bundler/parcel/pull/8366

aranlucas commented 10 months ago

I tried switching to using microbundler for v3.

It seems to generate better types than parcel, let me know if it works for you.

github-actions[bot] commented 8 months ago

Stale issue message