@atlaskit/eslint-plugin-design-system/dist/es2019/rules/use-latest-xcss-syntax/transformers/style-property/index.js

The essential plugin for use with the Atlassian Design System.

/* eslint-disable @repo/internal/react/require-jsdoc */

import { isNodeOfType } from 'eslint-codemod-utils';
import { getSourceCode } from '@atlaskit/eslint-utils/context-compat';
import { Import } from '../../../../ast-nodes/import';
import { ObjectEntry as ObjectEntryHelper } from '../../../../ast-nodes/object-entry';
import { Root } from '../../../../ast-nodes/root';
import { styleMap } from './style-map';
import supported from './supported';
const messageId = 'noRawSpacingValues';
export const StyleProperty = {
  lint(node, {
    context
  }) {
    const {
      success,
      ref
    } = StyleProperty._check(node, {
      context
    });
    if (!success) {
      return;
    }
    context.report({
      node: ref,
      messageId
    });
  },
  _check(node, {
    context
  }) {
    if (!isNodeOfType(node, 'Property')) {
      return {
        success: false,
        ref: undefined
      };
    }
    const importDeclarations = Root.findImportsByModule(getSourceCode(context).ast.body, '@atlaskit/primitives');
    const isXcssImported = importDeclarations.some(importDeclaration => {
      return Import.containsNamedSpecifier(importDeclaration, 'xcss');
    });
    if (!isXcssImported) {
      return {
        success: false,
        ref: undefined
      };
    }

    /**
     * Currently, we support values like:
     * ```
     * xcss({
     *   margin: '8px', // value.type is Literal
     * })
     * ```
     *
     * More complex code, like:
     * ```
     * xcss({
     *   margin: condition ? 'space.100' : 'space.200',
     * })
     * ```
     * is too difficult to lint
     */
    if (!isNodeOfType(node.value, 'Literal')) {
      return {
        success: false,
        ref: undefined
      };
    }
    const {
      value: property
    } = ObjectEntryHelper.getProperty(node);

    // Bail if the property is not `padding`, `margin`, etc
    if (!property || !styleMap.includes(property)) {
      return {
        success: false,
        ref: undefined
      };
    }
    const value = ObjectEntryHelper.getValue(node);
    if (typeof value !== 'string') {
      return {
        success: false,
        ref: undefined
      };
    }

    // There are valid values to ignore, such as tokens, or `margin: auto`
    if (supported.values.ignore.includes(value)) {
      return {
        success: false,
        ref: undefined
      };
    }
    return {
      success: true,
      ref: node
    };
  }
};