public class Sample extends App {

    @Override
    public void run() throws DwcAppInitializeException {

        AppPanel panel = new AppPanel();

        Button open = new Button("Button 1");
        open.onClick((e) -> {
            // do something
        });

        Button close = new Button("Button 2");
        close.onClick((e) -> {
            // do something
        });

        // add all at once
        panel.add(open, close);
    }
}

AppPanel panel = new AppPanel();

Div c = new Div();
c.addClassName("my-class");
c.add(new Label("My Text"));

panel.add(c);
panel.add(c);

    @Override
    @SuppressWarnings("java:S3011") // allow increasing acessibility
    public void create(AbstractControl ctrl, AbstractDwcjPanel panel) throws IllegalAccessException {

        StackTraceElement[] stack = Thread.currentThread().getStackTrace();
        String caller = stack[2].getClassName();

        if (caller.startsWith("org.dwcj.")) {
            try {
                boolean found = false;
                Class<?> clazz = ctrl.getClass();
                while (clazz != null && !found) {
                    Method[] methods = clazz.getDeclaredMethods();
                    for (Method method : methods) {
                        if (method.getName().equals("create") &&
                                method.getParameterCount() == 1 &&
                                method.getParameterTypes()[0]
                                        .equals(Class.forName("org.dwcj.controls.panels.AbstractDwcjPanel"))) {
                            method.setAccessible(true);
                            method.invoke(ctrl, panel);
                            found = true;
                            break;
                        }
                    }

                    if (!found)
                        clazz = clazz.getSuperclass();
                }
            } catch (Exception e) {
                Environment.logError(e);
            }
            return;
        }

        App.consoleLog(caller + YOU_RE_NOT_ALLOWED_TO_ACCESS_THIS_METHOD);
        throw new IllegalAccessException(caller + YOU_RE_NOT_ALLOWED_TO_ACCESS_THIS_METHOD);
    }

import org.dwcj.App;
import org.dwcj.controls.label.Label;
import org.dwcj.controls.panels.AppPanel;
import org.dwcj.controls.panels.Div;
import org.dwcj.exceptions.DwcException;


public class Playground extends App {

  @Override
  public void run() throws DwcException {
    AppPanel panel = new AppPanel();
    panel.addClassName("bbj-app-layout-sample");

    Div c = new Div();
    c.addClassName("bbj-header");
    c.setAttribute("test","test");
    c.setStyle("color","red");
    c.add(new Label("test"));
    panel.add(c);

  }
}

    @Override
    public Button setText(String text) {
        super.setText(text);
        return this;
    }

    @Override
    public Button setVisible(Boolean visible){
        super.setVisible(visible);
        return this;
    }

   ....

public interface Control<T> {

    public T setId(String id);

    public String getId();
}

abstract public class AbstractControl<T> implements Control<T> {

    private String id;

    @Override
    public T setId(String id) {
        this.id = id;
        
        // this should be safe
        @SuppressWarnings("unchecked")
        T self = (T) this;

        return self;
    }

    public String getId() {
        return id;
    }
}

public class AbstractDwcControl<T> extends AbstractControl<T> {

    private HashMap<String, String> attributes = new HashMap<String, String>();

    public T setAttribute(String name, String value) {
        attributes.put(name, value);

        // this should be safe
        @SuppressWarnings("unchecked")
        T self = (T) this;

        return self;
    }

    public String getAttribute(String name) {
        return attributes.get(name);
    }
}

public final class Button extends AbstractDwcControl<Button> {

    private String text;

    public Button setText(String text) {
        this.text = text;
        return this;
    }

    public String getText() {
        return text;
    }
}

public class App {
    public static void main(String[] args) {
        Button button = new Button();
        button.setId("button1").setText("Text").setAttribute("name", "attribute1");

        System.out.println(button.getId());
        System.out.println(button.getText());
        System.out.println(button.getAttribute("name"));
    }
}

package dwcjsample;

import org.dwcj.App;
import org.dwcj.controls.Button;
import org.dwcj.events.ButtonPushEvent;
import org.dwcj.exceptions.DwcAppInitializeException;
import org.dwcj.panels.AppPanel;

public class ControlFieldInitializeErrorSample extends App {

    private Button button = new Button("hey");

    @Override
    public void run() throws DwcAppInitializeException {
        AppPanel appPanel = new AppPanel();
        appPanel.add(button);

        button.onClick(this::onButtonClick);
        new SampleAppPanel();
    }
    private void onButtonClick(ButtonPushEvent buttonPushEvent){
        button.setText("clicked");
    }
}

package dwcjsample;

import org.dwcj.controls.Button;
import org.dwcj.exceptions.DwcAppInitializeException;
import org.dwcj.panels.AppPanel;

public class StephanMethod extends AppPanel{

    private Button myButton = new Button("myTdddext");

    public StephanMethod() throws DwcAppInitializeException {
        super();
        add(myButton);
    }
}

package dwcjsample;

