Add items to the Select element dynamically (#131)

* Move remove item to list component

* implement add and remove items methods

src/List.ts

@@ -205,4 +205,21 @@ export class List extends Container
             }
         });
     }
+
+    /**
+     * Removes items from the list. (Does not destroy them)
+     * @param itemID - Item to remove (starting from 0).
+     */
+    removeItem(itemID: number)
+    {
+        const child = this.children[itemID];
+
+        if (!child)
+        {
+            return;
+        }
+
+        this.removeChild(child);
+        this.arrangeChildren();
+    }
 }

src/ScrollBox.ts

@@ -214,14 +214,7 @@ export class ScrollBox extends Container
      */
     removeItem(itemID: number)
     {
-        const child = this.list.children[itemID];
-
-        if (!child)
-        {
-            return;
-        }
-
-        this.list.removeChild(child);
+        this.list.removeItem(itemID);
 
         this.resize();
     }

src/Select.ts

@@ -16,9 +16,9 @@ type Offset = {
 export type SelectItemsOptions = {
     items: string[];
     backgroundColor: number | string;
+    width: number;
+    height: number;
     hoverColor?: number;
-    width?: number;
-    height?: number;
     textStyle?: Partial<TextStyle>;
     radius?: number;
 };
@@ -193,6 +193,16 @@ export class Select extends Container
             this.scrollBox.y += scrollBox.offset.y ?? 0;
         }
 
+        this.addItems(items, selected);
+    }
+
+    /**
+     * Adds items to the dropdown.
+     * @param items
+     * @param selected
+     */
+    addItems(items: SelectItemsOptions, selected = 0)
+    {
         this.convertItemsToButtons(items).forEach((button, id) =>
         {
             const text = button.text;
@@ -216,6 +226,15 @@ export class Select extends Container
         });
     }
 
+    /**
+     * Remove items from the dropdown.
+     * @param itemID - Item to remove (starting from 0).
+     */
+    removeItem(itemID: number)
+    {
+        this.scrollBox.removeItem(itemID);
+    }
+
     /** Toggle the select state (open if closed, closes - id open). */
     toggle()
     {