$ cnpm install @putout/operator-jsx
????Putout operator operator adds methods that simplifies JSX transformations.
npm i putout @putout/operator-regexp
Check tagName of given Path, for next jsx:
<li>hello</li>;
It will work this way:
hasTagName(path, 'li');
// returns
true;
Get path of an attribute
const classNamePath = getAttributePath(path, 'className');
Get node of an attribute
const classNameNode = getAttributeNode(node, 'className');
Get value of an attribute
const className = getAttributeValue(node, 'className');
Add value to attribute
addAttributeValue(node, 'className', 'hello');
Remove attribute value:
removeAttributeValue(node, 'className', 'hello');
Works this way:
-<section className="hello world"/>
+<section className="world"/>
Set attribute value:
setAttributeValue(node, 'className', 'hello');
Works this way:
-<section className="world"/>
+<section className="hello"/>
Add className:
addClassName(node, 'hello');
Works this way:
-<section className="world"/>
+<section className="hello"/>
Remove className:
removeClassName(node, 'hello');
Works this way:
-<section className="hello world"/>
+<section className="world"/>
For next jsx:
<section className="world"/>;
get className:
getClassName(node);
// returns
'world';
For next jsx:
<section className="hello world"/>;
check:
containsClassName(node, 'hello');
// returns
true;
For next jsx:
<section data-name="hello"/>;
check:
hasDataName(node, 'hello');
// returns
true;
For next jsx:
<section data-menu-index="1"/>;
check:
hasAttributeValue(node, 'data-menu-index', '1');
// returns
true;
For next jsx:
<section/>;
check:
addAttribute(node, 'data-menu-index', '1');
result is:
<section data-menu-index="1"/>;
MIT
Copyright 2013 - present © cnpmjs.org | Home |