Code view:

A painting is a person's account of this edit as text, recorded independently of the node mapping - a rendering often has several equally defensible answers where the mapping has one. Deletions and insertions carry no position on the opposite side in a painting, so that panel draws no caret for them.

Before

1import * as React from 'react';
2import Input from '@mui/joy/Input';
3
4export default function BasicInput() {
5 return <Input placeholder="Type in here…" />;
6}
7

After

1import Input from '@mui/joy/Input';
2
3export default function BasicInput() {
4 return <Input placeholder="Type in here…" />;
5}
6

Before

program
import_statement
import "import"
import_clause
namespace_import
* "*"
as "as"
identifier "React"
from "from"
string
' "'"
string_fragment "react"
' "'"
; ";"
import_statement
import "import"
import_clause
identifier "Input"
from "from"
string
' "'"
string_fragment "@mui/joy/Input"
' "'"
; ";"
export_statement (+26 nodes collapsed)

After

program
import_statement
import "import"
import_clause
identifier "Input"
from "from"
string
' "'"
string_fragment "@mui/joy/Input"
' "'"
; ";"
export_statement (+26 nodes collapsed)