domma-cms 0.2.1 → 0.3.0

package/admin/js/views/dashboard.js

@@ -1,56 +1 @@
-/**
- * Dashboard View
- * Shows page count stats and a recent pages table.
- */
-import {api} from '../api.js';
-
-export const dashboardView = {
-    templateUrl: '/admin/js/templates/dashboard.html',
-
-    async onMount($container) {
-        const pages = await api.pages.list().catch(() => []);
-        const total = pages.length;
-        const published = pages.filter(p => p.status === 'published').length;
-        const drafts = pages.filter(p => p.status === 'draft').length;
-
-        $container.find('#stat-total').text(total);
-        $container.find('#stat-published').text(published);
-        $container.find('#stat-drafts').text(drafts);
-
-        Domma.effects.counter('#stat-total, #stat-published, #stat-drafts', {
-            trigger: 'immediate',
-            duration: 1000,
-            stagger: 120,
-            easing: 'ease-out'
-        });
-
-        const recent = [...pages]
-            .sort((a, b) => (b.updatedAt || '').localeCompare(a.updatedAt || ''))
-            .slice(0, 10);
-
-        T.create('#recent-pages-table', {
-            data: recent,
-            columns: [
-              {key: 'title', title: 'Title'},
-              {key: 'urlPath', title: 'URL'},
-              {
-                key: 'status',
-                title: 'Status',
-                render: (val) => `<span class="badge badge-${val === 'published' ? 'success' : 'warning'}">${val}</span>`
-              },
-              {key: 'updatedAt', title: 'Updated', render: (val) => val ? D(val).format('DD MMM YYYY') : '—'},
-              {
-                key: 'urlPath',
-                title: '',
-                render: (val) => `<a href="#/pages/edit${val}" class="btn btn-sm btn-outline">Edit</a>`
-              }
-            ],
-            emptyMessage: 'No pages yet. <a href="#/pages/new">Create your first page</a>.'
-        });
-
-        Domma.icons.scan();
-
-        Domma.effects.reveal('.stat-card', { animation: 'fade', stagger: 80, duration: 400 });
-        Domma.effects.reveal('.card.mt-4',  { animation: 'fade', delay: 200,  duration: 400 });
-    }
-};
+import{api as l}from"../api.js";export const dashboardView={templateUrl:"/admin/js/templates/dashboard.html",async onMount(a){const e=await l.pages.list().catch(()=>[]),s=e.length,d=e.filter(t=>t.status==="published").length,r=e.filter(t=>t.status==="draft").length;a.find("#stat-total").text(s),a.find("#stat-published").text(d),a.find("#stat-drafts").text(r),Domma.effects.counter("#stat-total, #stat-published, #stat-drafts",{trigger:"immediate",duration:1e3,stagger:120,easing:"ease-out"});const i=[...e].sort((t,n)=>(n.updatedAt||"").localeCompare(t.updatedAt||"")).slice(0,10);T.create("#recent-pages-table",{data:i,columns:[{key:"title",title:"Title"},{key:"urlPath",title:"URL"},{key:"status",title:"Status",render:t=>`<span class="badge badge-${t==="published"?"success":"warning"}">${t}</span>`},{key:"updatedAt",title:"Updated",render:t=>t?D(t).format("DD MMM YYYY"):"\u2014"},{key:"urlPath",title:"Actions",render:t=>`<a href="#/pages/edit${t}" class="btn btn-sm btn-outline">Edit</a>`}],emptyMessage:'No pages yet. <a href="#/pages/new">Create your first page</a>.'}),Domma.icons.scan(),Domma.effects.reveal(".stat-card",{animation:"fade",stagger:80,duration:400}),Domma.effects.reveal(".card.mt-4",{animation:"fade",delay:200,duration:400})}};

package/admin/js/views/documentation.js

@@ -1,12 +1 @@
-/**
- * Documentation View
- * Usage reference for Domma CMS — content, structure, plugins, settings.
- */
-export const documentationView = {
-  templateUrl: '/admin/js/templates/documentation.html',
-
-  async onMount($container) {
-    Domma.icons.scan();
-    Domma.syntax.scan();
-  }
-};
+export const documentationView={templateUrl:"/admin/js/templates/documentation.html",async onMount(n){Domma.icons.scan(),Domma.syntax.scan()}};

package/admin/js/views/index.js

