@mui/codemod/deprecations/autocomplete-props/autocomplete-props.js

Codemod scripts for Material UI.

"use strict";

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.default = transformer;
var _movePropIntoSlots = _interopRequireDefault(require("../utils/movePropIntoSlots"));
var _movePropIntoSlotProps = _interopRequireDefault(require("../utils/movePropIntoSlotProps"));
var _replaceComponentsWithSlots = _interopRequireDefault(require("../utils/replaceComponentsWithSlots"));
var _findComponentJSX = _interopRequireDefault(require("../../util/findComponentJSX"));
var _findComponentDefaultProps = _interopRequireDefault(require("../../util/findComponentDefaultProps"));
var _assignObject = _interopRequireDefault(require("../../util/assignObject"));
var _appendAttribute = _interopRequireDefault(require("../../util/appendAttribute"));
/**
 * @param {import('jscodeshift').FileInfo} file
 * @param {import('jscodeshift').API} api
 */
function transformer(file, api, options) {
  const j = api.jscodeshift;
  const root = j(file.source);
  const printOptions = options.printOptions;
  (0, _movePropIntoSlots.default)(j, {
    root,
    packageName: options.packageName,
    componentName: 'Autocomplete',
    propName: 'PaperComponent',
    slotName: 'paper'
  });
  (0, _movePropIntoSlots.default)(j, {
    root,
    packageName: options.packageName,
    componentName: 'Autocomplete',
    propName: 'PopperComponent',
    slotName: 'popper'
  });
  (0, _movePropIntoSlotProps.default)(j, {
    root,
    packageName: options.packageName,
    componentName: 'Autocomplete',
    propName: 'ListboxProps',
    slotName: 'listbox'
  });
  (0, _movePropIntoSlotProps.default)(j, {
    root,
    packageName: options.packageName,
    componentName: 'Autocomplete',
    propName: 'ChipProps',
    slotName: 'chip'
  });
  (0, _replaceComponentsWithSlots.default)(j, {
    root,
    packageName: options.packageName,
    componentName: 'Autocomplete'
  });

  // Move ListboxComponent JSX prop into slotProps.listbox.component
  (0, _findComponentJSX.default)(j, {
    root,
    packageName: options.packageName,
    componentName: 'Autocomplete'
  }, elementPath => {
    const element = elementPath.node;
    const propIndex = element.openingElement.attributes.findIndex(attr => attr.type === 'JSXAttribute' && attr.name.name === 'ListboxComponent');
    if (propIndex !== -1) {
      const removedValue = element.openingElement.attributes.splice(propIndex, 1)[0].value.expression;
      let hasSlotProps = false;
      element.openingElement.attributes.forEach(attr => {
        if (attr.name?.name === 'slotProps') {
          hasSlotProps = true;
          const slots = attr.value.expression;
          const slotIndex = slots.properties.findIndex(prop => prop?.key?.name === 'listbox');
          if (slotIndex === -1) {
            (0, _assignObject.default)(j, {
              target: attr,
              key: 'listbox',
              expression: j.objectExpression([j.objectProperty(j.identifier('component'), removedValue)])
            });
          } else {
            const slotPropsSlotValue = slots.properties.splice(slotIndex, 1)[0].value;
            (0, _assignObject.default)(j, {
              target: attr,
              key: 'listbox',
              expression: j.objectExpression([j.objectProperty(j.identifier('component'), removedValue), j.spreadElement(slotPropsSlotValue)])
            });
          }
        }
      });
      if (!hasSlotProps) {
        (0, _appendAttribute.default)(j, {
          target: element,
          attributeName: 'slotProps',
          expression: j.objectExpression([j.objectProperty(j.identifier('listbox'), j.objectExpression([j.objectProperty(j.identifier('component'), removedValue)]))])
        });
      }
    }
  });

  // Move ListboxComponent default prop into slotProps.listbox.component
  const defaultPropsPathCollection = (0, _findComponentDefaultProps.default)(j, {
    root,
    packageName: options.packageName,
    componentName: 'Autocomplete'
  });
  defaultPropsPathCollection.find(j.ObjectProperty, {
    key: {
      name: 'ListboxComponent'
    }
  }).forEach(path => {
    const removedValue = path.value.value;
    const defaultProps = path.parent.value;
    let hasSlotProps = false;
    defaultProps.properties.forEach(property => {
      if (property.key?.name === 'slotProps') {
        hasSlotProps = true;
        const slotIndex = property.value.properties.findIndex(prop => prop?.key?.name === 'listbox');
        if (slotIndex === -1) {
          property.value.properties.push(j.objectProperty(j.identifier('listbox'), j.objectExpression([j.objectProperty(j.identifier('component'), removedValue)])));
        } else {
          const slotPropsSlotValue = property.value.properties.splice(slotIndex, 1)[0].value;
          property.value.properties.push(j.objectProperty(j.identifier('listbox'), j.objectExpression([j.objectProperty(j.identifier('component'), removedValue), j.spreadElement(slotPropsSlotValue)])));
        }
      }
    });
    if (!hasSlotProps) {
      defaultProps.properties.push(j.objectProperty(j.identifier('slotProps'), j.objectExpression([j.objectProperty(j.identifier('listbox'), j.objectExpression([j.objectProperty(j.identifier('component'), removedValue)]))])));
    }
    path.prune();
  });
  return root.toSource(printOptions);
}