@elastic/eslint-plugin-eui 2.15.0 → 2.16.0

package/lib/cjs/rules/no_deprecated_icon_aliases.js

@@ -0,0 +1,302 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.NoDeprecatedIconAliases = exports.DEPRECATED_ICON_ALIASES = exports.DEPRECATED_ICONS_WITHOUT_REPLACEMENT = void 0;
+var _utils = require("@typescript-eslint/utils");
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License
+ * 2.0 and the Server Side Public License, v 1; you may not use this file except
+ * in compliance with, at your election, the Elastic License 2.0 or the Server
+ * Side Public License, v 1.
+ */
+
+const DEPRECATED_ICON_ALIASES = exports.DEPRECATED_ICON_ALIASES = {
+  alert: 'warning',
+  anomalyChart: 'chartAnomaly',
+  apmTrace: 'chartWaterfall',
+  arrowDown: 'chevronSingleDown',
+  arrowEnd: 'chevronLimitRight',
+  arrowLeft: 'chevronSingleLeft',
+  arrowRight: 'chevronSingleRight',
+  arrowStart: 'chevronLimitLeft',
+  arrowUp: 'chevronSingleUp',
+  beaker: 'flask',
+  boxesHorizontal: 'ellipsis',
+  boxesVertical: 'ellipsis',
+  changePointDetection: 'chartChangePoint',
+  checkInCircleFilled: 'checkCircleFill',
+  cheer: 'popper',
+  color: 'paintBucket',
+  compute: 'processor',
+  console: 'commandLine',
+  contrastHigh: 'contrastFill',
+  controlsHorizontal: 'controls',
+  controlsVertical: 'controls',
+  copyClipboard: 'copy',
+  crossInCircle: 'crossCircle',
+  crosshairs: 'crosshair',
+  currency: 'money',
+  cut: 'scissors',
+  desktop: 'display',
+  diff: 'compare',
+  discuss: 'comment',
+  documentEdit: 'pencil',
+  documents: 'document',
+  doubleArrowLeft: 'chevronDoubleLeft',
+  doubleArrowRight: 'chevronDoubleRight',
+  editorAlignCenter: 'textAlignCenter',
+  editorAlignLeft: 'textAlignLeft',
+  editorAlignRight: 'textAlignRight',
+  editorBold: 'textBold',
+  editorChecklist: 'listCheck',
+  editorCodeBlock: 'code',
+  editorComment: 'comment',
+  editorDistributeHorizontal: 'distributeHorizontal',
+  editorDistributeVertical: 'distributeVertical',
+  editorHeading: 'textHeading',
+  editorItalic: 'textItalic',
+  editorItemAlignBottom: 'alignBottom',
+  editorItemAlignCenter: 'alignCenterHorizontal',
+  editorItemAlignLeft: 'alignLeft',
+  editorItemAlignMiddle: 'alignCenterVertical',
+  editorItemAlignRight: 'alignRight',
+  editorItemAlignTop: 'alignTop',
+  editorLink: 'link',
+  editorOrderedList: 'listNumber',
+  editorPositionBottomLeft: 'alignBottomLeft',
+  editorPositionBottomRight: 'alignBottomRight',
+  editorPositionTopLeft: 'alignTopLeft',
+  editorPositionTopRight: 'alignTopRight',
+  editorRedo: 'redo',
+  editorStrike: 'textStrike',
+  editorTable: 'table',
+  editorUnderline: 'textUnderline',
+  editorUndo: 'undo',
+  editorUnorderedList: 'listBullet',
+  email: 'mail',
+  eql: 'query',
+  errorFilled: 'errorFill',
+  exit: 'logOut',
+  expand: 'maximize',
+  expandMini: 'maximize',
+  export: 'upload',
+  exportAction: 'upload',
+  eyeClosed: 'eyeSlash',
+  fieldStatistics: 'tableInfo',
+  filterInCircle: 'filter',
+  folderCheck: 'check',
+  folderOpened: 'folderOpen',
+  glasses: 'readOnly',
+  grab: 'dragVertical',
+  grabHorizontal: 'dragHorizontal',
+  grabOmnidirectional: 'drag',
+  heatmap: 'chartHeatmap',
+  importAction: 'download',
+  indexClose: 'tableCross',
+  indexEdit: 'tablePencil',
+  indexFlush: 'chartThreshold',
+  indexMapping: 'mapping',
+  indexOpen: 'tablePlus',
+  indexRuntime: 'tablePlay',
+  indexSettings: 'tableGear',
+  indexTemporary: 'tableTime',
+  invert: 'contrast',
+  kqlField: 'queryField',
+  kqlOperand: 'queryOperand',
+  kqlSelector: 'querySelector',
+  kqlValue: 'queryValue',
+  kubernetesPod: 'cube',
+  launch: 'rocket',
+  lettering: 'text',
+  lineDashed: 'lineDash',
+  lineDotted: 'lineDot',
+  list: 'listBullet',
+  listAdd: 'plusCircle',
+  logPatternAnalysis: 'pattern',
+  logRateAnalysis: 'chartBarVertical',
+  logstashIf: 'if',
+  logstashQueue: 'queue',
+  magnifyWithExclamation: 'magnifyExclamation',
+  magnifyWithMinus: 'magnifyMinus',
+  magnifyWithPlus: 'magnifyPlus',
+  mapMarker: 'waypoint',
+  minusInCircle: 'minusCircle',
+  minusInCircleFilled: 'minusCircle',
+  minusInSquare: 'minusSquare',
+  newChat: 'plusCircle',
+  node: 'vectorTriangle',
+  offline: 'wifiSlash',
+  online: 'wifi',
+  pagesSelect: 'documentsCheck',
+  pinFilled: 'pinFill',
+  pipeBreaks: 'lineBreak',
+  pipeNoBreaks: 'lineBreakSlash',
+  playFilled: 'play',
+  plusInCircle: 'plusCircle',
+  plusInCircleFilled: 'plusCircle',
+  plusInSquare: 'plusSquare',
+  popout: 'external',
+  productRobot: 'productAgent',
+  push: 'send',
+  returnKey: 'return',
+  search: 'magnify',
+  securitySignal: 'radar',
+  starEmpty: 'star',
+  starFilled: 'starFill',
+  starFilledSpace: 'starFillSpace',
+  starMinusFilled: 'starMinusFill',
+  starPlusFilled: 'starPlusFill',
+  stopFilled: 'stopFill',
+  streamsClassic: 'productStreamsClassic',
+  streamsWired: 'productStreamsWired',
+  submodule: 'merge',
+  tableDensityCompact: 'tableDensityHigh',
+  tableDensityExpanded: 'tableDensityLow',
+  tableDensityNormal: 'table',
+  temperature: 'thermometer',
+  timeRefresh: 'refreshTime',
+  timelineWithArrow: 'timelinePointer',
+  timeslider: 'clockControl',
+  tokenDenseVector: 'tokenVectorDense',
+  training: 'presentation',
+  unlink: 'linkSlash',
+  userAvatar: 'user',
+  vector: 'vectorSquare',
+  visArea: 'chartArea',
+  visAreaStacked: 'chartAreaStack',
+  visBarHorizontal: 'chartBarHorizontal',
+  visBarHorizontalStacked: 'chartBarHorizontalStack',
+  visBarVertical: 'chartBarVertical',
+  visBarVerticalStacked: 'chartBarVerticalStack',
+  visGauge: 'chartGauge',
+  visLine: 'chartLine',
+  visMapCoordinate: 'waypoint',
+  visMapRegion: 'map',
+  visMetric: 'chartMetric',
+  visPie: 'chartPie',
+  visTable: 'table',
+  visTagCloud: 'chartTagCloud',
+  visText: 'text',
+  visVega: 'code',
+  warningFilled: 'warningFill'
+};
+const DEPRECATED_ICONS_WITHOUT_REPLACEMENT = exports.DEPRECATED_ICONS_WITHOUT_REPLACEMENT = new Set(['mobile']);
+const getComponentName = node => node.name.type === 'JSXIdentifier' ? node.name.name : undefined;
+const COMPONENT_ICON_ATTRIBUTES = {
+  EuiCommentTimeline: new Set(['timelineAvatar']),
+  EuiFormAppend: new Set(['iconLeft', 'iconRight']),
+  EuiFormAppendPrepend: new Set(['iconLeft', 'iconRight']),
+  EuiFormPrepend: new Set(['iconLeft', 'iconRight']),
+  EuiLoadingLogo: new Set(['logo']),
+  EuiTimelineItem: new Set(['icon'])
+};
+const isIconAttribute = (attributeName, importedComponentName) => {
+  const normalizedName = attributeName.toLowerCase();
+  return normalizedName.endsWith('icontype') || COMPONENT_ICON_ATTRIBUTES[importedComponentName]?.has(attributeName) === true || normalizedName === 'type' && (importedComponentName === 'EuiIcon' || importedComponentName === 'EuiIconTip');
+};
+const getStaticStringNode = node => {
+  if (node.value?.type === 'Literal' && typeof node.value.value === 'string') {
+    return node.value;
+  }
+  if (node.value?.type !== 'JSXExpressionContainer') {
+    return;
+  }
+  const {
+    expression
+  } = node.value;
+  if (expression.type === 'Literal' && typeof expression.value === 'string') {
+    return expression;
+  }
+  if (expression.type === 'TemplateLiteral' && expression.expressions.length === 0) {
+    return expression;
+  }
+};
+const getStaticStringValue = node => {
+  if (node.type === 'Literal') {
+    return typeof node.value === 'string' ? node.value : undefined;
+  }
+  return node.quasis[0]?.value.cooked ?? undefined;
+};
+const isDeprecatedIconAlias = value => value in DEPRECATED_ICON_ALIASES;
+const NoDeprecatedIconAliases = exports.NoDeprecatedIconAliases = _utils.ESLintUtils.RuleCreator.withoutDocs({
+  create(context) {
+    const euiComponentImports = new Map();
+    return {
+      ImportDeclaration(node) {
+        if (typeof node.source.value !== 'string' || node.source.value !== '@elastic/eui' && !node.source.value.startsWith('@elastic/eui/')) {
+          return;
+        }
+        for (const specifier of node.specifiers) {
+          if (specifier.type !== 'ImportSpecifier') {
+            continue;
+          }
+          const importedName = specifier.imported.type === 'Identifier' ? specifier.imported.name : specifier.imported.value;
+          if (importedName.startsWith('Eui')) {
+            euiComponentImports.set(specifier.local.name, importedName);
+          }
+        }
+      },
+      JSXAttribute(node) {
+        if (node.name.type !== 'JSXIdentifier') {
+          return;
+        }
+        const openingElement = node.parent;
+        const localComponentName = openingElement.type === 'JSXOpeningElement' ? getComponentName(openingElement) : undefined;
+        const importedComponentName = localComponentName ? euiComponentImports.get(localComponentName) : undefined;
+        if (!importedComponentName || !isIconAttribute(node.name.name, importedComponentName)) {
+          return;
+        }
+        const staticStringNode = getStaticStringNode(node);
+        if (!staticStringNode) {
+          return;
+        }
+        const iconType = getStaticStringValue(staticStringNode);
+        if (!iconType) {
+          return;
+        }
+        if (!isDeprecatedIconAlias(iconType)) {
+          if (DEPRECATED_ICONS_WITHOUT_REPLACEMENT.has(iconType)) {
+            context.report({
+              node: staticStringNode,
+              messageId: 'deprecatedIcon',
+              data: {
+                iconType
+              }
+            });
+          }
+          return;
+        }
+        const replacement = DEPRECATED_ICON_ALIASES[iconType];
+        context.report({
+          node: staticStringNode,
+          messageId: 'deprecatedIconAlias',
+          data: {
+            alias: iconType,
+            replacement
+          },
+          fix(fixer) {
+            const sourceText = context.sourceCode.getText(staticStringNode);
+            const quote = sourceText[0];
+            return fixer.replaceText(staticStringNode, `${quote}${replacement}${quote}`);
+          }
+        });
+      }
+    };
+  },
+  meta: {
+    type: 'suggestion',
+    docs: {
+      description: 'Disallow deprecated EUI icons in JSX icon props.'
+    },
+    fixable: 'code',
+    schema: [],
+    messages: {
+      deprecatedIcon: 'Icon `{{iconType}}` is deprecated and has no direct replacement.',
+      deprecatedIconAlias: 'Icon alias `{{alias}}` is deprecated. Use `{{replacement}}` instead.'
+    }
+  },
+  defaultOptions: []
+});

