@lightningjs/blits 2.0.0-beta.1 → 2.0.0-beta.11

package/src/router/router.js

@@ -21,7 +21,7 @@ import { reactive } from '../lib/reactivity/reactive.js'
 import symbols from '../lib/symbols.js'
 import { Log } from '../lib/log.js'
 import { stage } from '../launch.js'
-import Focus from '../focus.js'
+import Focus from '../focus/focus.js'
 import Announcer from '../announcer/announcer.js'
 import Settings from '../settings.js'
 
@@ -30,6 +30,9 @@ import Settings from '../settings.js'
  * @typedef {import('../component.js').BlitsComponent} BlitsComponent - The element of the route
  * @typedef {import('../engines/L3/element.js').BlitsElement} BlitsElement - The element of the route
  *
+ * @typedef {BlitsComponent|BlitsComponentFactory} RouteView
+ * @typedef {RouteView & { default?: BlitsComponentFactory }} RouteViewWithOptionalDefault
+ *
  * @typedef {Object} Route
  * @property {string} path - The path of the route
  * @property {string} hash - The hash of the route
@@ -57,6 +60,7 @@ export const state = reactive(
     data: null,
     params: null,
     hash: '',
+    backNavigation: true,
   },
   Settings.get('reactivityMode'),
   true
@@ -212,12 +216,17 @@ const defaultOptions = {
 }
 
 const makeRouteObject = (route, overrides) => {
+  // FIX: exclude keepAlive from the destination route options. Unlike other
+  // overrides, keepAlive applies to the route being LEFT, not the destination.
+  // It is consumed by removeView() instead.
+  const { keepAlive: _keepAlive, ...destOverrides } = overrideOptions // eslint-disable-line no-unused-vars
+
   const cleanRoute = {
     hash: overrides.hash,
     path: route.path,
     component: route.component,
     transition: 'transition' in route ? route.transition : fadeInFadeOutTransition,
-    options: { ...defaultOptions, ...route.options, ...overrideOptions },
+    options: { ...defaultOptions, ...route.options, ...destOverrides },
     announce: route.announce || false,
     hooks: route.hooks || {},
     data: { ...route.data, ...navigationData, ...overrides.queryParams },
@@ -247,7 +256,7 @@ export const navigate = async function () {
   let reuse = false
   if (preventHashChangeNavigation === false && this[symbols.parent][symbols.routes]) {
     let previousRoute = currentRoute //? Object.assign({}, currentRoute) : undefined
-    let route = matchHash(getHash(document.location.hash), this[symbols.parent][symbols.routes])
+    let route = matchHash(getHash(location.hash), this[symbols.parent][symbols.routes])
 
     currentRoute = route
 
@@ -258,7 +267,11 @@ export const navigate = async function () {
         const hooks = this[symbols.parent][symbols.routerHooks]
         if (hooks.beforeEach) {
           try {
-            beforeEachResult = await hooks.beforeEach.call(this.parent, route, previousRoute)
+            beforeEachResult = await hooks.beforeEach.call(
+              this[symbols.parent],
+              route,
+              previousRoute
+            )
             if (isString(beforeEachResult)) {
               currentRoute = previousRoute
               to(beforeEachResult)
@@ -299,7 +312,11 @@ export const navigate = async function () {
       let beforeHookOutput
       if (route.hooks.before) {
         try {
-          beforeHookOutput = await route.hooks.before.call(this.parent, route, previousRoute)
+          beforeHookOutput = await route.hooks.before.call(
+            this[symbols.parent],
+            route,
+            previousRoute
+          )
           if (isString(beforeHookOutput)) {
             currentRoute = previousRoute
             to(beforeHookOutput)
@@ -335,10 +352,15 @@ export const navigate = async function () {
           return
         }
       }
+
       // add the previous route (technically still the current route at this point)
       // into the history stack when inHistory is true and we're not navigating back
+      //
+      // FIX: use truthy check instead of `!== undefined` because matchHash()
+      // can return `false`, which survives `!== undefined` but has no `.options`.
       if (
-        previousRoute !== undefined &&
+        previousRoute &&
+        previousRoute.options &&
         previousRoute.options.inHistory === true &&
         navigatingBack === false
       ) {
@@ -354,6 +376,7 @@ export const navigate = async function () {
       /** @type {import('../engines/L3/element.js').BlitsElement} */
       let holder
 
+      /** @type {RouteViewWithOptionalDefault|undefined|null} */
       let view
       let focus
       // when navigating back let's see if we're navigating back to a route that was kept alive
@@ -397,7 +420,7 @@ export const navigate = async function () {
       // Update router state after announcements and final route resolution,
       // right before initializing or restoring the view
       state.path = route.path
-      state.params = route.params || {}
+      state.params = Object.keys(route.params).length === 0 ? null : route.params
       state.hash = route.hash
       state.data = null
       state.data = route.data || {}
@@ -479,12 +502,13 @@ export const navigate = async function () {
 
       // apply out out transition on previous view if available, unless
       // we're reusing the prvious page component
-      if (previousRoute !== undefined && reuse === false) {
+      // FIX: truthy guard — previousRoute can be `false` (see history-push comment above).
+      if (previousRoute && reuse === false) {
         // only animate when there is a previous route
         shouldAnimate = true
         const oldView = this[symbols.children].splice(1, 1).pop()
         if (oldView) {
-          removeView(previousRoute, oldView, route.transition.out, navigatingBack)
+          await removeView(previousRoute, oldView, route.transition.out, navigatingBack)
         }
       }
 
@@ -492,7 +516,7 @@ export const navigate = async function () {
       if (route.transition.in) {
         if (Array.isArray(route.transition.in)) {
           for (let i = 0; i < route.transition.in.length; i++) {
-            i === route.transition.length - 1
+            i === route.transition.in.length - 1
               ? await setOrAnimate(holder, route.transition.in[i], shouldAnimate)
               : setOrAnimate(holder, route.transition.in[i], shouldAnimate)
           }
@@ -500,6 +524,33 @@ export const navigate = async function () {
           await setOrAnimate(holder, route.transition.in, shouldAnimate)
         }
       }
+
+      if (this[symbols.parent][symbols.routerHooks]) {
+        const hooks = this[symbols.parent][symbols.routerHooks]
+        if (hooks.afterEach) {
+          try {
+            await hooks.afterEach.call(
+              this[symbols.parent],
+              route, // to
+              previousRoute // from
+            )
+          } catch (error) {
+            Log.error('Error in "AfterEach" Hook', error)
+          }
+        }
+      }
+
+      if (route.hooks.after) {
+        try {
+          await route.hooks.after.call(
+            this[symbols.parent],
+            route, // to
+            previousRoute // from
+          )
+        } catch (error) {
+          Log.error('Error or Rejected Promise in "After" Hook', error)
+        }
+      }
     } else {
       Log.error(`Route ${route.hash} not found`)
       const routerHooks = this[symbols.parent][symbols.routerHooks]
@@ -509,6 +560,12 @@ export const navigate = async function () {
     }
   }
 
+  // Clear module-level variables after removeView has consumed them.
+  // Placed here so it executes for all navigation flows, not only when
+  // previousRoute exists and reuse is false.
+  overrideOptions = {}
+  navigationData = {}
+
   // reset navigating indicators
   navigatingBack = false
   state.navigating = false
@@ -536,11 +593,18 @@ const removeView = async (route, view, transition, navigatingBack) => {
     }
   }
 
+  // Resolve effective keepAlive: runtime override from $router.to() takes precedence
+  // over the static route config option
+  const keepAlive =
+    overrideOptions.keepAlive !== undefined
+      ? overrideOptions.keepAlive
+      : route.options && route.options.keepAlive
+
   // cache the page when it's as 'keepAlive' instead of destroying
   if (
     navigatingBack === false &&
     route.options &&
-    route.options.keepAlive === true &&
+    keepAlive === true &&
     route.options.inHistory === true
   ) {
     const historyItem = history[history.length - 1]
@@ -555,7 +619,7 @@ const removeView = async (route, view, transition, navigatingBack) => {
    * 2. Navigating back, and the previous route is configured with "keep alive" set to true.
    * 3. Navigating back, and the previous route is not configured with "keep alive" set to true.
    */
-  if (route.options && (route.options.keepAlive !== true || navigatingBack === true)) {
+  if (route.options && (keepAlive !== true || navigatingBack === true)) {
     view.destroy()
     view = null
   }
@@ -585,11 +649,11 @@ const setOrAnimate = (node, transition, shouldAnimate = true) => {
   })
 }
 
-export const to = (location, data = {}, options = {}) => {
+export const to = (path, data = {}, options = {}) => {
   navigationData = data
   overrideOptions = options
 
-  window.location.hash = location
+  location.hash = path.replace(/^#/, '')
 }
 
 export const back = function () {

package/vite/inject-dev-config.js

@@ -1,3 +1,20 @@
+/*
+ * Copyright 2025 Comcast Cable Communications Management, LLC
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ *
+ * SPDX-License-Identifier: Apache-2.0
+ */
+
 export default function injectDevFlag() {
   return {
     name: 'inject-dev-config',

package/vite/preCompiler.js

@@ -32,12 +32,22 @@ export default function () {
 
       // we should only precompile .blits, .js and .ts files
       if (
-        fileExtension === '.js' ||
-        fileExtension === '.ts' ||
-        fileExtension === '.blits' ||
-        fileExtension === '.mjs'
+        filePath.indexOf('node_modules') === -1 &&
+        (fileExtension === '.js' ||
+          fileExtension === '.ts' ||
+          fileExtension === '.blits' ||
+          fileExtension === '.mjs')
       ) {
-        return compiler(source, filePath, config.mode)
+        const result = compiler(source, filePath, config.mode)
+
+        if (typeof result === 'object') {
+          return {
+            code: result.code,
+            map: result.map,
+          }
+        }
+        // No transformation needed - return null so Vite knows no changes were made
+        return null
       }
 
       // vite expects null if there is no modification