Releases: starfederation/datastar
v1.0.0-RC.6
This release contains a syntax change to attributes that must be addressed manually before updating.
The recommended CDN link for Datastar is now version-locked to ensure safer updates and to avoid serving outdated cached files:
<script type="module" src="https://cdn.jsdelivr.net/gh/starfederation/[email protected]/bundles/datastar.js"></script>
Breaking changes:
- The attribute key delimiter has been changed from
-to:(data-signals-foobecomesdata-signals:foo,data-on-clickbecomesdata-on:click, etc.), as allowed by the HTML Standard. The following regular expression can be used to update attributes.- Search:
data-(?!(on-(intersect|interval|load|raf|resize|signal-patch|signal-patch-filter)(_|=)))(attr|bind|class|computed|indicator|on|persist|ref|signals|style)- - Replace:
data-$4:
- Search:
- Renamed the
data-on-loadattribute todata-init. - Renamed
.trailand.notrailmodifier arguments to.trailingand.notrailingrespectively. - Removed file upload progress monitoring from Datastar Pro, which had limited browser support. It is recommended to use a file upload library instead, or wait for Rocket which will include a file upload web component. (#1049)
- Fetch requests are now cancelled when the element that initiated them is removed from the DOM. (#1045)
- The
data-bindattribute on an input with typefilenow only creates one signal instead of{signalName},{signalName}Names, and{signalName}Mimes. The resultant type of the signal is{name: string, contents: string, mime: string}[]. (#1041) - Camel casing no longer capitalizes after a number, and kebab casing now only preserves what was written in the attribute key (
data-signals:a2b--foo__case.kebabmakes$a2b--fooinstead of$a-2-b-foo). (#1030)
Non-breaking changes:
- Datastar now supports all browsers that have support for ES2021. (#1037)
- Added support for using object syntax with the
data-computedattribute. (#1053) - The
data-indicatorattribute now sets the signal tofalseeven if the signal has already been defined. - Fetch requests now respect URIs provided by a
basetag. (#1047) - Form fields are no longer validated if a
novalidateattribute exists on theformtag. (#1056) - Setting a signal to
nullorundefinednow actually deletes the signal. (#1058) - Attributes can now be used on the
htmlelement. - Attribute keys and aliases can now start with a non-letter (
data-signals:1fooordata-on:-foo). (#1030) - Fixed a bug in
data-bindwhen using namespaced signals as arrays. - Fixed a bug resulting in
data-ignore__selfnot being applied. (#1064) - Fixed a bug preventing the
__debounce.leadingmodifier from working. - Fixed a bug preventing the combination of
__debounceand__viewtransitionmodifiers from working. - Fixed a bug when using
autorequest cancellation where theFINISHEDfetch event would fire after theSTARTEDfetch event of the cancelling request.
v1.0.0-RC.5
- The
data-on-*attribute no longer requires that theisTrustedproperty on the event istruefor an expression to be executed. - The
data-on-loadattribute no longer wraps the expression insetTimeoutwhen no delay is provided. - Changed the
filterSignalsoption in the backend actions to maintain the defaultincludeandexcludevalues if only one or the other is provided. - Fixed a bug in which setting the length of an array signal would cause errors when trying to access an element of the array.
- Fixed a bug in which
data-query-stringwould merge in the path of the object rather than the object itself. - Removed the
__trustedmodifier.
v1.0.0-RC.4
- Fixed a bug in which an input element being morphed would not have its value updated.
v1.0.0-RC.3
This release packs some new features, cleans up data-bind behavior, and fixes a rake of minor bugs.
- Added support for patching
html,head, andbodyelements. - Added support for patching arbitrary fragments into the DOM given a selector is provided.
- Added support for passing include and exclude filters in as strings.
- Added a
__filtermodifier todata-query-stringthat filters out empty values when syncing signals to query string params. - When a signal is predefined, its
typeis now preserved during binding – whenever the element’s value changes, the signal value is automatically converted to match the original type. - Custom keys in
data-persistare now added asdata-persist-mykey, and the__keymodifier has been removed. - Numeric signal names are now correctly parsed.
- Fixed a regression in which
data-attrvalues were not being JSON encoded. - Fixed a bug in which
data-textanddata-json-signalswould not reapply themselves after their text was changed. - Fixed a bug in which attributes that had a prefix with the same length as the alias would not be ignored (e.g.
data-option-loadwould be applied ason-load). - Fixed a bug in which the
retries-failedevent was namedretrying. - Fixed a bug in which the
removemode would fail when patching elements if no elements were provided. - Fixed a bug in which
data-classwould enter an infinite loop if there were multiple such attributes on the same element. - Fixed a bug in which attribute plugins on child elements were not cleaned up when removed.
- Removed support for using the ID of a provided element as a selector for the
removemode when patching elements. - Changed the behavior of how input values are diffed when morphed:
| Old input value | New input value | Behavior |
|---|---|---|
null |
null |
preserve old input value |
| some value | the same value | preserve old input value |
| some value | null |
set old input value to "" |
null |
some value | set old input value to new input value |
| some value | some other value | set old input value to new input value |
v1.0.0-RC.2
- Added a
data-styleattribute that sets the value of inline CSS styles on an element based on an expression, and keeps them in sync. - Added a
requestCancellationoption to backend actions that controls request cancellation behavior. - Fixed a bug in which indicator signals were not being set to
falseafter atext/htmlresponse completed. - Fixed a bug in which a duplicate
text/event-streamentry was being added to theAcceptheader in SSE actions. - Fixed a bug in which assigning a computed to an already existing signal would create a signal of a computed instead of a computed.
- Fixed a bug in which using
data-attrwith a key would observe the result of the expression rather than the key. - Fixed a bug in which signal names were being incorrectly parsed in some edge-cases.
- Renamed the
datastar-sseevent todatastar-fetch.
v1.0.0-RC.1
Some plugins are now available under Datastar Pro, which adds functionality to the the free open source Datastar framework. These plugins are available under a commercial license that helps fund our open source work.
Of the many changes listed below, one major feature is that objects in signals are now reactive! This means that you can now create complex data structures in signals, and any changes to these objects will automatically propogate to expressions.
SSE event handling has also changed, in addition to all of the SDKs. Please refer to the SSE docs and each of the SDKs for the correct syntax to use.
- Objects in signals are now reactive, meaning that any changes to these objects will automatically propogate to expressions.
- Plugins are now reapplied on morph only if their values/keys/modifiers have changed.
- Added the ability for Datastar to receive
text/html,application/json, andtext/javascriptcontent types, that patch elements, patch signals, and execute JavaScript respectively. - Added a
data-effectattribute that executes an expression when any of the signals it references change. - Added a
data-ignore-morphattribute to thePatchElementswatcher that skips morphing the respective element and its children. - Added a
data-json-signalsattribute that sets the text content of an element to a reactive JSON stringified version of all signals. - Added a
data-on-signal-patchattribute that executes an expression when a signal patch takes place. - Added a
data-on-signal-patch-filterattribute for filtering the signals that cause the expression indata-on-signal-patchto be executed. - Added a
data-preserve-attrattribute that preserves the client side state of an attribute through a morph. - Added a
data-on-resizeattribute (PRO) that attaches a ResizeObserver to the element, and executes the expression each time the element’s dimensions change. - Added a
data-query-stringattribute (PRO) that syncs the query string with signal values, including optional history support. - Added a
datastar-upload-progressevent (PRO) for monitoring file upload progress. - Added a
filterSignalsoption to SSE actions that filters the signals send to the backend based on include and exclude regular expressions. - Added a
__trustedmodifier to thedata-onattribute, which runs the expression even if theisTrustedproperty on the event isfalse. - Added automatic request cancellation for SSE actions - when a new request is initiated on an element, any existing request on that same element is automatically cancelled.
- Removed the
abortoption from SSE actions as request cancellation is now handled automatically at the element level. - The URL passed into SSE actions (
@get,@post, etc.) is now treated as a relative URI. - The default
Content-Typeheader sent withformrequests is nowapplication/x-www-form-urlencoded. - The value of a clicked button element is now included in the request when using the
formcontent type. - The
data-star-ignoreattribute has been renameddata-ignore. - The
data-attrattribute now renderstrueas""instead of"true"(e.g.checked=""instead ofchecked="true"). - The
data-attrattribute now preserves the string literals"false","null", and"undefined"when using a key. - Fixed a bug when using the
__debounce.leadingmodifier with thedata-onattribute. - Removed the
data-on-signal-changeattribute. Use the newdata-on-signal-patchattribute instead. - Removed the
datastar-signal-changeevent. Use the newdatastar-signal-patchevent instead. - Removed the
includeLocaloption in backend action requests. Use thefilterSignalsoption instead. - Removed the variable
ctxfrom data attributes. Use the newelvariable to access the element the attribute is attached to, use the new$variable to access the signal root, or the newdata-json-signalsattribute to output all signals. - Removed support for adding a dollar sign prefix to signal names in the value of the
data-bind,data-ref, anddata-indicatorattributes. - Removed the auto generated IDs that were assigned to elements using data attributes.
Changes to SSE Event Handling
- Renamed the
datastar-merge-fragmentsanddatastar-merge-signalsSSE events todatastar-patch-elementsanddatastar-patch-signalsrespectively. - Renamed the
mergeModeparameter of thedatastar-patch-elementsSSE event tomode. - Renamed the
morphmode toouter. - Renamed the
outermode toreplace. - The
innermode now morphs the element’s inner HTML. - Removed the
upsertAttributesmode. - Added the
removemode. - The
datastar-patch-signalsSSE event now patches (adds/updates/removes) signals according to the JSON Merge Patch RFC 7396. - Removed the
RemoveFragments,RemoveSignals, andExecuteScriptwatchers.
v1.0.0-beta.11
This release adds wildcard support to data-on-signals-change-*, data-persist, @setAll and @toggleAll using * to match a single path segment and ** to match multiple path segments. Note that this does mean a potentially breaking change if you were relying on path prefixes.
The beta phase is now officially unofficially over, and the next release should be v1.0.0 🚀
Added
- Added the
__debounce,__throttleand__viewtransitionmodifiers todata-on-intersect. - Added the
__debounce,__throttleand__viewtransitionmodifiers todata-on-signal-change. - Added the
__viewtransitionmodifier todata-on-interval. - Added the
__viewtransitionmodifier todata-on-load. - Added the
__viewtransitionmodifier todata-on-raf.
Changed
- The
datastar-sseevent is now dispatched on thedocumentelement, and usingdata-on-datastar-sseautomatically listens for the event on thedocument(#802). - The
data-on-signals-change-*attribute key now accepts a path in which*matches a single path segment and**matches multiple path segments (data-on-signals-change-foo.*.baz,data-on-signals-change-foo.**). - The
data-persistattribute now accepts one or more space-separated paths in which*matches a single path segment and**matches multiple path segments (data-persist="foo.*.baz",data-persist="foo.**"). - The
@setAllaction now accepts one or more space-separated paths in which*matches a single path segment and**matches multiple path segments (@setAll('foo.*.baz', true),@setAll('foo.**', true)) (#793). - The
@toggleAllaction now accepts one or more space-separated paths in which*matches a single path segment and**matches multiple path segments (@toggleAll('foo.*.baz'),@toggleAll('foo.**')) (#793).
v1.0.0-beta.10
We’ve taken the opportunity to button up the API in preparation for the stable v1 release 🚀
Take note of the renamed attributes and the removal of the ability to use a key with data-persist.
data-intersects → data-on-intersect
data-on-signals-change → data-on-signal-change
data-persist-* → data-persist
Added
- Added a
retries-failedevent type that is dispatched when the SSE plugin fails after retrying (#785).
Changed
- Updated Idiomorph to version 0.7.3.
- Renamed the
data-intersectsattribute todata-on-intersect. - Renamed the
data-on-signals-changeattribute todata-on-signal-change. - Classes used in
data-class-*attributes now default to kebab-case (#761). - Events used in
data-on-*attributes now default to kebab-case (#761). - The
datastar-sseevent is now dispatched on the element itself (#761). - The NPM package now also exports all plugins and bundles (#742).
- Data attributes with plugin names in their prefix are no longer processed (#771).
- The alias used in the aliased bundle has been renamed to
star(data-star-*) (#772).
Fixed
- Fixed the applying of plugins to give custom plugins a chance to load (#740).
- Fixed a bug in which the indicator signal was not being reset when the element it was on was removed from the DOM (#749).
- Fixed a bug in which merging multiple targets was not working correctly (#780).
Removed
- Removed the ability to use a key with the
data-persistattribute. - Removed settling from SSE events, which has become redundant (#764).
v1.0.0-beta.9
Added
- Added the ability for all input elements to set bound signals to an array of values by predefining the signal as an array.
Fixed
- Fixed a bug in which
data-signalswas being reapplied each time any attribute changed on an element (#709). - Fixed a bug in which focus was not being restored to input elements after merging fragments (#710).
- Fixed a bug in which the
__delaymodifier was being ignored (#720). - Fixed a bug in which signals bound to text input elements with a
valueattribute were being reset to the value when the entered value was empty.
v1.0.0-beta.8
Added
- Added the ability for checkbox input elements to set bound signals to an array of values by predefining the signal as an array (#664).
Changed
- Updated Idiomorph to version 0.7.2.
- When using
data-bindon an element, the signal value now defaults to the element’svalueattribute, provided the signal has not already been defined (#687). - The expression passed into
data-on-signals-changeis no longer executed on page load (#682). - Whitespace is now maintained in merged fragments (#658).
- Attribute plugins now define a hash of their contents, preventing duplicate applies (#691).
- Attribute plugins are now applied to the
htmlelement instead of thebodyelement (#691).
Fixed
- Fixed a bug in which
datastar-remove-fragmentsevents were not having any effect (#664). - Fixed a bug in which
datastarNaNcould be used as an auto-generated element ID (#679). - Fixed a bug in which
data-attrwas not removing the element attribute when using object syntax and the value wasfalse(#693).
Removed
- Removed the Datastar class. The
apply,load, andsetAliasfunctions are exported instead.