Merge pull request #85 from ing-bank/chore/lintScripts

Fix linting scripts

.editorconfig

@@ -8,7 +8,7 @@ end_of_line = lf
 insert_final_newline = true
 trim_trailing_whitespace = true
 
-[*.{html,js}]
+[*.{html,js,md}]
 block_comment_start = /**
 block_comment = *
 block_comment_end = */

assets/.editorconfig

@@ -0,0 +1 @@
+root = true

package.json

@@ -43,12 +43,12 @@
     "test:prune-snapshots": "karma start --prune-snapshots",
     "test:bs": "karma start karma.bs.config.js --coverage",
     "lint": "run-p lint:*",
-    "lint:eclint": "eclint check $(find . \\( -name '*.html' -o -name '*.js' -o -name '*.css' \\) -type f -not -path '*/\\.*' -not -path '*node_modules/*' -not -path '*assets/*' -not -path '*coverage/*')",
+    "lint:eclint": "git ls-files | xargs eclint check",
     "lint:eslint": "eslint --ext .js,.html .",
-    "lint:prettier": "prettier '**/*.js' --list-different || (echo '↑↑ these files are not prettier formatted ↑↑' && exit 1)",
+    "lint:prettier": "prettier \"**/*.js\" --list-different || (echo '↑↑ these files are not prettier formatted ↑↑' && exit 1)",
     "format": "npm run format:eslint && npm run format:prettier",
     "format:eslint": "eslint --ext .js,.html . --fix",
-    "format:prettier": "prettier '**/*.js' --write"
+    "format:prettier": "prettier \"**/*.js\" --write"
   },
   "lint-staged": {
     "*": [

packages/field/docs/CustomFieldsTutorial.md

@@ -1,23 +1,23 @@
 # Creating a custom field
-Custom fields can be created in just a few steps. All you need is an interaction element 
+Custom fields can be created in just a few steps. All you need is an interaction element
 (like for instance a slider, a listbox or a combobox) and connect it to the [Field](../README.md)
 functionality.
 
 ## Prerequisite: an interaction element
-An interaction element provides the means for the end user to enter a certain value, just like 
+An interaction element provides the means for the end user to enter a certain value, just like
 native elements provide in this (think of `<input>`, `<textarea>` and `<select>`).
-An example of a non native element is the 
+An example of a non native element is the
 [slider design pattern](https://www.w3.org/TR/2017/NOTE-wai-aria-practices-1.1-20171214/#slider)
 described here.
 
-For this tutorial, we assume we have a component `<my-slider>` that exposes its value via property 
+For this tutorial, we assume we have a component `<my-slider>` that exposes its value via property
 `mySliderValue` and sends an event `my-slider-changed` on every value change. To make it focusable,
 it has a tabindex=“0” applied.
 
 ## Connecting the interaction element to the field
 Now we want to integrate the slider in our form framework to enrich the user interface, get
 validation support and get all the other [benefits of LionField](../README.md).
-We start of by creating a component `<lion-slider>` that extends from `LionField`. 
+We start of by creating a component `<lion-slider>` that extends from `LionField`.
 Then we follow the steps below:
 
 - ### 1. Add your interaction element as ‘input slot'
@@ -41,7 +41,7 @@ import { LionField } from '@lion/field';
 import './my-slider.js';
 
 export class LionSlider extends LionField {
-  // 1. Add your interaction element as ‘input slot' 
+  // 1. Add your interaction element as ‘input slot'
   get slots() {
     return {
       ...super.slots,
@@ -50,7 +50,7 @@ export class LionSlider extends LionField {
   }
 
   // 2. Proxy event `my-slider-changed` to `user-input-changed` event
-  connectedCallback() { 
+  connectedCallback() {
     super.connectedCallback();
     this.addEventListener('my-slider-changed',  this._proxyChangeEvent);
   }

packages/select/README.md

@@ -42,11 +42,11 @@ import '@lion/select/lion-select.js';
 ```
 
 You can preselect an option by setting the property modelValue.
- ```html
+```html
 <lion-select
   name="favoriteColor"
   .modelValue="${'<value of option 2>'}"
 >
   ...
 </lion-select>
- ```
+```