JSXElement

Abstract representation of TSX/JSX elements, e.g. <MyComponent />. This allows for many React-specific modifications, like adding props, changing the name, etc.

Inherits from

Expression, HasName, Editable

Properties

---

attributes

Same as JSXElement.props - Returns all JSXProp on this the element

def attributes(self) -> list[JSXProp]:
    ...

expressions

Returns all JSX expressions in the element

def expressions(self) -> list[JSXExpression]:
    ...

extended

Returns a SymbolGroup of all extended nodes. This allows a common edit interface for all of extended nodes.

def extended(self) -> SymbolGroup:
    ...

extended_source

Text representation of all its extended nodes

def extended_source(self) -> str:
    ...

file

The file object that this Editable instance belongs to

def file(self) -> File:
    ...

filepath

The file path of the file that this Editable instance belongs to

def filepath(self) -> str:
    ...

full_name

The full name including the object lookup (if applicable).

Examples: For a.b, the full name is a.b

def full_name(self) -> str | None:
    ...

function_calls

Returns all contained function calls. Useful for renaming function invocations etc.

def function_calls(self) -> list[FunctionCall]:
    ...

jsx_elements

Returns list of all JSXElements below this element in the tree (its children)

def jsx_elements(self) -> list[JSXElement]:
    ...

name

The name of the object excluding whichever namespace precedes it, as a string.

Examples: For a.b, the name is b

def name(self) -> str | None:
    ...

props

Returns all JSXProp on this JSXElement, e.g. <MyComponent prop1="value" /> would return a list with one JSXProp object.

def props(self) -> list[JSXProp]:
    ...

resolved_value

If the expression is a resolvable value, returns the last assigned expression value. Else, returns itself.

Example: a = 1 b = a foo(b)

If we call resolve_value on b, it returns 1.

def resolved_value(self) -> Expression | list[Expression]:
    ...

source

Text representation of the Editable instance

def source(self) -> str:
    ...

variable_usages

Returns Editables for all TreeSitter node instances of variable usages. (Excludes: property identifiers and argument keywords) This is useful for renaming variables locally and analyzing variable usages.

def variable_usages(self) -> list[Editable]:
    ...

Methods

---

add_prop

Adds a new prop to this JSXElement by name/value, provided as strings

def add_prop(self, prop_name: str, prop_value: str) -> None:
    ...

commit

Commit just this node

def commit(self) -> None:
    ...

edit

Replace the source of this Editable with new_src. When fix_indentation is True, the indentation of new_src will be adjusted to match the current text’s indentation.

def edit(self, new_src: str, fix_indentation: bool = False, priority: int = 0, dedupe: bool = True) -> None:
    ...

find

Returns a list of all substring match in strings_to_match, similar to python’s str.find(..)

Args: exact: Only match individual nodes which exactly match the query

def find(self, strings_to_match: list[str] | str, *, exact: bool = False) -> list[Editable]:
    ...

find_string_literals

Returns a list of all editable substrings within string literals that match strings_to_match

def find_string_literals(self, strings_to_match: list[str], fuzzy_match: bool = False) -> list[Editable]:
    ...

flag

Adds a comment so the developer can see this Editable

def flag(self) -> None:
    ...

get_name

Returns the Name of the object, as a Name (editable)

def get_name(self) -> Name | ChainedAttribute | None:
    ...

get_prop

Returns the JSXProp with the given name, if it exists

def get_prop(self, name: str) -> JSXProp | None:
    ...

get_variable_usages

Returns Editables for all TreeSitter nodes corresponding to instances of variable usage that matches the given variable name. (Excludes: property identifiers and argument keywords) fuzzy_match allows for partial matching of variable names and effectively does var_name in usage.name

def get_variable_usages(self, var_name: str, fuzzy_match: bool = False) -> list[Editable]:
    ...

insert_after

Inserts new_src after this node

def insert_after(self, new_src: str, fix_indentation: bool = False, newline: bool = True, priority: int = 0, dedupe: bool = True) -> None:
    ...

insert_before

Inserts new_src before this node

def insert_before(self, new_src: str, fix_indentation: bool = False, newline: bool = True, priority: int = 0, dedupe: bool = True) -> None:
    ...

remove

Deletes this Node, and optionally its related extended nodes (e.g. decorators, comments, etc.)

def remove(self, delete_formatting: bool = True, priority: int = 0, dedupe: bool = True) -> None:
    ...

rename

Sets the name of the object as well its usages

def rename(self, name: str) -> None:
    ...

replace

Search and replace an instance of substring within this node’s source. Similar to python’s string.replace(..) Throws ValueError if there are more than one occurrence of substring in this node’s source.

Arguments: old: the occurrences of this string to replace new: the string to replace with count: the max number of occurrences to replace. Default value: -1 (replace all) is_regex: whether old is a regex pattern. Default value: False

Returns: The total count of old occurrences replaced.

def replace(self, old: str, new: str, count: int = -1, is_regex: bool = False, priority: int = 0) -> int:
    ...

search

Returns a list of all regex match of regex_pattern, similar to python’s re.search(…)

When include_strings is False, the search will exclude the contents of string literals from the search. When include_comments is False, the search will exclude the contents of comments from the search.

def search(self, regex_pattern: str, include_strings: bool = True, include_comments: bool = True) -> list[Editable]:
    ...

set_name

Sets the name of this JSXElement, e.g. <OldName /> would change to <NewName /> or <OldName>...</OldName> would change to <NewName>...</NewName>.

def set_name(self, name: str) -> None:
    ...

wrap

Wraps the current JSXElement with the provided opening and closing tags.

Args: opening_tag (str): The opening tag to wrap the element with, e.g. <div prop={value}> closing_tag (str): The closing tag to wrap the element with, e.g. </div>

def wrap(self, opening_tag: str, closing_tag: str) -> None:
    ...