@dialpad/eslint-plugin-dialtone 1.5.0 → 1.7.0-beta.1
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/LICENSE +21 -0
- package/README.md +14 -8
- package/lib/rules/custom-implementation.js +2 -2
- package/lib/rules/deprecated-component.js +6 -6
- package/lib/rules/deprecated-directive.js +2 -2
- package/lib/rules/deprecated-icons.js +2 -2
- package/lib/rules/recommend-typography-style.js +49 -0
- package/package.json +17 -11
- package/.eslintrc.js +0 -23
- package/docs/rules/custom-implementation.md +0 -29
- package/docs/rules/deprecated-component.md +0 -37
- package/docs/rules/deprecated-directive.md +0 -31
- package/docs/rules/deprecated-icons.md +0 -39
- package/tests/lib/rules/custom-implementation.js +0 -44
- package/tests/lib/rules/deprecated-component.js +0 -123
- package/tests/lib/rules/deprecated-directive.js +0 -40
- package/tests/lib/rules/deprecated-icons.js +0 -72
package/LICENSE
ADDED
|
@@ -0,0 +1,21 @@
|
|
|
1
|
+
MIT License
|
|
2
|
+
|
|
3
|
+
Copyright (c) 2024 Dialpad
|
|
4
|
+
|
|
5
|
+
Permission is hereby granted, free of charge, to any person obtaining a copy
|
|
6
|
+
of this software and associated documentation files (the "Software"), to deal
|
|
7
|
+
in the Software without restriction, including without limitation the rights
|
|
8
|
+
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
|
|
9
|
+
copies of the Software, and to permit persons to whom the Software is
|
|
10
|
+
furnished to do so, subject to the following conditions:
|
|
11
|
+
|
|
12
|
+
The above copyright notice and this permission notice shall be included in all
|
|
13
|
+
copies or substantial portions of the Software.
|
|
14
|
+
|
|
15
|
+
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
|
16
|
+
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
|
17
|
+
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
|
18
|
+
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
|
19
|
+
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
|
20
|
+
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
|
21
|
+
SOFTWARE.
|
package/README.md
CHANGED
|
@@ -1,10 +1,18 @@
|
|
|
1
1
|
# eslint-plugin-dialtone
|
|
2
2
|
|
|
3
|
-
|
|
3
|
+
Dialtone ESLint plugin containing rules to help developers maintain dialtone recommended practices.
|
|
4
4
|
|
|
5
5
|
## Adding a new rule
|
|
6
6
|
|
|
7
|
-
We use yeoman generator to generate new rules
|
|
7
|
+
We use [yeoman generator](https://github.com/eslint/generator-eslint) to generate new rules.
|
|
8
|
+
|
|
9
|
+
First, install it globally:
|
|
10
|
+
|
|
11
|
+
```shell
|
|
12
|
+
pnpm add -g yo generator-eslint mem-fs
|
|
13
|
+
```
|
|
14
|
+
|
|
15
|
+
Then, run the command below and follow the steps.
|
|
8
16
|
|
|
9
17
|
```shell
|
|
10
18
|
yo eslint:rule
|
|
@@ -12,8 +20,8 @@ yo eslint:rule
|
|
|
12
20
|
|
|
13
21
|
### Writing rules
|
|
14
22
|
|
|
15
|
-
You can try the code you're trying to detect here: https://astexplorer.net/
|
|
16
|
-
inside `create` function.
|
|
23
|
+
You can try the code you're trying to detect here: [AST Explorer](https://astexplorer.net/)
|
|
24
|
+
to know which function you need to call inside `create` function.
|
|
17
25
|
|
|
18
26
|
## Installation
|
|
19
27
|
|
|
@@ -31,7 +39,8 @@ npm install @dialpad/eslint-plugin-dialtone --save-dev
|
|
|
31
39
|
|
|
32
40
|
## Usage
|
|
33
41
|
|
|
34
|
-
Add `@dialpad/dialtone` to the plugins section of your `.eslintrc` configuration file.
|
|
42
|
+
Add `@dialpad/dialtone` to the plugins section of your `.eslintrc` configuration file.
|
|
43
|
+
You can omit the `eslint-plugin-` prefix:
|
|
35
44
|
|
|
36
45
|
```json
|
|
37
46
|
{
|
|
@@ -41,7 +50,6 @@ Add `@dialpad/dialtone` to the plugins section of your `.eslintrc` configuration
|
|
|
41
50
|
}
|
|
42
51
|
```
|
|
43
52
|
|
|
44
|
-
|
|
45
53
|
Then configure the rules you want to use under the rules section.
|
|
46
54
|
|
|
47
55
|
```json
|
|
@@ -55,5 +63,3 @@ Then configure the rules you want to use under the rules section.
|
|
|
55
63
|
## Supported Rules
|
|
56
64
|
|
|
57
65
|
* Fill in provided rules here
|
|
58
|
-
|
|
59
|
-
|
|
@@ -15,12 +15,12 @@ module.exports = {
|
|
|
15
15
|
docs: {
|
|
16
16
|
description: "Detects custom dialtone icons implementations",
|
|
17
17
|
recommended: false,
|
|
18
|
-
url: 'https://github.com/dialpad/eslint-plugin-dialtone/
|
|
18
|
+
url: 'https://github.com/dialpad/dialtone/blob/staging/packages/eslint-plugin-dialtone/docs/rules/custom-implementation.md', // URL to the documentation page for this rule
|
|
19
19
|
},
|
|
20
20
|
fixable: null, // Or `code` or `whitespace`
|
|
21
21
|
schema: [], // Add a schema if the rule has options
|
|
22
22
|
messages: {
|
|
23
|
-
avoidRequireContext: 'Avoid custom dialtone icons implementation. Use DtIcon component instead https://
|
|
23
|
+
avoidRequireContext: 'Avoid custom dialtone icons implementation. Use DtIcon component instead https://dialtone.dialpad.com/vue/?path=/docs/components-icon--default',
|
|
24
24
|
avoidCustomImport: 'Avoid importing dialtone icons with custom webpack alias'
|
|
25
25
|
}
|
|
26
26
|
},
|
|
@@ -17,7 +17,7 @@ module.exports = {
|
|
|
17
17
|
docs: {
|
|
18
18
|
description: "Detects usages of deprecated components that should be replaced by Dialtone Vue components",
|
|
19
19
|
recommended: false,
|
|
20
|
-
url: 'https://github.com/dialpad/eslint-plugin-dialtone/
|
|
20
|
+
url: 'https://github.com/dialpad/dialtone/blob/staging/packages/eslint-plugin-dialtone/docs/rules/deprecated-component.md', // URL to the documentation page for this rule
|
|
21
21
|
},
|
|
22
22
|
fixable: null, // Or `code` or `whitespace`
|
|
23
23
|
schema: [], // Add a schema if the rule has options
|
|
@@ -32,31 +32,31 @@ module.exports = {
|
|
|
32
32
|
fileName: 'select_menu',
|
|
33
33
|
componentName: 'SelectMenu',
|
|
34
34
|
replacement: 'DtComboboxWithPopover',
|
|
35
|
-
link: 'https://
|
|
35
|
+
link: 'https://dialtone.dialpad.com/vue/?path=/story/recipes-comboboxes-combobox-with-popover--default'
|
|
36
36
|
},
|
|
37
37
|
{
|
|
38
38
|
fileName: 'dropdown_menu',
|
|
39
39
|
componentName: 'DropdownMenu',
|
|
40
40
|
replacement: 'DtSelectMenu',
|
|
41
|
-
link: 'https://
|
|
41
|
+
link: 'https://dialtone.dialpad.com/vue/?path=/story/components-select-menu--default'
|
|
42
42
|
},
|
|
43
43
|
{
|
|
44
44
|
fileName: 'base_toggle',
|
|
45
45
|
componentName: 'BaseToggle',
|
|
46
46
|
replacement: 'DtToggle',
|
|
47
|
-
link: 'https://
|
|
47
|
+
link: 'https://dialtone.dialpad.com/vue/?path=/story/components-toggle--default'
|
|
48
48
|
},
|
|
49
49
|
{
|
|
50
50
|
fileName: 'base_date_picker',
|
|
51
51
|
componentName: 'BaseDatePicker',
|
|
52
52
|
replacement: 'DtDatepicker',
|
|
53
|
-
link: 'https://
|
|
53
|
+
link: 'https://dialtone.dialpad.com/vue/?path=/story/components-datepicker--default'
|
|
54
54
|
},
|
|
55
55
|
{
|
|
56
56
|
fileName: 'checkbox',
|
|
57
57
|
componentName: 'Checkbox',
|
|
58
58
|
replacement: 'DtCheckbox',
|
|
59
|
-
link: 'https://
|
|
59
|
+
link: 'https://dialtone.dialpad.com/vue/?path=/story/components-checkbox--default'
|
|
60
60
|
}
|
|
61
61
|
]
|
|
62
62
|
|
|
@@ -15,7 +15,7 @@ module.exports = {
|
|
|
15
15
|
description:
|
|
16
16
|
'Detects usages of deprecated vue directives that should be replaced by Dialtone Vue directives',
|
|
17
17
|
recommended: false,
|
|
18
|
-
url: 'https://github.com/dialpad/eslint-plugin-dialtone/
|
|
18
|
+
url: 'https://github.com/dialpad/dialtone/blob/staging/packages/eslint-plugin-dialtone/docs/rules/deprecated-directive.md', // URL to the documentation page for this rule
|
|
19
19
|
},
|
|
20
20
|
fixable: null, // Or `code` or `whitespace`
|
|
21
21
|
schema: [], // Add a schema if the rule has options
|
|
@@ -30,7 +30,7 @@ module.exports = {
|
|
|
30
30
|
{
|
|
31
31
|
directiveName: 'tooltip',
|
|
32
32
|
replacement: 'dt-tooltip',
|
|
33
|
-
link: 'https://
|
|
33
|
+
link: 'https://dialtone.dialpad.com/vue/?path=/docs/directives-tooltip--docs',
|
|
34
34
|
},
|
|
35
35
|
];
|
|
36
36
|
|
|
@@ -15,12 +15,12 @@ module.exports = {
|
|
|
15
15
|
docs: {
|
|
16
16
|
description: 'Finds deprecated svg and vue icon imports from dialtone',
|
|
17
17
|
recommended: false,
|
|
18
|
-
url: 'https://github.com/dialpad/eslint-plugin-dialtone/
|
|
18
|
+
url: 'https://github.com/dialpad/dialtone/blob/staging/packages/eslint-plugin-dialtone/docs/rules/deprecated-icons.md', // URL to the documentation page for this rule
|
|
19
19
|
},
|
|
20
20
|
fixable: null, // Or `code` or `whitespace`
|
|
21
21
|
schema: [], // Add a schema if the rule has options
|
|
22
22
|
messages: {
|
|
23
|
-
avoidDeprecatedImport: 'Avoid usage of old dialtone icons [deprecated]. Check https://dialpad.
|
|
23
|
+
avoidDeprecatedImport: 'Avoid usage of old dialtone icons [deprecated]. Check https://dialtone.dialpad.com/components/icon.html for details.',
|
|
24
24
|
},
|
|
25
25
|
},
|
|
26
26
|
create(context) {
|
|
@@ -0,0 +1,49 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* @fileoverview Utilities to set Font family, Font weight, Font size, and Line height separately are discouraged in favor of composed typography utilities
|
|
3
|
+
* @author Nina Repetto
|
|
4
|
+
*/
|
|
5
|
+
"use strict";
|
|
6
|
+
|
|
7
|
+
//------------------------------------------------------------------------------
|
|
8
|
+
// Rule Definition
|
|
9
|
+
//------------------------------------------------------------------------------
|
|
10
|
+
|
|
11
|
+
module.exports = {
|
|
12
|
+
meta: {
|
|
13
|
+
type: 'suggestion', // `problem`, `suggestion`, or `layout`
|
|
14
|
+
docs: {
|
|
15
|
+
description: "Utilities to set Font family, Font weight, Font size, and Line height separately are discouraged in favor of composed typography utilities",
|
|
16
|
+
recommended: false,
|
|
17
|
+
url: 'https://github.com/dialpad/dialtone/blob/staging/packages/eslint-plugin-dialtone/docs/rules/recommend-typography-style.md', // URL to the documentation page for this rule
|
|
18
|
+
},
|
|
19
|
+
fixable: null, // Or `code` or `whitespace`
|
|
20
|
+
schema: [], // Add a schema if the rule has options
|
|
21
|
+
messages: {
|
|
22
|
+
recommendTypographyStyle: `Utilities to set Font family, Font weight, Font size, and Line height separately are
|
|
23
|
+
discouraged in favor of composed typography utilities. Checkout the available classes here:
|
|
24
|
+
https://dialtone.dialpad.com/design/typography/#api. There can be cases where using these utilities is intentional and valid,
|
|
25
|
+
in which case you can ignore this lint warning.`,
|
|
26
|
+
}, // Add messageId and message
|
|
27
|
+
},
|
|
28
|
+
|
|
29
|
+
create(context) {
|
|
30
|
+
return context.parserServices.defineTemplateBodyVisitor({
|
|
31
|
+
// Visitor functions for Vue templates
|
|
32
|
+
VAttribute(node) {
|
|
33
|
+
if (node.key.name === 'class') {
|
|
34
|
+
const classes = node.value.value.split(' ');
|
|
35
|
+
const typographyClasses = ['d-fs', 'd-fw', 'd-lh', 'd-ff'];
|
|
36
|
+
const typographyClassesFound = classes.filter((className) =>
|
|
37
|
+
typographyClasses.some((typographyClass) => className.includes(typographyClass))
|
|
38
|
+
);
|
|
39
|
+
if (typographyClassesFound.length > 0) {
|
|
40
|
+
context.report({
|
|
41
|
+
node: node,
|
|
42
|
+
messageId: 'recommendTypographyStyle',
|
|
43
|
+
});
|
|
44
|
+
}
|
|
45
|
+
}
|
|
46
|
+
}
|
|
47
|
+
});
|
|
48
|
+
}
|
|
49
|
+
};
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@dialpad/eslint-plugin-dialtone",
|
|
3
|
-
"version": "1.
|
|
3
|
+
"version": "1.7.0-beta.1",
|
|
4
4
|
"description": "dialtone eslint plugin",
|
|
5
5
|
"keywords": [
|
|
6
6
|
"Dialpad",
|
|
@@ -29,27 +29,27 @@
|
|
|
29
29
|
"name": "Ignacio Ropolo",
|
|
30
30
|
"email": "ignacio.ropolo@dialpad.com",
|
|
31
31
|
"url": "https://github.com/iropolo"
|
|
32
|
+
},
|
|
33
|
+
{
|
|
34
|
+
"name": "Nina Repetto",
|
|
35
|
+
"email": "nina.repetto@dialpad.com",
|
|
36
|
+
"url": "https://github.com/ninamarina"
|
|
32
37
|
}
|
|
33
38
|
],
|
|
34
|
-
"repository": "git@github.com:dialpad/eslint-plugin-dialtone.git",
|
|
35
39
|
"bugs": {
|
|
36
40
|
"email": "dialtone@dialpad.com"
|
|
37
41
|
},
|
|
38
42
|
"license": "MIT",
|
|
39
43
|
"main": "./lib/index.js",
|
|
44
|
+
"files": [
|
|
45
|
+
"lib"
|
|
46
|
+
],
|
|
40
47
|
"exports": "./lib/index.js",
|
|
41
|
-
"scripts": {
|
|
42
|
-
"lint": "eslint .",
|
|
43
|
-
"test": "mocha tests --recursive"
|
|
44
|
-
},
|
|
45
48
|
"dependencies": {
|
|
46
49
|
"requireindex": "^1.2.0"
|
|
47
50
|
},
|
|
48
51
|
"devDependencies": {
|
|
49
|
-
"eslint": "^
|
|
50
|
-
"eslint-plugin-eslint-plugin": "^5.0.0",
|
|
51
|
-
"eslint-plugin-node": "^11.1.0",
|
|
52
|
-
"eslint-plugin-vue": "^9.17.0",
|
|
52
|
+
"eslint-plugin-eslint-plugin": "^5.2.1",
|
|
53
53
|
"mocha": "^10.0.0"
|
|
54
54
|
},
|
|
55
55
|
"engines": {
|
|
@@ -57,5 +57,11 @@
|
|
|
57
57
|
},
|
|
58
58
|
"peerDependencies": {
|
|
59
59
|
"eslint": ">=7"
|
|
60
|
+
},
|
|
61
|
+
"scripts": {
|
|
62
|
+
"lint": "run-s lint:docs lint:code",
|
|
63
|
+
"lint:code": "eslint '**/*.js'",
|
|
64
|
+
"lint:docs": "markdownlint 'docs/**/*.md'",
|
|
65
|
+
"test": "mocha tests --recursive"
|
|
60
66
|
}
|
|
61
|
-
}
|
|
67
|
+
}
|
package/.eslintrc.js
DELETED
|
@@ -1,23 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
|
|
3
|
-
module.exports = {
|
|
4
|
-
root: true,
|
|
5
|
-
extends: [
|
|
6
|
-
"eslint:recommended",
|
|
7
|
-
"plugin:eslint-plugin/recommended",
|
|
8
|
-
"plugin:node/recommended",
|
|
9
|
-
],
|
|
10
|
-
parserOptions: {
|
|
11
|
-
ecmaVersion: 'latest',
|
|
12
|
-
parser: "vue-eslint-parser"
|
|
13
|
-
},
|
|
14
|
-
env: {
|
|
15
|
-
node: true,
|
|
16
|
-
},
|
|
17
|
-
overrides: [
|
|
18
|
-
{
|
|
19
|
-
files: ["tests/**/*.js"],
|
|
20
|
-
env: { mocha: true },
|
|
21
|
-
},
|
|
22
|
-
],
|
|
23
|
-
};
|
|
@@ -1,29 +0,0 @@
|
|
|
1
|
-
# Detects custom dialtone icons implementations (custom-implementation)
|
|
2
|
-
|
|
3
|
-
We detected some custom implementations of vue icons.
|
|
4
|
-
|
|
5
|
-
## Rule Details
|
|
6
|
-
|
|
7
|
-
This rule aims to detect and prevent custom implementations using require.context and @dIcon, @dSpot
|
|
8
|
-
|
|
9
|
-
Examples of **incorrect** code for this rule:
|
|
10
|
-
|
|
11
|
-
```js
|
|
12
|
-
import SpotFileUpload from '@dSpot/SpotFileUpload';
|
|
13
|
-
import IconDynamicLayout from '@dIcon/IconDynamicLayout';
|
|
14
|
-
```
|
|
15
|
-
|
|
16
|
-
```js
|
|
17
|
-
const requireIcon = require.context(
|
|
18
|
-
'@dialpad/dialtone/lib/dist/vue/icons',
|
|
19
|
-
false,
|
|
20
|
-
/.*\\.vue$/,
|
|
21
|
-
);
|
|
22
|
-
```
|
|
23
|
-
|
|
24
|
-
Examples of **correct** code for this rule:
|
|
25
|
-
|
|
26
|
-
```js
|
|
27
|
-
import { DtIcon } from '@dialpad/dialtone-vue';
|
|
28
|
-
<dt-icon name="settings" />
|
|
29
|
-
```
|
|
@@ -1,37 +0,0 @@
|
|
|
1
|
-
# Finds deprecated components that should be replaced by Dialtone Vue components
|
|
2
|
-
|
|
3
|
-
## Rule Details
|
|
4
|
-
|
|
5
|
-
This informs developers of deprecated product side components that should be replaced by Dialtone Vue components. It will suggest a replacement component.
|
|
6
|
-
|
|
7
|
-
Currently the components with the below filenames are considered deprecated:
|
|
8
|
-
|
|
9
|
-
- select_menu
|
|
10
|
-
- dropdown_menu
|
|
11
|
-
- base_toggle
|
|
12
|
-
- base_date_picker
|
|
13
|
-
- checkbox
|
|
14
|
-
|
|
15
|
-
This rule specifically targets components in ubervoice. If you are using Dialtone Vue outside of ubervoice you should not enable this rule.
|
|
16
|
-
|
|
17
|
-
Examples of **incorrect** code for this rule:
|
|
18
|
-
|
|
19
|
-
**import of a deprecated component**:
|
|
20
|
-
|
|
21
|
-
```js
|
|
22
|
-
import SelectMenu from '../components/select_menu.vue';
|
|
23
|
-
```
|
|
24
|
-
|
|
25
|
-
Examples of **correct** code for this rule:
|
|
26
|
-
|
|
27
|
-
**import of a Dialtone Vue component**:
|
|
28
|
-
|
|
29
|
-
```js
|
|
30
|
-
import { DtComboboxWithPopover } from '@dialpad/dialtone-vue';
|
|
31
|
-
```
|
|
32
|
-
|
|
33
|
-
**import of a custom local component**:
|
|
34
|
-
|
|
35
|
-
```js
|
|
36
|
-
import MyComponent from './my_component.vue';
|
|
37
|
-
```
|
|
@@ -1,31 +0,0 @@
|
|
|
1
|
-
# Finds deprecated directives that should be replaced by Dialtone Vue directives
|
|
2
|
-
|
|
3
|
-
## Rule Details
|
|
4
|
-
|
|
5
|
-
This informs developers of deprecated product side directives that should be replaced by Dialtone Vue directives. It will suggest a replacement directive.
|
|
6
|
-
|
|
7
|
-
Currently the directives with the below attribute names are considered deprecated:
|
|
8
|
-
|
|
9
|
-
- v-tooltip
|
|
10
|
-
|
|
11
|
-
This rule specifically targets components in ubervoice. If you are using Dialtone Vue outside of ubervoice you may want to disable this rule.
|
|
12
|
-
|
|
13
|
-
Examples of **incorrect** code for this rule:
|
|
14
|
-
|
|
15
|
-
**usage of a deprecated directive**:
|
|
16
|
-
|
|
17
|
-
```html
|
|
18
|
-
<template>
|
|
19
|
-
<button v-tooltip="tooltipText">Hover</button>
|
|
20
|
-
</template>
|
|
21
|
-
```
|
|
22
|
-
|
|
23
|
-
Examples of **correct** code for this rule:
|
|
24
|
-
|
|
25
|
-
**usage of the correct replacement directive**:
|
|
26
|
-
|
|
27
|
-
```html
|
|
28
|
-
<template>
|
|
29
|
-
<button v-dt-tooltip="tooltipText">Hover</button>
|
|
30
|
-
</template>
|
|
31
|
-
```
|
|
@@ -1,39 +0,0 @@
|
|
|
1
|
-
# Finds deprecated dialtone svg and vue icons usage (deprecated-icons)
|
|
2
|
-
|
|
3
|
-
We separated icons from dialtone into dialtone-icons repo,
|
|
4
|
-
so we are deprecating old svg and vue icons on dialtone once the migrations are finished.
|
|
5
|
-
|
|
6
|
-
## Rule Details
|
|
7
|
-
|
|
8
|
-
This rule aims to inform developers that they're importing icons from dialtone instead of dialtone-icons.
|
|
9
|
-
|
|
10
|
-
Examples of **incorrect** code for this rule:
|
|
11
|
-
|
|
12
|
-
```js
|
|
13
|
-
import svgLockIcon from '@dialpad/dialtone/lib/build/svg/system/lock.svg';
|
|
14
|
-
import svgLockIcon from '../node_modules/@dialpad/dialtone/lib/dist/svg/system/lock.svg';
|
|
15
|
-
import IconSettings from '@dialpad/dialtone/vue/icons/IconSettings';
|
|
16
|
-
import IconSettings from '../node_modules/@dialpad/dialtone/vue/icons/IconSettings';
|
|
17
|
-
```
|
|
18
|
-
|
|
19
|
-
Examples of **correct** code for this rule:
|
|
20
|
-
|
|
21
|
-
**If you can't use vue**:
|
|
22
|
-
```js
|
|
23
|
-
import svgLockIcon from '@dialpad/dialtone-icons/dist/svg/lock.svg';
|
|
24
|
-
```
|
|
25
|
-
|
|
26
|
-
**If you can use vue**
|
|
27
|
-
```js
|
|
28
|
-
import { DtIcon } from '@dialpad/dialtone-vue';
|
|
29
|
-
<dt-icon name="lock" />
|
|
30
|
-
```
|
|
31
|
-
|
|
32
|
-
## Exceptions
|
|
33
|
-
|
|
34
|
-
For now, we are allowing the importing of `brand` and `spot illustrations` icons from dialtone, so this rule will not trigger if you import an
|
|
35
|
-
icon like:
|
|
36
|
-
|
|
37
|
-
```js
|
|
38
|
-
import dialpadAiIcon from '../../node_modules/@dialpad/dialtone/lib/build/svg/brand/dialpad-ai.svg';
|
|
39
|
-
```
|
|
@@ -1,44 +0,0 @@
|
|
|
1
|
-
/**
|
|
2
|
-
* @fileoverview Detects custom dialtone icons implementations
|
|
3
|
-
* @author julio ortega
|
|
4
|
-
*/
|
|
5
|
-
"use strict";
|
|
6
|
-
|
|
7
|
-
//------------------------------------------------------------------------------
|
|
8
|
-
// Requirements
|
|
9
|
-
//------------------------------------------------------------------------------
|
|
10
|
-
|
|
11
|
-
const rule = require("../../../lib/rules/custom-implementation"),
|
|
12
|
-
RuleTester = require("eslint").RuleTester;
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
//------------------------------------------------------------------------------
|
|
16
|
-
// Tests
|
|
17
|
-
//------------------------------------------------------------------------------
|
|
18
|
-
|
|
19
|
-
const ruleTester = new RuleTester({parserOptions: {sourceType: 'module', ecmaVersion: 'latest'}});
|
|
20
|
-
ruleTester.run("custom-implementation", rule, {
|
|
21
|
-
valid: [
|
|
22
|
-
{
|
|
23
|
-
name: 'Dialtone-vue DtIcon import',
|
|
24
|
-
code: "import { DtIcon } from '@dialpad/dialtone-vue';",
|
|
25
|
-
},
|
|
26
|
-
],
|
|
27
|
-
|
|
28
|
-
invalid: [
|
|
29
|
-
{
|
|
30
|
-
name: 'require context',
|
|
31
|
-
code: "const requireIcon = require.context(\n" +
|
|
32
|
-
" '@dialpad/dialtone/lib/dist/vue/icons',\n" +
|
|
33
|
-
" false,\n" +
|
|
34
|
-
" /.*\\.vue$/\n" +
|
|
35
|
-
");",
|
|
36
|
-
errors: [{messageId: 'avoidRequireContext'}],
|
|
37
|
-
},
|
|
38
|
-
{
|
|
39
|
-
name: 'custom import',
|
|
40
|
-
code: 'import SpotFileUpload from \'@dSpot/SpotFileUpload\';',
|
|
41
|
-
errors: [{messageId: 'avoidCustomImport'}],
|
|
42
|
-
},
|
|
43
|
-
],
|
|
44
|
-
});
|
|
@@ -1,123 +0,0 @@
|
|
|
1
|
-
/**
|
|
2
|
-
* @fileoverview Detects usages of old dialpad product side components which should be replaced by Dialtone components.
|
|
3
|
-
* @author Brad Paugh
|
|
4
|
-
*/
|
|
5
|
-
"use strict";
|
|
6
|
-
|
|
7
|
-
//------------------------------------------------------------------------------
|
|
8
|
-
// Requirements
|
|
9
|
-
//------------------------------------------------------------------------------
|
|
10
|
-
|
|
11
|
-
const rule = require("../../../lib/rules/deprecated-component"), RuleTester = require("eslint").RuleTester;
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
//------------------------------------------------------------------------------
|
|
15
|
-
// Tests
|
|
16
|
-
//------------------------------------------------------------------------------
|
|
17
|
-
|
|
18
|
-
const ruleTester = new RuleTester({parserOptions: {sourceType: 'module', ecmaVersion: 'latest'}});
|
|
19
|
-
ruleTester.run("deprecated-component", rule, {
|
|
20
|
-
valid: [
|
|
21
|
-
{
|
|
22
|
-
name: 'Non deprecated component',
|
|
23
|
-
code: "import MyComponent from './my_component';",
|
|
24
|
-
},
|
|
25
|
-
{
|
|
26
|
-
name: 'Component that contains select_menu in the filename, but is not the file we are looking for',
|
|
27
|
-
code: "import SelectMenuOption from '../components/select_menu_option';",
|
|
28
|
-
},
|
|
29
|
-
],
|
|
30
|
-
|
|
31
|
-
invalid: [
|
|
32
|
-
{
|
|
33
|
-
name: 'Deprecated SelectMenu',
|
|
34
|
-
code: "import SelectMenu from '../components/select_menu';",
|
|
35
|
-
errors: [
|
|
36
|
-
{
|
|
37
|
-
messageId: "deprecatedComponent"
|
|
38
|
-
}
|
|
39
|
-
],
|
|
40
|
-
},
|
|
41
|
-
{
|
|
42
|
-
name: 'Deprecated SelectMenu .vue',
|
|
43
|
-
code: "import SelectMenu from '../components/select_menu.vue';",
|
|
44
|
-
errors: [
|
|
45
|
-
{
|
|
46
|
-
messageId: "deprecatedComponent"
|
|
47
|
-
}
|
|
48
|
-
],
|
|
49
|
-
},
|
|
50
|
-
{
|
|
51
|
-
name: 'Deprecated DropdownMenu',
|
|
52
|
-
code: "import DropdownMenu from '../components/dropdown_menu';",
|
|
53
|
-
errors: [
|
|
54
|
-
{
|
|
55
|
-
messageId: "deprecatedComponent"
|
|
56
|
-
}
|
|
57
|
-
],
|
|
58
|
-
},
|
|
59
|
-
{
|
|
60
|
-
name: 'Deprecated DropdownMenu .vue',
|
|
61
|
-
code: "import DropdownMenu from '../components/dropdown_menu.vue';",
|
|
62
|
-
errors: [
|
|
63
|
-
{
|
|
64
|
-
messageId: "deprecatedComponent"
|
|
65
|
-
}
|
|
66
|
-
],
|
|
67
|
-
},
|
|
68
|
-
{
|
|
69
|
-
name: 'Deprecated BaseToggle',
|
|
70
|
-
code: "import BaseToggle from '../components/base_toggle';",
|
|
71
|
-
errors: [
|
|
72
|
-
{
|
|
73
|
-
messageId: "deprecatedComponent"
|
|
74
|
-
}
|
|
75
|
-
],
|
|
76
|
-
},
|
|
77
|
-
{
|
|
78
|
-
name: 'Deprecated BaseToggle .vue',
|
|
79
|
-
code: "import BaseToggle from '../components/base_toggle.vue';",
|
|
80
|
-
errors: [
|
|
81
|
-
{
|
|
82
|
-
messageId: "deprecatedComponent"
|
|
83
|
-
}
|
|
84
|
-
],
|
|
85
|
-
},
|
|
86
|
-
{
|
|
87
|
-
name: 'Deprecated BaseDatePicker',
|
|
88
|
-
code: "import BaseDatePicker from '../components/base_date_picker';",
|
|
89
|
-
errors: [
|
|
90
|
-
{
|
|
91
|
-
messageId: "deprecatedComponent"
|
|
92
|
-
}
|
|
93
|
-
],
|
|
94
|
-
},
|
|
95
|
-
{
|
|
96
|
-
name: 'Deprecated BaseDatePicker .vue',
|
|
97
|
-
code: "import BaseDatePicker from '../components/base_date_picker.vue';",
|
|
98
|
-
errors: [
|
|
99
|
-
{
|
|
100
|
-
messageId: "deprecatedComponent"
|
|
101
|
-
}
|
|
102
|
-
],
|
|
103
|
-
},
|
|
104
|
-
{
|
|
105
|
-
name: 'Deprecated Checkbox',
|
|
106
|
-
code: "import Checkbox from '../components/checkbox';",
|
|
107
|
-
errors: [
|
|
108
|
-
{
|
|
109
|
-
messageId: "deprecatedComponent"
|
|
110
|
-
}
|
|
111
|
-
],
|
|
112
|
-
},
|
|
113
|
-
{
|
|
114
|
-
name: 'Deprecated Checkbox .vue',
|
|
115
|
-
code: "import Checkbox from '../components/checkbox.vue';",
|
|
116
|
-
errors: [
|
|
117
|
-
{
|
|
118
|
-
messageId: "deprecatedComponent"
|
|
119
|
-
}
|
|
120
|
-
],
|
|
121
|
-
},
|
|
122
|
-
],
|
|
123
|
-
});
|
|
@@ -1,40 +0,0 @@
|
|
|
1
|
-
/**
|
|
2
|
-
* @fileoverview Detects usages of old dialpad product side components which should be replaced by Dialtone components.
|
|
3
|
-
* @author Brad Paugh
|
|
4
|
-
*/
|
|
5
|
-
"use strict";
|
|
6
|
-
|
|
7
|
-
//------------------------------------------------------------------------------
|
|
8
|
-
// Requirements
|
|
9
|
-
//------------------------------------------------------------------------------
|
|
10
|
-
|
|
11
|
-
const rule = require("../../../lib/rules/deprecated-directive"), RuleTester = require("eslint").RuleTester;
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
//------------------------------------------------------------------------------
|
|
15
|
-
// Tests
|
|
16
|
-
//------------------------------------------------------------------------------
|
|
17
|
-
const ruleTester = new RuleTester({
|
|
18
|
-
parser: require.resolve('vue-eslint-parser'),
|
|
19
|
-
parserOptions: { ecmaVersion: 'latest' }
|
|
20
|
-
})
|
|
21
|
-
ruleTester.run("deprecated-directive", rule, {
|
|
22
|
-
valid: [
|
|
23
|
-
{
|
|
24
|
-
name: 'Non deprecated directive',
|
|
25
|
-
code: "<template><dt-button v-dt-tooltip=\"'tooltip'\" /></template>",
|
|
26
|
-
},
|
|
27
|
-
],
|
|
28
|
-
|
|
29
|
-
invalid: [
|
|
30
|
-
{
|
|
31
|
-
name: 'Deprecated directive',
|
|
32
|
-
code: "<template><button v-tooltip=\"'tooltip'\" /></template>",
|
|
33
|
-
errors: [
|
|
34
|
-
{
|
|
35
|
-
messageId: "deprecatedDirective"
|
|
36
|
-
}
|
|
37
|
-
],
|
|
38
|
-
},
|
|
39
|
-
],
|
|
40
|
-
});
|
|
@@ -1,72 +0,0 @@
|
|
|
1
|
-
/**
|
|
2
|
-
* @fileoverview Finds old dialtone svg icons usage
|
|
3
|
-
* @author julio ortega
|
|
4
|
-
*/
|
|
5
|
-
"use strict";
|
|
6
|
-
|
|
7
|
-
//------------------------------------------------------------------------------
|
|
8
|
-
// Requirements
|
|
9
|
-
//------------------------------------------------------------------------------
|
|
10
|
-
|
|
11
|
-
const rule = require("../../../lib/rules/deprecated-icons"), RuleTester = require("eslint").RuleTester;
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
//------------------------------------------------------------------------------
|
|
15
|
-
// Tests
|
|
16
|
-
//------------------------------------------------------------------------------
|
|
17
|
-
|
|
18
|
-
const ruleTester = new RuleTester({parserOptions: {sourceType: 'module', ecmaVersion: 'latest'}});
|
|
19
|
-
ruleTester.run("deprecated-icons", rule, {
|
|
20
|
-
valid: [
|
|
21
|
-
{
|
|
22
|
-
name: 'New icon import',
|
|
23
|
-
code: "import svgLockIcon from '@dialpad/dialtone-icons/dist/svg/lock.svg';",
|
|
24
|
-
},
|
|
25
|
-
{
|
|
26
|
-
name: 'Brand SVG icon import',
|
|
27
|
-
code: "import dialpadAiIcon from '../../node_modules/@dialpad/dialtone/lib/build/svg/brand/dialpad-ai.svg';",
|
|
28
|
-
},
|
|
29
|
-
{
|
|
30
|
-
name: 'Brand VUE icon import',
|
|
31
|
-
code: "import IconDialpadAi from '@dialpad/dialtone/vue/icons/IconDialpadAi';",
|
|
32
|
-
},
|
|
33
|
-
{
|
|
34
|
-
name: 'Spot illustration import',
|
|
35
|
-
code: "import SpotBrowserTableGraph from '@dialpad/dialtone/vue/spot/SpotBrowserTableGraph';",
|
|
36
|
-
},
|
|
37
|
-
{
|
|
38
|
-
name: 'Dialtone Styles import',
|
|
39
|
-
code: "import dialtoneCSS from '@dialpad/dialtone/lib/build/less/dialtone.less';",
|
|
40
|
-
}
|
|
41
|
-
],
|
|
42
|
-
|
|
43
|
-
invalid: [
|
|
44
|
-
{
|
|
45
|
-
name: 'Old SVG icon import from build',
|
|
46
|
-
code: "import svgLockIcon from '../node_modules/@dialpad/dialtone/lib/build/svg/system/lock.svg';",
|
|
47
|
-
errors: [
|
|
48
|
-
{
|
|
49
|
-
messageId: "avoidDeprecatedImport"
|
|
50
|
-
}
|
|
51
|
-
],
|
|
52
|
-
},
|
|
53
|
-
{
|
|
54
|
-
name: 'Old SVG icon import from dist',
|
|
55
|
-
code: "import svgLockIcon from '../node_modules/@dialpad/dialtone/lib/dist/svg/system/lock.svg';",
|
|
56
|
-
errors: [
|
|
57
|
-
{
|
|
58
|
-
messageId: "avoidDeprecatedImport"
|
|
59
|
-
}
|
|
60
|
-
],
|
|
61
|
-
},
|
|
62
|
-
{
|
|
63
|
-
name: 'Old VUE icon import',
|
|
64
|
-
code: "import IconSettings from '@dialpad/dialtone/vue/icons/IconSettings';",
|
|
65
|
-
errors: [
|
|
66
|
-
{
|
|
67
|
-
messageId: "avoidDeprecatedImport"
|
|
68
|
-
}
|
|
69
|
-
],
|
|
70
|
-
},
|
|
71
|
-
],
|
|
72
|
-
});
|