Files
t/js/main.js

41 lines
3.6 KiB
JavaScript
Raw Normal View History

2024-12-21 07:26:27 -08:00
import { ElemWrapper } from "./elemwrapper";
2024-12-22 10:23:37 -08:00
import { SLCard } from "./slcard";
2024-12-21 21:49:43 -08:00
import { SLIcon } from "./slicon";
2024-12-22 10:23:37 -08:00
import { SLInput } from "./slinput";
2024-12-21 21:42:54 -08:00
import { SLTabGroup } from "./sltabgroup";
2024-12-21 07:26:27 -08:00
async function main() {
const root = new ElemWrapper(document.body);
2024-12-21 21:42:54 -08:00
const tabGroup = new SLTabGroup();
root.append(tabGroup);
const [tasksTab, tasksPanel] = tabGroup.addTabSet("tasks");
2024-12-22 10:23:37 -08:00
tasksTab.append(new SLIcon("list-task"));
const tasksCard = new SLCard();
tasksPanel.append(tasksCard);
const tasksInput = new SLInput();
tasksCard.append(tasksInput);
tasksInput.setPill();
const tasksAddIcon = tasksInput.addSuffixIcon("plus-circle");
const addTask = () => {
const task = tasksInput.getValue();
if (task.length === 0) {
return;
}
tasksInput.clear();
tasksInput.focus();
tasksAddIcon.classList.remove("highlight");
void tasksAddIcon.elem.offsetWidth; // force reflow
tasksAddIcon.classList.add("highlight");
};
tasksAddIcon.addEventListener("click", () => {
addTask();
});
tasksInput.addEventListener("keydown", (e) => {
if (e.key === "Enter") {
addTask();
}
});
2024-12-21 21:42:54 -08:00
const [tagsTab, tagsPanel] = tabGroup.addTabSet("tags");
2024-12-21 21:49:43 -08:00
tagsTab.append(new SLIcon("tags"));
2024-12-21 07:26:27 -08:00
}
document.addEventListener("DOMContentLoaded", main);
2024-12-22 10:23:37 -08:00
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoibWFpbi5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uL3RzL21haW4udHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFFLFdBQVcsRUFBRSxNQUFNLGVBQWUsQ0FBQztBQUM1QyxPQUFPLEVBQUUsTUFBTSxFQUFFLE1BQU0sVUFBVSxDQUFDO0FBQ2xDLE9BQU8sRUFBRSxNQUFNLEVBQUUsTUFBTSxVQUFVLENBQUM7QUFDbEMsT0FBTyxFQUFFLE9BQU8sRUFBRSxNQUFNLFdBQVcsQ0FBQztBQUNwQyxPQUFPLEVBQUUsVUFBVSxFQUFFLE1BQU0sY0FBYyxDQUFDO0FBRTFDLEtBQUssVUFBVSxJQUFJO0lBQ2YsTUFBTSxJQUFJLEdBQUcsSUFBSSxXQUFXLENBQUMsUUFBUSxDQUFDLElBQUksQ0FBQyxDQUFDO0lBRTVDLE1BQU0sUUFBUSxHQUFHLElBQUksVUFBVSxFQUFFLENBQUM7SUFDbEMsSUFBSSxDQUFDLE1BQU0sQ0FBQyxRQUFRLENBQUMsQ0FBQztJQUV0QixNQUFNLENBQUMsUUFBUSxFQUFFLFVBQVUsQ0FBQyxHQUFHLFFBQVEsQ0FBQyxTQUFTLENBQUMsT0FBTyxDQUFDLENBQUM7SUFDM0QsUUFBUSxDQUFDLE1BQU0sQ0FBQyxJQUFJLE1BQU0sQ0FBQyxXQUFXLENBQUMsQ0FBQyxDQUFDO0lBRXpDLE1BQU0sU0FBUyxHQUFHLElBQUksTUFBTSxFQUFFLENBQUM7SUFDL0IsVUFBVSxDQUFDLE1BQU0sQ0FBQyxTQUFTLENBQUMsQ0FBQztJQUU3QixNQUFNLFVBQVUsR0FBRyxJQUFJLE9BQU8sRUFBRSxDQUFDO0lBQ2pDLFNBQVMsQ0FBQyxNQUFNLENBQUMsVUFBVSxDQUFDLENBQUM7SUFDN0IsVUFBVSxDQUFDLE9BQU8sRUFBRSxDQUFDO0lBRXJCLE1BQU0sWUFBWSxHQUFHLFVBQVUsQ0FBQyxhQUFhLENBQUMsYUFBYSxDQUFDLENBQUM7SUFFN0QsTUFBTSxPQUFPLEdBQUcsR0FBRyxFQUFFO1FBQ2pCLE1BQU0sSUFBSSxHQUFHLFVBQVUsQ0FBQyxRQUFRLEVBQUUsQ0FBQztRQUNuQyxJQUFJLElBQUksQ0FBQyxNQUFNLEtBQUssQ0FBQyxFQUFFLENBQUM7WUFDcEIsT0FBTztRQUNYLENBQUM7UUFFRCxVQUFVLENBQUMsS0FBSyxFQUFFLENBQUM7UUFDbkIsVUFBVSxDQUFDLEtBQUssRUFBRSxDQUFDO1FBRW5CLFlBQVksQ0FBQyxTQUFTLENBQUMsTUFBTSxDQUFDLFdBQVcsQ0FBQyxDQUFDO1FBQzNDLEtBQUssWUFBWSxDQUFDLElBQUksQ0FBQyxXQUFXLENBQUMsQ0FBQyxlQUFlO1FBQ25ELFlBQVksQ0FBQyxTQUFTLENBQUMsR0FBRyxDQUFDLFdBQVcsQ0FBQyxDQUFDO0lBQzVDLENBQUMsQ0FBQztJQUVGLFlBQVksQ0FBQyxnQkFBZ0IsQ0FBQyxPQUFPLEVBQUUsR0FBRyxFQUFFO1FBQ3hDLE9BQU8sRUFBRSxDQUFDO0lBQ2QsQ0FBQyxDQUFDLENBQUM7SUFFSCxVQUFVLENBQUMsZ0JBQWdCLENBQUMsU0FBUyxFQUFFLENBQUMsQ0FBQyxFQUFFLEVBQUU7UUFDekMsSUFBSyxDQUFtQixDQUFDLEdBQUcsS0FBSyxPQUFPLEVBQUUsQ0FBQztZQUN2QyxPQUFPLEVBQUUsQ0FBQztRQUNkLENBQUM7SUFDTCxDQUFDLENBQUMsQ0FBQztJQUVILE1BQU0sQ0FBQyxPQUFPLEVBQUUsU0FBUyxDQUFDLEdBQUcsUUFBUSxDQUFDLFNBQVMsQ0FBQyxNQUFNLENBQUMsQ0FBQztJQUN4RCxPQUFPLENBQUMsTUFBTSxDQUFDLElBQUksTUFBTSxDQUFDLE1BQU0sQ0FBQyxDQUFDLENBQUM7QUFDdkMsQ0FBQztBQUVELFFBQVEsQ0FBQyxnQkFBZ0IsQ0FBQyxrQkFBa0IsRUFBRSxJQUFJLENBQUMsQ0FBQyJ9