lightview 1.8.2 → 2.0.1

package/middleware/locale.js

@@ -0,0 +1,25 @@
+/**
+ * Locale Prefix Handler
+ * Extracts locale from path (e.g. /en/about -> /about with locale='en')
+ */
+export const localeHandler = (ctx) => {
+    const path = typeof ctx === 'string' ? ctx : ctx.path;
+
+    // Match /en/ or /en at start of path
+    const match = path.match(/^\/([a-z]{2})($|\/)/);
+
+    if (match) {
+        const locale = match[1];
+        // Remove locale prefix
+        let newPath = path.substring(3);
+        if (!newPath.startsWith('/')) newPath = '/' + newPath;
+
+        return {
+            ...ctx,
+            path: newPath,
+            locale: locale
+        };
+    }
+
+    return ctx;
+};

package/middleware/markdown.js

@@ -0,0 +1,44 @@
+/**
+ * Markdown Handler
+ * Intercepts .md requests, loads marked.js on demand, and renders HTML
+ */
+let marked = null;
+
+export const markdownHandler = async (ctx) => {
+    const path = typeof ctx === 'string' ? ctx : ctx.path;
+
+    // Only process .md files
+    if (!path.endsWith('.md')) return ctx;
+
+    try {
+        // 1. Load marked if needed
+        if (!marked) {
+            console.log('[Markdown] Loading processor...');
+            const module = await import('https://cdn.jsdelivr.net/npm/marked/+esm');
+            marked = module.marked;
+        }
+
+        // 2. Fetch the raw markdown content
+        const response = await fetch(path);
+        if (!response.ok) return null; // Let other handlers try or 404
+
+        const text = await response.text();
+
+        // 3. Convert to HTML
+        // marked.parse can be synchronous or async depending on extensions, 
+        // but usually synchronous for standard usage.
+        const html = marked.parse(text);
+
+        // 4. Wrap the HTML in a container if needed, or just return it.
+        // For Lightview docs, we might want a wrapper, but raw HTML is fine for now.
+        // We'll return a Response object which the router understands as a final result.
+        return new Response(html, {
+            status: 200,
+            headers: { 'Content-Type': 'text/html' }
+        });
+
+    } catch (err) {
+        console.error('[Markdown] Error processing file:', err);
+        return null; // Fallthrough
+    }
+};

package/middleware/notFound.js

@@ -0,0 +1,37 @@
+/**
+ * 404 Not Found Middleware
+ * 
+ * Returns a configured Not Found handler that renders a 404 page
+ * into a target element or returns a 404 response.
+ * 
+ * Usage:
+ * appRouter.use(notFound({ 
+ *   contentEl: document.getElementById('content'),
+ *   html: '<h1>404 Not Found</h1>' // Optional custom HTML
+ * }));
+ */
+export const notFound = (options = {}) => {
+    const {
+        contentEl = null,
+        html = `
+            <div class="error-page" style="text-align: center; padding: 4rem 1rem;">
+                <h1 style="font-size: 3rem; margin-bottom: 1rem;">404</h1>
+                <p style="font-size: 1.25rem; margin-bottom: 2rem;">Page not found</p>
+                <a href="/" class="btn btn-primary">Go Home</a>
+            </div>
+        `
+    } = options;
+
+    return async (ctx) => {
+        const targetEl = contentEl || ctx.contentEl;
+
+        // If contentEl is provided (either via options or context), render directly
+        if (targetEl) {
+            targetEl.innerHTML = html;
+            return new Response(html, { status: 404, statusText: 'Not Found' });
+        }
+
+        // Otherwise return a response and let the caller handle it
+        return new Response(html, { status: 404, statusText: 'Not Found' });
+    };
+};

package/package.json

