Foundation for Edge 6

This release contains some breaking changes, but alongside a migration plugin that makes Edge 6 works like Edge 5.

New features

• Edge is twice as fast in rendering a template.
• Add let tag. Let tag can be used for adding inline variables. It is a replacement for the existing @set tag.
• Add an assign tag to re-assign value to a pre-existing variable.
• Add an eval tag to evaluate JavaScript expressions without writing their result to the output.

Breaking changes

• Package is ESM only
• Removed support for layouts and sections. They were badly implemented, and components serve as a better mental model for implementing layouts.
• Removed set tag. Instead, use the let tag. Learn more
• Changes to components props API. Learn more
• Removed many global methods. Learn more

Compatibility plugin

You can get the newer version of Edge 6 to work like Edge 5 by registering the following plugin. AdonisJS will include this plugin by default.

import { migrate } from 'edge.js/plugins/migrate'
edge.use(migrate)

Component Props

The components props have been changed completely, and methods like serialize and serializeExcept no longer exist. Instead, you can use the toAttrs method.

Note: The compatibility plugin allows using the old API

- $props.serialize()
- $props.serializeExcept(['text'])
- $props.serializeOnly(['class'])

+ $props.toAttrs()
+ $props.except(['text']).toAttrs()
+ $props.only(['class']).toAttrs()

Remove the set tag in favor let tag.

The set tag was complex, as it did too many things together. You can use it to define an inline variable, update its value, and update the property of an existing object.

We have removed it in favor of the let tag. The let tags work exactly as JavaScript let declaration. You can also use the let tag to destructure values, which was impossible with the set tag. For example:

- @set('username', user.username)

+ @let(username = user.username)
+ @let({ username } = user)

Re-assigning value to an existing variable

- @set(user, 'username', user.username.toUpperCase())

+ @assign(user.username = user.username.toUpperCase())

For more complex operations, you can use the eval tag.

@eval(user.users.push(newUser()))
@eval(user.users = user.users ? user.users.concat(newUser()) : [newUser()])

Removal of global methods

• Remove the raise method. It was never documented and neither used.
• Remove the e method in favor of html.escape.
• Remove the stringify method in favor of js.stringify.
• Remove the safe method in favor of html.safe.

Commits

• refactor: use object spread over Object.assign a793513
• feat: add support for URLs for view directory path 2384d8e
• test: use stringEqual over assert.equal 5142648
• test: add another test for let tag 8cca7d7
• feat: add assign tag a76e7ac
• refactor: implement let tag 5383d69
• refactor: cleanup components cruft and add eval tag 0d94e30
• feat: export migrate plugin and globals becc849
• refactor: do not stringify x-data bd7387f
• refactor: move legacy primitives under migrate plugin 1c78d1e
• feat: add support for serializing html attributes fdb5e3c
• refactor: edge api and globals registration logic 311be7d
• refactor: re-arrange source code files 0df85e6
• style: update license docblock 55dbbc1
• refactor: cleanup and allow @Inject tag to use functions 21a53ef
• refactor: cleanup and performance improvements c3adc4f
• chore: update dependencies 5ca1e06

v6.0.0-1...v6.0.0-2