package/lib/cjs/utils/flat_map.d.ts

@@ -0,0 +1,2 @@
+export declare function flatMap<T, U>(arr: readonly T[], fn: (item: T) => U[]): U[];
+//# sourceMappingURL=flat_map.d.ts.map

package/lib/cjs/utils/flat_map.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"flat_map.d.ts","sourceRoot":"","sources":["../../../src/utils/flat_map.ts"],"names":[],"mappings":"AAUA,wBAAgB,OAAO,CAAC,CAAC,EAAE,CAAC,EAAE,GAAG,EAAE,SAAS,CAAC,EAAE,EAAE,EAAE,EAAE,CAAC,IAAI,EAAE,CAAC,KAAK,CAAC,EAAE,GAAG,CAAC,EAAE,CAO1E"}

package/lib/cjs/utils/flat_map.js

@@ -0,0 +1,24 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.flatMap = flatMap;
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License
+ * 2.0 and the Server Side Public License, v 1; you may not use this file except
+ * in compliance with, at your election, the Elastic License 2.0 or the Server
+ * Side Public License, v 1.
+ */
+
+// `Array.prototype.flatMap` requires ES2019 lib; this shim keeps rules that
+// need it within the package's es5 lib setting without widening it for others.
+function flatMap(arr, fn) {
+  const out = [];
+  for (const item of arr) {
+    const items = fn(item);
+    for (const i of items) out.push(i);
+  }
+  return out;
+}

