eslint-codemod-utils/dist/esm/utils/insert-jsx-attribute.js

A collection of AST helper functions for more complex ESLint rule fixes.

import { jsxAttribute, jsxElement, jsxIdentifier, jsxOpeningElement } from '..';
/**
 * Adds a prop to a JSXElement.
 *
 * Returns a `StringableASTNode<JSXElement>` so that callers can immediately
 * `.toString()` the result inside an ESLint fixer, and so the result can be
 * composed with other node helpers without forcing callers to supply a
 * synthetic `loc`/`range`.
 *
 * @author Sam Scheding
 * @example
 * ```
 *  const boxNode = jsxElement({ ...node })
 *  console.log(boxNode.toString()) // --> "<Box></Box>"
 *
 *  const boxNodeWithProp = insertJSXAttribute(node, 'display', 'block')
 *  console.log(boxNodeWithProp.toString()) // --> "<Box display='block'></Box>"
 * ```
 */
export function insertJSXAttribute(node, propName, propValue) {
    const { openingElement } = node;
    const { attributes = [] } = openingElement;
    return jsxElement({
        ...node,
        openingElement: jsxOpeningElement({
            ...openingElement,
            attributes: [
                ...attributes,
                jsxAttribute({
                    name: jsxIdentifier(propName),
                    value: propValue,
                }),
            ],
        }),
    });
}