web/html.ts


1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26

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 (typeof args[0] === "object") {
        Object.assign(el, args.shift());
      }

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

      return el;
    },
});

export default h;