package/lib/cjs/utils/has_meaningful_attr.d.ts

@@ -0,0 +1,20 @@
+import type { TSESTree } from '@typescript-eslint/utils';
+/**
+ * Checks whether a JSX opening element has an attribute whose value is
+ * statically "meaningful" — present and not a statically-known empty/falsy
+ * value (`""`, `{''}`, `{0}`, `{false}`, `{null}`, `{undefined}`).
+ *
+ * Dynamic or otherwise non-statically-analyzable values (variables, JSX,
+ * template literals, calls, …) are treated as meaningful, since their runtime
+ * value is unknown. Boolean shorthand (`<El attr />`) is also meaningful.
+ *
+ * Useful for rules that must distinguish an attribute that actually renders
+ * something from one that is present but effectively empty.
+ *
+ * @param openingElement - The `JSXOpeningElement` node (ESTree).
+ * @param attrName - The attribute name to look up.
+ * @returns `true` if the attribute is present with a non-empty/non-falsy or
+ * dynamic value; otherwise `false`.
+ */
+export declare function hasMeaningfulAttr(openingElement: TSESTree.JSXOpeningElement, attrName: string): boolean;
+//# sourceMappingURL=has_meaningful_attr.d.ts.map

package/lib/cjs/utils/has_meaningful_attr.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"has_meaningful_attr.d.ts","sourceRoot":"","sources":["../../../src/utils/has_meaningful_attr.ts"],"names":[],"mappings":"AAQA,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,0BAA0B,CAAC;AAEzD;;;;;;;;;;;;;;;;GAgBG;AACH,wBAAgB,iBAAiB,CAC/B,cAAc,EAAE,QAAQ,CAAC,iBAAiB,EAC1C,QAAQ,EAAE,MAAM,GACf,OAAO,CAkCT"}

