@adyen/eslint-plugin-bento 2.23.0 → 2.24.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.
Files changed (82) hide show
  1. package/CHANGELOG.md +23 -0
  2. package/README.md +31 -15
  3. package/configs/vue-recommended.js +15 -0
  4. package/configs/vue-strict.js +15 -0
  5. package/index.js +3 -0
  6. package/package.json +1 -1
  7. package/rules/deprecation-bento-tag-variant-enum/README.md +69 -0
  8. package/rules/deprecation-bento-tag-variant-enum/deprecation-bento-tag-variant-enum.js +167 -0
  9. package/rules/vue-no-redundant-dialog-v-if/README.md +55 -0
  10. package/rules/vue-no-redundant-dialog-v-if/vue-no-redundant-dialog-v-if.js +150 -0
  11. package/rules/vue-no-use-bento-translation-overrides/README.md +14 -0
  12. package/rules/vue-no-use-bento-translation-overrides/vue-no-use-bento-translation-overrides.js +93 -0
  13. package/rules/deprecation-bento-data-grid-cell-action-menu-item-handler/__tests__/deprecation-bento-data-grid-cell-action-menu-item-handler.vue +0 -63
  14. package/rules/deprecation-bento-data-grid-cell-action-menu-item-handler/__tests__/eslint.config.js +0 -26
  15. package/rules/deprecation-bento-data-grid-cell-action-menu-item-handler/deprecation-bento-data-grid-cell-action-menu-item-handler.integration.test.ts +0 -24
  16. package/rules/deprecation-bento-data-grid-cell-action-menu-item-handler/deprecation-bento-data-grid-cell-action-menu-item-handler.test.ts +0 -116
  17. package/rules/deprecation-bento-date-range-picker-has-actions-prop/__tests__/deprecation-bento-date-range-picker-has-actions-prop.vue +0 -10
  18. package/rules/deprecation-bento-date-range-picker-has-actions-prop/__tests__/eslint.config.js +0 -29
  19. package/rules/deprecation-bento-date-range-picker-has-actions-prop/__tests__/remove/deprecation-bento-date-range-picker-has-actions-prop.vue +0 -11
  20. package/rules/deprecation-bento-date-range-picker-has-actions-prop/__tests__/remove/eslint.config.js +0 -29
  21. package/rules/deprecation-bento-date-range-picker-has-actions-prop/deprecation-bento-date-range-picker-has-actions-prop.integration.test.ts +0 -47
  22. package/rules/deprecation-bento-date-range-picker-has-actions-prop/deprecation-bento-date-range-picker-has-actions-prop.test.ts +0 -176
  23. package/rules/deprecation-bento-dropdown-size-prop/__tests__/deprecation-bento-dropdown-size-prop.vue +0 -9
  24. package/rules/deprecation-bento-dropdown-size-prop/__tests__/eslint.config.js +0 -26
  25. package/rules/deprecation-bento-dropdown-size-prop/deprecation-bento-dropdown-size-prop.integration.test.ts +0 -33
  26. package/rules/deprecation-bento-dropdown-size-prop/deprecation-bento-dropdown-size-prop.test.ts +0 -101
  27. package/rules/deprecation-bento-popover-modifiers-prop/__tests__/deprecation-bento-popover-modifiers-prop.vue +0 -9
  28. package/rules/deprecation-bento-popover-modifiers-prop/__tests__/eslint.config.js +0 -26
  29. package/rules/deprecation-bento-popover-modifiers-prop/deprecation-bento-popover-modifiers-prop.integration.test.ts +0 -24
  30. package/rules/deprecation-bento-popover-modifiers-prop/deprecation-bento-popover-modifiers-prop.test.ts +0 -109
  31. package/rules/deprecation-bento-timeline-item-variant-prop/__tests__/deprecation-bento-timeline-item-variant-prop.vue +0 -9
  32. package/rules/deprecation-bento-timeline-item-variant-prop/__tests__/eslint.config.js +0 -26
  33. package/rules/deprecation-bento-timeline-item-variant-prop/deprecation-bento-timeline-item-variant-prop.integration.test.ts +0 -35
  34. package/rules/deprecation-bento-timeline-item-variant-prop/deprecation-bento-timeline-item-variant-prop.test.ts +0 -141
  35. package/rules/deprecation-components-aria-label-prop/__tests__/deprecation-components-aria-label-prop.vue +0 -25
  36. package/rules/deprecation-components-aria-label-prop/__tests__/eslint.config.js +0 -26
  37. package/rules/deprecation-components-aria-label-prop/deprecation-components-aria-label-prop.integration.test.ts +0 -36
  38. package/rules/deprecation-components-aria-label-prop/deprecation-components-aria-label-prop.test.ts +0 -194
  39. package/rules/deprecation-components-error-prop/__tests__/deprecation-components-error-prop.vue +0 -17
  40. package/rules/deprecation-components-error-prop/__tests__/eslint.config.js +0 -26
  41. package/rules/deprecation-components-error-prop/deprecation-components-error-prop.integration.test.ts +0 -41
  42. package/rules/deprecation-components-error-prop/deprecation-components-error-prop.test.ts +0 -153
  43. package/rules/deprecation-components-has-error-prop/__tests__/deprecation-components-has-error-prop.vue +0 -13
  44. package/rules/deprecation-components-has-error-prop/__tests__/eslint.config.js +0 -26
  45. package/rules/deprecation-components-has-error-prop/deprecation-components-has-error-prop.integration.test.ts +0 -37
  46. package/rules/deprecation-components-has-error-prop/deprecation-components-has-error-prop.test.ts +0 -122
  47. package/rules/deprecation-components-input-emit/__tests__/deprecation-components-input-emit.vue +0 -22
  48. package/rules/deprecation-components-input-emit/__tests__/eslint.config.js +0 -25
  49. package/rules/deprecation-components-input-emit/deprecation-components-input-emit.integration.test.ts +0 -43
  50. package/rules/deprecation-components-input-emit/deprecation-components-input-emit.test.ts +0 -320
  51. package/rules/deprecation-components-value-prop/__tests__/deprecation-components-value-prop.vue +0 -69
  52. package/rules/deprecation-components-value-prop/__tests__/eslint.config.js +0 -25
  53. package/rules/deprecation-components-value-prop/deprecation-components-value-prop.integration.test.ts +0 -37
  54. package/rules/deprecation-components-value-prop/deprecation-components-value-prop.test.ts +0 -480
  55. package/rules/deprecation-country-custom-usage/__tests__/deprecation-country-custom-usage.vue +0 -93
  56. package/rules/deprecation-country-custom-usage/__tests__/eslint.config.js +0 -25
  57. package/rules/deprecation-country-custom-usage/deprecation-country-custom-usage.integration.test.ts +0 -22
  58. package/rules/deprecation-country-custom-usage/deprecation-country-custom-usage.test.ts +0 -380
  59. package/rules/deprecation-currency-default-slot/__tests__/deprecation-currency-default-slot.vue +0 -7
  60. package/rules/deprecation-currency-default-slot/__tests__/eslint.config.js +0 -24
  61. package/rules/deprecation-currency-default-slot/deprecation-currency-default-slot.integration.test.ts +0 -29
  62. package/rules/deprecation-currency-default-slot/deprecation-currency-default-slot.test.ts +0 -136
  63. package/rules/deprecation-filter-bar-deprecated-props/__tests__/deprecation-filter-bar-deprecated-props.vue +0 -62
  64. package/rules/deprecation-filter-bar-deprecated-props/__tests__/eslint.config.js +0 -25
  65. package/rules/deprecation-filter-bar-deprecated-props/deprecation-filter-bar-deprecated-props.integration.test.ts +0 -22
  66. package/rules/deprecation-filter-bar-deprecated-props/deprecation-filter-bar-deprecated-props.test.ts +0 -492
  67. package/rules/deprecation-input-filter-dropdown-options/__tests__/deprecation-input-filter-dropdown-options.vue +0 -46
  68. package/rules/deprecation-input-filter-dropdown-options/__tests__/eslint.config.js +0 -26
  69. package/rules/deprecation-input-filter-dropdown-options/deprecation-input-filter-dropdown-options.integration.test.ts +0 -27
  70. package/rules/deprecation-input-filter-dropdown-options/deprecation-input-filter-dropdown-options.test.ts +0 -392
  71. package/rules/deprecation-tag-default-slot/__tests__/deprecation-tag-default-slot.vue +0 -5
  72. package/rules/deprecation-tag-default-slot/__tests__/eslint.config.js +0 -24
  73. package/rules/deprecation-tag-default-slot/deprecation-tag-default-slot.integration.test.ts +0 -29
  74. package/rules/deprecation-tag-default-slot/deprecation-tag-default-slot.test.ts +0 -163
  75. package/rules/tailwind-v3-to-bento/__tests__/eslint.config.js +0 -24
  76. package/rules/tailwind-v3-to-bento/__tests__/tailwind-v3-to-bento.vue +0 -15
  77. package/rules/tailwind-v3-to-bento/tailwind-v3-to-bento.integration.test.ts +0 -29
  78. package/rules/tailwind-v3-to-bento/tailwind-v3-to-bento.test.ts +0 -403
  79. package/rules/vue-old-spacer-tokens/__tests__/eslint.config.js +0 -24
  80. package/rules/vue-old-spacer-tokens/__tests__/vue-old-spacer-tokens.vue +0 -5
  81. package/rules/vue-old-spacer-tokens/vue-old-spacer-tokens.integration.test.ts +0 -29
  82. package/rules/vue-old-spacer-tokens/vue-old-spacer-tokens.test.ts +0 -77
