@atlaskit/eslint-plugin-design-system 13.8.0 → 13.9.0

package/CHANGELOG.md

@@ -1,5 +1,13 @@
 # @atlaskit/eslint-plugin-design-system
 
+## 13.9.0
+
+### Minor Changes
+
+- [#145662](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/pull-requests/145662)
+  [`acf5f6979c85f`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/acf5f6979c85f) -
+  Add rule to encourage use of the DS select component over native HTML selects.
+
 ## 13.8.0
 
 ### Minor Changes

package/README.md

@@ -71,6 +71,7 @@ module.exports = {
 | <a href="./src/rules/no-html-checkbox/README.md">no-html-checkbox</a>                                                       | Discourage direct usage of HTML checkbox elements in favor of the Atlassian Design System checkbox component.                                                                                                                                                                                                       | Yes         |         | Yes         |
 | <a href="./src/rules/no-html-image/README.md">no-html-image</a>                                                             | Discourage direct usage of HTML image elements in favor of the Atlassian Design System image component.                                                                                                                                                                                                             | Yes         |         | Yes         |
 | <a href="./src/rules/no-html-range/README.md">no-html-range</a>                                                             | Discourage direct usage of HTML range elements in favor of the Atlassian Design System range component.                                                                                                                                                                                                             | Yes         |         | Yes         |
+| <a href="./src/rules/no-html-select/README.md">no-html-select</a>                                                           | Discourage direct usage of HTML select elements in favor of the Atlassian Design System select component.                                                                                                                                                                                                           | Yes         |         | Yes         |
 | <a href="./src/rules/no-invalid-css-map/README.md">no-invalid-css-map</a>                                                   | Checks the validity of a CSS map created through cssMap. This is intended to be used alongside TypeScript's type-checking.                                                                                                                                                                                          | Yes         |         |             |
 | <a href="./src/rules/no-keyframes-tagged-template-expression/README.md">no-keyframes-tagged-template-expression</a>         | Disallows any `keyframe` tagged template expressions that originate from Emotion, Styled Components or Compiled                                                                                                                                                                                                     |             | Yes     |             |
 | <a href="./src/rules/no-legacy-icons/README.md">no-legacy-icons</a>                                                         | Enforces no legacy icons are used.                                                                                                                                                                                                                                                                                  |             | Yes     | Yes         |

package/dist/cjs/presets/all-flat.codegen.js

@@ -6,7 +6,7 @@ Object.defineProperty(exports, "__esModule", {
 exports.default = void 0;
 /**
  * THIS FILE WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
- * @codegen <<SignedSource::cadedc68c5a8a92d8134b8aa5239937f>>
+ * @codegen <<SignedSource::f202c585a3745f4765e0515889577a22>>
  * @codegenCommand yarn workspace @atlaskit/eslint-plugin-design-system codegen
  */
 var _default = exports.default = {
@@ -32,6 +32,7 @@ var _default = exports.default = {
     '@atlaskit/design-system/no-html-checkbox': 'warn',
     '@atlaskit/design-system/no-html-image': 'warn',
     '@atlaskit/design-system/no-html-range': 'warn',
+    '@atlaskit/design-system/no-html-select': 'warn',
     '@atlaskit/design-system/no-invalid-css-map': ['error', {
       allowedFunctionCalls: [['@atlaskit/tokens', 'token']]
     }],

package/dist/cjs/presets/all.codegen.js

@@ -6,7 +6,7 @@ Object.defineProperty(exports, "__esModule", {
 exports.default = void 0;
 /**
  * THIS FILE WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
- * @codegen <<SignedSource::340bf9f79ec1de1340a89df9d626b929>>
+ * @codegen <<SignedSource::6b4a8032ac1f59781b9675b9cc053a55>>
  * @codegenCommand yarn workspace @atlaskit/eslint-plugin-design-system codegen
  */
 var _default = exports.default = {
@@ -31,6 +31,7 @@ var _default = exports.default = {
     '@atlaskit/design-system/no-html-checkbox': 'warn',
     '@atlaskit/design-system/no-html-image': 'warn',
     '@atlaskit/design-system/no-html-range': 'warn',
+    '@atlaskit/design-system/no-html-select': 'warn',
     '@atlaskit/design-system/no-invalid-css-map': ['error', {
       allowedFunctionCalls: [['@atlaskit/tokens', 'token']]
     }],

package/dist/cjs/presets/recommended-flat.codegen.js

@@ -6,7 +6,7 @@ Object.defineProperty(exports, "__esModule", {
 exports.default = void 0;
 /**
  * THIS FILE WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
- * @codegen <<SignedSource::c264ea60cc6348c4292744c1260543d8>>
+ * @codegen <<SignedSource::88336f6c2f8c5d33f84730619006b49e>>
  * @codegenCommand yarn workspace @atlaskit/eslint-plugin-design-system codegen
  */
 var _default = exports.default = {
@@ -27,6 +27,7 @@ var _default = exports.default = {
     '@atlaskit/design-system/no-html-checkbox': 'warn',
     '@atlaskit/design-system/no-html-image': 'warn',
     '@atlaskit/design-system/no-html-range': 'warn',
+    '@atlaskit/design-system/no-html-select': 'warn',
     '@atlaskit/design-system/no-invalid-css-map': ['error', {
       allowedFunctionCalls: [['@atlaskit/tokens', 'token']]
     }],

package/dist/cjs/presets/recommended.codegen.js

@@ -6,7 +6,7 @@ Object.defineProperty(exports, "__esModule", {
 exports.default = void 0;
 /**
  * THIS FILE WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
- * @codegen <<SignedSource::0158deb3db6cafbdeae2aeb18673ebc2>>
+ * @codegen <<SignedSource::829b781e15e90c3a142273e2b153459f>>
  * @codegenCommand yarn workspace @atlaskit/eslint-plugin-design-system codegen
  */
 var _default = exports.default = {
@@ -26,6 +26,7 @@ var _default = exports.default = {
     '@atlaskit/design-system/no-html-checkbox': 'warn',
     '@atlaskit/design-system/no-html-image': 'warn',
     '@atlaskit/design-system/no-html-range': 'warn',
+    '@atlaskit/design-system/no-html-select': 'warn',
     '@atlaskit/design-system/no-invalid-css-map': ['error', {
       allowedFunctionCalls: [['@atlaskit/tokens', 'token']]
     }],

package/dist/cjs/rules/index.codegen.js

@@ -27,6 +27,7 @@ var _noHtmlButton = _interopRequireDefault(require("./no-html-button"));
 var _noHtmlCheckbox = _interopRequireDefault(require("./no-html-checkbox"));
 var _noHtmlImage = _interopRequireDefault(require("./no-html-image"));
 var _noHtmlRange = _interopRequireDefault(require("./no-html-range"));
+var _noHtmlSelect = _interopRequireDefault(require("./no-html-select"));
 var _noInvalidCssMap = _interopRequireDefault(require("./no-invalid-css-map"));
 var _noKeyframesTaggedTemplateExpression = _interopRequireDefault(require("./no-keyframes-tagged-template-expression"));
 var _noLegacyIcons = _interopRequireDefault(require("./no-legacy-icons"));
@@ -61,7 +62,7 @@ var _useTokensTypography = _interopRequireDefault(require("./use-tokens-typograp
 var _useVisuallyHidden = _interopRequireDefault(require("./use-visually-hidden"));
 /**
  * THIS FILE WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
- * @codegen <<SignedSource::5945e51ebc0b2c3553b51162f07dbd63>>
+ * @codegen <<SignedSource::60d053061448c69290fba282ee307366>>
  * @codegenCommand yarn workspace @atlaskit/eslint-plugin-design-system codegen
  */
 
@@ -88,6 +89,7 @@ var rules = exports.rules = {
   'no-html-checkbox': _noHtmlCheckbox.default,
   'no-html-image': _noHtmlImage.default,
   'no-html-range': _noHtmlRange.default,
+  'no-html-select': _noHtmlSelect.default,
   'no-invalid-css-map': _noInvalidCssMap.default,
   'no-keyframes-tagged-template-expression': _noKeyframesTaggedTemplateExpression.default,
   'no-legacy-icons': _noLegacyIcons.default,

package/dist/cjs/rules/no-html-select/index.js

@@ -0,0 +1,40 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _createRule = require("../utils/create-rule");
+var _nodeTypes = require("./node-types");
+var rule = (0, _createRule.createLintRule)({
+  meta: {
+    name: 'no-html-select',
+    type: 'suggestion',
+    hasSuggestions: true,
+    docs: {
+      description: 'Discourage direct usage of HTML select elements in favor of the Atlassian Design System select component.',
+      recommended: true,
+      severity: 'warn'
+    },
+    messages: {
+      noHtmlSelect: "This <{{ name }}> should be replaced with the select component from the Atlassian Design System. ADS select components have event tracking, ensure accessible implementations, and provide access to ADS styling features like design tokens."
+    }
+  },
+  create: function create(context) {
+    return {
+      // transforms styled.<anchor>(...) usages
+      CallExpression: function CallExpression(node) {
+        _nodeTypes.StyledComponent.lint(node, {
+          context: context
+        });
+      },
+      // transforms <anchor css={...}> usages
+      JSXElement: function JSXElement(node) {
+        _nodeTypes.JSXElement.lint(node, {
+          context: context
+        });
+      }
+    };
+  }
+});
+var _default = exports.default = rule;

package/dist/cjs/rules/no-html-select/node-types/index.js

@@ -0,0 +1,19 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+Object.defineProperty(exports, "JSXElement", {
+  enumerable: true,
+  get: function get() {
+    return _jsxElement.JSXElement;
+  }
+});
+Object.defineProperty(exports, "StyledComponent", {
+  enumerable: true,
+  get: function get() {
+    return _styledComponent.StyledComponent;
+  }
+});
+var _styledComponent = require("./styled-component");
+var _jsxElement = require("./jsx-element");

package/dist/cjs/rules/no-html-select/node-types/jsx-element/index.js

@@ -0,0 +1,27 @@
+"use strict";
+
+var _typeof = require("@babel/runtime/helpers/typeof");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.JSXElement = void 0;
+var ast = _interopRequireWildcard(require("../../../../ast-nodes"));
+var _supported = require("../supported");
+function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
+var JSXElement = exports.JSXElement = {
+  lint: function lint(node, _ref) {
+    var context = _ref.context;
+    if (!(0, _supported.isSupportedForLint)(node)) {
+      return;
+    }
+    var nodeName = ast.JSXElement.getName(node);
+    context.report({
+      node: node.openingElement,
+      messageId: 'noHtmlSelect',
+      data: {
+        name: nodeName
+      }
+    });
+  }
+};

package/dist/cjs/rules/no-html-select/node-types/styled-component/index.js

@@ -0,0 +1,42 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.StyledComponent = void 0;
+var _eslintCodemodUtils = require("eslint-codemod-utils");
+var _contextCompat = require("@atlaskit/eslint-utils/context-compat");
+var _getJsxElementByName2 = require("../../../utils/get-jsx-element-by-name");
+var _getStyledComponentCall = require("../../../utils/get-styled-component-call");
+var _supported = require("../supported");
+/* eslint-disable @repo/internal/react/require-jsdoc */
+
+var StyledComponent = exports.StyledComponent = {
+  lint: function lint(node, _ref) {
+    var _getJsxElementByName;
+    var context = _ref.context;
+    if (!(0, _eslintCodemodUtils.isNodeOfType)(node, 'CallExpression') || !(0, _eslintCodemodUtils.isNodeOfType)(node.callee, 'MemberExpression') || !(0, _eslintCodemodUtils.isNodeOfType)(node.callee.object, 'Identifier') || !(0, _eslintCodemodUtils.isNodeOfType)(node.callee.property, 'Identifier')) {
+      return;
+    }
+    var styles = (0, _getStyledComponentCall.getStyledComponentCall)(node);
+    var elementName = node.callee.property.name;
+    if (!styles || !(0, _eslintCodemodUtils.isNodeOfType)(styles.id, 'Identifier')) {
+      return;
+    }
+    var jsxElement = (_getJsxElementByName = (0, _getJsxElementByName2.getJsxElementByName)(styles.id.name, (0, _contextCompat.getScope)(context, node))) === null || _getJsxElementByName === void 0 ? void 0 : _getJsxElementByName.parent;
+    if (!jsxElement) {
+      // If there's no JSX element, we can't determine if it's being used as an select or not
+      return;
+    }
+    if (jsxElement && !(0, _supported.isSupportedForLint)(jsxElement, elementName)) {
+      return;
+    }
+    context.report({
+      node: styles,
+      messageId: 'noHtmlSelect',
+      data: {
+        name: node.callee.property.name
+      }
+    });
+  }
+};

package/dist/cjs/rules/no-html-select/node-types/supported.js

@@ -0,0 +1,66 @@
+"use strict";
+
+var _typeof = require("@babel/runtime/helpers/typeof");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.isSupportedForLint = isSupportedForLint;
+var _eslintCodemodUtils = require("eslint-codemod-utils");
+var ast = _interopRequireWildcard(require("../../../ast-nodes"));
+function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
+var supportedElements = [{
+  name: 'select'
+}];
+
+/**
+ * Determines if the given JSX element is a supported element to lint with this rule.
+ */
+function isSupportedForLint(jsxNode, elementName) {
+  if (!(0, _eslintCodemodUtils.isNodeOfType)(jsxNode, 'JSXElement')) {
+    return false;
+  }
+
+  // Allow passing in the element name because the jsxNode doesn't
+  // represent the element name with styled components
+  var elName = elementName || ast.JSXElement.getName(jsxNode);
+  if (!elName) {
+    return false;
+  }
+
+  // Only check native HTML elements, not components
+  if (elName[0] !== elName[0].toLowerCase()) {
+    return false;
+  }
+  var supportedElement = supportedElements.find(function (_ref) {
+    var name = _ref.name;
+    return name === elName;
+  });
+  if (!supportedElement) {
+    supportedElement = supportedElements.find(function (_ref2) {
+      var name = _ref2.name;
+      return name === '*';
+    });
+  }
+  if (!supportedElement) {
+    return false;
+  }
+
+  // Check if the element has any attributes that are not supported
+  var attributes = ast.JSXElement.getAttributes(jsxNode);
+  if (supportedElement.attributes && !supportedElement.attributes.every(function (_ref3) {
+    var name = _ref3.name,
+      values = _ref3.values;
+    return attributes.some(function (attribute) {
+      if (attribute.type === 'JSXSpreadAttribute') {
+        return false;
+      }
+      var isMatchingName = attribute.name.name === name;
+      var isMatchingValues = values && attribute.value && attribute.value.type === 'Literal' && typeof attribute.value.value === 'string' && (values === null || values === void 0 ? void 0 : values.includes(attribute.value.value));
+      return isMatchingName && isMatchingValues;
+    });
+  })) {
+    return false;
+  }
+  return true;
+}

package/dist/es2019/presets/all-flat.codegen.js

@@ -1,6 +1,6 @@
 /**
  * THIS FILE WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
- * @codegen <<SignedSource::cadedc68c5a8a92d8134b8aa5239937f>>
+ * @codegen <<SignedSource::f202c585a3745f4765e0515889577a22>>
  * @codegenCommand yarn workspace @atlaskit/eslint-plugin-design-system codegen
  */
 
@@ -27,6 +27,7 @@ export default {
     '@atlaskit/design-system/no-html-checkbox': 'warn',
     '@atlaskit/design-system/no-html-image': 'warn',
     '@atlaskit/design-system/no-html-range': 'warn',
+    '@atlaskit/design-system/no-html-select': 'warn',
     '@atlaskit/design-system/no-invalid-css-map': ['error', {
       allowedFunctionCalls: [['@atlaskit/tokens', 'token']]
     }],

package/dist/es2019/presets/all.codegen.js

@@ -1,6 +1,6 @@
 /**
  * THIS FILE WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
- * @codegen <<SignedSource::340bf9f79ec1de1340a89df9d626b929>>
+ * @codegen <<SignedSource::6b4a8032ac1f59781b9675b9cc053a55>>
  * @codegenCommand yarn workspace @atlaskit/eslint-plugin-design-system codegen
  */
 
@@ -26,6 +26,7 @@ export default {
     '@atlaskit/design-system/no-html-checkbox': 'warn',
     '@atlaskit/design-system/no-html-image': 'warn',
     '@atlaskit/design-system/no-html-range': 'warn',
+    '@atlaskit/design-system/no-html-select': 'warn',
     '@atlaskit/design-system/no-invalid-css-map': ['error', {
       allowedFunctionCalls: [['@atlaskit/tokens', 'token']]
     }],

package/dist/es2019/presets/recommended-flat.codegen.js

@@ -1,6 +1,6 @@
 /**
  * THIS FILE WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
- * @codegen <<SignedSource::c264ea60cc6348c4292744c1260543d8>>
+ * @codegen <<SignedSource::88336f6c2f8c5d33f84730619006b49e>>
  * @codegenCommand yarn workspace @atlaskit/eslint-plugin-design-system codegen
  */
 
@@ -22,6 +22,7 @@ export default {
     '@atlaskit/design-system/no-html-checkbox': 'warn',
     '@atlaskit/design-system/no-html-image': 'warn',
     '@atlaskit/design-system/no-html-range': 'warn',
+    '@atlaskit/design-system/no-html-select': 'warn',
     '@atlaskit/design-system/no-invalid-css-map': ['error', {
       allowedFunctionCalls: [['@atlaskit/tokens', 'token']]
     }],

package/dist/es2019/presets/recommended.codegen.js

@@ -1,6 +1,6 @@
 /**
  * THIS FILE WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
- * @codegen <<SignedSource::0158deb3db6cafbdeae2aeb18673ebc2>>
+ * @codegen <<SignedSource::829b781e15e90c3a142273e2b153459f>>
  * @codegenCommand yarn workspace @atlaskit/eslint-plugin-design-system codegen
  */
 
@@ -21,6 +21,7 @@ export default {
     '@atlaskit/design-system/no-html-checkbox': 'warn',
     '@atlaskit/design-system/no-html-image': 'warn',
     '@atlaskit/design-system/no-html-range': 'warn',
+    '@atlaskit/design-system/no-html-select': 'warn',
     '@atlaskit/design-system/no-invalid-css-map': ['error', {
       allowedFunctionCalls: [['@atlaskit/tokens', 'token']]
     }],

package/dist/es2019/rules/index.codegen.js

@@ -1,6 +1,6 @@
 /**
  * THIS FILE WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
- * @codegen <<SignedSource::5945e51ebc0b2c3553b51162f07dbd63>>
+ * @codegen <<SignedSource::60d053061448c69290fba282ee307366>>
  * @codegenCommand yarn workspace @atlaskit/eslint-plugin-design-system codegen
  */
 import consistentCssPropUsage from './consistent-css-prop-usage';
@@ -25,6 +25,7 @@ import noHtmlButton from './no-html-button';
 import noHtmlCheckbox from './no-html-checkbox';
 import noHtmlImage from './no-html-image';
 import noHtmlRange from './no-html-range';
+import noHtmlSelect from './no-html-select';
 import noInvalidCssMap from './no-invalid-css-map';
 import noKeyframesTaggedTemplateExpression from './no-keyframes-tagged-template-expression';
 import noLegacyIcons from './no-legacy-icons';
@@ -80,6 +81,7 @@ export const rules = {
   'no-html-checkbox': noHtmlCheckbox,
   'no-html-image': noHtmlImage,
   'no-html-range': noHtmlRange,
+  'no-html-select': noHtmlSelect,
   'no-invalid-css-map': noInvalidCssMap,
   'no-keyframes-tagged-template-expression': noKeyframesTaggedTemplateExpression,
   'no-legacy-icons': noLegacyIcons,

package/dist/es2019/rules/no-html-select/index.js

@@ -0,0 +1,34 @@
+import { createLintRule } from '../utils/create-rule';
+import { JSXElement, StyledComponent } from './node-types';
+const rule = createLintRule({
+  meta: {
+    name: 'no-html-select',
+    type: 'suggestion',
+    hasSuggestions: true,
+    docs: {
+      description: 'Discourage direct usage of HTML select elements in favor of the Atlassian Design System select component.',
+      recommended: true,
+      severity: 'warn'
+    },
+    messages: {
+      noHtmlSelect: `This <{{ name }}> should be replaced with the select component from the Atlassian Design System. ADS select components have event tracking, ensure accessible implementations, and provide access to ADS styling features like design tokens.`
+    }
+  },
+  create(context) {
+    return {
+      // transforms styled.<anchor>(...) usages
+      CallExpression(node) {
+        StyledComponent.lint(node, {
+          context
+        });
+      },
+      // transforms <anchor css={...}> usages
+      JSXElement(node) {
+        JSXElement.lint(node, {
+          context
+        });
+      }
+    };
+  }
+});
+export default rule;

package/dist/es2019/rules/no-html-select/node-types/index.js

@@ -0,0 +1,2 @@
+export { StyledComponent } from './styled-component';
+export { JSXElement } from './jsx-element';

package/dist/es2019/rules/no-html-select/node-types/jsx-element/index.js

@@ -0,0 +1,19 @@
+import * as ast from '../../../../ast-nodes';
+import { isSupportedForLint } from '../supported';
+export const JSXElement = {
+  lint(node, {
+    context
+  }) {
+    if (!isSupportedForLint(node)) {
+      return;
+    }
+    const nodeName = ast.JSXElement.getName(node);
+    context.report({
+      node: node.openingElement,
+      messageId: 'noHtmlSelect',
+      data: {
+        name: nodeName
+      }
+    });
+  }
+};

package/dist/es2019/rules/no-html-select/node-types/styled-component/index.js

@@ -0,0 +1,37 @@
+/* eslint-disable @repo/internal/react/require-jsdoc */
+
+import { isNodeOfType } from 'eslint-codemod-utils';
+import { getScope } from '@atlaskit/eslint-utils/context-compat';
+import { getJsxElementByName } from '../../../utils/get-jsx-element-by-name';
+import { getStyledComponentCall } from '../../../utils/get-styled-component-call';
+import { isSupportedForLint } from '../supported';
+export const StyledComponent = {
+  lint(node, {
+    context
+  }) {
+    var _getJsxElementByName;
+    if (!isNodeOfType(node, 'CallExpression') || !isNodeOfType(node.callee, 'MemberExpression') || !isNodeOfType(node.callee.object, 'Identifier') || !isNodeOfType(node.callee.property, 'Identifier')) {
+      return;
+    }
+    const styles = getStyledComponentCall(node);
+    const elementName = node.callee.property.name;
+    if (!styles || !isNodeOfType(styles.id, 'Identifier')) {
+      return;
+    }
+    const jsxElement = (_getJsxElementByName = getJsxElementByName(styles.id.name, getScope(context, node))) === null || _getJsxElementByName === void 0 ? void 0 : _getJsxElementByName.parent;
+    if (!jsxElement) {
+      // If there's no JSX element, we can't determine if it's being used as an select or not
+      return;
+    }
+    if (jsxElement && !isSupportedForLint(jsxElement, elementName)) {
+      return;
+    }
+    context.report({
+      node: styles,
+      messageId: 'noHtmlSelect',
+      data: {
+        name: node.callee.property.name
+      }
+    });
+  }
+};

package/dist/es2019/rules/no-html-select/node-types/supported.js

@@ -0,0 +1,56 @@
+import { isNodeOfType } from 'eslint-codemod-utils';
+import * as ast from '../../../ast-nodes';
+const supportedElements = [{
+  name: 'select'
+}];
+
+/**
+ * Determines if the given JSX element is a supported element to lint with this rule.
+ */
+export function isSupportedForLint(jsxNode, elementName) {
+  if (!isNodeOfType(jsxNode, 'JSXElement')) {
+    return false;
+  }
+
+  // Allow passing in the element name because the jsxNode doesn't
+  // represent the element name with styled components
+  const elName = elementName || ast.JSXElement.getName(jsxNode);
+  if (!elName) {
+    return false;
+  }
+
+  // Only check native HTML elements, not components
+  if (elName[0] !== elName[0].toLowerCase()) {
+    return false;
+  }
+  let supportedElement = supportedElements.find(({
+    name
+  }) => name === elName);
+  if (!supportedElement) {
+    supportedElement = supportedElements.find(({
+      name
+    }) => name === '*');
+  }
+  if (!supportedElement) {
+    return false;
+  }
+
+  // Check if the element has any attributes that are not supported
+  const attributes = ast.JSXElement.getAttributes(jsxNode);
+  if (supportedElement.attributes && !supportedElement.attributes.every(({
+    name,
+    values
+  }) => {
+    return attributes.some(attribute => {
+      if (attribute.type === 'JSXSpreadAttribute') {
+        return false;
+      }
+      const isMatchingName = attribute.name.name === name;
+      const isMatchingValues = values && attribute.value && attribute.value.type === 'Literal' && typeof attribute.value.value === 'string' && (values === null || values === void 0 ? void 0 : values.includes(attribute.value.value));
+      return isMatchingName && isMatchingValues;
+    });
+  })) {
+    return false;
+  }
+  return true;
+}

package/dist/esm/presets/all-flat.codegen.js

@@ -1,6 +1,6 @@
 /**
  * THIS FILE WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
- * @codegen <<SignedSource::cadedc68c5a8a92d8134b8aa5239937f>>
+ * @codegen <<SignedSource::f202c585a3745f4765e0515889577a22>>
  * @codegenCommand yarn workspace @atlaskit/eslint-plugin-design-system codegen
  */
 
@@ -27,6 +27,7 @@ export default {
     '@atlaskit/design-system/no-html-checkbox': 'warn',
     '@atlaskit/design-system/no-html-image': 'warn',
     '@atlaskit/design-system/no-html-range': 'warn',
+    '@atlaskit/design-system/no-html-select': 'warn',
     '@atlaskit/design-system/no-invalid-css-map': ['error', {
       allowedFunctionCalls: [['@atlaskit/tokens', 'token']]
     }],

package/dist/esm/presets/all.codegen.js

@@ -1,6 +1,6 @@
 /**
  * THIS FILE WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
- * @codegen <<SignedSource::340bf9f79ec1de1340a89df9d626b929>>
+ * @codegen <<SignedSource::6b4a8032ac1f59781b9675b9cc053a55>>
  * @codegenCommand yarn workspace @atlaskit/eslint-plugin-design-system codegen
  */
 
@@ -26,6 +26,7 @@ export default {
     '@atlaskit/design-system/no-html-checkbox': 'warn',
     '@atlaskit/design-system/no-html-image': 'warn',
     '@atlaskit/design-system/no-html-range': 'warn',
+    '@atlaskit/design-system/no-html-select': 'warn',
     '@atlaskit/design-system/no-invalid-css-map': ['error', {
       allowedFunctionCalls: [['@atlaskit/tokens', 'token']]
     }],

package/dist/esm/presets/recommended-flat.codegen.js

@@ -1,6 +1,6 @@
 /**
  * THIS FILE WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
- * @codegen <<SignedSource::c264ea60cc6348c4292744c1260543d8>>
+ * @codegen <<SignedSource::88336f6c2f8c5d33f84730619006b49e>>
  * @codegenCommand yarn workspace @atlaskit/eslint-plugin-design-system codegen
  */
 
@@ -22,6 +22,7 @@ export default {
     '@atlaskit/design-system/no-html-checkbox': 'warn',
     '@atlaskit/design-system/no-html-image': 'warn',
     '@atlaskit/design-system/no-html-range': 'warn',
+    '@atlaskit/design-system/no-html-select': 'warn',
     '@atlaskit/design-system/no-invalid-css-map': ['error', {
       allowedFunctionCalls: [['@atlaskit/tokens', 'token']]
     }],

package/dist/esm/presets/recommended.codegen.js

@@ -1,6 +1,6 @@
 /**
  * THIS FILE WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
- * @codegen <<SignedSource::0158deb3db6cafbdeae2aeb18673ebc2>>
+ * @codegen <<SignedSource::829b781e15e90c3a142273e2b153459f>>
  * @codegenCommand yarn workspace @atlaskit/eslint-plugin-design-system codegen
  */
 
@@ -21,6 +21,7 @@ export default {
     '@atlaskit/design-system/no-html-checkbox': 'warn',
     '@atlaskit/design-system/no-html-image': 'warn',
     '@atlaskit/design-system/no-html-range': 'warn',
+    '@atlaskit/design-system/no-html-select': 'warn',
     '@atlaskit/design-system/no-invalid-css-map': ['error', {
       allowedFunctionCalls: [['@atlaskit/tokens', 'token']]
     }],

package/dist/esm/rules/index.codegen.js

@@ -1,6 +1,6 @@
 /**
  * THIS FILE WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
- * @codegen <<SignedSource::5945e51ebc0b2c3553b51162f07dbd63>>
+ * @codegen <<SignedSource::60d053061448c69290fba282ee307366>>
  * @codegenCommand yarn workspace @atlaskit/eslint-plugin-design-system codegen
  */
 import consistentCssPropUsage from './consistent-css-prop-usage';
@@ -25,6 +25,7 @@ import noHtmlButton from './no-html-button';
 import noHtmlCheckbox from './no-html-checkbox';
 import noHtmlImage from './no-html-image';
 import noHtmlRange from './no-html-range';
+import noHtmlSelect from './no-html-select';
 import noInvalidCssMap from './no-invalid-css-map';
 import noKeyframesTaggedTemplateExpression from './no-keyframes-tagged-template-expression';
 import noLegacyIcons from './no-legacy-icons';
@@ -80,6 +81,7 @@ export var rules = {
   'no-html-checkbox': noHtmlCheckbox,
   'no-html-image': noHtmlImage,
   'no-html-range': noHtmlRange,
+  'no-html-select': noHtmlSelect,
   'no-invalid-css-map': noInvalidCssMap,
   'no-keyframes-tagged-template-expression': noKeyframesTaggedTemplateExpression,
   'no-legacy-icons': noLegacyIcons,

package/dist/esm/rules/no-html-select/index.js

@@ -0,0 +1,34 @@
+import { createLintRule } from '../utils/create-rule';
+import { JSXElement as _JSXElement, StyledComponent } from './node-types';
+var rule = createLintRule({
+  meta: {
+    name: 'no-html-select',
+    type: 'suggestion',
+    hasSuggestions: true,
+    docs: {
+      description: 'Discourage direct usage of HTML select elements in favor of the Atlassian Design System select component.',
+      recommended: true,
+      severity: 'warn'
+    },
+    messages: {
+      noHtmlSelect: "This <{{ name }}> should be replaced with the select component from the Atlassian Design System. ADS select components have event tracking, ensure accessible implementations, and provide access to ADS styling features like design tokens."
+    }
+  },
+  create: function create(context) {
+    return {
+      // transforms styled.<anchor>(...) usages
+      CallExpression: function CallExpression(node) {
+        StyledComponent.lint(node, {
+          context: context
+        });
+      },
+      // transforms <anchor css={...}> usages
+      JSXElement: function JSXElement(node) {
+        _JSXElement.lint(node, {
+          context: context
+        });
+      }
+    };
+  }
+});
+export default rule;

package/dist/esm/rules/no-html-select/node-types/index.js

@@ -0,0 +1,2 @@
+export { StyledComponent } from './styled-component';
+export { JSXElement } from './jsx-element';

package/dist/esm/rules/no-html-select/node-types/jsx-element/index.js

@@ -0,0 +1,18 @@
+import * as ast from '../../../../ast-nodes';
+import { isSupportedForLint } from '../supported';
+export var JSXElement = {
+  lint: function lint(node, _ref) {
+    var context = _ref.context;
+    if (!isSupportedForLint(node)) {
+      return;
+    }
+    var nodeName = ast.JSXElement.getName(node);
+    context.report({
+      node: node.openingElement,
+      messageId: 'noHtmlSelect',
+      data: {
+        name: nodeName
+      }
+    });
+  }
+};

package/dist/esm/rules/no-html-select/node-types/styled-component/index.js

@@ -0,0 +1,36 @@
+/* eslint-disable @repo/internal/react/require-jsdoc */
+
+import { isNodeOfType } from 'eslint-codemod-utils';
+import { getScope } from '@atlaskit/eslint-utils/context-compat';
+import { getJsxElementByName } from '../../../utils/get-jsx-element-by-name';
+import { getStyledComponentCall } from '../../../utils/get-styled-component-call';
+import { isSupportedForLint } from '../supported';
+export var StyledComponent = {
+  lint: function lint(node, _ref) {
+    var _getJsxElementByName;
+    var context = _ref.context;
+    if (!isNodeOfType(node, 'CallExpression') || !isNodeOfType(node.callee, 'MemberExpression') || !isNodeOfType(node.callee.object, 'Identifier') || !isNodeOfType(node.callee.property, 'Identifier')) {
+      return;
+    }
+    var styles = getStyledComponentCall(node);
+    var elementName = node.callee.property.name;
+    if (!styles || !isNodeOfType(styles.id, 'Identifier')) {
+      return;
+    }
+    var jsxElement = (_getJsxElementByName = getJsxElementByName(styles.id.name, getScope(context, node))) === null || _getJsxElementByName === void 0 ? void 0 : _getJsxElementByName.parent;
+    if (!jsxElement) {
+      // If there's no JSX element, we can't determine if it's being used as an select or not
+      return;
+    }
+    if (jsxElement && !isSupportedForLint(jsxElement, elementName)) {
+      return;
+    }
+    context.report({
+      node: styles,
+      messageId: 'noHtmlSelect',
+      data: {
+        name: node.callee.property.name
+      }
+    });
+  }
+};

package/dist/esm/rules/no-html-select/node-types/supported.js

@@ -0,0 +1,57 @@
+import { isNodeOfType } from 'eslint-codemod-utils';
+import * as ast from '../../../ast-nodes';
+var supportedElements = [{
+  name: 'select'
+}];
+
+/**
+ * Determines if the given JSX element is a supported element to lint with this rule.
+ */
+export function isSupportedForLint(jsxNode, elementName) {
+  if (!isNodeOfType(jsxNode, 'JSXElement')) {
+    return false;
+  }
+
+  // Allow passing in the element name because the jsxNode doesn't
+  // represent the element name with styled components
+  var elName = elementName || ast.JSXElement.getName(jsxNode);
+  if (!elName) {
+    return false;
+  }
+
+  // Only check native HTML elements, not components
+  if (elName[0] !== elName[0].toLowerCase()) {
+    return false;
+  }
+  var supportedElement = supportedElements.find(function (_ref) {
+    var name = _ref.name;
+    return name === elName;
+  });
+  if (!supportedElement) {
+    supportedElement = supportedElements.find(function (_ref2) {
+      var name = _ref2.name;
+      return name === '*';
+    });
+  }
+  if (!supportedElement) {
+    return false;
+  }
+
+  // Check if the element has any attributes that are not supported
+  var attributes = ast.JSXElement.getAttributes(jsxNode);
+  if (supportedElement.attributes && !supportedElement.attributes.every(function (_ref3) {
+    var name = _ref3.name,
+      values = _ref3.values;
+    return attributes.some(function (attribute) {
+      if (attribute.type === 'JSXSpreadAttribute') {
+        return false;
+      }
+      var isMatchingName = attribute.name.name === name;
+      var isMatchingValues = values && attribute.value && attribute.value.type === 'Literal' && typeof attribute.value.value === 'string' && (values === null || values === void 0 ? void 0 : values.includes(attribute.value.value));
+      return isMatchingName && isMatchingValues;
+    });
+  })) {
+    return false;
+  }
+  return true;
+}

package/dist/types/index.codegen.d.ts

@@ -37,6 +37,7 @@ export declare const plugin: {
         'no-html-checkbox': import("eslint").Rule.RuleModule;
         'no-html-image': import("eslint").Rule.RuleModule;
         'no-html-range': import("eslint").Rule.RuleModule;
+        'no-html-select': import("eslint").Rule.RuleModule;
         'no-invalid-css-map': import("eslint").Rule.RuleModule;
         'no-keyframes-tagged-template-expression': import("eslint").Rule.RuleModule;
         'no-legacy-icons': import("eslint").Rule.RuleModule;
@@ -93,6 +94,7 @@ export declare const plugin: {
                 '@atlaskit/design-system/no-html-checkbox': "warn";
                 '@atlaskit/design-system/no-html-image': "warn";
                 '@atlaskit/design-system/no-html-range': "warn";
+                '@atlaskit/design-system/no-html-select': "warn";
                 '@atlaskit/design-system/no-invalid-css-map': ["error", {
                     allowedFunctionCalls: string[][];
                 }];
@@ -153,6 +155,7 @@ export declare const plugin: {
                 '@atlaskit/design-system/no-html-checkbox': "warn";
                 '@atlaskit/design-system/no-html-image': "warn";
                 '@atlaskit/design-system/no-html-range': "warn";
+                '@atlaskit/design-system/no-html-select': "warn";
                 '@atlaskit/design-system/no-invalid-css-map': ["error", {
                     allowedFunctionCalls: string[][];
                 }];
@@ -206,6 +209,7 @@ export declare const plugin: {
                 '@atlaskit/design-system/no-html-checkbox': "warn";
                 '@atlaskit/design-system/no-html-image': "warn";
                 '@atlaskit/design-system/no-html-range': "warn";
+                '@atlaskit/design-system/no-html-select': "warn";
                 '@atlaskit/design-system/no-invalid-css-map': ["error", {
                     allowedFunctionCalls: string[][];
                 }];
@@ -250,6 +254,7 @@ export declare const plugin: {
                 '@atlaskit/design-system/no-html-checkbox': "warn";
                 '@atlaskit/design-system/no-html-image': "warn";
                 '@atlaskit/design-system/no-html-range': "warn";
+                '@atlaskit/design-system/no-html-select': "warn";
                 '@atlaskit/design-system/no-invalid-css-map': ["error", {
                     allowedFunctionCalls: string[][];
                 }];
@@ -300,6 +305,7 @@ declare const configs: {
             '@atlaskit/design-system/no-html-checkbox': "warn";
             '@atlaskit/design-system/no-html-image': "warn";
             '@atlaskit/design-system/no-html-range': "warn";
+            '@atlaskit/design-system/no-html-select': "warn";
             '@atlaskit/design-system/no-invalid-css-map': ["error", {
                 allowedFunctionCalls: string[][];
             }];
@@ -360,6 +366,7 @@ declare const configs: {
             '@atlaskit/design-system/no-html-checkbox': "warn";
             '@atlaskit/design-system/no-html-image': "warn";
             '@atlaskit/design-system/no-html-range': "warn";
+            '@atlaskit/design-system/no-html-select': "warn";
             '@atlaskit/design-system/no-invalid-css-map': ["error", {
                 allowedFunctionCalls: string[][];
             }];
@@ -413,6 +420,7 @@ declare const configs: {
             '@atlaskit/design-system/no-html-checkbox': "warn";
             '@atlaskit/design-system/no-html-image': "warn";
             '@atlaskit/design-system/no-html-range': "warn";
+            '@atlaskit/design-system/no-html-select': "warn";
             '@atlaskit/design-system/no-invalid-css-map': ["error", {
                 allowedFunctionCalls: string[][];
             }];
@@ -457,6 +465,7 @@ declare const configs: {
             '@atlaskit/design-system/no-html-checkbox': "warn";
             '@atlaskit/design-system/no-html-image': "warn";
             '@atlaskit/design-system/no-html-range': "warn";
+            '@atlaskit/design-system/no-html-select': "warn";
             '@atlaskit/design-system/no-invalid-css-map': ["error", {
                 allowedFunctionCalls: string[][];
             }];

package/dist/types/presets/all-flat.codegen.d.ts

@@ -20,6 +20,7 @@ declare const _default: {
         '@atlaskit/design-system/no-html-checkbox': "warn";
         '@atlaskit/design-system/no-html-image': "warn";
         '@atlaskit/design-system/no-html-range': "warn";
+        '@atlaskit/design-system/no-html-select': "warn";
         '@atlaskit/design-system/no-invalid-css-map': ["error", {
             allowedFunctionCalls: string[][];
         }];

package/dist/types/presets/all.codegen.d.ts

@@ -20,6 +20,7 @@ declare const _default: {
         '@atlaskit/design-system/no-html-checkbox': "warn";
         '@atlaskit/design-system/no-html-image': "warn";
         '@atlaskit/design-system/no-html-range': "warn";
+        '@atlaskit/design-system/no-html-select': "warn";
         '@atlaskit/design-system/no-invalid-css-map': ["error", {
             allowedFunctionCalls: string[][];
         }];

package/dist/types/presets/recommended-flat.codegen.d.ts

@@ -15,6 +15,7 @@ declare const _default: {
         '@atlaskit/design-system/no-html-checkbox': "warn";
         '@atlaskit/design-system/no-html-image': "warn";
         '@atlaskit/design-system/no-html-range': "warn";
+        '@atlaskit/design-system/no-html-select': "warn";
         '@atlaskit/design-system/no-invalid-css-map': ["error", {
             allowedFunctionCalls: string[][];
         }];

package/dist/types/presets/recommended.codegen.d.ts

@@ -15,6 +15,7 @@ declare const _default: {
         '@atlaskit/design-system/no-html-checkbox': "warn";
         '@atlaskit/design-system/no-html-image': "warn";
         '@atlaskit/design-system/no-html-range': "warn";
+        '@atlaskit/design-system/no-html-select': "warn";
         '@atlaskit/design-system/no-invalid-css-map': ["error", {
             allowedFunctionCalls: string[][];
         }];

package/dist/types/rules/index.codegen.d.ts

@@ -21,6 +21,7 @@ export declare const rules: {
     'no-html-checkbox': import("eslint").Rule.RuleModule;
     'no-html-image': import("eslint").Rule.RuleModule;
     'no-html-range': import("eslint").Rule.RuleModule;
+    'no-html-select': import("eslint").Rule.RuleModule;
     'no-invalid-css-map': import("eslint").Rule.RuleModule;
     'no-keyframes-tagged-template-expression': import("eslint").Rule.RuleModule;
     'no-legacy-icons': import("eslint").Rule.RuleModule;

package/dist/types/rules/no-html-select/index.d.ts

@@ -0,0 +1,3 @@
+import type { Rule } from 'eslint';
+declare const rule: Rule.RuleModule;
+export default rule;

package/dist/types/rules/no-html-select/node-types/index.d.ts

@@ -0,0 +1,2 @@
+export { StyledComponent } from './styled-component';
+export { JSXElement } from './jsx-element';

package/dist/types/rules/no-html-select/node-types/jsx-element/index.d.ts

@@ -0,0 +1,8 @@
+import type { Rule } from 'eslint';
+interface MetaData {
+    context: Rule.RuleContext;
+}
+export declare const JSXElement: {
+    lint(node: Rule.Node, { context }: MetaData): void;
+};
+export {};

package/dist/types/rules/no-html-select/node-types/styled-component/index.d.ts

@@ -0,0 +1,8 @@
+import type { Rule } from 'eslint';
+interface MetaData {
+    context: Rule.RuleContext;
+}
+export declare const StyledComponent: {
+    lint(node: Rule.Node, { context }: MetaData): void;
+};
+export {};

package/dist/types/rules/no-html-select/node-types/supported.d.ts

@@ -0,0 +1,7 @@
+import { type EslintNode } from 'eslint-codemod-utils';
+/**
+ * Determines if the given JSX element is a supported element to lint with this rule.
+ */
+export declare function isSupportedForLint(jsxNode: EslintNode, elementName?: string): jsxNode is Extract<EslintNode, {
+    type: 'JSXElement';
+}>;

package/dist/types-ts4.5/index.codegen.d.ts

@@ -37,6 +37,7 @@ export declare const plugin: {
         'no-html-checkbox': import("eslint").Rule.RuleModule;
         'no-html-image': import("eslint").Rule.RuleModule;
         'no-html-range': import("eslint").Rule.RuleModule;
+        'no-html-select': import("eslint").Rule.RuleModule;
         'no-invalid-css-map': import("eslint").Rule.RuleModule;
         'no-keyframes-tagged-template-expression': import("eslint").Rule.RuleModule;
         'no-legacy-icons': import("eslint").Rule.RuleModule;
@@ -93,6 +94,7 @@ export declare const plugin: {
                 '@atlaskit/design-system/no-html-checkbox': "warn";
                 '@atlaskit/design-system/no-html-image': "warn";
                 '@atlaskit/design-system/no-html-range': "warn";
+                '@atlaskit/design-system/no-html-select': "warn";
                 '@atlaskit/design-system/no-invalid-css-map': [
                     "error",
                     {
@@ -156,6 +158,7 @@ export declare const plugin: {
                 '@atlaskit/design-system/no-html-checkbox': "warn";
                 '@atlaskit/design-system/no-html-image': "warn";
                 '@atlaskit/design-system/no-html-range': "warn";
+                '@atlaskit/design-system/no-html-select': "warn";
                 '@atlaskit/design-system/no-invalid-css-map': [
                     "error",
                     {
@@ -212,6 +215,7 @@ export declare const plugin: {
                 '@atlaskit/design-system/no-html-checkbox': "warn";
                 '@atlaskit/design-system/no-html-image': "warn";
                 '@atlaskit/design-system/no-html-range': "warn";
+                '@atlaskit/design-system/no-html-select': "warn";
                 '@atlaskit/design-system/no-invalid-css-map': [
                     "error",
                     {
@@ -259,6 +263,7 @@ export declare const plugin: {
                 '@atlaskit/design-system/no-html-checkbox': "warn";
                 '@atlaskit/design-system/no-html-image': "warn";
                 '@atlaskit/design-system/no-html-range': "warn";
+                '@atlaskit/design-system/no-html-select': "warn";
                 '@atlaskit/design-system/no-invalid-css-map': [
                     "error",
                     {
@@ -312,6 +317,7 @@ declare const configs: {
             '@atlaskit/design-system/no-html-checkbox': "warn";
             '@atlaskit/design-system/no-html-image': "warn";
             '@atlaskit/design-system/no-html-range': "warn";
+            '@atlaskit/design-system/no-html-select': "warn";
             '@atlaskit/design-system/no-invalid-css-map': [
                 "error",
                 {
@@ -375,6 +381,7 @@ declare const configs: {
             '@atlaskit/design-system/no-html-checkbox': "warn";
             '@atlaskit/design-system/no-html-image': "warn";
             '@atlaskit/design-system/no-html-range': "warn";
+            '@atlaskit/design-system/no-html-select': "warn";
             '@atlaskit/design-system/no-invalid-css-map': [
                 "error",
                 {
@@ -431,6 +438,7 @@ declare const configs: {
             '@atlaskit/design-system/no-html-checkbox': "warn";
             '@atlaskit/design-system/no-html-image': "warn";
             '@atlaskit/design-system/no-html-range': "warn";
+            '@atlaskit/design-system/no-html-select': "warn";
             '@atlaskit/design-system/no-invalid-css-map': [
                 "error",
                 {
@@ -478,6 +486,7 @@ declare const configs: {
             '@atlaskit/design-system/no-html-checkbox': "warn";
             '@atlaskit/design-system/no-html-image': "warn";
             '@atlaskit/design-system/no-html-range': "warn";
+            '@atlaskit/design-system/no-html-select': "warn";
             '@atlaskit/design-system/no-invalid-css-map': [
                 "error",
                 {

package/dist/types-ts4.5/presets/all-flat.codegen.d.ts

@@ -20,6 +20,7 @@ declare const _default: {
         '@atlaskit/design-system/no-html-checkbox': "warn";
         '@atlaskit/design-system/no-html-image': "warn";
         '@atlaskit/design-system/no-html-range': "warn";
+        '@atlaskit/design-system/no-html-select': "warn";
         '@atlaskit/design-system/no-invalid-css-map': [
             "error",
             {

package/dist/types-ts4.5/presets/all.codegen.d.ts

@@ -20,6 +20,7 @@ declare const _default: {
         '@atlaskit/design-system/no-html-checkbox': "warn";
         '@atlaskit/design-system/no-html-image': "warn";
         '@atlaskit/design-system/no-html-range': "warn";
+        '@atlaskit/design-system/no-html-select': "warn";
         '@atlaskit/design-system/no-invalid-css-map': [
             "error",
             {

package/dist/types-ts4.5/presets/recommended-flat.codegen.d.ts

@@ -15,6 +15,7 @@ declare const _default: {
         '@atlaskit/design-system/no-html-checkbox': "warn";
         '@atlaskit/design-system/no-html-image': "warn";
         '@atlaskit/design-system/no-html-range': "warn";
+        '@atlaskit/design-system/no-html-select': "warn";
         '@atlaskit/design-system/no-invalid-css-map': [
             "error",
             {

package/dist/types-ts4.5/presets/recommended.codegen.d.ts

@@ -15,6 +15,7 @@ declare const _default: {
         '@atlaskit/design-system/no-html-checkbox': "warn";
         '@atlaskit/design-system/no-html-image': "warn";
         '@atlaskit/design-system/no-html-range': "warn";
+        '@atlaskit/design-system/no-html-select': "warn";
         '@atlaskit/design-system/no-invalid-css-map': [
             "error",
             {

package/dist/types-ts4.5/rules/index.codegen.d.ts

@@ -21,6 +21,7 @@ export declare const rules: {
     'no-html-checkbox': import("eslint").Rule.RuleModule;
     'no-html-image': import("eslint").Rule.RuleModule;
     'no-html-range': import("eslint").Rule.RuleModule;
+    'no-html-select': import("eslint").Rule.RuleModule;
     'no-invalid-css-map': import("eslint").Rule.RuleModule;
     'no-keyframes-tagged-template-expression': import("eslint").Rule.RuleModule;
     'no-legacy-icons': import("eslint").Rule.RuleModule;

package/dist/types-ts4.5/rules/no-html-select/index.d.ts

@@ -0,0 +1,3 @@
+import type { Rule } from 'eslint';
+declare const rule: Rule.RuleModule;
+export default rule;

package/dist/types-ts4.5/rules/no-html-select/node-types/index.d.ts

@@ -0,0 +1,2 @@
+export { StyledComponent } from './styled-component';
+export { JSXElement } from './jsx-element';

package/dist/types-ts4.5/rules/no-html-select/node-types/jsx-element/index.d.ts

@@ -0,0 +1,8 @@
+import type { Rule } from 'eslint';
+interface MetaData {
+    context: Rule.RuleContext;
+}
+export declare const JSXElement: {
+    lint(node: Rule.Node, { context }: MetaData): void;
+};
+export {};

package/dist/types-ts4.5/rules/no-html-select/node-types/styled-component/index.d.ts

@@ -0,0 +1,8 @@
+import type { Rule } from 'eslint';
+interface MetaData {
+    context: Rule.RuleContext;
+}
+export declare const StyledComponent: {
+    lint(node: Rule.Node, { context }: MetaData): void;
+};
+export {};

package/dist/types-ts4.5/rules/no-html-select/node-types/supported.d.ts

@@ -0,0 +1,7 @@
+import { type EslintNode } from 'eslint-codemod-utils';
+/**
+ * Determines if the given JSX element is a supported element to lint with this rule.
+ */
+export declare function isSupportedForLint(jsxNode: EslintNode, elementName?: string): jsxNode is Extract<EslintNode, {
+    type: 'JSXElement';
+}>;

package/package.json

@@ -1,7 +1,7 @@
 {
 	"name": "@atlaskit/eslint-plugin-design-system",
 	"description": "The essential plugin for use with the Atlassian Design System.",
-	"version": "13.8.0",
+	"version": "13.9.0",
 	"author": "Atlassian Pty Ltd",
 	"license": "Apache-2.0",
 	"publishConfig": {