@@ -1,41 +1,27 @@
-{
-  "name": "lightview",
-  "version": "1.8.2",
-  "description": "Small, simple, powerful web UI and micro front end creation ... Great ideas from Svelte, React, Vue and Riot combined.",
-  "main": "lightview.js",
-  "scripts": {
-    "test": "set NODE_OPTIONS=--experimental-vm-modules && jest ./test"
-  },
-  "repository": {
-    "type": "git",
-    "url": "git+https://github.com/anywhichway/lightview.git"
-  },
-  "keywords": [
-    "svelte",
-    "react",
-    "angular",
-    "riot",
-    "vue",
-    "moon",
-    "hyperapp",
-    "hyperhtml",
-    "micro front end",
-    "custom elements",
-    "web components"
-  ],
-  "author": "Simon Y. Blackwell",
-  "license": "MIT",
-  "bugs": {
-    "url": "https://github.com/anywhichway/lightview/issues"
-  },
-  "homepage": "https://lightview.dev",
-  "devDependencies": {
-    "@editorjs/editorjs": "^2.16.0",
-    "editorjs-inline-tool": "^0.4.0",
-    "jest": "^27.5.1",
-    "jest-puppeteer": "^6.1.0"
-  },
-  "dependencies": {
-    "froala-editor": "^4.0.11"
-  }
-}
+{
+  "name": "lightview",
+  "version": "2.0.1",
+  "description": "A lightweight reactive UI library with features of Bau, Juris, and HTMX",
+  "main": "lightview.js",
+  "directories": {
+    "doc": "docs"
+  },
+  "scripts": {
+    "dev": "wrangler pages dev . --port 3000",
+    "preview": "npm run build && wrangler pages dev ./dist --port 8788",
+    "build": "node build.js",
+    "watch": "node watch.js",
+    "deploy": "npm run build && wrangler pages deploy dist",
+    "test": "echo \"Error: no test specified\" && exit 1"
+  },
+  "keywords": [],
+  "author": "",
+  "license": "MIT",
+  "type": "commonjs",
+  "devDependencies": {
+    "wrangler": "^4.54.0"
+  },
+  "dependencies": {
+    "marked": "^17.0.1"
+  }
+}

package/watch.js

@@ -0,0 +1,92 @@
+const fs = require('fs');
+const path = require('path');
+const { execSync } = require('child_process');
+
+const rootDir = __dirname;
+const distDir = path.join(rootDir, 'dist');
+
+// Configuration (must match build.js)
+const allowedExtensions = ['.html', '.js', '.css', '.txt', '.xml', '.ico', '.png', '.svg', '.jpg', '.jpeg', '.md'];
+const includeFiles = ['_headers'];
+const excludeFiles = ['build.js', 'watch.js', 'package.json', 'package-lock.json', 'wrangler.toml'];
+const allowedDirs = ['docs', 'components', 'middleware'];
+
+function build() {
+    try {
+        console.log('Running full build...');
+        execSync('node build.js', { stdio: 'inherit' });
+    } catch (e) {
+        console.error('Build failed:', e);
+    }
+}
+
+function copyFile(srcPath, relativePath) {
+    try {
+        const destPath = path.join(distDir, relativePath);
+        const destDir = path.dirname(destPath);
+
+        if (!fs.existsSync(destDir)) {
+            fs.mkdirSync(destDir, { recursive: true });
+        }
+
+        fs.copyFileSync(srcPath, destPath);
+        console.log(`Updated: ${relativePath}`);
+    } catch (err) {
+        // Ignore errors for deleted files or temporary locks
+        if (err.code !== 'ENOENT' && err.code !== 'EBUSY') {
+            console.error(`Error copying ${relativePath}:`, err.message);
+        }
+    }
+}
+
+// Initial build
+build();
+
+console.log('Watching for changes...');
+
+fs.watch(rootDir, { recursive: true }, (eventType, filename) => {
+    if (!filename) return;
+
+    // Ignore .git, node_modules, dist, etc.
+    if (filename.startsWith('.git') ||
+        filename.startsWith('node_modules') ||
+        filename.startsWith('dist') ||
+        filename.startsWith('.gemini')) {
+        return;
+    }
+
+    const srcPath = path.join(rootDir, filename);
+    const parts = filename.split(path.sep);
+    const topLevel = parts[0];
+
+    // Check if it's in one of the allowed directories
+    if (allowedDirs.includes(topLevel)) {
+        // Check if file exists to handle deletions gracefully
+        if (fs.existsSync(srcPath)) {
+            // Check if it's a directory
+            try {
+                const stat = fs.statSync(srcPath);
+                if (stat.isDirectory()) return;
+            } catch (e) {
+                return; // Ignore if stat fails
+            }
+
+            copyFile(srcPath, filename);
+        }
+        return;
+    }
+
+    // Check if it's a file in the root directory
+    if (parts.length === 1) {
+        const ext = path.extname(filename).toLowerCase();
+        const isAllowedExt = allowedExtensions.includes(ext);
+        const isExplicitInclude = includeFiles.includes(filename);
+        const isExcluded = excludeFiles.includes(filename) || filename.startsWith('.');
+
+        if ((isAllowedExt || isExplicitInclude) && !isExcluded) {
+            if (fs.existsSync(srcPath)) {
+                copyFile(srcPath, filename);
+            }
+        }
+    }
+});

