eslint-plugin-smarthr 0.3.22 → 0.3.24
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +9 -0
- package/libs/format_styled_components.js +4 -4
- package/package.json +1 -1
- package/rules/a11y-heading-in-sectioning-content/README.md +6 -8
- package/rules/a11y-heading-in-sectioning-content/index.js +2 -1
- package/test/a11y-anchor-has-href-attribute.js +7 -5
- package/test/a11y-clickable-element-has-text.js +26 -20
- package/test/a11y-heading-in-sectioning-content.js +37 -24
- package/test/a11y-image-has-alt-attribute.js +11 -8
- package/test/a11y-input-has-name-attribute.js +21 -12
- package/test/a11y-prohhibit-input-placeholder.js +19 -13
- package/test/a11y-trigger-has-button.js +22 -15
- package/test/best-practice-for-remote-trigger-dialog.js +2 -2
package/CHANGELOG.md
CHANGED
|
@@ -2,6 +2,15 @@
|
|
|
2
2
|
|
|
3
3
|
All notable changes to this project will be documented in this file. See [standard-version](https://github.com/conventional-changelog/standard-version) for commit guidelines.
|
|
4
4
|
|
|
5
|
+
### [0.3.24](https://github.com/kufu/eslint-plugin-smarthr/compare/v0.3.23...v0.3.24) (2024-01-19)
|
|
6
|
+
|
|
7
|
+
### [0.3.23](https://github.com/kufu/eslint-plugin-smarthr/compare/v0.3.22...v0.3.23) (2024-01-16)
|
|
8
|
+
|
|
9
|
+
|
|
10
|
+
### Bug Fixes
|
|
11
|
+
|
|
12
|
+
* import内で型の場合はtype kindを設定することでasでの命名縛りを回避できるように修正 ([#102](https://github.com/kufu/eslint-plugin-smarthr/issues/102)) ([689d7da](https://github.com/kufu/eslint-plugin-smarthr/commit/689d7da9e899b2801ae2dfdfd465f6cfcc277e85))
|
|
13
|
+
|
|
5
14
|
### [0.3.22](https://github.com/kufu/eslint-plugin-smarthr/compare/v0.3.21...v0.3.22) (2024-01-16)
|
|
6
15
|
|
|
7
16
|
|
|
@@ -27,13 +27,13 @@ const generateTagFormatter = ({ context, EXPECTED_NAMES, UNEXPECTED_NAMES }) =>
|
|
|
27
27
|
}) : []
|
|
28
28
|
|
|
29
29
|
|
|
30
|
-
const checkImportedNameToLocalName = (node, base, extended,
|
|
30
|
+
const checkImportedNameToLocalName = (node, base, extended, isImport) => {
|
|
31
31
|
entriesesTagNames.forEach(([b, e]) => {
|
|
32
32
|
if (base.match(b) && !extended.match(e)) {
|
|
33
33
|
context.report({
|
|
34
34
|
node,
|
|
35
|
-
message: `${extended}を正規表現 "${e.toString()}" がmatch
|
|
36
|
-
- ${base}が型の場合、'
|
|
35
|
+
message: `${extended}を正規表現 "${e.toString()}" がmatchする名称に変更してください。${isImport ? `
|
|
36
|
+
- ${base}が型の場合、'import type { ${base} as ${extended} }' もしくは 'import { type ${base} as ${extended} }' のように明示的に型であることを宣言してください。名称変更が不要になります` : ''}`,
|
|
37
37
|
});
|
|
38
38
|
}
|
|
39
39
|
})
|
|
@@ -46,7 +46,7 @@ const generateTagFormatter = ({ context, EXPECTED_NAMES, UNEXPECTED_NAMES }) =>
|
|
|
46
46
|
if (node.importKind !== 'type') {
|
|
47
47
|
node.specifiers.forEach((s) => {
|
|
48
48
|
if (s.importKind !== 'type' && s.imported && s.imported.name !== s.local.name) {
|
|
49
|
-
checkImportedNameToLocalName(node, s.imported.name, s.local.name,
|
|
49
|
+
checkImportedNameToLocalName(node, s.imported.name, s.local.name, true)
|
|
50
50
|
}
|
|
51
51
|
})
|
|
52
52
|
}
|
package/package.json
CHANGED
|
@@ -3,6 +3,7 @@
|
|
|
3
3
|
- Headingコンポーネントをsmarthr-ui/SectioningContent(Article, Aside, Nav, Section, SectioningFragment) のいずれかで囲むことを促すルールです
|
|
4
4
|
- article, aside, nav, section で Heading とHeadingの対象となる範囲を囲むとブラウザが正確に解釈できるようになるメリットがあります
|
|
5
5
|
- またsmarthr-ui/SectioningContentで smarthr-ui/Headingを囲むことで、Headingのレベル(h1~h6)を自動的に計算するメリットもあります
|
|
6
|
+
- Headingコンポーネントをsmarthr-ui/Layout(Center, Reel, Sidebar, Stack) のいずれかで囲んでおり、かつas, forwardedAsのいずれかの属性で 'section', 'article', 'aside', 'nav' が指定されている場合、SectioningContentで囲んでいるものとして扱われるようになります
|
|
6
7
|
|
|
7
8
|
## rules
|
|
8
9
|
|
|
@@ -59,20 +60,17 @@
|
|
|
59
60
|
<Heading>fuga</Heading>
|
|
60
61
|
</Section>
|
|
61
62
|
</Section>
|
|
62
|
-
```
|
|
63
63
|
|
|
64
|
-
```jsx
|
|
65
64
|
<>
|
|
66
65
|
<PageHeading>Page Name.</PageHeading>
|
|
67
66
|
<Section>
|
|
68
|
-
<Heading>
|
|
69
|
-
hoge
|
|
70
|
-
</Heading>
|
|
67
|
+
<Heading>hoge</Heading>
|
|
71
68
|
</Section>
|
|
72
69
|
<StyledSection>
|
|
73
|
-
<Heading>
|
|
74
|
-
fuga
|
|
75
|
-
</Heading>
|
|
70
|
+
<Heading>fuga</Heading>
|
|
76
71
|
</StyledSection>
|
|
72
|
+
<Center as="aside">
|
|
73
|
+
<Heading>piyo</Heading>
|
|
74
|
+
</Center>
|
|
77
75
|
</>
|
|
78
76
|
```
|
|
@@ -51,8 +51,9 @@ const sectioningRegex = /((A(rticle|side))|Nav|Section|^SectioningFragment)$/
|
|
|
51
51
|
const bareTagRegex = /^(article|aside|nav|section)$/
|
|
52
52
|
const modelessDialogRegex = /ModelessDialog$/
|
|
53
53
|
const layoutComponentRegex = /((C(ent|lust)er)|Reel|Sidebar|Stack)$/
|
|
54
|
+
const asRegex = /^(as|forwardedAs)$/
|
|
54
55
|
|
|
55
|
-
const includeSectioningAsAttr = (a) => a.name?.name
|
|
56
|
+
const includeSectioningAsAttr = (a) => a.name?.name.match(asRegex) && a.value.value.match(bareTagRegex)
|
|
56
57
|
|
|
57
58
|
const noHeadingTagNames = ['span', 'legend']
|
|
58
59
|
const ignoreHeadingCheckParentType = ['Program', 'ExportNamedDeclaration']
|
|
@@ -41,11 +41,13 @@ ruleTester.run('a11y-anchor-has-href-attribute', rule, {
|
|
|
41
41
|
],
|
|
42
42
|
invalid: [
|
|
43
43
|
{ code: `import hoge from 'styled-components'`, errors: [ { message: `styled-components をimportする際は、名称が"styled" となるようにしてください。例: "import styled from 'styled-components'"` } ] },
|
|
44
|
-
{ code: `import { Anchor as AnchorHoge } from './hoge'`, errors: [ { message: `AnchorHogeを正規表現 "/Anchor$/" がmatch
|
|
45
|
-
|
|
46
|
-
{ code:
|
|
47
|
-
|
|
48
|
-
{ code: 'const Hoge = styled
|
|
44
|
+
{ code: `import { Anchor as AnchorHoge } from './hoge'`, errors: [ { message: `AnchorHogeを正規表現 "/Anchor$/" がmatchする名称に変更してください。
|
|
45
|
+
- Anchorが型の場合、'import type { Anchor as AnchorHoge }' もしくは 'import { type Anchor as AnchorHoge }' のように明示的に型であることを宣言してください。名称変更が不要になります` } ] },
|
|
46
|
+
{ code: `import { HogeLink as HogeLinkFuga } from './hoge'`, errors: [ { message: `HogeLinkFugaを正規表現 "/Link$/" がmatchする名称に変更してください。
|
|
47
|
+
- HogeLinkが型の場合、'import type { HogeLink as HogeLinkFuga }' もしくは 'import { type HogeLink as HogeLinkFuga }' のように明示的に型であることを宣言してください。名称変更が不要になります` } ] },
|
|
48
|
+
{ code: 'const Hoge = styled.a``', errors: [ { message: `Hogeを正規表現 "/(Anchor|Link)$/" がmatchする名称に変更してください。` } ] },
|
|
49
|
+
{ code: 'const Hoge = styled(Anchor)``', errors: [ { message: `Hogeを正規表現 "/Anchor$/" がmatchする名称に変更してください。` } ] },
|
|
50
|
+
{ code: 'const Hoge = styled(Link)``', errors: [ { message: `Hogeを正規表現 "/Link$/" がmatchする名称に変更してください。` } ] },
|
|
49
51
|
{ code: 'const FugaAnchor = styled.div``', errors: [ { message: `FugaAnchor は /(Anchor|^a)$/ にmatchする名前のコンポーネントを拡張することを期待している名称になっています
|
|
50
52
|
- FugaAnchor の名称の末尾が"Anchor" という文字列ではない状態にしつつ、"div"を継承していることをわかる名称に変更してください
|
|
51
53
|
- もしくは"div"を"FugaAnchor"の継承元であることがわかるような適切なタグや別コンポーネントに差し替えてください
|
|
@@ -134,26 +134,32 @@ ruleTester.run('a11y-clickable-element-has-text', rule, {
|
|
|
134
134
|
],
|
|
135
135
|
invalid: [
|
|
136
136
|
{ code: `import hoge from 'styled-components'`, errors: [ { message: `styled-components をimportする際は、名称が"styled" となるようにしてください。例: "import styled from 'styled-components'"` } ] },
|
|
137
|
-
{ code: `import { SmartHRLogo as SmartHRLogoHoge } from './hoge'`, errors: [ { message: `SmartHRLogoHogeを正規表現 "/SmartHRLogo$/" がmatch
|
|
138
|
-
|
|
139
|
-
{ code: `import {
|
|
140
|
-
|
|
141
|
-
{ code: `import {
|
|
142
|
-
|
|
143
|
-
{ code:
|
|
144
|
-
|
|
145
|
-
{ code:
|
|
146
|
-
|
|
147
|
-
{ code:
|
|
148
|
-
|
|
149
|
-
{ code: 'const
|
|
150
|
-
{ code: 'const
|
|
151
|
-
{ code: 'const
|
|
152
|
-
{ code: 'const
|
|
153
|
-
{ code: 'const
|
|
154
|
-
{ code: 'const
|
|
155
|
-
{ code: 'const
|
|
156
|
-
{ code: 'const
|
|
137
|
+
{ code: `import { SmartHRLogo as SmartHRLogoHoge } from './hoge'`, errors: [ { message: `SmartHRLogoHogeを正規表現 "/SmartHRLogo$/" がmatchする名称に変更してください。
|
|
138
|
+
- SmartHRLogoが型の場合、'import type { SmartHRLogo as SmartHRLogoHoge }' もしくは 'import { type SmartHRLogo as SmartHRLogoHoge }' のように明示的に型であることを宣言してください。名称変更が不要になります` } ] },
|
|
139
|
+
{ code: `import { AbcButton as AbcButtonFuga } from './hoge'`, errors: [ { message: `AbcButtonFugaを正規表現 "/Button$/" がmatchする名称に変更してください。
|
|
140
|
+
- AbcButtonが型の場合、'import type { AbcButton as AbcButtonFuga }' もしくは 'import { type AbcButton as AbcButtonFuga }' のように明示的に型であることを宣言してください。名称変更が不要になります` } ] },
|
|
141
|
+
{ code: `import { Anchor as AnchorHoge } from './hoge'`, errors: [ { message: `AnchorHogeを正規表現 "/Anchor$/" がmatchする名称に変更してください。
|
|
142
|
+
- Anchorが型の場合、'import type { Anchor as AnchorHoge }' もしくは 'import { type Anchor as AnchorHoge }' のように明示的に型であることを宣言してください。名称変更が不要になります` } ] },
|
|
143
|
+
{ code: `import { HogeLink as HogeLinkFuga } from './hoge'`, errors: [ { message: `HogeLinkFugaを正規表現 "/Link$/" がmatchする名称に変更してください。
|
|
144
|
+
- HogeLinkが型の場合、'import type { HogeLink as HogeLinkFuga }' もしくは 'import { type HogeLink as HogeLinkFuga }' のように明示的に型であることを宣言してください。名称変更が不要になります` } ] },
|
|
145
|
+
{ code: `import { FugaText as FugaTextFuga } from './hoge'`, errors: [ { message: `FugaTextFugaを正規表現 "/Text$/" がmatchする名称に変更してください。
|
|
146
|
+
- FugaTextが型の場合、'import type { FugaText as FugaTextFuga }' もしくは 'import { type FugaText as FugaTextFuga }' のように明示的に型であることを宣言してください。名称変更が不要になります` } ] },
|
|
147
|
+
{ code: `import { FugaMessage as FugaMessageFuga } from './hoge'`, errors: [ { message: `FugaMessageFugaを正規表現 "/Message$/" がmatchする名称に変更してください。
|
|
148
|
+
- FugaMessageが型の場合、'import type { FugaMessage as FugaMessageFuga }' もしくは 'import { type FugaMessage as FugaMessageFuga }' のように明示的に型であることを宣言してください。名称変更が不要になります` } ] },
|
|
149
|
+
{ code: 'const Hoge = styled.a``', errors: [ { message: `Hogeを正規表現 "/(Anchor|Link)$/" がmatchする名称に変更してください。` } ] },
|
|
150
|
+
{ code: 'const Hoge = styled.button``', errors: [ { message: `Hogeを正規表現 "/Button$/" がmatchする名称に変更してください。` } ] },
|
|
151
|
+
{ code: 'const Hoge = styled(Anchor)``', errors: [ { message: `Hogeを正規表現 "/Anchor$/" がmatchする名称に変更してください。` } ] },
|
|
152
|
+
{ code: 'const Hoge = styled(Link)``', errors: [ { message: `Hogeを正規表現 "/Link$/" がmatchする名称に変更してください。` } ] },
|
|
153
|
+
{ code: 'const Hoge = styled(Button)``', errors: [ { message: `Hogeを正規表現 "/Button$/" がmatchする名称に変更してください。` } ] },
|
|
154
|
+
{ code: 'const Fuga = styled(HogeAnchor)``', errors: [ { message: `Fugaを正規表現 "/Anchor$/" がmatchする名称に変更してください。` } ] },
|
|
155
|
+
{ code: 'const Fuga = styled(HogeAnchor)``', errors: [ { message: `Fugaを正規表現 "/Anchor$/" がmatchする名称に変更してください。` } ] },
|
|
156
|
+
{ code: 'const Fuga = styled(SmartHRLogo)``', errors: [ { message: `Fugaを正規表現 "/SmartHRLogo$/" がmatchする名称に変更してください。` } ] },
|
|
157
|
+
{ code: 'const Piyo = styled.a(() => ``)', errors: [ { message: `Piyoを正規表現 "/(Anchor|Link)$/" がmatchする名称に変更してください。` } ] },
|
|
158
|
+
{ code: 'const Piyo = styled("a")(() => ``)', errors: [ { message: `Piyoを正規表現 "/(Anchor|Link)$/" がmatchする名称に変更してください。` } ] },
|
|
159
|
+
{ code: 'const Piyo = styled("a")``', errors: [ { message: `Piyoを正規表現 "/(Anchor|Link)$/" がmatchする名称に変更してください。` } ] },
|
|
160
|
+
{ code: 'const Piyo = styled(Anchor)(() => ``)', errors: [ { message: `Piyoを正規表現 "/Anchor$/" がmatchする名称に変更してください。` } ] },
|
|
161
|
+
{ code: 'const Hoge = styled(Text)``', errors: [ { message: `Hogeを正規表現 "/Text$/" がmatchする名称に変更してください。` } ] },
|
|
162
|
+
{ code: 'const Hoge = styled(HogeMessage)``', errors: [ { message: `Hogeを正規表現 "/Message$/" がmatchする名称に変更してください。` } ] },
|
|
157
163
|
{ code: 'const StyledButton = styled.div``', errors: [ { message: `StyledButton は /(B|^b)utton$/ にmatchする名前のコンポーネントを拡張することを期待している名称になっています
|
|
158
164
|
- StyledButton の名称の末尾が"Button" という文字列ではない状態にしつつ、"div"を継承していることをわかる名称に変更してください
|
|
159
165
|
- もしくは"div"を"StyledButton"の継承元であることがわかるような適切なタグや別コンポーネントに差し替えてください
|
|
@@ -60,33 +60,46 @@ ruleTester.run('a11y-heading-in-sectioning-content', rule, {
|
|
|
60
60
|
{ code: '<Reel as="aside"><div><Heading>hoge</Heading></div></Reel>' },
|
|
61
61
|
{ code: '<Sidebar as="nav"><div><Heading>hoge</Heading></div></Sidebar>' },
|
|
62
62
|
{ code: '<Stack as="section"><div><Heading>hoge</Heading></div></Stack>' },
|
|
63
|
+
{ code: '<HogeCenter forwardedAs="section"><div><Heading>hoge</Heading></div></HogeCenter>' },
|
|
64
|
+
{ code: '<HogeCluster forwardedAs="section"><div><Heading>hoge</Heading></div></HogeCluster>' },
|
|
65
|
+
{ code: '<HogeReel forwardedAs="aside"><div><Heading>hoge</Heading></div></HogeReel>' },
|
|
66
|
+
{ code: '<HogeSidebar forwardedAs="nav"><div><Heading>hoge</Heading></div></HogeSidebar>' },
|
|
67
|
+
{ code: '<HogeStack forwardedAs="section"><div><Heading>hoge</Heading></div></HogeStack>' },
|
|
63
68
|
],
|
|
64
69
|
invalid: [
|
|
65
70
|
{ code: `import hoge from 'styled-components'`, errors: [ { message: `styled-components をimportする際は、名称が"styled" となるようにしてください。例: "import styled from 'styled-components'"` } ] },
|
|
66
|
-
{ code: `import { HogePageHeading as PageHeadingAbc } from './hoge'`, errors: [ { message: `PageHeadingAbcを正規表現 "/PageHeading$/" がmatch
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
{ code: `import {
|
|
70
|
-
|
|
71
|
-
{ code: `import {
|
|
72
|
-
|
|
73
|
-
{ code:
|
|
74
|
-
|
|
75
|
-
{ code:
|
|
76
|
-
|
|
77
|
-
{ code:
|
|
78
|
-
|
|
79
|
-
{ code:
|
|
80
|
-
|
|
81
|
-
{ code: 'const
|
|
82
|
-
{ code: 'const
|
|
83
|
-
{ code: 'const
|
|
84
|
-
{ code: 'const
|
|
85
|
-
{ code: 'const
|
|
86
|
-
{ code: 'const
|
|
87
|
-
{ code: 'const Fuga = styled(
|
|
88
|
-
{ code: 'const Fuga = styled(
|
|
89
|
-
{ code: 'const Fuga = styled(
|
|
71
|
+
{ code: `import { HogePageHeading as PageHeadingAbc } from './hoge'`, errors: [ { message: `PageHeadingAbcを正規表現 "/PageHeading$/" がmatchする名称に変更してください。
|
|
72
|
+
- HogePageHeadingが型の場合、'import type { HogePageHeading as PageHeadingAbc }' もしくは 'import { type HogePageHeading as PageHeadingAbc }' のように明示的に型であることを宣言してください。名称変更が不要になります` }, { message: `PageHeadingAbcを正規表現 "/Heading$/" がmatchする名称に変更してください。
|
|
73
|
+
- HogePageHeadingが型の場合、'import type { HogePageHeading as PageHeadingAbc }' もしくは 'import { type HogePageHeading as PageHeadingAbc }' のように明示的に型であることを宣言してください。名称変更が不要になります` } ] },
|
|
74
|
+
{ code: `import { Heading as HeadingHoge } from './hoge'`, errors: [ { message: `HeadingHogeを正規表現 "/Heading$/" がmatchする名称に変更してください。
|
|
75
|
+
- Headingが型の場合、'import type { Heading as HeadingHoge }' もしくは 'import { type Heading as HeadingHoge }' のように明示的に型であることを宣言してください。名称変更が不要になります` } ] },
|
|
76
|
+
{ code: `import { HogeArticle as HogeArticleFuga } from './hoge'`, errors: [ { message: `HogeArticleFugaを正規表現 "/Article$/" がmatchする名称に変更してください。
|
|
77
|
+
- HogeArticleが型の場合、'import type { HogeArticle as HogeArticleFuga }' もしくは 'import { type HogeArticle as HogeArticleFuga }' のように明示的に型であることを宣言してください。名称変更が不要になります` } ] },
|
|
78
|
+
{ code: `import { HogeAside as HogeAsideFuga } from './hoge'`, errors: [ { message: `HogeAsideFugaを正規表現 "/Aside$/" がmatchする名称に変更してください。
|
|
79
|
+
- HogeAsideが型の場合、'import type { HogeAside as HogeAsideFuga }' もしくは 'import { type HogeAside as HogeAsideFuga }' のように明示的に型であることを宣言してください。名称変更が不要になります` } ] },
|
|
80
|
+
{ code: `import { HogeNav as HogeNavFuga } from './hoge'`, errors: [ { message: `HogeNavFugaを正規表現 "/Nav$/" がmatchする名称に変更してください。
|
|
81
|
+
- HogeNavが型の場合、'import type { HogeNav as HogeNavFuga }' もしくは 'import { type HogeNav as HogeNavFuga }' のように明示的に型であることを宣言してください。名称変更が不要になります` } ] },
|
|
82
|
+
{ code: `import { HogeSection as HogeSectionFuga } from './hoge'`, errors: [ { message: `HogeSectionFugaを正規表現 "/Section$/" がmatchする名称に変更してください。
|
|
83
|
+
- HogeSectionが型の場合、'import type { HogeSection as HogeSectionFuga }' もしくは 'import { type HogeSection as HogeSectionFuga }' のように明示的に型であることを宣言してください。名称変更が不要になります` } ] },
|
|
84
|
+
{ code: `import { HogeModelessDialog as HogeModelessDialogFuga } from './hoge'`, errors: [ { message: `HogeModelessDialogFugaを正規表現 "/ModelessDialog$/" がmatchする名称に変更してください。
|
|
85
|
+
- HogeModelessDialogが型の場合、'import type { HogeModelessDialog as HogeModelessDialogFuga }' もしくは 'import { type HogeModelessDialog as HogeModelessDialogFuga }' のように明示的に型であることを宣言してください。名称変更が不要になります` } ] },
|
|
86
|
+
{ code: 'const Hoge = styled.h1``', errors: [ { message: `Hogeを正規表現 "/PageHeading$/" がmatchする名称に変更してください。` } ] },
|
|
87
|
+
{ code: 'const Hoge = styled.h2``', errors: [ { message: `Hogeを正規表現 "/Heading$/" がmatchする名称に変更してください。` } ] },
|
|
88
|
+
{ code: 'const Hoge = styled.h3``', errors: [ { message: `Hogeを正規表現 "/Heading$/" がmatchする名称に変更してください。` } ] },
|
|
89
|
+
{ code: 'const Hoge = styled.h4``', errors: [ { message: `Hogeを正規表現 "/Heading$/" がmatchする名称に変更してください。` } ] },
|
|
90
|
+
{ code: 'const Hoge = styled.h5``', errors: [ { message: `Hogeを正規表現 "/Heading$/" がmatchする名称に変更してください。` } ] },
|
|
91
|
+
{ code: 'const Hoge = styled.h6``', errors: [ { message: `Hogeを正規表現 "/Heading$/" がmatchする名称に変更してください。` } ] },
|
|
92
|
+
{ code: 'const Fuga = styled(Heading)``', errors: [ { message: `Fugaを正規表現 "/Heading$/" がmatchする名称に変更してください。` } ] },
|
|
93
|
+
{ code: 'const Fuga = styled(HogeHeading)``', errors: [ { message: `Fugaを正規表現 "/Heading$/" がmatchする名称に変更してください。` } ] },
|
|
94
|
+
{ code: 'const Fuga = styled(HogeHeading).attrs(() => ({ type: "blockTitle" }))``', errors: [ { message: `Fugaを正規表現 "/Heading$/" がmatchする名称に変更してください。` } ] },
|
|
95
|
+
{ code: 'const Fuga = styled(HogeArticle)``', errors: [ { message: `Fugaを正規表現 "/Article$/" がmatchする名称に変更してください。` } ] },
|
|
96
|
+
{ code: 'const Fuga = styled(HogeAside)``', errors: [ { message: `Fugaを正規表現 "/Aside$/" がmatchする名称に変更してください。` } ] },
|
|
97
|
+
{ code: 'const Fuga = styled(HogeNav)``', errors: [ { message: `Fugaを正規表現 "/Nav$/" がmatchする名称に変更してください。` } ] },
|
|
98
|
+
{ code: 'const Fuga = styled(HogeSection)``', errors: [ { message: `Fugaを正規表現 "/Section$/" がmatchする名称に変更してください。` } ] },
|
|
99
|
+
{ code: 'const Fuga = styled(HogeCenter)``', errors: [ { message: `Fugaを正規表現 "/Center$/" がmatchする名称に変更してください。` } ] },
|
|
100
|
+
{ code: 'const Fuga = styled(HogeReel)``', errors: [ { message: `Fugaを正規表現 "/Reel$/" がmatchする名称に変更してください。` } ] },
|
|
101
|
+
{ code: 'const Fuga = styled(HogeSidebar)``', errors: [ { message: `Fugaを正規表現 "/Sidebar$/" がmatchする名称に変更してください。` } ] },
|
|
102
|
+
{ code: 'const Fuga = styled(HogeStack)``', errors: [ { message: `Fugaを正規表現 "/Stack$/" がmatchする名称に変更してください。` } ] },
|
|
90
103
|
{ code: 'const StyledArticle = styled.article``', errors: [ { message: `"article"を利用せず、smarthr-ui/Articleを拡張してください。Headingのレベルが自動計算されるようになります。(例: "styled.article" -> "styled(Article)")` } ] },
|
|
91
104
|
{ code: 'const StyledAside = styled.aside``', errors: [ { message: `"aside"を利用せず、smarthr-ui/Asideを拡張してください。Headingのレベルが自動計算されるようになります。(例: "styled.aside" -> "styled(Aside)")` } ] },
|
|
92
105
|
{ code: 'const StyledNav = styled.nav``', errors: [ { message: `"nav"を利用せず、smarthr-ui/Navを拡張してください。Headingのレベルが自動計算されるようになります。(例: "styled.nav" -> "styled(Nav)")` } ] },
|
|
@@ -49,14 +49,17 @@ ruleTester.run('a11y-image-has-alt-attribute', rule, {
|
|
|
49
49
|
],
|
|
50
50
|
invalid: [
|
|
51
51
|
{ code: `import hoge from 'styled-components'`, errors: [ { message: `styled-components をimportする際は、名称が"styled" となるようにしてください。例: "import styled from 'styled-components'"` } ] },
|
|
52
|
-
{ code: `import { HogeImg as ImgFuga } from './hoge'`, errors: [ { message: `ImgFugaを正規表現 "/Img$/" がmatch
|
|
53
|
-
|
|
54
|
-
{ code: `import {
|
|
55
|
-
|
|
56
|
-
{ code:
|
|
57
|
-
|
|
58
|
-
{ code: 'const Hoge = styled
|
|
59
|
-
{ code: 'const Hoge = styled
|
|
52
|
+
{ code: `import { HogeImg as ImgFuga } from './hoge'`, errors: [ { message: `ImgFugaを正規表現 "/Img$/" がmatchする名称に変更してください。
|
|
53
|
+
- HogeImgが型の場合、'import type { HogeImg as ImgFuga }' もしくは 'import { type HogeImg as ImgFuga }' のように明示的に型であることを宣言してください。名称変更が不要になります` } ] },
|
|
54
|
+
{ code: `import { HogeImage as HogeImageFuga } from './hoge'`, errors: [ { message: `HogeImageFugaを正規表現 "/Image$/" がmatchする名称に変更してください。
|
|
55
|
+
- HogeImageが型の場合、'import type { HogeImage as HogeImageFuga }' もしくは 'import { type HogeImage as HogeImageFuga }' のように明示的に型であることを宣言してください。名称変更が不要になります` } ] },
|
|
56
|
+
{ code: `import { Icon as Hoge } from './hoge'`, errors: [ { message: `Hogeを正規表現 "/Icon$/" がmatchする名称に変更してください。
|
|
57
|
+
- Iconが型の場合、'import type { Icon as Hoge }' もしくは 'import { type Icon as Hoge }' のように明示的に型であることを宣言してください。名称変更が不要になります` } ] },
|
|
58
|
+
{ code: 'const Hoge = styled.img``', errors: [ { message: `Hogeを正規表現 "/(Img|Image|Icon)$/" がmatchする名称に変更してください。` } ] },
|
|
59
|
+
{ code: 'const Hoge = styled.svg``', errors: [ { message: `Hogeを正規表現 "/(Img|Image|Icon)$/" がmatchする名称に変更してください。` } ] },
|
|
60
|
+
{ code: 'const Hoge = styled(Icon)``', errors: [ { message: `Hogeを正規表現 "/Icon$/" がmatchする名称に変更してください。` } ] },
|
|
61
|
+
{ code: 'const Hoge = styled(Img)``', errors: [ { message: `Hogeを正規表現 "/Img$/" がmatchする名称に変更してください。` } ] },
|
|
62
|
+
{ code: 'const Hoge = styled(Image)``', errors: [ { message: `Hogeを正規表現 "/Image$/" がmatchする名称に変更してください。` } ] },
|
|
60
63
|
{ code: 'const StyledImage = styled.span``', errors: [ { message: `StyledImage は /(Image|^(img|svg))$/ にmatchする名前のコンポーネントを拡張することを期待している名称になっています
|
|
61
64
|
- StyledImage の名称の末尾が"Image" という文字列ではない状態にしつつ、"span"を継承していることをわかる名称に変更してください
|
|
62
65
|
- もしくは"span"を"StyledImage"の継承元であることがわかるような適切なタグや別コンポーネントに差し替えてください
|
|
@@ -52,18 +52,27 @@ ruleTester.run('a11y-input-has-name-attribute', rule, {
|
|
|
52
52
|
],
|
|
53
53
|
invalid: [
|
|
54
54
|
{ code: `import hoge from 'styled-components'`, errors: [ { message: `styled-components をimportする際は、名称が"styled" となるようにしてください。例: "import styled from 'styled-components'"` } ] },
|
|
55
|
-
{ code: `import { Input as InputHoge } from './hoge'`, errors: [ { message: `InputHogeを正規表現 "/Input$/" がmatch
|
|
56
|
-
|
|
57
|
-
{ code: `import {
|
|
58
|
-
|
|
59
|
-
{ code: `import {
|
|
60
|
-
|
|
61
|
-
{ code: `import {
|
|
62
|
-
|
|
63
|
-
{ code: `import {
|
|
64
|
-
|
|
65
|
-
{ code:
|
|
66
|
-
|
|
55
|
+
{ code: `import { Input as InputHoge } from './hoge'`, errors: [ { message: `InputHogeを正規表現 "/Input$/" がmatchする名称に変更してください。
|
|
56
|
+
- Inputが型の場合、'import type { Input as InputHoge }' もしくは 'import { type Input as InputHoge }' のように明示的に型であることを宣言してください。名称変更が不要になります` } ] },
|
|
57
|
+
{ code: `import { HogeTextarea as HogeTextareaFuga } from './hoge'`, errors: [ { message: `HogeTextareaFugaを正規表現 "/Textarea$/" がmatchする名称に変更してください。
|
|
58
|
+
- HogeTextareaが型の場合、'import type { HogeTextarea as HogeTextareaFuga }' もしくは 'import { type HogeTextarea as HogeTextareaFuga }' のように明示的に型であることを宣言してください。名称変更が不要になります` } ] },
|
|
59
|
+
{ code: `import { HogeSelect as SelectFuga } from './hoge'`, errors: [ { message: `SelectFugaを正規表現 "/Select$/" がmatchする名称に変更してください。
|
|
60
|
+
- HogeSelectが型の場合、'import type { HogeSelect as SelectFuga }' もしくは 'import { type HogeSelect as SelectFuga }' のように明示的に型であることを宣言してください。名称変更が不要になります` } ] },
|
|
61
|
+
{ code: `import { InputFile as HogeInputFileFuga } from './hoge'`, errors: [ { message: `HogeInputFileFugaを正規表現 "/InputFile$/" がmatchする名称に変更してください。
|
|
62
|
+
- InputFileが型の場合、'import type { InputFile as HogeInputFileFuga }' もしくは 'import { type InputFile as HogeInputFileFuga }' のように明示的に型であることを宣言してください。名称変更が不要になります` } ] },
|
|
63
|
+
{ code: `import { HogeRadioButton as FugaRadioButtonAbc } from './hoge'`, errors: [ { message: `FugaRadioButtonAbcを正規表現 "/RadioButton$/" がmatchする名称に変更してください。
|
|
64
|
+
- HogeRadioButtonが型の場合、'import type { HogeRadioButton as FugaRadioButtonAbc }' もしくは 'import { type HogeRadioButton as FugaRadioButtonAbc }' のように明示的に型であることを宣言してください。名称変更が不要になります` } ] },
|
|
65
|
+
{ code: `import { CheckBox as FugaCheckBoxHoge } from './hoge'`, errors: [ { message: `FugaCheckBoxHogeを正規表現 "/CheckBox$/" がmatchする名称に変更してください。
|
|
66
|
+
- CheckBoxが型の場合、'import type { CheckBox as FugaCheckBoxHoge }' もしくは 'import { type CheckBox as FugaCheckBoxHoge }' のように明示的に型であることを宣言してください。名称変更が不要になります` } ] },
|
|
67
|
+
{ code: `import { HogeComboBox as ComboBoxFuga } from './hoge'`, errors: [ { message: `ComboBoxFugaを正規表現 "/ComboBox$/" がmatchする名称に変更してください。
|
|
68
|
+
- HogeComboBoxが型の場合、'import type { HogeComboBox as ComboBoxFuga }' もしくは 'import { type HogeComboBox as ComboBoxFuga }' のように明示的に型であることを宣言してください。名称変更が不要になります` } ] },
|
|
69
|
+
{ code: `import { DatePicker as HogeDatePickerFuga } from './hoge'`, errors: [ { message: `HogeDatePickerFugaを正規表現 "/DatePicker$/" がmatchする名称に変更してください。
|
|
70
|
+
- DatePickerが型の場合、'import type { DatePicker as HogeDatePickerFuga }' もしくは 'import { type DatePicker as HogeDatePickerFuga }' のように明示的に型であることを宣言してください。名称変更が不要になります` } ] },
|
|
71
|
+
{ code: `import { HogeDropZone as HogeFugaDropZoneAbc } from './hoge'`, errors: [ { message: `HogeFugaDropZoneAbcを正規表現 "/DropZone$/" がmatchする名称に変更してください。
|
|
72
|
+
- HogeDropZoneが型の場合、'import type { HogeDropZone as HogeFugaDropZoneAbc }' もしくは 'import { type HogeDropZone as HogeFugaDropZoneAbc }' のように明示的に型であることを宣言してください。名称変更が不要になります` } ] },
|
|
73
|
+
{ code: 'const Hoge = styled.input``', errors: [ { message: `Hogeを正規表現 "/Input$/" がmatchする名称に変更してください。` } ] },
|
|
74
|
+
{ code: 'const Hoge = styled.Input``', errors: [ { message: `Hogeを正規表現 "/Input$/" がmatchする名称に変更してください。` } ] },
|
|
75
|
+
{ code: 'const Hoge = styled(RadioButton)``', errors: [ { message: `Hogeを正規表現 "/RadioButton$/" がmatchする名称に変更してください。` } ] },
|
|
67
76
|
{ code: '<input />', errors: [ { message: `input にname属性を指定してください${MESSAGE_SUFFIX}` } ] },
|
|
68
77
|
{ code: '<input type="date" />', errors: [ { message: `input にname属性を指定してください${MESSAGE_SUFFIX}` } ] },
|
|
69
78
|
{ code: '<Input type="checkbox" />', errors: [ { message: `Input にname属性を指定してください${MESSAGE_SUFFIX}` } ] },
|
|
@@ -49,22 +49,28 @@ ruleTester.run('a11y-prohibit-input-placeholder', rule, {
|
|
|
49
49
|
],
|
|
50
50
|
invalid: [
|
|
51
51
|
{ code: `import hoge from 'styled-components'`, errors: [ { message: `styled-components をimportする際は、名称が"styled" となるようにしてください。例: "import styled from 'styled-components'"` } ] },
|
|
52
|
-
{ code: `import { Input as InputHoge } from './hoge'`, errors: [ { message: `InputHogeを正規表現 "/Input$/" がmatch
|
|
53
|
-
|
|
54
|
-
{ code: `import {
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
{ code:
|
|
58
|
-
|
|
59
|
-
{ code:
|
|
60
|
-
|
|
61
|
-
{ code:
|
|
62
|
-
|
|
52
|
+
{ code: `import { Input as InputHoge } from './hoge'`, errors: [ { message: `InputHogeを正規表現 "/Input$/" がmatchする名称に変更してください。
|
|
53
|
+
- Inputが型の場合、'import type { Input as InputHoge }' もしくは 'import { type Input as InputHoge }' のように明示的に型であることを宣言してください。名称変更が不要になります` } ] },
|
|
54
|
+
{ code: `import { SearchInput as Hoge } from './hoge'`, errors: [ { message: `Hogeを正規表現 "/Input$/" がmatchする名称に変更してください。
|
|
55
|
+
- SearchInputが型の場合、'import type { SearchInput as Hoge }' もしくは 'import { type SearchInput as Hoge }' のように明示的に型であることを宣言してください。名称変更が不要になります` }, { message: `Hogeを正規表現 "/SearchInput$/" がmatchする名称に変更してください。
|
|
56
|
+
- SearchInputが型の場合、'import type { SearchInput as Hoge }' もしくは 'import { type SearchInput as Hoge }' のように明示的に型であることを宣言してください。名称変更が不要になります` } ] },
|
|
57
|
+
{ code: `import { HogeTextarea as HogeTextareaFuga } from './hoge'`, errors: [ { message: `HogeTextareaFugaを正規表現 "/Textarea$/" がmatchする名称に変更してください。
|
|
58
|
+
- HogeTextareaが型の場合、'import type { HogeTextarea as HogeTextareaFuga }' もしくは 'import { type HogeTextarea as HogeTextareaFuga }' のように明示的に型であることを宣言してください。名称変更が不要になります` } ] },
|
|
59
|
+
{ code: `import { HogeComboBox as ComboBoxFuga } from './hoge'`, errors: [ { message: `ComboBoxFugaを正規表現 "/ComboBox$/" がmatchする名称に変更してください。
|
|
60
|
+
- HogeComboBoxが型の場合、'import type { HogeComboBox as ComboBoxFuga }' もしくは 'import { type HogeComboBox as ComboBoxFuga }' のように明示的に型であることを宣言してください。名称変更が不要になります` } ] },
|
|
61
|
+
{ code: `import { DatePicker as HogeDatePickerFuga } from './hoge'`, errors: [ { message: `HogeDatePickerFugaを正規表現 "/DatePicker$/" がmatchする名称に変更してください。
|
|
62
|
+
- DatePickerが型の場合、'import type { DatePicker as HogeDatePickerFuga }' もしくは 'import { type DatePicker as HogeDatePickerFuga }' のように明示的に型であることを宣言してください。名称変更が不要になります` } ] },
|
|
63
|
+
{ code: 'const Hoge = styled.input``', errors: [ { message: `Hogeを正規表現 "/Input$/" がmatchする名称に変更してください。` } ] },
|
|
64
|
+
{ code: 'const Hoge = styled(StyledInput)``', errors: [ { message: `Hogeを正規表現 "/Input$/" がmatchする名称に変更してください。` } ] },
|
|
65
|
+
{ code: 'const Hoge = styled.textarea``', errors: [ { message: `Hogeを正規表現 "/Textarea$/" がmatchする名称に変更してください。` } ] },
|
|
66
|
+
{ code: 'const Hoge = styled(StyledTextarea)``', errors: [ { message: `Hogeを正規表現 "/Textarea$/" がmatchする名称に変更してください。` } ] },
|
|
67
|
+
{ code: 'const Hoge = styled(FieldSet)``', errors: [ { message: `Hogeを正規表現 "/FieldSet$/" がmatchする名称に変更してください。` } ] },
|
|
68
|
+
{ code: 'const Hoge = styled(ComboBox)``', errors: [ { message: `Hogeを正規表現 "/ComboBox$/" がmatchする名称に変更してください。` } ] },
|
|
63
69
|
{
|
|
64
70
|
code: 'const Hoge = styled(SearchInput)``',
|
|
65
71
|
errors: [
|
|
66
|
-
{ message: `Hogeを正規表現 "/Input$/" がmatch
|
|
67
|
-
{ message: `Hogeを正規表現 "/SearchInput$/" がmatch
|
|
72
|
+
{ message: `Hogeを正規表現 "/Input$/" がmatchする名称に変更してください。` },
|
|
73
|
+
{ message: `Hogeを正規表現 "/SearchInput$/" がmatchする名称に変更してください。` },
|
|
68
74
|
],
|
|
69
75
|
},
|
|
70
76
|
{ code: `<input placeholder />`, errors: [ { message: `input にはplaceholder属性は設定せず、別途ヒント用要素の利用を検討してください。(例: '<div><input /><Hint>ヒント</Hint></div>')` } ] },
|
|
@@ -39,21 +39,28 @@ ruleTester.run('a11y-trigger-has-button', rule, {
|
|
|
39
39
|
],
|
|
40
40
|
invalid: [
|
|
41
41
|
{ code: `import hoge from 'styled-components'`, errors: [ { message: `styled-components をimportする際は、名称が"styled" となるようにしてください。例: "import styled from 'styled-components'"` } ] },
|
|
42
|
-
{ code: `import { DropdownTrigger as Hoge } from './hoge'`, errors: [ { message: `Hogeを正規表現 "/DropdownTrigger$/" がmatch
|
|
43
|
-
|
|
44
|
-
{ code: `import {
|
|
45
|
-
|
|
46
|
-
{ code: `import {
|
|
47
|
-
|
|
48
|
-
{ code:
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
{ code:
|
|
52
|
-
|
|
53
|
-
{ code:
|
|
54
|
-
|
|
55
|
-
{ code: 'const Hoge = styled
|
|
56
|
-
{ code: 'const Hoge = styled
|
|
42
|
+
{ code: `import { DropdownTrigger as Hoge } from './hoge'`, errors: [ { message: `Hogeを正規表現 "/DropdownTrigger$/" がmatchする名称に変更してください。
|
|
43
|
+
- DropdownTriggerが型の場合、'import type { DropdownTrigger as Hoge }' もしくは 'import { type DropdownTrigger as Hoge }' のように明示的に型であることを宣言してください。名称変更が不要になります` } ] },
|
|
44
|
+
{ code: `import { DialogTrigger as Hoge } from './hoge'`, errors: [ { message: `Hogeを正規表現 "/DialogTrigger$/" がmatchする名称に変更してください。
|
|
45
|
+
- DialogTriggerが型の場合、'import type { DialogTrigger as Hoge }' もしくは 'import { type DialogTrigger as Hoge }' のように明示的に型であることを宣言してください。名称変更が不要になります` } ] },
|
|
46
|
+
{ code: `import { Button as Hoge } from './hoge'`, errors: [ { message: `Hogeを正規表現 "/Button$/" がmatchする名称に変更してください。
|
|
47
|
+
- Buttonが型の場合、'import type { Button as Hoge }' もしくは 'import { type Button as Hoge }' のように明示的に型であることを宣言してください。名称変更が不要になります` } ] },
|
|
48
|
+
{ code: `import { AbcAnchorButton as Hoge } from './hoge'`, errors: [ { message: `Hogeを正規表現 "/Button$/" がmatchする名称に変更してください。
|
|
49
|
+
- AbcAnchorButtonが型の場合、'import type { AbcAnchorButton as Hoge }' もしくは 'import { type AbcAnchorButton as Hoge }' のように明示的に型であることを宣言してください。名称変更が不要になります` }, { message: `Hogeを正規表現 "/AnchorButton$/" がmatchする名称に変更してください。
|
|
50
|
+
- AbcAnchorButtonが型の場合、'import type { AbcAnchorButton as Hoge }' もしくは 'import { type AbcAnchorButton as Hoge }' のように明示的に型であることを宣言してください。名称変更が不要になります` } ] },
|
|
51
|
+
{ code: `import { Anchor as Hoge } from './hoge'`, errors: [ { message: `Hogeを正規表現 "/Anchor$/" がmatchする名称に変更してください。
|
|
52
|
+
- Anchorが型の場合、'import type { Anchor as Hoge }' もしくは 'import { type Anchor as Hoge }' のように明示的に型であることを宣言してください。名称変更が不要になります` } ] },
|
|
53
|
+
{ code: `import { Link as Hoge } from './hoge'`, errors: [ { message: `Hogeを正規表現 "/Link$/" がmatchする名称に変更してください。
|
|
54
|
+
- Linkが型の場合、'import type { Link as Hoge }' もしくは 'import { type Link as Hoge }' のように明示的に型であることを宣言してください。名称変更が不要になります` } ] },
|
|
55
|
+
{ code: 'const Hoge = styled.button``', errors: [ { message: `Hogeを正規表現 "/Button$/" がmatchする名称に変更してください。` } ] },
|
|
56
|
+
{ code: 'const Hoge = styled.a``', errors: [ { message: `Hogeを正規表現 "/(Anchor|Link)$/" がmatchする名称に変更してください。` } ] },
|
|
57
|
+
{ code: 'const Hoge = styled(Button)``', errors: [ { message: `Hogeを正規表現 "/Button$/" がmatchする名称に変更してください。` } ] },
|
|
58
|
+
{ code: 'const Hoge = styled(AnchorButton)``', errors: [ { message: `Hogeを正規表現 "/Button$/" がmatchする名称に変更してください。` },{ message: `Hogeを正規表現 "/AnchorButton$/" がmatchする名称に変更してください。` } ] },
|
|
59
|
+
{ code: 'const Hoge = styled(ButtonAnchor)``', errors: [ { message: `Hogeを正規表現 "/ButtonAnchor$/" がmatchする名称に変更してください。` }, { message: `Hogeを正規表現 "/Anchor$/" がmatchする名称に変更してください。` } ] },
|
|
60
|
+
{ code: 'const Hoge = styled(Anchor)``', errors: [ { message: `Hogeを正規表現 "/Anchor$/" がmatchする名称に変更してください。` } ] },
|
|
61
|
+
{ code: 'const Hoge = styled(Link)``', errors: [ { message: `Hogeを正規表現 "/Link$/" がmatchする名称に変更してください。` } ] },
|
|
62
|
+
{ code: 'const Hoge = styled(DropdownTrigger)``', errors: [ { message: `Hogeを正規表現 "/DropdownTrigger$/" がmatchする名称に変更してください。` } ] },
|
|
63
|
+
{ code: 'const Hoge = styled(DialogTrigger)``', errors: [ { message: `Hogeを正規表現 "/DialogTrigger$/" がmatchする名称に変更してください。` } ] },
|
|
57
64
|
{ code: '<DropdownTrigger>ほげ</DropdownTrigger>', errors: [ { message: 'DropdownTrigger の直下にはbuttonコンポーネントのみ設置してください' } ] },
|
|
58
65
|
{ code: '<DialogTrigger><span><Button>ほげ</Button></span></DialogTrigger>', errors: [ { message: 'DialogTrigger の直下にはbuttonコンポーネントのみ設置してください' } ] },
|
|
59
66
|
{ code: '<DropdownTrigger><AnchorButton>ほげ</AnchorButton></DropdownTrigger>', errors: [ { message: 'DropdownTrigger の直下にはbuttonコンポーネントのみ設置してください' } ] },
|
|
@@ -24,8 +24,8 @@ ruleTester.run('best-practice-for-remote-trigger-dialog', rule, {
|
|
|
24
24
|
],
|
|
25
25
|
invalid: [
|
|
26
26
|
{ code: `import hoge from 'styled-components'`, errors: [ { message: `styled-components をimportする際は、名称が"styled" となるようにしてください。例: "import styled from 'styled-components'"` } ] },
|
|
27
|
-
{ code: 'const Hoge = styled(RemoteDialogTrigger)``', errors: [ { message: 'Hogeを正規表現 "/RemoteDialogTrigger$/" がmatch
|
|
28
|
-
{ code: 'const Fuga = styled(RemoteTriggerActionDialog)``', errors: [ { message: 'Fugaを正規表現 "/RemoteTrigger(.+)Dialog$/" がmatch
|
|
27
|
+
{ code: 'const Hoge = styled(RemoteDialogTrigger)``', errors: [ { message: 'Hogeを正規表現 "/RemoteDialogTrigger$/" がmatchする名称に変更してください。' } ] },
|
|
28
|
+
{ code: 'const Fuga = styled(RemoteTriggerActionDialog)``', errors: [ { message: 'Fugaを正規表現 "/RemoteTrigger(.+)Dialog$/" がmatchする名称に変更してください。' } ] },
|
|
29
29
|
{ code: '<RemoteDialogTrigger targetId={hoge}>open.</RemoteDialogTrigger>', errors: [ { message: `RemoteDialogTriggerのtargetId属性には直接文字列を指定してください。
|
|
30
30
|
- 変数などは利用できません（これは関連するTriggerとDialogを検索しやすくするためです）
|
|
31
31
|
- RemoteTriggerActionDialogはループやDropdown内にTriggerが存在する場合に利用してください
|