@@ -1,380 +0,0 @@
1
- import { RuleTester } from 'eslint';
2
- import vueParser from 'vue-eslint-parser';
3
- import tsParser from '@typescript-eslint/parser';
4
- import rule from './deprecation-country-custom-usage';
5
-
6
- const ruleTester = new RuleTester({
7
- languageOptions: {
8
- ecmaVersion: 'latest',
9
- sourceType: 'module',
10
- parser: vueParser,
11
- parserOptions: {
12
- parser: tsParser,
13
- },
14
- },
15
- });
16
-
17
- describe('@adyen/bento/deprecation-country-custom-usage', () => {
18
- /* ------------------------------------------------ */
19
- /* CASE 1: bento-country */
20
- /* ------------------------------------------------ */
21
- ruleTester.run('bento-country', rule, {
22
- valid: [
23
- {
24
- name: 'Valid: variant="name"',
25
- filename: 'test.vue',
26
- code: `<template><bento-country code="NL" variant="name" /></template>`,
27
- },
28
- {
29
- name: 'Valid: no variant or label',
30
- filename: 'test.vue',
31
- code: `<template><bento-country code="NL" /></template>`,
32
- },
33
- {
34
- name: 'Valid: dynamic non-custom variant',
35
- filename: 'test.vue',
36
- code: `<template><bento-country code="NL" :variant="'name'" /></template>`,
37
- },
38
- ],
39
- invalid: [
40
- {
41
- name: 'Invalid: variant="custom" only',
42
- filename: 'test.vue',
43
- code: `<template><bento-country code="NL" variant="custom" /></template>`,
44
- errors: [{ messageId: 'countryCustomVariant' }],
45
- },
46
- {
47
- name: 'Invalid: label only (no variant="custom")',
48
- filename: 'test.vue',
49
- code: `<template><bento-country code="NL" label="Custom label" /></template>`,
50
- errors: [{ messageId: 'countryUnusedLabel' }],
51
- },
52
- {
53
- name: 'Invalid: dynamic label only',
54
- filename: 'test.vue',
55
- code: `<template><bento-country code="NL" :label="customLabel" /></template>`,
56
- errors: [{ messageId: 'countryUnusedLabel' }],
57
- },
58
- {
59
- name: 'Invalid: variant="custom" + label (both)',
60
- filename: 'test.vue',
61
- code: `<template><bento-country code="NL" variant="custom" label="Custom label" /></template>`,
62
- errors: [{ messageId: 'countryCustomVariant' }],
63
- },
64
- {
65
- name: 'Invalid: dynamic variant + label',
66
- filename: 'test.vue',
67
- code: `<template><bento-country code="NL" :variant="'custom'" label="Custom label" /></template>`,
68
- errors: [{ messageId: 'countryCustomVariant' }],
69
- },
70
- {
71
- name: 'Invalid: BentoCountryVariant.CUSTOM + label',
72
- filename: 'test.vue',
73
- code: `<template><bento-country code="NL" :variant="BentoCountryVariant.CUSTOM" label="Custom label" /></template>`,
74
- errors: [{ messageId: 'countryCustomVariant' }],
75
- },
76
- {
77
- name: 'Invalid: v-bind:variant longhand',
78
- filename: 'test.vue',
79
- code: `<template><bento-country code="NL" v-bind:variant="'custom'" label="Custom label" /></template>`,
80
- errors: [{ messageId: 'countryCustomVariant' }],
81
- },
82
- ],
83
- });
84
-
85
- /* ------------------------------------------------ */
86
- /* CASE 2: bento-dropdown-country */
87
- /* ------------------------------------------------ */
88
- ruleTester.run('bento-dropdown-country', rule, {
89
- valid: [
90
- {
91
- name: 'Valid: items without labels',
92
- filename: 'test.vue',
93
- code: `<template><bento-dropdown-country :items="[{ value: 'NL' }, { value: 'BE' }]" /></template>`,
94
- },
95
- {
96
- name: 'Valid: different component with labels',
97
- filename: 'test.vue',
98
- code: `<template><bento-dropdown :items="[{ value: 'NL', label: 'Custom label' }]" /></template>`,
99
- },
100
- {
101
- name: 'Valid: no items prop',
102
- filename: 'test.vue',
103
- code: `<template><bento-dropdown-country /></template>`,
104
- },
105
- {
106
- name: 'Valid: variable reference',
107
- filename: 'test.vue',
108
- code: `<template><bento-dropdown-country :items="myItems" /></template>`,
109
- },
110
- {
111
- name: 'Valid: spread elements only (no crash)',
112
- filename: 'test.vue',
113
- code: `<template><bento-dropdown-country :items="[{ ...obj, value: 'NL' }]" /></template>`,
114
- },
115
- {
116
- name: 'Valid: computed property key',
117
- filename: 'test.vue',
118
- code: `<template><bento-dropdown-country :items="[{ value: 'NL', [key]: 'val' }]" /></template>`,
119
- },
120
- {
121
- name: 'Valid: non-object elements',
122
- filename: 'test.vue',
123
- code: `<template><bento-dropdown-country :items="['NL', 'BE']" /></template>`,
124
- },
125
- ],
126
- invalid: [
127
- {
128
- name: 'Invalid: label in items only',
129
- filename: 'test.vue',
130
- code: `<template><bento-dropdown-country :items="[{ value: 'NL', label: 'Custom label' }]" /></template>`,
131
- errors: [{ messageId: 'dropdownCountryCustomLabel' }],
132
- },
133
- {
134
- name: 'Invalid: label in items (internal name)',
135
- filename: 'test.vue',
136
- code: `<template><b-dropdown-country :items="[{ value: 'NL', label: 'Custom label' }]" /></template>`,
137
- errors: [{ messageId: 'dropdownCountryCustomLabel' }],
138
- },
139
- {
140
- name: 'Invalid: string literal key',
141
- filename: 'test.vue',
142
- code: `<template><bento-dropdown-country :items="[{ value: 'NL', 'label': 'Custom label' }]" /></template>`,
143
- errors: [{ messageId: 'dropdownCountryCustomLabel' }],
144
- },
145
- {
146
- name: 'Invalid: spread + label',
147
- filename: 'test.vue',
148
- code: `<template><bento-dropdown-country :items="[{ ...obj, label: 'Custom label' }]" /></template>`,
149
- errors: [{ messageId: 'dropdownCountryCustomLabel' }],
150
- },
151
- {
152
- name: 'Invalid: variant="custom" only (no label in items)',
153
- filename: 'test.vue',
154
- code: `<template><bento-dropdown-country :items="[{ value: 'NL' }]" variant="custom" /></template>`,
155
- errors: [{ messageId: 'dropdownCountryCustomVariant' }],
156
- },
157
- {
158
- name: 'Invalid: label + variant="custom" (both)',
159
- filename: 'test.vue',
160
- code: `<template><bento-dropdown-country :items="[{ value: 'NL', label: 'Custom label' }]" variant="custom" /></template>`,
161
- errors: [{ messageId: 'dropdownCountryCustomLabel' }],
162
- },
163
- ],
164
- });
165
-
166
- /* ------------------------------------------------ */
167
- /* CASE 3: SELECT_COUNTRY filter config */
168
- /* ------------------------------------------------ */
169
- ruleTester.run('SELECT_COUNTRY filter', rule, {
170
- valid: [
171
- {
172
- name: 'Valid: non-custom variant',
173
- filename: 'test.vue',
174
- code: `<template><bento-filter-bar :config="[{ field: 'c', label: 'C', type: BentoFilterItemType.SELECT_COUNTRY, options: { listboxItems: [{ value: 'NL' }], variant: 'name' } }]" /></template>`,
175
- },
176
- {
177
- name: 'Valid: SELECT type (not SELECT_COUNTRY)',
178
- filename: 'test.vue',
179
- code: `<template><bento-filter-bar :config="[{ field: 'c', label: 'C', type: BentoFilterItemType.SELECT, options: { listboxItems: [{ value: 'NL', label: 'Custom label' }] } }]" /></template>`,
180
- },
181
- {
182
- name: 'Valid: without options',
183
- filename: 'test.vue',
184
- code: `<template><bento-filter-bar :config="[{ field: 'c', label: 'C', type: BentoFilterItemType.SELECT_COUNTRY }]" /></template>`,
185
- },
186
- {
187
- name: 'Valid: no label, non-custom variant',
188
- filename: 'test.vue',
189
- code: `<template><bento-filter-bar :config="[{ field: 'c', label: 'C', type: BentoFilterItemType.SELECT_COUNTRY, options: { listboxItems: [{ value: 'NL' }], variant: 'capital' } }]" /></template>`,
190
- },
191
- ],
192
- invalid: [
193
- {
194
- name: 'Invalid: variant="custom" only',
195
- filename: 'test.vue',
196
- code: `<template><bento-filter-bar :config="[{ field: 'c', label: 'C', type: BentoFilterItemType.SELECT_COUNTRY, options: { listboxItems: [{ value: 'NL' }], variant: 'custom' } }]" /></template>`,
197
- errors: [{ messageId: 'selectCountryCustom', data: { key: 'variant' } }],
198
- },
199
- {
200
- name: 'Invalid: label only',
201
- filename: 'test.vue',
202
- code: `<template><bento-filter-bar :config="[{ field: 'c', label: 'C', type: BentoFilterItemType.SELECT_COUNTRY, options: { listboxItems: [{ value: 'NL', label: 'Custom label' }] } }]" /></template>`,
203
- errors: [{ messageId: 'selectCountryCustom', data: { key: 'listboxItems with label' } }],
204
- },
205
- {
206
- name: 'Invalid: both (2 errors)',
207
- filename: 'test.vue',
208
- code: `<template><bento-filter-bar :config="[{ field: 'c', label: 'C', type: BentoFilterItemType.SELECT_COUNTRY, options: { listboxItems: [{ value: 'NL', label: 'Custom label' }], variant: 'custom' } }]" /></template>`,
209
- errors: [
210
- { messageId: 'selectCountryCustom', data: { key: 'variant' } },
211
- { messageId: 'selectCountryCustom', data: { key: 'listboxItems with label' } },
212
- ],
213
- },
214
- {
215
- name: 'Invalid: BentoCountryVariant.CUSTOM enum',
216
- filename: 'test.vue',
217
- code: `<template><bento-filter-bar :config="[{ field: 'c', label: 'C', type: BentoFilterItemType.SELECT_COUNTRY, options: { listboxItems: [{ value: 'NL' }], variant: BentoCountryVariant.CUSTOM } }]" /></template>`,
218
- errors: [{ messageId: 'selectCountryCustom', data: { key: 'variant' } }],
219
- },
220
- {
221
- name: 'Invalid: string literal type',
222
- filename: 'test.vue',
223
- code: `<template><bento-filter-bar :config="[{ field: 'c', label: 'C', type: 'BentoSelectCountryFilter', options: { listboxItems: [{ value: 'NL' }], variant: 'custom' } }]" /></template>`,
224
- errors: [{ messageId: 'selectCountryCustom', data: { key: 'variant' } }],
225
- },
226
- {
227
- name: 'Invalid: script-defined config',
228
- filename: 'test.vue',
229
- code: `
230
- <script setup>
231
- const config = [{ field: 'c', label: 'C', type: BentoFilterItemType.SELECT_COUNTRY, options: { listboxItems: [{ value: 'NL' }], variant: 'custom' } }];
232
- </script>
233
- <template><bento-filter-bar :config="config" /></template>
234
- `,
235
- errors: [{ messageId: 'selectCountryCustom', data: { key: 'variant' } }],
236
- },
237
- ],
238
- });
239
-
240
- /* ------------------------------------------------ */
241
- /* AUTOFIX TESTS */
242
- /* ------------------------------------------------ */
243
- ruleTester.run('autofix', rule, {
244
- valid: [],
245
- invalid: [
246
- // CASE 1: bento-country
247
- {
248
- name: 'Autofix: bento-country both → replace with typography',
249
- filename: 'test.vue',
250
- code: `<template><bento-country code="NL" variant="custom" label="Custom label" /></template>`,
251
- output: `<template><bento-typography el="span">Custom label</bento-typography></template>`,
252
- options: [{ autofix: true }],
253
- errors: [{ messageId: 'countryCustomVariant' }],
254
- },
255
- {
256
- name: 'Autofix: bento-country dynamic label both → replace with typography',
257
- filename: 'test.vue',
258
- code: `<template><bento-country code="NL" :variant="'custom'" :label="customLabel" /></template>`,
259
- output: `<template><bento-typography el="span">{{ customLabel }}</bento-typography></template>`,
260
- options: [{ autofix: true }],
261
- errors: [{ messageId: 'countryCustomVariant' }],
262
- },
263
- {
264
- name: 'Autofix: bento-country variant only → remove variant',
265
- filename: 'test.vue',
266
- code: `<template><bento-country code="NL" variant="custom" /></template>`,
267
- output: `<template><bento-country code="NL" /></template>`,
268
- options: [{ autofix: true }],
269
- errors: [{ messageId: 'countryCustomVariant' }],
270
- },
271
- {
272
- name: 'Autofix: bento-country dynamic variant only → remove variant',
273
- filename: 'test.vue',
274
- code: `<template><bento-country code="NL" :variant="BentoCountryVariant.CUSTOM" /></template>`,
275
- output: `<template><bento-country code="NL" /></template>`,
276
- options: [{ autofix: true }],
277
- errors: [{ messageId: 'countryCustomVariant' }],
278
- },
279
- {
280
- name: 'Autofix: bento-country label only → remove label',
281
- filename: 'test.vue',
282
- code: `<template><bento-country code="NL" label="Custom label" /></template>`,
283
- output: `<template><bento-country code="NL" /></template>`,
284
- options: [{ autofix: true }],
285
- errors: [{ messageId: 'countryUnusedLabel' }],
286
- },
287
- {
288
- name: 'Autofix: bento-country dynamic label only → remove label',
289
- filename: 'test.vue',
290
- code: `<template><bento-country code="NL" :label="customLabel" /></template>`,
291
- output: `<template><bento-country code="NL" /></template>`,
292
- options: [{ autofix: true }],
293
- errors: [{ messageId: 'countryUnusedLabel' }],
294
- },
295
-
296
- // CASE 2: bento-dropdown-country
297
- {
298
- name: 'Autofix: dropdown-country both → replace tag + remove variant',
299
- filename: 'test.vue',
300
- code: `<template><bento-dropdown-country :items="[{ value: 'NL', label: 'Custom label' }]" variant="custom" /></template>`,
301
- output: `<template><bento-dropdown :items="[{ value: 'NL', label: 'Custom label' }]" /></template>`,
302
- options: [{ autofix: true }],
303
- errors: [{ messageId: 'dropdownCountryCustomLabel' }],
304
- },
305
- {
306
- name: 'Autofix: dropdown-country both with closing tag → replace tag + remove variant',
307
- filename: 'test.vue',
308
- code: `<template><bento-dropdown-country :items="[{ value: 'NL', label: 'Custom label' }]" variant="custom"></bento-dropdown-country></template>`,
309
- output: `<template><bento-dropdown :items="[{ value: 'NL', label: 'Custom label' }]"></bento-dropdown></template>`,
310
- options: [{ autofix: true }],
311
- errors: [{ messageId: 'dropdownCountryCustomLabel' }],
312
- },
313
- {
314
- name: 'Autofix: dropdown-country label only → remove labels from items',
315
- filename: 'test.vue',
316
- code: `<template><bento-dropdown-country :items="[{ value: 'NL', label: 'Custom label' }]" /></template>`,
317
- output: `<template><bento-dropdown-country :items="[{ value: 'NL' }]" /></template>`,
318
- options: [{ autofix: true }],
319
- errors: [{ messageId: 'dropdownCountryCustomLabel' }],
320
- },
321
- {
322
- name: 'Autofix: dropdown-country variant only → remove variant',
323
- filename: 'test.vue',
324
- code: `<template><bento-dropdown-country :items="[{ value: 'NL' }]" variant="custom" /></template>`,
325
- output: `<template><bento-dropdown-country :items="[{ value: 'NL' }]" /></template>`,
326
- options: [{ autofix: true }],
327
- errors: [{ messageId: 'dropdownCountryCustomVariant' }],
328
- },
329
-
330
- // CASE 3: SELECT_COUNTRY
331
- {
332
- name: 'Autofix: SELECT_COUNTRY both → change type + remove variant',
333
- filename: 'test.vue',
334
- code: `<template><bento-filter-bar :config="[{ field: 'c', label: 'C', type: BentoFilterItemType.SELECT_COUNTRY, options: { listboxItems: [{ value: 'NL', label: 'Custom label' }], variant: 'custom' } }]" /></template>`,
335
- output: `<template><bento-filter-bar :config="[{ field: 'c', label: 'C', type: BentoFilterItemType.SELECT, options: { listboxItems: [{ value: 'NL', label: 'Custom label' }] } }]" /></template>`,
336
- options: [{ autofix: true }],
337
- errors: [
338
- { messageId: 'selectCountryCustom', data: { key: 'variant' } },
339
- { messageId: 'selectCountryCustom', data: { key: 'listboxItems with label' } },
340
- ],
341
- },
342
- {
343
- name: 'Autofix: SELECT_COUNTRY string literal both → change type + remove variant',
344
- filename: 'test.vue',
345
- code: `<template><bento-filter-bar :config="[{ field: 'c', label: 'C', type: 'BentoSelectCountryFilter', options: { listboxItems: [{ value: 'NL', label: 'Custom label' }], variant: 'custom' } }]" /></template>`,
346
- output: `<template><bento-filter-bar :config="[{ field: 'c', label: 'C', type: 'BentoSelectFilter', options: { listboxItems: [{ value: 'NL', label: 'Custom label' }] } }]" /></template>`,
347
- options: [{ autofix: true }],
348
- errors: [
349
- { messageId: 'selectCountryCustom', data: { key: 'variant' } },
350
- { messageId: 'selectCountryCustom', data: { key: 'listboxItems with label' } },
351
- ],
352
- },
353
- {
354
- name: 'Autofix: SELECT_COUNTRY variant only → remove variant property',
355
- filename: 'test.vue',
356
- code: `<template><bento-filter-bar :config="[{ field: 'c', label: 'C', type: BentoFilterItemType.SELECT_COUNTRY, options: { listboxItems: [{ value: 'NL' }], variant: 'custom' } }]" /></template>`,
357
- output: `<template><bento-filter-bar :config="[{ field: 'c', label: 'C', type: BentoFilterItemType.SELECT_COUNTRY, options: { listboxItems: [{ value: 'NL' }] } }]" /></template>`,
358
- options: [{ autofix: true }],
359
- errors: [{ messageId: 'selectCountryCustom', data: { key: 'variant' } }],
360
- },
361
- {
362
- name: 'Autofix: SELECT_COUNTRY label only → remove labels from listboxItems',
363
- filename: 'test.vue',
364
- code: `<template><bento-filter-bar :config="[{ field: 'c', label: 'C', type: BentoFilterItemType.SELECT_COUNTRY, options: { listboxItems: [{ value: 'NL', label: 'Custom label' }] } }]" /></template>`,
365
- output: `<template><bento-filter-bar :config="[{ field: 'c', label: 'C', type: BentoFilterItemType.SELECT_COUNTRY, options: { listboxItems: [{ value: 'NL' }] } }]" /></template>`,
366
- options: [{ autofix: true }],
367
- errors: [{ messageId: 'selectCountryCustom', data: { key: 'listboxItems with label' } }],
368
- },
369
-
370
- // No autofix when disabled
371
- {
372
- name: 'No autofix when autofix is false',
373
- filename: 'test.vue',
374
- code: `<template><bento-country code="NL" variant="custom" label="Custom label" /></template>`,
375
- options: [{ autofix: false }],
376
- errors: [{ messageId: 'countryCustomVariant' }],
377
- },
378
- ],
379
- });
380
- });
@@ -1,7 +0,0 @@
1
- <template>
2
- <bento-currency>
3
- {{ thisIsMyVariableWithCurrencyValue }}
4
- </bento-currency>
5
- </template>
6
-
7
- <script setup></script>
@@ -1,24 +0,0 @@
1
- const { defineConfig } = require('eslint/config');
2
- const vueParser = require('vue-eslint-parser');
3
- const tsParser = require('@typescript-eslint/parser');
4
- const adyenBento = require('@adyen/eslint-plugin-bento');
5
-
6
- module.exports = defineConfig([
7
- {
8
- languageOptions: {
9
- ecmaVersion: 'latest',
10
- sourceType: 'module',
11
- parser: vueParser,
12
- parserOptions: {
13
- parser: tsParser,
14
- },
15
- },
16
- plugins: {
17
- '@adyen/bento': adyenBento,
18
- },
19
- rules: {
20
- '@adyen/bento/deprecation-currency-default-slot': 'warn',
21
- },
22
- files: ['**/*.vue'],
23
- },
24
- ]);
@@ -1,29 +0,0 @@
1
- import path from 'node:path';
2
- import { execFileSyncEslintVueFiles } from '../../utils/exec-file-sync-eslint-vue-files';
3
-
4
- describe('@adyen/bento/deprecation-currency-default-slot', () => {
5
- it('should lint with warning', () => {
6
- // Load .eslintrc
7
- const eslintrc = path.resolve(__dirname, '__tests__', 'eslint.config.js');
8
- // Load the test file
9
- const vueFile = path.resolve(__dirname, '__tests__', 'deprecation-currency-default-slot.vue');
10
-
11
- // Execute the linter
12
- const result = JSON.parse(execFileSyncEslintVueFiles(eslintrc, vueFile));
13
-
14
- // Expects a warning with a suggestion/fix and an error message
15
- expect(result[0].warningCount).toBe(1);
16
- expect(result[0].messages[0]).toStrictEqual({
17
- ruleId: '@adyen/bento/deprecation-currency-default-slot',
18
- severity: 1,
19
- message: '"default" slot is deprecated in favor of the "value" property',
20
- messageId: 'migrateDefaultSlot',
21
- line: 2,
22
- column: 5,
23
- nodeType: 'VElement',
24
- endLine: 4,
25
- endColumn: 22,
26
- fix: { range: [30, 101], text: ' :value="thisIsMyVariableWithCurrencyValue" />' },
27
- });
28
- });
29
- });
@@ -1,136 +0,0 @@
1
- import { RuleTester } from 'eslint';
2
- import vueParser from 'vue-eslint-parser';
3
- import tsParser from '@typescript-eslint/parser';
4
- import deprecationCurrencyDefaultSlot from './deprecation-currency-default-slot';
5
-
6
- const ruleTester = new RuleTester({
7
- languageOptions: {
8
- ecmaVersion: 'latest',
9
- sourceType: 'module',
10
- parser: vueParser,
11
- parserOptions: {
12
- parser: tsParser,
13
- },
14
- },
15
- });
16
-
17
- describe('@adyen/bento/deprecation-currency-default-slot should suggest the usage of "label" property instead of "default" slot', () => {
18
- ruleTester.run('deprecation-currency-default-slot', deprecationCurrencyDefaultSlot, {
19
- valid: [
20
- {
21
- name: 'BentoCurrency with "value" property',
22
- filename: 'test.vue',
23
- code: `
24
- <template>
25
- <bento-currency :value="12345" currency="USD" />
26
- </template>
27
- `,
28
- },
29
- {
30
- name: 'BentoCurrency with closing tag but no children',
31
- filename: 'test.vue',
32
- code: `
33
- <template>
34
- <bento-currency :value="12345" :currency="BentoCurrencyISOCode.USD" major-units />
35
- </template>
36
- `,
37
- },
38
- {
39
- name: 'BentoCurrency with closing tag but no children',
40
- filename: 'test.vue',
41
- code: `
42
- <template>
43
- <bento-currency
44
- :value="thisIsMyVariableWithCurrencyValue"
45
- :currency="BentoCurrencyISOCode.USD"
46
- major-units
47
- />
48
- </template>
49
- `,
50
- },
51
- ],
52
- invalid: [
53
- {
54
- name: 'BentoCurrency with VText child',
55
- code: `
56
- <template>
57
- <bento-currency currency="USD">
58
- 12345
59
- </bento-currency>
60
- </template>
61
- `,
62
- output: `
63
- <template>
64
- <bento-currency currency="USD" :value="12345" />
65
- </template>
66
- `,
67
- errors: [{ message: '"default" slot is deprecated in favor of the "value" property' }],
68
- },
69
- {
70
- name: 'BentoCurrency with CallExpression child',
71
- code: `
72
- <template>
73
- <bento-currency :currency="BentoCurrencyISOCode.EUR" major-units
74
- >{{ myFunction(valueRefs, EnumValues.EURO_AMOUNT) }}
75
- </bento-currency>
76
- </template>
77
- `,
78
- output: `
79
- <template>
80
- <bento-currency :currency="BentoCurrencyISOCode.EUR" major-units
81
- :value="myFunction(valueRefs, EnumValues.EURO_AMOUNT)" />
82
- </template>
83
- `,
84
- errors: [{ message: '"default" slot is deprecated in favor of the "value" property' }],
85
- },
86
- {
87
- name: 'BentoCurrency with VText child and no attributes',
88
- code: `
89
- <template>
90
- <bento-currency>
91
- 12345.23
92
- </bento-currency>
93
- </template>
94
- `,
95
- output: `
96
- <template>
97
- <bento-currency :value="12345.23" />
98
- </template>
99
- `,
100
- errors: [{ message: '"default" slot is deprecated in favor of the "value" property' }],
101
- },
102
- {
103
- name: 'BentoCurrency with property as child',
104
- code: `
105
- <template>
106
- <bento-currency :key="item.thisIsMyVariableWithCurrencyValue" :currency="BentoCurrencyISOCode.EUR" major-units>
107
- {{ item.thisIsMyVariableWithCurrencyValue }}
108
- </bento-currency>
109
- </template>
110
- `,
111
- output: `
112
- <template>
113
- <bento-currency :key="item.thisIsMyVariableWithCurrencyValue" :currency="BentoCurrencyISOCode.EUR" major-units :value="item.thisIsMyVariableWithCurrencyValue" />
114
- </template>
115
- `,
116
- errors: [{ message: '"default" slot is deprecated in favor of the "value" property' }],
117
- },
118
- {
119
- name: 'BentoCurrency with simple property as child',
120
- code: `
121
- <template>
122
- <bento-currency>
123
- {{ thisIsMyVariableWithCurrencyValue }}
124
- </bento-currency>
125
- </template>
126
- `,
127
- output: `
128
- <template>
129
- <bento-currency :value="thisIsMyVariableWithCurrencyValue" />
130
- </template>
131
- `,
132
- errors: [{ message: '"default" slot is deprecated in favor of the "value" property' }],
133
- },
134
- ],
135
- });
136
- });
@@ -1,62 +0,0 @@
1
- <template>
2
- <div>
3
- <!-- Direct value prop on bento-filter-bar: 3 warnings -->
4
- <bento-filter-bar value="val" />
5
- <bento-filter-bar :value="filters" />
6
- <bento-filter-bar v-model="filters" />
7
-
8
- <!-- Script-defined config with deprecated value + options: used below -->
9
- <bento-filter-bar :config="configWithValue" />
10
- <bento-data-grid :filters="configWithOptions" />
11
-
12
- <!-- Inline template config with deprecated options: 1 warning -->
13
- <bento-filter-bar
14
- :config="[
15
- {
16
- field: 'inline',
17
- label: 'Inline',
18
- type: 'BentoSelectFilter',
19
- options: { messages: {} },
20
- },
21
- ]"
22
- />
23
- </div>
24
- </template>
25
-
26
- <script setup>
27
- // 1 warning (value on config item)
28
- const configWithValue = [
29
- {
30
- field: 'name',
31
- label: 'Name',
32
- type: 'BentoInputFilter',
33
- value: 'test',
34
- },
35
- ];
36
-
37
- // 3 warnings (messages + 2 keys)
38
- const configWithOptions = [
39
- {
40
- field: 'status',
41
- label: 'Status',
42
- type: 'BentoSelectFilter',
43
- options: {
44
- messages: {},
45
- messagesPersistentButtonLabelPartiallySelectedKey: 'k1',
46
- messagesPersistentButtonLabelAllSelectedKey: 'k2',
47
- listboxItems: [],
48
- },
49
- },
50
- ];
51
- </script>
52
-
53
- <script>
54
- export const parseBinaryOperation = operation => ({
55
- field: operation.left.name,
56
- operator: operation.type,
57
- category: operation.left.type,
58
- type: parseOperationValueType(operation.right.type),
59
- value: parseOperationValue(operation),
60
- key: getUniqueId(),
61
- });
62
- </script>