package/lib/cjs/utils/has_meaningful_attr.js

@@ -0,0 +1,61 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.hasMeaningfulAttr = hasMeaningfulAttr;
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License
+ * 2.0 and the Server Side Public License, v 1; you may not use this file except
+ * in compliance with, at your election, the Elastic License 2.0 or the Server
+ * Side Public License, v 1.
+ */
+
+/**
+ * Checks whether a JSX opening element has an attribute whose value is
+ * statically "meaningful" — present and not a statically-known empty/falsy
+ * value (`""`, `{''}`, `{0}`, `{false}`, `{null}`, `{undefined}`).
+ *
+ * Dynamic or otherwise non-statically-analyzable values (variables, JSX,
+ * template literals, calls, …) are treated as meaningful, since their runtime
+ * value is unknown. Boolean shorthand (`<El attr />`) is also meaningful.
+ *
+ * Useful for rules that must distinguish an attribute that actually renders
+ * something from one that is present but effectively empty.
+ *
+ * @param openingElement - The `JSXOpeningElement` node (ESTree).
+ * @param attrName - The attribute name to look up.
+ * @returns `true` if the attribute is present with a non-empty/non-falsy or
+ * dynamic value; otherwise `false`.
+ */
+function hasMeaningfulAttr(openingElement, attrName) {
+  const attr = openingElement.attributes.find(a => a.type === 'JSXAttribute' && a.name.type === 'JSXIdentifier' && a.name.name === attrName);
+  if (!attr) return false;
+
+  // Boolean shorthand: `<El attr />` → present and truthy.
+  if (attr.value == null) return true;
+
+  // String literal: `attr="…"`.
+  if (attr.value.type === 'Literal') {
+    return Boolean(attr.value.value);
+  }
+  if (attr.value.type === 'JSXExpressionContainer') {
+    const {
+      expression
+    } = attr.value;
+
+    // Statically-known literals: `{''}`, `{0}`, `{false}`, `{null}`.
+    if (expression.type === 'Literal') {
+      return Boolean(expression.value);
+    }
+
+    // `{undefined}` (an identifier, not a literal).
+    if (expression.type === 'Identifier' && expression.name === 'undefined') {
+      return false;
+    }
+  }
+
+  // Dynamic / unknown value → treat as present.
+  return true;
+}

