Stack Overflow
Stack Overflow

Questions tagged [react-tsx]

A TypeScript XML syntax transform recommended for use with React.

TSX is an embeddable XML-like syntax. It is meant to be transformed into valid JavaScript, though the semantics of that transformation are implementation-specific. TSX rose to popularity with the React framework, but has since seen other implementations as well. TypeScript supports embedding, type checking, and compiling TSX directly to JavaScript.

563 questions
11
votes
4 answers

Material UI OutlinedInput label is invisible

We are using OutlinedInput from Material UI, but text labels are not rendered. How to fix this? import { Grid, OutlinedInput } from '@material-ui/core';
naXa stands with Ukraine
  • 35,493
  • 19
  • 190
  • 259
11
votes
2 answers

Property 'name' does not exist on type 'EventTarget' - React + TypeScript

This is my code: On my function handler I get error on the event: handleFilterClick =…
gpbaculio
  • 5,693
  • 13
  • 60
  • 102
10
votes
2 answers

React Typescript event type for both interfaces MouseEvent and TouchEvent

I am trying to write a function to handle both mouse and touch events. By combining both interfaces React.TouchEvent and React.MouseEvent, like: onStart = (event: React.TouchEvent | React.MouseEvent) => { event.persist(); console.log('event…
Marco Daniel
  • 5,467
  • 5
  • 28
  • 36
9
votes
1 answer

Nextjs: ts(7031) type error: Binding element 'Component' implicitly has an 'any' type

This is an issue I had when converting a NextJS project to TypeScript. In my _app.tsx, I got a type error: Binding element 'pageProps' implicitly has an 'any' type. ts(7031). The error likely looks like this: I know that there are existing answers…
Henrik Techguy
  • 501
  • 6
  • 12
9
votes
2 answers

Material-ui style dialog / modal backdrop

How do I go about styling the transparent dark overlay of a material-ui dialog or modal? I'm using material-ui/React/Typescript. Instead of a transparent dark, I want it to be a transparent white. I'd prefer a JSS solution but an inline style is…
crownlessking
  • 1,182
  • 1
  • 17
  • 22
9
votes
2 answers

how to add type declaration to react-typescript project with CRA

I have created a react typescript project with CRA with the command yarn create react-app my-app --typescript now I have a module foo installed that does not have any typing not by default, not in defentlytyped repository. i.e. in a component, I…
Amir-Mousavi
  • 4,273
  • 12
  • 70
  • 123
8
votes
1 answer

React Hooks and jsx-no-lambda warning

so now that we cant use the hooks as old style of event functions beside disabling the warning what is the best way to call event function that does not violate the rule import React, { useState } from 'react'; function Example() { // Declare a…
Amir-Mousavi
  • 4,273
  • 12
  • 70
  • 123
8
votes
1 answer

Cannot find name 'FB' [ts]

I am trying to initialize JavaScript SDK to use Facebook Graph API eventually. But it keep saying that Cannot find name FB, not sure why. Here is what I did, componentDidMount() { (window as any).fbAsyncInit = function() { FB.init({ //…
Hafiz Temuri
  • 3,882
  • 6
  • 41
  • 66
8
votes
1 answer

React TypeScript 2.3 -> typesafe React Bootstrap FormControl onChange

When using this code I'm getting the error Property 'type' does not exist on type 'EventTarget'. The same is for checked, value and name. Following the code I can see that FormEvent inherits from SyntheticEvent that in turn has a target:…
Ogglas
  • 62,132
  • 37
  • 328
  • 418
7
votes
2 answers

React Hooks (useState) and Mobx [No mobx-react-lite]

in my react application (with typescript) I want to use React hooks (specifically useState) to manage the form state and meanwhile use it as an observable component for Mobx store but I get the error Hooks can only be called inside the body of a…
Amir-Mousavi
  • 4,273
  • 12
  • 70
  • 123
7
votes
1 answer

Create React App cannot find declared module

I have a project create with CRA typescript. at the root of project there exists tsconfig.json and a folder called types. at the types folder I have created a modulename.d.ts file for a module that does not have default typings at node_modules and…
Amir-Mousavi
  • 4,273
  • 12
  • 70
  • 123
6
votes
3 answers

Property 'FC' does not exist on type 'typeof React

Version "typescript": "^3.9.5" "@types/react": "^16.9.36", Property 'FC' does not exist on type 'typeof React I'm all out of ideas. In .tsx files that contain react, I am continually getting the errors: Property 'FC' does not exist on type 'typeof…
Chetan Jain
  • 236
  • 6
  • 16
6
votes
1 answer

React SSR error -- Element type is invalid: expected a string (for built-in components) or a class/function (for composite components) but got: object

My app has a simple routing with ssr and below is my code index.tsx import React from "react"; import ReactDOM from "react-dom"; import "./index.css"; import App from "./App"; import * as serviceWorker from "./serviceWorker"; import…
Giri
  • 451
  • 1
  • 4
  • 13
6
votes
10 answers

Cannot find module 'react'.ts(2307)

I'm attempting to create a react app using TypeScript. I did yarn create react-app (name) --use-pnp --typescript. The TS linter keeps saying that Cannot find module 'react'.ts(2307) I've tried yarn add @types/react, yarn add, restarting VScode…
orjames
  • 61
  • 1
  • 1
  • 4
5
votes
2 answers

How to increase the edge drop zone using React Flow

I am using react-flow to create a node graph. There are little dots that appear above and below each node to create new edges. The selection and drop zones for these edges are so pixel accurate that it makes it hard for users to link items. Is there…
Hughes
  • 339
  • 3
  • 15
1
2
3
…
37 38