ChakraUI with Typescript. Problem with cols and rows

Question

I have already created react project and I integrated with Chakra using

npm i @chakra-ui/react @emotion/react@^11 @emotion/styled@^11 framer-motion@^5

Then I used Textarea component from this library and it is said that cols and rows must ba a number. I did workaround, defining new variables. But is it as should be? Cols and rows has to be number and I can not write inline style like cols="20"?.

const COLS = 20
const ROWS = 20


const RecipeForm = () => {
    return (
        <React.Fragment>
            <Navbar />
            <Center width="100%" height="95vh">
                <Flex justifyContent="center" alignItems="center" width="50vw">
                    <FormControl textAlign="center">
                        <Input placeholder="Name for your recipe" />
                        <SelectType />
                        <Textarea placeholder="Description" cols={COLS} rows={ROWS} resize="none" />
                        <Button type="submit">Submit</Button>
                    </FormControl>
                </Flex>
            </Center>
        </React.Fragment>
        
    )
}