@@ -1,39 +1 @@
-/**
- * View Registry
- * Maps route view names to their view modules.
- */
-import {dashboardView} from './dashboard.js';
-import {pagesView} from './pages.js';
-import {pageEditorView} from './page-editor.js';
-import {settingsView} from './settings.js';
-import {navigationView} from './navigation.js';
-import {layoutsView} from './layouts.js';
-import {mediaView} from './media.js';
-import {loginView} from './login.js';
-import {usersView} from './users.js';
-import {userEditorView} from './user-editor.js';
-import {pluginsView} from './plugins.js';
-import {documentationView} from './documentation.js';
-import {tutorialsView} from './tutorials.js';
-import {collectionsView} from './collections.js';
-import {collectionEditorView} from './collection-editor.js';
-import {collectionEntriesView} from './collection-entries.js';
-
-export const views = {
-    dashboard:   dashboardView,
-    pages:       pagesView,
-    pageEditor:  pageEditorView,
-    settings:    settingsView,
-    navigation:  navigationView,
-    layouts:     layoutsView,
-    media:       mediaView,
-    login:       loginView,
-    users:       usersView,
-    userEditor:  userEditorView,
-  plugins:           pluginsView,
-  documentation:     documentationView,
-  tutorials:         tutorialsView,
-  collections:       collectionsView,
-  collectionEditor:  collectionEditorView,
-  collectionEntries: collectionEntriesView
-};
+import{dashboardView as o}from"./dashboard.js";import{pagesView as i}from"./pages.js";import{pageEditorView as r}from"./page-editor.js";import{settingsView as t}from"./settings.js";import{navigationView as e}from"./navigation.js";import{layoutsView as m}from"./layouts.js";import{mediaView as s}from"./media.js";import{loginView as n}from"./login.js";import{usersView as p}from"./users.js";import{userEditorView as a}from"./user-editor.js";import{pluginsView as l}from"./plugins.js";import{documentationView as w}from"./documentation.js";import{tutorialsView as f}from"./tutorials.js";import{collectionsView as V}from"./collections.js";import{collectionEditorView as c}from"./collection-editor.js";import{collectionEntriesView as d}from"./collection-entries.js";export const views={dashboard:o,pages:i,pageEditor:r,settings:t,navigation:e,layouts:m,media:s,login:n,users:p,userEditor:a,plugins:l,documentation:w,tutorials:f,collections:V,collectionEditor:c,collectionEntries:d};

package/admin/js/views/layouts.js

@@ -1,49 +1,16 @@
-/**
- * Layouts View
- */
-import { api } from '../api.js';
-
-export const layoutsView = {
-    templateUrl: '/admin/js/templates/layouts.html',
-
-    async onMount($container) {
-        let presets = await api.layouts.get().catch(() => ({}));
-        const $grid = $container.find('#presets-grid').empty();
-
-        Object.entries(presets).forEach(([key, preset]) => {
-            $grid.append(`
-                <div class="preset-card card" data-key="${key}">
+import{api as c}from"../api.js";export const layoutsView={templateUrl:"/admin/js/templates/layouts.html",async onMount(a){E.tabs(a.find("#layouts-tabs").get(0));let t=await c.layouts.get().catch(()=>({}));const r=a.find("#presets-grid").empty();Object.entries(t).forEach(([s,e])=>{r.append(`
+                <div class="preset-card card" data-key="${s}">
                     <div class="card-header">
-                        <h3>${preset.label || key}</h3>
-                        <span class="badge">${key}</span>
+                        <h3>${e.label||s}</h3>
+                        <span class="badge">${s}</span>
                     </div>
                     <div class="card-body">
-                        <p class="text-muted">${preset.description || ''}</p>
+                        <p class="text-muted">${e.description||""}</p>
                         <div class="preset-toggles">
-                            <label class="toggle-label"><input type="checkbox" class="form-check preset-navbar" ${preset.navbar ? 'checked' : ''}> Navbar</label>
-                            <label class="toggle-label"><input type="checkbox" class="form-check preset-footer" ${preset.footer ? 'checked' : ''}> Footer</label>
-                            <label class="toggle-label"><input type="checkbox" class="form-check preset-sidebar" ${preset.sidebar ? 'checked' : ''}> Sidebar</label>
+                            <label class="toggle-label"><input type="checkbox" class="form-check preset-navbar" ${e.navbar?"checked":""}> Navbar</label>
+                            <label class="toggle-label"><input type="checkbox" class="form-check preset-footer" ${e.footer?"checked":""}> Footer</label>
+                            <label class="toggle-label"><input type="checkbox" class="form-check preset-sidebar" ${e.sidebar?"checked":""}> Sidebar</label>
                         </div>
                     </div>
                 </div>
-            `);
-        });
-
-        $container.find('#save-layouts-btn').on('click', async () => {
-            $container.find('.preset-card').each(function () {
-                const key = $(this).data('key');
-                if (presets[key]) {
-                    presets[key].navbar = $(this).find('.preset-navbar').is(':checked');
-                    presets[key].footer = $(this).find('.preset-footer').is(':checked');
-                    presets[key].sidebar = $(this).find('.preset-sidebar').is(':checked');
-                }
-            });
-            try {
-                await api.layouts.save(presets);
-                E.toast('Layouts saved.', { type: 'success' });
-            } catch {
-                E.toast('Failed to save layouts.', { type: 'error' });
-            }
-        });
-    }
-};
+            `)}),a.find("#save-layouts-btn").on("click",async()=>{a.find(".preset-card").each(function(){const s=$(this).data("key");t[s]&&(t[s].navbar=$(this).find(".preset-navbar").is(":checked"),t[s].footer=$(this).find(".preset-footer").is(":checked"),t[s].sidebar=$(this).find(".preset-sidebar").is(":checked"))});try{await c.layouts.save(t),E.toast("Layouts saved.",{type:"success"})}catch{E.toast("Failed to save layouts.",{type:"error"})}});const l=await c.layouts.getOptions().catch(()=>({spacerSize:8,spacerClass:""})),o=a.find("#spacer-size-input"),i=a.find("#spacer-class-input");o.val(l.spacerSize??8),i.val(l.spacerClass??""),a.find("#save-options-btn").on("click",async()=>{const s=parseInt(o.val(),10)||8,e=i.val().trim();try{await c.layouts.saveOptions({spacerSize:s,spacerClass:e}),E.toast("Layout options saved.",{type:"success"})}catch{E.toast("Failed to save layout options.",{type:"error"})}})}};

