kreftjs 0.0.6-beta → 0.0.9-beta

package/templates/app/frontend/tests/pages/About.kreft

@@ -0,0 +1,12 @@
+<!-- /tests/about: a second test page. Add more: a .kreft file here, then one line in the routes in index.html. -->
+<view>
+  <section class="page">
+    <h1>About</h1>
+    <p class="lead">Edit <code>tests/pages/About.kreft</code> and save: the page updates by itself.</p>
+    <p><kreft-link to="/tests">Back to the test pages</kreft-link></p>
+  </section>
+</view>
+
+<style scoped>
+.page { padding: 40px 0; max-width: 40em; }
+</style>

package/templates/app/frontend/tests/pages/{Test.kreftjs → Test.kreft}

@@ -10,7 +10,7 @@ load hello = api.get('/api/hello', { query: { name: name || undefined } })
 
     <div class="card">
       <h2>A component</h2>
-      <p class="muted"><code>tests/components/Counter.kreftjs</code></p>
+      <p class="muted"><code>tests/components/Counter.kreft</code></p>
       <counter start={1}></counter>
     </div>
 

package/templates/errors/{401.kreftjs → 401.kreft}

@@ -1,5 +1,5 @@
-<!-- errors/401.kreftjs: shown after abort(401), for example when the API says the visitor isn't signed in. Change the words as you like. -->
-layout 'errors/minimal.kreftjs'
+<!-- errors/401.kreft: shown after abort(401), for example when the API says the visitor isn't signed in. Change the words as you like. -->
+layout 'errors/minimal.kreft'
 prop status = 401
 prop title = ''
 prop message = ''

package/templates/errors/{402.kreftjs → 402.kreft}

@@ -1,5 +1,5 @@
-<!-- errors/402.kreftjs: shown after abort(402). Change the words as you like. -->
-layout 'errors/minimal.kreftjs'
+<!-- errors/402.kreft: shown after abort(402). Change the words as you like. -->
+layout 'errors/minimal.kreft'
 prop status = 402
 prop title = ''
 prop message = ''

package/templates/errors/{403.kreftjs → 403.kreft}

@@ -1,5 +1,5 @@
-<!-- errors/403.kreftjs: shown after abort(403), or abort(403, 'Only the owner can see this.'). Change the words as you like. -->
-layout 'errors/minimal.kreftjs'
+<!-- errors/403.kreft: shown after abort(403), or abort(403, 'Only the owner can see this.'). Change the words as you like. -->
+layout 'errors/minimal.kreft'
 prop status = 403
 prop title = ''
 prop message = ''

package/templates/errors/{404.kreftjs → 404.kreft}

@@ -1,5 +1,5 @@
-<!-- errors/404.kreftjs: shown for an address no route knows, and after abort(404). Change the words as you like. -->
-layout 'errors/minimal.kreftjs'
+<!-- errors/404.kreft: shown for an address no route knows, and after abort(404). Change the words as you like. -->
+layout 'errors/minimal.kreft'
 prop status = 404
 prop title = ''
 prop message = ''

package/templates/errors/{419.kreftjs → 419.kreft}

@@ -1,5 +1,5 @@
-<!-- errors/419.kreftjs: shown after abort(419), for example when the CSRF token is too old. Change the words as you like. -->
-layout 'errors/minimal.kreftjs'
+<!-- errors/419.kreft: shown after abort(419), for example when the CSRF token is too old. Change the words as you like. -->
+layout 'errors/minimal.kreft'
 prop status = 419
 prop title = ''
 prop message = ''

package/templates/errors/{429.kreftjs → 429.kreft}

@@ -1,5 +1,5 @@
-<!-- errors/429.kreftjs: shown after abort(429). Change the words as you like. -->
-layout 'errors/minimal.kreftjs'
+<!-- errors/429.kreft: shown after abort(429). Change the words as you like. -->
+layout 'errors/minimal.kreft'
 prop status = 429
 prop title = ''
 prop message = ''

package/templates/errors/{500.kreftjs → 500.kreft}

