tsx-mui-material-ui-remove-import-4

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.

Before1import * as React from 'react';
2import Step from '@mui/material/Step';
3
4<Step component="a" href="/" active />;
5
6<Step active completed disabled expanded last />;
7<Step sx={(theme) => ({ bgcolor: 'red', borderColor: theme.palette.divider })} />;
8

After1import Step from '@mui/material/Step';
2
3<Step component="a" href="/" active />;
4
5<Step active completed disabled expanded last />;
6<Step sx={(theme) => ({ bgcolor: 'red', borderColor: theme.palette.divider })} />;
7

Before1import * as React from 'react';
2import Step from '@mui/material/Step';
3
4<Step component="a" href="/" active />;
5
6<Step active completed disabled expanded last />;
7<Step sx={(theme) => ({ bgcolor: 'red', borderColor: theme.palette.divider })} />;
8

After1import Step from '@mui/material/Step';
2
3<Step component="a" href="/" active />;
4
5<Step active completed disabled expanded last />;
6<Step sx={(theme) => ({ bgcolor: 'red', borderColor: theme.palette.divider })} />;
7

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 "Step"

from "from"

string

' "'"

string_fragment "@mui/material/Step"

' "'"

; ";"

expression_statement (+22 nodes collapsed)

expression_statement

jsx_self_closing_element

< "<"

identifier "Step"

jsx_attribute

property_identifier "active"

jsx_attribute

property_identifier "completed"

jsx_attribute

property_identifier "disabled"

jsx_attribute

property_identifier "expanded"

jsx_attribute

property_identifier "last"

/> "/>"

; ";"

expression_statement (+43 nodes collapsed)

After

program

import_statement

import "import"

import_clause

identifier "Step"

from "from"

string

' "'"

string_fragment "@mui/material/Step"

' "'"

; ";"

expression_statement (+22 nodes collapsed)

expression_statement

jsx_self_closing_element

< "<"

identifier "Step"

jsx_attribute

property_identifier "active"

jsx_attribute

property_identifier "completed"

jsx_attribute

property_identifier "disabled"

jsx_attribute

property_identifier "expanded"

jsx_attribute

property_identifier "last"

/> "/>"

; ";"

expression_statement (+43 nodes collapsed)

Keybindings

j / k: next / previous visible node (tree panels)
h / l: collapse / expand the focused node
g / G: jump to first / last visible node
Tab: switch focus between Before/After panels
/: search: jump to next node whose text contains a given string
a: jump the other panel to this node's mapped counterpart
i: hide identical matches, showing only inserted/deleted/updated nodes and their ancestors
v: cycle the view: split / code only / tree only
p: cycle what the code view renders: the node mapping, then each human painting
r: mark this fixture as reviewed, or forget the mark (kept in this browser only)
n: open a random fixture not yet marked as reviewed
?: toggle this help