[deploy]

public/ts-build/ui/modal.js

@@ -0,0 +1,27 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.showModal = showModal;
+exports.hideModal = hideModal;
+let activeModal = null;
+let backdrop = null;
+function ensureBackdrop() {
+    if (backdrop)
+        return backdrop;
+    backdrop = document.createElement('div');
+    backdrop.className = 'modal-backdrop';
+    backdrop.addEventListener('click', hideModal);
+    document.body.appendChild(backdrop);
+    return backdrop;
+}
+function showModal(content) {
+    const bd = ensureBackdrop();
+    if (!content.parentElement)
+        bd.appendChild(content);
+    activeModal = content;
+    bd.classList.add('show');
+}
+function hideModal() {
+    if (backdrop)
+        backdrop.classList.remove('show');
+    activeModal = null;
+}

public/ts-build/ui/navigation.js

@@ -0,0 +1,57 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.renderSidebar = renderSidebar;
+exports.initNavigation = initNavigation;
+const store_js_1 = require("../state/store.js");
+const defaultNav = [
+    { id: 'overview', label: 'Uebersicht', icon: '[*]' },
+    { id: 'tickets', label: 'Ticketsystem', icon: '[*]' },
+    { id: 'modules', label: 'Module', icon: '[*]' },
+    { id: 'settings', label: 'Einstellungen', icon: '[*]' },
+    { id: 'events', label: 'Events', icon: '[*]' },
+    { id: 'admin', label: 'Admin', icon: '[*]', requiresAdmin: true }
+];
+function renderSidebar(container, isAdmin) {
+    container.innerHTML = '';
+    const brand = document.createElement('div');
+    brand.className = 'brand';
+    brand.textContent = 'Papo Control';
+    const nav = document.createElement('div');
+    nav.className = 'nav';
+    defaultNav.forEach((item) => {
+        if (item.requiresAdmin && !isAdmin)
+            return;
+        const a = document.createElement('a');
+        a.href = `#${item.id}`;
+        a.dataset.target = item.id;
+        a.innerHTML = `<span class="icon">${item.icon || ''}</span>${item.label}`;
+        nav.appendChild(a);
+    });
+    container.appendChild(brand);
+    container.appendChild(nav);
+}
+function initNavigation(onChange) {
+    const navLinks = Array.from(document.querySelectorAll('.nav a'));
+    const activate = (section) => {
+        navLinks.forEach((link) => link.classList.toggle('active', link.dataset.target === section));
+        document.querySelectorAll('.section').forEach((sec) => {
+            sec.classList.toggle('active', sec.id === `section-${section}`);
+        });
+        (0, store_js_1.setState)({}); // trigger listeners for potential observers
+        onChange(section);
+    };
+    navLinks.forEach((link) => {
+        link.addEventListener('click', (e) => {
+            e.preventDefault();
+            const target = link.dataset.target || 'overview';
+            history.replaceState(null, '', `#${target}`);
+            activate(target);
+        });
+    });
+    const initial = (location.hash || '#overview').replace('#', '');
+    activate(initial);
+    window.addEventListener('hashchange', () => {
+        const section = (location.hash || '#overview').replace('#', '');
+        activate(section);
+    });
+}

public/ts-build/ui/switch.js

@@ -0,0 +1,19 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.toggleSwitch = toggleSwitch;
+exports.getSwitch = getSwitch;
+exports.setSwitch = setSwitch;
+function toggleSwitch(el, force) {
+    if (!el)
+        return;
+    const next = force === undefined ? !el.classList.contains('on') : force;
+    el.classList.toggle('on', next);
+}
+function getSwitch(el) {
+    return el?.classList.contains('on') ?? false;
+}
+function setSwitch(el, value) {
+    if (!el)
+        return;
+    el.classList.toggle('on', value);
+}

public/ts-build/ui/toast.js

@@ -0,0 +1,27 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.showToast = showToast;
+exports.hideToast = hideToast;
+let currentTimeout = null;
+function showToast(message, isError = false, duration = 2500) {
+    let toast = document.getElementById('toast-root');
+    if (!toast) {
+        toast = document.createElement('div');
+        toast.id = 'toast-root';
+        document.body.appendChild(toast);
+    }
+    toast.className = `toast ${isError ? 'error' : ''}`;
+    toast.textContent = message;
+    requestAnimationFrame(() => {
+        toast?.classList.add('show');
+    });
+    if (currentTimeout)
+        window.clearTimeout(currentTimeout);
+    currentTimeout = window.setTimeout(() => hideToast(), duration);
+}
+function hideToast() {
+    const toast = document.getElementById('toast-root');
+    if (!toast)
+        return;
+    toast.classList.remove('show');
+}