@@ -1,5 +1,5 @@
-<!-- errors/500.kreftjs: shown when a page can't be loaded, and after abort(500). The details are in the browser console. Change the words as you like. -->
-layout 'errors/minimal.kreftjs'
+<!-- errors/500.kreft: shown when a page can't be loaded, and after abort(500). The details are in the browser console. Change the words as you like. -->
+layout 'errors/minimal.kreft'
 prop status = 500
 prop title = ''
 prop message = ''

package/templates/errors/{503.kreftjs → 503.kreft}

@@ -1,5 +1,5 @@
-<!-- errors/503.kreftjs: shown after abort(503), for example during maintenance. Change the words as you like. -->
-layout 'errors/minimal.kreftjs'
+<!-- errors/503.kreft: shown after abort(503), for example during maintenance. Change the words as you like. -->
+layout 'errors/minimal.kreft'
 prop status = 503
 prop title = ''
 prop message = ''

package/templates/errors/{ErrorMonitor.kreftjs → ErrorMonitor.kreft}

@@ -1,5 +1,5 @@
 <!--
-  ErrorMonitor.kreftjs: Enterprise-Grade Interactive Error Monitoring & Debugging UI for Kreft
+  ErrorMonitor.kreft: Enterprise-Grade Interactive Error Monitoring & Debugging UI for Kreft
   Provides stack traces, interactive code inspectors, context variables, and smart solution suggestions.
 -->
 prop error = null
