@nuraly/lumenjs 0.1.1 → 0.1.3

package/templates/blog/pages/posts/[slug].ts

@@ -0,0 +1,35 @@
+import { LitElement, html, css } from 'lit';
+import { customElement, property } from 'lit/decorators.js';
+import { useDb } from '@nuraly/lumenjs/db';
+
+export function loader({ params }: { params: { slug: string } }) {
+  const db = useDb();
+  const post = db.get('SELECT id, title, slug, content, date FROM posts WHERE slug = ?', params.slug);
+  return { post: post || null };
+}
+
+@customElement('page-post')
+export class PagePost extends LitElement {
+  @property({ type: Object }) data: any;
+
+  static styles = css`
+    :host { display: block; max-width: 720px; margin: 0 auto; padding: 2rem; font-family: system-ui, sans-serif; }
+    a { color: #0066cc; text-decoration: none; }
+    a:hover { text-decoration: underline; }
+    .date { color: #666; font-size: 0.875rem; }
+    .content { margin-top: 1rem; line-height: 1.6; color: #333; }
+  `;
+
+  render() {
+    const post = this.data?.post;
+    if (!post) {
+      return html`<p>Post not found. <a href="/">Back to blog</a></p>`;
+    }
+    return html`
+      <a href="/">&larr; Back to blog</a>
+      <h1>${post.title}</h1>
+      <span class="date">${post.date}</span>
+      <div class="content">${post.content}</div>
+    `;
+  }
+}

package/templates/dashboard/api/stats.ts

@@ -0,0 +1,7 @@
+import { useDb } from '@nuraly/lumenjs/db';
+
+export function GET() {
+  const db = useDb();
+  const stats = db.all('SELECT id, label, value, unit, updated_at FROM stats ORDER BY id');
+  return { stats };
+}

package/templates/dashboard/data/migrations/001_init.sql

@@ -0,0 +1,13 @@
+CREATE TABLE IF NOT EXISTS stats (
+  id INTEGER PRIMARY KEY AUTOINCREMENT,
+  label TEXT NOT NULL UNIQUE,
+  value REAL NOT NULL,
+  unit TEXT NOT NULL DEFAULT '',
+  updated_at TEXT NOT NULL DEFAULT (datetime('now'))
+);
+
+INSERT INTO stats (label, value, unit) VALUES
+  ('Total Users', 1284, 'users'),
+  ('Revenue', 42500, 'USD'),
+  ('Active Sessions', 89, 'sessions'),
+  ('Uptime', 99.97, '%');

package/templates/dashboard/pages/index.ts

@@ -0,0 +1,41 @@
+import { LitElement, html, css } from 'lit';
+import { customElement, property } from 'lit/decorators.js';
+import { useDb } from '@nuraly/lumenjs/db';
+
+export function loader() {
+  const db = useDb();
+  const stats = db.all('SELECT id, label, value, unit, updated_at FROM stats ORDER BY id');
+  return { stats };
+}
+
+@customElement('page-dashboard')
+export class PageDashboard extends LitElement {
+  @property({ type: Object }) data: any;
+
+  static styles = css`
+    :host { display: block; max-width: 960px; margin: 0 auto; padding: 2rem; font-family: system-ui, sans-serif; }
+    h1 { font-size: 2rem; margin-bottom: 1.5rem; }
+    .grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 1rem; }
+    .card { background: #f9fafb; border: 1px solid #e5e7eb; border-radius: 8px; padding: 1.5rem; }
+    .card .label { font-size: 0.875rem; color: #6b7280; margin-bottom: 0.25rem; }
+    .card .value { font-size: 1.75rem; font-weight: 600; color: #111827; }
+    .card .unit { font-size: 0.75rem; color: #9ca3af; margin-left: 0.25rem; }
+  `;
+
+  render() {
+    const stats = this.data?.stats || [];
+    return html`
+      <h1>Dashboard</h1>
+      <div class="grid">
+        ${stats.map((stat: any) => html`
+          <div class="card">
+            <div class="label">${stat.label}</div>
+            <div class="value">
+              ${stat.value}<span class="unit">${stat.unit}</span>
+            </div>
+          </div>
+        `)}
+      </div>
+    `;
+  }
+}