surface v0.5.0 Release Notes
Release Date: 2021-06-17 // almost 3 years ago-
- Add
<:slotname>
shorthand for<#template slot="slotname">
- Introduce block expressions for surface templates (e.g.,
{#if}..{/if}
) - Introduce
{#if}
block expression with support for{#elseif}
and{#else}
sub blocks - Introduce
{#for}
block expression with support for{#else}
sub block - Introduce
{#unless}
block expression - Introduce new shorthand notation for dynamic attributes/props using the
{... }
tagged expression - Introduce new shorthand notation for attribute assignment using the
{= }
tagged expression - Support private comments using
{!-- --}
for comments that are not supposed to hit the browser - Introduce
s-
prefix as an alternative to:
for directives (i.e.s-if
and:if
are now equivalent) - Introduce
:values
directive for generating multiplephx-value-
attributes - Added a convert task to aid migrating to the new syntax
- Evaluate literal attribute values at compile time instead of runtime
- Fix compile error when using single quotes as attribute value delimiters
- Add
quote_surface/2
macro to generate Surface AST from template snippets.
💥 Breaking Changes
- Replace the sigil
~H
with~F
to avoid conflict withHEEx
- Replace interpolation delimiters
{{
and}}
with{
and}
- Remove support for interpolation inside
<style>...</style>
and<script>...</script>
nodes - ErrorTag: Renamed prop
phx_feedback_for
tofeedback_for
- Slot directive
:props
has been renamed to:args
- Option
:props
for theslot/2
macro has been renamed to:args
- The use of
<template>
has been removed in favor of<#template>
- The use of
<slot>
has been removed in favor of<#slot>
- The use of
<If>
has been removed in favor of{#if}...{/if}
- The use of
<For>
has been removed in favor of{#for}...{/for}
MacroComponent.eval_static_props!/3
evaluates and returns only props with optionstatic: true
🗄 Deprecations
- Support for passing non-string attribute values as literals (i.e.
selected=true
ortabindex=3
) has been removed. Any non-string value should be passed as an expression (i.e.selected={true}
)
- Add