JSXOpeningElement()

in src/rules/no-system-props.js [52:118]


      JSXOpeningElement(jsxNode) {
        if (!isPrimerComponent(jsxNode.name, context.getScope(jsxNode))) return
        if (excludedComponents.has(jsxNode.name.name)) return

        // Create an object mapping from prop name to the AST node for that attribute
        const propsByNameObject = jsxNode.attributes.reduce((object, attribute) => {
          // We don't do anything about spreads for now — only named attributes
          if (attribute.type === 'JSXAttribute') {
            object[attribute.name.name] = attribute
          }

          return object
        }, {})

        // Create an array of system prop attribute nodes
        let systemProps = Object.values(pick(propsByNameObject))

        let excludedProps = excludedComponentProps.has(jsxNode.name.name)
          ? new Set([...alwaysExcludedProps, ...excludedComponentProps.get(jsxNode.name.name)])
          : alwaysExcludedProps

        // Filter out our exceptional props
        systemProps = systemProps.filter(prop => {
          return !excludedProps.has(prop.name.name)
        })

        if (systemProps.length !== 0) {
          context.report({
            node: jsxNode,
            messageId: 'noSystemProps',
            data: {
              componentName: jsxNode.name.name,
              propNames: systemProps.map(a => a.name.name).join(', ')
            },
            fix(fixer) {
              const existingSxProp = jsxNode.attributes.find(
                attribute => attribute.type === 'JSXAttribute' && attribute.name.name === 'sx'
              )
              const systemPropstylesMap = stylesMapFromPropNodes(systemProps, context)
              if (existingSxProp && existingSxProp.value.expression.type !== 'ObjectExpression') {
                return
              }

              const stylesToAdd = existingSxProp
                ? excludeSxEntriesFromStyleMap(systemPropstylesMap, existingSxProp)
                : systemPropstylesMap

              return [
                // Remove the bad props
                ...systemProps.map(node => fixer.remove(node)),
                ...(stylesToAdd.size > 0
                  ? [
                      existingSxProp
                        ? // Update an existing sx prop
                          fixer.insertTextAfter(
                            last(existingSxProp.value.expression.properties),
                            `, ${objectEntriesStringFromStylesMap(stylesToAdd)}`
                          )
                        : // Insert new sx prop
                          fixer.insertTextAfter(last(jsxNode.attributes), sxPropTextFromStylesMap(systemPropstylesMap))
                    ]
                  : [])
              ]
            }
          })
        }
      }