Open harsimarriar96-dappquire opened 1 year ago
Yes, I am facing the same issue, I am leaving it as a any. Gladly it's a legacy project that will be rewritten in the future, if you're still looking for a very decent component library go to mantine.dev
@harsimarriar96-dappquire I am new to the open source can u assign me the task, I would like to work on this.
I started to use the library only recently, so I'm not sure if it worked before.
But you can add its' Type directly to the component's JSX. For Multi-Select you can apply Type <Option, true>
:
type Option = {
value: string;
label: string;
};
export const MySelect = (props: Props) => {
return <Select<Option, true> options={STATUS_OPTIONS} isMulti />;
};
Same here.
It should infer the type from options
+1
I don't know If this is my problem or not but this issue is happening when trying to wrap select in typescript react: here I follow the instructions in document and get the conflict type error
here is the code
import ReactSelect, { GroupBase, Props } from 'react-select';
export function NewSelectField<
Option,
IsMulti extends boolean = false,
Group extends GroupBase<Option> = GroupBase<Option>,
>(props: Props<Option, IsMulti, Group>) {
return (
<ReactSelect
{...props}
theme={(theme) => ({ ...theme, borderRadius: 0 })}
/>
);
}
and here is the error
import type { Meta, StoryObj } from '@storybook/react';
import { NewSelectField } from '.';
import { useState } from 'react';
import { SingleValue } from 'react-select';
type Option = {
value: string;
label: string;
};
const options: Option[] = [
{ value: 'chocolate', label: 'Chocolate' },
{ value: 'strawberry', label: 'Strawberry' },
{ value: 'vanilla', label: 'Vanilla' },
];
const meta: Meta<typeof NewSelectField> = {
component: NewSelectField,
title: 'NewSelectField',
argTypes: {},
render: function Render({ ...args }) {
const [val, setVal] = useState<SingleValue<Option>>();
const handleChange = (option: SingleValue<Option>) => {
setVal(option);
};
return (
<NewSelectField
value={val}
options={options}
onChange={handleChange}
{...args}
/>
);
},
};
export default meta;
type Story = StoryObj<typeof NewSelectField>;
export const Accent: Story = {};
+1 having the same issue
I am unable to typecast properly for onChange event, there is no specific documentation, whatever available online looks outdated.