Add Widget.remove

package.json

@@ -1,6 +1,6 @@
 {
   "name": "tool-shop-js-widget",
-  "version": "0.0.5",
+  "version": "0.0.6",
   "description": "JavaScript Declarative UI Library that provides functions to easily create instances of HTMLElements without writing HTML code.",
   "main": "src/index.js",
   "scripts": {

readme.md

@@ -4,7 +4,6 @@ This JavaScript Declarative UI library provides an easy to use wrapper to create
 
 [![Tests](https://github.com/dobschal/tool-shop-js-widget/actions/workflows/unit-test.yml/badge.svg)](https://github.com/dobschal/tool-shop-js-widget/actions/workflows/unit-test.yml)
 [![NPM](https://img.shields.io/npm/v/tool-shop-js-widget)](https://www.npmjs.com/package/tool-shop-js-widget)
-[![Size](https://img.shields.io/bundlephobia/min/tool-shop-js-widget?style=plastic)](https://img.shields.io/bundlephobia/min/tool-shop-js-widget?style=plastic)
 
 <hr />
 
@@ -60,6 +59,21 @@ parcel index.html
 ```
 <hr />
 
+## For Contributors
+
+A GitHub Action is setup to automatically publish the latest version on making a GitHub Release.
+Just bump the version in the package.json file and create a tag on GitHub for the release.
+
+## API
+
+### Constructor
+
+### Remove
+Remove an instance of HTMLElement from DOM:
+```javascript
+Widget.remove(element);
+```
+
 ## Options
 All options are optional!
 

src/index.js

@@ -21,6 +21,7 @@
 export { Image } from "./Image.js";
 export { Text } from "./Text.js";
 export { Headline } from "./Headline.js";
+export { Paragraph } from "./Paragraph.js";
 
 /**
  * @param {WidgetConfig} config 
@@ -192,4 +193,15 @@ const _handlers = {
         htmlElement.innerHTML = "";
         htmlElement.append(...config.children);
     }
+};
+
+/**
+ * @param {HTMLElement} element 
+ * @returns {boolean} - true if element removed
+ */
+Widget.remove = function(element) {
+    if(!element || !element.parentNode) {
+        return false;
+    }
+    element.parentElement.removeChild(element);
 };

src/index.test.js

@@ -3,6 +3,18 @@ import { jest, it, expect, describe } from "@jest/globals";
 
 describe("Widget", () => {
 
+    it("should remove a child on calling remove", () => {
+        const child = Widget({
+            text: "yeah"
+        });
+        const el = Widget({
+            children: cb => cb([child])
+        });
+        expect(el.children.length).toBe(1);
+        Widget.remove(child);
+        expect(el.children.length).toBe(0);
+    });
+
     it("should set children from callback", () => {
         const el = Widget({
             children: cb => cb([Widget({