Add helper to form elements

app/components/input-select.hbs

@@ -15,4 +15,7 @@
     as |option select|>
     {{yield option select}}
   </PowerSelect>
+  {{#if @helper}}
+    <div class="mt-1 text-sm">{{@helper}}</div>
+  {{/if}}
 </div>

app/components/input-text.hbs

@@ -20,4 +20,7 @@
       {{on 'input' this.onChange}}
     >
   </div>
+  {{#if @helper}}
+    <div class="mt-1 text-sm">{{@helper}}</div>
+  {{/if}}
 </div>

app/components/input-textarea.hbs

@@ -19,4 +19,7 @@
       {{on 'input' this.onChange}}
     >{{@value}}</textarea>
   </div>
+  {{#if @helper}}
+    <div class="mt-1 text-sm">{{@helper}}</div>
+  {{/if}}
 </div>

app/controllers/admin/indexes/item/settings.js

@@ -3,7 +3,14 @@ import { action } from '@ember/object';
 import arrayEquals from 'meilisearch-admin/utils/array-equals';
 
 export default class AdminIndexesItemSettingsController extends Controller {
-  returnChar = '\n';
+  @action
+  saveStopWords(str) {
+    if (typeof str !== 'string' || str === '') {
+      this.model.settings.stopWords = [];
+    } else {
+      this.model.settings.stopWords = str.split(',').map((item) => item.trim());
+    }
+  }
 
   @action
   save() {

app/templates/admin/indexes/item/settings.hbs

@@ -80,8 +80,9 @@
 
 <InputTextarea
   @label="Stop-words"
-  @value={{join this.returnChar @model.settings.stopWords}}
-  @onChange={{pipe (split this.returnChar) (set @model.settings 'stopWords')}}
+  @value={{join ', ' @model.settings.stopWords}}
+  @onChange={{this.saveStopWords}}
+  @helper="Format: of, the, to"
 />
 
 <Button