import org.dwcj.App;
import org.dwcj.exceptions.DwcAppInitializeException;

public class MyClass extends App {
    @Override
    public void run() throws DwcAppInitializeException {
        new StephanMethod();
    }
}

    public HtmlContainerJavascriptEvent(HtmlContainer h, Map<String,String> eventMap) {
        this.control = h;
        this.eventMap = eventMap;
    }

package org.demo;

import org.dwcj.App;
import org.dwcj.annotations.AppTheme;
import org.dwcj.annotations.AppTitle;
import org.dwcj.annotations.InlineStyleSheet;
import org.dwcj.controls.panels.AppPanel;
import org.dwcj.controls.textbox.TextBox;
import org.dwcj.exceptions.DwcException;

@AppTheme("dark")
@AppTitle("QR Code Generator")
@InlineStyleSheet(value = "css/style.css", local = true, id = "app-bundle")
public class Playground extends App {

  @Override
  public void run() throws DwcException {
    AppPanel panel = new AppPanel();
    panel.addClassName("app-panel");

    String defaultValue = "https://dwcj.org/";

    QRCode qr = new QRCode(defaultValue);
    qr.setSize(200);
    qr.setColor(Color.ORANGE);

    TextBox editBox = new TextBox();
    editBox.setText(defaultValue);
    editBox.setExpanse(TextBox.Expanse.LARGE);
    editBox.setAttribute("placeholder", "Enter a value");
    editBox.onEditModify((e) -> {
      qr.setValue(editBox.getText());
    });

    panel.add(qr, editBox);
  }
}

package org.demo;

import java.awt.Color;
import java.util.UUID;

import org.dwcj.annotations.Attribute;
import org.dwcj.annotations.JavaScript;
import org.dwcj.controls.AbstractControl;
import org.dwcj.controls.htmlcontainer.HtmlContainer;
import org.dwcj.controls.panels.AbstractDwcjPanel;

/**
 * QRCode Generator using Shoelace QRCode component
 * 
 * @author Hyyan Abo Fakher
 */
@JavaScript(id = "shoelace-qr-code", url = "https://cdn.jsdelivr.net/npm/@shoelace-style/[email protected]/dist/shoelace.js", attributes = {
    @Attribute(name = "type", value = "module")
})
final public class QRCode extends AbstractControl {
  private HtmlContainer hv;
  private final String uuid = UUID.randomUUID().toString().substring(0, 8);
  private String value;
  private int size = 65;
  private Color color = Color.BLACK;

  public QRCode() {
    super();
  }

  public QRCode(String value) {
    super();
    this.value = value;
  }

  /**
   * Get the UUID of the toast.
   * 
   * @return the UUID of the toast.
   */
  public String getUUID() {
    return uuid;
  }

  /**
   * Get the value of the QRCode
   * 
   * @return the value of the QRCode
   */
  public String getValue() {
    return value;
  }

  /**
   * Set the value of the QRCode
   * 
   * @param value the value of the QRCode
   */
  public QRCode setValue(String value) {
    this.value = value;
    hv.executeAsyncScript("document.querySelector(\"[data-hv='" + getUUID()
        + "']\").querySelector('sl-qr-code').setAttribute('value', '" + value + "')");
    return this;
  }

  /**
   * Get the size of the QRCode
   * 
   * @return the size of the QRCode
   */
  public int getSize() {
    return size;
  }

  /**
   * Set the size of the QRCode
   * 
   * @param size the size of the QRCode
   */
  public QRCode setSize(int size) {
    this.size = size;
    hv.executeAsyncScript("document.querySelector(\"[data-hv='" + getUUID()
        + "']\").querySelector('sl-qr-code').setAttribute('size', '" + size + "')");
    return this;
  }

  /**
   * Get the color of the QRCode
   * 
   * @return the color of the QRCode
   */
  public Color getColor() {
    return color;
  }

  /**
   * Set the color of the QRCode
   * 
   * @param color the color of the QRCode
   */
  public QRCode setColor(Color color) {
    this.color = color;
    hv.executeAsyncScript("document.querySelector(\"[data-hv='" + getUUID()
        + "']\").querySelector('sl-qr-code').setAttribute('fill', '" + toHexString(color) + "')");
    return this;
  }

  /**
   * Create the control
   * 
   * @param p the parent panel
   */
  protected void create(AbstractDwcjPanel p) {
    super.create(p);

    hv = new HtmlContainer("<sl-qr-code value='" + value + "' size='" + size
        + "' fill='" + toHexString(color) + "'></sl-qr-code>");
    hv.setAttribute("data-hv", getUUID());
    hv.setTabTraversable(false);
    hv.setFocusable(false);

    // add the control to the parent panel
    p.add(hv);
  }

  /**
   * Convert a color to a hex string
   * 
   * @param color the color to convert
   * @return
   */
  private String toHexString(Color color) {
    return String.format("#%02x%02x%02x", color.getRed(), color.getGreen(), color.getBlue());
  }
}