package/wrangler.toml

@@ -0,0 +1,12 @@
+name = "lightview"
+compatibility_date = "2024-01-01"
+
+# [build]
+# command = "npm run build"
+
+# Cloudflare Pages configuration
+# Note: Static asset headers are now defined in _headers file
+# and the build directory is specified in the deploy command or dashboard.
+
+[assets]
+directory = "./dist"

package/.idea/lightview.iml

@@ -1,12 +0,0 @@
-<?xml version="1.0" encoding="UTF-8"?>
-<module type="WEB_MODULE" version="4">
-  <component name="NewModuleRootManager">
-    <content url="file://$MODULE_DIR$">
-      <excludeFolder url="file://$MODULE_DIR$/temp" />
-      <excludeFolder url="file://$MODULE_DIR$/.tmp" />
-      <excludeFolder url="file://$MODULE_DIR$/tmp" />
-    </content>
-    <orderEntry type="inheritedJdk" />
-    <orderEntry type="sourceFolder" forTests="false" />
-  </component>
-</module>

package/.idea/modules.xml

@@ -1,8 +0,0 @@
-<?xml version="1.0" encoding="UTF-8"?>
-<project version="4">
-  <component name="ProjectModuleManager">
-    <modules>
-      <module fileurl="file://$PROJECT_DIR$/.idea/lightview.iml" filepath="$PROJECT_DIR$/.idea/lightview.iml" />
-    </modules>
-  </component>
-</project>

package/.idea/vcs.xml

@@ -1,6 +0,0 @@
-<?xml version="1.0" encoding="UTF-8"?>
-<project version="4">
-  <component name="VcsDirectoryMappings">
-    <mapping directory="$PROJECT_DIR$" vcs="Git" />
-  </component>
-</project>

package/LICENSE

@@ -1,21 +0,0 @@
-MIT License
-
-Copyright (c) 2022 Simon Y. Blackwell
-
-Permission is hereby granted, free of charge, to any person obtaining a copy
-of this software and associated documentation files (the "Software"), to deal
-in the Software without restriction, including without limitation the rights
-to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
-copies of the Software, and to permit persons to whom the Software is
-furnished to do so, subject to the following conditions:
-
-The above copyright notice and this permission notice shall be included in all
-copies or substantial portions of the Software.
-
-THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
-IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
-FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
-AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
-LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
-OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
-SOFTWARE.

package/codepen-no-tabs-embed.css

@@ -1,2 +0,0 @@
-body.split-output #output > .active { width: 75%; }
-body.split-output #output > #result-box.active { width: 25% }

package/docs/CNAME

@@ -1 +0,0 @@
-lightview.dev