@lmjs/cli 2.0.2 → 2.1.1

package/dist/lib/files/project/package.json

@@ -2,5 +2,7 @@
     "name": "[ProjectName]",
     "version": "0.0.0",
     "private": true,
-    "dependencies": {}
+    "dependencies": {
+        "@iconify/iconify": "^3.1.1"
+    }
 }

package/dist/lib/files/project/src/index.html

@@ -13,7 +13,7 @@
     <meta name="Keywords" content="" />
     <meta name="theme-color" content="#FFA302" />
 
-    <link href="/css/bea.css" rel="stylesheet" type="text/css" />
+    <link href="/css/mobius.css" rel="stylesheet" type="text/css" />
     <link href="/css/styles.css" rel="stylesheet" type="text/css" />
     <link rel="icon" type="image/x-icon" href="/favicon.ico" />
     <!-- <link rel="icon" type="image/png" href="/favicon.png" /> -->

package/dist/lib/files/project/src/layouts/default.layout

@@ -1,4 +1,16 @@
-<header header></header>
+<style>
+    body {
+        margin: 0;
+        color: rgba(255, 255, 255, .87);
+        background-color: #181818;
+        font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
+    }
+
+    a {
+        color: inherit;
+    }
+</style>
+
 <nav nav></nav>
 <main body></main>
-<footer footer></footer>
+<footer footer></footer>

package/dist/lib/files/project/src/views/about.view

@@ -0,0 +1,24 @@
+<div style="max-width:640px;margin:0 auto;padding:80px 24px 40px;">
+    <h1 class="cw" style="font-size:32px;margin:0 0 16px;">About this project</h1>
+    <p class="fs15" style="opacity:.75;line-height:1.6;">
+        This project was scaffolded with <code>lm create</code>. The navigation bar and
+        footer you're looking at right now are LumenJS <strong>widgets</strong> — real
+        files under <code>src/views/widgets/</code>, wired into
+        <code>src/layouts/default.layout</code>. Unlike this page's own content, they
+        don't re-render when you navigate between pages.
+    </p>
+    <p class="fs15" style="opacity:.75;line-height:1.6;">
+        Add more pages under <code>src/views/</code>, more widgets under
+        <code>src/views/widgets/</code>, and point any layout element at one by giving it
+        a bare attribute matching the widget's name — LumenJS mounts and keeps it
+        persistent automatically.
+    </p>
+    <a href="/" class="cw fs14" style="opacity:.85;">Back home</a>
+</div>
+
+<settings>
+{
+    layout: 'default',
+    requireAuth: false
+}
+</settings>

package/dist/lib/files/project/src/views/home.view

