Add button group component

button-group.js

@@ -0,0 +1,45 @@
+export class ButtonGroup extends HTMLElement {
+  constructor() {
+    super()
+    this.attachShadow({open: true})
+  }
+
+  connectedCallback() {
+    const style = document.createElement('style')
+    style.value = `
+      :host {
+        display: flex;
+        direction: row-reverse;
+        gap: 5px;
+      }
+      button {
+        font-family: sans-serif;
+        font-weight: normal;
+        background: #111;
+        color: #eee;
+      }
+    `
+    this.shadowRoot.appendChild(style)
+  }
+
+  addButton(text, cls, handler) {
+    const el = document.createElement('button')
+    el.innerText = text
+    el.classList.add(cls)
+    el.addEventListener('click', () => handler)
+    this.shadowRoot.appendChild(el)
+    return el
+  }
+
+  addPrimary(text, handler) {
+    this.primary = this.addButton(
+      text, 'primary', handler
+    )
+  }
+
+  addCancel(text, handler) {
+    this.cancel = this.addButton(
+      text, 'cancel', handler
+    )
+  }
+}