@atlaskit/eslint-plugin-design-system 13.27.1 → 13.29.0

package/CHANGELOG.md

@@ -1,5 +1,20 @@
 # @atlaskit/eslint-plugin-design-system
 
+## 13.29.0
+
+### Minor Changes
+
+- [`3e6f7b52a2689`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/3e6f7b52a2689) -
+  Add rule to suggest usage of CharacterCounterField when using Textfield or Textarea with
+  minLength/maxLength properties
+
+## 13.28.0
+
+### Minor Changes
+
+- [`3f069f2616f1b`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/3f069f2616f1b) -
+  Add rule to enforce usage of message wrapper for field messaging components.
+
 ## 13.27.1
 
 ### Patch Changes

package/README.md

@@ -98,10 +98,12 @@ module.exports = {
 | <a href="./packages/design-system/eslint-plugin/src/rules/no-utility-icons/README.md">no-utility-icons</a>                                                                           | Disallow use of deprecated utility icons, in favor of core icons with `size="small"`.                                                                                                                                                                                                                               | Yes         | Yes     | Yes         |
 | <a href="./packages/design-system/eslint-plugin/src/rules/prefer-primitives/README.md">prefer-primitives</a>                                                                         | Increase awareness of primitive components via code hints. Strictly used for education purposes and discoverability. To enforce usage please refer to the `use-primitives` rule.                                                                                                                                    |             |         |             |
 | <a href="./packages/design-system/eslint-plugin/src/rules/use-button-group-label/README.md">use-button-group-label</a>                                                               | Ensures button groups are described to assistive technology by a direct label or by another element.                                                                                                                                                                                                                | Yes         |         | Yes         |
+| <a href="./packages/design-system/eslint-plugin/src/rules/use-character-counter-field/README.md">use-character-counter-field</a>                                                     | Suggests using CharacterCounterField when Textfield or Textarea components have maxLength or minLength props within a Form.                                                                                                                                                                                         | Yes         |         |             |
 | <a href="./packages/design-system/eslint-plugin/src/rules/use-correct-field/README.md">use-correct-field</a>                                                                         | Ensure makers use appropriate field component for their respective form elements.                                                                                                                                                                                                                                   | Yes         | Yes     | Yes         |
 | <a href="./packages/design-system/eslint-plugin/src/rules/use-cx-function-in-xcss/README.md">use-cx-function-in-xcss</a>                                                             | Enforces cx function use to combine styles in xcss.                                                                                                                                                                                                                                                                 | Yes         | Yes     | Yes         |
 | <a href="./packages/design-system/eslint-plugin/src/rules/use-datetime-picker-calendar-button/README.md">use-datetime-picker-calendar-button</a>                                     | Encourages makers to use calendar button in Atlassian Design System's date picker and datetime picker components.                                                                                                                                                                                                   | Yes         | Yes     | Yes         |
 | <a href="./packages/design-system/eslint-plugin/src/rules/use-drawer-label/README.md">use-drawer-label</a>                                                                           | Encourages to provide accessible name for Atlassian Design System Drawer component.                                                                                                                                                                                                                                 | Yes         |         | Yes         |
+| <a href="./packages/design-system/eslint-plugin/src/rules/use-field-message-wrapper/README.md">use-field-message-wrapper</a>                                                         | Encourage use of message wrapper component when using form message components.                                                                                                                                                                                                                                      | Yes         |         | Yes         |
 | <a href="./packages/design-system/eslint-plugin/src/rules/use-heading/README.md">use-heading</a>                                                                                     | Encourage the usage of heading components.                                                                                                                                                                                                                                                                          | Yes         | Yes     | Yes         |
 | <a href="./packages/design-system/eslint-plugin/src/rules/use-heading-level-in-spotlight-card/README.md">use-heading-level-in-spotlight-card</a>                                     | Inform developers of eventual requirement of `headingLevel` prop in `SpotlightCard` component. The heading level should be the appropriate level according to the surrounding context.                                                                                                                              | Yes         | Yes     |             |
 | <a href="./packages/design-system/eslint-plugin/src/rules/use-href-in-link-item/README.md">use-href-in-link-item</a>                                                                 | Inform developers of eventual requirement of `href` prop in `LinkItem` component. Elements with a `link` role require an `href` attribute for users to properly navigate, particularly those using assistive technologies. If no valid `href` is required for your use case, consider using a `ButtonItem` instead. | Yes         | 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::d7a0407a6c6b10bfbba790523d06f97d>>
+ * @codegen <<SignedSource::131350ebc877f42247042c6e7327fe18>>
  * @codegenCommand yarn workspace @atlaskit/eslint-plugin-design-system codegen
  */
 
@@ -62,10 +62,12 @@ var rules = {
     '@atlaskit/design-system/no-utility-icons': 'warn',
     '@atlaskit/design-system/prefer-primitives': 'warn',
     '@atlaskit/design-system/use-button-group-label': 'warn',
+    '@atlaskit/design-system/use-character-counter-field': 'warn',
     '@atlaskit/design-system/use-correct-field': 'warn',
     '@atlaskit/design-system/use-cx-function-in-xcss': 'error',
     '@atlaskit/design-system/use-datetime-picker-calendar-button': 'warn',
     '@atlaskit/design-system/use-drawer-label': 'warn',
+    '@atlaskit/design-system/use-field-message-wrapper': 'warn',
     '@atlaskit/design-system/use-heading': 'warn',
     '@atlaskit/design-system/use-heading-level-in-spotlight-card': 'warn',
     '@atlaskit/design-system/use-href-in-link-item': 'warn',

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::e632a96e9bae920c23e25114f40e3c0d>>
+ * @codegen <<SignedSource::b3ddf9ee0a27aaf8a318a6579d48ce99>>
  * @codegenCommand yarn workspace @atlaskit/eslint-plugin-design-system codegen
  */
 
@@ -61,10 +61,12 @@ var rules = {
     '@atlaskit/design-system/no-utility-icons': 'warn',
     '@atlaskit/design-system/prefer-primitives': 'warn',
     '@atlaskit/design-system/use-button-group-label': 'warn',
+    '@atlaskit/design-system/use-character-counter-field': 'warn',
     '@atlaskit/design-system/use-correct-field': 'warn',
     '@atlaskit/design-system/use-cx-function-in-xcss': 'error',
     '@atlaskit/design-system/use-datetime-picker-calendar-button': 'warn',
     '@atlaskit/design-system/use-drawer-label': 'warn',
+    '@atlaskit/design-system/use-field-message-wrapper': 'warn',
     '@atlaskit/design-system/use-heading': 'warn',
     '@atlaskit/design-system/use-heading-level-in-spotlight-card': 'warn',
     '@atlaskit/design-system/use-href-in-link-item': 'warn',

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::e2157edd1fabfe25390d7c22a0b63f86>>
+ * @codegen <<SignedSource::ba71ef89188bdc20d0ec948cc00f6436>>
  * @codegenCommand yarn workspace @atlaskit/eslint-plugin-design-system codegen
  */
 
@@ -45,10 +45,12 @@ var rules = {
     '@atlaskit/design-system/no-unused-css-map': 'warn',
     '@atlaskit/design-system/no-utility-icons': 'warn',
     '@atlaskit/design-system/use-button-group-label': 'warn',
+    '@atlaskit/design-system/use-character-counter-field': 'warn',
     '@atlaskit/design-system/use-correct-field': 'warn',
     '@atlaskit/design-system/use-cx-function-in-xcss': 'error',
     '@atlaskit/design-system/use-datetime-picker-calendar-button': 'warn',
     '@atlaskit/design-system/use-drawer-label': 'warn',
+    '@atlaskit/design-system/use-field-message-wrapper': 'warn',
     '@atlaskit/design-system/use-heading': 'warn',
     '@atlaskit/design-system/use-heading-level-in-spotlight-card': 'warn',
     '@atlaskit/design-system/use-href-in-link-item': 'warn',

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::b3fadf2e122fc30002c54a922fc55a1f>>
+ * @codegen <<SignedSource::5c119e0ab08e1f39d471b2b827bbb4de>>
  * @codegenCommand yarn workspace @atlaskit/eslint-plugin-design-system codegen
  */
 
@@ -44,10 +44,12 @@ var rules = {
     '@atlaskit/design-system/no-unused-css-map': 'warn',
     '@atlaskit/design-system/no-utility-icons': 'warn',
     '@atlaskit/design-system/use-button-group-label': 'warn',
+    '@atlaskit/design-system/use-character-counter-field': 'warn',
     '@atlaskit/design-system/use-correct-field': 'warn',
     '@atlaskit/design-system/use-cx-function-in-xcss': 'error',
     '@atlaskit/design-system/use-datetime-picker-calendar-button': 'warn',
     '@atlaskit/design-system/use-drawer-label': 'warn',
+    '@atlaskit/design-system/use-field-message-wrapper': 'warn',
     '@atlaskit/design-system/use-heading': 'warn',
     '@atlaskit/design-system/use-heading-level-in-spotlight-card': 'warn',
     '@atlaskit/design-system/use-href-in-link-item': 'warn',

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

@@ -54,10 +54,12 @@ var _noUnusedCssMap = _interopRequireDefault(require("./no-unused-css-map"));
 var _noUtilityIcons = _interopRequireDefault(require("./no-utility-icons"));
 var _preferPrimitives = _interopRequireDefault(require("./prefer-primitives"));
 var _useButtonGroupLabel = _interopRequireDefault(require("./use-button-group-label"));
+var _useCharacterCounterField = _interopRequireDefault(require("./use-character-counter-field"));
 var _useCorrectField = _interopRequireDefault(require("./use-correct-field"));
 var _useCxFunctionInXcss = _interopRequireDefault(require("./use-cx-function-in-xcss"));
 var _useDatetimePickerCalendarButton = _interopRequireDefault(require("./use-datetime-picker-calendar-button"));
 var _useDrawerLabel = _interopRequireDefault(require("./use-drawer-label"));
+var _useFieldMessageWrapper = _interopRequireDefault(require("./use-field-message-wrapper"));
 var _useHeading = _interopRequireDefault(require("./use-heading"));
 var _useHeadingLevelInSpotlightCard = _interopRequireDefault(require("./use-heading-level-in-spotlight-card"));
 var _useHrefInLinkItem = _interopRequireDefault(require("./use-href-in-link-item"));
@@ -78,7 +80,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::62347cf64e4ac99b927fce9d1a2bd894>>
+ * @codegen <<SignedSource::02be73e0813b6f22038f0f3f2ad6865d>>
  * @codegenCommand yarn workspace @atlaskit/eslint-plugin-design-system codegen
  */
 
@@ -132,10 +134,12 @@ var rules = exports.rules = {
   'no-utility-icons': _noUtilityIcons.default,
   'prefer-primitives': _preferPrimitives.default,
   'use-button-group-label': _useButtonGroupLabel.default,
+  'use-character-counter-field': _useCharacterCounterField.default,
   'use-correct-field': _useCorrectField.default,
   'use-cx-function-in-xcss': _useCxFunctionInXcss.default,
   'use-datetime-picker-calendar-button': _useDatetimePickerCalendarButton.default,
   'use-drawer-label': _useDrawerLabel.default,
+  'use-field-message-wrapper': _useFieldMessageWrapper.default,
   'use-heading': _useHeading.default,
   'use-heading-level-in-spotlight-card': _useHeadingLevelInSpotlightCard.default,
   'use-href-in-link-item': _useHrefInLinkItem.default,

package/dist/cjs/rules/use-character-counter-field/index.js

@@ -0,0 +1,139 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.ruleName = exports.message = exports.default = void 0;
+var _eslintCodemodUtils = require("eslint-codemod-utils");
+var _jsxElement = require("../../ast-nodes/jsx-element");
+var _createRule = require("../utils/create-rule");
+var TEXTFIELD_PACKAGE = '@atlaskit/textfield';
+var TEXTAREA_PACKAGE = '@atlaskit/textarea';
+var FORM_PACKAGE = '@atlaskit/form';
+var message = exports.message = 'When using `maxLength` or `minLength` props with Textfield/Textarea inside a Form, use `CharacterCounterField` from `@atlaskit/form` instead of Field and remove the props from the Textfield/Textarea. This ensures accessibility through real time feedback and aligns with the design system. Read more about [character counter fields](https://atlassian.design/components/form/examples#character-counter-field)';
+var ruleName = exports.ruleName = __dirname.split('/').slice(-1)[0];
+
+/**
+ * Check if a node is inside a Form component or Field component
+ */
+function isInsideFormOrField(node, formComponentNames) {
+  var current = node;
+
+  // Traverse up the AST to find parent JSX elements
+  while (current) {
+    var parent = current.parent;
+    if (!parent) {
+      break;
+    }
+
+    // Check if parent is a JSXElement with a name we're tracking
+    if ((0, _eslintCodemodUtils.isNodeOfType)(parent, 'JSXElement') && (0, _eslintCodemodUtils.isNodeOfType)(parent.openingElement.name, 'JSXIdentifier')) {
+      var parentName = parent.openingElement.name.name;
+
+      // Check if this is a Form component or Field component
+      if (formComponentNames.has(parentName)) {
+        return true;
+      }
+    }
+
+    // Check if parent is inside a JSXExpressionContainer (render prop pattern)
+    // This handles: <Field>{({ fieldProps }) => <Textfield {...fieldProps} />}</Field>
+    if ((0, _eslintCodemodUtils.isNodeOfType)(parent, 'JSXExpressionContainer')) {
+      // Continue traversing up to find the Field/Form
+      current = parent;
+      continue;
+    }
+
+    // Check if parent is an arrow function (render prop)
+    if ((0, _eslintCodemodUtils.isNodeOfType)(parent, 'ArrowFunctionExpression')) {
+      current = parent;
+      continue;
+    }
+    current = parent;
+  }
+  return false;
+}
+var rule = (0, _createRule.createLintRule)({
+  meta: {
+    name: ruleName,
+    type: 'suggestion',
+    docs: {
+      description: 'Suggests using CharacterCounterField when Textfield or Textarea components have maxLength or minLength props within a Form.',
+      recommended: true,
+      severity: 'warn'
+    },
+    messages: {
+      useCharacterCounterField: message
+    }
+  },
+  create: function create(context) {
+    // Track imported component names
+    var importedComponents = new Map();
+    var formComponentNames = new Set();
+    return {
+      ImportDeclaration: function ImportDeclaration(node) {
+        var source = node.source.value;
+        if (typeof source !== 'string') {
+          return;
+        }
+
+        // Track Form package imports (Form, Field, etc.)
+        if (source === FORM_PACKAGE) {
+          node.specifiers.forEach(function (spec) {
+            if ((0, _eslintCodemodUtils.isNodeOfType)(spec, 'ImportDefaultSpecifier')) {
+              // Default import: import Form from '@atlaskit/form'
+              formComponentNames.add(spec.local.name);
+            } else if ((0, _eslintCodemodUtils.isNodeOfType)(spec, 'ImportSpecifier')) {
+              // Named import: import { Form, Field } from '@atlaskit/form'
+              formComponentNames.add(spec.local.name);
+            }
+          });
+          return;
+        }
+
+        // Track Textfield and Textarea imports
+        if (source === TEXTFIELD_PACKAGE || source === TEXTAREA_PACKAGE) {
+          var defaultImport = node.specifiers.find(function (spec) {
+            return (0, _eslintCodemodUtils.isNodeOfType)(spec, 'ImportDefaultSpecifier');
+          });
+          if (defaultImport && (0, _eslintCodemodUtils.isNodeOfType)(defaultImport, 'ImportDefaultSpecifier')) {
+            var localName = defaultImport.local.name;
+            importedComponents.set(localName, {
+              localName: localName,
+              package: source
+            });
+          }
+        }
+      },
+      JSXElement: function JSXElement(node) {
+        if (!(0, _eslintCodemodUtils.isNodeOfType)(node, 'JSXElement')) {
+          return;
+        }
+        if (!(0, _eslintCodemodUtils.isNodeOfType)(node.openingElement.name, 'JSXIdentifier')) {
+          return;
+        }
+        var elementName = node.openingElement.name.name;
+
+        // Check if this element is one of our tracked components
+        var componentInfo = importedComponents.get(elementName);
+        if (!componentInfo) {
+          return;
+        }
+
+        // Check if the component has maxLength or minLength props
+        var hasMaxLength = _jsxElement.JSXElementHelper.getAttributeByName(node, 'maxLength');
+        var hasMinLength = _jsxElement.JSXElementHelper.getAttributeByName(node, 'minLength');
+        if (hasMaxLength || hasMinLength) {
+          // Only warn if inside a Form or Field component
+          if (isInsideFormOrField(node, formComponentNames)) {
+            context.report({
+              node: node,
+              messageId: 'useCharacterCounterField'
+            });
+          }
+        }
+      }
+    };
+  }
+});
+var _default = exports.default = rule;

package/dist/cjs/rules/use-field-message-wrapper/index.js

@@ -0,0 +1,125 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _eslintCodemodUtils = require("eslint-codemod-utils");
+var _createRule = require("../utils/create-rule");
+var FORM_PACKAGE = '@atlaskit/form';
+var MESSAGE_COMPONENTS = ['ErrorMessage', 'HelperMessage', 'ValidMessage'];
+var rule = (0, _createRule.createLintRule)({
+  meta: {
+    name: 'use-field-message-wrapper',
+    type: 'suggestion',
+    hasSuggestions: true,
+    docs: {
+      description: 'Encourage use of message wrapper component when using form message components.',
+      recommended: true,
+      severity: 'warn'
+    },
+    messages: {
+      useMessageWrapper: "All ADS form messaging components within a field should be wrapped by the `MessageWrapper` component from the form package. Consider also using the [simplified field implementation](https://atlassian.design/components/form/examples#simple-implementation-1) to handle styling and accessible messaging directly."
+    }
+  },
+  create: function create(context) {
+    var fieldImport;
+    var messageWrapperImport;
+    var messageImports = [];
+    return {
+      ImportDeclaration: function ImportDeclaration(node) {
+        var source = node.source.value;
+
+        // Ignore anomalies
+        if (typeof source !== 'string') {
+          return;
+        }
+        if (!node.specifiers.length) {
+          return;
+        }
+
+        // If it's not from our package, ignore.
+        if (source !== FORM_PACKAGE) {
+          return;
+        }
+        var namedImportSpecifiers = node.specifiers.filter(function (spec) {
+          return (0, _eslintCodemodUtils.isNodeOfType)(spec, 'ImportSpecifier');
+        });
+        namedImportSpecifiers.forEach(function (spec) {
+          if (spec.type === 'ImportSpecifier' && 'name' in spec.imported) {
+            var name = spec.imported.name;
+            var local = spec.local;
+            if (MESSAGE_COMPONENTS.includes(name)) {
+              messageImports.push(local);
+            } else if (name === 'Field') {
+              fieldImport = local;
+            } else if (name === 'MessageWrapper') {
+              messageWrapperImport = local;
+            }
+          }
+        });
+      },
+      JSXElement: function JSXElement(node) {
+        if (!(0, _eslintCodemodUtils.isNodeOfType)(node, 'JSXElement')) {
+          return;
+        }
+        if (!(0, _eslintCodemodUtils.isNodeOfType)(node.openingElement.name, 'JSXIdentifier')) {
+          return;
+        }
+        var name = node.openingElement.name.name;
+
+        // if it's not a message component, skip
+        if (messageImports.length === 0 || !messageImports.find(function (imp) {
+          return imp.name === name;
+        })) {
+          return;
+        }
+
+        // if no field import exists, skip. It needs to be within our field
+        if (!fieldImport) {
+          return;
+        }
+
+        // If no message wrapper import exists, then it's definitely an error
+        if (!messageWrapperImport) {
+          return context.report({
+            node: node,
+            messageId: 'useMessageWrapper'
+          });
+        }
+
+        // check for if field and message wrapper are parents
+        var _node = node;
+        var hasParentField = false;
+        var hasParentMessageWrapper = false;
+        while ((0, _eslintCodemodUtils.isNodeOfType)(_node, 'JSXElement') && (0, _eslintCodemodUtils.isNodeOfType)(_node.openingElement.name, 'JSXIdentifier') && !hasParentField) {
+          var _name = _node.openingElement.name.name;
+          hasParentField = hasParentField || _name === fieldImport.name;
+          hasParentMessageWrapper = hasParentMessageWrapper || _name === messageWrapperImport.name;
+          _node = _node.parent;
+          // Skip up until a JSXElement is reached
+          if ((0, _eslintCodemodUtils.isNodeOfType)(_node, 'JSXFragment') || (0, _eslintCodemodUtils.isNodeOfType)(_node, 'ArrowFunctionExpression') || (0, _eslintCodemodUtils.isNodeOfType)(_node, 'JSXExpressionContainer')) {
+            while (_node && !(0, _eslintCodemodUtils.isNodeOfType)(_node, 'JSXElement') && !(0, _eslintCodemodUtils.isNodeOfType)(_node, 'Program')) {
+              _node = _node.parent;
+            }
+          }
+        }
+
+        // if not field, skip because this doesn't matter
+        if (!hasParentField) {
+          return;
+        }
+
+        // if it has a message wrapper, skip
+        if (hasParentMessageWrapper) {
+          return;
+        }
+        context.report({
+          node: node,
+          messageId: 'useMessageWrapper'
+        });
+      }
+    };
+  }
+});
+var _default = exports.default = rule;

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::d7a0407a6c6b10bfbba790523d06f97d>>
+ * @codegen <<SignedSource::131350ebc877f42247042c6e7327fe18>>
  * @codegenCommand yarn workspace @atlaskit/eslint-plugin-design-system codegen
  */
 
@@ -56,10 +56,12 @@ const rules = {
     '@atlaskit/design-system/no-utility-icons': 'warn',
     '@atlaskit/design-system/prefer-primitives': 'warn',
     '@atlaskit/design-system/use-button-group-label': 'warn',
+    '@atlaskit/design-system/use-character-counter-field': 'warn',
     '@atlaskit/design-system/use-correct-field': 'warn',
     '@atlaskit/design-system/use-cx-function-in-xcss': 'error',
     '@atlaskit/design-system/use-datetime-picker-calendar-button': 'warn',
     '@atlaskit/design-system/use-drawer-label': 'warn',
+    '@atlaskit/design-system/use-field-message-wrapper': 'warn',
     '@atlaskit/design-system/use-heading': 'warn',
     '@atlaskit/design-system/use-heading-level-in-spotlight-card': 'warn',
     '@atlaskit/design-system/use-href-in-link-item': 'warn',

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::e632a96e9bae920c23e25114f40e3c0d>>
+ * @codegen <<SignedSource::b3ddf9ee0a27aaf8a318a6579d48ce99>>
  * @codegenCommand yarn workspace @atlaskit/eslint-plugin-design-system codegen
  */
 
@@ -55,10 +55,12 @@ const rules = {
     '@atlaskit/design-system/no-utility-icons': 'warn',
     '@atlaskit/design-system/prefer-primitives': 'warn',
     '@atlaskit/design-system/use-button-group-label': 'warn',
+    '@atlaskit/design-system/use-character-counter-field': 'warn',
     '@atlaskit/design-system/use-correct-field': 'warn',
     '@atlaskit/design-system/use-cx-function-in-xcss': 'error',
     '@atlaskit/design-system/use-datetime-picker-calendar-button': 'warn',
     '@atlaskit/design-system/use-drawer-label': 'warn',
+    '@atlaskit/design-system/use-field-message-wrapper': 'warn',
     '@atlaskit/design-system/use-heading': 'warn',
     '@atlaskit/design-system/use-heading-level-in-spotlight-card': 'warn',
     '@atlaskit/design-system/use-href-in-link-item': 'warn',

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::e2157edd1fabfe25390d7c22a0b63f86>>
+ * @codegen <<SignedSource::ba71ef89188bdc20d0ec948cc00f6436>>
  * @codegenCommand yarn workspace @atlaskit/eslint-plugin-design-system codegen
  */
 
@@ -39,10 +39,12 @@ const rules = {
     '@atlaskit/design-system/no-unused-css-map': 'warn',
     '@atlaskit/design-system/no-utility-icons': 'warn',
     '@atlaskit/design-system/use-button-group-label': 'warn',
+    '@atlaskit/design-system/use-character-counter-field': 'warn',
     '@atlaskit/design-system/use-correct-field': 'warn',
     '@atlaskit/design-system/use-cx-function-in-xcss': 'error',
     '@atlaskit/design-system/use-datetime-picker-calendar-button': 'warn',
     '@atlaskit/design-system/use-drawer-label': 'warn',
+    '@atlaskit/design-system/use-field-message-wrapper': 'warn',
     '@atlaskit/design-system/use-heading': 'warn',
     '@atlaskit/design-system/use-heading-level-in-spotlight-card': 'warn',
     '@atlaskit/design-system/use-href-in-link-item': 'warn',

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::b3fadf2e122fc30002c54a922fc55a1f>>
+ * @codegen <<SignedSource::5c119e0ab08e1f39d471b2b827bbb4de>>
  * @codegenCommand yarn workspace @atlaskit/eslint-plugin-design-system codegen
  */
 
@@ -38,10 +38,12 @@ const rules = {
     '@atlaskit/design-system/no-unused-css-map': 'warn',
     '@atlaskit/design-system/no-utility-icons': 'warn',
     '@atlaskit/design-system/use-button-group-label': 'warn',
+    '@atlaskit/design-system/use-character-counter-field': 'warn',
     '@atlaskit/design-system/use-correct-field': 'warn',
     '@atlaskit/design-system/use-cx-function-in-xcss': 'error',
     '@atlaskit/design-system/use-datetime-picker-calendar-button': 'warn',
     '@atlaskit/design-system/use-drawer-label': 'warn',
+    '@atlaskit/design-system/use-field-message-wrapper': 'warn',
     '@atlaskit/design-system/use-heading': 'warn',
     '@atlaskit/design-system/use-heading-level-in-spotlight-card': 'warn',
     '@atlaskit/design-system/use-href-in-link-item': 'warn',

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::62347cf64e4ac99b927fce9d1a2bd894>>
+ * @codegen <<SignedSource::02be73e0813b6f22038f0f3f2ad6865d>>
  * @codegenCommand yarn workspace @atlaskit/eslint-plugin-design-system codegen
  */
 
@@ -53,10 +53,12 @@ import noUnusedCssMap from './no-unused-css-map';
 import noUtilityIcons from './no-utility-icons';
 import preferPrimitives from './prefer-primitives';
 import useButtonGroupLabel from './use-button-group-label';
+import useCharacterCounterField from './use-character-counter-field';
 import useCorrectField from './use-correct-field';
 import useCxFunctionInXcss from './use-cx-function-in-xcss';
 import useDatetimePickerCalendarButton from './use-datetime-picker-calendar-button';
 import useDrawerLabel from './use-drawer-label';
+import useFieldMessageWrapper from './use-field-message-wrapper';
 import useHeading from './use-heading';
 import useHeadingLevelInSpotlightCard from './use-heading-level-in-spotlight-card';
 import useHrefInLinkItem from './use-href-in-link-item';
@@ -125,10 +127,12 @@ export const rules = {
   'no-utility-icons': noUtilityIcons,
   'prefer-primitives': preferPrimitives,
   'use-button-group-label': useButtonGroupLabel,
+  'use-character-counter-field': useCharacterCounterField,
   'use-correct-field': useCorrectField,
   'use-cx-function-in-xcss': useCxFunctionInXcss,
   'use-datetime-picker-calendar-button': useDatetimePickerCalendarButton,
   'use-drawer-label': useDrawerLabel,
+  'use-field-message-wrapper': useFieldMessageWrapper,
   'use-heading': useHeading,
   'use-heading-level-in-spotlight-card': useHeadingLevelInSpotlightCard,
   'use-href-in-link-item': useHrefInLinkItem,