@@ -18,12 +18,12 @@ state copiedToast = false
 derive currentTitle = title || (error && error.name) || 'UnhandledException'
 derive currentMessage = message || (error && error.message) || 'An unexpected error occurred during execution.'
 derive frameList = (frames && frames.length) ? frames : (error && error.frames ? error.frames : [
-  { fn: 'HomeController.__invoke', file: 'app/Http/Controllers/Discovery/HomeController.kreftjs', line: 14, col: 5, isApp: true, snippet: [
+  { fn: 'HomeController.__invoke', file: 'app/Http/Controllers/Discovery/HomeController.kreft', line: 14, col: 5, isApp: true, snippet: [
     { num: 10, code: 'class HomeController {' },
     { num: 11, code: '  action index() {' },
     { num: 12, code: '    // Query active records' },
     { num: 13, code: '    load posts = Post.qquery()' },
-    { num: 14, code: '    return view("pages/Home.kreftjs", { posts })', isTarget: true },
+    { num: 14, code: '    return view("pages/Home.kreft", { posts })', isTarget: true },
     { num: 15, code: '  }' },
     { num: 16, code: '}' }
   ]},
@@ -79,6 +79,8 @@ action copyReport() {
   }
 }
 
+state docs = (Kreftjs.env.PUBLIC_DOCS_URL || 'http://kreftjs.com').replace(/\/+$/, '')   // where "Documentation" links go: PUBLIC_DOCS_URL in .env
+
 <view>
   <div class="error-monitor-wrapper">
     <!-- Top Navigation Bar -->
@@ -99,10 +101,10 @@ action copyReport() {
       </div>
 
       <div class="nav-meta">
-        <kreft-link to="/docs" class="nav-link-docs">
+        <a href={docs + '/docs'} class="nav-link-docs" target="_blank" rel="noopener">
           <span class="tab-icon">📖</span>
           <span>DOCS</span>
-        </kreft-link>
+        </a>
         <button class="btn-copy-report" @click={copyReport}>
           {copiedToast ? '✓ Copied' : 'Copy Report'}
         </button>
@@ -116,7 +118,7 @@ action copyReport() {
         <div class="hero-badges">
           <span class="badge-exception">{currentTitle}</span>
           <span class="badge-env">Node.js {typeof process !== 'undefined' ? process.version : 'v22.0.0'}</span>
-          <span class="badge-env">Kreft v0.0.6-beta</span>
+          <span class="badge-env">Kreft v0.0.9-beta</span>
         </div>
         <h1 class="hero-error-message">{currentMessage}</h1>
       </div>
@@ -141,14 +143,15 @@ action copyReport() {
         </div>
 
         <div class="frames-list">
-          <div
-            k-for="(frame, idx) in frameList"
-            k-if="frame.isApp || showAllVendorFrames"
-            class={'frame-card' + (selectedFrameIndex === idx ? ' active' : '') + (frame.isApp ? ' is-app' : ' is-vendor')}
-            @click="selectFrame(idx)">
-            <div class="frame-file-line">{frame.file}:{frame.line || 1}</div>
-            <div class="frame-fn-name">{frame.fn || '<anonymous>'}</div>
-          </div>
+          {for (frame, idx) in frameList}
+            <div
+              k-if="frame.isApp || showAllVendorFrames"
+              class={'frame-card' + (selectedFrameIndex === idx ? ' active' : '') + (frame.isApp ? ' is-app' : ' is-vendor')}
+              @click="selectFrame(idx)">
+              <div class="frame-file-line">{frame.file}:{frame.line || 1}</div>
+              <div class="frame-fn-name">{frame.fn || '<anonymous>'}</div>
+            </div>
+          {/for}
         </div>
       </aside>
 

package/templates/errors/{error.kreftjs → error.kreft}

@@ -1,5 +1,5 @@
-<!-- errors/error.kreftjs: any other status, like abort(409) or abort(422, 'That name is taken.') -->
-layout 'errors/minimal.kreftjs'
+<!-- errors/error.kreft: any other status, like abort(409) or abort(422, 'That name is taken.') -->
+layout 'errors/minimal.kreft'
 prop status = 400
 prop title = 'Error'
 prop message = ''

package/templates/errors/{minimal.kreftjs → minimal.kreft}

@@ -1,4 +1,4 @@
-<!-- errors/minimal.kreftjs: the frame every error page uses.
+<!-- errors/minimal.kreft: the frame every error page uses.
      Each page fills it with <kreft-section name="code">, "title" and "message". -->
 <view>
   <main class="error-page">

package/tools/dev-client.js

@@ -1,8 +1,8 @@
 /*
  * Kreft dev client — `kreftjs dev` adds this to every page while you work.
- *   • hot reload: a changed .kreftjs file is swapped in place and keeps its state;
+ *   • hot reload: a changed .kreft file is swapped in place and keeps its state;
  *     a changed .css file is reloaded; anything else reloads the page
- *   • error overlay: .kreftjs mistakes and runtime errors show on the page
+ *   • error overlay: .kreft mistakes and runtime errors show on the page
  *   • DevTools: the "K" button (or Alt+Shift+D) opens the Kreft DevTools panel
  * Not part of your app: `kreftjs build` never includes it.
  */

package/tools/vite-plugin-kreftjs.d.ts

@@ -3,7 +3,7 @@ import type { Plugin } from 'vite';
 export interface KreftPluginOptions {
   /**
    * Include filter pattern (RegExp, glob or string).
-   * @default /\.kreftjs$/
+   * @default /\.kreft$/
    */
   include?: string | RegExp | (string | RegExp)[];
 
@@ -21,7 +21,7 @@ export interface KreftPluginOptions {
   precompile?: boolean;
 
   /**
-   * Enable Hot Module Replacement (HMR) for .kreftjs components while preserving component state.
+   * Enable Hot Module Replacement (HMR) for .kreft components while preserving component state.
    * @default true
    */
   hmr?: boolean;
@@ -29,7 +29,7 @@ export interface KreftPluginOptions {
 
 /**
  * Official Vite plugin for Kreft.
- * Provides compilation of .kreftjs Single File Components, scoped CSS extraction,
+ * Provides compilation of .kreft Single File Components, scoped CSS extraction,
  * route file transformation, and state-preserving Hot Module Replacement.
  *
  * @example
@@ -47,6 +47,4 @@ export function kreftjs(options?: KreftPluginOptions): Plugin;
 /** the earlier name of `kreftjs` */
 export function kreft(options?: KreftPluginOptions): Plugin;
 export function kreftPlugin(options?: KreftPluginOptions): Plugin;
-/** @deprecated the Som.js name of `kreftjs` */
-export function som(options?: KreftPluginOptions): Plugin;
 export default kreftjs;

package/tools/vite-plugin-kreftjs.js

@@ -2,12 +2,12 @@
  * Kreft Vite Plugin
  *
  * Full-featured Vite.js support for Kreft:
- *   • Compiles .kreftjs components into native ES modules
+ *   • Compiles .kreft components into native ES modules
  *   • Scoped CSS (<style scoped>) extracted into Vite virtual CSS modules with instant HMR
- *   • Route files (routes/*.kreftjs) automatically transformed and registered
+ *   • Route files (routes/*.kreft) automatically transformed and registered
  *   • Component HMR preserves live state and reactivity
  *   • Precompiles view expressions ahead of time (zero eval / CSP-safe)
- *   • Automatically resolves and aliases 'kreftjs' (and 'kreft' and 'som', the earlier names)
+ *   • Automatically resolves and aliases 'kreftjs' (and 'kreft', the earlier name)
  *
  * Usage (vite.config.js):
  *   import { defineConfig } from 'vite';
@@ -186,10 +186,10 @@ function scanHtml(html, on) {
 
 /* ------------------------------------------------------------------ the plugin */
 function kreftPlugin(options = {}) {
-  const include = options.include || /\.(?:kreftjs|kreft|som)$/; // .kreft and .som: files of an older project
+  const include = options.include || /\.(?:kreftjs|kreft)$/; // .kreftjs: files of a project from the 0.0.x betas
   const exclude = options.exclude || /node_modules/;
   const precompile = options.precompile !== false;
-  const isComponentFile = (f) => /\.(?:kreftjs|kreft|som)$/.test(f);
+  const isComponentFile = (f) => /\.(?:kreftjs|kreft)$/.test(f);
   const kreftRuntimePath = path.resolve(__dirname, '..', 'kreftjs.js');
 
   const filter = (id) => {
@@ -213,11 +213,11 @@ function kreftPlugin(options = {}) {
       return {
         resolve: {
           alias: [
-            { find: /^(?:kreftjs|kreft|som)$/, replacement: kreftRuntimePath }, // kreft and som: the earlier names
+            { find: /^(?:kreftjs|kreft)$/, replacement: kreftRuntimePath }, // kreft: the earlier name
           ],
         },
         optimizeDeps: {
-          exclude: ['kreftjs', 'kreft', 'som'],
+          exclude: ['kreftjs', 'kreft'],
         },
       };
     },
@@ -277,7 +277,7 @@ function kreftPlugin(options = {}) {
       if (query && query.includes('type=style')) return null;
       if (!filter(filePath)) return null;
 
-      // 1. Route files: routes/web.kreftjs or any .kreftjs file without <view>
+      // 1. Route files: routes/web.kreft or any .kreft file without <view>
       if (!/<view(\s[^>]*)?>([\s\S]*)<\/view>/i.test(code)) {
         const baseName = path.basename(filePath);
         return {
@@ -329,12 +329,12 @@ export default routes;
         const m = stmt.match(/^import\s+(?:([\s\S]+?)\s+from\s+)?(['"])(.+?)\2/);
         if (!m) continue;
         const [, what, , spec] = m;
-        if (/^(?:kreftjs|kreft|som)(\.js)?$/.test(spec)) continue;
+        if (/^(?:kreftjs|kreft)(\.js)?$/.test(spec)) continue;
         if (/\.css(?:[?#].*)?$/i.test(spec)) {
           topImports.push(`import ${JSON.stringify(spec)};`);
           continue;
         }
-        if (/\.(?:kreftjs|kreft|som)$/i.test(spec)) {
+        if (/\.(?:kreftjs|kreft)$/i.test(spec)) {
           topImports.push(`import ${what} from ${JSON.stringify(spec)};`);
           const names = extractImportedNames(what);
           names.forEach((name) => {
@@ -393,7 +393,7 @@ var __def = Kreftjs.__makeDef({
 if (typeof window !== 'undefined' && window.Kreftjs && window.Kreftjs.__registerDef) {
   window.Kreftjs.__registerDef(${JSON.stringify(filePath)}, __def);
   window.Kreftjs.__registerDef(${JSON.stringify(baseName)}, __def);
-  window.Kreftjs.__registerDef(${JSON.stringify(sp.name + '.kreftjs')}, __def);
+  window.Kreftjs.__registerDef(${JSON.stringify(sp.name + '.kreft')}, __def);
 }
 
 if (import.meta.hot) {
@@ -401,7 +401,7 @@ if (import.meta.hot) {
     if (newMod && newMod.default && typeof window !== 'undefined' && window.Kreftjs && window.Kreftjs.__hotDef) {
       window.Kreftjs.__hotDef(${JSON.stringify(filePath)}, newMod.default);
       window.Kreftjs.__hotDef(${JSON.stringify(baseName)}, newMod.default);
-      window.Kreftjs.__hotDef(${JSON.stringify(sp.name + '.kreftjs')}, newMod.default);
+      window.Kreftjs.__hotDef(${JSON.stringify(sp.name + '.kreft')}, newMod.default);
     }
   });
 }
@@ -461,6 +461,4 @@ module.exports = kreftPlugin;
 module.exports.default = kreftPlugin;
 module.exports.kreftjs = kreftPlugin;
 module.exports.kreft = kreftPlugin; // the earlier Kreft name
-module.exports.som = kreftPlugin; // the Som.js names
-module.exports.somPlugin = kreftPlugin;
 module.exports.kreftPlugin = kreftPlugin;

package/templates/app/frontend/routes/web.kreftjs

@@ -1,34 +0,0 @@
-// Application Web Routes.
-// Developers can attach custom auth guards directly: .middleware('auth', 'admin') or custom guards.
-
-// Public Welcome & Showcase Page (shows first with links to Sign Up, Log In, Docs)
-Route.view('/', 'pages/Home.kreftjs').layout('none').name('home').title('Welcome')
-Route.view('/welcome', 'pages/Home.kreftjs').layout('none').name('welcome').title('Welcome')
-
-// Protected Dashboard & management pages (requires signed-in user)
-Route.middleware('auth').group(() => {
-  Route.view('/dashboard', 'pages/Dashboard.kreftjs').name('dashboard').title('Dashboard')
-  Route.view('/users', 'pages/Users.kreftjs').name('users').title('Users')
-  Route.view('/profile', 'pages/Profile.kreftjs').name('profile').title('Profile')
-})
-
-// Authentication routes (pages/auth/), wrapped in guest layout
-Route.layout('guest').group(() => {
-  Route.middleware('guest').group(() => {
-    Route.view('/login', 'pages/auth/Login.kreftjs').name('login').title('Log In')
-    Route.view('/register', 'pages/auth/Register.kreftjs').name('register').title('Register')
-    Route.view('/forgot-password', 'pages/auth/ForgotPassword.kreftjs').name('password.request').title('Forgot Password')
-  })
-  Route.view('/reset-password/:token', 'pages/auth/ResetPassword.kreftjs').name('password.reset').title('Reset Password')
-  Route.view('/verify-email/:id?/:hash?', 'pages/auth/VerifyEmail.kreftjs').name('verification.notice').title('Verify Email')
-  Route.view('/confirm-password', 'pages/auth/ConfirmPassword.kreftjs').name('password.confirm').title('Confirm Password').middleware('auth')
-})
-
-// Documentation (docs/) and test suite (tests/)
-Route.view('/docs', 'docs/Docs.kreftjs').name('docs').title('Documentation').layout('docs')   // its own slim bar, not the dashboard sidebar
-Route.view('/error-monitor', 'pages/ErrorMonitor.kreftjs').name('error-monitor').title('Error Monitor')
-Route.prefix('/tests').name('tests.').group(() => {
-  Route.view('/', 'tests/pages/Test.kreftjs').name('index').title('Test Suite')
-  Route.view('/about', 'tests/pages/About.kreftjs').name('about').title('About · Tests')
-})
-

package/templates/app/frontend/tests/pages/About.kreftjs

@@ -1,12 +0,0 @@
-<!-- /tests/about: a second test page. Add more: a .kreftjs file here, then one line in the routes in index.html. -->
-<view>
-  <section class="page">
-    <h1>About</h1>
-    <p class="lead">Edit <code>tests/pages/About.kreftjs</code> and save: the page updates by itself.</p>
-    <p><kreft-link to="/tests">Back to the test pages</kreft-link></p>
-  </section>
-</view>
-
-<style scoped>
-.page { padding: 40px 0; max-width: 40em; }
-</style>