package/admin/js/views/login.js

@@ -1,255 +1,11 @@
-/**
- * Login / First-time Setup View
- *
- * Flow:
- *  - Already logged in  → redirect to dashboard
- *  - needsSetup = true  → show setup form → onboarding wizard (site → theme → done)
- *  - needsSetup = false → show login form → redirect to dashboard
- */
-import {api, isAuthenticated, setAuthData} from '../api.js';
-
-// ---------------------------------------------------------------------------
-// Blueprints
-// ---------------------------------------------------------------------------
-
-const setupBlueprint = {
-    name: {
-        type: 'string',
-        required: true,
-        minLength: 2,
-        label: 'Full Name',
-        formConfig: { placeholder: 'Your name', autocomplete: 'name' }
-    },
-    email: {
-        type: 'email',
-        required: true,
-        label: 'Email Address',
-        formConfig: { placeholder: 'admin@example.com', autocomplete: 'email' }
-    },
-    password: {
-        type: 'password',
-        required: true,
-        minLength: 8,
-        label: 'Password',
-        formConfig: { placeholder: '••••••••', autocomplete: 'new-password', tooltip: 'Minimum 8 characters' }
-    }
-};
-
-const loginBlueprint = {
-    email: {
-        type: 'email',
-        required: true,
-        label: 'Email Address',
-        formConfig: { placeholder: 'you@example.com', autocomplete: 'email' }
-    },
-    password: {
-        type: 'password',
-        required: true,
-        label: 'Password',
-        formConfig: { placeholder: '••••••••', autocomplete: 'current-password' }
-    }
-};
-
-const THEMES = [
-    { id: 'charcoal-dark',  label: 'Charcoal',  dark: true,  primary: '#5b8cff', bg: '#1a1d23' },
-    { id: 'charcoal-light', label: 'Charcoal',  dark: false, primary: '#4a7aff', bg: '#f4f5f7' },
-    { id: 'ocean-dark',     label: 'Ocean',      dark: true,  primary: '#00b4d8', bg: '#0d1b2a' },
-    { id: 'ocean-light',    label: 'Ocean',      dark: false, primary: '#0096c7', bg: '#e8f4f8' },
-    { id: 'forest-dark',    label: 'Forest',     dark: true,  primary: '#52b788', bg: '#1a231e' },
-    { id: 'forest-light',   label: 'Forest',     dark: false, primary: '#40916c', bg: '#f0f7f4' },
-    { id: 'sunset-dark',    label: 'Sunset',     dark: true,  primary: '#ff6b6b', bg: '#1f1a1a' },
-    { id: 'sunset-light',   label: 'Sunset',     dark: false, primary: '#e05555', bg: '#fff0f0' },
-    { id: 'royal-dark',     label: 'Royal',      dark: true,  primary: '#9b59b6', bg: '#1a1525' },
-    { id: 'royal-light',    label: 'Royal',      dark: false, primary: '#8e44ad', bg: '#f5f0fa' },
-    { id: 'lemon-dark',     label: 'Lemon',      dark: true,  primary: '#f1c40f', bg: '#1a1a10' },
-    { id: 'lemon-light',    label: 'Lemon',      dark: false, primary: '#d4ac0d', bg: '#fffef0' },
-    { id: 'silver-dark',    label: 'Silver',     dark: true,  primary: '#95a5a6', bg: '#1c1e20' },
-    { id: 'silver-light',   label: 'Silver',     dark: false, primary: '#7f8c8d', bg: '#f2f3f4' },
-  {id: 'grayve-dark', label: 'Grayve', dark: true, primary: '#00bcd4', bg: '#1a1e21'},
-  {id: 'grayve-light', label: 'Grayve', dark: false, primary: '#00838f', bg: '#ffffff'},
-];
-
-export const loginView = {
-    templateUrl: '/admin/js/templates/login.html',
-
-    async onMount($container) {
-        if (isAuthenticated()) {
-            R.navigate('/');
-            return;
-        }
-
-        let needsSetup = false;
-        try {
-            const status = await api.auth.setupStatus();
-            needsSetup = status.needsSetup;
-        } catch {
-            E.toast('Could not reach the server.', { type: 'error' });
-        }
-
-        if (needsSetup) {
-            showStep($container, 'setup');
-            bindSetup($container);
-        } else {
-            showStep($container, 'login');
-            bindLogin($container);
-        }
-
-        Domma.icons.scan();
-    }
-};
-
-// ---------------------------------------------------------------------------
-// Panel switching
-// ---------------------------------------------------------------------------
-
-const PANELS = ['setup', 'onboarding-site', 'onboarding-theme', 'onboarding-done', 'login'];
-
-function showStep($container, name) {
-    PANELS.forEach(p => $container.find(`#${p}-panel`).hide());
-    $container.find(`#${name}-panel`).show();
-    Domma.icons.scan();
-}
-
-// ---------------------------------------------------------------------------
-// Setup step
-// ---------------------------------------------------------------------------
-
-function bindSetup($container) {
-    F.render('#setup-form-container', setupBlueprint, {}, {
-        layout: 'stacked',
-        submitText: 'Create admin account',
-        onSubmit: async (data) => {
-            try {
-                const result = await api.auth.setup(data);
-                setAuthData(result);
-                showStep($container, 'onboarding-site');
-                bindOnboardingSite($container);
-            } catch (err) {
-                E.toast(err.message || 'Setup failed. Please try again.', { type: 'error' });
-                return false;
-            }
-        }
-    });
-}
-
-// ---------------------------------------------------------------------------
-// Onboarding Step 2 — Site Identity
-// ---------------------------------------------------------------------------
-
-function bindOnboardingSite($container) {
-    $container.find('#ob-site-skip').on('click', (e) => {
-        e.preventDefault();
-        showStep($container, 'onboarding-theme');
-        buildThemeGrid($container);
-        bindOnboardingTheme($container);
-    });
-
-    $container.find('#ob-site-btn').on('click', async () => {
-        $container.find('#ob-site-error').hide();
-        const title   = $container.find('#ob-title').val().trim();
-        const tagline = $container.find('#ob-tagline').val().trim();
-
-        const $btn = $container.find('#ob-site-btn').prop('disabled', true).text('Saving…');
-        try {
-            // Fetch current settings then merge title + tagline
-            const current = await api.settings.get();
-            await api.settings.save({
-                ...current,
-                title:   title   || current.title,
-                tagline: tagline || current.tagline,
-                seo: {
-                    ...(current.seo || {}),
-                    defaultTitle: title || (current.seo && current.seo.defaultTitle)
-                }
-            });
-
-            // Also update nav brand text
-            const nav = await api.navigation.get();
-            await api.navigation.save({
-                ...nav,
-                brand: { ...(nav.brand || {}), text: title || nav.brand.text }
-            });
-
-            showStep($container, 'onboarding-theme');
-            buildThemeGrid($container);
-            bindOnboardingTheme($container);
-        } catch (err) {
-            showError($container, 'ob-site-error', err.message || 'Could not save site details.');
-        } finally {
-            $btn.prop('disabled', false).text('Continue');
-        }
-    });
-}
-
-// ---------------------------------------------------------------------------
-// Onboarding Step 3 — Theme Picker
-// ---------------------------------------------------------------------------
-
-function buildThemeGrid($container) {
-    const $grid = $container.find('#theme-grid').empty();
-    THEMES.forEach(t => {
-        const $card = $(`
-            <div class="theme-swatch" data-theme="${t.id}" title="${t.id}">
-                <div class="theme-swatch-preview" style="background:${t.bg}">
-                    <div class="theme-swatch-accent" style="background:${t.primary}"></div>
+import{api as i,isAuthenticated as c,setAuthData as o}from"../api.js";const f={name:{type:"string",required:!0,minLength:2,label:"Full Name",formConfig:{placeholder:"Your name",autocomplete:"name"}},email:{type:"email",required:!0,label:"Email Address",formConfig:{placeholder:"admin@example.com",autocomplete:"email"}},password:{type:"password",required:!0,minLength:8,label:"Password",formConfig:{placeholder:"\u2022\u2022\u2022\u2022\u2022\u2022\u2022\u2022",autocomplete:"new-password",tooltip:"Minimum 8 characters"}}},b={email:{type:"email",required:!0,label:"Email Address",formConfig:{placeholder:"you@example.com",autocomplete:"email"}},password:{type:"password",required:!0,label:"Password",formConfig:{placeholder:"\u2022\u2022\u2022\u2022\u2022\u2022\u2022\u2022",autocomplete:"current-password"}}},p=[{id:"charcoal-dark",label:"Charcoal",dark:!0,primary:"#5b8cff",bg:"#1a1d23"},{id:"charcoal-light",label:"Charcoal",dark:!1,primary:"#4a7aff",bg:"#f4f5f7"},{id:"ocean-dark",label:"Ocean",dark:!0,primary:"#00b4d8",bg:"#0d1b2a"},{id:"ocean-light",label:"Ocean",dark:!1,primary:"#0096c7",bg:"#e8f4f8"},{id:"forest-dark",label:"Forest",dark:!0,primary:"#52b788",bg:"#1a231e"},{id:"forest-light",label:"Forest",dark:!1,primary:"#40916c",bg:"#f0f7f4"},{id:"sunset-dark",label:"Sunset",dark:!0,primary:"#ff6b6b",bg:"#1f1a1a"},{id:"sunset-light",label:"Sunset",dark:!1,primary:"#e05555",bg:"#fff0f0"},{id:"royal-dark",label:"Royal",dark:!0,primary:"#9b59b6",bg:"#1a1525"},{id:"royal-light",label:"Royal",dark:!1,primary:"#8e44ad",bg:"#f5f0fa"},{id:"lemon-dark",label:"Lemon",dark:!0,primary:"#f1c40f",bg:"#1a1a10"},{id:"lemon-light",label:"Lemon",dark:!1,primary:"#d4ac0d",bg:"#fffef0"},{id:"silver-dark",label:"Silver",dark:!0,primary:"#95a5a6",bg:"#1c1e20"},{id:"silver-light",label:"Silver",dark:!1,primary:"#7f8c8d",bg:"#f2f3f4"},{id:"grayve-dark",label:"Grayve",dark:!0,primary:"#00bcd4",bg:"#1a1e21"},{id:"grayve-light",label:"Grayve",dark:!1,primary:"#00838f",bg:"#ffffff"}];export const loginView={templateUrl:"/admin/js/templates/login.html",async onMount(e){if(c()){R.navigate("/");return}let t=!1;try{t=(await i.auth.setupStatus()).needsSetup}catch{E.toast("Could not reach the server.",{type:"error"})}t?(s(e,"setup"),g(e)):(s(e,"login"),y(e)),Domma.icons.scan()}};const u=["setup","onboarding-site","onboarding-theme","onboarding-done","login"];function s(e,t){u.forEach(a=>e.find(`#${a}-panel`).hide()),e.find(`#${t}-panel`).show(),Domma.icons.scan()}function g(e){F.render("#setup-form-container",f,{},{layout:"stacked",submitText:"Create admin account",onSubmit:async t=>{try{const a=await i.auth.setup(t);o(a),s(e,"onboarding-site"),h(e)}catch(a){return E.toast(a.message||"Setup failed. Please try again.",{type:"error"}),!1}}})}function h(e){e.find("#ob-site-skip").on("click",t=>{t.preventDefault(),s(e,"onboarding-theme"),n(e),m(e)}),e.find("#ob-site-btn").on("click",async()=>{e.find("#ob-site-error").hide();const t=e.find("#ob-title").val().trim(),a=e.find("#ob-tagline").val().trim(),r=e.find("#ob-site-btn").prop("disabled",!0).text("Saving\u2026");try{const l=await i.settings.get();await i.settings.save({...l,title:t||l.title,tagline:a||l.tagline,seo:{...l.seo||{},defaultTitle:t||l.seo&&l.seo.defaultTitle}});const d=await i.navigation.get();await i.navigation.save({...d,brand:{...d.brand||{},text:t||d.brand.text}}),s(e,"onboarding-theme"),n(e),m(e)}catch(l){showError(e,"ob-site-error",l.message||"Could not save site details.")}finally{r.prop("disabled",!1).text("Continue")}})}function n(e){const t=e.find("#theme-grid").empty();p.forEach(a=>{const r=$(`
+            <div class="theme-swatch" data-theme="${a.id}" title="${a.id}">
+                <div class="theme-swatch-preview" style="background:${a.bg}">
+                    <div class="theme-swatch-accent" style="background:${a.primary}"></div>
                 </div>
                 <div class="theme-swatch-label">
-                    <span>${t.label}</span>
-                    <span class="theme-swatch-mode">${t.dark ? 'Dark' : 'Light'}</span>
+                    <span>${a.label}</span>
+                    <span class="theme-swatch-mode">${a.dark?"Dark":"Light"}</span>
                 </div>
             </div>
-        `);
-        $card.on('click', () => {
-            $container.find('.theme-swatch').removeClass('selected');
-            $card.addClass('selected');
-        });
-        $grid.append($card);
-    });
-
-    // Default selection
-    $container.find('[data-theme="charcoal-dark"]').addClass('selected');
-}
-
-function bindOnboardingTheme($container) {
-    $container.find('#ob-theme-skip').on('click', (e) => {
-        e.preventDefault();
-        showStep($container, 'onboarding-done');
-    });
-
-    $container.find('#ob-theme-btn').on('click', async () => {
-        $container.find('#ob-theme-error').hide();
-        const selected = $container.find('.theme-swatch.selected').attr('data-theme') || 'charcoal-dark';
-
-        const $btn = $container.find('#ob-theme-btn').prop('disabled', true).text('Applying…');
-        try {
-            const current = await api.settings.get();
-            await api.settings.save({ ...current, theme: selected });
-            showStep($container, 'onboarding-done');
-        } catch (err) {
-            showError($container, 'ob-theme-error', err.message || 'Could not save theme.');
-        } finally {
-            $btn.prop('disabled', false).text('Apply theme');
-        }
-    });
-}
-
-// ---------------------------------------------------------------------------
-// Login step
-// ---------------------------------------------------------------------------
-
-function bindLogin($container) {
-    F.render('#login-form-container', loginBlueprint, {}, {
-        layout: 'stacked',
-        submitText: 'Sign in',
-        onSubmit: async (data) => {
-            try {
-                const result = await api.auth.login(data);
-                setAuthData(result);
-                R.navigate('/');
-            } catch (err) {
-                E.toast(err.message || 'Invalid credentials. Please try again.', { type: 'error' });
-                return false;
-            }
-        }
-    });
-}
+        `);r.on("click",()=>{e.find(".theme-swatch").removeClass("selected"),r.addClass("selected")}),t.append(r)}),e.find('[data-theme="charcoal-dark"]').addClass("selected")}function m(e){e.find("#ob-theme-skip").on("click",t=>{t.preventDefault(),s(e,"onboarding-done")}),e.find("#ob-theme-btn").on("click",async()=>{e.find("#ob-theme-error").hide();const t=e.find(".theme-swatch.selected").attr("data-theme")||"charcoal-dark",a=e.find("#ob-theme-btn").prop("disabled",!0).text("Applying\u2026");try{const r=await i.settings.get();await i.settings.save({...r,theme:t}),s(e,"onboarding-done")}catch(r){showError(e,"ob-theme-error",r.message||"Could not save theme.")}finally{a.prop("disabled",!1).text("Apply theme")}})}function y(e){F.render("#login-form-container",b,{},{layout:"stacked",submitText:"Sign in",onSubmit:async t=>{try{const a=await i.auth.login(t);o(a),R.navigate("/")}catch(a){return E.toast(a.message||"Invalid credentials. Please try again.",{type:"error"}),!1}}})}