eslint-plugin-smarthr 1.4.2 → 1.5.1

package/rules/a11y-input-has-name-attribute/index.js

@@ -2,8 +2,6 @@ const fs = require('fs')
 
 const JSON5 = require('json5')
 
-const { generateTagFormatter } = require('../../libs/format_styled_components')
-
 const OPTION = (() => {
   const file = `${process.cwd()}/package.json`
 
@@ -19,20 +17,7 @@ const OPTION = (() => {
   }
 })()
 
-const EXPECTED_NAMES = {
-  '(i|I)nput$': 'Input$',
-  '(t|T)extarea$': 'Textarea$',
-  '(s|S)elect$': 'Select$',
-  'InputFile$': 'InputFile$',
-  'RadioButton$': 'RadioButton$',
-  'RadioButtonPanel$': 'RadioButtonPanel$',
-  'Check(b|B)ox$': 'Checkbox$',
-  'Combo(b|B)ox$': 'Combobox$',
-  '(Date|Wareki)Picker$': '(Date|Wareki)Picker$',
-  TimePicker$: 'TimePicker$',
-  DropZone$: 'DropZone$',
-}
-const TARGET_TAG_NAME_REGEX = new RegExp(`(${Object.keys(EXPECTED_NAMES).join('|')})`)
+const TARGET_TAG_NAME_REGEX = /((I|^i)nput|(T|^t)extarea|(S|^s)elect|InputFile|RadioButton(Panel)?|(Check|Combo)(B|b)ox|(Date|Wareki|Time)Picker|DropZone)$/
 const INPUT_NAME_REGEX = /^[a-zA-Z0-9_\[\]]+$/
 const INPUT_TAG_REGEX = /(i|I)nput$/
 const RADIO_BUTTON_REGEX = /RadioButton(Panel)?$/
@@ -69,12 +54,11 @@ module.exports = {
     const checkType = option.checkType || 'always'
 
     return {
-      ...generateTagFormatter({ context, EXPECTED_NAMES }),
       JSXOpeningElement: (node) => {
         const { name, attributes } = node
         const nodeName = name.name || ''
 
-        if (nodeName.match(TARGET_TAG_NAME_REGEX)) {
+        if (TARGET_TAG_NAME_REGEX.test(nodeName)) {
           let nameAttr = null
           let hasSpreadAttr = false
           let hasReactHookFormRegisterSpreadAttr = false
@@ -103,27 +87,25 @@ module.exports = {
             }
           })
 
-          if (!nameAttr) {
-            if (
-              !(OPTION.react_hook_form && hasReactHookFormRegisterSpreadAttr) &&
-              (attributes.length === 0 || checkType !== 'allow-spread-attributes' || !hasSpreadAttr)
-            ) {
-              const isRadio = nodeName.match(RADIO_BUTTON_REGEX) || (nodeName.match(INPUT_TAG_REGEX) && hasRadioInput)
-
-              context.report({
-                node,
-                message: `${nodeName} ${isRadio ? MESSAGE_UNDEFINED_FOR_RADIO : MESSAGE_UNDEFINED_FOR_NOT_RADIO}`,
-              })
-            }
-          } else {
-            const nameValue = nameAttr.value?.value || ''
+          if (nameAttr) {
+            const nameValue = nameAttr.value?.value
 
-            if (nameValue && !nameValue.match(INPUT_NAME_REGEX)) {
+            if (nameValue && !INPUT_NAME_REGEX.test(nameValue)) {
               context.report({
                 node,
                 message: `${nodeName} のname属性の値(${nameValue})${MESSAGE_NAME_FORMAT_SUFFIX}`,
               })
             }
+          } else if (
+            !(OPTION.react_hook_form && hasReactHookFormRegisterSpreadAttr) &&
+            (attributes.length === 0 || checkType !== 'allow-spread-attributes' || !hasSpreadAttr)
+          ) {
+            const isRadio = RADIO_BUTTON_REGEX.test(nodeName) || INPUT_TAG_REGEX.test(nodeName) && hasRadioInput
+
+            context.report({
+              node,
+              message: `${nodeName} ${isRadio ? MESSAGE_UNDEFINED_FOR_RADIO : MESSAGE_UNDEFINED_FOR_NOT_RADIO}`,
+            })
           }
         }
       },

package/rules/a11y-input-in-form-control/index.js

@@ -1,57 +1,12 @@
-const { generateTagFormatter } = require('../../libs/format_styled_components')
-
-const EXPECTED_LABELED_INPUT_NAMES = {
-  'RadioButton$': '(RadioButton)$',
-  'RadioButtons$': '(RadioButtons)$',
-  'RadioButtonPanel$': '(RadioButtonPanel)$',
-  'RadioButtonPanels$': '(RadioButtonPanels)$',
-  'Check(b|B)ox$': '(Checkbox)$',
-  'Check(b|B)ox(e)?s$': '(Checkboxes)$',
-}
-const EXPECTED_INPUT_NAMES = {
-  '(I|^i)nput$': '(Input)$',
-  'SearchInput$': '(SearchInput)$',
-  '(T|^t)extarea$': '(Textarea)$',
-  '(S|^s)elect$': '(Select)$',
-  'InputFile$': '(InputFile)$',
-  'Combo(b|B)ox$': '(Combobox)$',
-  '(Date|Wareki)Picker$': '((Date|Wareki)Picker)$',
-  'TimePicker$': '(TimePicker)$',
-  ...EXPECTED_LABELED_INPUT_NAMES,
-}
-
-const EXPECTED_FORM_CONTROL_NAMES = {
-  '(FormGroup)$': '(FormGroup)$',
-  '(FormControl)$': '(FormControl)$',
-  '((F|^f)ieldset)$': '(Fieldset)$',
-}
-
-const EXPECTED_NAMES = {
-  ...EXPECTED_INPUT_NAMES,
-  ...EXPECTED_FORM_CONTROL_NAMES,
-  '(A|^a)rticle$': '(Article)$',
-  '(A|^a)side$': '(Aside)$',
-  '(N|^n)av$': '(Nav)$',
-  '(S|^s)ection$': '(Section)$',
-  'Cluster$': '(Cluster)$',
-  'Center$': '(Center)$',
-  'Reel$': '(Reel)$',
-  'Sidebar$': '(Sidebar)$',
-  'Stack$': '(Stack)$',
-  '(L|^l)abel$': '(Label)$',
-
-}
-
-const UNEXPECTED_NAMES = EXPECTED_NAMES
-
-const FORM_CONTROL_INPUTS_REGEX = new RegExp(`(${Object.keys(EXPECTED_INPUT_NAMES).join('|')})`)
-const LABELED_INPUTS_REGEX = new RegExp(`(${Object.keys(EXPECTED_LABELED_INPUT_NAMES).join('|')})`)
+const LABELED_INPUTS_REGEX_STR = 'RadioButton(Panel)?(s)?|Check(B|b)ox(es|s)?'
+const LABELED_INPUTS_REGEX = new RegExp(`(${LABELED_INPUTS_REGEX_STR})$`)
+const FORM_CONTROL_INPUTS_REGEX = new RegExp(`(${LABELED_INPUTS_REGEX_STR}|(Search)?(I|^i)nput(File)?|(T|^t)extarea|(S|^s)elect|Combo(B|b)ox|(Date|Wareki|Time)Picker)$`)
 const SEARCH_INPUT_REGEX = /SearchInput$/
 const INPUT_REGEX = /(i|I)nput$/
 const RADIO_BUTTONS_REGEX = /RadioButton(Panel)?(s)?$/
 const CHECKBOX_REGEX = /Check(B|b)ox(s|es)?$/
 const SELECT_REGEX = /(S|s)elect(s)?$/
-const FROM_CONTROLS_REGEX = new RegExp(`(${Object.keys(EXPECTED_FORM_CONTROL_NAMES).join('|')})`)
+const FROM_CONTROLS_REGEX = /(Form(Control|Group)|(F|^f)ieldset)$/
 const FORM_CONTROL_REGEX = /(Form(Control|Group))$/
 const FIELDSET_REGEX = /Fieldset$/
 const DIALOG_REGEX = /Dialog(WithTrigger)?$/
@@ -60,11 +15,12 @@ const BARE_SECTIONING_TAG_REGEX = /^(article|aside|nav|section)$/
 const LAYOUT_COMPONENT_REGEX = /((C(ent|lust)er)|Reel|Sidebar|Stack)$/
 const AS_REGEX = /^(as|forwardedAs)$/
 const SUFFIX_S_REGEX = /s$/
+const az_REGEX = /[a-z]/
 
 const IGNORE_INPUT_CHECK_PARENT_TYPE = /^(Program|ExportNamedDeclaration)$/
 
 const findRoleGroup = (a) => a.name?.name === 'role' && a.value.value === 'group'
-const findAsSectioning = (a) => a.name?.name.match(AS_REGEX) && a.value.value.match(BARE_SECTIONING_TAG_REGEX)
+const findAsSectioning = (a) => AS_REGEX.test(a.name?.name) && BARE_SECTIONING_TAG_REGEX.test(a.value.value)
 const findTitle = (i) => i.key.name === 'title'
 
 const SCHEMA = [
@@ -91,18 +47,17 @@ module.exports = {
     const additionalInputComponents = option.additionalInputComponents?.length > 0 ? new RegExp(`(${option.additionalInputComponents.join('|')})`) : null
     const additionalMultiInputComponents = option.additionalMultiInputComponents?.length > 0 ? new RegExp(`(${option.additionalMultiInputComponents.join('|')})`) : null
 
-    const checkAdditionalInputComponents = (name) => additionalInputComponents && name.match(additionalInputComponents)
-    const checkAdditionalMultiInputComponents = (name) => additionalMultiInputComponents && name.match(additionalMultiInputComponents)
+    const checkAdditionalInputComponents = (name) => additionalInputComponents && additionalInputComponents.test(name)
+    const checkAdditionalMultiInputComponents = (name) => additionalMultiInputComponents && additionalMultiInputComponents.test(name)
 
     let formControls = []
     let conditionalformControls = []
     let checkboxFormControls = []
 
     return {
-      ...generateTagFormatter({ context, EXPECTED_NAMES, UNEXPECTED_NAMES }),
       JSXOpeningElement: (node) => {
         const nodeName = node.name.name || '';
-        const isFormControlInput = nodeName.match(FORM_CONTROL_INPUTS_REGEX)
+        const isFormControlInput = FORM_CONTROL_INPUTS_REGEX.test(nodeName)
         const isAdditionalMultiInput = checkAdditionalMultiInputComponents(nodeName)
         let conditionalExpressions = []
 
@@ -110,11 +65,11 @@ module.exports = {
           let isInMap = false
 
           // HINT: 検索ボックスの場合、UIの関係上labelを設定出来ないことが多い & smarthr-ui/SearchInputはa11y対策してあるため無視
-          if (nodeName.match(SEARCH_INPUT_REGEX)) {
+          if (SEARCH_INPUT_REGEX.test(nodeName)) {
             return
           }
 
-          const isPureInput = nodeName.match(INPUT_REGEX)
+          const isPureInput = INPUT_REGEX.test(nodeName)
           let isPseudoLabel = false
           let isTypeRadio = false
           let isTypeCheck = false
@@ -154,9 +109,9 @@ module.exports = {
             }
           }
 
-          const isPreMultiple = isAdditionalMultiInput || isFormControlInput && nodeName.match(SUFFIX_S_REGEX)
-          const isRadio = (isPureInput && isTypeRadio) || nodeName.match(RADIO_BUTTONS_REGEX);
-          const isCheckbox = !isRadio && (isPureInput && isTypeCheck || nodeName.match(CHECKBOX_REGEX));
+          const isPreMultiple = isAdditionalMultiInput || isFormControlInput && SUFFIX_S_REGEX.test(nodeName)
+          const isRadio = (isPureInput && isTypeRadio) || RADIO_BUTTONS_REGEX.test(nodeName)
+          const isCheckbox = !isRadio && (isPureInput && isTypeCheck || CHECKBOX_REGEX.test(nodeName))
 
           const wrapComponentName = isRadio ? 'Fieldset' : 'FormControl'
           const search = (n) => {
@@ -166,7 +121,7 @@ module.exports = {
                 const name = openingElement.name.name
 
                 if (name) {
-                  if (name.match(FROM_CONTROLS_REGEX)) {
+                  if (FROM_CONTROLS_REGEX.test(name)) {
                     const hit = formControls.includes(n)
                     let conditionalHit = false
 
@@ -240,7 +195,7 @@ module.exports = {
                       // HINT: 擬似的にラベルが設定されている場合、無視する
                       if (!isCheckbox && !isPseudoLabel) {
                         const actualName = isSection ? name : `<${name} ${layoutSectionAttribute.name.name}="${layoutSectionAttribute.value.value}">`
-                        const isSelect = !isRadio && nodeName.match(SELECT_REGEX)
+                        const isSelect = !isRadio && SELECT_REGEX.test(nodeName)
 
                         context.report({
                           node,
@@ -266,11 +221,11 @@ module.exports = {
                 break
               }
               case 'VariableDeclarator': {
-                if (n.parent.parent?.type && n.parent.parent.type.match(IGNORE_INPUT_CHECK_PARENT_TYPE)) {
+                if (n.parent.parent?.type && IGNORE_INPUT_CHECK_PARENT_TYPE.test(n.parent.parent.type)) {
                   const name = n.id.name
 
                   // 入力要素系コンポーネントの拡張なので対象外
-                  if (name.match(FORM_CONTROL_INPUTS_REGEX) || checkAdditionalMultiInputComponents(name) || checkAdditionalInputComponents(name)) {
+                  if (FORM_CONTROL_INPUTS_REGEX.test(name) || checkAdditionalMultiInputComponents(name) || checkAdditionalInputComponents(name)) {
                     return
                   }
                 }
@@ -278,11 +233,11 @@ module.exports = {
                 break
               }
               case 'FunctionDeclaration': {
-                if (n.parent.type.match(IGNORE_INPUT_CHECK_PARENT_TYPE)) {
+                if (IGNORE_INPUT_CHECK_PARENT_TYPE.test(n.parent.type)) {
                   const name = n.id.name
 
                   // 入力要素系コンポーネントの拡張なので対象外
-                  if (name.match(FORM_CONTROL_INPUTS_REGEX) || checkAdditionalMultiInputComponents(name) || checkAdditionalInputComponents(name)) {
+                  if (FORM_CONTROL_INPUTS_REGEX.test(name) || checkAdditionalMultiInputComponents(name) || checkAdditionalInputComponents(name)) {
                     return
                   }
                 }
@@ -291,7 +246,7 @@ module.exports = {
                 // HINT: smarthr-ui/Checkboxはlabelを単独で持つため、FormControl系でラップをする必要はない
                 // HINT: 擬似的にラベルが設定されている場合、無視する
                 if (!isCheckbox && !isPseudoLabel) {
-                  const isSelect = !isRadio && nodeName.match(SELECT_REGEX)
+                  const isSelect = !isRadio && SELECT_REGEX.test(nodeName)
 
                   context.report({
                     node,
@@ -328,7 +283,7 @@ module.exports = {
 
           if (!nodeName.match(FORM_CONTROL_REGEX) && isRoleGrouop) {
             const component = formControlMatcher[1]
-            const actualComponent = component[0].match(/[a-z]/) ? component : `smarthr-ui/${component}`
+            const actualComponent = az_REGEX.test(component[0]) ? component : `smarthr-ui/${component}`
 
             const message = `${nodeName}に 'role="group" が設定されています。${actualComponent} をつかってマークアップする場合、'role="group"' は不要です
  - ${nodeName} が ${actualComponent}、もしくはそれを拡張しているコンポーネントではない場合、名称を ${FROM_CONTROLS_REGEX} にマッチしないものに変更してください`
@@ -346,7 +301,7 @@ module.exports = {
                 const name = n.openingElement.name.name || ''
 
                 // Fieldset > Dialog > Fieldset のようにDialogを挟んだFormControl系のネストは許容する(Portalで実際にはネストしていないため)
-                if (name.match(DIALOG_REGEX)) {
+                if (DIALOG_REGEX.test(name)) {
                   return
                 }
 
@@ -354,7 +309,7 @@ module.exports = {
                 if (matcher) {
                   // FormControl > FormControl や FormControl > Fieldset のように複数のFormControl系コンポーネントがネストしてしまっているためエラーにする
                   // Fieldset > Fieldset や Fieldset > FormControl のようにFieldsetが親の場合は許容する
-                  if (name.match(FORM_CONTROL_REGEX)) {
+                  if (FORM_CONTROL_REGEX.test(name)) {
                     context.report({
                       node: n,
                       message: `${name} が、${nodeName} を子要素として持っており、マークアップとして正しくない状態になっています。以下のいずれかの方法で修正を試みてください。
@@ -379,7 +334,7 @@ module.exports = {
 
           searchParent(node.parent.parent)
 
-          if (!node.selfClosing && nodeName.match(FORM_CONTROL_REGEX) && isRoleGrouop) {
+          if (!node.selfClosing && isRoleGrouop && FORM_CONTROL_REGEX.test(nodeName)) {
             const searchChildren = (n, count = 0) => {
               switch (n.type) {
                 case 'BinaryExpression':
@@ -432,12 +387,11 @@ module.exports = {
                 case 'JSXElement': {
                   const name = n.openingElement.name.name || ''
 
-                  if (name.match(FIELDSET_REGEX) || checkAdditionalMultiInputComponents(name)) {
+                  if (FIELDSET_REGEX.test(name) || checkAdditionalMultiInputComponents(name)) {
                     // 複数inputが存在する可能性のあるコンポーネントなので無限カウントとする
                     return Infinity
                   }
 
-
                   let nextCount = forInSearchChildren(n.openingElement.attributes, count)
 
                   if (nextCount > 1) {
@@ -445,8 +399,8 @@ module.exports = {
                   }
 
                   if (
-                    name.match(FORM_CONTROL_INPUTS_REGEX) ||
-                    name.match(FORM_CONTROL_REGEX) ||
+                    FORM_CONTROL_INPUTS_REGEX.test(name) ||
+                    FORM_CONTROL_REGEX.test(name) ||
                     checkAdditionalInputComponents(name)
                   ) {
                     nextCount = nextCount + 1

package/rules/a11y-numbered-text-within-ol/index.js

@@ -1,11 +1,3 @@
-const { generateTagFormatter } = require('../../libs/format_styled_components')
-
-const EXPECTED_NAMES = {
-  '(Ordered(.*)List|^ol)$': '(Ordered(.*)List)$',
-  '(S|s)elect$': '(Select)$',
-}
-const UNEXPECTED_NAMES = EXPECTED_NAMES
-
 const NUMBERED_TEXT_REGEX = /^[\s\n]*(([0-9])([^0-9]{2})[^\s\n]*)/
 const ORDERED_LIST_REGEX = /(Ordered(.*)List|^ol)$/
 const SELECT_REGEX = /(S|s)elect$/
@@ -18,12 +10,12 @@ const searchOrderedList = (node) => {
   if (node.type === 'JSXElement' && node.openingElement.name?.name) {
     const name = node.openingElement.name.name
 
-    if (name.match(SELECT_REGEX)) {
+    if (SELECT_REGEX.test(name)) {
       // HINT: select要素の場合、optionのラベルに連番がついている場合がありえるのでignoreする
       // 通常と処理を分けるためnullではなく0を返す
       return 0
     } else if (
-      name.match(ORDERED_LIST_REGEX) ||
+      ORDERED_LIST_REGEX.test(name) ||
       node.openingElement.attributes.find(findAsOlAttr)
     ) {
       return node.openingElement
@@ -129,7 +121,6 @@ module.exports = {
     }
 
     return {
-      ...generateTagFormatter({ context, EXPECTED_NAMES, UNEXPECTED_NAMES }),
       JSXAttribute: (node) => {
         if (node.value?.value && !IGNORE_ATTRIBUTE_VALUE_REGEX.test(node.value.value)) {
           checker(node, node.value.value.match(NUMBERED_TEXT_REGEX))

package/rules/a11y-prohibit-input-maxlength-attribute/index.js

@@ -1,16 +1,9 @@
-const { generateTagFormatter } = require('../../libs/format_styled_components')
-
-const EXPECTED_NAMES = {
-  '(Input|^input)$': '(Input)$',
-  '(Textarea|^textarea)$': '(Textarea)$',
-}
-
-const UNEXPECTED_NAMES = EXPECTED_NAMES
-
-const INPUT_COMPONENT_NAMES = new RegExp(`(${Object.keys(EXPECTED_NAMES).join('|')})`)
+const INPUT_COMPONENT_NAMES = /((I|^i)nput|(T|^t)extarea)$/
 
 const SCHEMA = []
 
+const checkHasMaxLength = (attr) => attr.name?.name === 'maxLength'
+
 /**
  * @type {import('@typescript-eslint/utils').TSESLint.RuleModule<''>}
  */
@@ -21,21 +14,16 @@ module.exports = {
   },
   create(context) {
     return {
-      ...generateTagFormatter({ context, EXPECTED_NAMES, UNEXPECTED_NAMES }),
       JSXOpeningElement: (node) => {
-        if (node.name.type === 'JSXIdentifier' && INPUT_COMPONENT_NAMES.test(node.name.name)) {
-          const checkHasMaxLength = (attr) => attr.name?.name === 'maxLength'
-          const maxLengthAttr = node.attributes.find(checkHasMaxLength)
-          if (maxLengthAttr) {
-            context.report({
-              node,
-              message: `${node.name.name}にmaxLength属性を設定しないでください。
+        if (node.name.type === 'JSXIdentifier' && INPUT_COMPONENT_NAMES.test(node.name.name) && node.attributes.find(checkHasMaxLength)) {
+          context.report({
+            node,
+            message: `${node.name.name}にmaxLength属性を設定しないでください。
 - maxLength属性がついた要素に、テキストをペーストすると、maxLength属性の値を超えた範囲が意図せず切り捨てられてしまう場合があります
 - 以下のいずれかの方法で修正をおこなってください
   - 方法1: pattern属性とtitle属性を組み合わせ、form要素でラップする
   - 方法2: JavaScriptを用いたバリデーションを実装する`,
-            })
-          }
+          })
         }
       },
     }

package/rules/a11y-prohibit-input-placeholder/index.js

@@ -1,17 +1,6 @@
-const { generateTagFormatter } = require('../../libs/format_styled_components')
-
-const EXPECTED_NAMES = {
-  '(i|I)nput$': 'Input$',
-  'SearchInput$': 'SearchInput$',
-  '(t|T)extarea$': 'Textarea$',
-  'FieldSet$': 'FieldSet$',
-  'Combo(b|B)ox$': 'Combobox$',
-  '(Date|Wareki)Picker$': '(Date|Wareki)Picker$',
-  'TimePicker$': 'TimePicker$',
-}
-const INPUT_TAG_REGEX = /((i|I)nput|(t|T)extarea|FieldSet|Combo(b|B)ox|(Date|Wareki|Time)Picker)$/
+const INPUT_TAG_REGEX = /((I|^i)nput|(T|^t)extarea|FieldSet|Combo(B|b)ox|(Date|Wareki|Time)Picker)$/
 const SEARCH_INPUT_REGEX = /SearchInput$/
-const COMBOBOX_REGEX = /Combo(b|B)ox$/
+const COMBOBOX_REGEX = /Combo(B|b)ox$/
 
 /**
  * @type {import('@typescript-eslint/utils').TSESLint.RuleModule<''>}
@@ -23,7 +12,6 @@ module.exports = {
   },
   create(context) {
     return {
-      ...generateTagFormatter({ context, EXPECTED_NAMES }),
       JSXOpeningElement: (node) => {
         const name = node.name.name
 

package/rules/a11y-prohibit-sectioning-content-in-form/index.js

@@ -1,37 +1,4 @@
 const { rootPath } = require('../../libs/common')
-const { generateTagFormatter } = require('../../libs/format_styled_components')
-
-const SECTIONING_CONTENT_EXPECTED_NAMES = {
-  '(A|^a)rticle$': '(Article)$',
-  '(A|^a)side$': '(Aside)$',
-  '(N|^n)av$': '(Nav)$',
-  '(S|^s)ection$': '(Section)$',
-}
-const FIELDSET_EXPECTED_NAMES = {
-  '(FormControl)$': '(FormControl)$',
-  '(FormControls)$': '(FormControls)$',
-  '((F|^f)ieldset)$': '(Fieldset)$',
-  '(Fieldsets)$': '(Fieldsets)$',
-}
-const FORM_EXPECTED_NAMES = {
-  '((F|^f)orm)$': '(Form)$',
-  '(FormDialog)$': '(FormDialog)$',
-  'RemoteTrigger(.*)FormDialog$': '(RemoteTrigger(.*)FormDialog)$',
-}
-
-const WRAPPER_EXPECTED_NAMES = {
-  ...FIELDSET_EXPECTED_NAMES,
-  ...FORM_EXPECTED_NAMES,
-}
-
-const EXPECTED_NAMES = {
-  ...SECTIONING_CONTENT_EXPECTED_NAMES,
-  ...WRAPPER_EXPECTED_NAMES,
-  'SideNav$': '(SideNav)$',
-  'IndexNav$': '(IndexNav)$',
-}
-
-const UNEXPECTED_NAMES = EXPECTED_NAMES
 
 const asRegex = /^(as|forwardedAs)$/
 const asFormRegex = /^(form|fieldset)$/
@@ -41,9 +8,11 @@ const includeAsAttrFormOrFieldset = (a) => a.name?.name.match(asRegex) && asForm
 const includeAsAttrSectioningContent = (a) => a.name?.name.match(asRegex) && asSectioningContentRegex.test(a.value.value)
 const includeWrapper =  (fn) => wrapperRegex.test(fn)
 
-const sectioningContentRegex = new RegExp(`(${Object.keys(SECTIONING_CONTENT_EXPECTED_NAMES).join('|')})`)
-const wrapperRegex = new RegExp(`(${Object.keys(WRAPPER_EXPECTED_NAMES).join('|')})`)
-const formControlRegex = new RegExp(`(${Object.keys(FIELDSET_EXPECTED_NAMES).join('|')})`)
+const sectioningContentRegex = /((A|^a)(rticle|side)|(N|^n)av|(S|^s)ection)$/
+
+const formControlRegexStr = '(FormControl|(F|^f)ieldset)(s)?'
+const formControlRegex = new RegExp(`${formControlRegexStr}$`)
+const wrapperRegex = new RegExp(`(${formControlRegexStr}|(F|^f)orm(Dialog)?)$`)
 const extRegex = /\.[a-z0-9]+?$/
 const ignoreNavRegex = /(Side|Index)Nav$/
 const formPartCheckParentTypeRegex = /^(Program|ExportNamedDeclaration)$/
@@ -146,7 +115,6 @@ module.exports = {
     const notified = []
 
     return {
-      ...generateTagFormatter({ context, EXPECTED_NAMES, UNEXPECTED_NAMES }),
       JSXOpeningElement: (node) => {
         const elementName = node.name.name
 

package/rules/a11y-prohibit-useless-sectioning-fragment/index.js

@@ -1,32 +1,15 @@
-const { generateTagFormatter } = require('../../libs/format_styled_components')
-
-const EXPECTED_NAMES = {
-  'Article$': '(Article)$',
-  'Aside$': '(Aside)$',
-  'Nav$': '(Nav)$',
-  'Section$': '(Section)$',
-  'Center$': '(Center)$',
-  'Reel$': '(Reel)$',
-  'Sidebar$': '(Sidebar)$',
-  'Stack$': '(Stack)$',
-  'Base$': '(Base)$',
-  'BaseColumn$': '(BaseColumn)$',
-}
-
-const UNEXPECTED_NAMES = EXPECTED_NAMES
-
 const BARE_SECTIONING_TAG_REGEX = /^(article|aside|nav|section)$/
 const SECTIONING_REGEX = /((A(rticle|side))|Nav|Section)$/
-const SECTIONING_FRAGMENT_REGEX = /^SectioningFragment$/
+const SECTIONING_FRAGMENT = 'SectioningFragment'
 const LAYOUT_REGEX = /((C(ent|lust)er)|Reel|Sidebar|Stack|Base(Column)?)$/
 const AS_REGEX = /^(as|forwardedAs)$/
 
-const includeSectioningAsAttr = (a) => a.name?.name?.match(AS_REGEX) && a.value.value?.match(BARE_SECTIONING_TAG_REGEX)
+const includeSectioningAsAttr = (a) => AS_REGEX.test(a.name?.name) && BARE_SECTIONING_TAG_REGEX.test(a.value.value)
 
 const searchSectioningFragment = (node) => {
   switch (node.type) {
     case 'JSXElement':
-      return node.openingElement.name?.name?.match(SECTIONING_FRAGMENT_REGEX) ? node.openingElement : null
+      return SECTIONING_FRAGMENT === node.openingElement.name?.name ? node.openingElement : null
     case 'Program':
       return null
   }
@@ -46,16 +29,15 @@ module.exports = {
   },
   create(context) {
     return {
-      ...generateTagFormatter({ context, EXPECTED_NAMES, UNEXPECTED_NAMES }),
       JSXOpeningElement: (node) => {
         const name = node.name?.name || ''
         let hit = null
         let asAttr = null
 
-        if (name.match(SECTIONING_REGEX)) {
+        if (SECTIONING_REGEX.test(name)) {
           hit = true
         } else {
-          asAttr = name.match(LAYOUT_REGEX) && node.attributes.find(includeSectioningAsAttr)
+          asAttr = LAYOUT_REGEX.test(name) && node.attributes.find(includeSectioningAsAttr)
 
           if (asAttr) {
             hit = true

package/rules/a11y-required-layout-as-attribute/index.js

@@ -1,27 +1,3 @@
-const { generateTagFormatter } = require('../../libs/format_styled_components')
-
-const LAYOUT_EXPECTED_NAMES = {
-  'Center$': '(Center)$',
-  'Cluster$': '(Cluster)$',
-  'Reel$': '(Reel)$',
-  'Sidebar$': '(Sidebar)$',
-  'Stack$': '(Stack)$',
-  'Base$': '(Base)$',
-  'BaseColumn$': '(BaseColumn)$',
-}
-const EXPECTED_NAMES = {
-  ...LAYOUT_EXPECTED_NAMES,
-  'PageHeading$': '(PageHeading)$',
-  'Heading$': '(Heading)$',
-  '^h1$': '(PageHeading)$',
-  '^h(|2|3|4|5|6)$': '(Heading)$',
-}
-
-const UNEXPECTED_NAMES = {
-  ...LAYOUT_EXPECTED_NAMES,
-  '(Heading|^h(1|2|3|4|5|6))$': '(Heading)$',
-}
-
 const layoutRegex = /((C(ent|lust)er)|Reel|Sidebar|Stack|Base(Column)?)$/
 const headingRegex = /((^h(1|2|3|4|5|6))|Heading)$/
 const asRegex = /^(as|forwardedAs)$/
@@ -65,7 +41,6 @@ module.exports = {
   },
   create(context) {
     return {
-      ...generateTagFormatter({ context, EXPECTED_NAMES, UNEXPECTED_NAMES }),
       JSXOpeningElement: (node) => {
         const name = node.name.name || ''
 

package/rules/a11y-trigger-has-button/index.js

@@ -1,18 +1,11 @@
-const { generateTagFormatter } = require('../../libs/format_styled_components')
-
-const EXPECTED_NAMES = {
-  'DropdownTrigger$': 'DropdownTrigger$',
-  'DialogTrigger$': 'DialogTrigger$',
-  '(b|B)utton$': 'Button$',
-  'AnchorButton$': 'AnchorButton$',
-  'ButtonAnchor$': 'ButtonAnchor$',
-  'Anchor$': 'Anchor$',
-  'Link$': 'Link$',
-  '^a$': '(Anchor|Link)$',
-}
+const TRIGGER_REGEX = /(Dropdown|Dialog)Trigger$/
+const HELP_DIALOG_TRIGGER_REGEX = /HelpDialogTrigger$/
+const BUTTON_REGEX = /(B|^b)utton$/
+const ANCHOR_BUTTON_REGEX = /AnchorButton$/
+const FALSY_TEXT_REGEX = /^\s*\n+\s*$/
 
 const filterFalsyJSXText = (cs) => cs.filter((c) => (
-  !(c.type === 'JSXText' && c.value.match(/^\s*\n+\s*$/))
+  !(c.type === 'JSXText' && FALSY_TEXT_REGEX.test(c.value))
 ))
 
 /**
@@ -25,7 +18,6 @@ module.exports = {
   },
   create(context) {
     return {
-      ...generateTagFormatter({ context, EXPECTED_NAMES }),
       JSXElement: (parentNode) => {
         // HINT: 閉じタグが存在しない === 子が存在しない
         // 子を持っていない場合はおそらく固定の要素を吐き出すコンポーネントと考えられるため
@@ -40,9 +32,9 @@ module.exports = {
           return
         }
 
-        const match = node.name.name.match(/(Dropdown|Dialog)Trigger$/)
+        const match = node.name.name.match(TRIGGER_REGEX)
 
-        if (!match || node.name.name.match(/HelpDialogTrigger$/)) {
+        if (!match || HELP_DIALOG_TRIGGER_REGEX.test(node.name.name)) {
           return
         }
 
@@ -65,8 +57,8 @@ module.exports = {
 
           if (
             c.type !== 'JSXElement' ||
-            !c.openingElement.name.name.match(/(b|B)utton$/) ||
-            c.openingElement.name.name.match(/AnchorButton$/)
+            !BUTTON_REGEX.test(c.openingElement.name.name) ||
+            ANCHOR_BUTTON_REGEX.test(c.openingElement.name.name)
           ) {
             context.report({
               node: c,