export type CreateElement<T extends HTMLElement> = {
  (...children: (Node | string)[]): T;
  (attrs: Partial<T>, ...children: (Node | string)[]): T;
};

type ElementCreator = {
  [K in keyof HTMLElementTagNameMap]: CreateElement<HTMLElementTagNameMap[K]>;
};

const h = new Proxy({} as ElementCreator, {
  get:
    (_, tag: string) =>
    (...args: any[]) => {
      const el = document.createElement(tag);

      if (args[0]?.constructor === Object) {
        const { dataset, ...attrs } = args.shift();

        Object.assign(el, attrs);

        if (dataset) {
          Object.assign(el.dataset, dataset);
        }
      }

      el.append(...args.flat());

      return el;
    },
});

export default h;