Threw in some fancy doc comments

readme

···
 - @poggers.website
 at://did:plc:7ggpsji45es4auo5pqjmnarr/app.bsky.feed.post/3lx5d3p4oos2n
 
+bro idk what this is anymore but im a fan of it and will keep going
+

src/domlink.ts

···
-let _LCounter = 0; // is there a point to this? idk. might be unnecessary overhead.
+let _LCounter = 0; // is there a point to this? IDK but it feels useful.
+
+/** Core wrapper for {@link HTMLElement DOM elements}. */
 export class Node {
 	wraps: HTMLElement;
 	children: Node[] = [];
-	id: string = "L" + _LCounter++;;
-	constructor(wrap: HTMLElement) {
-		this.wraps = wrap;
+	id: string = "L" + _LCounter++;
+	/**
+	 * Creates a node, wrapping an HTML element.
+	 * @example new Node(document.createElement("h1"));
+	 */
+	constructor(wraps: HTMLElement) {
+		this.wraps = wraps;
 		this.wraps.id = this.id;
 	}
-	// could i make add and with one function? yeah.
-	// will i do that? no.
-	// why not? because it feels nice to have them separate.
-	add(node: Node | string) {
+	/** Adds a child node. Should not be overridden. */
+	add(node: NodeEquivalent) {
 		if (node != undefined) {
 			let xnode: Node;
 			if (typeof node === "string") {
···
 		}
 		return this;
 	}
-	remove(node: Node) {
+	/** Works similarly to {@link add}, but takes multiple nodes and is the one you would want to override. */
+	with(...nodes: NodeEquivalent[]) {
+		nodes.forEach(x=>{this.add(x)});
+		return this;
+	}
+    /** Removes a child node in the same way {@link add} does. */
+	delete(node: Node) {
 		let idx = this.children.indexOf(node);
 		if (idx < 0) {
-			throw new Error("node not a child of this node");
+			throw new Error(`Node ${node.id} not found.`);
 		}
 		this.children.splice(idx, 1);
 		this.wraps.removeChild(node.wraps);
 	}
-	with(...nodes: (Node | string)[]) {
-		nodes.forEach(x=>{this.add(x)});
-		return this
-	}
-	style(fn: (style: CSSStyleDeclaration) => void) {
+    /** Removes one or more child nodes, like {@link with} does adding them. */
+    remove(...nodes: Node[]) {
+        nodes.forEach(x=>{this.delete(x)});
+        return this;
+    }
+    /** Conveniently chain-able callback thing for styling your nodes.
+     * @example new Label("This is a label!").style((s)=>{s.color="maroon";}) */
+    style(fn: (style: CSSStyleDeclaration) => void) {
 		fn(this.wraps.style);
 		return this;
 	}
+    /** Adds a CSS class to your node.
+     * @example new Container().class("my-class") */
 	class(cls: string) {
 		this.wraps.classList.add(cls);
 		return this;
···
 	NEW_TAB = "_blank",
 	OUT_FRAME = "_parent",
 	NOT_FRAME = "_top"
-};
+}
+/** Wrapper for {@link HTMLAnchorElement `<a>`} */
 export class Link extends Node {
 	constructor(around: NodeEquivalent | null) {
 		let a = document.createElement("a");
···
 	set destination(x: string) {
 		(this.wraps as HTMLAnchorElement).href = x;
 	}
-	get destination(): string {
+	// noinspection JSUnusedGlobalSymbols
+    get destination(): string {
 		return (this.wraps as HTMLAnchorElement).href;
 	}
 	set target(x: string) {
···
 	}
 	
 }
+/** Wrapper for {@link HTMLDivElement `<div>`} */
 export class Container extends Node {
 	constructor() {
 		let div = document.createElement("div");
···
 		super(div);
 	}
 }
+/** Vertical Flexbox container */
 export class Column extends Container {
 	constructor() {
 		super();
 		this.wraps.classList.add("LColumn");
 	}
 }
+/** Horizontal Flexbox container */
 export class Row extends Container {
 	constructor() {
 		super();
 		this.wraps.classList.add("LRow");
 	}
 }
+/** Wrapper for {@link HTMLTableElement `<table>`} */
 export class Table extends Node {
 	constructor() {
 		let table = document.createElement("table");
···
 		super(table);
 	}
 }
+/** Wrapper for {@link HTMLTableRowElement `<tr>`} */
 export class TableRow extends Node {
 	constructor() {
 		let tr = document.createElement("tr");
···
 		super(tr);
 	}
 }
+/** Wrapper for {@link HTMLTableCellElement `<td>`} */
 export class TableCell extends Node {
 	constructor() {
 		let td = document.createElement("td");
···
 		super(td);
 	}
 }
+/** An "abstract" class of sorts for {@link HTMLElement}s that have a textContent member. */
 export class Text extends Node {
 	private _text: string = "";
 	get text() {
···
 		this.wraps.textContent = x;
 	}
 }
+/** Wrapper for {@link HTMLSpanElement `<span>`} */
 export class Label extends Text {
 	constructor(text: string = "") {
 		let el = document.createElement("span");
···
 		this.text = text;
 	}
 }
+/** Wrapper for {@link HTMLButtonElement `<button>`} */
 export class Button extends Text {
 	constructor(label: string, action: EventListener) {
 		let btn = document.createElement("button");
···
 		this.text = label;
 	}
 }
-interface Updatable {
-	watch: (watcher: (newValue: string)=>void) => void;
+/** Interface providing {@link Updatable.watch} */
+interface Updatable<T> {
+    /** Takes a callback `watcher` that is called when something like a text input is updated. */
+	watch: (watcher: (newValue: T)=>void) => void;
 }
-export class Input extends Text implements Updatable {
+export class Input extends Text implements Updatable<string> {
 	constructor(type: HTMLInputElement["type"] = "text") {
 		let el = document.createElement("input");
 		el.type = type;
···
 
 
 
-	// Implementation for Updatable
 	watching: ((newValue: string) => void)[] = [];
+    /** Implementation for {@link Updatable.watch} */
 	watch(watcher: (newValue: string)=>void) {
 		this.watching.push(watcher);
-		this.wraps.oninput = (e)=>{watcher(this.value)};
+		this.wraps.oninput = ()=>{watcher(this.value)};
 		watcher(this.value);
 	}
 }
+/** Wrapper for {@link HTMLImageElement `<img>`} */
 export class Image extends Node {
 	constructor(src: string) {
 		let img = document.createElement("img");
···
 		super(img);
 	}
 }
+/** Wrapper for {@link HTMLDialogElement `<dialog>`} with methods to show/hide it as a modal. */
 export class Modal extends Node {
 	constructor() {
 		let dlg: HTMLDialogElement = document.createElement("dialog");
 		dlg.classList.add("LModal");
 		super(dlg);
 	}
+    /** Shows the dialog as a modal. */
 	show() {
 		Body.add(this);
 		(this.wraps as HTMLDialogElement).showModal();
 	}
+    /** Hides the dialog. */
 	hide() {
 		(this.wraps as HTMLDialogElement).close();
 		Body.wraps.removeChild(this.wraps);
 	}
 }
 
-// user helper shit 
+/** Convenience wrapper for the {@link HTMLBodyElement body} of the document. */
 export const Body = new Node(document.body);

src/issuesearch.ts

···
 	(runButton.wraps as HTMLButtonElement).disabled = true;
 	if (last) {
 		try {
-			Body.remove(last);
+			Body.delete(last);
 		} catch {}
 		last = null;
 	}
···
 searchInput.watch((search)=>{
 	if (allIssues.length > 0) {
 		if (last) {
-			Body.remove(last);
+			Body.delete(last);
 		}
 		search = search.toLowerCase();
 		last = renderIssues(allIssues.filter((item)=>{

src/pds.ts

···
 let runButton = new Button("GO!",async ()=>{
 	(runButton.wraps as HTMLButtonElement).disabled = true;
 	if (last) {
-		Body.remove(last);
+		Body.delete(last);
 	}
 	try {
 		last = await listActiveUsers(hostInput.value);