package/lib/cjs/utils/is_fragment.d.ts

@@ -0,0 +1,8 @@
+import { type TSESTree } from '@typescript-eslint/utils';
+/**
+ * Returns true if the opening element is a React fragment: `<Fragment>` or
+ * `<React.Fragment>`. The `<>` shorthand is represented as a `JSXFragment`
+ * node (not a `JSXOpeningElement`) and is handled separately by callers.
+ */
+export declare function isFragment(opening: TSESTree.JSXOpeningElement): boolean;
+//# sourceMappingURL=is_fragment.d.ts.map

package/lib/cjs/utils/is_fragment.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"is_fragment.d.ts","sourceRoot":"","sources":["../../../src/utils/is_fragment.ts"],"names":[],"mappings":"AAQA,OAAO,EAAE,KAAK,QAAQ,EAAE,MAAM,0BAA0B,CAAC;AAEzD;;;;GAIG;AACH,wBAAgB,UAAU,CAAC,OAAO,EAAE,QAAQ,CAAC,iBAAiB,GAAG,OAAO,CAUvE"}

package/lib/cjs/utils/is_fragment.js

@@ -0,0 +1,26 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.isFragment = isFragment;
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License
+ * 2.0 and the Server Side Public License, v 1; you may not use this file except
+ * in compliance with, at your election, the Elastic License 2.0 or the Server
+ * Side Public License, v 1.
+ */
+
+/**
+ * Returns true if the opening element is a React fragment: `<Fragment>` or
+ * `<React.Fragment>`. The `<>` shorthand is represented as a `JSXFragment`
+ * node (not a `JSXOpeningElement`) and is handled separately by callers.
+ */
+function isFragment(opening) {
+  const {
+    name
+  } = opening;
+  if (name.type === 'JSXIdentifier' && name.name === 'Fragment') return true;
+  return name.type === 'JSXMemberExpression' && name.object.type === 'JSXIdentifier' && name.object.name === 'React' && name.property.type === 'JSXIdentifier' && name.property.name === 'Fragment';
+}