@@ -1,32 +1,32 @@
-<style>
-    body {
-        color: rgba(255, 255, 255, .87);
-        background-color: #242424;
-    }
-</style>
-<div class="hv100">
-    <div class="ph50">
-        <div class="pv10 r" style="height: 50px;">
-            <grid_nm gap10>
-                <div class="vm">
-                    <a href="https://www.npmjs.com/package/@lmjs/cli">
-                        <span data-icon="mdi:npm" class="iconify fs40 cw"></span>
-                    </a>
-                </div>
-                <div class="vm">
-                    <a href="https://github.com/bea-technology/lmjs-cli">
-                        <span data-icon="mdi:github" class="iconify fs34 cw"></span>
-                    </a>
-                </div>
-            </grid_nm>
+<div style="max-width:720px;margin:0 auto;padding:80px 24px 40px;text-align:center;">
+    <img src="/images/lumenjs.svg" alt="LumenJS" style="width:96px;height:96px;margin-bottom:24px;" />
+    <h1 class="cw" style="font-size:40px;margin:0 0 12px;">Welcome to LumenJS</h1>
+    <p class="fs16" style="opacity:.75;margin:0 0 32px;">
+        A tiny, fast reactive framework for building web apps with plain HTML, CSS and JavaScript.
+    </p>
+    <a href="https://www.lumenjs.com/guide/getting-started" class="cw fs15" style="display:inline-block;padding:12px 28px;background:#FFA302;color:#181818;border-radius:6px;text-decoration:none;font-weight:600;">
+        Read the Docs
+    </a>
+
+    <div style="display:flex;gap:20px;justify-content:center;margin-top:60px;flex-wrap:wrap;">
+        <div style="flex:1;min-width:180px;max-width:220px;padding:20px;background:#1f1f1f;border-radius:8px;text-align:left;">
+            <div class="cw fs15" style="font-weight:600;margin-bottom:6px;">Reactive by default</div>
+            <div class="fs13" style="opacity:.65;">Mustaches and directives update automatically when your data changes.</div>
+        </div>
+        <div style="flex:1;min-width:180px;max-width:220px;padding:20px;background:#1f1f1f;border-radius:8px;text-align:left;">
+            <div class="cw fs15" style="font-weight:600;margin-bottom:6px;">Widgets & layouts</div>
+            <div class="fs13" style="opacity:.65;">The nav and footer on this page persist across navigation — try the About link.</div>
+        </div>
+        <div style="flex:1;min-width:180px;max-width:220px;padding:20px;background:#1f1f1f;border-radius:8px;text-align:left;">
+            <div class="cw fs15" style="font-weight:600;margin-bottom:6px;">Just HTML & JS</div>
+            <div class="fs13" style="opacity:.65;">No build step to learn — write real HTML, CSS and JavaScript.</div>
         </div>
     </div>
-    <div class="cc sq cov" style="background-image: url('/images/lumenjs.svg'); height: 250px;"></div>
 </div>
 
 <settings>
-    {
-        layout: 'default',
-        requireAuth: false
-    }
-</settings>
+{
+    layout: 'default',
+    requireAuth: false
+}
+</settings>

package/dist/lib/files/project/src/views/widgets/footer.view

@@ -0,0 +1,11 @@
+<div style="display:flex;align-items:center;justify-content:space-between;padding:20px 30px;background:#1a1a1a;margin-top:40px;flex-wrap:wrap;gap:10px;">
+    <span class="fs13" style="opacity:.6;">Built with LumenJS</span>
+    <div style="display:flex;align-items:center;gap:16px;">
+        <a href="https://www.npmjs.com/package/@lmjs/cli" style="opacity:.7;">
+            <span data-icon="mdi:npm" class="iconify cw fs20"></span>
+        </a>
+        <a href="https://github.com/bea-technology/lmjs-cli" style="opacity:.7;">
+            <span data-icon="mdi:github" class="iconify cw fs20"></span>
+        </a>
+    </div>
+</div>

package/dist/lib/files/project/src/views/widgets/nav.view

@@ -0,0 +1,9 @@
+<div style="display:flex;align-items:center;justify-content:space-between;padding:14px 30px;background:#1f1f1f;box-shadow:0 1px 0 rgba(255,255,255,.06);">
+    <a href="/" style="display:flex;align-items:center;gap:8px;text-decoration:none;">
+        <strong class="cw fs18">LumenJS</strong>
+    </a>
+    <div style="display:flex;align-items:center;gap:24px;">
+        <a href="/" class="cw fs14" style="text-decoration:none;opacity:.85;">Home</a>
+        <a href="/about" class="cw fs14" style="text-decoration:none;opacity:.85;">About</a>
+    </div>
+</div>

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@lmjs/cli",
-  "version": "2.0.2",
+  "version": "2.1.1",
   "description": "Command line interface for LumenJS — scaffold, develop, and build LumenJS applications. LumenJS is a tiny, fast reactive JavaScript framework for building web applications and interfaces with standard HTML, CSS, and JavaScript.",
   "bin": {
     "lm": "./dist/bin/commands.js",
@@ -51,7 +51,7 @@
     "ora": "^6.1.2",
     "semver": "^7.3.7",
     "ws": "^8.8.1",
-    "@lmjs/core": "2.0.2"
+    "@lmjs/core": "2.1.1"
   },
   "engines": {
     "node": ">=18.0.0"