Skip to content

7.0.0

Choose a tag to compare

View all tags
@rehhouari rehhouari released this 11 Apr 16:03
· 63 commits to main since this release
7.0.0
5814303

7.0.0 - 2025-04-11

This is release contains a major overhaul to the codebase, code structure and quality improvements, and better Tyepscript support. Therefore, 7.0 contains some changes to the way you use Pinecone Router which are documented in detail below.

Also, with this release, I've sunset the Middlewares feature which proved to be not as useful as I thought it would be long back in 2021!. Their purpose has been very well accomplished with handlers for a while now, but only now did I really give it the thought to make such a decision.

I continue to support Pinecone Router within my capacities, and this refactor will let me have easier time finding the issues as they come up, and implement more features if needed. And hopefully even make it less intimidating for contributors to do so as well!

Added

  • Added $params magic helper.

  • Added $history magic helper to access history related methods and properties.

  • Added support for multiple-child templates.

    • You can include as many root elements inside the template file as you want.

  • Added support for multiple scripts inside the template.

  • Added support for params in template urls (interpolation) for routes added programmatically

  • Added ability to name routes with the x-route:name="..." syntax. See: Named Routes

  • Added Settings.preload to enable preloading all templates.

  • Added proper priority option to preloading requests, they are now of 'low' priority rather than the previous default of 'high'.

  • Preloading now waits for the first page to be fully rendered before starting.

  • Added reactive PineconeRouter.loading boolean property set to true when loading.

  • Added an AbortController passed to handlers, for better experience.

  • You can now pass data to the next handler by simply returning it.

  • Added a HandlerContext.data field inside the context object passed to handlers, which includes the returned data by the previous handler, if any.

  • Added support for extension param modifier:

  • Settings.basePath is now automatically added to the route path.

    • This means if you set the basePath to /parent, you can now just write x-route="/" and x-route="/about" rather than x-route="/parent" and x-route="/parent/about".

  • Settings.basePath is now automatically added to the template URLS.

  • Added proper Typescript types for all parts of the router.

  • Added unit tests for some parts of the router using Bun.

Changed

  • Instead of providing the context object, $router now does what it says and provides PineconeRouter object .

  • inline templates now must use an empty x-template directive.

    • This also support x-template.target.
    • This change was made to separate template code from x-route, although it was handy, this change results in cleaner and more concise code.

  • Context.route is now a Route object instead of a Route.path string.

  • Changed PineconeRouter.settings from a Settings object to a function that returns the Settings object and takes Partial<Settings> object in order to configure. See more

  • During navigation—ie while handlers are being executed—the global context object wont be updated until the handlers are finished.

    • This means handlers must now use the provided context object, if they didn't before for whatever reason.

  • The navigation methods navigate|back|forward etc. are no longer part of the context object.

    • Instead use $router.navigate, this.$router.navigate, window.PineconeRouter.navigate, or Alpine.$router.navigate etc.

  • Renamed Settings.templateTargetId to Settings.targetID

  • Renamed RouteOptions.templateTargetId to RouteOptions.targetID.

  • Renamed Settings.interceptLinks to Settings.handleClicks to clearly represent what it does.

  • Templates will not be automatically hidden until the handlers are done, meaning the previous template will stay visible while next route's handlers are running.

    • This means you will not get an empty page while loading a page with async handlers.

  • Context.navigationStack and Context.navigationIndex are now PineconeRouter.history.entries and PineconeRouter.history.index respectively. See docs.

  • Navigation stack and index will only be updated after the handlers have finished executing successfuly.

  • In case of handlers canceling or redirecting, the stack wont be updated.

    • This prevents being stuck when going back() to a path that redirects to the current one.

  • Renamed the events pinecone-start, pinecone-end, and fetch-error into pinecone:start, pinecone:end, and pinecone:fetch-error respectively.

  • loading start and end events (above), are now always dispatched regardless if there are handlers/templates or not (alwaysSendLoadingEvents by default).

  • No longer passes the hash portion when navigating using normal mode

    • ie. if you're on /home and click an anchor link to '#tab1', then clicking a link to '/profile' after wont take you to '/profile#tab1' anymore.

  • Switched from pnpm/esbuild/node to bun for package management, bundling, and testing.

Removed

  • Removed redirect method, as it's no longer needed now that all navigation requests now cancel handlers in progress, for example navigate().
  • Removed Context.query and Context.hash, as they aren't useful since you can get them using window.location.search and window.location.hash respectively.
  • Removed inline templates support from x-route in favor of inline x-template.
  • Removed Settings.alwaysSendLoadingEvents, it is now default and unchangable.
  • Removed internal properties from the PineconeRouter object which weren't supposed to be accessed or modified by the end user. These properties weren't documented besides from code and now they no longer polute the public API.

Fixed

  • All navigation requests now cancel ongoing handlers, including back() and forward().
  • Trailing slashes are now properly always ignored by default.
  • Routes that share the same x-template value—ie. the same template urls—used to be ignored after the first one, this can now be solved by adding a unique id to the template elements.
  • Fixed a bug where x-effect/$watch callback inside a template still run after the route changes due to the global context updating prematurely (fix #62).
  • Fixed browser back and forth navigation not always always work (#16)
  • Fixed query being used as part of the path on initial load.
  • Fixed Context.path being empty on init (fixes #67).
Assets 2
Loading