package/lib/cjs/utils/walk_jsx_children.d.ts

@@ -0,0 +1,30 @@
+import { type TSESTree, type TSESLint } from '@typescript-eslint/utils';
+/**
+ * Recursively walks JSX children, expanding structural nodes transparently
+ * and calling `visit` for each content node.
+ *
+ * Always expanded (structural nodes):
+ *  - `<>...</>`, `<Fragment>`, `<React.Fragment>` (transparent grouping)
+ *  - `{expr}`                              (JSXExpressionContainer)
+ *  - `{a && b}`, `{a || b}`, `{a ?? b}`   (LogicalExpression → both sides)
+ *  - `{c ? a : b}`                         (ConditionalExpression → both branches)
+ *  - `{[a, b]}`                            (ArrayExpression → each element)
+ *  - `{(arg) => <El />}`                   (ArrowFunctionExpression)
+ *  - `{arr.map(fn)}`                       (CallExpression `.map()` with arrow-fn callback)
+ *
+ * With `options.sourceCode`: Identifiers and local arrow-fn components are
+ * also expanded via scope lookup when resolvable.
+ *
+ * `options.shouldSkip` - when provided, called for each JSXElement reached
+ * (after fragment and local-component checks). Returning true skips the
+ * element itself and recurses into its children instead. Use this to make
+ * layout wrappers or non-interactive shells transparent to the visitor.
+ *
+ * `visit` is called for leaf nodes: JSXElement, JSXText, Literal,
+ * TemplateLiteral, MemberExpression.
+ */
+export declare function walkJsxChildren(node: TSESTree.Node, visit: (node: TSESTree.Node) => void, options?: {
+    sourceCode?: TSESLint.SourceCode;
+    shouldSkip?: (el: TSESTree.JSXElement) => boolean;
+}): void;
+//# sourceMappingURL=walk_jsx_children.d.ts.map

package/lib/cjs/utils/walk_jsx_children.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"walk_jsx_children.d.ts","sourceRoot":"","sources":["../../../src/utils/walk_jsx_children.ts"],"names":[],"mappings":"AAQA,OAAO,EAAE,KAAK,QAAQ,EAAE,KAAK,QAAQ,EAAE,MAAM,0BAA0B,CAAC;AAmMxE;;;;;;;;;;;;;;;;;;;;;;;GAuBG;AACH,wBAAgB,eAAe,CAC7B,IAAI,EAAE,QAAQ,CAAC,IAAI,EACnB,KAAK,EAAE,CAAC,IAAI,EAAE,QAAQ,CAAC,IAAI,KAAK,IAAI,EACpC,OAAO,GAAE;IACP,UAAU,CAAC,EAAE,QAAQ,CAAC,UAAU,CAAC;IACjC,UAAU,CAAC,EAAE,CAAC,EAAE,EAAE,QAAQ,CAAC,UAAU,KAAK,OAAO,CAAC;CAC9C,GACL,IAAI,CAQN"}